section.intro .category { width: 100%; height: auto; }
section.intro .category_list { height: 60px; line-height: 60px; text-align: center; margin-top: 80px; }
section.intro .category_list a:hover { background-color: var(--color-blue2); color: var(--color-white); }
section.intro .category_list a.on { background-color: var(--color-blue2); color: var(--color-white); }
section.intro .category_list a {
	width: 150px; height: 60px; line-height: 60px;
	margin: 0px 5px;
	font-size: 20px; color: #999999; text-align: center;
	background-color: #eaeaea;
	border-radius: 15px; 
	float: none;
}


section.history {
	width: 100%; height: auto;
	margin-top: 45px;
	padding: 0px 200px 200px;
}

section.history .history_list { width: 100%; height: auto; }
section.history .history_groups { width: 100%; height: auto; padding-top: 80px;}



section.history .history_groups .history_data { width: 50%; }
section.history .history_groups:nth-child(even) .history_data { 
	float: left; 
	padding-right: 45px;

}

section.history .history_groups:nth-child(odd) .history_data { 
	float: right; 
	padding-left: 30px;
}


section.history .history_data .history_item:nth-child(1) { padding-top: 0px; }
section.history .history_data .history_item {
	width: 100%; height: auto;
	padding-top: 80px;
}


section.history .history_groups.on .history_data .history_item .history_yyyy { color: var(--color-blue2); }
section.history .history_groups.on .history_data .history_item .history_mm { color: var(--color-blue2); }

section.history .history_data .history_item .history_yyyy {
	width: 100%; height: auto; line-height: 1;
	font-size: 80px; color: #ededed;
	margin-bottom: 10px;

	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
}

section.history .history_info { width: 100%; height: auto; line-height: 1.5; margin-top: 10px; font-size: 20px; }
section.history .history_info .history_mm { 
	width: auto; height: auto; float: none; color: #cccccc; font-weight: 600; 
	transition: all 300ms ease-in-out;
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
}
section.history .history_info .history_val { width: auto; height: auto; float: none; color: var(--color-black); margin-left: 15px; }


section.history .history_groups:nth-child(odd) .history_info,
section.history .history_groups:nth-child(odd) .history_yyyy { text-align: left;  }

section.history .history_groups:nth-child(even) .history_info,
section.history .history_groups:nth-child(even) .history_yyyy { text-align: right;  }


section.history .history_groups:nth-child(even) .history_data:after { right: 0px; }
section.history .history_groups:nth-child(odd) .history_data:after { left: -1px; }
section.history .history_groups .history_data:after {
	position: absolute; 
	width: 1px; height: 100%; display: block; content: '';

	background-color: var(--color-blue2);
}
section.history .history_groups:nth-child(1) .history_data:after { top: 36px; height: calc(100% - 36px); }
section.history .history_groups:not(:nth-child(1)) .history_data:after { top: -80px; height: calc(100% + 80px); }
section.history .history_groups:last-child .history_data:after { height: calc(100% - 5px); }

section.history .history_groups:nth-child(1) .history_data:before {
	position: absolute; top: -80px; left: -1px;
	width: 1px; height: 120px; display: block; content: '';

	border-left: 1px dashed var(--color-blue2);
}





section.history .history_groups:nth-child(odd) .history_yyyy:before { left: -35px; }
section.history .history_groups:nth-child(even) .history_yyyy:before { right: -49px; }
section.history .history_data .history_item .history_yyyy:before {
	position: absolute; top: 50%;
	width: 9px; height: 9px; display: block; content: '';

	margin-top: -4px;
	border-radius: 100%;
	background-color: var(--color-blue2);
}


section.history .slick-slider .slick-track, 
section.history .slick-slider .slick-list {
	width: 100%; height: 100%;
}

section.history .history_groups .history_images { position: sticky; top: 100px; width: 50%; }
section.history .history_groups .slick-list{ max-width: 640px;  overflow: hidden; }

section.history .history_groups:nth-child(even) .history_images { float: right; }
section.history .history_groups:nth-child(even) .slick-list { float: right; }
section.history .history_groups:nth-child(even) .slick-list img { float: right; }

section.history .history_groups:nth-child(odd) .history_images { float: left; padding-right: 45px; }
section.history .history_groups:nth-child(even) .history_images { padding-left: 45px; }

