@charset "UTF-8";
/*-----------------------------------
anniversary-cake.css
-----------------------------------*/

/****************************
ページ共通
****************************/
#AnniversaryCake {
  box-sizing: border-box;
  overflow: hidden;
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", YuGothic, "Yu Gothic", "BIZ UDPGothic", "Helvetica Neue", arial, sans-serif;
	font-size: 15px;
}
#AnniversaryCake img{
	width: 100%;
}
#AnniversaryCake section:not(:last-of-type) {
  padding: 0 0 80px;    
}  
#AnniversaryCake .inner{
	max-width: 920px;
	margin: 0 auto;
}
#AnniversaryCake .txt-attention {
  color: #d93600;
  font-size: 14px;
}

/* 見出し */
#AnniversaryCake .heading {
  position: relative;
  margin: 0 0 45px;
  padding: 0;
  background: none;
  color: #6c3524;
  font-weight: bold;
  text-align: center;
	font-size: 22px;
}
#AnniversaryCake .heading span {
  padding: 0 20px;
  background: #fff;
}
#AnniversaryCake .heading::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  padding: 2px;
  transform: translateY(-50%);
  border-top: 1px solid #6c3524;
  border-bottom: 1px solid #6c3524;
  z-index: -1;
  content: "";
}

@media screen and (min-width: 600px){
	.sp-only{
		display: none;
	}
}

@media screen and (max-width: 599px){
	#AnniversaryCake section:not(:last-of-type){
		padding: 0 0 60px;
	}
	#AnniversaryCake .heading{
		margin: 0 0 25px;
		font-size: 18px;
	}
	#AnniversaryCake .heading::before{
		padding: 1px;
	}
}


/****************************
ヘッダー
****************************/
#AnniversaryCake .anniv-header .image {
  margin: 0 0 50px;
}
#AnniversaryCake .anniv-header .text {
  text-align: center;     
}
#AnniversaryCake .anniv-header .text .anniv-title{
	font-size: 24px;
	color: #6c3524;
	line-height: 1.6;
	font-weight: 600;
}
#AnniversaryCake .anniv-header .text .anniv-title span{
	font-size: 20px;
}
#AnniversaryCake .anniv-header .text .text-ex{
	margin: 15px 0 0;    
	font-size: 16px;
}

@media screen and (max-width: 599px){
	#AnniversaryCake .anniv-header .image{
		margin: 0 0 30px;
	}
	#AnniversaryCake .anniv-header .text .anniv-title{
		font-size: 20px;
	}
	#AnniversaryCake .anniv-header .text .anniv-title span{
		font-size: 17px;
	}
	#AnniversaryCake .anniv-header .text .text-ex{
		font-size: 15px;
	}
}
  

/****************************
ご予約スケジュール
****************************/
#anniv-reserve .anniv-reserve-box {
	padding: 20px;
	display: flex;
	gap: 15px;
	box-sizing: border-box;
	border: 1px solid #be0912;
	border-radius: 10px;
}
#anniv-reserve .anniv-reserve-box::after{
	display: none;
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item {
  line-height: 1.5;
	text-align: center;
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item:first-of-type{
	box-sizing: border-box;
	width: 50%;
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item:nth-of-type(2){
	width: calc((100% - 15px) - 50%);
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item .anniv-reserve-date {
  font-size: 18px;
  font-weight: bold;
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item .txt-attention {
  margin-top: 1em;
}
#anniv-reserve .anniv-reserve-box .anniv-reserve-item .txt-attention a{
	color: #be0912;
}

@media screen and (min-width: 600px){
	#anniv-reserve .anniv-reserve-box .anniv-reserve-item:first-of-type{
		border-right: 1px dashed #333;
		padding-right: 15px;
	}
}

@media screen and (max-width: 599px){
	#anniv-reserve .anniv-reserve-box{
		flex-direction: column;
		padding: 15px;
	}
	#anniv-reserve .anniv-reserve-box .anniv-reserve-item:first-of-type{
		border-bottom: 1px dashed #333;
		padding-bottom: 15px;
	}
	#anniv-reserve .anniv-reserve-box .anniv-reserve-item:first-of-type,
	#anniv-reserve .anniv-reserve-box .anniv-reserve-item:nth-of-type(2){
		width: 100%;
	}
	#anniv-reserve .anniv-reserve-box .anniv-reserve-item .txt-attention{
		margin-top: 6px;
	}
}


/*-----------------------------------
ご注文から受取りまでの流れ
-----------------------------------*/
#anniv_flow .anniv_order_box {
  display: flex;
	gap: 35px;
}
#anniv_flow .anniv_order_box::after{
	display: none;
}
#anniv_flow .anniv_order_title{
  font-size: 20px;
  line-height: 1.2;
  color: #bc2f4d;
  text-align: left;
  font-weight: 600;
	border-bottom: 2px solid #bc2f4d;
	padding-bottom: 3px;
}
#anniv_flow .anniv_order_title span{
  font-size: 15px;
}
#anniv_flow .anniv_order_title .number{
	margin-right: 10px;
  font-size: 27px;
  line-height: 0;
}
#anniv_flow .anniv_order_item {
  width: calc((100% - 70px) / 3);
  padding: 30px 15px 15px;
  border: 1px solid #bc2f4d;
  position: relative;
  font-size: 16px;
}
#anniv_flow .anniv_order_box .anniv_order_item:nth-of-type(3n){
  margin-right: 0;
}
#anniv_flow .anniv_order_box .anniv_order_item:nth-of-type(n+2):before{
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  border-left: 2px solid #bc2f4d;
  border-top: 2px solid #bc2f4d;
  position: absolute;
  top: 50%;
  left: -11%;
  transform: rotate(135deg) translateY(-50%);
}
#anniv_flow .anniv_order_item .anniv_order_inner {
  margin: 12px 0 0;
	line-height: 1.6;
}
#anniv_flow .anniv_order_item .anniv_order_inner p {
  margin-bottom: 3px;    
}
#anniv_flow .anniv_order_item .anniv_order_inner.list p{
	text-indent: -1em;
	padding-left: 1em;
}
#anniv_flow .anniv_attention{
  margin-top: 5px;
}
#anniv_flow .anniv_attention .txt-attention{
	text-indent: -1em;
	padding-left: 1em;
}

