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

/*  */
.as_innovation {}
.as_innovation .sub01_txt {}
.as_innovation .food { display: flex; gap:240px; margin: 40px 0 0; }
.as_innovation .food .left { flex: 6; display: flex ; flex-direction: column; gap: 44px; }
.as_innovation .food .left h2 { font-size: 34px; }
.as_innovation .food .left h2 span { background:#ffcb02; padding: 0 6px; }
.as_innovation .food .left p { font-size: 18px; color: #666; line-height: 1.7; word-break: keep-all; margin-top: 22px; }
.as_innovation .food .left p strong {color:#000;}
.as_innovation .food .left .up {}
.as_innovation .food .left .down {}
.as_innovation .food .left .small {}
.as_innovation .food .left .small ul { display: flex; gap: 40px; }
.as_innovation .food .left .small ul li {}
.as_innovation .food .left .small ul li .qr {}
.as_innovation .food .left .small ul li .qr img { padding: 20px; box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px; }
.as_innovation .food .left .small ul li .qr h3 { font-size: 16px; font-weight: 400; margin-top: 6px;}
.as_innovation .food .right { flex: 4; }
.as_innovation .food .right .big {}
.as_innovation .food .right .big img { box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; }
.as_innovation .strength {}

.as_innovation .vision { max-width: 1400px; margin-bottom: 150px; margin: 80px auto 160px; }
.as_innovation .vision .box { position: relative; width: 78%; display: flow-root; margin: 0 0 20px; }
.as_innovation .vision .box:nth-child(even) { margin: 0 0 20px auto; }
.as_innovation .vision .box .icon { position: absolute; left: 50%; transform: translate(-50%, 0); width: 170px; height: 170px; display: flex; align-items: center; justify-content: center;border-radius: 50%; background:#faf9f6; border: 3px solid #454546; z-index: 1;}
.as_innovation .vision .box .icon img { width: 50%; }
.as_innovation .vision .box .con { position: relative; width: 50%; float: right; display: flex; flex-direction: column; align-items: flex-end; padding-top: 28px; }
.as_innovation .vision .box:nth-child(odd) .con { float:left; align-items: stretch; }
.as_innovation .vision .box .con h2 { font-size: 32px; padding: 0 0 0 90px; word-break: keep-all; text-align: right; }
.as_innovation .vision .box:nth-child(odd) .con h2 { padding: 0 90px 0 0; text-align: left; }
.as_innovation .vision .box .con h2 strong { color:#FF6200; font-weight: 600; }
.as_innovation .vision .box .con p { position: relative; font-size: 17px; line-height: 1.5; word-break: keep-all; padding: 20px 0 0 200px; color:#666; margin-top: 20px; text-align: right; }
.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 200px 0 0; text-align: left; }
.as_innovation .vision .box .con p:before { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 1px; background: #e5e5e5; }

#sub01{ }
.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{ font-size:18px; font-weight:400; color:#666; line-height:1.7em; }
.sub01_txt > p strong { color: #000000; font-weight: 500; }

@media all and (max-width:1400px) {
	.as_innovation .vision .box .con p { padding: 20px 0 0 180px; }
	.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 180px 0 0; }
	.as_innovation .food { gap: 160px; }
}

@media all and (max-width:1200px) {
	.as_innovation .vision .box { width:82%; }
	.as_innovation .vision .box .icon { width: 160px; height: 160px; }
	.as_innovation .vision .box .con h2 { font-size: 28px; }
	.as_innovation .vision .box .con p { padding: 20px 0 0 120px; }
	.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 120px 0 0; }
	.as_innovation .food { gap: 100px; }
	.as_innovation .food .left h2 { font-size: 30px; }
}

@media all and (max-width:1024px) {
	.as_innovation .food { gap: 80px; }
	.as_innovation .vision .box { width: 100%; }
	.as_innovation .vision .box { margin: 0 0 40px; }
	.as_innovation .vision .box:nth-child(even) { margin: 0 0 40px; }
}

@media all and (max-width:896px) {
	.as_innovation .vision .box .con h2 { font-size: 24px; }
	.as_innovation .food .left h2 { font-size:26px; }
	.as_innovation .food .left .small ul { gap:20px; }
	.as_innovation .food .left .small ul li .qr img { padding:0; }
}

@media(max-width:767px){
	.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; }
	.as_innovation .vision .box .icon { left: 80%; }
	.as_innovation .vision .box:nth-child(even) .icon { left:20%; }
	.as_innovation .vision .box .con { width:80%; }
	.as_innovation .vision .box { margin: 0 0 60px; }
	.as_innovation .vision .box:nth-child(even) { margin: 0 0 60px; }
	.as_innovation .vision .box .con p { padding: 20px 0 0 180px; }
	.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 180px 0 0; }
	.as_innovation .food { flex-direction: column; }
	.as_innovation .food .left .small ul li .qr img { padding:40px; }
	.as_innovation .food .right .big { width: 60%; margin: 0 auto; }

}
@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; }
	.as_innovation .vision .box .icon { width:150px; height:150px }
	.as_innovation .vision .box .con p { font-size: 16px; }
	.as_innovation .vision .box .icon { right: 0; transform: none; left: auto; }
	.as_innovation .vision .box:nth-child(even) .icon { left:0; }
	.as_innovation .vision .box .con { width:100%; }
	.as_innovation .vision .box .con h2 { padding: 0 0 0 170px; }
	.as_innovation .vision .box:nth-child(odd) .con h2 { padding: 0 170px 0 0; }
	.as_innovation .vision .box .con p { padding: 20px 0 0 170px; }
	.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 170px 0 0; }
	.as_innovation .food .left h2 { font-size:24px; }
	.as_innovation .food .left .small ul li .qr img { padding:20px; }
	.as_innovation .food .right .big { width: 100%; }

}

@media all and (max-width:480px) {
		.as_innovation .vision .box .icon { width:130px; height:130px }
		.as_innovation .vision .box .con h2 { font-size:22px; padding: 0 0 0 140px; }
		.as_innovation .vision .box:nth-child(odd) .con h2 { padding: 0 140px 0 0; }
		.as_innovation .vision .box .con p { padding: 20px 0 0 140px; }
		.as_innovation .vision .box:nth-child(odd) .con p { padding: 20px 140px 0 0; }
		.as_innovation .food .left .small ul li .qr img { padding:0; }
}


.fadeInMoveLeft { opacity:0; }
.fadeInMoveLeft.active { animation: fadeInMoveLeft 1s ease-out forwards; }
.fadeInMoveRight { opacity:0; }
.fadeInMoveRight.active { animation: fadeInMoveRight 1s ease-out forwards; }
.fadeIn { opacity:0; }
.fadeIn.active { animation: fadeIn 1.1s ease-out forwards; }
.fadeUp { opacity:0; }
.fadeUp.active { animation: fadeUp 1.1s ease-out forwards; }
.fadeDown { opacity:0; }
.fadeDown.active { animation: fadeDown 1s ease-out forwards; }
.flipUp { opacity: 0; }
.flipUp.active { animation: flipUp 1s ease-out forwards; transform-style: preserve-3d; }
.flipUp.active:nth-child(1) { animation-delay: 0.2s; }
.flipUp.active:nth-child(2) { animation-delay: 0.4s; }
.flipUp.active:nth-child(3) { animation-delay: 0.6s; }
.flipUp.active:nth-child(4) { animation-delay: 0.8s; }
.flipUp.active:nth-child(5) { animation-delay: 0.2s; }
.flipUp.active:nth-child(6) { animation-delay: 0.4s; }
.flipUp.active:nth-child(7) { animation-delay: 0.6s; }
.flipUp.active:nth-child(8) { animation-delay: 0.8s; }
.scaleIn { opacity: 0; transform: scale(0.8); }
.scaleIn.active { animation: scaleIn 1s ease-out forwards; }
.scaleOut { opacity: 0; transform: scale(1.2); }
.scaleOut.active { animation: scaleOut 1s ease-out forwards; }
.rotateIn { opacity: 0; transform: rotate(180deg); }
.rotateIn.active { animation: rotateIn 1.2s ease-out forwards; }
.bounceUp { opacity: 0; transform: translateY(50px); }
.bounceUp.active { animation: bounceUp 1.2s ease-out forwards; }
.blurIn { opacity: 0; filter: blur(10px); }
.blurIn.active { animation: blurIn 1s ease-out forwards; }
.flipSide { opacity: 0; transform: rotateY(90deg); transform-style: preserve-3d; }
.flipSide.active { animation: flipSide 1s ease-out forwards; }

@keyframes scaleIn {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes scaleOut {
    0% {
        opacity: 0;
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes rotateIn {
    0% {
        opacity: 0;
        transform: rotate(180deg);
    }
    100% {
        opacity: 1;
        transform: rotate(0deg);
    }
}
@keyframes bounceUp {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }
    60% {
        opacity: 1;
        transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes blurIn {
    0% {
        opacity: 0;
        filter: blur(10px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
    }
}
@keyframes flipSide {
    0% {
        opacity: 0;
        transform: rotateY(90deg);
    }
    100% {
        opacity: 1;
        transform: rotateY(0deg);
    }
}

@keyframes fadeInMoveLeft {
    0% {
        opacity: 0;
        transform: translateX(30%);
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeInMoveRight {
    0% {
        opacity: 0;
        transform: translateX(-30%);
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translate3d(0px, 100px, 0px);
    }

    100% {
        opacity: 1;
        transform: translate3d(0px, 0px, 0px);
    }
}

@keyframes fadeDown {
    0% {
        opacity: 0;
        transform: translate3d(0px, -100px, 0px);
    }

    100% {
        opacity: 1;
        transform: translate3d(0px, 0px, 0px);
    }
}

@keyframes flipUp {
    0%{
        opacity: 0;
        transform: rotateX(-90deg);
	}

    100% {
        opacity: 1;
        transform: rotateX(0deg);
	}
}
