@charset "utf-8";
/* ------------------------------
oc 回遊リンク05x4 sz 2022/11/21 11:15
------------------------------ */
/*回遊リンク05x4 行き先4/sold対応あり */

.oc_desc .migrate05x4{ position: relative; border: 2px solid #e5e0db; border-radius: 5px;}
.oc_desc .migrate05x4 .link_wrapper{
	display: grid;
	align-items: stretch;
	align-content: stretch;
	padding: 0px;
}
/* sp▽ */ @media only screen and (max-width: 768px) {
	.oc_desc .migrate05x4 .link_wrapper{
		width: 79.5%; margin-left: 20%;
		grid-template-columns: 1fr;   /* 1列 */
		gap: 10px 0;
	}
	.oc_desc .migrate05x4 .box{
		padding: 4px;
		text-align: center;
	}
}/*△*/
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05x4 .link_wrapper{
		padding: 3em 5px 0;
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 10px 3px;
	}
}/*△*/




.oc_desc .migrate05x4 .title{ position: absolute; padding: 4px; text-align: center; border-radius: 5px;}
.oc_desc .migrate05x4 .box{ position: relative; margin: 5px;/*●*/ border: 1px solid #e5e0db; border-radius: 5px;}
.oc_desc .migrate05x4 .box .name::before,
.oc_desc .migrate05x4 .box .name::after{ content: "★"; color: #d5d509; font-size: 80%;}
.oc_desc .migrate05x4 .box .name,
.oc_desc .migrate05x4 .box .date{ letter-spacing: -1px;}
.oc_desc .migrate05x4 .box .comment{ text-align: center;}
.oc_desc .migrate05x4 .box .button{ margin: 8px 15% ; padding: 2px; text-align: center; color: #eee; background: #4DA139; border-radius: 5px;}
.oc_desc .migrate05x4 .box .button::before{ content: "ご購入はこちら"; font-size: 80%;}
.oc_desc .migrate05x4 .box .popup{ position: absolute; color: #d31200;}
.oc_desc .migrate05x4 .box .popup b{ color: #d31200;}

	/*自頁 装飾変更*/
.oc_desc .migrate05x4.link_1 .box.link_1,
.oc_desc .migrate05x4.link_2 .box.link_2,
.oc_desc .migrate05x4.link_3 .box.link_3,
.oc_desc .migrate05x4.link_4 .box.link_4{ background: #ffffad; cursor: inherit;}
.oc_desc .migrate05x4.link_1 .box.link_1:hover,
.oc_desc .migrate05x4.link_2 .box.link_2:hover,
.oc_desc .migrate05x4.link_3 .box.link_3:hover{ text-decoration: none;}
.oc_desc .migrate05x4.link_1 .box.link_1 .button,
.oc_desc .migrate05x4.link_2 .box.link_2 .button,
.oc_desc .migrate05x4.link_3 .box.link_3 .button,
.oc_desc .migrate05x4.link_4 .box.link_4 .button{ color: inherit; border: 2px solid #e9ed74; background: #fff;}
.oc_desc .migrate05x4.link_1 .box.link_1 .button::before,
.oc_desc .migrate05x4.link_2 .box.link_2 .button::before,
.oc_desc .migrate05x4.link_3 .box.link_3 .button::before,
.oc_desc .migrate05x4.link_4 .box.link_4 .button::before{ content: "ご覧のページです";}




/* sp▽ */ @media only screen and (max-width: 768px) {
	.oc_desc .migrate05x4{ padding-left: 2%; margin-bottom: 1.5em;}
	.oc_desc .migrate05x4 .title{ width: 20%;/*◆*/ top: 5px; left: 1%; font-size: 14px; border: 1px solid #d31200;}
	.oc_desc .migrate05x4 .item_image{ width: 20%;/*◆*/ position: relative;}
	.oc_desc .migrate05x4 .item_image img{ position: absolute; top: 70%; transform: translateY(-50%);}
	.oc_desc .migrate05x4 .box{ width: calc( 100% - ( 5px * 2 ) );/*●*/ padding: 4px; text-align: center;}
	.oc_desc .migrate05x4 .box .date,
	.oc_desc .migrate05x4 .box .name{ display: inline-block; padding: 0px 4px;}
	.oc_desc .migrate05x4 .box .button::before{ font-size: 80%;}
	.oc_desc .migrate05x4 .box .popup{ top: -1em; left: 50%; transform: translateX(-50%); width: 80%; text-align: center;}

}/*△*/
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05x4{ margin: 20px 60px 40px;}
	.oc_desc .migrate05x4 .title{ width: 76%; top: 2px; left: 50% ; transform: translateX(-50%); font-size: 110%; background: linear-gradient(to right,#fff 0%,#fff 5%,#d31200 5%,#d31200 25%,#fff 25%,#fff 75%,#d31200 75%,#d31200 95%,#fff 95%,#fff 100%) center center / 100% 2px no-repeat;}
	.oc_desc .migrate05x4 .item_image{ width: 20%;}
	.oc_desc .migrate05x4 .item_image img{ margin-top: 35px;}
	.oc_desc .migrate05x4 .box .date,
	.oc_desc .migrate05x4 .box .name{ padding: 6px 0px 2px; text-align: center;}
	.oc_desc .migrate05x4 .box .date{ font-size: 22px;}
	.oc_desc .migrate05x4 .box .name{ font-size: 16px;}
	.oc_desc .migrate05x4 .box .button{ margin-top: 7px;}
	.oc_desc .migrate05x4 .box .popup{ top: -13px; width: 100%; text-align: center;}
}/*△*/
	/*完売*/
.oc_desc .migrate05x4 .box.sold{ background: #bbb !important;}
.oc_desc .migrate05x4 .box.sold .name::before,.oc_desc .migrate05x4 .box.sold .name::after{ color: #666 !important;}
.oc_desc .migrate05x4 .box.sold .button{ border: unset !important; background: #b0b0b0 !important; color: inherit !important;}
.oc_desc .migrate05x4 .box.sold .button::before{ content: "大好評につき\a完売しました" !important;}
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05x4 .box.sold .button::before{ white-space: pre;}
}/*△*/

	/*空欄*/
.oc_desc .migrate05x4 .box.blank{ border: unset !important;}
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05x4 .box.blank{ padding-top: 3em;}
}/*△*/


/*カスタム*/
	/*12月まかない袋 makanai_nenmatu*/
.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name::before,
.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name::after{ content: none;}

/* sp▽ */ @media only screen and (max-width: 768px) {
	.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name{ font-size: 12px;}
	.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name b{ font-size: 14px;}
}/*△*/
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name{ font-size: 12px;}
	.oc_desc .migrate05x4 .link_wrapper.makanai_nenmatu .box .name b{ font-size: 18px;}
}/*△*/