﻿#subpage .ani-box {}
#subpage table.t-ani { clear:both; text-align:center;}
.ani-box:hover table.t-ani  { position:relative; z-index:9999;}
/*　かえるくんプレビュー画面用　*/
#content {}
#subpage {}

/*---------------------------------------------------------------------------
  KAERU COMMON
---------------------------------------------------------------------------*/

#mainimg  { }
#mainimg ul li{ position:relative !important;}
#mainimg ul li input { position:absolute !important; top:0 !important; left:20px !important; z-index:999999;}
#mainimg table.t-ani { position:static !important; overflow:inherit;}
#mainimg .ani-box { clear:none !important;}
#mainimg .ani-box:hover:before,
#mainimg .ani-box:hover:after {  display: none;}
#mainimg .ani-box table.t-ani { display:block !important;}

#subpage .ani-box p.indention { background:url(../image/indention_bg.gif) center center;}
#subpage .ani-box .pc_table { margin-bottom:20px; padding:20px 0; background:url(../image/table_pc.gif);}
#subpage .ani-box .sm_table { display:block !important; margin-bottom:20px; padding:20px 0; background:url(../image/table_sm.gif);}
#subpage .ani-box table.hyou .sm_mid { display:block; padding:20px 0; background:url(../image/table_tit.gif);} 
#subpage .ani-box .fix_table { display:block; padding:20px 0; background:url(../image/table_fix.gif);} 

/* PHOTO INPUT */
.ani-box .photo-r,
.ani-box .photo-l,
.ani-box .photo {position:relative !important;}
.ani-box .photo-r input,
.ani-box .photo-l input,
.ani-box .photo input { position:absolute !important; z-index:9999 !important;}
.ani-box .photo-r input {top:0 !important; left:20px !important;}
.ani-box .photo-l input {top:0 !important; left:0 !important;}
.ani-box .photo input {top:0 !important; left:0 !important;}
#mainphoto ul li{ position:relative !important;}
#mainphoto ul li input { position:absolute !important; top:0 !important; left:20px !important; z-index:999999;}
#content #tit .tit_img  input { position:absolute !important; top:0 !important; left:0 !important; z-index:999999;}

/* SPACE and EDIT */
#subpage .ani-box .indention {background:url(../image/indention_bg.gif) center center !important;}
#subpage .ani-box .embedded {background:url(../image/edit_bg.gif) center center !important;}


/* FLOAT */
#subpage .parent_box2 { clear:none; float:left; width:50%; }
#subpage .parent_link2 { clear:none; float:left; width:50%; }
#subpage .parent_link3 { clear:none; float:left; width:33.3%; }
#subpage .parent_link4 { clear:none; float:left; width:25%;}
#subpage .parent_file2 { clear:none; float:left; width:50%; }
#subpage .parent_file3 { clear:none; float:left; width:33.3%; }
#subpage .parent_file4 { clear:none; float:left; width:25%;}
#subpage .parent_g1 { clear:none; float:left; width:100%;}
#subpage .parent_g2 { clear:none; float:left; width:50%;}
#subpage .parent_g3 { clear:none; float:left; width:33.3%;}
#subpage .parent_g4 { clear:none; float:left; width:25%;}
#subpage .parent_g5 { clear:none; float:left; width:20%;}
#subpage .parent_b2 { clear:none; float:left; width:50%; }
#subpage .parent_b3 { clear:none; float:left; width:33.3%;}

#subpage .ani-box .box2,
#subpage .ani-box .link2,
#subpage .ani-box .link3,
#subpage .ani-box .link4,
#subpage .ani-box .file2,
#subpage .ani-box .file3,
#subpage .ani-box .file4,
#subpage .ani-box ul.g1,
#subpage .ani-box ul.g2,
#subpage .ani-box ul.g3,
#subpage .ani-box ul.g4,
#subpage .ani-box ul.g5,
#subpage .ani-box .b2,
#subpage .ani-box .b3 { float:none !important; margin:10px 20px; width:auto;}

#subpage .ani-box ul.g1:after,
#subpage .ani-box ul.g2:after,
#subpage .ani-box ul.g3:after,
#subpage .ani-box ul.g4:after,
#subpage .ani-box ul.g5:after,
#subpage .ani-box .b2:after,
#subpage .ani-box .b3:after { /*float_clear*/ display:block; clear:both; content:"";}


/*---------------------------------------------------------------------------
  NEW NEW KAERU
---------------------------------------------------------------------------*/
/* KAERU */
.ani-box {
	clear:both;
	padding:4px 0;
	position:relative;
	background:#FFF;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}
.ani-box:hover { z-index:9;}
.ani-box:hover:before {
	display:block;
	clear:both;
	content:"";
	position:absolute;
	top: 0;
	left: 0;
	width:100%;
	height:100%;
	box-sizing: border-box;
	border:4px solid #000;
	border-radius: 5px; /* CSS3 */
	-webkit-border-radius: 5px; /* Safari,Google Chrome */
	-moz-border-radius: 5px;/* Firefox */
}
.ani-box:hover:after { 
	display:block;
	clear:both;
	content:"";
	cursor:move;
	position:absolute;
	top:0;
	left:0;
	z-index:0;
	width:60px;
	height:60px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	overflow:hidden;
	text-indent:-9999px;
	background:rgba(0,0,0,0.50) url(../image/pt_move.png) no-repeat left top;
	background-size: 100% auto;
}
.ani-box input { position: relative; z-index:9 !important;}
.sort-placeholder {
	position: relative;
	float: left;
	background:#202C31;
	border: 1px dashed #FFF;
	box-sizing: border-box;
}


/* KAERU_BOTTON */
table.t-ani { 
	/*
	top:-4px;
	left:-16px;
	margin:0;
	padding:0;
	width: 30px;
	text-align:center;
	*/
	position:absolute !important;
	margin: auto !important;
	top:-31px;
	left: 0;
	right: 0;
	width:240px;
	height: 35px;
	background:#000 !important;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	z-index:99;
	overflow: hidden;
}
table.t-ani,
table.t-ani tr,
table.t-ani td {margin:0; padding:0; background:#000 !important;}
table.t-ani tr td input {  /*display:block; margin:0; padding:0;*/ width:30px; height:30px;}
table.t-ani tr td input:hover { opacity: 0.5; filter: alpha(opacity=50); -moz-opacity: 0.5;}

.b_move a:hover {width:100px; height:100px;}
.ani-box table.t-ani,
.ani-box .b_move { display:none;}
.ani-box:hover table.t-ani,
.ani-box:hover .b_move { display:block;}