@charset "utf-8";

:root {

}

@media (prefers-color-scheme: dark) {
	:root {

	}
}

/* モバイル　ALL */
@media screen and (max-width: 425px) {
	:root {
		--HowToBuy_Step_align-itemss: stretch;
		--HowToBuy_Step_Step_align-items: baseline;
		--HowToBuy_Step_Step_padding: 0;
		--HowToBuy_Step_Figure_position: absolute;
		--HowToBuy_Step_Figure_top: var(--Size_09);
		--HowToBuy_Step_Figure_left: var(--Size_14);
		--HowToBuy_Step_Figure_width: var(--Size_22);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B000);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_12);
	}
}

/* タブレット */
@media screen and (min-width:426px) and (max-width: 768px) {
	:root {
		--HowToBuy_Step_align-itemss: stretch;
		--HowToBuy_Step_Step_align-items: baseline;
		--HowToBuy_Step_Step_padding: 0;
		--HowToBuy_Step_Figure_position: absolute;
		--HowToBuy_Step_Figure_top: var(--Size_09);
		--HowToBuy_Step_Figure_left: var(--Size_14);
		--HowToBuy_Step_Figure_width: var(--Size_22);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B000);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_12);
	}
}

/* ノートパソコン */
@media screen and (min-width:769px) and ( max-width:1024px) {
	:root {
		--HowToBuy_Step_align-itemss: center;
		--HowToBuy_Step_Step_align-items: center;
		--HowToBuy_Step_Step_padding: var(--Size_10);
		--HowToBuy_Step_Figure_position: relative;
		--HowToBuy_Step_Figure_top: 0;
		--HowToBuy_Step_Figure_left: 0;
		--HowToBuy_Step_Figure_width: var(--Size_60);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B100);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_18);
	}
}

/* ノートパソコン L */
@media screen and (min-width:1025px) and ( max-width:1440px) {
	:root {
		--HowToBuy_Step_align-itemss: center;
		--HowToBuy_Step_Step_align-items: center;
		--HowToBuy_Step_Step_padding: var(--Size_10);
		--HowToBuy_Step_Figure_position: relative;
		--HowToBuy_Step_Figure_top: 0;
		--HowToBuy_Step_Figure_left: 0;
		--HowToBuy_Step_Figure_width: var(--Size_60);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B100);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_18);
	}
}

/* 2K以上 */
@media screen and (min-width:1441px) and ( max-width:2560px) {
	:root {
		--HowToBuy_Step_align-itemss: center;
		--HowToBuy_Step_Step_align-items: center;
		--HowToBuy_Step_Step_padding: var(--Size_10);
		--HowToBuy_Step_Figure_position: relative;
		--HowToBuy_Step_Figure_top: 0;
		--HowToBuy_Step_Figure_left: 0;
		--HowToBuy_Step_Figure_width: var(--Size_60);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B100);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_18);
	}
}

/* 4K以上 */
@media screen and (min-width:2561px) {
	:root {
		--HowToBuy_Step_align-itemss: center;
		--HowToBuy_Step_Step_align-items: center;
		--HowToBuy_Step_Step_padding: var(--Size_10);
		
		--HowToBuy_Step_Figure_position: relative;
		--HowToBuy_Step_Figure_top: 0;
		--HowToBuy_Step_Figure_left: 0;
		--HowToBuy_Step_Figure_width: var(--Size_60);
		--HowToBuy_Step_Figure_backgroundn: var(--Color_B100);
		--HowToBuy_Step_Figure_I_font-size: var(--Size_18);
	}
}








/* ーーーーーーーーーーーーーーーーーーーー
	How To Buy
ーーーーーーーーーーーーーーーーーーーー */

#contents.how_to_buy {
	& > div#step {
		display: flex;
		flex-direction: column;
		gap: var(--Gap);
		margin: var(--Card_margin);
		& > div {
			position: relative;
			display: flex;
			flex-direction: var(--Flex-direction_CCRRRR);
			justify-content: center;
			align-items: var(--HowToBuy_Step_align-itemss);
			gap: var(--Gap);
			padding: var(--Size_10);
			background: var(--Color_FF100);
			border-radius: var(--Border-radius_S);
			& div.step {
				flex-basis: var(--HowToBuy_Step_Step_flex-basis);
				display: flex;
				flex-direction: var(--Flex-direction_RRCCCC);
				justify-content: center;
				align-items: var(--HowToBuy_Step_Step_align-items);
				padding: var(--HowToBuy_Step_Step_padding);
				background: var(--Color_B100);
				border-radius: var(--Border-radius_S);
				& em{
					color: var(--Color_FF100);
				}
				& strong {
					font-size: var(--Size_14);
					color: var(--Color_FF100);
					font-weight: 600;
				}
			}
			& div.wrap {
				flex: 1;
				& h3 {
					font-size: var(--Size_12);
					font-weight: 600;
				}
				& p {
				}
			}
			& figure {
				position: var(--HowToBuy_Step_Figure_position);
				top: var(--HowToBuy_Step_Figure_top);
				left: var(--HowToBuy_Step_Figure_left);
				display: flex;
				justify-content: center;
				align-items: center;
				width: var(--HowToBuy_Step_Figure_width);
				background: var(--HowToBuy_Step_Figure_backgroundn);
				border-radius: var(--Border-radius_L);
				aspect-ratio: 1 / 1;
				& i {
					font-size: var(--HowToBuy_Step_Figure_I_font-size);
					color: var(--Color_FF100);
				}
			}
		}
	}
}