@charset:"UTF-8";

*{
	margin:0px;
	padding:0px;
}

/**{border:solid 1px red;}**/
/**=============================

	body

=============================**/

body {
	width:100%;
	min-width:1024px;
	height:auto;
	margin:0px;
	padding:0px;
	/**font-family: "Open Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	 -webkit-text-size-adjust: 100%;**/
	font-family: 'Nothing You Could Do', cursive;
	/*overflow:hidden;*/
	
}

/**=============================

	body終わり

=============================**/






/**=============================

	 jQuery 

=============================**/
/**=============================

	jQuery inview 導入

===============================**/


    /*----- フェードイン -----*/
    .inviewfadeIn {
        opacity: 0;
        transition: .8s;
    }
    
    .fadeIn {
        opacity: 1.0;
    }

    /*----- 上へスライド -----*/
    .inviewUp {
        transform: translate(0, 40px);
        -webkit-transform: translate(0, 40px);
        transition: .8s;
    }
    
    .Up {
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }

    /*----- ズームイン -----*/
    .inviewzoomIn {
        transform: scale(0, 0);
        -webkit-transform: scale(0, 0);
        transition: .8s;
    }
    
    .zoomIn {
        transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
    } 
    
    /*----- フェードインしながら上へスライド -----*/
    .inviewfadeInUp {
        opacity: 0;
        transform: translate(0, 60px);
        -webkit-transform: translate(0, 60px);
        transition: .8s;
    }
    
    .fadeInUp {
        opacity: 1.0;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }

    /*----- フェードイン -----*/
    .inviewfadeIn {
        opacity: 0;
        transition: .8s;
    }
    
    .fadeIn {
        opacity: 1.0;
    }
 
    /*----- 上へスライド -----*/
    .inviewUp {
        transform: translate(0, 40px);
        -webkit-transform: translate(0, 40px);
        transition: .8s;
    }
    
    .Up {
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }
 
    /*----- ズームイン -----*/
    .inviewzoomIn {
        transform: scale(0, 0);
        -webkit-transform: scale(0, 0);
        transition: .8s;
    }
    
    .zoomIn {
        transform: scale(1, 1);
        -webkit-transform: scale(1, 1);
    } 
    
    /*----- フェードインしながら上へスライド -----*/
    .inviewfadeInUp {
        opacity: 0;
        transform: translate(0, 60px);
        -webkit-transform: translate(0, 60px);
        transition: .8s;
    }
    
    .fadeInUp {
        opacity: 1.0;
        transform: translate(0, 0);
        -webkit-transform: translate(0, 0);
    }

/**=============================

	jQuery inview 

===============================**/

/************************************
  ローディング　CSS
  
************************************/
#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #fff;
	z-index: 999;
}
#loader {
	display: none;
	position: fixed;
	top: 50%;
	left: 45%;
	width: 200px;
	height: 200px;
	margin-top: -100px;
	margin-left: -100px;
	text-align: center;
	color: #fff;
	z-index: -3;
}
/***************テキストローディングアニメーション***************/
#loader img {
	width:600px;
	height:300px;
	margin-left:-150px;
	margin-top:-100px;

}
.loadings {text-align:center;}
.loadings span {
	font-size:1em;
	top:10px;
	left:50px;
	
	position:relative;
	color:#1cc;
	padding:0 0.2em;
	visibility:hidden;

opacity:0;
-webkit-animation:load 3s ease-in-out;
-moz-animation:load 3s ease-in-out;
-ms-animation:load 3s ease-in-out;
-o-animation:load 3s ease-in-out;
animation:load 3s ease-in-out;
-webkit-animation-iteration-count:infinite;
-moz-animation-iteration-count:infinite;
-ms-animation-iteration-count:infinite;
-o-animation-iteration-count:infinite;
animation-iteration-count:infinite;
}

