@charset "utf-8";
/*==========================================
	kenelephant15th
	-mobile.css
	==========================================*/

html{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #c7a79a;
}


body{
	position: relative;
	margin: 0 auto;	
	padding:150px 0 50px 0;
  -webkit-text-size-adjust: 100%;
  width: 100%;
}

#navigationArea{
	position: fixed;
	top: 40px;
	left: 50%;
	margin-left: -206px;
}

#navigationArea li{
	float: left;	
}

	img{
		width:100%	
	}

#content-15th h1 {
	max-width: 768px;
	margin-inline: auto;
}
p#leadTxt{
	margin: -7% auto 0;
	width: 30em;
	line-height: 2.2;
	color: #fff;
	width: 96%;
	position: relative;
	max-width: 768px;
	font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
}

p#leadTxt span{
	background: #000;
	padding: 2px 4px;
	margin-bottom: 10px;
}

#contentsArea>div{
	overflow: hidden;
	padding: 0;
	margin:0 auto;
	width: 100%;
}

#contentsArea p.imageBox{
	margin-bottom: 10px;
}

#contentsArea div.textArea{
	margin: 0 auto;
	width: 90%;
	line-height: 2;
	position: relative;
	max-width: 768px;
	margin-inline: auto;
}

#contentsArea div.textArea h2{
	font-size: 1.5em;
	line-height: 1.5;
	margin-block: 20px;
	padding: 0;
}
#contentsArea div.textArea h2 img {
	width: clamp(84.5128205128px, 26.4102564103vw, 202.8307692308px);
}
#contentsArea div.textArea p {
	font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
}
#contentsArea div.textArea span{
	background: #fff;
}

#y01 .imageBox {
	width: 180%;
	transform: translateX(-2%);
	z-index: 0;
}
#y01 div.textArea {
	margin-block-start: -100vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y01#y01 {
		margin-block-start: -120px;
	}
	#y01 .imageBox {
		max-width: 768px;
    transform: translateX(300px);
    margin-inline: auto;
	}
	#y01#y01 .textArea {
		margin-block-start: -320px;
	}
}
#y02#y02 {
	padding-block-start: 8px;
	margin-block-start: -50px;
}
#y02 .imageBox {
	width: 180%;
	transform: translateX(-6%);
	z-index: 0;
}
#y02#y02 .textArea {
	position: relative;
	margin-block-start: -60vw;
	z-index: 1;
}
@media screen and (min-width: 768px) {
	#y02#y02 {
		margin-block-start: 0;
	}
	#y02 .imageBox {
		max-width: 768px;
    transform: translateX(300px) scale(1.8);
		transform-origin: top;
    margin-inline: auto;
	}
	#y02#y02 .textArea {
		margin-block-start: 210px;
	}
}
#y03 .imageBox {
	width: 120%;
	transform: translateX(-6%);
	z-index: 0;
}
#y03#y03 .textArea {
	position: relative;
	margin-block-start: -40vw;
}
@media screen and (min-width: 768px) {
	#y03#y03 {
		margin-block-start: 0;
	}
	#y03 .imageBox {
		max-width: 768px;
    transform: translateX(100px) scale(1.2);
		transform-origin: top;
    margin-inline: auto;
	}
	#y03#y03 .textArea {
		margin-block-start: -80px;
	}
}
#y04#y04 .textArea {
	margin-block-start: -36vw;
}
@media screen and (min-width: 768px) {
	#y04#y04 {
		margin-block-start: 0;
	}
	#y04 .imageBox {
		max-width: 768px;
    transform: none;
    margin-inline: auto;
	}
	#y04#y04 .textArea {
		margin-block-start: -180px;
	}
}
#y05 .imageBox {
	width: 150%;
	transform: translateX(-6%);
	z-index: 0;
}
#y05#y05 .textArea {
	position: relative;
	z-index: 1;
	margin-block-start: -36vw;
}
@media screen and (min-width: 768px) {
	#y05#y05 {
		margin-block-start: 0;
	}
	#y05 .imageBox {
		max-width: 768px;
    transform: scale(1.5);
		transform-origin: top;
    margin-inline: auto;
	}
	#y05#y05 .textArea {
		margin-block-start: 210px;
	}
}
#y06 .imageBox {
	width: 160%;
	transform: translateX(-6%);
	z-index: 0;
}
#y06#y06 .textArea {
	position: relative;
	z-index: 1;
	margin-block-start: -36vw;
}
@media screen and (min-width: 768px) {
	#y06#y06 {
		margin-block-start: 0;
	}
	#y06 .imageBox {
		max-width: 768px;
    transform: scale(1.5);
		transform-origin: top;
    margin-inline: auto;
	}
	#y06#y06 .textArea {
		margin-block-start: 210px;
	}
}
#y07#y07 {
	margin-block-start: -50px;
}
#y07 .imageBox {
	width: 160%;
	transform: translateX(-3%);
	z-index: 0;
}
#y07#y07 .textArea {
	position: relative;
	z-index: 1;
	margin-block-start: -36vw;
}
@media screen and (min-width: 768px) {
	#y07#y07 {
		margin-block-start: 0;
	}
	#y07 .imageBox {
		max-width: 768px;
    transform: scale(1.5);
		transform-origin: top;
    margin-inline: auto;
	}
	#y07#y07 .textArea {
		margin-block-start: 210px;
	}
}
#y08#y08 {
	margin-block-start: -20px;
	position: relative;
}

#y08 .imageBox {
	width: 180%;
	transform: translateX(-13%);
	z-index: 0;
	margin-block-start: -16vw;
	padding-block-end: 0;
}

