@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@700;900&display=swap");
/* =============================================
共通
============================================= */
#d_container .wrap {
  width: 100%;
}
#d_topic_path {
  width: 990px;
  margin: 0 auto 20px;
} 


#sweets202305 {
  text-align: center;
  margin: 0 auto;
  padding: 0;
  list-style: none; }
  #sweets202305 * {
    box-sizing: border-box; }
  #sweets202305 a {
    text-decoration: none; }
  #sweets202305 .link-hover {
    text-decoration: none;
    transition: .4s; }
  #sweets202305 .link-hover:hover {
    opacity: .7;
    cursor: pointer; }

  #sweets202305 .section {
    margin-bottom: 70px; }

  #sweets202305 .section:last-child {
    margin-bottom: 0; }

#sweets202305 .container {
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 110px;
    width: 990px;
}

/* =============================================
MV
============================================= */
#sweets202305 .mv {
  background-image: url(/ec/shop/images/campaign/202305_sweets/mv-bg.jpg);
  background-size: contain;
  background-position: center;
  background-repeat: repeat-x;    
  background-color: #fdf9ea;
}

#sweets202305 .mv .container{
  margin: 0 auto;	
	
}

#sweets202305 .mv h1 img{
  margin: 0 auto;	
}
  
  



/* =============================================
見出し
============================================= */

#sweets202305 h2 {
  margin-bottom: 34px;
  margin-top: 70px; }

#sweets202305 h2 span {
  position: relative;
}




#sweets202305 h2 img {
  height: 60px;
  width: auto;	
}


#sweets202305 .h3 {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.02em;
  line-height: 1;
  margin-bottom: 20px;
  padding-left: 12px;
  padding-top: 1px;
  position: relative;
  text-align: left; }
  #sweets202305 .h3::before {
    background-color: #76382E;
    content: "";
    display: block;
    height: 18px;
    left: 0;
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    width: 4px; }

/* =============================================
ナビ
============================================= */
#sweets202305 .navi-wrap {
	background-color: #F5D99E;
}

#sweets202305 .navi-wrap .container {
	margin-bottom: 0;
}


#sweets202305 .navi {
  width: 990px;	
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto 0; }


  #sweets202305 .navi li {
    background: #F5D99E;
    border-right: solid 1px #ffffff; }


  #sweets202305 .navi li:last-child {
    border-right: none; }


  #sweets202305 .navi li a {
	background-image: url(/ec/shop/images/campaign/202305_sweets/arrow.svg);
    background-size: 10.707px 6.061px;
    background-position: 50% calc(100% - 10px);
    background-repeat: no-repeat;   
    color: #76382E;
    display: block;
	letter-spacing: 0.1em;
	font-weight: normal;  
	font-size: 18px; 
    padding: 21px 100px;}


  

/* =============================================
特集から探す
============================================= */
#sweets202305 .section-top-banner .banner {
  display: flex;
  flex-wrap: wrap;
 justify-content: center;
}
#sweets202305 .section-top-banner .banner-item {
  width: calc((100% - (20px * 3)) / 4); }
#sweets202305 .section-top-banner .banner-item:nth-last-child(n + 5) {
  margin-bottom: 20px; }
#sweets202305 .section-top-banner .banner-item:not(:nth-child(4n)) {
  margin-right: 20px; }
#sweets202305 .section-top-banner .banner-item a img {
  width: 100%; }
#sweets202305 .section-top-banner .banner-item a .banner-name {
  font-size: 14px;
  margin-top: 14px;
  line-height: 1.5; }





/* =============================================
ピックアップ
============================================= */

#sweets202305 .pickup {
background: #FBF8EA;
 padding: 70px 0;
text-align: center;
margin-bottom: 110px;	
}

#sweets202305 .pickup_container {
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    width: 990px;
}


#sweets202305 .pickup h2{
 margin: 0 auto;
}

#sweets202305 .pickup h2 .pickup_ttl{
 margin: 0 auto;
 height: 80px;
 width: auto;	
}

#sweets202305 .pickup h3{
 padding: 50px 0 20px;
 font-size: 35px;
 line-height: 47px;
 font-weight: 300;
 color: #F98107;
 text-align: center;
}

#sweets202305 .pickup p{
 padding-bottom: 40px;
    font-size: 21px;
    line-height: 40.5px;
 font-weight: 300;
 color: #333;
 text-align: center;
}

#sweets202305 .pickup_contents{
 display:flex;
 align-items: flex-start;
 flex-wrap: wrap;
 margin: 0 auto;
 justify-content: center;
}

#sweets202305 .pickup_inner{
 width: calc((100% - 60px) / 3);
}

#sweets202305 .pickup_inner img{
 width: 100%;
 height: auto;
}


#sweets202305 .pickup_inner:not(:nth-child(3n)) {
    margin-right: 30px;
}


#sweets202305 .pickup_inner:nth-last-child(n+4) {
    margin-bottom: 30px;
}


#sweets202305 .pickup_img{
 background-color: #fff; 
}

#sweets202305 .pickup_name{
 margin: 0 auto;
 padding: 15px 0 2px;
 font-size: 14px;
 line-height: 21px;
 color: #76382E;
}