.loadings span:nth-of-type(1) {
-webkit-animation-delay:0s;
-moz-animation-delay:0s;
-ms-animation-delay:0s;
-o-animation-delay:0s;
animation-delay:0s;
}
.loadings span:nth-of-type(2) {
-webkit-animation-delay:0.2s;
-moz-animation-delay:0.2s;
-ms-animation-delay:0.2s;
-o-animation-delay:0.2s;
animation-delay:0.2s;
}
.loadings span:nth-of-type(3) {
-webkit-animation-delay:0.4s;
-moz-animation-delay:0.4s;
-ms-animation-delay:0.4s;
-o-animation-delay:0.4s;
animation-delay:0.4s;
}
.loadings span:nth-of-type(4) {
-webkit-animation-delay:0.6s;
-moz-animation-delay:0.6s;
-ms-animation-delay:0.6s;
-o-animation-delay:0.6s;
animation-delay:0.6s;
}
.loadings span:nth-of-type(5) {
-webkit-animation-delay:0.8s;
-moz-animation-delay:0.8s;
-ms-animation-delay:0.8s;
-o-animation-delay:0.8s;
animation-delay:0.8s;
}
.loadings span:nth-of-type(6) {
-webkit-animation-delay:1s;
-moz-animation-delay:1s;
-ms-animation-delay:1s;
-o-animation-delay:1s;
animation-delay:1s;
}
.loadings span:nth-of-type(7) {
-webkit-animation-delay:1.2s;
-moz-animation-delay:1.2s;
-ms-animation-delay:1.2s;
-o-animation-delay:1.2s;
animation-delay:1.2s;
}

@-webkit-keyframes load {
0% {visibility:hidden; opacity:0; text-shadow:none;}
50% {visibility:visible; opacity:1; text-shadow:0 1px 8px #1cc, 0 -1px 8px #1cc;}
100% {visibility:hidden; opacity:0; text-shadow:none;}
}
@-moz-keyframes load {
0% {visibility:hidden; opacity:0; text-shadow:none;}
50% {visibility:visible; opacity:1; text-shadow:0 1px 8px #1cc, 0 -1px 8px #1cc;}
100% {visibility:hidden; opacity:0; text-shadow:none;}
}
@-ms-keyframes load {
0% {visibility:hidden; opacity:0; text-shadow:none;}
50% {visibility:visible; opacity:1; text-shadow:0 1px 8px #1cc, 0 -1px 8px #1cc;}
100% {visibility:hidden; opacity:0; text-shadow:none;}
}
@-o-keyframes load {
0% {visibility:hidden; opacity:0; text-shadow:none;}
50% {visibility:visible; opacity:1; text-shadow:0 1px 8px #1cc, 0 -1px 8px #1cc;}
100% {visibility:hidden; opacity:0; text-shadow:none;}
}
@keyframes load {
0% {visibility:hidden; opacity:0; text-shadow:none;}
50% {visibility:visible; opacity:1; text-shadow:0 1px 8px #1cc, 0 -1px 8px #1cc;}
100% {visibility:hidden; opacity:0; text-shadow:none;}
}



/************************************
  ローディング　CSSここまで
  
************************************/




/**==========================================================

	　　　　　　　　　レイアウト 記述　ここから

==========================================================**/

#wrap {
	width:100%;
	min-width:1024px;
	height:auto;
	background-image:url("../img/42673286_176348013279778_2657272862758404096_o.jpg");
	background-attachment:fixed;
	/**background-repeat:no-repeat;**/
	background-size: cover;
	-moz-background-size:100% 100%;
	background-size:100% 100%
	position:relative;
	overflow:hidden;
	
	
}
#hed {
	width:100%;
	min-width:1024px;
	height:700px;
	/**border-bottom:solid 1px #e5e5e5;**/
	/**background-color:pink;**/
	background-image:url(../backimg/check_img.png);
	border-bottom: solid 1px #69696952;

}

#sectionA {
	width:100%;
	min-width:1024px;
	height:700px;
	background-image:url(../backimg/check_img.png);
}



#top {
	width:100%;
	min-width:1024px;
	height:80px;
	/**background-color:red;**/

}
/**=======================================**/



fixed {
    position: fixed;
    top: 0;
    width: 100%;
    /**z-index: 0;**/
}

#fixed {
	/**width:100%;**/
	min-width:1024px;
	height:54px;
	margin:0 auto;
	/**background-color:red;**/
	z-index:2;
}

/**=========================

  要素が　現れる　スライドダウン
  
===========================**/
@keyframes slideDown {
  0% {
    top: -56px;
  }
  100% {
    top: 0;
  }
}
.fixed {
    width: 100%;
    top: 24px;
    left:0px;
    z-index:1;
    background-color:#000;
    color:#fff;
    position: fixed;
    
     animation-name: slideDown;
     animation-timing-function: ease-in;
     animation-iteration-count: 1;
     animation-delay: 0s;
     transform-origin: 50% 50% 0;
     animation-duration: .5s;
  
/**=======================
	  box shadow
=========================**/
	box-shadow: 0px 6px 27px -12px #4c4c4c;
	border-radius: 0px;
	shadowColor: "#41423e", shadowOffset:{width:0,height:6;}, shadowOpacity:1, shadowRadius:27, borderWidth:1, borderColor:"#cccccc", borderRadius:6;
  
}

