/* ==== バラ関連ページ専用設定 ==== */

/***************************************
eventpage_basestyleを基準として
バラ関連ページ専用の設定を加える
***************************************/

/* ---- バラ関連ページ全体設定 ---- */
#event_area .event_header .title_area:after{
	background: #ab173b;
}
#event_area .event_header .text_area{
	background: #f6e7eb;
}
#event_area .event_contents h2,
#event_area .event_contents .style-h2{
	background: #f2dce1;
	color: #333333;
	border-color: #ab173b;
}
#event_area .event_contents h3,
#event_area .event_contents .style-h3{
	border-color: #ab173b;
}
#event_area .event_contents h4,
#event_area .event_contents .style-h4{
	color: #ab173b;
}
#event_area .event_contents .note{
	background: #f6e7eb;
	border-color: #ab173b;
}
/* ---- バラ関連ページ全体設定 end ---- */


/* ---- ボタンリンク ---- */
#event_area .theme-btn{
	background: #ab173b;
	color: #ffffff;
}
#event_area .border-btn:hover{
	border-color: #ab173b;
}
#event_area .theme-btn.arrow-r:after,
#event_area .theme-btn.arrow-d:after{
	border-color: #ffffff;
}
#event_area .border-btn.arrow-r:after,
#event_area .border-btn.arrow-d:after{
	border-color: #ab173b;
}
/* ---- ボタンリンク end ---- */


/* ---- 関連特集ボタン ---- */
#event_area ul.feature_items li a:hover,
#event_area ul.feature_items li a:focus{
	border-color: #ab173b;
}
/* ---- 関連特集ボタン end ---- */


/* ---- STEP ---- */
#event_area .step{
	background: #ab173b;
}
/* ---- STEP end ---- */


/* ---- サブページ遷移用イベントバナー ---- */
#event_area ul.eventbnr li a:hover,
#event_area ul.eventbnr li a:focus{
	border-color: #ab173b;
}
/* ---- サブページ遷移用イベントバナー end ---- */


/* ---- サブページ遷移用フレームリスト ---- */
#event_area ul.frame_list li > a:hover,
#event_area ul.frame_list li > a:focus{
	border-color: #ab173b;
}
/* ---- サブページ遷移用フレームリスト end ---- */


/* ---- アコーディオン ---- */
/* よくある質問 */
#event_area .accordion01{
	margin: 15px 0 0;
}
#event_area .accordion01 > .ac-label{
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	background: #78bd24;
	border-bottom: 1px solid #ffffff;
}
#event_area .accordion01 > .ac-label .ac-label_inner{
	width: 100%;
	padding: 0.375em 1.25em;
	color: #ffffff;
	font-weight: 600;
	line-height: 1.5;
	cursor: pointer;
	font-size: calc(1em + 0.25em);
	text-align: center;
}
#event_area .accordion01 > .ac-label::-webkit-details-marker{
    display: none;
}
#event_area .accordion01 > .ac-label:after{
	position: absolute;
	right: 1em;
	transform: translateY(-25%) rotate(45deg);
	width: calc(1em - 0.25rem);
	height: calc(1em - 0.25rem);
	border-bottom: 4px solid #ffffff;
	border-right: 4px solid #ffffff;
	content: '';
	transition: transform .5s;
}
#event_area .accordion01[open] > .ac-label:after{
	transform: translateY(25%) rotate(225deg);
}
#event_area .accordion01 > .ac-panel{
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 15px;
	border: 1px solid #78bd24;
	border-top: 0;
	line-height: 1.5;
	color: #333333;
	transition: transform .5s, opacity .5s;
}
#event_area .accordion01[open] > .ac-panel{
	transform: none;
	opacity: 1;
}

/* 受取可能店舗 */
#event_area .accordion02{
	margin: 15px 0 0;
	border: 2px solid #a5a5a5;
}
#event_area .accordion02 > .ac-label{
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}
#event_area .accordion02 > .ac-label .ac-label_inner{
	width: 100%;
	padding: 0.375em 1.25em;
	color: #333333;
	font-weight: 600;
	line-height: 1.5;
	cursor: pointer;
	font-size: calc(1em + 0.25rem);
	text-align: center;
}
#event_area .accordion02 > .ac-label::-webkit-details-marker{
    display: none;
}
#event_area .accordion02 > .ac-label:after{
	position: absolute;
	right: 1em;
	transform: translateY(-25%) rotate(45deg);
	width: calc(1em - 0.25rem);
	height: calc(1em - 0.25rem);
	border-bottom: 4px solid #333333;
	border-right: 4px solid #333333;
	content: '';
	transition: transform .5s;
}
#event_area .accordion02[open] > .ac-label:after{
	transform: translateY(25%) rotate(225deg);
}
#event_area .accordion02 > .ac-panel{
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 15px;
	line-height: 1.5;
	color: #333333;
	transition: transform .5s, opacity .5s;
}
#event_area .accordion02[open] > .ac-panel{
	transform: none;
	opacity: 1;
}

