.cp_tab *,
.cp_tab *:before,
.cp_tab *:after {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.cp_tab {
	margin: 2em auto;
}

.cp_tab>input[type='radio'] {
	margin: 0;
	padding: 0;
	border: none;
	border-radius: 0;
	outline: none;
	background: none;
	-webkit-appearance: none;
	appearance: none;
	display: none;
}

.cp_tab .cp_tabpanels {
	position: relative;
	min-height: 2700px;
	/* エリアの高さ */
}

.cp_tab .cp_tabpanel {
	position: absolute;
	width: 100%;
	opacity: 0;
	padding: 2%;
	transform: translateY(-10px);
	-webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
	transition: opacity 0.5s, -webkit-transform 0.5s;
	transition: transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s, -webkit-transform 0.5s;
}

.cp_tab>input:first-child:checked~.cp_tabpanels>.cp_tabpanel:first-child,
.cp_tab>input:nth-child(3):checked~.cp_tabpanels>.cp_tabpanel:nth-child(2),
.cp_tab>input:nth-child(5):checked~.cp_tabpanels>.cp_tabpanel:nth-child(3),
.cp_tab>input:nth-child(7):checked~.cp_tabpanels>.cp_tabpanel:nth-child(4),
.cp_tab>input:nth-child(9):checked~.cp_tabpanels>.cp_tabpanel:nth-child(5),
.cp_tab>input:nth-child(11):checked~.cp_tabpanels>.cp_tabpanel:nth-child(6) {
	opacity: 1;
	transform: translateY(0px);
}

.cp_tab>input:first-child:checked~.cp_tabpanels>.cp_tabpanel:first-child {
	background-image: url("/contents/other/uchuunotane2021/images/redback.png");

	background-size: 100%;
	border-radius: 0px 20px 20px 20px;
}

.cp_tab>input:nth-child(3):checked~.cp_tabpanels>.cp_tabpanel:nth-child(2) {
	background-image: url("/contents/other/uchuunotane2021/images/skyback.png");
	background-size: 100%;
	border-radius: 0px 20px 20px 20px;
}

.cp_tab>input:nth-child(5):checked~.cp_tabpanels>.cp_tabpanel:nth-child(3) {
	background-image: url("/contents/other/uchuunotane2021/images/greenback.png");
	background-size: 100%;
	border-radius: 0px 20px 20px 20px;
}

.cp_tab>input:nth-child(7):checked~.cp_tabpanels>.cp_tabpanel:nth-child(4) {
	background-image: url("/contents/other/uchuunotane2021/images/yelloback.png");
	background-size: 100%;
	border-radius: 0px 20px 20px 20px;
}

.cp_tab>input:nth-child(9):checked~.cp_tabpanels>.cp_tabpanel:nth-child(5) {
	background-image: url("/contents/other/uchuunotane2021/images/purple.png");
	background-size: 100%;
	border-radius: 0px 20px 20px 20px;
}

.cp_tab>input:nth-child(3):checked~.cp_tabpanels>.cp_tabpanel:nth-child(5) {
	background-image: background: #0066CC;
}

.cp_tab>input:nth-child(5):checked~.cp_tabpanels>.cp_tabpanel:nth-child(6) {
	background: #0066CC;
}

.cp_tab>input:nth-child(7):checked~.cp_tabpanels>.cp_tabpanel:nth-child(7) {
	background: #0066CC;
}

}

.cp_tab>input:nth-child(9):checked~.cp_tabpanels>.cp_tabpanel:nth-child(9) {
	background: #0066CC;
}


.cp_tab>input:nth-child(3):checked~.cp_tabpanels>.cp_tabpanel:nth-child(8) {
	background: #0066CC;
}

.cp_tab>input:nth-child(5):checked~.cp_tabpanels>.cp_tabpanel:nth-child(9) {
	background: #0066CC;
}

