@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Bungee&display=swap");body{
margin:0;padding:0
}
.allWrap_inner{
overflow:visible !important
}
.cm-wrap{
font-size:16px;color:#464646;line-height:1.5
}
.cm-wrap *{
box-sizing:border-box;margin:0;padding:0
}
.cm-wrap picture,.cm-wrap img{
display:block;width:100%
}
@media screen and (max-width: 1000px){
.cm-wrap{
font-size:calc(16 / 1000 * 100vw)
}

}
@media screen and (min-width: 641px){
.cm-wrap .sp{
display:none
}

}
@media screen and (max-width: 640px){
.cm-wrap{
font-size:calc(16 / 800 * 100vw)
}
.cm-wrap .pc{
display:none
}

}
.bebas{
font-family:"Bebas Neue", sans-serif
}
.bungee{
font-family:"Bungee", sans-serif
}
.cm-inner{
position:relative;max-width:1000px;margin:0 auto
}
@media screen and (max-width: 640px){
.cm-scrolled .mainHeader._open{
box-shadow:0 0 1em rgba(0,0,0,0.2)
}

}
.js-effect.fade-up{
opacity:0;transform:translate(0, 4em);transition:.5s
}
.js-effect.is-view.fade-up{
opacity:1;transform:translate(0, 0)
}
.cm-kv{
background-color:#FF0000;padding:3em 0;position:relative
}
.cm-kv:after{
content:"";display:none;position:absolute;left:50%;top:0;bottom:0;border-left:1px solid #fff
}
.cm-kv .cm-inner{
max-width:1000px
}
.cm-kv .pic_back,.cm-kv .pic_front{
position:absolute;left:21%;top:0%;width:calc(1226 / 2000 * 100%)
}
.cm-kv .pic_front{
clip-path:polygon(0% 48%, 100% 48%, 100% 60%, 0% 60%)
}
.cm-kv .ni{
width:calc(1970 / 2000 * 100%);margin:0 auto;position:relative;clip-path:polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%)
}
.cm-kv .pon{
position:absolute;left:69.5%;top:64%;width:calc(584 / 2000 * 100%);clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%)
}
.cm-kv .hin{
width:calc(1463 / 2000 * 100%);margin:3em auto 0;position:relative;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%)
}
.cm-kv.is-view .ni{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition:.7s ease .3s
}
.cm-kv.is-view .pon{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition:.3s ease .9s
}
.cm-kv.is-view .hin{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);transition:.7s ease 1.2s
}
@media screen and (max-width: 640px){
.cm-kv{
padding:6em 0 6em;overflow:hidden
}
.cm-kv .pic_back,.cm-kv .pic_front{
left:5%;top:2%;width:calc(873 / 800 * 100%)
}
.cm-kv .pic_front{
clip-path:polygon(0% 20%, 100% 20%, 100% 77%, 0% 77%)
}
.cm-kv .ni{
width:calc(728 / 800 * 100%)
}
.cm-kv .pon{
position:relative;left:auto;top:auto;width:calc(720 / 800 * 100%);margin:1.5em auto 0;transition:.5s ease .9s
}
.cm-kv .pon picture,.cm-kv .pon img{
clip-path:polygon(0% 0%, 100% 0%, 100% 50%, 0% 50%, 0% 100%, 0% 100%, 0% 100%);transition:.5s ease 1.3s
}
.cm-kv .hin{
display:none
}
.cm-kv.is-view .pon picture,.cm-kv.is-view .pon img{
clip-path:polygon(0% 0%, 100% 0%, 100% 50%, 0% 50%, 100% 50%, 100% 100%, 0% 100%)
}

}
.cm-introduction{
background-color:#FF0000;padding:3em 0 4em
}
.cm-introduction .cm-inner+.cm-inner{
margin-top:-4em
}
.cm-introduction .blk1{
display:flex;align-items:center;justify-content:center
}
.cm-introduction .blk1>div{
position:relative;overflow:hidden
}
.cm-introduction .blk1 .bg_01{
width:calc(1628 / 2000 * 100%);margin:0 0 0 auto;clip-path:polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);transition:.5s ease .1s
}
.cm-introduction .blk1 .hd_01{
position:absolute;left:8%;top:5%;width:calc(927 / 2000 * 100%)
}
.cm-introduction .blk1 .hd_01>picture,.cm-introduction .blk1 .hd_01>img{
position:absolute;left:0;top:0;width:100%;height:100%;opacity:0
}
.cm-introduction .blk1 .hd_01 .bg_red{
position:absolute;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0)
}
.cm-introduction .blk1 .hd_01 .bg_red.bg_red1{
left:17%;top:0%;width:calc(606 / 927 * 100%);transition:.5s ease .2s
}
.cm-introduction .blk1 .hd_01 .bg_red.bg_red2{
left:0%;bottom:0%;width:calc(890 / 927 * 100%);transition:.5s ease .3s
}
.cm-introduction .blk1 .hd_01 .text{
position:relative;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0);transition:.5s ease .8s
}
.cm-introduction .blk1 .hd_02{
position:absolute;left:65%;top:24%;width:calc(1083 / 2000 * 100%)
}
.cm-introduction .blk1 .hd_02>picture,.cm-introduction .blk1 .hd_02>img{
position:absolute;left:0;top:0;width:100%;height:100%;opacity:0
}
.cm-introduction .blk1 .hd_02 .bg_red{
position:absolute;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);opacity:0;transform:translate(-3em, 0)
}
.cm-introduction .blk1 .hd_02 .bg_red.bg_red1{
left:21%;top:0%;width:calc(853 / 1083 * 100%);transition:.5s ease .8s
}
.cm-introduction .blk1 .hd_02 .bg_red.bg_red2{
left:0%;bottom:0%;width:calc(1079 / 1083 * 100%);transition:.5s ease .9s
}
.cm-introduction .blk1 .hd_02 .text{
position:relative;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0);transition:.5s ease 1.4s
}
.cm-introduction .blk1 .text_01{
position:absolute;left:11%;top:56%;width:calc(581 / 2000 * 100%);clip-path:polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%);opacity:1;transition:.8s ease 1.7s
}
.cm-introduction .blk2{
display:flex;align-items:center;justify-content:center
}
.cm-introduction .blk2>div{
position:relative;overflow:hidden
}
.cm-introduction .blk2 .bg_02{
width:calc(1476 / 2000 * 100%);margin:0 auto 0 0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transition:.5s ease .1s
}
.cm-introduction .blk2 .hd_03{
position:absolute;left:-25.5%;top:73%;width:calc(1274 / 2000 * 100%)
}
.cm-introduction .blk2 .hd_03>picture,.cm-introduction .blk2 .hd_03>img{
position:absolute;left:0;top:0;width:100%;height:100%;opacity:0
}
.cm-introduction .blk2 .hd_03 .bg_red{
position:absolute;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);opacity:0;transform:translate(-3em, 0);transition:.5s ease .5s
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red1{
left:21%;top:0%;width:calc(856 / 1274 * 100%);transition:.5s ease .2s
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red2{
left:0%;top:19%;width:calc(853 / 1274 * 100%);transition:.5s ease .3s
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red3{
right:0%;bottom:0%;width:calc(994 / 1274 * 100%);transition:.5s ease .4s
}
.cm-introduction .blk2 .hd_03 .text{
position:relative;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0);transition:.5s ease .8s
}
.cm-introduction .is-view .blk1 .bg_01{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)
}
.cm-introduction .is-view .blk1 .hd_01 .bg_red{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-introduction .is-view .blk1 .hd_01 .text{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-introduction .is-view .blk1 .hd_02 .bg_red{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-introduction .is-view .blk1 .hd_02 .text{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-introduction .is-view .blk1 .text_01{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1
}
.cm-introduction .is-view .blk2 .bg_02{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%)
}
.cm-introduction .is-view .blk2 .hd_03 .bg_red{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-introduction .is-view .blk2 .hd_03 .text{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
@media screen and (max-width: 640px){
.cm-introduction .blk1 .bg_01{
width:calc(667 / 800 * 100%)
}
.cm-introduction .blk1 .hd_01{
left:-22%;top:3%;width:calc(808 / 800 * 100%)
}
.cm-introduction .blk1 .hd_02{
left:28%;top:21%;width:calc(778 / 800 * 100%)
}
.cm-introduction .blk1 .text_01{
left:8%;top:41%;width:calc(498 / 800 * 100%)
}
.cm-introduction .blk2 .bg_02{
width:calc(707 / 800 * 100%)
}
.cm-introduction .blk2 .hd_03{
left:-58%;top:4%;width:calc(1140 / 800 * 100%)
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red1{
left:35%;width:calc(593 / 1140 * 100%)
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red2{
width:calc(775 / 1140 * 100%)
}
.cm-introduction .blk2 .hd_03 .bg_red.bg_red3{
width:calc(775 / 1140 * 100%)
}

}
.cm-brand{
background-color:#fff;padding:5em 0
}
.cm-brand .blk1{
display:block
}
.cm-brand .blk1>div{
overflow:hidden;width:100%
}
.cm-brand .text{
position:relative
}
.cm-brand .text_01{
width:calc(1204 / 2000 * 100%);left:11%;position:relative
}
.cm-brand .text_01>picture,.cm-brand .text_01>img{
opacity:0
}
.cm-brand .text_01 .text{
position:absolute;left:0;top:0;width:100%;height:100%
}
.cm-brand .text_01 .text>div{
clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);opacity:0
}
.cm-brand .text_01 .text>div:nth-child(1){
transition:.3s ease .1s
}
.cm-brand .text_01 .text>div:nth-child(2){
transition:.3s ease 1s
}
.cm-brand .text_01 .text>div:nth-child(3){
transition:.3s ease 1.2s
}
.cm-brand .text_01 .text>div:nth-child(4){
transition:.3s ease 1.4s
}
.cm-brand .text_01 .text>div:nth-child(5){
transition:.3s ease 1.6s;display:none
}
.cm-brand .hd_01{
position:absolute;left:-8.5%;top:16%;width:calc(1022 * (1204 / 1010) / 2000 * 100%);clip-path:polygon(30% 0%, 100% 0%, 100% 100%, 19% 100%)
}
.cm-brand .hd_01>picture,.cm-brand .hd_01>img{
position:absolute;left:0;top:0;width:100%;height:100%;opacity:0
}
.cm-brand .hd_01 .bg_red{
position:absolute;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0)
}
.cm-brand .hd_01 .bg_red.bg_red1{
left:2%;top:0%;width:calc(870 / 1022 * 100%);transition:.3s ease .2s
}
.cm-brand .hd_01 .bg_red.bg_red2{
left:0%;bottom:1%;width:calc(1022 / 1022 * 100%);transition:.3s ease .3s
}
.cm-brand .hd_01 .text{
position:relative;opacity:0;clip-path:polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);transform:translate(-3em, 0);transition:.3s ease .6s
}
.cm-brand .pic_list_wrap{
width:100%;overflow:hidden
}
.cm-brand .pic_list{
position:relative;width:100%;margin:0 auto 0;transform:translate(100%, -20em) scale(0.1);filter:blur(1em);opacity:0;transition:transform 1.5s ease .1s, opacity 1s ease .1s, filter 1s ease .1s, margin 1s ease 1s
}
.cm-brand .pic_list .pic_list_c1{
width:calc(calc(384 / 32 * 8em) + calc(20 / 16 * 8em));position:relative;animation:picloop 15s linear infinite
}
.cm-brand .pic_list .pic_list_c1 .pic_list_imgs{
width:calc(calc(384 / 32 * 8em) + calc(20 / 16 * 8em));display:grid;grid-template-columns:repeat(8, 1fr);gap:calc(20 / 16 * 1em);padding-right:calc(20 / 16 * 1em)
}
.cm-brand .pic_list .pic_list_c1 .pic_list_imgs:nth-child(2){
position:absolute;left:-100%;top:0
}
.cm-brand .pic_list .pic_list_c1 .pic_list_imgs:nth-child(3){
position:absolute;left:100%;top:0
}
.cm-brand .pic_list .pic_list_c1 .pic_list_imgs:nth-child(4){
position:absolute;left:200%;top:0
}
.cm-brand.is-view .text_01 .text>div{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1
}
.cm-brand.is-view .hd_01{
opacity:1;transform:translate(0, 0)
}
.cm-brand.is-view .hd_01 .bg_red{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-brand.is-view .hd_01 .text{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1;transform:translate(0, 0)
}
.cm-brand.is-view .pic_list{
margin:5em auto 0;transform:translate(0, 0) scale(1);filter:blur(0);opacity:1
}
@media screen and (max-width: 640px){
.cm-brand .text_01{
width:calc(673 / 800 * 100%);left:auto;margin:0 auto
}
.cm-brand .text_01 .text>div:nth-child(5){
display:block
}
.cm-brand .hd_01{
left:-27%;top:11%;width:calc(884 / 800 * 100%);clip-path:polygon(19% 0%, 100% 0%, 100% 100%, 19% 100%)
}
.cm-brand .pic_list{
transform:translate(200%, -20em) scale(0.1)
}
.cm-brand .pic_list .pic_list_c1{
width:calc(calc(254 / 16 * 8em) + calc(20 / 16 * 8em));animation:picloop_sp 15s linear infinite
}
.cm-brand .pic_list .pic_list_c1 .pic_list_imgs{
width:calc(calc(254 / 16 * 8em) + calc(20 / 16 * 8em));padding-right:calc(20 / 16 * 1em)
}
.cm-brand.is-view .pic_list{
margin:10em auto 0;transform:translate(0, 0) scale(1)
}

}
@keyframes picloop{
0%{
left:0
}
100%{
left:-106em
}

}
@keyframes picloop_sp{
0%{
left:0
}
100%{
left:-137em
}

}
.common-h2{
font-size:calc(31 / 16 * 1em);font-weight:400;line-height:calc(36 / 31);letter-spacing:calc(2 / 31 * 1em);color:#FF0000;text-align:center
}
.common-h2 span{
display:inline-block;border-bottom:calc(4 / 31 * 1em) solid red
}
@media screen and (max-width: 640px){
.common-h2{
font-size:calc(64 / 16 * 1em)
}

}
.cm-movie{
background-color:#D9D9D9;padding:5em 0 7em
}
.cm-movie .movie-wrap{
position:relative;margin:0 auto
}
.cm-movie .movie-wrap:before{
content:"";display:block;position:absolute;left:0;top:0;width:100%;height:100%;background-color:#ff0000;transform:skewX(-10deg)
}
.cm-movie .movie-wrap1{
width:calc(730 / 1000 * 100%);padding:calc(30 / 16 * 1em) calc(50 / 16 * 1em)
}
.cm-movie .movie{
position:relative;box-shadow:2px 2px 14px rgba(0,0,0,0.6)
}
.cm-movie .movie>div{
padding-top:56.25%;position:relative
}
.cm-movie .movie>div:after{
content:"";display:block;position:absolute;left:calc(50% - calc(30 / 16 * 1em));top:calc(50% - calc(30 / 16 * 1em));width:calc(60 / 16 * 1em);height:calc(60 / 16 * 1em);background:url(../imgs/movie/icon_play.png) center center no-repeat;background-size:contain;pointer-events:none
}
.cm-movie .movie iframe,.cm-movie .movie img{
display:block;position:absolute;left:0;top:0;width:100%;height:100%
}
.cm-movie .movie-clms{
display:flex;justify-content:center;gap:calc(30 / 16 * 1em);margin-top:3em
}
.cm-movie .movie-clms>div{
width:calc(360 / 16 * 1em)
}
.cm-movie .movie-clms .movie-wrap{
padding:calc(20 / 16 * 1em) calc(30 / 16 * 1em)
}
.cm-movie .movie-text{
text-align:center;margin:2em auto 0;color:#464646
}
.cm-movie .movie-text p{
font-size:calc(12 / 16 * 1em)
}
.cm-movie .movie-text p strong{
font-size:calc(17 / 12 * 1em);font-weight:500
}
.cm-movie .movie1{
margin:6em auto 0
}
.cm-movie .making-movie{
text-align:center;color:#FF0000;font-size:calc(30 / 16 * 1em);font-weight:400;letter-spacing:calc(3 / 30 * 1em);width:7em;margin:3em auto 0;position:relative
}
.cm-movie .making-movie:before,.cm-movie .making-movie:after{
content:"";display:block;position:absolute;top:0;height:100%;border-left:1px solid #ff0000
}
.cm-movie .making-movie:before{
left:0;transform:rotate(-20deg)
}
.cm-movie .making-movie:after{
right:0;transform:rotate(20deg)
}
.cm-movie .movie3{
margin:1em auto 0
}
@media screen and (max-width: 640px){
.cm-movie .movie-clms{
margin-top:calc(30 / 16 * 1em);flex-wrap:wrap
}
.cm-movie .movie-clms>div{
width:calc(730 / 1000 * 100%)
}
.cm-movie .movie-clms .movie-wrap{
padding:calc(30 / 16 * 1em) calc(50 / 16 * 1em)
}
.cm-movie .movie-text p{
font-size:calc(24 / 16 * 1em)
}
.cm-movie .movie-text p strong{
font-size:calc(32 / 24 * 1em)
}
.cm-movie .making-movie{
font-size:calc(44 / 16 * 1em)
}

}
.cm-movie-story{
background-color:#fff;display:flex;justify-content:center;align-items:center;gap:3em;width:calc(676 / 1000 * 100%);margin:3em auto 0;padding:1.5em 0
}
.cm-movie-story .img{
width:calc(347 / 32 * 1em)
}
.cm-movie-story .text{
text-align:center;color:#464646
}
.cm-movie-story .text h3{
font-size:calc(29 / 16 * 1em);font-weight:400;letter-spacing:calc(3 / 29 * 1em)
}
.cm-movie-story .text p{
font-size:calc(15 / 16 * 1em);line-height:calc(28 / 15);margin-top:1em
}
@media screen and (max-width: 640px){
.cm-movie-story{
width:calc(680 / 800 * 100%);display:block;margin:4em auto 0;padding:4em 0
}
.cm-movie-story .img{
width:calc(384 / 680 * 100%);margin:0 auto
}
.cm-movie-story .text{
margin:3em auto 0
}
.cm-movie-story .text h3{
font-size:calc(44 / 16 * 1em)
}
.cm-movie-story .text p{
font-size:calc(27 / 16 * 1em);text-align:justify;width:calc(558 / 680 * 100%);margin:1em auto 0
}

}
.cm-quality{
padding:5em 0 0;position:relative
}
.cm-quality:after{
content:"";display:block;margin:-30em auto 0;max-width:1000px;background:url(../imgs/quality/bg_01.jpg) center bottom no-repeat #fff;background-size:100% auto;aspect-ratio:2000 / 2048
}
.cm-quality .text_01{
margin:3em auto 0;width:calc(1204 / 2000 * 100%)
}
.cm-quality .cap1{
text-align:center;font-size:calc(15 / 16 * 1em);line-height:calc(29 / 15);margin:3em auto 0
}
.cm-quality .cap1 strong{
color:#ff0000;font-weight:inherit
}
@media screen and (max-width: 640px){
.cm-quality:after{
margin:-40vw auto 0
}
.cm-quality .text_01{
width:calc(708 / 800 * 100%);margin:4em auto 0
}
.cm-quality .cap1{
font-size:calc(24 / 16 * 1em)
}

}
.graph-wrap{
width:calc(424 / 1000 * 100%);margin:3em auto 0;position:relative
}
.graph-wrap .circle{
transform:rotate(-90deg)
}
.graph-wrap .circle circle{
fill:none;stroke-width:32px;opacity:0
}
.graph-wrap .circle circle:nth-child(1){
stroke:#E40000;stroke-dasharray:0,100;stroke-dashoffset:0;transition:.6s ease .4s
}
.graph-wrap .circle circle:nth-child(2){
stroke:#CB0303;stroke-dasharray:0,100;stroke-dashoffset:-33;transition:.6s ease .7s
}
.graph-wrap .circle circle:nth-child(3){
stroke:#FF0000;stroke-dasharray:0,100;stroke-dashoffset:-67;transition:.6s ease .1s
}
.graph-wrap .circle2{
position:absolute;left:0;top:0;width:100%;height:100%;background-color:#fff;border-radius:50%;transform:scale(0.32)
}
.graph-wrap .front{
position:absolute;left:0;top:0;width:100%;opacity:0;transition:.8s ease 1.3s
}
.graph-wrap .graph_bg{
position:absolute;left:0;top:0;width:100%
}
.graph-wrap .graph_pic{
position:absolute;opacity:0
}
.graph-wrap .graph_pic.pic_01{
left:13.7%;top:25.3%;width:calc(158 / 848 * 100%);transition:.8s ease .4s
}
.graph-wrap .graph_pic.pic_02{
left:68.6%;top:22.6%;width:calc(173 / 848 * 100%);transition:.8s ease .7s
}
.graph-wrap .graph_pic.pic_03{
left:38.5%;top:68.6%;width:calc(202 / 848 * 100%);transition:.8s ease 1s
}
.graph-wrap.is-view .circle circle{
opacity:1
}
.graph-wrap.is-view .circle circle:nth-child(1){
stroke-dasharray:33,100
}
.graph-wrap.is-view .circle circle:nth-child(2){
stroke-dasharray:34,100
}
.graph-wrap.is-view .circle circle:nth-child(3){
stroke-dasharray:33,100
}
.graph-wrap.is-view .front{
opacity:0
}
.graph-wrap.is-view .graph_pic{
opacity:1
}
@media screen and (max-width: 640px){
.graph-wrap{
margin:4em auto 0;width:calc(596 / 800 * 100%)
}

}
.quality-c1{
display:flex;justify-content:center;margin:3em auto 0
}
.quality-c1>div{
width:calc(280 / 16 * 1em);padding:0.5em calc(28 / 16 * 1em) 1em;color:#464646
}
.quality-c1>div+div{
border-left:1px solid #000
}
.quality-c1 .ft{
width:calc(332 / 32 * 1em);margin:0 auto
}
.quality-c1 h3{
text-align:center;font-size:calc(18 / 16 * 1em);font-weight:700;margin:1em auto 0
}
.quality-c1 p{
text-align:justify;font-size:calc(14 / 16 * 1em);line-height:calc(26 / 14);margin:calc(10 / 14 * 1em) auto 0
}
@media screen and (max-width: 640px){
.quality-c1{
display:block;width:calc(680 / 800 * 100%);margin:4em auto 0
}
.quality-c1>div{
display:flex;align-items:center;gap:2em;padding:0;width:100%
}
.quality-c1>div+div{
border-left:none;margin-top:2em
}
.quality-c1 .ft{
width:calc(174 / 16 * 1em);flex-shrink:0
}
.quality-c1 .ft+div{
flex:1
}
.quality-c1 h3{
text-align:left;font-size:calc(32 / 16 * 1em);margin:0
}
.quality-c1 p{
font-size:calc(20 / 16 * 1em);margin-top:calc(4 / 20 * 1em);line-height:calc(32 / 20)
}

}
.quality-text_02{
width:calc(1164 / 2000 * 100%);margin:6em auto 0 11%;clip-path:polygon(0% 0%, 100% 0%, 100% 0%, 0% 0%);opacity:0;transition:1.5s ease .1s
}
.quality-text_02>div+div{
margin-top:3em
}
.quality-text_02>div:nth-child(1){
width:calc(978 / 1164 * 100%)
}
.quality-text_02>div:nth-child(3){
width:calc(564 / 1164 * 100%)
}
.quality-text_02.is-view{
clip-path:polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);opacity:1
}
@media screen and (max-width: 640px){
.quality-text_02{
width:calc(602 / 800 * 100%);margin:8em auto 0;transition:2.5s ease .1s
}

}
.cm-app{
background-color:#ff0000;position:relative;padding:7em 0 3em
}
.cm-app:before,.cm-app:after{
content:"";display:block;position:absolute;left:0;width:100%;height:3em;background:#000000;background:linear-gradient(180deg, transparent 0%, #000 100%);opacity:.3
}
.cm-app:before{
top:0;transform:scale(1, -1)
}
.cm-app:after{
bottom:0
}
.cm-app h3{
text-align:center;color:#fff;font-size:calc(20 / 16 * 1em);font-weight:700;position:relative;line-height:calc(25 / 20)
}
.cm-app h3 strong{
display:block;font-size:calc(40 / 20 * 1em);font-weight:700
}
.cm-app h3:before,.cm-app h3:after{
content:"";display:block;position:absolute;top:0;height:100%;border-left:2px solid #fff
}
.cm-app h3:before{
left:calc(50% - 9em);transform:rotate(-24deg)
}
.cm-app h3:after{
left:calc(50% + 9em);transform:rotate(24deg)
}
.cm-app .title{
width:calc(1560 / 2000 * 100%);margin:1.5em auto 0
}
.cm-app .grad_01{
background:#ffffff;background:linear-gradient(180deg, #fff 0%, #c3e3ea 100%);margin:7em auto 0;padding:1em 0
}
.cm-app .grad_01>.cm-inner{
top:-7em;margin-bottom:-9em
}
@media screen and (max-width: 640px){
.cm-app{
padding:8em 0 8em
}
.cm-app h3{
font-size:calc(27 / 16 * 1em)
}
.cm-app h3 strong{
font-size:calc(54 / 27 * 1em)
}
.cm-app .title{
width:calc(679 / 800 * 100%)
}
.cm-app .grad_01{
margin-top:8em
}
.cm-app .grad_01>.cm-inner{
top:-8em
}

}
.cm-app-c1{
display:flex;align-items:center;justify-content:center;gap:2em;position:relative
}
.cm-app-c1 .img{
width:calc(584 / 32 * 1em);opacity:0;transform:translate(0, 3em);transition:.5s ease .1s
}
.cm-app-c1 .text{
position:relative;top:-1em
}
.cm-app-c1 .text .icon{
margin:0 auto;width:calc(276 / 32 * 1em);opacity:0;transform:translate(0, 3em);transition:.5s ease .3s
}
.cm-app-c1 .text ul{
margin:3em auto 0
}
.cm-app-c1 .text ul li{
list-style:none;display:flex;align-items:center;gap:.5em;opacity:0;transform-origin:left center;transform:translate(0, 3em) scale(0.4)
}
.cm-app-c1 .text ul li:nth-child(1){
transition:.5s ease .6s
}
.cm-app-c1 .text ul li:nth-child(2){
transition:.5s ease .8s
}
.cm-app-c1 .text ul li:nth-child(3){
transition:.5s ease 1s
}
.cm-app-c1 .text ul li+li{
margin-top:calc(20 / 16 * 1em)
}
.cm-app-c1 .text ul li .point{
width:calc(118 / 32 * 1em);flex-shrink:0
}
.cm-app-c1 .text ul li p{
font-size:calc(23 / 16 * 1em);font-weight:700;color:#464646
}
.cm-app-c1.is-view .img{
opacity:1;transform:translate(0, 0)
}
.cm-app-c1.is-view .text .icon{
opacity:1;transform:translate(0, 0)
}
.cm-app-c1.is-view .text ul li{
opacity:1;transform:translate(0, 0) scale(1)
}
@media screen and (max-width: 640px){
.cm-app-c1{
gap:0
}
.cm-app-c1 .img{
width:calc(450 / 800 * 100%);margin-left:-2em
}
.cm-app-c1 .text{
margin-left:-2.5em;top:-2em
}
.cm-app-c1 .text .icon{
width:calc(192 / 16 * 1em)
}
.cm-app-c1 .text ul{
margin-top:5em
}
.cm-app-c1 .text ul li{
gap:1em
}
.cm-app-c1 .text ul li+li{
margin-top:2.5em
}
.cm-app-c1 .text ul li .point{
width:calc(96 / 16 * 1em)
}
.cm-app-c1 .text ul li p{
font-size:calc(32 / 16 * 1em)
}

}
.cm-app-btn{
padding:3em 0
}
.cm-app-btn a{
display:block;background-color:#fff;text-align:center;font-size:calc(16 / 16 * 1em);font-weight:700;color:#464646;text-decoration:none;position:relative;margin:0 auto;width:calc(280 / 16 * 1em);padding:1em .5em 1em 0;border-radius:3em;border:1px solid #464646
}
.cm-app-btn a:after{
content:"";display:block;position:absolute;right:calc(12 / 16 * 1em);top:calc(50% - calc(21 / 32 * 1em));width:calc(42 / 32 * 1em);height:calc(42 / 32 * 1em);background:url(../imgs/app/arrow_01.png) center center no-repeat;background-size:contain
}
@media screen and (max-width: 640px){
.cm-app-btn{
padding:5em 0 0
}
.cm-app-btn a{
font-size:calc(29 / 16 * 1em)
}

}
.cm-cast{
padding:6em 0;background-color:#fff
}
.cm-cast-c1{
margin:3em auto 0;display:flex;align-items:center;justify-content:center;gap:4em
}
.cm-cast-c1 .img{
width:calc(599 / 32 * 1em);box-shadow:1em 1em 0 #ff0000
}
.cm-cast-c1 .text{
width:calc(368 / 16 * 1em)
}
.cm-cast-c1 .text h3{
font-size:calc(30 / 16 * 1em);font-weight:700;letter-spacing:calc(6 / 30 * 1em)
}
.cm-cast-c1 .text span{
font-size:calc(14 / 16 * 1em);font-weight:400;letter-spacing:calc(2 / 14 * 1em);margin-top:.5em
}
.cm-cast-c1 .text p{
font-size:calc(15 / 16 * 1em);line-height:calc(28 / 15);text-align:justify;margin-top:2em
}
@media screen and (max-width: 640px){
.cm-cast-c1{
flex-wrap:wrap;margin:6em auto 0;gap:3em
}
.cm-cast-c1 .img{
width:calc(396 / 800 * 100%)
}
.cm-cast-c1 .text{
width:calc(680 / 800 * 100%)
}
.cm-cast-c1 .text h3{
text-align:center;font-size:calc(50 / 16 * 1em)
}
.cm-cast-c1 .text span{
display:block;text-align:center;font-size:calc(20 / 16 * 1em)
}
.cm-cast-c1 .text p{
font-size:calc(24 / 16 * 1em);margin-top:3em
}

}
.modal-temp{
display:none
}
.mymodal{
position:fixed;left:0;top:0;width:100%;height:100vh;height:100dvh;display:grid;justify-content:center;align-items:center;padding:4em 2em;opacity:0;z-index:-1;transition:.3s;overflow:auto;background-color:rgba(0,0,0,0.8)
}
.mymodal>.modal-close{
display:block;position:fixed;left:0;top:0;width:100%;height:100%
}
.mymodal .mymodal-inner{
position:relative;width:calc(800 / 16 * 1em);margin:0 auto
}
.mymodal .mymodal-inner>.modal-close{
position:absolute;right:0;bottom:100%;width:calc(48 / 16 * 1em);height:calc(48 / 16 * 1em)
}
.mymodal .mymodal-inner>.modal-close:before,.mymodal .mymodal-inner>.modal-close:after{
content:"";display:block;position:absolute;left:25%;top:calc(50% - 1px);width:50%;border-top:2px solid #fff;transform:rotate(45deg)
}
.mymodal .mymodal-inner>.modal-close:after{
transform:rotate(-45deg)
}
.mymodal.on{
z-index:10000000;opacity:1
}
@media screen and (max-width: 640px){
.mymodal{
padding:3em 0 3em;grid-template-columns:1fr
}
.mymodal .mymodal-inner{
width:94%
}
.mymodal .mymodal-inner>.modal-close{
width:calc(60 / 16 * 1em);height:calc(60 / 16 * 1em)
}

}
.modal-movie>div{
position:relative;padding-top:56.25%
}
.modal-movie video{
display:block;position:absolute;left:0;top:0;width:100%;height:100%
}

/*# sourceMappingURL=style.css.map */
