@charset "utf-8";

/* @group about */
article#about{
	height: 100px;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 0;
	background: url(../images/about.jpg) no-repeat;
	background-size: contain;
	background-position: center top;
	background-attachment: fixed;
	}
article#about h1{
	margin: 0 auto;
	font-size: 3em;
	/*opacity: 0.8;*/
	color: #fff;
	}
article#about p{
	color: #fff;
	}
/* @end */

/* @group about-contents */
article#about-contents{
    padding: 1.5em;
    margin-bottom: 3em;
	}
article#about-contents section{
    margin-bottom: 3em;
	}
article#about-contents section div{
    margin-bottom: 2em;
	}
article#about-contents section figure{
	margin: 0 auto;
    text-align: center;
	width: 40%;
	}
article#about-contents section#kokon figure{
	margin: 2em auto 0;
	width: 70%;
	}
/* @end */

/*768px*/
@media screen and (min-width : 768px) {
/* @group about */
article#about{
	height: 100px;
    padding-top: 20px;
    margin: 64px auto 3em;
	background-size: cover;
	}
article#about-contents section figure{
	width: 50%;
	}
/* @end */

/* @group about-contents */
article#about-contents{
	max-width: 500px;
	margin: 0 auto 5em;
	}
/* @end */
}

/*1024px*/
@media screen and (min-width : 1024px) {

/* @group about */
article#about{
	height: 125px;
    padding-top: 25px;
    margin: 74px auto 3em;
	}
/* @end */
/* @group about-contents */
article#about-contents{
	max-width: 600px;
	}
/* @end */

}
/* @end */