
.step ul
	{
	display: flex;

	list-style: none;
	padding: 0;
	}

.step .txt
	{
	margin-bottom: 2rem;
	}

img+.txt
	{
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
	margin: 2rem 0 0rem 0;
	padding-bottom: 2rem;

	}

.step li
	{
	width: 32%;
margin-bottom: 2rem;
	box-sizing: border-box;
	border: 1px solid #ccc;
	}
.step li [type="radio"]
	{
	display: none;
	}
.step li label
	{
	cursor: pointer;
	display: block;
height: 100%;

	}
.step li [type="radio"]:checked + label
	{
position: relative;
	}

.step li [type="radio"]:checked + label:after
	{
	width: 100%;
	height: 100%;
position: absolute;
	top: 0;
content: "選択中";
	left: 0;
background: #000;
text-align: center;
padding-top: 50%;
font-weight: 5600;
font-size: 2em;
color: #fff;
opacity: 0.5;
	}

.step li img
	{
	width: 100%;
	}
.step + .step
	{
	margin: 60px auto 0;
	}

.step
	{
	width: 1200px;
	margin: auto;
	letter-spacing: 1px;
	font-size: 1.2em;
	}

.start
	{
	color: #fff;
	font-size: 2em;
	padding: 1rem;
	text-align: center;
	background: #000;
	}

.step dl dt
	{

	padding: 1rem 10rem;
	background: #666;
	text-align: left;
	color: #fff;
	font-size: 2em;
	position: relative;
	cursor: pointer;
	border-bottom: 1px solid #ccc;
	}

.step dl dt::before,
.step dl dt::after
	{
	position:absolute;
	content:'';
	top:1px;
	right:20px;
	bottom:0;
	width:20px;
	height:4px;
	margin:auto;
	background:#fff;
	}

.step dl dt::after
	{
	transform:rotate(-90deg);
	transition:transform 0.3s;
	}

.step dl dt.active::after
	{
	transform:rotate(0deg);
	}

.step dl dd
	{
	padding: 1rem 1rem 5rem 0;
	/**/display: none;
	}

.step dl dd > strong
	{
	margin: 2rem 0 1rem 0;
	padding: 0 0 0 10px;
	text-align: left;
	display: block;
	font-size: 1.2em;
	border-left: 10px solid #000;
	}

.step dl dd > strong+p
	{
	margin: 0.5rem 0 3rem 0;
	}

.step dl dd > strong+p b
	{
	font-weight: bold;
	border-bottom: 1px solid #000;
	}

.step dl dd .step1_size
	{
	margin-bottom: 5rem;
	}

.step dl dd .step1_size table
	{
	width: 100%;
	}

.step dl dd .step1_size table th
	{
	padding: 1rem;
	border: 1px solid #ccc;
	text-align: center;
	}

.step dl dd .step1_size table td
	{
	padding: 1rem;
	border: 1px solid #ccc;
	}

.step dl dd .step1_size table td
	{
	vertical-align: middle;
	}

.step dl dd .step1_size table td:last-child
	{
	background: #e9e9e9;
	text-align: center;
	}

.step .center
	{
	text-align: center;
	}

.step .d_size
	{
	margin: 0 2rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}

.step .d_size:after
	{
	content: "";
	width: 23%;
	}

.step .d_size li
	{
	width: 23%;
	text-align: center;
	margin-bottom: 1rem;
	border: 1px solid #ccc;
	background: #e9e9e9;
	cursor: pointer;
	}

.step .w_size
	{
	margin-top: 1rem;
	}

.step .select
	{
	padding: 0 1rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}

.step .select:after
	{
	content: "";
	width: 32%;
	}

.step .select .li
	{
	margin-bottom: 2rem;
	display: none;
	}

.step .select .active
	{
	
	display: block;
	}

.step .select li label
	{
	padding: 1rem;
display: flex;
   flex-direction: column;
	}

.step .select li p
	{
	font-size: 0.8em;
	}

.step .select li span
	{
	margin-top: 1rem;
	display: block;
	text-align: right;
	font-size: 0.8em;
	}

.step .select li span em
	{
	font-size: 1.2em;
	font-style: normal;
	color: #c00001;
	font-weight: bold;
	}


.result
	{
	text-align: center;
	}

.result em
	{
	color: #c00001;
	font-size: 2em;
	font-style: normal;
	}

.buybtn
	{
margin-bottom: 2rem;
text-align: center;
	}

.buybtn button
	{
	color: #fff;
	padding: 1rem 2rem;
	background: #c00001;
	}



@media screen and (max-width:1024px) {

img
	{
	width: 100%;
	}

.step
	{
	width: 100%;
	}

.step .txt
	{
	margin-bottom: 2rem;
	}

img+.txt
	{
	font-size: 1em;
	margin: 2rem 1rem 0rem 1rem;
	padding-bottom: 2rem;
	}

.step li
	{
	width: 49%;
	padding: 0%
	}


.step dl dt
	{
	text-align: left;
	color: #fff;
	padding: 1rem;
	font-size: 1em;
	}



.step dl dd
	{
	padding: 1rem 1rem 5rem 1rem;
	}

.step dl dd > strong
	{
	font-size: 1em;
	}

.step dl dd > strong+p
	{
	margin: 0.5rem 0 3rem 0;
	font-size: 0.8em;
	}

.step dl dd .step1_size
	{
	margin-bottom: 5rem;
	}

.step dl dd .step1_size table
	{
	width: 100%;
	}

.step dl dd .step1_size table th
	{

	font-size: 0.8em;
	}

.step dl dd .step1_size table td
	{
	font-size: 0.7em;
	}



.step .d_size
	{
	margin: 0 0rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}

.step .d_size li
	{
	width: 49%;
	font-size: 0.8em;
	padding: 0.5rem 0;
	}

.step .w_size
	{
	margin-top: 1rem;
	}

.step .select
	{
	padding: 0 1rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	}

.step li
	{
	margin-bottom: 1rem;
	}

.step .select li p
	{
	font-size: 0.8em;
	}

.step .select li span
	{
	margin-top: 1rem;
	display: block;
	text-align: right;
	font-size: 0.8em;
	}

.step .select li span em
	{
	font-size: 1.2em;
	font-style: normal;
	color: #c00001;
	font-weight: bold;
	}


.result
	{
	text-align: center;
	}

.result em
	{
	color: #c00001;
	font-size: 2em;
	font-style: normal;
	}

.buybtn
	{
margin-bottom: 2rem;
text-align: center;
	}

.buybtn button
	{
	color: #fff;
	padding: 1rem 2rem;
	background: #c00001;
	}


}



.all_price
	{
	position: fixed;
	bottom: 5%;
	right: 0%;
	}
body
	{
	padding-bottom: 8rem;
	}

@media screen and (max-width:1200px) {

.all_price
	{
	position: fixed;
	bottom: 0% !important;
	left: 0%;
	display: flex;
	justify-content: space-between;
	flex-wrap:wrap;
font-size: 0.8em !important;

align-items: top;
background: #fff;
	}

.result
	{
	margin-top: -0.5rem;
	}

}