@charset "UTF-8";

/* ----------------------------------
 ギフト・フードTOPページ
---------------------------------- */
#gift:has(#ocyugen) .block-category-slider { padding-bottom: 20px;}
[data-browse-mode="S"] .block-category-slider + .block-top-event--goods { padding-bottom: 0;}

/* お中元・夏ギフト2026おすすめ特集 */
#gift #ocyugen {
	min-height: 680px;
	padding: 120px 0 40px;
	margin: 0 0 40px;
	background-color: transparent;
	background-image: url("../../../img/usr/category/10101/summer_gift_bg.png");
	background-repeat: no-repeat;
	background-position: center top;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	box-sizing: border-box;
}
#gift #ocyugen .block-section-title { margin: 0 0 40px; display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 16px;}
#gift #ocyugen .block-section-title::before { display: none;}
#gift #ocyugen .block-section-title .main { font-family: "Noto Serif JP", serif; font-size: 38px; font-weight: 700; color: #19597D;}
#gift #ocyugen .block-section-title .sub { font-family: "Noto Serif JP", serif; font-size: 23px; font-weight: 400; letter-spacing: 0.05em; color: #000;}
#gift #ocyugen .block-category-feature { padding: 0 0 40px;}
#gift #ocyugen .block-top-event--goods { display: none !important;}

@media screen and (max-width: 1400px) {
	#gift #ocyugen {
		-webkit-background-size: auto 100%;
		background-size: auto 100%;
	}
}

[data-browse-mode="S"] #gift #ocyugen {
	min-height: auto;
	padding: 40px 0;
	margin: 0 0 20px;
	background-image: url("../../../img/usr/category/10101/summer_gift_bg_sp_l.png?a");
	-webkit-background-size: 100% auto !important;
	background-size: 100% auto !important;
}
[data-browse-mode="S"] #gift #ocyugen .block-section-title .main { font-size: 35px;}
[data-browse-mode="S"] #gift #ocyugen .block-section-title .sub { font-size: 20px;}
[data-browse-mode="S"] #gift #ocyugen .block-category-feature--lists { margin: 0 20px;}
[data-browse-mode="S"] .page-category #gift #ocyugen .block-top-event--goods { padding-bottom: 0;}

/* GIFT/FOOD導線 */
#gift .block-category-search-pickup { margin: 0 0 60px;}
#gift .block-category-search-pickup-list { display: flex; justify-content: center; align-items: center; gap: 40px;}
#gift .block-category-search-pickup-list li { width: 420px;	border: #EE7F8B 2px solid; border-radius: 10px; position: relative;}
#gift .block-category-search-pickup-list li a {
	width: 100%;
	height: 100%;
	padding: 18px 42px 18px 18px;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	overflow: hidden;
	transition: 0.3s;
}
#gift .block-category-search-pickup-list li a::before {
	content: '';
	width: 42px;
	border-left: #EE7F8B 2px solid;
	height: calc(100% + 4px);
	border-radius: 0 10px 10px 0;
	display: block;
	box-sizing: border-box;
	background: #DF0B22;
	position: absolute;
	top: -2px;
	right: -2px;
	bottom: -2px;
	z-index: 2;
}
#gift .block-category-search-pickup-list li a::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: #FFF 2px solid;
  border-top: #FFF 2px solid;
  position: absolute;
  right: 16px;
  top: calc(50% - 5px);
  display: block;
  transform: rotate(45deg);
	z-index: 3;
}
#gift .block-category-search-pickup-list li a:hover { opacity: 0.7;}
#gift .block-category-search-pickup-list li figure { width: 77px; height: 77px; padding: 16px; border: #DF0B22 2px solid; border-radius: 77px; overflow: hidden; box-sizing: border-box;}
#gift .block-category-search-pickup-list li .desc { width: calc(100% - 77px - 16px);}
#gift .block-category-search-pickup-list li .desc .name { margin: 0 0 6px; font-size: 27px; font-weight: 500; line-height: 1.2; color: #DF0B22;}
#gift .block-category-search-pickup-list li .desc .text { font-size: 17px; font-weight: 500; color: #707070;}

[data-browse-mode="S"] #gift .block-category-search-pickup { margin: 0 0 30px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list { margin: 0 40px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list { flex-direction: column; gap: 15px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li { width: 100%;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li a { padding: 12px 42px 12px 12px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li figure { width: 60px; height: 60px; padding: 12px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li .desc { width: calc(100% - 60px - 12px);}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li .desc .name { margin: 0 0 4px; font-size: 22px;}
[data-browse-mode="S"] #gift .block-category-search-pickup-list li .desc .text { font-size: 14px;}
[data-browse-mode="S"] #gift .block-category-search-pickup + .block-top-event--goods { padding-bottom: 0;}

/* RANKING ランキング */
#gift div.block-category-ranking { padding-top: 60px; background: #FFFBC4;}
#gift div.block-category-ranking .block-section-title { 
	padding: 40px 0 0;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	font-size: 30px;
	font-weight: 700;
	color: #000;
	gap: 10px;
}
#gift div.block-category-ranking .block-section-title::before { 
	content: '';
	width: 40px;
	height: 30px;
	margin: 0 auto;
	display: block;
	background-color: transparent;
	background-image: url("../../../img/usr/category/10101/icon_ranking.png");
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	position: absolute;
	top: 0;
	left: calc(50% - 20px);
	order: 1;
}
#gift div.block-category-ranking .block-section-title .josefin { font-size: 11px; font-weight: 400; text-align: center; letter-spacing: 0.1em; color: #C4BD5D; order: 3;}
#gift div.block-category-ranking .block-category-ranking-items { margin-right: 60px;}
#gift div.block-category-ranking .block-category-ranking-items:last-child { margin-right: 0;}
#gift div.block-category-ranking .block-category-ranking-list { justify-content: center;}

[data-browse-mode="S"] #gift div.block-category-ranking { padding-top: 40px;}
[data-browse-mode="S"] #gift div.block-category-ranking .block-section-title { margin-bottom: 5px;}
[data-browse-mode="S"] #gift div.block-category-ranking .block-category-ranking-items { margin-right: 10px;}
[data-browse-mode="S"] #gift div.block-category-ranking .block-category-ranking-items:last-child { margin-right: 0;}
[data-browse-mode="S"] #gift div.block-category-ranking .block-category-ranking-list { justify-content: flex-start;}