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

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

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




/* sp▽ */ @media only screen and (max-width: 768px) {
	.oc_desc .migrate05{ padding-left: 2%; margin-bottom: 1.5em;}
	.oc_desc .migrate05 .title{ width: 20%;/*◆*/ top: 5px; left: 1%; font-size: 14px; border: 1px solid #d31200;}
	.oc_desc .migrate05 .item_image{ width: 20%;/*◆*/ position: relative;}
	.oc_desc .migrate05 .item_image img{ position: absolute; top: 70%; transform: translateY(-50%);}
	.oc_desc .migrate05 .link_wrapper{ width: 79.5%;}
	.oc_desc .migrate05 .box{ width: calc( 100% - ( 5px * 2 ) );/*●*/ padding: 4px; text-align: center;}
	.oc_desc .migrate05 .box .date,.oc_desc .migrate05 .box .name{ display: inline-block; padding: 0px 4px;}
	.oc_desc .migrate05 .box .button::before{ font-size: 80%;}
}/*△*/
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05{ margin: 20px 60px 40px;}
	.oc_desc .migrate05 .title{ width: 76%; top: 2px; left: calc( 50% + ( 20% / 2 )); 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 .migrate05 .item_image{ width: 20%;}
	.oc_desc .migrate05 .item_image img{ margin-top: 35px;}
	.oc_desc .migrate05 .link_wrapper{ width: 79.5%; padding: 3em 5px 0em;}
	.oc_desc .migrate05 .box{ width: calc( 33.3% - 10px ); margin: 10px 5px;}
	.oc_desc .migrate05 .box .date,
	.oc_desc .migrate05 .box .name{ padding: 6px 0px 2px; text-align: center;}
	.oc_desc .migrate05 .box .date{ font-size: 22px;}
	.oc_desc .migrate05 .box .name{ font-size: 16px;}
	.oc_desc .migrate05 .box .button{ margin-top: 7px;}
}/*△*/
	/*完売*/
.oc_desc .migrate05 .box.sold{ background: #bbb !important;}
.oc_desc .migrate05 .box.sold .name::before,.oc_desc .migrate05 .box.sold .name::after{ color: #666 !important;}
.oc_desc .migrate05 .box.sold .button{ border: unset !important; background: #b0b0b0 !important; color: inherit !important;}
.oc_desc .migrate05 .box.sold .button::before{ content: "大好評につき\a完売しました" !important;}
/* PC▽ */ @media only screen and (min-width: 768px) {
	.oc_desc .migrate05 .box.sold .button::before{ white-space: pre;}
}/*△*/

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


