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


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

/* SPACE and EDIT */
#subpage .kaeru-box .indention {background:url(../image/indention_bg.gif) center center !important;}
#subpage .kaeru-box .embedded {background:url(../image/edit_bg.gif) center center !important;}
#subpage .kaeru-box .pc_table { margin-bottom:20px; padding:20px 0; background:url(../image/table_pc.gif);}
#subpage .kaeru-box .sm_table { display:block !important; margin-bottom:20px; padding:20px 0; background:url(../image/table_sm.gif);}
#subpage .kaeru-box table.hyou .sm_mid { display:block; padding:20px 0; background:url(../image/table_tit.gif);} 
#subpage .kaeru-box .fix_table { display:block; padding:20px 0; background:url(../image/table_fix.gif);} 
#subpage .kaeru-box ul.zu li.photo.pc { display:block !important; padding:20px 0; background:url(../image/zu_pc.gif);}
#subpage .kaeru-box ul.zu li.photo.sm { display:block !important; padding:20px 0; background:url(../image/zu_sm.gif);}

/* PHOTO INPUT */
.kaeru-box .photo-r,
.kaeru-box .photo-l,
.kaeru-box .photo {position:relative !important;}
.kaeru-box .photo-r input,
.kaeru-box .photo-l input,
.kaeru-box .photo input { position:absolute !important; z-index:9999 !important;}
.kaeru-box .photo-r input {top:0 !important; left:20px !important;}
.kaeru-box .photo-l input {top:0 !important; left:0 !important;}
.kaeru-box .photo input {top:0 !important; left:0 !important;}

/* FLOAT */
#subpage .parent_col2 { clear:none; float:left; width:50%; }
#subpage .parent_col3 { clear:none; float:left; width:33.3%; }
#subpage .parent_col4 { clear:none; float:left; width:25%;}
#subpage .parent_col5 { clear:none; float:left; width:20%;}
#subpage .parent_col6 { clear:none; float:left; width:16.66%;}
#subpage .kaeru-box.clear_box { clear:none !important; float:none !important; width:100% !important;}

#subpage .kaeru-box .box2,
#subpage .kaeru-box .link,
#subpage .kaeru-box .file,
#subpage .kaeru-box .photo_box,
#subpage .kaeru-box .b2,
#subpage .kaeru-box .b3 { float:none !important; margin:10px 20px; width:auto !important;}
#subpage .kaeru-box .temple-box .box2 {float:left !important; margin:20px 2%; width:46%;}
#subpage .kaeru-box .temple-box ul.g2 {float:left !important; margin:20px 2%; width:46%;}
#subpage .kaeru-box .temple-box ul.g3 {float:left !important; margin:20px 2%; width:29.3%;}
#subpage .kaeru-box .temple-box ul.g4 {float:left !important; margin:20px 2%; width:21%;}
#subpage .kaeru-box .temple-box ul.g5 {float:left !important; margin:20px 2%; width:16%;}
#subpage .kaeru-box .temple-box .col2 {float:left !important; margin:20px 2%; width:46%;}
#subpage .kaeru-box .temple-box .col3 {float:left !important; margin:20px 2%; width:29.3%;}
#subpage .kaeru-box .temple-box .col4 {float:left !important; margin:20px 2%; width:21%;}
#subpage .kaeru-box .temple-box .col5 {float:left !important; margin:20px 2%; width:16%;}

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

/* SLIDE */
.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-kaeru { position:static !important; overflow:inherit;}
.mainimg .kaeru-box { clear:none !important;}
.mainimg .kaeru-box:hover:before,
.mainimg .kaeru-box:hover:after {  display: none;}
.mainimg .kaeru-box table.t-kaeru { display:block !important;}


/*---------------------------------------------------------------------------
  NEW NEW KAERU
---------------------------------------------------------------------------*/
/* KAERU */
.kaeru-box {
	clear:both;
	padding:4px 0;
	position:relative;
	background:#FFF;
	border-radius: 5px;
}
.kaeru-box:hover { z-index:9;}
.kaeru-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;
}
.kaeru-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;
	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;
}
.kaeru-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-kaeru { 
	/*
	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;
	z-index:99;
	overflow: hidden;
}
table.t-kaeru,
table.t-kaeru tr,
table.t-kaeru td {margin:0; padding:0; background:#000 !important;}
table.t-kaeru tr td input {  /*display:block; margin:0; padding:0;*/ width:30px; height:30px;}
table.t-kaeru tr td input:hover { opacity: 0.5; filter: alpha(opacity=50); -moz-opacity: 0.5;}

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