.fixed #block_B a {
	color: #fff;


} 

#fixedBox {
	width:1024px;
	height:54px;
	margin:0 auto;



}


/**=======================================**/


.top_bar_A {
	width:100%;
	min-width:1024px;
	height:25px;
	margin:0 auto;
	background-color:#000000;
	position: fixed;
	z-index:3;

}

.top_bar_A p {
	width: 1024px;
	height: 25px;
	margin: 0 auto;
	text-align: center;
	color: #fff;
	letter-spacing: 0.7pt;
	letter-spacing: 2.7pt;
	font-size: 0.2em;
	line-height: 18.2pt;
}

#top_Bar_B {
	width: 1024px;
	height: 200px;
	margin: 0 auto;
	/**background-color: red;**/

}

.block_A {
	width: 1024px;
	text-align: center;
	line-height: 124.2pt;
	font-size: 4.2vw;
	color: #000;
	height: 150px;
	float: left;
	 font-family: 'Questrial', sans-serif;
	font-family: 'Poiret One', cursive;


}



#test {
	width:1024px;
	height:115px;
	letter-spacing: 12.2pt;
	float:left;
	color:#fff;
	/**background-color:red;**/
	font-style:oblique;
	
	position: relative;
	/* Animation provies a slight random skew. Check bottom of doc
	for more information on how to random skew. */
	animation: glitch-skew 1s infinite linear alternate-reverse;
}
/* Our mixin positions a copy of our text
directly on our existing text, while
also setting content to the appropriate
text set in the data-text attribute. */

#test::before {
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	left: 2px;
	text-shadow: -2px 0 #ff00c1;
	/* Creates an initial clip for our glitch. This works in
	a typical top,right,bottom,left fashion and creates a mask
	to only show a certain part of the glitch at a time. */
	clip: rect(44px, 450px, 56px, 0);
	/* Runs our glitch-anim defined below to run in a 5s loop, infinitely,
	with an alternating animation to keep things fresh. */
	animation: glitch-anim 5s infinite linear alternate-reverse;
}
#test::after {
	content: attr(data-text);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	left: -2px;
	text-shadow: -2px 0 #00fff9, 5px 5px #ff00c1;
	animation: glitch-anim2 1s infinite linear alternate-reverse;
}

