@charset "utf-8";
/* 全体 */
	.crystallotion{
		max-width: 720px;
		margin: 0 auto;
	}
	/* パンくず */
	.crystallotion .breadcrumb{
		padding: 16px 32px 16px 0;
		padding-inline: 0px;
	}
	/* 商品全体 */
	.crystallotion .item_wrapper{
    /* margin-top: 5%; */
    padding: 1em 0.5em;
    margin: 0;
    border: 14px solid #e1f1d3;
	}
	/* 万歳 */
	.crystallotion .item_title{
		text-align: center;
		margin: 0;/*iデフォルトの余白リセット*/
		margin-bottom: 1%;
	}
	/*一商品余白調整 */
	.crystallotion .c-panel{
		margin-bottom: 1rem;
		background-color: #fff;/*背景色変更*/
		padding: 5%;/*余白調整*/
		position: relative;
		padding: 3%;
	}	
	.crystallotion .c-panel:not(:has(~ .c-panel)){
		margin-bottom: 0;
	}
	/*ジャンルごと余白調整*/	
	.crystallotion .cp_list{
		margin-bottom: 4rem;
	}
	.crystallotion .cp_list:not(:has(~ .cp_list)){
		margin-bottom: 0;
	}
	/* 動画 */
	.crystallotion .movie_box{margin-bottom: 2rem;
    display: flex;
    justify-content: center;
	}
	.crystallotion .movie_box iframe{
		width: 100%;
		height: auto;
	}


	/*背景色変更--------------------------*/
	.crystallotion .cp_list_1 .c-panel{
		/*background-color: #f8f7f4;*/
	}
	/*.crystallotion .cp_list_2 .c-panel{
		background-color: #effaff;
	}*/	
	
	/*テキストエリア*/	
	.crystallotion .c-panel__body{
		margin-top: 0px;
		max-width: 70%;
		margin-left: 20px;
	}
	/*商品画像の位置*/
	.crystallotion .c-panel__header{
		box-sizing: border-box;
		width: 145px;
	}
	/*商品画像の大きさ*/
	.crystallotion .c-panel__header__image{
		width: 100%;
		border: 5px solid #FFF;
		background-color: #fff;
	}
	/*価格（余白確保してボタンに被るのを回避、並び方調整など）*/
	.crystallotion .c-panel__price-wrapper{
		/*margin-bottom: 4rem;*/
		display: flex;
		align-items: baseline;
		flex-wrap: wrap;
		column-gap:1rem;
    --space: 3px;
	}

	/*商品解説PCも非表示に*/	
	.crystallotion .c-panel__desc{
		display: none;
		/*margin-bottom: 4.9rem;*/
	}
	/*バッジ枠線*/
	.crystallotion .border-red{
    border-color: #f97697!important;
	}
	/*バッジ文字色*/
	.text-red{
    color: #f97697!important;
	}
	
	/*価格定価*/
	.crystallotion .c-price{
		font-size: 3.5rem !important;
		font-weight: normal;
	}
	
	/*価格元値*/
	.crystallotion .c-price-delete{
		background: linear-gradient(transparent 13px, #333 13px, #333 14px, transparent 14px);
    font-size: 2rem !important;
    font-weight: bold;
	}
	/*価格CP*/
	.crystallotion .c-price--sale{
		color: #f97697;
    font-size: 4rem !important;
		font-weight: normal;
	}
	
	/*割引率*/
	.crystallotion .c-panel__discount .badge.badge-red.c-label-discount{
		font-size: 2.5rem;
	}
	/*割引率背景色*/
	.crystallotion .badge-red{
    background-color: #f97697;
}
	/*ボタン位置*/	
	.crystallotion .c-panel__action{
		position: absolute;
		bottom: 0;
		right: 0;
	}
	/*ボタン*/
	.crystallotion .btn-primary{
		border-color: #ffffff;
		background: linear-gradient(115deg, #669adb 0, #59bd84 50%, #d2d74a 100%);
		}
	/*商品とテキストを横並びに*/
	.crystallotion .c-panel__link{
		display: flex;
	}
	.crystallotion .more_btn{
		text-align: center;
		margin-top: 5%;
	}
	/*LP最下部タイトル上に余白*/
	.crystallotion .mtop{
		margin-top: 4rem;
	}
	/*シリーズ画像詳細リンク*/
	.seriesArea{position: relative;}
	.link1,.link2,.link3,.link4,.link5{position: absolute; display: block; width: 18.05%; height: 6.57%;}
	.link1{top: 85.61%; left: 2.08%;}
	.link2{top: 85.61%; left: 21.52%;}
	.link3{top: 85.61%; left: 40.97%;}
	.link4{top: 85.61%; left: 60.41%;}
	.link5{top: 85.61%; left: 79.86%;}

/*PC---------------------------------------------*/
@media screen and (min-width: 769px){
	/* スペース調整 */
	.mT{margin-top: 5em;}
	.mT2{margin-top: 0.25em;}
	.pc_none{display: none;}
	.crystallotion .c-panel__name{
		font-size: 1.4rem!important;
		}
	.crystallotion .movie_box iframe{
		width: 720px;
		height: 405px;
	}
}

/*SP---------------------------------------------*/
	@media screen and (max-width: 768px){
		/* 全体 */
		.sp_none{display: none;}
		.crystallotion{
			max-width: 100%;
			width: 100%;
		}
		/* スペース調整 */
		.mT{margin-top: 3em;}
		.mT2{margin-top: 0.15em;}
		/*商品のまとめ（余白確保）*/
		.crystallotion .item_wrapper{
			/*width: 92vw;
			margin: 0 auto;
			margin-top: 8%;*/
		}
		/*一商品*/		
		.crystallotion .c-panel{
			padding: 4% 3%;
		}
		/*商品画像*/
		.crystallotion .c-panel__header{
			width: 110px;
		}
		/*タイトル余白調整*/
		.crystallotion .item_title{
			margin-bottom: 3%;
		}
		/*テキスト領域*/
		.crystallotion .c-panel__body{
			max-width: 63%;
			margin-left: 1.2rem;
		}
		/*商品名*/	
		.crystallotion .c-panel__name{
			font-size: 1.4rem;
		}	
		.crystallotion .btn-sm,
		.crystallotion .more_btn .btn.btn-sm.btn-outline-primary{
			font-size: 1.4rem;
			padding: 14px 36px !important;
		}

		/*価格下に余白確保（ボタンに被るのを回避）*/		
		.crystallotion .c-panel__price-wrapper{
			margin-bottom: 5.9rem;
		}
		/*ボタン位置*/	
	.crystallotion .c-panel__action{
		width: 100%;
		}
		/*商品解説SPHは非表示に*/		
		.crystallotion .c-panel__desc{
    display: none;
		}

		/*割引率+期日のdiv*/
		.crystallotion .c-panel__discount{
			flex-basis: 100%;/*（回り込み回避）*/
			--price-space: 2px;
		}
		/*割引率*/
		.crystallotion .c-panel__discount .badge.badge-red.c-label-discount{
			padding: 3px 5px;
		}
		/*価格定価*/
		.crystallotion .c-price{
		font-size: 2.5rem !important;
		font-weight: normal;
	}
	
	/*価格元値*/
	.crystallotion .c-price-delete{
		background: linear-gradient(transparent 13px, #333 13px, #333 14px, transparent 14px);
    font-size: 1.5rem !important;
    font-weight: bold;
	}
	/*価格CP*/
	.crystallotion .c-price--sale{
		color: #f97697;
    font-size: 3rem !important;
		font-weight: normal;
	}
		.crystallotion .movie_box iframe{
		width: 560px;
		height: 315px;
	}
		.btn.disabled, .btn:disabled{
			width: 100%;
		}
		
	}