.cp_tab>input:nth-child(7):checked~.cp_tabpanels>.cp_tabpanel:nth-child(10) {
	background: #0066CC;
}

.cp_tab>label {
	position: relative;
	display: inline-block;
	padding: 5px 10px;
	cursor: pointer;
	border-radius: 6px 6px 0 0;
	font-weight: bold;
}

.cp_tab>input:first-child+label {
	background: #FF0000;

}

.cp_tab>input:nth-child(3)+label {
	background: #1E90FF;
}

.cp_tab>input:nth-child(5)+label {
	background: #006400;
}

.cp_tab>input:nth-child(7)+label {
	background: #FFA500;
}

.cp_tab>input:nth-child(9)+label {
	background: #ff1ab3;
}

.cp_tab>label:hover {
	color: #00000;
}

.cp_tab>input:focus+label {
	color: #00000;
}

.cp_tab>input:checked+label {
	margin-bottom: -1px;
}

@media (max-width: 480px) {
	.cp_tab {
		width: 100%;
		font-size: 0.8em;
	}

	.cp_tab label {
		padding: 0.5em;
	}
}

.cp_button {
	width: 300px;
	margin: 0.4em;
	padding: 1em;
	line-height: 1.4;
	cursor: pointer;
	user-select: none;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	color: #ffffff;
	border: 1px solid #29b6f6;
	background-color: 0396c4;
	repeating-linear-gradient(-45deg, #fff, #fff 7px, transparent 0, transparent 14px);
	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.cp_button:before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	content: '';
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-property: top right bottom left;
	transition-property: top right bottom left;
	border: rgba(41, 182, 246, 0.5) solid 4px;
}

.cp_button:hover:before {
	top: -8px;
	right: -8px;
	bottom: -8px;
	left: -8px;
	opacity: 1;
}

.cp_button:active {
	color: #ffffff;
	background-color: #0288d1;
}

.cp_button:active:before {
	top: -3px;
	right: -3px;
	bottom: -3px;
	left: -3px;
}

.cp_button:focus:hover,
.cp_button:focus,
.cp_button:active:hover,
.cp_button:hover {
	color: #ffffff;
	border: 1px solid #29b6f6;
}






.sample-box {
	position: relative;
}

.good {
	width: auto;
	height: auto;
	color: #;
	background-color: ;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.5rem;
	border-radius: 50%;
	cursor: pointer;

	position: absolute;
	top: 0;
	left: 0;
}

.huwahuwa {
	animation-name: fuwari;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-duration: 3.5s;
}

@keyframes fuwari {
	0% {
		transform: translate(0, 10px);
	}

	100% {
		transform: translate(0, -10px)
	}
}

.huwahuwa2 {
	animation-name: fuwari2;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-duration: 3.5s;
}

@keyframes fuwari2 {
	0% {
		transform: translate(0, -5px);
	}

	100% {

		transform: translate(0, 5px)
	}
}

.memo {
	background-image: url(/contents/other/uchuunotane2021/images/memo.png);
	background-size: 100%;
	padding: 2% 5%;
	border-radius: 20px;
}


.list_crown {
	list-style: none;
}

.list_crown>li {
	position: relative;
	padding: 0px 0px 0px 2.5em;
	color: #3388dd;
	font-size: 18px;
}

.list_crown>li::before,
.list_crown>li::after {
	position: absolute;
	left: 0px;
	width: 0px;
	height: 0px;
	content: "";
}

.list_crown>li::before {
	top: -1.25em;
	border: 1em solid transparent;
	border-bottom: 1.5em solid currentColor;
}

.list_crown>li::after {
	top: 0.25em;
	border: 0.5em solid transparent;
	border-left: 1em solid currentColor;
	border-right: 1em solid currentColor;
}

.list_crown>li:nth-of-type(1) {
	color: #dbb400;
}

.list_crown>li:nth-of-type(2) {
	color: #9fa0a0;
}

.list_crown>li:nth-of-type(3) {
	color: #c47022;
}