/* Creates an animation with 20 steaps. For each step, it calculates 
a percentage for the specific step. It then generates a random clip
box to be used for the random glitch effect. Also adds a very subtle
skew to change the 'thickness' of the glitch.*/
@keyframes glitch-anim {
  0% {
    clip: rect(49px, 9999px, 1px, 0);
    transform: skew(0.45deg);
  }
  5% {
    clip: rect(89px, 9999px, 95px, 0);
    transform: skew(0.05deg);
  }
  10% {
    clip: rect(71px, 9999px, 42px, 0);
    transform: skew(0.63deg);
  }
  15% {
    clip: rect(55px, 9999px, 20px, 0);
    transform: skew(0.73deg);
  }
  20% {
    clip: rect(22px, 9999px, 29px, 0);
    transform: skew(0.39deg);
  }
  25% {
    clip: rect(28px, 9999px, 10px, 0);
    transform: skew(0.86deg);
  }
  30% {
    clip: rect(47px, 9999px, 36px, 0);
    transform: skew(0.29deg);
  }
  35% {
    clip: rect(59px, 9999px, 77px, 0);
    transform: skew(0.09deg);
  }
  40% {
    clip: rect(40px, 9999px, 79px, 0);
    transform: skew(0.17deg);
  }
  45% {
    clip: rect(58px, 9999px, 25px, 0);
    transform: skew(0.84deg);
  }
  50% {
    clip: rect(60px, 9999px, 41px, 0);
    transform: skew(0.4deg);
  }
  55% {
    clip: rect(31px, 9999px, 37px, 0);
    transform: skew(0.58deg);
  }
  60% {
    clip: rect(37px, 9999px, 10px, 0);
    transform: skew(0.34deg);
  }
  65% {
    clip: rect(66px, 9999px, 76px, 0);
    transform: skew(0.22deg);
  }
  70% {
    clip: rect(21px, 9999px, 52px, 0);
    transform: skew(0.06deg);
  }
  75% {
    clip: rect(96px, 9999px, 5px, 0);
    transform: skew(0.86deg);
  }
  80% {
    clip: rect(70px, 9999px, 49px, 0);
    transform: skew(0.2deg);
  }
  85% {
    clip: rect(61px, 9999px, 93px, 0);
    transform: skew(0.32deg);
  }
  90% {
    clip: rect(53px, 9999px, 58px, 0);
    transform: skew(0.08deg);
  }
  95% {
    clip: rect(37px, 9999px, 59px, 0);
    transform: skew(0.74deg);
  }
  100% {
    clip: rect(82px, 9999px, 51px, 0);
    transform: skew(0.15deg);
  }
}
@keyframes glitch-anim2 {
  0% {
    clip: rect(73px, 9999px, 14px, 0);
    transform: skew(0.59deg);
  }
  5% {
    clip: rect(48px, 9999px, 37px, 0);
    transform: skew(0.51deg);
  }
  10% {
    clip: rect(1px, 9999px, 75px, 0);
    transform: skew(0.14deg);
  }
  15% {
    clip: rect(95px, 9999px, 99px, 0);
    transform: skew(0.96deg);
  }
  20% {
    clip: rect(15px, 9999px, 69px, 0);
    transform: skew(0.51deg);
  }
  25% {
    clip: rect(50px, 9999px, 19px, 0);
    transform: skew(0.99deg);
  }
  30% {
    clip: rect(84px, 9999px, 52px, 0);
    transform: skew(0.33deg);
  }
  35% {
    clip: rect(16px, 9999px, 60px, 0);
    transform: skew(0.64deg);
  }
  40% {
    clip: rect(23px, 9999px, 20px, 0);
    transform: skew(0.1deg);
  }
  45% {
    clip: rect(79px, 9999px, 40px, 0);
    transform: skew(0.59deg);
  }
  50% {
    clip: rect(69px, 9999px, 9px, 0);
    transform: skew(0.22deg);
  }
  55% {
    clip: rect(17px, 9999px, 33px, 0);
    transform: skew(0.17deg);
  }
  60% {
    clip: rect(85px, 9999px, 20px, 0);
    transform: skew(0.09deg);
  }
  65% {
    clip: rect(10px, 9999px, 32px, 0);
    transform: skew(0.88deg);
  }
  70% {
    clip: rect(27px, 9999px, 19px, 0);
    transform: skew(0.82deg);
  }
  75% {
    clip: rect(36px, 9999px, 62px, 0);
    transform: skew(0.33deg);
  }
  80% {
    clip: rect(11px, 9999px, 55px, 0);
    transform: skew(0.13deg);
  }
  85% {
    clip: rect(5px, 9999px, 24px, 0);
    transform: skew(0.51deg);
  }
  90% {
    clip: rect(12px, 9999px, 38px, 0);
    transform: skew(0.05deg);
  }
  95% {
    clip: rect(20px, 9999px, 77px, 0);
    transform: skew(0.49deg);
  }
  100% {
    clip: rect(72px, 9999px, 51px, 0);
    transform: skew(0.81deg);
  }
}
@keyframes glitch-skew {
  0% {
    transform: skew(1deg);
  }
  10% {
    transform: skew(3deg);
  }
  20% {
    transform: skew(-4deg);
  }
  30% {
    transform: skew(0deg);
  }
  40% {
    transform: skew(1deg);
  }
  50% {
    transform: skew(-1deg);
  }
  60% {
    transform: skew(4deg);
  }
  70% {
    transform: skew(0deg);
  }
  80% {
    transform: skew(5deg);
  }
  90% {
    transform: skew(4deg);
  }
  100% {
    transform: skew(-4deg);
  }
}
/**================================

	text-animation

==================================**/




.block_A small {
    width: 1024px;
    height: 25px;
    float: left;
    font-size: 12px;
    line-height: 19.2pt;
    font-weight: 900;
    letter-spacing: 6.2pt;
    color:#fff;
}

/************************************

	SNS ブロック

***************************************/
.sns {
    width: 230px;
    height: 25px;
    /**background-color: red;**/
    float: right;
    margin-right: 100px;
    margin-top: -25px;
}

