﻿.container .button{position:relative;display:block;margin:0 auto;width:86.8%;overflow:hidden}.container .button::after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;animation:shine 1.5s infinite ease-in-out;background:linear-gradient(135deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0) 50%);background-size:200% 100%;mask-image:url("../img/cta-button.png");mask-size:contain}@keyframes shine{0%{background-position:150%}100%{background-position:-50%}}.container .cta{position:relative;padding:32px 0;box-sizing:border-box}.container .cta .product{position:absolute;top:50%;left:2%;width:18.5%;transform:translateY(-50%)}.container .guarantee{position:relative}.container .guarantee .medal{position:absolute;top:34.05%;left:5.65%;width:42.7%;animation:rotateY 3s infinite linear}@keyframes rotateY{0%{transform:rotateY(0deg)}100%{transform:rotateY(360deg)}}.container .guarantee .medal+.medal{left:51.65%}.container .uservoice{position:relative}.container .uservoice .balloon{position:absolute;top:42%;width:68.8%;opacity:0;transform:scale(0)}.container .uservoice .balloon:nth-child(2){left:5%}.container .uservoice .balloon:nth-child(3){top:53.5%;right:5%}.container .uservoice .balloon:nth-child(4){top:67%;left:5%}.container .uservoice .balloon:nth-child(5){top:79%;right:5%}.container .uservoice .balloon.is-appeared{animation:fadeInScaleUp 1.5s ease-in-out 0s forwards}@keyframes fadeInScaleUp{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}.container .drive-recorder{position:relative}.container .drive-recorder .photo{position:relative}.container .drive-recorder .photo::before,.container .drive-recorder .photo .focus{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#4eb1c0;mix-blend-mode:multiply}.container .drive-recorder .photo .focus{overflow:hidden;background-image:url("../img/drive-recorder.jpg");background-size:100%;mix-blend-mode:inherit;transition:clip-path 1s ease-in-out;clip-path:polygon(66.35% 53%, 66.35% 53%, 66.35% 53%, 66.35% 53%)}.container .drive-recorder .photo .focus.is-appeared{clip-path:polygon(41% 25%, 91.7% 25%, 91.7% 81%, 41% 81%)}.container .drive-recorder .photo .orange,.container .drive-recorder .photo .white{opacity:0}.container .drive-recorder .photo .orange.is-appeared,.container .drive-recorder .photo .white.is-appeared{animation:fadeIn .1s ease-in-out 1.5s forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.container .drive-recorder .photo .orange{position:absolute;top:24.6%;left:40.5%;width:51.8%;height:56.7%}.container .drive-recorder .photo .orange::before,.container .drive-recorder .photo .orange::after{content:"";display:block;opacity:1;position:absolute;width:17.9%;height:12.9%;border:8px solid #ed7500}.container .drive-recorder .photo .orange::before{top:0;right:0;border-left:none;border-bottom:none}.container .drive-recorder .photo .orange::after{bottom:0;left:0;border-top:none;border-right:none}.container .drive-recorder .photo .white{position:absolute;top:24.9%;left:41%;width:50.6%;height:56.1%;transform:scale(0.9)}.container .drive-recorder .photo .white::before,.container .drive-recorder .photo .white::after{content:"";display:block;opacity:1;position:absolute;width:17.9%;height:12.9%;border:4px solid #fff}.container .drive-recorder .photo .white::before{top:0;left:0;border-right:none;border-bottom:none}.container .drive-recorder .photo .white::after{bottom:0;right:0;border-top:none;border-left:none}.container .drive-recorder .copy1{position:absolute;top:11%;left:50%;transform:translateX(-50%);width:74.1%}.container .drive-recorder .copy2{position:absolute;top:28%;left:9%;width:47.7%;opacity:0}.container .drive-recorder .copy2.is-appeared{animation:fadeIn 3s ease-in-out 1.5s forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.container .point{position:relative;margin-top:-19%}.container .point .medal{width:92%;position:absolute;opacity:0;transform:scale(0)}.container .point .medal.is-appeared{animation:fadeInScaleUp 1s ease-in-out 0s forwards}@keyframes fadeInScaleUp{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}.container .point .medal:nth-child(2){top:20%;left:-13%}.container .point .medal:nth-child(3){top:45%;right:-13%}.container .point .medal:nth-child(4){top:70%;left:-13%}.container .offer{position:relative;background-color:#2e2e2e}.container .offer .button{position:absolute;top:47%;left:50%;transform:translateX(-50%);width:86.8%}.container .offer .button::after{mask-image:url("../img/offer-button.png");mask-size:contain}.container .offer .benefits{position:relative;width:100%;height:0;padding-top:94.3%}.container .offer .benefits .detail{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:89.9%;opacity:0}.container .offer .benefits .detail.is-appeared{animation:fadeIn 1.5s ease-in-out 0s forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.container .if{position:relative}.container .if .if01{position:relative}.container .if .if01 .if-30{position:absolute;top:48%;left:10.55%;width:78.9%;overflow:hidden}.container .if .if01 .if-30>img{transform:translateY(100%)}.container .if .if01 .if-30.is-appeared>img{animation:up 1.5s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .if .if02{position:relative}.container .if .if02 .car{position:absolute;top:55%;right:5%;width:43.7%;animation:buruburu .1s infinite linear}@keyframes buruburu{0%{transform:translate(0px, 0px) rotateZ(0deg)}25%{transform:translate(2px, 2px) rotateZ(1deg)}50%{transform:translate(0px, 2px) rotateZ(0deg)}75%{transform:translate(2px, 0px) rotateZ(-1deg)}100%{transform:translate(0px, 0px) rotateZ(0deg)}}.container .if .if03{position:relative}.container .if .if03 .balloon{position:absolute;top:-2.5%;left:6.25%;transform:translateX(-50%);width:87.5%;transform:scale(0);transform-origin:bottom center}.container .if .if03 .balloon.is-appeared{animation:fadeInScaleUp 1.5s ease-in-out 0s forwards}@keyframes fadeInScaleUp{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}.container .if .if03 .mask{position:absolute;width:67.3%;transition:mask-size 1.5s;mask-image:linear-gradient(rgb(0, 0, 0), rgb(0, 0, 0));mask-size:0% 100%;mask-repeat:no-repeat}.container .if .if03 .mask.is-appeared{mask-size:100% 100%}.container .if .if03 .mask:nth-child(3){top:30.5%;right:6.55%}.container .if .if03 .mask:nth-child(4){top:49.5%;left:6.55%}.container .if .if03 .mask:nth-child(5){top:68.5%;right:6.55%}.container .if .if03 .mask:nth-child(6){top:85%;left:6.55%}.container .if .if04{position:relative}.container .if .if04 .copy{position:absolute;top:41%;left:15.35%;width:69.3%;opacity:0}.container .if .if04 .copy.is-appeared{animation:fadeInScaleUp 1.5s ease-in-out 0s forwards}@keyframes fadeInScaleUp{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}.container .if .if05{position:relative}.container .if .if05 .camera{opacity:0;position:absolute;top:30%;left:8.15%;width:83.7%}.container .if .if05 .camera.is-appeared{animation:fadeDown 1.5s ease-in-out 0s forwards}@keyframes fadeDown{0%{opacity:0;transform:translateY(-20%)}100%{opacity:1;transform:translateY(0)}}.container .if .if05 .shadow{opacity:0;position:absolute;top:47%;left:10%;width:81.2%;mix-blend-mode:multiply}.container .if .if05 .shadow.is-appeared{animation:fadeInShadow 1.5s ease-in-out .8s forwards}@keyframes fadeInShadow{0%{opacity:0}100%{opacity:.48}}.container .if .if05 .donotmiss{position:absolute;top:88%;left:19.2%;width:61.6%;overflow:hidden}.container .if .if05 .donotmiss>img{transform:translateY(100%)}.container .if .if05 .donotmiss.is-appeared>img{animation:up 1.5s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features{position:relative}.container .features .features01{position:relative}.container .features .features01 .heading-wrapper{position:relative}.container .features .features01 .heading-wrapper .heading{width:46.7%;position:absolute;top:20%;left:26.65%;overflow:hidden}.container .features .features01 .heading-wrapper .heading>img{transform:translateY(100%)}.container .features .features01 .heading-wrapper .heading.is-appeared>img{animation:up 1s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features .features01 .label{width:92.9%;position:absolute;top:39%;left:50%;transform:translateX(-50%);z-index:10}.container .features .features01 .features01-2{position:relative}.container .features .features01 .features01-2 .background::after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;background-color:#2e2e2e;opacity:.6}.container .features .features01 .features01-2 .text{position:absolute;top:0;left:0;opacity:1}.container .features .features02{position:relative}.container .features .features02 .heading-wrapper{position:relative}.container .features .features02 .heading-wrapper .heading{width:84.7%;position:absolute;top:50.5%;left:8.15%;overflow:hidden}.container .features .features02 .heading-wrapper .heading>img{transform:translateY(100%)}.container .features .features02 .heading-wrapper .heading.is-appeared>img{animation:up 1s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features .features02 .road{position:relative}.container .features .features02 .road .white-line{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden}.container .features .features02 .road .white-line .white{display:flex;flex-direction:column;position:absolute;top:-100%;right:21%;width:4.4%;height:100%;animation:slider .7s infinite linear}@keyframes slider{0%{transform:translateY(0%)}100%{transform:translateY(100%)}}.container .features .features02 .road .white-line .white .line{margin-bottom:91%}.container .features .features02 .road .angle{width:73.6%;position:absolute;top:-3.5%;left:13.2%;z-index:10}.container .features .features02 .accident{position:relative;background-color:#eaf6f7}.container .features .features02 .accident .car{position:absolute;top:10%;left:-2.2%;width:104.4%;transform:scale(1.5)}.container .features .features02 .accident .car.is-appeared{animation:scaleIn .5s ease-in-out 0s forwards}@keyframes scaleIn{0%{transform:scale(1.5)}100%{transform:scale(1)}}.container .features .features02 .accident .front{position:absolute;top:45%;left:6.65%;width:86.7%}.container .features .features02 .accident .rear{position:absolute;top:65%;left:6.65%;width:86.7%}.container .features .features03{position:relative;background-color:#eaf6f7}.container .features .features03 .heading-wrapper{position:relative}.container .features .features03 .heading-wrapper .heading{width:81.5%;position:absolute;top:39.5%;left:9.25%;overflow:hidden}.container .features .features03 .heading-wrapper .heading>img{transform:translateY(100%)}.container .features .features03 .heading-wrapper .heading.is-appeared>img{animation:up 1s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features .features03 .features03-2{position:relative;margin-top:-7%}.container .features .features03 .features03-2 .tunnel{position:absolute;top:68%;left:6.65%;width:86.7%}.container .features .features03 .features03-4{position:relative;margin-top:-12%}.container .features .features03 .features03-4 .caution{width:22.7%;position:absolute;top:50%;left:38.65%;transform:scale(0)}.container .features .features03 .features03-4 .caution.is-appeared{animation:fadeInScaleUp 1s ease-in-out 0s forwards}@keyframes fadeInScaleUp{0%{opacity:0;transform:scale(0)}100%{opacity:1;transform:scale(1)}}.container .features .features03 .features03-4 .text{width:76%;position:absolute;top:63%;left:12%}.container .features .features03 .features03-5{position:relative}.container .features .features03 .features03-5 .text{width:53.27%;position:absolute;top:75%;left:23.365%;overflow:hidden}.container .features .features03 .features03-5 .text>img{transform:translateY(100%)}.container .features .features03 .features03-5 .text.is-appeared>img{animation:up 1s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features .features03 .features03-6{position:relative;margin-top:-8%}.container .features .features03 .features03-6 .text{width:83.6%;position:absolute;top:87%;left:8.2%;overflow:hidden}.container .features .features03 .features03-6 .text>img{transform:translateY(100%)}.container .features .features03 .features03-6 .text.is-appeared>img{animation:up 1s ease-in-out 0s forwards}@keyframes up{0%{transform:translateY(100%)}100%{transform:translateY(0)}}.container .features .features03 .features03-7{position:relative;background-color:#f9fcc2;padding-bottom:10%;box-sizing:border-box}.container .features .features03 .features03-7 .video{position:absolute;top:35%;left:12.65%;width:74.7%;height:auto;aspect-ratio:16/9}.container .other{position:relative;background-image:url("../img/other-background.png")}.container .other .heading{width:36.4%;position:absolute;top:-4%;left:31.8%}.container .other .text{text-align:center;padding:10% 0 5%;box-sizing:border-box}.container .other .text>img{width:79.5%}.container .other .navigation-wrapper{position:relative;width:90.9%;margin:0 auto}.container .other .navigation-wrapper .keen-slider__slide{display:flex;align-items:center;justify-content:center}.container .other .navigation-wrapper #other-next,.container .other .navigation-wrapper #other-prev{width:9.5%;position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);cursor:pointer}.container .other .navigation-wrapper #other-prev{left:-3%}.container .other .navigation-wrapper #other-next{right:-3%}.container .low-price{position:relative}.container .why{position:relative;margin-top:-6%}.container .why .circle{position:absolute;top:13%;left:2%;width:45.9%;animation:rotateY 3s infinite linear}@keyframes rotateY{0%{transform:rotateY(0deg)}100%{transform:rotateY(360deg)}}.container .why .circle+.circle{left:inherit;right:2%}.container .family{position:relative}.container .family .sky{position:absolute;top:0;left:0;width:100%;mix-blend-mode:multiply}.container .family .text{position:absolute;top:12%;left:9.35%;width:81.3%;opacity:0}.container .family .text.is-appeared{animation:fadeIn 1s ease-in-out 0s forwards}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.container .package{position:relative}.container .package .gasoline{position:absolute;top:62%;left:5%;width:60%;transform:translateX(300%)}.container .package.is-appeared .gasoline{animation:slideInLeft 2s ease-in-out 0s forwards}@keyframes slideInLeft{0%{transform:translateX(300%)}100%{transform:translateX(0)}}.container .qa{position:relative;padding:10% 6.65%;box-sizing:border-box;background-color:#eaf6f7;align-items:center}.container .qa .heading{width:53.7%;margin:5% auto;display:block}.container .qa .list{margin:10% auto;padding:0;list-style:none;font-size:2.8rem}.container .qa .list li{margin:1.6rem auto;padding:0}.container .qa .list li .question{display:flex;background-color:#2f8cb2;color:#fff;padding:1.6rem;box-sizing:border-box}.container .qa .list li .question>span{margin:0 .8rem;flex:1}.container .qa .list li .question::before{content:"Q."}.container .qa .list li .question::after{content:"−"}.container .qa .list li .question.is-open::after{content:"＋"}.container .qa .list li .question.is-open+.answer{display:flex}.container .qa .list li .answer{background-color:#fff;padding:1.6rem;box-sizing:border-box;display:none}.container .qa .list li .answer>span{margin:0 .8rem;flex:1}.container .qa .list li .answer::before{content:"A."}/*# sourceMappingURL=style.css.map */