@media screen and (max-width: 599px){
	#anniv_flow .anniv_order_box{
		flex-direction: column;
	}
	#anniv_flow .anniv_order_title{
		font-size: 17px;
	}
	#anniv_flow .anniv_order_title .number{
		font-size: 22px;
	}
	#anniv_flow .anniv_order_item{
		width: 100%;
		box-sizing: border-box;
		padding: 22px 15px 15px;
		font-size: 15px;
	}
	#anniv_flow .anniv_order_box .anniv_order_item:nth-of-type(n+2):before{
		left: 50%;
    transform: rotate(225deg) translateY(-50%);
	}
	#anniv_flow .anniv_order_box .anniv_order_item:nth-of-type(2):before{
		top: -25%;
	}
	#anniv_flow .anniv_order_box .anniv_order_item:nth-of-type(3):before{
		top: -12%;
	}
	#anniv_flow .anniv_order_item .anniv_order_inner{
		margin: 10px 0 0;
	}
}


/*-----------------------------------
受け取り店舗から選ぶ
-----------------------------------*/
#anniv_store .anniv_store-list {
  display: flex;
	gap: 30px;
}
#anniv_store .anniv_store-list::after{
	display: none;
}
#anniv_store .anniv_store-list .anniv_store-link {
  text-decoration: none;
	color: #333;
	display: flex;
	flex-direction: column;
	gap: 10px;
}  
#anniv_store .anniv_store-list .anniv_store-item {
	width: calc((100% - 60px) / 3);
	text-align: center;
}
#anniv_store .anniv_store-list .anniv_store-item:last-child {
  margin-right: 0;
}
#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-text .anniv_store-name {
  margin-bottom: 5px;
  font-size: 18px;
	font-weight: 600;
}

@media screen and (min-width: 600px){
	#anniv_store .anniv_store-list .anniv_store-link{
		transition: opacity 400ms ease;
	}
	#anniv_store .anniv_store-list .anniv_store-link:hover{
		opacity: 0.6;
	}
	#anniv_store .anniv_store-list .anniv_store-link:hover img{
		opacity: 1.0;
	}
}

@media screen and (max-width: 599px){
	#anniv_store .anniv_store-list{
		flex-direction: column;
		gap: 25px;
	}
	#anniv_store .anniv_store-list .anniv_store-item{
		width: 100%;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link{
		flex-direction: row;
		gap: 15px;
		align-items: center;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-text{
		width: calc((100% - 15px) - 45%);
		line-height: 1.5;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-text .anniv_store-time{
		font-size: 14px;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-image{
		width: 45%;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-image img{
		aspect-ratio: 3 / 2;
    object-fit: cover;
	}
	#anniv_store .anniv_store-list .anniv_store-item .anniv_store-link .anniv_store-text .anniv_store-name{
		font-size: 16px;
	}
}
  

/*-----------------------------------
ブランドから選ぶ
-----------------------------------*/
#anniv_brand {
  width: 100%;
  box-sizing: border-box;
}
#anniv_brand .anniv_brand-box:not(:last-of-type) {
  margin: 0 0 40px;
}
#anniv_brand .anniv_brand-title {
  font-size: 18px;
  color: #bc2f4d;
  margin: 0 0 20px;
  border-bottom: 2px solid;
	padding-bottom: 3px;
	font-weight: 600;
}
#anniv_brand .anniv_brand-title a {
  color: #6c3524;    
}
#anniv_brand .anniv_brand-list {
  display: flex;
  flex-wrap: wrap;
	gap: 25px;
}
#anniv_brand .anniv_brand-list::after{
	display: none;
}
#anniv_brand .anniv_brand-list a {
  color: #333;
  text-decoration: none;
}
#anniv_brand .anniv_brand-list .anniv_brand-item {
  width: calc((100% - 75px) / 4);
}
#anniv_brand .anniv_brand-list .anniv_brand-item:nth-child(4n) {
  margin-right: 0;
}
#anniv_brand .anniv_brand-list .anniv_brand-item .anniv_brand-image {
  margin: 0 0 12px;
}
#anniv_brand .anniv_brand-list .anniv_brand-item .anniv_brand-name {
  text-align: center;
}

@media screen and (max-width: 599px){
	#anniv_brand .anniv_brand-title{
		font-size: 16px;
	}
	#anniv_brand .anniv_brand-box:not(:last-of-type){
		margin: 0 0 30px;
	}
	#anniv_brand .anniv_brand-list{
		gap: 20px 15px;
	}
	#anniv_brand .anniv_brand-list .anniv_brand-item{
		width: calc((100% - 15px) / 2);
	}
}
  
  