.FB_like {
    width: 180px;/**　元の値 138px **/
    height: 21px;
    margin: 2px 1px 1px 1px;
    /**background-color: rebeccapurple;**/
}





/************************************

	SNS ブロックここまで

***************************************/



nav {
	width:1024px;
	height:50px;
	margin:0 auto;
	/**background-color:gray;**/
	/**float:left;**/


}
#multiscroll {
	list-style:none;


}

.nav_A {
	width:170px;
	height:50px;
	float:left;

}
.nav_A a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_A a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;

}
/**========================================**/
.nav_B {
	width:170px;
	height:50px;
	float:left;

}
.nav_B a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_B a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;
	

}
/**========================================**/
.nav_C {
	width:170px;
	height:50px;
	float:left;

}
.nav_C a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_C a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;

}
/**========================================**/
.nav_D {
	width:170px;
	height:50px;
	float:left;

}
.nav_D a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_D a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;

}
/**========================================**/
.nav_E {
	width:170px;
	height:50px;
	float:left;

}
.nav_E a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_E a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;

}

/**========================================**/
.nav_F {
	width:170px;
	height:50px;
	float:left;

}
.nav_F a {
	width: 170px;
	height: 50px;
	text-align: center;
	line-height: 37.7pt;
	letter-spacing: 3.2pt;
	text-decoration: none;
	display: block;
	color:#fff;


}

.nav_F a:hover {
	opacity:0.7;
	transition:0.7s;
	letter-spacing: 5.2pt;

}
/**========================================**/

#slid_Box {
	width:100%;
	min-width:1024px;
	height:500px;
	float:left;


}
.slider {
	width:1024px;
	height:500px;
	margin:0 auto;
	/**background-color: #0000006e;**/
}


/**=========================================================


			article　ここまで

============================================================**/

#art {
	width:100%;
	min-width:1024px;
	height:700px;
	float:left;
	border-bottom: solid 1px #69696952;
	background-image:url(../backimg/check_img.png);




}

#content_box_A {
	width:1024px;
	height:700px;
	margin:0 auto;
	/**background-color:red;**/
	
}
.block_B {
	width: 1024px;
	height: 50px;
	color:#fff;
	/**background-color: #fff;**/
	text-align: center;
	line-height: 38.2pt;


}



#main_left {
	width:500px;
	height:650px;
	/**background-color:red;**/
	margin: 0px 5px 5px 5px;
	float:left;
	
}
#main_left h2 {
	width: 500px;
	height: 50px;
	/**background-color: blue;**/
	color: #e2d260a8;
	font-size: 17.2pt;
	line-height: 38.2pt;
	text-align: center;
	border-bottom:1px solid #e2d260a8;


}
#main_left h3 {
	width: 500px;
	height: 50px;
	color: #fff;
	text-align: center;
	line-height: 48.1pt;
	border-bottom: 0.1pt solid #fff;
	/* background-color: red; */

}

#main_left p {
	width: 500px;
	font-size: 1.2vw;
	padding: 90px 5px 5px 5px;
	height: auto;
	line-height: 30.2pt;
	text-align: center;
	color: #fff;


}





#main_right {
	width:500px;
	height:650px;
	/**background-color:green;**/
	margin: 0px 5px 5px 5px;
	float:left;

}
#main_right a {
	width:390px;
	height:590px;
	display:block;
	margin-left: 35px;
	/**background-color: red;**/
	text-decoration: none;


}

#main_right a:hover {
	letter-spacing:2px;
	opacity:0.9;
	transition:0.7s;
	



}

.youtube {
	width: 32.2vw;
	height: 44.2vw;
	margin: 80px 10px 10px 20px;


}

#main_right img {
	width: 32.2vw;
	height: 44.2vw;
	margin: -30px 10px 10px 20px;


}


#main_right p {
	    width: 400px;
	    height: 30px;
	    text-align: center;
	    line-height: 24.1pt;
	    color: #fff;
	    
}




/**=========================================================

			article　ここまで

============================================================**/



/**=========================================================

			section　ここから

============================================================**/