/* 注意事項 */
#event_area .accordion03{
	margin: 30px 0 0;
}
#event_area .accordion03 > .ac-label{
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	background: #c00000;
	border-bottom: 1px solid #ffffff;
}
#event_area .accordion03 > .ac-label .ac-label_inner{
	width: 100%;
	padding: 0.375em 1.25em;
	color: #ffffff;
	font-weight: 600;
	line-height: 1.5;
	cursor: pointer;
	font-size: calc(1em + 0.25rem);
	text-align: center;
}
#event_area .accordion03 > .ac-label::-webkit-details-marker{
    display: none;
}
#event_area .accordion03 > .ac-label:after{
	position: absolute;
	right: 1em;
	transform: translateY(-25%) rotate(45deg);
	width: calc(1em - 0.25rem);
	height: calc(1em - 0.25rem);
	border-bottom: 4px solid #ffffff;
	border-right: 4px solid #ffffff;
	content: '';
	transition: transform .5s;
}
#event_area .accordion02[open] > .ac-label:after{
	transform: translateY(25%) rotate(225deg);
}
#event_area .accordion03 > .ac-panel{
	transform: translateY(-10px);
	opacity: 0;
	margin: 0;
	padding: 15px;
	line-height: 1.5;
	color: #333333;
	border: 1px solid #c00000;
	border-top: 0;
	transition: transform .5s, opacity .5s;
}
#event_area .accordion03[open] > .ac-panel{
	transform: none;
	opacity: 1;
}
/* ---- アコーディオン end ---- */


/* ---- テーブル ---- */
/* スケジュール */
#event_area .schedule-table{
	width: 100%;
	font-feature-settings: "palt" 1;
}
#event_area .schedule-table th,
#event_area .schedule-table td{
	padding: 0.125rem;
	text-align: center;
	vertical-align: middle;
	border: 1px solid #cccccc;
}
#event_area .schedule-table th{
	background-color: #eeeeee;
	font-weight: bold;
}
/* ---- テーブル end ---- */


/* ---- ブランド別 ---- */
#event_area ul.brand-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 15px 0 0;
}
#event_area ul.brand-list > li *:first-child{
	margin-top: 0;
}
#event_area ul.brand-list > li *:last-child{
	margin-bottom: 0;
}
/* PC2列 SP1列 */
#event_area ul.brand-list > li{
	width: calc(50% - 15px / 2);
}
#event_area ul.brand-list > li:nth-child(n+3){
	margin-top: 15px;
}
#event_area ul.brand-list .brand_img{
	margin: 0;
	text-align: center;
}
#event_area ul.brand-list .brand_txt{
	margin: 0;
	font-size: calc(1em - 0.125rem);
}
/* SP対応 */
@media (max-width: 768px) {
	/* PC2列 SP1列 */
	#event_area ul.brand-list > li{
		width: 100%;
	}
	#event_area ul.brand-list > li:nth-child(n+2){
		margin-top: 10px;
	}
}
/* ---- ブランド別 end ---- */


/* ---- howto用横並び枠 ---- */
/* PC2列 SP1列 */
#event_area .doc-container{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 15px 0 0;
}
#event_area .doc-container .doc-container_img{
	width: calc(50% - 15px / 2);
	text-align: center;
}
#event_area .doc-container .doc-container_txt{
	width: calc(50% - 15px / 2);
}
#event_area .doc-container .doc-container_img *:first-child,
#event_area .doc-container .doc-container_txt *:first-child{
	margin-top: 0;
}
#event_area .doc-container .doc-container_img *:last-child,
#event_area .doc-container .doc-container_txt *:last-child{
	margin-bottom: 0;
}
/* SP対応 */
@media (max-width: 768px) {
	/* PC2列 SP1列 */
	#event_area .doc-container .doc-container_img{
		width: 100%;
		margin-top: 10px;
	}
	#event_area .doc-container .doc-container_txt{
		width: 100%;
	}
}
/* ---- howto用横並び枠 end ---- */

/* ==== バラ関連ページ専用設定 end ==== */
