.sb_wrap{ overflow:hidden; }
.sb_wrap, .sb_wrap *{ box-sizing:border-box; }
.btnArea{ display:none; }
section > .sub_con{ width:100%; margin:0 auto; }


/* sub01 */
#sub01{ padding:0 0 120px; }

.sub01_img{ position:relative; z-index:1; width:100%; padding-top:55%; margin-bottom:20px; }
.sub01_img:before{ content:''; position:absolute; z-index:1; top:0; bottom:0; left:0; right:0; background-image:url(./img/01-01.jpg); background-position:center; background-size:cover; background-repeat:no-repeat; opacity:0; transition:0s opacity 2s; }
.sub01_img.act:before{ opacity:1; }
.sub01_img > .img_pt{ position:absolute; z-index:2; top:0; width:20%; height:100%; background-image:url(./img/01-01.jpg); background-size:cover; background-repeat:no-repeat; opacity:0; transform:perspective(3500px) rotateY(-90deg); box-shadow:4px 4px 9px 0 rgba(0,0,0,0.25); }
.sub01_img.act > .img_pt{ opacity:1; transform:perspective(3500px) rotateY(0deg); box-shadow:0 0 0 0 rgba(0,0,0,0.0); }
.sub01_img > .img_pt.pt_01{ left:0%; background-position:left 0% top 50%; transition:1s opacity 0s, 1s transform 0s, 1s box-shadow 1s; }
.sub01_img > .img_pt.pt_02{ left:20%; background-position:left 25% top 50%; transition:1s opacity 0.2s, 1s transform 0.2s, 1s box-shadow 1.2s; }
.sub01_img > .img_pt.pt_03{ left:40%; background-position:left 50% top 50%; transition:1s opacity 0.4s, 1s transform 0.4s, 1s box-shadow 1.4s; }
.sub01_img > .img_pt.pt_04{ left:60%; background-position:left 75% top 50%; transition:1s opacity 0.6s, 1s transform 0.6s, 1s box-shadow 1.6s; }
.sub01_img > .img_pt.pt_05{ left:80%; background-position:left 100% top 50%; transition:1s opacity 0.8s, 1s transform 0.8s, 1s box-shadow 1.8s; }

.sub01_sh > table{ width:100%; border-collapse:collapse; word-break:keep-all; }
.sub01_sh > table > tbody > tr > th{ padding:20px 20px; font-size:24px; font-weight:500; color:#fff; border:1px solid #ddd; width:200px; background-color:#2d4e9e; }
.sub01_sh > table > tbody > tr > td{ padding:20px 20px; font-size:22px; font-weight:400; color:#555; border:1px solid #ddd; }
.sub01_sh > table > tbody > tr:first-child > th,
.sub01_sh > table > tbody > tr:first-child > td{ border-top:3px solid #2d4e9e; }

@media(max-width:850px){
	.sub01_sh > table > tbody > tr > th{ padding:15px 15px; font-size:20px; width:150px; }
	.sub01_sh > table > tbody > tr > td{ padding:15px 15px; font-size:18px; }
}
@media(max-width:500px){
	.sub01_sh > table > tbody > tr > th{ padding:10px 15px; font-size:16px; font-weight:400; width:120px; background-color:#2d4e9e; }
	.sub01_sh > table > tbody > tr > td{ padding:10px 15px; font-size:15px; font-weight:300; }
}

#sub02{ padding:0; }

.sub02_tt{ border-bottom:1px dashed #888; padding-bottom:20px; margin-bottom:50px; word-break:keep-all; }
.sub02_tt > h2{ font-family:'score'; font-size:40px; font-weight:800; color:#333; }
.sub02_tt > h2 > small{ font-size:0.45em; font-weight:300; color:#777; }

.sub02_his > ul > li{ position:relative; z-index:1; padding-bottom:70px; display:-webkit-box; display:-ms-flexbox; display:flex; }
.sub02_his > ul > li:last-child{ padding-bottom:0; }
.sub02_his > ul > li > h3{ position:relative; z-index:1; white-space:nowrap; padding-right:40px; font-family:'score'; font-size:70px; font-weight:100; color:#2d4e9e; line-height:0.85em; }
.sub02_his > ul > li > h3:before{ content:''; position:absolute; z-index:1; width:0; top:30px; bottom:-100px; right:0; border-left:1px dashed #ddd; }
.sub02_his > ul > li:last-child > h3:before{ content:none; }
.sub02_his > ul > li > h3:after{ content:''; position:absolute; z-index:2; top:15px; right:-14px; box-sizing:border-box; width:29px; height:29px; border-radius:100%; border-top:8px solid #2d4e9e; border-right:8px solid #2d4e9e; border-left:8px solid #b5b4b5; border-bottom:8px solid #b5b4b5; background-color:#fff; transform:rotate(45deg); }
.sub02_his > ul > li > ul{ padding-top:10px; padding-left:40px; }
.sub02_his > ul > li > ul > li{ display:-webkit-box; display:-ms-flexbox; display:flex; margin-bottom:20px; font-size:18px; font-weight:300; color:#666; transform:translate(100px, 0); opacity:0; transition:0.8s transform, 0.8s opacity; word-break:keep-all; }
.sub02_his > ul > li > ul > li.act{ transform:translate(0, 0); opacity:1; }
.sub02_his > ul > li > ul > li:last-child{ margin-bottom:0; }
.sub02_his > ul > li > ul > li > h4{ white-space:nowrap; padding-right:20px; font-size:25px; color:#2d4e9e; }
.sub02_his > ul > li > ul > li > p{ padding-top:5px; }
.sub02_his > ul > li > ul > li > ul{ padding-top:5px; }
.sub02_his > ul > li > ul > li > ul > li{ margin-bottom:5px; }
.sub02_his > ul > li > ul > li > ul > li:last-child{ margin-bottom:0; }


@media(max-width:650px){
	.sub02_his > ul > li{ -webkit-box-lines:multiple; -ms-flex-wrap:wrap; flex-wrap:wrap; }
	.sub02_his > ul > li > h3{ width:100%; border-bottom:2px solid #2d4e9e; padding-bottom:10px; padding-right:0; }
	.sub02_his > ul > li > ul{ width:100%; padding-left:0 }
	.sub02_his > ul > li > h3:before, .sub02_his > ul > li > h3:after{ content:none; } 
	.sub02_his > ul > li > ul > li > h4{ padding-right:15px; }
	.sub02_his > ul > li > ul > li > ul > li{ font-size:17px; }
	.sub02_his > ul > li > ul > li > ul > li:before{ top:10px; }
}

@media(max-width:500px){
	.sub02_tt > h2{ font-size:30px; }

	.sub02_his > ul > li > h3{ font-size:50px; }
	.sub02_his > ul > li > ul > li > h4{ font-size:20px; padding-right:10px; }
	.sub02_his > ul > li > ul > li > ul > li{ font-size:15px; }
	.sub02_his > ul > li > ul > li > ul > li:before{ top:9px; }
}