#y08#y08 .textArea {
	position: relative;
	z-index: 1;
	margin-block-start: 60px;
}
@media screen and (min-width: 768px) {
	#y08#y08 {
		margin-block-start: 0;
	}
	#y08 .imageBox {
		max-width: 768px;
    transform: scale(1.5);
		transform-origin: top;
    margin-inline: auto;
		margin-block-start: -80px;
		padding-block-end: 230px;
	}
	#y08#y08 .textArea {
		margin-block-start: 210px;
	}
}
#y09#y09 {
	background-color: #1c2d5b;
	padding-block-end: 20vw;
}
#y09#y09 .textArea h2 {
	margin-block-start: 0;
	position: relative;
	z-index: 1;
}
#y09#y09 .textArea h2 img {
	margin-inline-start: auto;
}
#y09 .imageBox {
	width: 180%;
	transform: translateX(-13%);
	z-index: 0;
	margin-block-start: -25vw;
	padding-block-end: 25vw;
}
#y09#y09 .imageBox + .textArea {
	margin-block-start: -100vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y09#y09 {
		margin-block-start: 0;
		padding-block-end: 0;
		overflow: hidden;
		min-height: 1580px;
	}
	#y09 .imageBox {
		max-width: 768px;
    transform: scale(1.8) translate(357px, -16px);
		transform-origin: top;
    margin-inline: auto;
		margin-block-start: -940px;
		padding-block-end: 0;
	}
	#y09#y09 .textArea {
		margin-block-start: 770px;
	}
	#y09#y09 .textArea h2 img {
		margin-inline-start: 0;
	}
	#y09#y09 .imageBox + .textArea {
		margin-block-start: 180px;
	}
}
#y10#y10 {
	background-color: #1c2d5b;
}
#y10 .imageBox {
	width: 180%;
	transform: translateX(-32%);
	z-index: 0;
	margin-block-start: -16vw;
}
#y10#y10 .textArea {
	margin-block-start: -17vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y10#y10 {
		margin-block-start: -300px;
		padding-block-end: 400px;
	}
	#y10 .imageBox {
		max-width: 768px;
    transform: scale(1.8) translateX(-110px);
		transform-origin: top;
    margin-inline: auto;
		margin-block-start: 0;
	}
	#y10#y10 .textArea {
		margin-block-start: 500px;
	}
}
#y11 .imageBox {
	width: 180%;
	transform: translateX(-22%);
	z-index: 0;
}
#y11#y11 .textArea {
	margin-block-start: -30vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y11#y11 {
		margin-block-start: -410px;
		min-height: 930px;
		position: relative;
	}
	#y11 .imageBox {
		max-width: 768px;
		transform: translateX(-50%) scale(1.8);
		transform-origin: top;
		margin-inline: auto;
		position: absolute;
		left: 50%;
	}
	#y11#y11 .textArea {
		margin-block-start: 620px;
	}
}
#y12#y12 {
	margin-block-start: -18vw;
}
#y12 .imageBox {
	width: 120%;
	transform: translateX(-6%);
	z-index: 0;
}
#y12#y12 .textArea {
	margin-block-start: -56vw;
	position: relative;
}
#y12#y12 .textArea h2 img{
	margin-inline-start: auto;
}
@media screen and (min-width: 768px) {
	#y12#y12 {
		margin-block-start: -120px;
	}
	#y12 .imageBox {
		max-width: 768px;
    transform: none;
    margin-inline: auto;
	}
	#y12#y12 .textArea {
		margin-block-start: -320px;
	}
}
#y13 .imageBox {
	width: 130%;
	transform: translateX(-12%);
	z-index: 0;
}

#y13#y13 .textArea {
	margin-block-start: -20vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y13 .imageBox {
		max-width: 768px;
    transform: none;
    margin-inline: auto;
	}
	#y13#y13 .textArea {
		margin-block-start: -140px;
	}
}
#y14 .imageBox {
	max-width: 768px;
	margin-inline: auto;
}
#y14#y14 .textArea {
	margin-block-start: -20vw;
	position: relative;
}
@media screen and (min-width: 768px) {
	#y14#y14 .textArea {
		margin-block-start: -140px;
	}
}
#y15 {
	position: relative;
}
#y15 .imageBox {
	width: 100%;
}
@media screen and (min-width: 768px) {
	#y15 .imageBox {
		max-width: 768px;
    transform: none;
    margin-inline: auto;
	}
}
#y16#y16 {
	padding-block-end: 40px;
}

#y17{
	box-shadow:0 2px 2px rgba(0,0,0,0.3);
	background: #FFFFFF;
	text-align: center;
}

#y16{
	border: none !important;
}

@media screen and (max-width: 640px){
	body{
		width: 100%;
	}
	
	img{
		width:100%	
	}		

#navigationArea {
	position: fixed;
	top: 40px;
	left: 50%;
	margin-left: -103px;
}

#navY09{
	clear: both;	
}
}

#content-20th .maincontent-area {
	max-width: 768px;
	margin: 0 auto;
}
#content-20th .maincontent-area > * {
	margin-block-start: 46px;
}
#content-20th .maincontent-area > .year-15,
#content-20th .maincontent-area > .year-16,
#content-20th .maincontent-area > .year-17 {
	margin-block-start: 0;
}
#content-20th .year-title {
	padding-inline: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
}
#content-20th .text {
	padding-inline: clamp(19.6923076923px, 6.1538461538vw, 47.2615384615px);
	font-size: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
	font-weight: bold;
	text-align: left;
	margin-block-start: clamp(8.2051282051px, 2.5641025641vw, 19.6923076923px);
}
#content-20th .text .label {
	display: inline;
	background-color: #fff;
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	padding-inline: 0.2em;
	padding-block: 0.2em;
	line-height: 2.166;
}
#content-20th .year-image {
	margin-block-start: 46px;
}