@charset "utf-8";
/**=========================================
 * NAME:states.css
 * OUTLINE:各javascriptで使用するスタイルを記述
 *
 * 1.imgClip
 * 2.nextMansionDisplay
 * 3.atlasLifeBgChange
 * 4.mainVisual
 =========================================*/

/**=========================================
 * 1.imgClip
 * * utile.jsのimgClipで使用するスタイルを記述
 =========================================*/
 .triger_imgClip{
 	display:block;
 	top:0px;
 	left:0px;
 	width:100%;
 	height:100%;
 }

 .target_imgClip-wrapper {
 	opacity:0.7;
 	filter: alpha(opacity=70);
 	-ms-filter: "alpha(opacity=70)"; 
 	-moz-opacity:0.7;
 	-khtml-opacity: 0.7;
 	zoom:1;
 }

 @media screen and (max-width:640px) {
    .target_imgClip-wrapper{
    	display:none;
    }
}

/**=========================================
 * 2.nextMansionDisplay
 * * index.jsのnextMansionDisplayで使用するスタイルを記述
 =========================================*/
.mansion_nonDisplay{
    display:none;
}


/**=========================================
 * 3.atlasLifeBgChange
 * * atlas-life.jsのatlasLifeBgChangeで使用するスタイルを記述
 =========================================*/
.life_top-slider{
    -webkit-transition  : -webkit-transform 6000ms cubic-bezier(0,0,1,1);
    -moz-transition     : -moz-transform 6000ms cubic-bezier(0,0,1,1);
    -ms-transition      : -ms-transform 6000ms cubic-bezier(0,0,1,1);
    -o-transition       : -o-transform 6000ms cubic-bezier(0,0,1,1);
    transition          : transform 6000ms cubic-bezier(0,0,1,1);

    -moz-transform: translateX(-100px);
    -webkit-transform: translateX(-100px);
    -o-transform: translateX(-100px);
    -ms-transform: translateX(-100px);
    transform: translateX(-100px);
}


.life_top-fadeIn{
    filter: alpha(opacity=100) !important;
    -moz-opacity: 1.0 !important;
    opacity: 1.0 !important;

    -webkit-transition  : opacity 1000ms cubic-bezier(0,0,1,1);
    -moz-transition     : opacity 1000ms cubic-bezier(0,0,1,1);
    -ms-transition      : opacity 1000ms cubic-bezier(0,0,1,1);
    -o-transition       : opacity 1000ms cubic-bezier(0,0,1,1);
    transition          : opacity 1000ms cubic-bezier(0,0,1,1);
}

.life_top-fadeOut{
    filter: alpha(opacity=0) !important;
    -moz-opacity: 0 !important;
    opacity: 0 !important;

    -webkit-transition  : opacity 1000ms cubic-bezier(0,0,1,1);
    -moz-transition     : opacity 1000ms cubic-bezier(0,0,1,1);
    -ms-transition      : opacity 1000ms cubic-bezier(0,0,1,1);
    -o-transition       : opacity 1000ms cubic-bezier(0,0,1,1);
    transition          : opacity 1000ms cubic-bezier(0,0,1,1);
}

/**=========================================
 * 4.mainVisual
 * * index.jsのmainVisualで使用するスタイルを記述
 =========================================*/
.main_visual-fadeIn{
    filter: alpha(opacity=100) !important;
    -moz-opacity: 1.0 !important;
    opacity: 1.0 !important;

    -webkit-transition  : opacity 1000ms cubic-bezier(0,0,1,1);
    -moz-transition     : opacity 1000ms cubic-bezier(0,0,1,1);
    -ms-transition      : opacity 1000ms cubic-bezier(0,0,1,1);
    -o-transition       : opacity 1000ms cubic-bezier(0,0,1,1);
    transition          : opacity 1000ms cubic-bezier(0,0,1,1);
}

.main_visual-fadeOut{
    filter: alpha(opacity=0) !important;
    -moz-opacity: 0 !important;
    opacity: 0 !important;

    -webkit-transition  : opacity 1000ms cubic-bezier(0,0,1,1);
    -moz-transition     : opacity 1000ms cubic-bezier(0,0,1,1);
    -ms-transition      : opacity 1000ms cubic-bezier(0,0,1,1);
    -o-transition       : opacity 1000ms cubic-bezier(0,0,1,1);
    transition          : opacity 1000ms cubic-bezier(0,0,1,1);
}