section.history .history_groups .history_images img { 
	position: absolute; top: 50%; left: 50%;
	max-height: 100%; max-width: 100%; width: auto; height: auto; border-radius: 30px; object-fit: contain; 


    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
section.history .history_groups .history_images.type_05 { height: 720px; }
section.history .history_groups .history_images.type_04 { height: 650px; }
section.history .history_groups .history_images.type_03 { height: 630px; }
section.history .history_groups .history_images.type_02 { height: 610px; }
section.history .history_groups .history_images.type_01 { height: 580px; }








@media (max-width: 749px) { 
	section.intro .category_list { height: calc((45 / 480)* 100vw); line-height: calc((45 / 480)* 100vw); margin-top: calc((45 / 480)* 100vw); }
	section.intro .category_list a {
		width: calc((90 / 480)* 100vw); height: calc((45 / 480)* 100vw); line-height: calc((45 / 480)* 100vw);
		margin: 0px calc((3 / 480)* 100vw);
		font-size: calc((16 / 480)* 100vw); 
		border-radius: 10px; 
	}


	section.history { margin-top: calc((45 / 480)* 100vw); padding: 0px calc((20 / 480) * 100vw) calc((150 / 480)* 100vw) calc((50 / 480) * 100vw); }
	section.history .history_groups:first-child { padding-top: 0px;  }
	section.history .history_groups { padding-top: calc((80 / 480)* 100vw);}
	
	section.history .history_groups .history_data { width: 100%; }
	section.history .history_groups:nth-child(even) .history_data { padding-left: calc((30 / 480)* 100vw); padding-right: calc((0 / 480)* 100vw); }
	section.history .history_groups:nth-child(odd) .history_data { padding-left: calc((30 / 480)* 100vw); }

	section.history .history_groups .history_images { width: 100%; padding-bottom: calc((30 / 480)* 100vw); }
	section.history .history_groups .history_images img {
		left: 0%;
		-webkit-transform: translate(0%, -50%);
		-ms-transform: translate(0%, -50%);
		transform: translate(0%, -50%);
	}
	section.history .history_data .history_item { padding-top: calc((45 / 480)* 100vw); }
	section.history .history_data .history_item .history_yyyy { font-size: calc((36 / 480)* 100vw); margin-bottom: calc((10 / 480)* 100vw); }

	section.history .history_info { margin-top: calc((10 / 480)* 100vw); font-size: calc((16 / 480)* 100vw); }
	section.history .history_info .history_mm { width: calc((50 / 480) * 100vw); float: left; }
	section.history .history_groups:nth-child(even) .history_mm { float: left; text-align: left; }
	section.history .history_info .history_val { width: calc(100% - ((50 / 480) * 100vw)); float: left; margin-left: 0px;  word-break: keep-all; }

	section.history .history_groups:nth-child(1) .history_data:after { top: calc((26 / 480)* 100vw); height: calc(100% - ((36 / 480)* 100vw)); }
	section.history .history_groups:not(:nth-child(1)) .history_data:after { top: calc((-295 / 480)* 100vw); height: calc(100% + ((305 / 480)* 100vw)); }
	section.history .history_groups:last-child .history_data:after { top: calc((-370 / 480)* 100vw); }

	section.history .history_groups:nth-child(1) .history_data:before {
		top: calc((-220 / 480)* 100vw); 
		height: calc((240 / 480)* 100vw); 
	}
	section.history .history_groups:nth-child(even) .history_info, section.history .history_groups:nth-child(even) .history_yyyy {
		text-align: left;
	}
	section.history .history_groups:nth-child(even) .history_data:after { left: -1px; right: auto; }


	section.history .history_groups:nth-child(odd) .history_yyyy:before { left: calc((-35 / 480)* 100vw); }
	section.history .history_groups:nth-child(even) .history_yyyy:before { left: calc((-35 / 480)* 100vw); }
	section.history .history_data .history_item .history_yyyy:before {
		width: calc((9 / 480)* 100vw); height: calc((9 / 480)* 100vw); margin-top: calc((-4 / 480)* 100vw);
	}

	section.history .history_groups .slick-list{ max-width: calc((640 / 480)* 100vw);  }
	section.history .history_groups:nth-child(odd) .history_images {  padding-left: calc((30 / 480)* 100vw); padding-right: calc((0 / 480)* 100vw); }
	section.history .history_groups:nth-child(even) .history_images { padding-left: calc((30 / 480)* 100vw); }

	section.history .history_groups .history_images { top: 0px; position: relative; }
	section.history .history_groups .history_images img { border-radius: calc((10 / 480)* 100vw); height: 35.2vw;}
	section.history .history_groups .history_images.type_05 { height: calc((220 / 480)* 100vw); }
	section.history .history_groups .history_images.type_04 { height: calc((200 / 480)* 100vw); }
	section.history .history_groups .history_images.type_03 { height: calc((220 / 480)* 100vw); }
	section.history .history_groups .history_images.type_02 { height: calc((220 / 480)* 100vw); }
	section.history .history_groups .history_images.type_01 { height: calc((220 / 480)* 100vw); }


}


@media (max-width: 1023px) and (min-width: 750px) { 
	section.intro .category_list { height: calc((60 / 750)* 100vw); line-height: calc((60 / 750)* 100vw); margin-top: calc((60 / 750)* 100vw); }
	section.intro .category_list a {
		width: calc((150 / 750)* 100vw); height: calc((60 / 750)* 100vw); line-height: calc((60 / 750)* 100vw);
		margin: 0px calc((5 / 750)* 100vw);
		font-size: calc((20 / 750)* 100vw); 
		border-radius: calc((15 / 750)* 100vw); 
	}

	section.history { margin-top: calc((45 / 750)* 100vw); padding: 0px calc((30 / 750) * 100vw) calc((150 / 750)* 100vw); }
	section.history .history_groups { padding-top: calc((80 / 750)* 100vw);}

	section.history .history_groups:nth-child(even) .history_data { padding-right: calc((45 / 750)* 100vw); }
	section.history .history_groups:nth-child(odd) .history_data { padding-left: calc((30 / 750)* 100vw); }

	section.history .history_data .history_item { padding-top: calc((45 / 750)* 100vw); }
	section.history .history_data .history_item .history_yyyy { font-size: calc((45 / 750)* 100vw); margin-bottom: calc((10 / 750)* 100vw); }

	section.history .history_info { margin-top: calc((10 / 750)* 100vw); font-size: calc((18/ 750)* 100vw); }
	section.history .history_info .history_mm { width: calc((50 / 750) * 100vw); float: left; }
	section.history .history_groups:nth-child(even) .history_mm { float: right; text-align: right; }
	section.history .history_info .history_val { width: calc(100% - ((50 / 750) * 100vw)); float: left; margin-left: 0px;  word-break: keep-all; }

	section.history .history_groups:nth-child(1) .history_data:after { top: calc((26 / 750)* 100vw); height: calc(100% - ((36 / 750)* 100vw)); }
	section.history .history_groups:not(:nth-child(1)) .history_data:after { top: calc((-150 / 750)* 100vw); height: calc(100% + ((80 / 750)* 100vw)); }
	section.history .history_groups:last-child .history_data:after { height: calc(100% - (5 / 750)* 100vw)); }

	section.history .history_groups:nth-child(1) .history_data:before {
		top: calc((-100 / 750)* 100vw); 
		height: calc((120 / 750)* 100vw); 
	}


	section.history .history_groups:nth-child(odd) .history_yyyy:before { left: calc((-35 / 750)* 100vw); }
	section.history .history_groups:nth-child(even) .history_yyyy:before { right: calc((-49 / 750)* 100vw); }
	section.history .history_data .history_item .history_yyyy:before {
		width: calc((9 / 750)* 100vw); height: calc((9 / 750)* 100vw); margin-top: calc((-4 / 750)* 100vw);
	}

	section.history .history_groups .slick-list{ max-width: calc((640 / 750)* 100vw);  }
	section.history .history_groups:nth-child(odd) .history_images {  padding-right: calc((45 / 750)* 100vw); }
	section.history .history_groups:nth-child(even) .history_images { padding-left: calc((45 / 750)* 100vw); }

	section.history .history_groups .history_images { top: calc((100 / 750)* 100vw); }
	section.history .history_groups .history_images img { border-radius: calc((15 / 750)* 100vw); }
	section.history .history_groups .history_images.type_05 { height: calc((220 / 750)* 100vw); }
	section.history .history_groups .history_images.type_04 { height: calc((200 / 750)* 100vw); }
	section.history .history_groups .history_images.type_03 { height: calc((220 / 750)* 100vw); }
	section.history .history_groups .history_images.type_02 { height: calc((220 / 750)* 100vw); }
	section.history .history_groups .history_images.type_01 { height: calc((220 / 750)* 100vw); }

}

