.sub_wrap, .sub_wrap *{ box-sizing:border-box; }

#sub01{ padding:0 0 200px; }
.sub01_img{ width:100%; padding-top:40%; min-height:400px; margin-bottom:50px; box-shadow:3px 3px 7px 0 rgba(0,0,0,0.3); background-color:#333; /*background-image:url(../img/main/02-01.jpg);*/ background-position:center; background-size:cover; background-repeat:no-repeat; }

.sub01_vid{ display:block; width:100%; margin-bottom:60px; box-shadow:5px 5px 8px 0 rgba(0,0,0,0.3); }

.sub01_txt{ word-break:keep-all; }

.sub01_slo{ margin-bottom:30px; display:-webkit-box; display:-ms-flexbox; display:flex; }
.sub01_slo > h2{ font-size:40px; font-weight:300; color:#333; line-height:1.3em; white-space:nowrap; padding-right:30px; }
.sub01_slo > h2 > strong{ font-weight:900; }
.sub01_slo h4{ font-size:30px; font-weight:700; color:#333; line-height:1em; margin-bottom:15px; }
.sub01_slo p{ font-size:24px; font-weight:300; color:#333; line-height:1.5em; }
.sub01_slo p > strong{ font-weight:700; }

.sub01_txt > h3{ overflow:hidden; z-index:1; font-family:'score'; font-size:40px; font-weight:300; color:#333; line-height:1em; margin-bottom:30px; }
.sub01_txt > h3 > span{ position:relative; z-index:1; font-weight:700; color:#ffcb02; text-shadow:1px 1px 0 #aaaaaa; padding-right:30px; }
.sub01_txt > h3 > span:after{ content:''; position:absolute; top:50%; left:100%; right:-5000px; height:1px; background-color:#333; }
.sub01_txt > p{ column-count:2; column-gap:30px; column-width:400px; font-size:17px; font-weight:300; color:#666; line-height:1.7em; }


@media(max-width:750px){
	.sub01_slo{ flex-direction:column; }
	.sub01_slo > h2{ padding-right:0; margin-bottom:10px; }
	.sub01_slo > h2 > br{ display:none; }
	.sub01_slo h4{ display:none; }
	.sub01_slo p{ font-size:18px; }
}
@media(max-width:600px){
	.sub01_img{ min-height:300px; }
	.sub01_txt > h3{ font-size:29px; margin-bottom:20px; }
	.sub01_txt > h3 > span:after{ content:none; }
	.sub01_txt > p{ font-size:15px; }
}




#sub02{  }

.sub02_tt{ word-break:keep-all; }
.sub02_tt > h2{ overflow:hidden; z-index:1; font-family:'score'; font-size:40px; font-weight:300; color:#333; line-height:1em; margin-bottom:60px; }
.sub02_tt > h2 > span{ position:relative; z-index:1; font-weight:700; color:#ffcb02; text-shadow:1px 1px 0 #aaaaaa; padding-right:30px; }
.sub02_tt > h2 > span:after{ content:''; position:absolute; top:50%; left:100%; right:-5000px; height:1px; background-color:#333; }
.sub02_tt > p{ column-count:2; column-gap:30px; column-width:400px; font-size:17px; font-weight:300; color:#666; line-height:1.7em; }

/*.sub02_tt{ max-width:820px; width:100%; text-align:center; margin:0 auto 80px; word-break:keep-all; }
.sub02_tt > h2{ font-family:'score'; font-size:40px; font-weight:700; color:#333; margin-bottom:10px; line-height:1em; }
.sub02_tt > p{ font-size:18px; font-weight:300; color:#666; }*/

.sub02_mv_wrap{ margin:0 -30px 80px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; -webkit-box-lines:multiple; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; }
.sub02_mv{ width:50%; padding:0 30px; display:-webkit-box; display:-ms-flexbox; display:flex; transform:translate(0, 100px); opacity:0; transition:1s opacity, 1s transform; }
.sub02_mv.act{ transform:translate(0, 0); opacity:1; }
.sub02_mv_box{ padding:40px 30px; width:100%; text-align:center; word-break:keep-all; background-color:#f5f5f5; border-radius:10px; box-shadow:2px 2px 6px 0 rgba(0,0,0,0.2); display:-webkit-box; display:-ms-flexbox; display:flex; flex-direction:column; -webkit-box-align:center; -ms-flex-align:center; align-items:center; }
.sub02_mv_box > h3{ overflow:hidden; z-index:1; font-family:'score'; font-size:30px; font-weight:700; color:#333; line-height:1em; margin-bottom:20px; }
.sub02_mv_box > p{ font-size:17px; font-weight:300; color:#666; line-height:1.7em; }

.sub02_pt_wrap{ margin:0 -20px; display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; -webkit-box-lines:multiple; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; }
.sub02_pt{ width:25%; padding:0 20px; display:-webkit-box; display:-ms-flexbox; display:flex; transform:translate(0, 100px); opacity:0; transition:1s opacity, 1s transform; }
.sub02_pt.act{ transform:translate(0, 0); opacity:1; }
.sub02_box{ width:100%; word-break:keep-all; }
.sub02_cir{ position:relative; z-index:1; max-width:280px; width:100%; margin:0 auto 25px; }
.sub02_cir > .cir_bg{ width:100%; padding-top:100%; border:1px solid #d0c4df; background-color:#ffcf00; border-radius:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }
.sub02_cir > .cir_fr{ position:absolute; top:50%; left:50%; max-width:120px; width:35%; transform:translate(-50%,-50%); text-align:center; } 
.sub02_cir > .cir_fr > .sub02_img{ max-width:80px; width:100%; margin:0 auto 10px; }
.sub02_cir > .cir_fr > .sub02_img > img{ max-width:100%; width:100%; height:auto; display:block; filter:drop-shadow(1px 1px 1px rgba(0,0,0,0.3)) }
.sub02_cir > .cir_fr > h3{ font-size:30px; font-weight:600; color:#fff; text-shadow:2px 2px 2px rgba(0,0,0,0.3); white-space:nowrap; }

.sub02_txt{ text-align:center; word-break:keep-all; }
.sub02_txt > h4{ font-size:24px; font-weight:700; color:#333; }
.sub02_txt > p{ font-size:18px; font-weight:300; color:#666; }


@media(max-width:750px){
	.sub02_mv{ width:100%; padding:0 30px 30px; }
	.sub02_pt{ width:50%; padding:0 20px 50px; }
}
@media(max-width:600px){
	.sub02_tt > h2{ font-size:29px; margin-bottom:20px; }
	.sub02_tt > h2 > span{ padding-right:0; }
	.sub02_tt > h2 > span:after{ content:none; }
	.sub02_tt > p{ font-size:15px; }
}
@media(max-width:500px){
	/*.sub02_pt{ width:100%; }*/
	.sub02_txt > p{ font-size:17px; }
}