section {
	width:100%;
	min-width:1024px;
	height:700px;
	float:left;
	border-bottom: solid 1px #69696952;

}
#sectionB{
	width:100%;
	min-width:1024px;
	height:700px;
	background-image:url(../backimg/check_img.png);

}
#content_box_B {
	width:1024px;
	height:700px;
	margin:0 auto;
	/**background-color:red;**/
	
}
.block_C {
	width: 1024px;
	height: 50px;
	color:#fff;
	/**background-color: #fff;**/
	text-align: center;
	line-height: 38.2pt;


}

/**===================================

   FBページ　プラグインここから

====================================**/
.fb_page {	
	border: 0; 
	display: block; 
	max-width: 99%; 
	width: 455px; 
	padding: 10px 0px 0px 90px; 
	margin: 0 auto; 
	background-color: #fff;
	/**background-color: rgba(255,252,252,0.18);**/
	auto; position: static; visibility: visible;
	height:550px;
	overflow:scroll;
	
}
/**===================================

====================================**/


/**=========================================================

			section　ここまで

============================================================**/



aside {
	width:100%;
	min-width:1024px;
	height:700px;
	float:left;
	border-bottom: solid 1px #69696952;
	background-image:url(../backimg/check_img.png);


}
#sectionD {
	width:100%;
	min-width:1024px;
	height:700px;
	background-image:url(../backimg/check_img.png);


}
#sectionC {
	width:100%;
	min-width:1024px;
	height:700px;
	background-image:url(../backimg/check_img.png);


}
#content_box_C {
	width:1024px;
	height:700px;
	margin:0 auto;
	/**background-color:red;**/
	
}
.block_D {
	width: 1024px;
	height: 50px;
	color:#fff;
	/**background-color: #fff;**/
	text-align: center;
	line-height: 38.2pt;


}

/**=======================================
===========================================

		note Blog ここから
===========================================
=======================================**/

.note-embed {	
	border: 0; 
	display: block; 
	max-width: 99%; 
	width: 600px; 
	padding: 10px 0px 0px 90px; 
	margin: 0 auto; 
	background-color: #fff;

	auto; position: static; visibility: visible;
	height:550px;
	overflow:scroll;
	
}

.p-noteEmbed {
	background: #ffffff;
	border: #e6e6e6 solid 1px;
	border-radius: 4px;
	width: 100%;
	max-width: 500px;
	word-wrap: break-word;
	overflow: hidden;
	height: 400px;
	position: absolute;
	top: 80px;
}


/**=======================================
===========================================

		note Blog ここ迄
===========================================
=======================================**/





/**============= slid =====================**/
#iview {
	width:1024px;
	height:650px;
	/**background-color:red;**/

}



/**============= slid ここまで ==============**/



#sectionE {
	width:100%;
	min-width:1024px;
	height:700px;
	float:left;
	background-image:url(../backimg/check_img.png);



}
#content_box_D {
	width:1024px;
	height:700px;
	margin:0 auto;
	/**background-color:red;**/


}









/**=========================================================

			footer ここから

============================================================**/

#footer {
	width:100%;
	min-width:1024px;
	height:450px;
	float:left;
	clear:both;
	background-color:#000;
	
	overflow:hidden;
	
}




#hoot_bar {
	width:100%;
	min-width:1024px;
	height: 25px;
	background-color: #fb3c00;
	margin-top: 15px;
	float:left;
	clear:both;
	background-image:url(../backimg/check_img.png);
	
}
#hoot_bar p {
	width:1024px;
	height:25px;
	margin:0 auto;
	color:#fff;
	text-align:center;
	font-size:12px;
	line-height: 192.1%;


}

/*******javascript Kowappa*****************/
#pageTop{
	position: relative;
	display: inline-block;
	width: 50px;
	height: 50px;
	border: 1px solid #ccc;
	border-radius: 100px;
	background-color: #f9f6f7;
	float: right;
	margin-top: 30px;
	margin-right: 530px;
	text-align: center;
	line-height: 38pt;
	color: #db6f93;
	font-size: 12px;	
	z-index: 998;
	 cursor:pointer;
	 
	
}

#contact {
	width:1024px;
	height:410px;
	/*background-color:red;*/
	margin:0 auto;

}
.btn {
	width: 350px;
	height: 80px;
	float: left;
	margin: 120px 100px 100px 320px;
	text-align: center;
	color: #ffffff;
	background-color:#fb3c00;
	line-height: 60.2pt;
	font-size: 2.2vw;
	border-radius: 5pt;
	letter-spacing: 7.2pt;
	background-image:url(../backimg/check_img.png);
	
	transition: background .3s linear;
	
	
	

}