#sweets202305 .pickup_price{
 font-size: 18px;
 font-weight: bold;
 line-height: 22px;
 color: #76382E;
}

#sweets202305 .pickup_yen_tax{
 font-size: 15px;
 line-height: 22px;
 font-weight: normal;
 color: #76382E;
}









/* =============================================
ランキング
============================================= */
#sweets202305 .ranking-sttl {
  font-size: 18px;
  font-weight: bold;
  letter-spacing: 0.02em;
  line-height: 1;
  margin-bottom: 44px;
  padding-left: 12px;
  padding-top: 1px;
  position: relative;
  text-align: left; }
  #sweets202305 .ranking-sttl::before {
    background-color: #76382E;
    content: "";
    display: block;
    height: 18px;
    left: 0;
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    width: 4px; }

#sweets202305 .ranking:not(:last-child) {
  margin-bottom: 50px; }
#sweets202305 .ranking .list {
  display: flex;
  flex-wrap: wrap; }
#sweets202305 .ranking .item {
  position: relative;
  width: calc((100% - (23px * 4)) / 5); }
#sweets202305 .ranking .item::before {
  background-image: url(/ec/shop/images/campaign/202305_sweets/icon-number01.svg);
  content: "";
  display: block;
  height: 40px;
  left: 0;
  position: absolute;
  top: -20px;
  width: 40px;
  z-index: 1; }
#sweets202305 .ranking .item:nth-child(2)::before {
  background-image: url(/ec/shop/images/campaign/202305_sweets/icon-number02.svg); }
#sweets202305 .ranking .item:nth-child(3)::before {
  background-image: url(/ec/shop/images/campaign/202305_sweets/icon-number03.svg); }
#sweets202305 .ranking .item:nth-child(4)::before {
  background-image: url(/ec/shop/images/campaign/202305_sweets/icon-number04.svg); }
#sweets202305 .ranking .item:nth-child(5)::before {
  background-image: url(/ec/shop/images/campaign/202305_sweets/icon-number05.svg); }
#sweets202305 .ranking .item:not(:nth-child(5n)) {
  margin-right: 23px; }
#sweets202305 .ranking .thumb {
  margin-bottom: 8px;
  width: 180px; }
#sweets202305 .ranking .thumb img {
  border: 1px solid #ccc;
  width: 100%; }
#sweets202305 .ranking .name {
  color: #010101;
  font-size: 12px;
  letter-spacing: 0.04em;
  line-height: 24px;
  font-weight: normal; }

/* =============================================
カテゴリ
============================================= */
#sweets202305 .category-list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 10px;
  align-items: flex-start; }
  #sweets202305 .category-list li {
    margin: 0 10px 10px 0;
    width: calc((100% - (10px * 3)) / 4); }
  #sweets202305 .category-list li:nth-child(4n) {
    margin-right: 0; }
  #sweets202305 .category-list li:nth-last-child(-n+4) {
    margin-bottom: 0; }
  #sweets202305 .category-list li a {
    position: relative;
    display: block; }
  #sweets202305 .category-list li a img {
    display: block;
    width: 100%; }
  #sweets202305 .category-list li a .category-name {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  font-size: 16px;
  font-weight: normal;
  color: #fff;
  padding: 0.4em;
  background: rgba(254, 161, 66, 0.8);
}





/* =============================================
ブランド
============================================= */
#sweets202305 .brand-list {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start; }
  #sweets202305 .brand-list:not(:last-child) {
    margin-bottom: 100px; }


  #sweets202305 .brand-list li {
    width: 180px;
    margin: 0 22px 10px 0; }
  #sweets202305 .brand-list li:nth-child(5n) {
    margin-right: 0; }
  #sweets202305 .brand-list li:nth-last-child(-n+5) {
    margin-bottom: 0; }
  #sweets202305 .brand-list li a img {
    width: 180px; }
  #sweets202305 .brand-list li a .brand-name {
    font-size: 14px;
    font-weight: normal;
    margin-top: 8px;
    line-height: 1.5; }






/* =============================================
価格から探す
============================================= */
#sweets202305 .price-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#sweets202305 .price-list li {
  width: calc((100% - (20px * 3)) / 4);
  margin: 0 20px 20px 0;
  border: 1px solid #AD4E39;
  height: 64px;
}
#sweets202305 .price-list li:nth-child(4n) {
  margin-right: 0;
}
#sweets202305 .price-list li:nth-last-child(-n+4) {
  margin-bottom: 0;
}
#sweets202305 .price-list li a {
  font-size: 18px;
  font-weight: normal;
  color: #AD4E39;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 1em 0.5em;
}











/* =============================================
ボタン
============================================= */
#sweets202305 .link-btn {
  width: 315px;
  height: 56px;
  margin: 20px auto 50px; }
  #sweets202305 .link-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #F3C15B;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    height: 100%;
    width: 100%; }





/* =============================================
PC・SP表示非表示用
============================================= */
#sweets202305 .pc {
  display: block; }

#sweets202305 .sp {
  display: none; }
