/* Global */

body {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 1em;
	color: #8a8683;
	background-color:#ffffff;
}
a:link {
	color: #f68f67;
	text-decoration: none;
}
a:hover {
	color: #bde2df;
	text-decoration: none;
}
a:visited {
	color: #f68f67;
	text-decoration: none;
}

h2 {
   	font-size: 12px;
    line-height: 2.4rem;
    font-weight: bold;
    letter-spacing: 0.3rem;
}


/* Navigation */

.menu {
	position:fixed;
	top:0px;
	width:100%; 
	height:auto; 
	background-color:#ffffff;
	z-index:100;
}
#logo {
	text-align: center;
	margin: 10px 0;
}
#nav {
	text-align: right;
	margin: 30px 0 0 0;
}
.navigation{
	float: right;
	list-style: none;
	margin: 0;
}
.navigation li{
	float: left;
	padding:0 0 0 50px;
}
.navigation li:hover{
	cursor:pointer;
	color: #a9d3d0;
}

.navigation .active{
	cursor:pointer;
	color: #f68f67;
	font-weight:bold;
}

/* Slide 1 */ 
#slide1{
	background-color:#ffffff;
}
#slide1 h1 {
	font-size: 3.8em;
	letter-spacing: -3px;
	line-height: 0px;
	color:#8a8683;
	font-weight: 700;
}
#slide1 h2 {
	font-size: 2em;
	color: #8a8683;
	line-height: 0px;
	padding-bottom:20px;
	font-weight: 400;
}
/* Slide 2 */ 
#slide2{
	background-image:url('../images/bg2.jpg');
	background-size: 100%;
	height: 200px;
	background-repeat: no-repeat;
	z-index: -1;
	margin-top: 15px;
	position:relative;
}
#slide2 h2 {
	font-size: 2em;
	color: #ffffff;
	line-height: 0px;
	padding-bottom:20px;
	font-weight: 400;
}
#slide3 img {
	margin-top:-300px;
	width:100%;
}

/* Slide 3 */ 
#slide3{
	background-color:#ffffff;
}
#slide3 h1 {
	font-size: 3.8em;
	letter-spacing: -3px;
	line-height: 0px;
	color:#8a8683;
	font-weight: 700;
}
#slide3 h2 {
	font-size: 2em;
	color: #8a8683;
	padding-bottom:20px;
	font-weight: 400;
}
#test{
	background-color:#bde2df;
	color:#ffffff;
	text-align:center;
	font-size: 2em;
	font-weight: 400;
}

/* Slide 4 */
#slide4{
	background-image:url('../images/sunglasses.png');
	background-size: 100%;
	height: 200px;
	background-repeat: no-repeat;
	z-index: -1;
	margin-top: 15px;
}
#slide4 h1 {
	font-size: 3.8em;
	letter-spacing: -3px;
	line-height: 0px;
	color:#ffffff;
	font-weight: 700;
}
#slide4 h2 {
	font-size: 2em;
	color: #ffffff;
	line-height: 0px;
	padding-bottom:20px;
	font-weight: 400;
}

/* Slide5 */
#slide5{
	background-image:url('../images/footprints2.jpg');
	background-size: 100%;
	height: 200px;
	background-repeat: no-repeat;
	z-index: -1;
	margin-top: 15px;
}
#slide5 h1 {
	font-size: 3.8em;
	letter-spacing: -3px;
	line-height: 0px;
	color:#ffffff;
	font-weight: 700;
}
#slide5 h2 {
	font-size: 2em;
	color: #ffffff;
	line-height: 0px;
	padding-bottom:20px;
	font-weight: 400;
}

/* Slide 6 */

#slide6{
	background-image:url('../images/footprints.jpg');
	background-size: 100%;
	height: 200px;
	background-repeat: no-repeat;
	z-index: -1;
}
#slide6 h1 {
	font-size: 3.8em;
	letter-spacing: -3px;
	line-height: 0px;
	color:#ffffff;
	font-weight: 700;
}
#slide6 h2 {
	font-size: 2em;
	color: #ffffff;
	line-height: 0px;
	padding-bottom:20px;
	font-weight: 400;
}

#slide8 img{
	width: 100%;
}
#slide8 .container{
	max-width: 100%;
}
#slide8{
	padding: 5% 0;
}
/* PC */

	.slide{
		background-attachment: fixed;
		width:100%;
		height:auto;
		position: relative;
		padding:140px 0;
	}

		
		#slide7 p{
		width: 60%;
		margin: 0 auto 100px;
		text-align: left;
		font-size: 14px;
		line-height: 24px;
		color:#504c4c;
	}


	.fourcolumn div{
		display:flex;
	}
	.fourcolumn dl{
		background: none;
		border: 1px solid #decacc;
		margin: 20px;
		padding: 20px;
		position: relative;
		height: 240px;
		width: 50%;
		background-color: #fcfdf4;	
	}
	.fourcolumn dl:after{
		background: none;
		border: 1px solid #decacc;
		content: '';
		position: absolute;
		top: 3px;
		left: 3px;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	.fourcolumn dt{
		color: #ff8968;
		font-size:25px;
		margin:20px auto 30px;
	}

	.fourcolumn dd{
		margin:0;
		font-size:15px;
		text-align:left;
	}



/* Mobile */
@media screen and (max-width: 768px) {
	.content{
		background-image:url('../images/chiikikoken.jpg');
		background-size: 100%;
		height:3300px;
	}
	#slide1, #slide2, #slide3, #slide4, #slide5, #slide6{
		/*display:none;*/
	}	

	/* General Slides */ 
	.slide{
		background-attachment: fixed;
		width:100%;
		height:30%;
		padding: 30% 0;
		position: relative;
	}
	#slide7 p{
		width: 100%;
		text-align: left;
		font-size: 14px;
		line-height: 24px;
		color:#504c4c;
	}
	.fourcolumn div {
		display: block;
	}
	.fourcolumn dl{
		background: none;
		border: 1px solid #decacc;
		padding: 5%;
		position: relative;
		height: auto;
		width: auto;
		background-color: #fcfdf4;	
	}
	.fourcolumn dl:after{
		background: none;
		border: 1px solid #decacc;
		content: '';
		position: absolute;
		top: 3px;
		left: 3px;
		width: 100%;
		height: 100%;
		z-index: -1;
	}
	.fourcolumn dt{
		color: #ff8968;
		font-size:25px;
		margin:20px auto 30px;
	}
	.fourcolumn dd{
		margin:0;
		font-size:15px;
		text-align:left;
	}
	#slide2, #slide5, #slide4, #slide6 {
		background-size: contain;
		height: 50%;
		background-repeat: no-repeat;
	}
	#slide2 {
		background-image: url('../images/bg2_sp.jpg');
	}
	#slide5 {
		background-image: url('../images/footprints2_sp.jpg');
	}
	#slide4 {
		background-image: url('../images/sunglasses_sp.jpg');
	}
	#slide6 {
		background-image: url('../images/footprints_sp.jpg');
	}

	#slide8 .container {
		padding: 2rem 0;
	}
	#slide3 h2 {
		font-size: 1.2em;
    padding: 3rem 0;
	}
}