@charset "UTF-8";

#wrapper{
	/*margin-top: 70px;*/
	margin-top: 35px;
	margin-bottom: 2em;
}
.main_box {
	margin-top:10px;
}
.main_box_header {
	width: 100%;
	height: 120px;
	background: url("../img/cylinder_heading_bg.jpg") no-repeat right center / cover;
	display: flex;
	align-items: center;
}
.main_box_header h2{
	padding-left: 1em;
}
#step00_subtitle {
	width: 100%;
	padding-left: 1em;
	margin-top: 35px;
	display: flex;
	align-items: center;
}
@media screen and (max-width: 1800px) {
	#wrapper{
		/*margin-top: 3.8%;*/
		margin-top: 1.9%;
	}
	#step00_subtitle{
		margin-top: 1.9%;
	}
	.main_box_header {
		height: 6.66vw;
	}
}
@media screen and (max-width: 800px) {
	.main_box_header {
		height: 24vw;
		background: url("../img/cylinder_heading_bg_sp.jpg") no-repeat right bottom / contain;
		align-items: flex-start;
	}
}

.c-ulSelect{
	padding: 1.2em 1.5em;
}
.c-ulSelect > li{
	padding: 0.5em 1em;
	position: relative;
	overflow: hidden;
}
.c-ulSelect .toggleBtn{
	position: relative;
	padding-right: 1.7em;
	cursor: pointer;
}
.c-ulSelect .toggleBtn:after{
	content: '';
	position: absolute;
	top: -0.5em;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 0.7em;
	height: 0.7em;
	border-left: 0.2em solid var(--maincolor);
	border-top: 0.2em solid var(--maincolor);
	transition: 0.2s;
	transform: rotate(-135deg);

}
.c-ulSelect .open > .toggleBtn:after{
	top: 0.5em;
	transform: rotate(45deg);
}
/* add 2026.01.08 */
.c-ulSelect .toggleBtnParent{
	cursor: pointer;
}
.c-ulSelect .toggleIcon{
	position: relative;
	padding-right: 1.7em;
	cursor: pointer;
}
.c-ulSelect .toggleIcon:after{
	content: '';
	position: absolute;
	top: -0.5em;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 0.7em;
	height: 0.7em;
	border-left: 0.2em solid var(--maincolor);
	border-top: 0.2em solid var(--maincolor);
	transition: 0.2s;
	transform: rotate(-135deg);

}
.c-ulSelect .open > .toggleIcon:after{
	top: 0.5em;
	transform: rotate(45deg);
}
/* /add 2026.01.08 */
.c-ulSelect .toggleContents{
	display: none;
	padding-left: 3%;
	margin-top: 0.5em;
	position: relative;
	z-index: 2;
}
.c-ulSelect > li.open{
	/*background: linear-gradient(rgba(228, 244, 255,0),rgba(228, 244, 255,1));*/
}
.c-ulSelect input[type="checkbox"]{
	appearance: none;
}
.c-ulSelect input:checked + .txt{
	background: yellow;
}
.c-ulSelect label{
	cursor: pointer;
}
.c-ulSelect .img{
	position: absolute;
	right: 1%;
	bottom: 4%;
	max-width: 25%;
	opacity: 0;
	transform: translateX(-10%);
	transition: 0.5s;
	z-index: 1;
}
.c-ulSelect .open > .img{
	transition-delay: 0.2s;
	opacity: 1;
	transform: none;
}
@media screen and (max-width: 800px) {
	.c-ulSelect{
		padding: 1.2em 0;
		max-height: 80vw;
		overflow: auto;
	}
	.c-ulSelect > li > .toggleContents{
		padding-bottom: 22vw;
	}
}
.newIcon {
	vertical-align: middle;
}
.seresImage {
	margin-right: 1em;
}
.step00SeriesBlock {
	position: relative;
}
.step00SeriesBlock #selectedSeresImage {
	display: none;
	position: absolute;
	right: 0;
	top: 0;
	z-index:99;
}