.btn a {
	width: 350px;
	height: 80px;
	display:block;
	color: #fff;
	text-decoration: none;
	border-radius: 5pt;



}

.btn a:hover {
	width: 350px;
	height: 80px;
	letter-spacing: 9pt;
	opacity:0.7;
	transition:0.7s;
	border-radius: 5pt;
	display:inline-block;
	
}



.btn a::before {
	position: absolute;
	left: 30%;
	z-index: 2;
	display: block;
	content: '';
	width: 10%;
	height: 80px;
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	-webkit-transform: skewX(-25deg);
	transform: skewX(-35deg);
	
      opacity: 0;
}

.btn a:hover::before {
	-webkit-animation: shine .75s;
	animation: shine .75s;
	 opacity: 1;
	 
}

@-webkit-keyframes shine {
  100% {
    left: 100%;
  }
}
@keyframes shine {
  100% {
    left: 52%;
    opacity: 0;
  }
}



/**=====================================
========================================**/

#pageTop a {
	width: 80px;
	height: 80px;
	display:block;
	cursor:pointer;
	

}

#pageTop a:hover {
	filter:alpha(opacity=10);
    -moz-opacity: 0.1;
    opacity: 0.1 ;
    transition:0.7s;


    
 

}

.button {
　position: relative;
　display: block;
　width: 50px;
　height: 50px;
　border: 1px solid #ccc;
　border-radius: 100px;
　background: #04DDFD;

}

#pageTop a:hover {
	filter:alpha(opacity=10);
    -moz-opacity: 0.1;
    opacity: 0.1 ;
    transition:0.7s;
    cursor:pointer;

}

.button .ring {
	background: rgba(181, 175, 178, 0.59);
	position: absolute;
	z-index: -1;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	height: 65px;
	width: 65px;
	top: -8px;
	left: -8px;
	
	-webkit-animation: pulsate-ready 2s ease-out;
    -webkit-animation-iteration-count: infinite;
    -moz-animation: pulsate-ready 2s ease-out;
    -moz-animation-iteration-count: infinite;
    -ms-animation: pulsate-ready 2s ease-out;
    -ms-animation-iteration-count: infinite;


opacity:0;
-webkit-animation:load 3s ease-in-out;
-moz-animation:load 3s ease-in-out;
-ms-animation:load 3s ease-in-out;
-o-animation:load 3s ease-in-out;
animation:load 3s ease-in-out;
-webkit-animation-iteration-count:infinite;
-moz-animation-iteration-count:infinite;
-ms-animation-iteration-count:infinite;
-o-animation-iteration-count:infinite;
animation-iteration-count:infinite;
	
	/**ここより下にレイアウトしてください***/
	text-align:center;
	color:#ffffff;
	
	
}

.button:hover .ring {
	animation: pulsate 1s ease-out;  /* スピードなど */
	animation-iteration-count: infinite;
	background: rgba(181, 175, 178, 0.59);
	
}
@keyframes pulsate {
	0%   { transform: scale(1, 1); }
	50%  { opacity: 1; }
	100% { transform: scale(2, 2); opacity: 0.0; }/*****ホバー時の広がり方調整、数値を同じ値にしないと歪んだ広がり方をする******/

}
@-webkit-keyframes pulsate-ready {
      0% {-webkit-transform: scale(1, 1); }
     50% {-webkit-transform: scale(1.1, 1.1); }
    100% {-webkit-transform: scale(1, 1); }
}
@-moz-keyframes pulsate-ready {
      0% {-moz-transform: scale(1, 1); }
     50% {-moz-transform: scale(1.1, 1.1); }
    100% {-moz-transform: scale(1, 1); }
}
@-ms-keyframes pulsate-ready {
      0% {-ms-transform: scale(1, 1); }
     50% {-ms-transform: scale(1.1, 1.1); }
    100% {-ms-transform: scale(1, 1); }
}



/**=========================================================

				footer ここまで

============================================================**/




@media screen and (max-width: 375px) {
.board {
	text-align: center;
	border-radius: 4px;
	width: 345px;
	margin: 0px auto 0 auto;
	padding: 20px;
	position: ralative;
	z-index: 1;
	top: 210px;
	left: 350px;
	text-shadow: 1px 2px 5px #101010;
    }
}/**閉じ**/