@charset "utf-8";
/* CSS Document */

/*----------CONTENTS------------*/
#contents{
	padding-top:50px;
}

h2{
	font-weight:normal;
}

/*----------CONTENTS IMAGE------------*/
#imageArea .imageSingleYoko{
	width:90%;
	padding-left:5%;
}

/*だるま、梅*/
#imageArea .imageSquare{
	width:500px;
	padding-left:15%;
	
}
/*The Trees*/
#imageArea .imageTateShort{
	width: 350px;
	padding:0 0 20px 25%;
}
/*クジャク*/
#imageArea .imageTate{
	width: 320px;
	padding:0 0 20px 20%;
}

/*バラ*/
#imageArea .imageTateMiddle{
	width: 300px;
	padding:0 0 20px 28%;
}
#imageArea .imageTateMiddle2{
	width: 160px;
	padding:0 0 20px 39%;
}


/*Unidentified*/
#imageArea .imageTateLong{
	width: 90px;
	padding-left:35%;
}
/*バルタン とり*/
#imageArea .imageTateSlide{
	width: 43%;
	padding-left:28%;
}

#imageArea .imageTateSliderSinging{
	width: 42%;
	padding-left:29%;
}
/*ufo 春の花*/
#imageArea .imageSquareSlide{
	width:60%;
	padding-left:20%;
	}

#imageArea .imageYokoSlide{
	width:90%;
	padding-left:5%;
	}

@media screen and (max-width: 600px) {
	#imageArea .imageTateShort, #imageArea .imageTate, #imageArea .imageTateMiddle, #imageArea .imageTateSlide, #imageArea .imageTateSliderSinging, #imageArea .imageYokoSlide, #imageArea .imageSquare, #imageArea .imageSingleYoko, #imageArea .imageSquareSlide{
	width: 100%;
	padding: 0 0 0px 0%;
	margin:0;
}
	#imageArea .imageTateLong{
	width:50%;
	padding: 0 25%;
	
	}
}
/*----------TEXT POSITION設定----------*/
#textArea {
	position: fixed;
	left: 36px;
	top: 300px;
}
#contentsNav {
	position: fixed;
	left: 36px;
	top: 550px;
}


@media screen and (max-width: 600px) {

#textArea {
	position: static;
}
#contentsNav {
	position:static;
	}
}


/*----------CONTENTS TEXT------------*/
#textArea{
	padding-top: 30px;
	font-size:80%;
	width: 28%;
}

#textArea .title{
	font-size:130%;
	margin-bottom:5px;
}
#textArea .titleEnglish{
	font-size:110%;
	line-height:1.1em;
}

#textArea #detail{
	margin-top:20px;
	line-height:1.7em;
	}

#textArea #description{
	margin-top:20px;
	line-height:1.7em;
}
@media screen and (max-width: 600px) {
	#textArea{
		text-align:center;
		width: 100%;
	}
}
/*----------CONTENTS NAV------------*/
#contentsNav ul{
	clear:both;
	padding: 30px 0px 20px;
}

#contentsNav ul li {
	display: inline;
}


#contentsNav ul li+li::before {
	content: " | ";
}

@media screen and (max-width: 600px) {
#contentsNav {
	text-align:center;
}

}