@charset "utf-8";
*{
	padding:0px;
	margin:0px;
}

a
{
	color:inherit;
	text-decoration:none;
}


#view_tool
{
	position:relative;
	height:222px;
	overflow:hidden;
	z-index:10;
	background-color:#535353;
}

#class_open_view
{
	position:relative;
	text-align:center;
	color:#c2c2c2;
}

.menu_view
{
	position:relative;
	display:flex;
	justify-content:center;	
	background-color:#212326;
	border-top:1px solid #525252;
	border-bottom:1px solid #525252;
	z-index:11;
	display:none;
}

.contents_view
{
	position:relative;
	display:flex;
	justify-content:center;
	background-color:#2c2f34;
	border-top:1px solid #525252;
	border-bottom:1px solid #525252;
	top:0px;
	flex-direction:column;
	height:222px;
	box-sizing:border-box;
}

.menu_view > li
{
	display:flex;
	border-left:1px solid #c2c2c2;
	border-right:1px solid #c2c2c2;
	padding-top: 5px;
	padding-bottom: 5px;
	align-items: center;
    justify-content: center;
}

.contents_view>li
{
	display:flex;
	/*border-left:1px solid #c2c2c2;*/
	/*border-right:1px solid #c2c2c2;*/
	padding-top: 8px;
	padding-bottom: 8px;
	align-items: center;
    justify-content: center;
}

.contents_view:hover
{
	background-color:#363e31;
}
/*
#class_open_view>ul>li:nth-child(1)
{
	width:100px;
}

#class_open_view>ul>li:nth-child(3)
{
	width:220px;
}

#class_open_view>ul>li:nth-child(4)
{
	width:120px;
}

#class_open_view>ul>li:nth-child(5)
{
	width:100px;
}

#class_open_view>ul>li:nth-child(6)
{
	width:120px;
}
*/

/*
.contents_view>li:nth-child(3), .contents_view>li:nth-child(4), .menu_view > li:nth-child(3), .menu_view > li:nth-child(4)
{
	padding-left:25px;
	padding-right:25px;
}
*/
.contents_view a
{
	opacity:0;
	
}
/*
#class_open_view>ul:nth-child(2) > li>a
{
	position:relative;
	animation:view_style 1s ease-in-out 1;
	
}

#class_open_view>ul:nth-child(3) > li>a
{
	position:relative;
	animation:view_style 1s ease-in-out 1;
	animation-delay:1s;
	
}

*/


.add_animation
{
	animation:view_style 1s ease-in-out 1;
}

@keyframes view_style{
	0%{
		transform:translate(0px, 60px);
	}
	100%{
		transform:translate(0px, 0px);
	}
}