@media (max-width: 1279px) and (min-width: 1024px) { 
	section.intro .category_list { height: calc((60 / 1280)* 100vw); line-height: calc((60 / 1280)* 100vw); margin-top: calc((80 / 1280)* 100vw); }
	section.intro .category_list a {
		width: calc((150 / 1280)* 100vw); height: calc((60 / 1280)* 100vw); line-height: calc((60 / 1280)* 100vw);
		margin: 0px calc((5 / 1280)* 100vw);
		font-size: calc((20 / 1280)* 100vw); 
		border-radius: calc((15 / 1280)* 100vw); 
	}

	section.history { margin-top: calc((45 / 1280)* 100vw); padding: 0px calc((50 / 1024) * 100vw) 200px; }
	section.history .history_groups { padding-top: calc((80 / 1280)* 100vw);}

	section.history .history_groups:nth-child(even) .history_data { padding-right: calc((45 / 1280)* 100vw); }
	section.history .history_groups:nth-child(odd) .history_data { padding-left: calc((30 / 1280)* 100vw); }

	section.history .history_data .history_item { padding-top: calc((80 / 1280)* 100vw); }
	section.history .history_data .history_item .history_yyyy { font-size: calc((60 / 1280)* 100vw); margin-bottom: calc((10 / 1280)* 100vw); }

	section.history .history_info { margin-top: calc((10 / 1280)* 100vw); font-size: calc((20 / 1280)* 100vw); }
	section.history .history_info .history_val { margin-left: calc((15 / 1280)* 100vw); }

	section.history .history_groups:nth-child(1) .history_data:after { top: calc((36 / 1280)* 100vw); height: calc(100% - ((36 / 1280)* 100vw)); }
	section.history .history_groups:not(:nth-child(1)) .history_data:after { top: calc((-158 / 1280)* 100vw); height: calc(100% + ((80 / 1280)* 100vw)); }
	section.history .history_groups:last-child .history_data:after { height: calc(100% - (5 / 1280)* 100vw)); }

	section.history .history_groups:nth-child(1) .history_data:before {
		top: calc((-80 / 1280)* 100vw); 
		height: calc((120 / 1280)* 100vw); 
	}


	section.history .history_groups:nth-child(odd) .history_yyyy:before { left: calc((-35 / 1280)* 100vw); }
	section.history .history_groups:nth-child(even) .history_yyyy:before { right: calc((-49 / 1280)* 100vw); }
	section.history .history_data .history_item .history_yyyy:before {
		width: calc((9 / 1280)* 100vw); height: calc((9 / 1280)* 100vw); margin-top: calc((-4 / 1280)* 100vw);
	}

	section.history .history_groups .slick-list{ max-width: calc((640 / 1280)* 100vw);  }
	section.history .history_groups:nth-child(odd) .history_images {  padding-right: calc((45 / 1280)* 100vw); }
	section.history .history_groups:nth-child(even) .history_images { padding-left: calc((45 / 1280)* 100vw); }

	section.history .history_groups .history_images { top: calc((100 / 1280)* 100vw); }
	section.history .history_groups .history_images img { border-radius: calc((30 / 1280)* 100vw); }
	section.history .history_groups .history_images.type_05 { height: calc((420 / 1280)* 100vw); }
	section.history .history_groups .history_images.type_04 { height: calc((420 / 1280)* 100vw); }
	section.history .history_groups .history_images.type_03 { height: calc((420 / 1280)* 100vw); }
	section.history .history_groups .history_images.type_02 { height: calc((420 / 1280)* 100vw); }
	section.history .history_groups .history_images.type_01 { height: calc((420 / 1280)* 100vw); }





}

@media (max-width: 1920px) and (min-width: 1280px) { 
	section.history { padding: 0px calc((200 / 1920) * 100vw) 200px; }

}




/*

@media (max-width: 749px) { 


}


@media (max-width: 1023px) and (min-width: 750px) { 

}

@media (max-width: 1279px) and (min-width: 1024px) { 

}

@media (max-width: 1920px) and (min-width: 1280px) { 

}


*/