@charset "UTF-8";
/* fonts
------------------------------------------------------------*/
html {
	font-size: 62.5%;/*ルートのフォントサイズを10pxに設定しておく*/
}
body {
	font-size: 1.6em;/*ルートのフォントサイズを1.6em（16pxと同等のサイズ）に設定*/
}
body {
	font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
	color: #555555;
	line-height: 1.5;
}
h1,h2,h3,h4,h5,.copy {
	color: #000000;
}

/* clearfix
------------------------------------------------------------*/
.clearfix:after {
    content: '';
    display: block;
    clear: both;
}

/* layout
------------------------------------------------------------*/
.ib {/*レスポンシブでのテキストの改行位置調整用*/
	display: inline-block;
}

/* animation
------------------------------------------------------------*/
.slide-in { 
	opacity:0;
	-webkit-animation-name:slide-in;
	        animation-name:slide-in;
	-webkit-animation-duration:2s;
	        animation-duration:2s; 
	-webkit-animation-fill-mode: forwards; 
	        animation-fill-mode: forwards;
}
@-webkit-keyframes slide-in {
0% {
	opacity: 0;
	-webkit-transform: translateX(-30px);
	        transform: translateX(-30px);
}
100% {
	opacity: 1;
	-webkit-transform: translateX(0);
	        transform: translateX(0);
}
}
@keyframes slide-in {
0% {
	opacity: 0;
	-webkit-transform: translateX(-30px);
	        transform: translateX(-30px);
}
100% {
	opacity: 1;
	-webkit-transform: translateX(0);
	        transform: translateX(0);
}
}

/* hover effect
------------------------------------------------------------*/
a:hover img {
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}

/* media queries
------------------------------------------------------------*/
@media screen and (max-width: 959px) {
body {
	font-size: 1.5em;/*ルートのフォントサイズを1.5em（15pxと同等のサイズ）に設定*/
}
}
@media (max-width: 559px){
body {
	font-size: 1.4em;/*ルートのフォントサイズを1.4em（14pxと同等のサイズ）に設定*/
}
}
