@charset "UTF-8"; * { letter-spacing: 1px; } .navbar { box-shadow: 0 2px 10px 2px rgb(204, 204, 204); background-color: white !important; width: 100%; } .navbar .navbar-collapse { flex-grow: 0; } .navbar-nav .nav-item { margin: 0 3px; } .navbar-nav .dropdown-menu { padding: 0; top: 138%; } .navbar-nav .dropdown-menu .dropdown-item { font-size: 14px; padding: 8px 20px; border-bottom: 1px solid #eeeeee; color: #999999; } .navbar-nav .dropdown-menu .dropdown-item:active { background-color: #fff; } .navbar-nav .dropdown-menu .dropdown-item:hover { color: #ea5413; background-color: #fff; padding: 8px 17px 8px 23px; } .navbar-nav .solution-link { padding: 8px 18px; text-decoration: none; color: #fff; font-weight: 400; border: 1px solid #ea5413; background-color: #ea5413; border-radius: 3rem; transition: all 0.3s; } .navbar-nav .solution-link:hover { opacity: 0.8; } @media (max-width: 1400px) { .navbar-nav .solution-link { padding: 8px 10px; font-size: 12px; } } @media (max-width: 1199px) { .navbar-nav .solution-link { padding: 8px 16px; font-size: 16px; } } .navbar-nav .signin-link { padding: 8px 18px; text-decoration: none; color: #ea5413; font-weight: 400; border: 1px solid #ea5413; border-radius: 3rem; } @media (max-width: 1400px) { .navbar-nav .signin-link { padding: 8px 10px; font-size: 12px; } } @media (max-width: 1199px) { .navbar-nav .signin-link { padding: 8px 16px; font-size: 16px; } } .navbar-nav .signup-link { padding: 8px 18px; margin: 13px; text-decoration: none; color: #fff; font-weight: 400; border: 1px solid #ea5413; border-radius: 3rem; background-color: #ea5413; } .navbar-nav a { transition: all 0.3s; } .navbar-nav a:hover { opacity: 0.8; } @media (max-width: 1400px) { .navbar { font-size: 14px; } } @media (max-width: 1199px) { .navbar { font-size: 16px; } } .header { margin-top: 70px; position: relative; padding: 6rem 0 3rem; } .header-lefttop { position: absolute; left: 0; top: 0; z-index: -1; width: 350px; } .header-title { font-size: 2.5rem; line-height: 55px; font-weight: 600; color: #000; } @media (max-width: 768px) { .header-title { font-size: 2.2rem; } } .header__sub { color: #38a7bb; font-size: 1.5rem; font-weight: 300; position: relative; } .header__sub::before, .header__sub::after { content: " "; position: absolute; width: 12%; height: 1px; background-color: #38a7bb; top: 50%; } .header__sub::before { left: 28%; } .header__sub::after { left: 60%; } .header__form { margin: 1rem auto; justify-content: center; } .header__form__input { border-radius: 10rem; padding: 0.4rem 0.8rem; width: 60%; margin-left: 4.5rem; } .header__form__sub { border-radius: 10rem; background-color: #fca25e; color: white; border: none; width: 5rem; transform: translateX(-100%); transition: all 0.3s; } .header__form__sub:hover { background-color: #ff892e; } .header-right { width: 80%; height: 50vh; background-image: url("../imgs/電腦2.webp"); background-size: contain; background-repeat: no-repeat; margin: 0 auto; position: relative; } .header-right.header-dm { background-image: url("https://i.imgur.com/SOu53ii.jpg"); } .header-right-cir { width: 60%; position: absolute; right: 0%; top: -5%; z-index: -1; } .header-right-video { position: absolute; width: 70%; height: auto; left: 3.3rem; top: 1.8rem; } .header-right-magnifier { position: absolute; width: 25%; right: 3%; bottom: 1%; } .header-right-bubble { position: absolute; width: 22%; top: 0; left: 0; transform: translate(-60%, -50%); } .header-right-linecir { width: 45%; position: absolute; left: -8%; bottom: -3%; z-index: -1; } .stock-01 { position: absolute; z-index: -1; width: 800px; top: -180px; left: -300px; } .pageForm-btn { position: fixed; bottom: 158px; right: 15px; z-index: 1000; cursor: pointer; } .pageForm-btn button { width: 63px; height: 63px; border: none; border-radius: 100%; background-image: linear-gradient(-225deg, rgb(241, 95, 121) 35%, rgb(178, 69, 146) 100%); } .pageForm-btn button:hover { opacity: 0.9; } .pageForm-btn button img { cursor: pointer; filter: invert(99%) sepia(0%) saturate(2%) hue-rotate(31deg) brightness(107%) contrast(100%); } .pageForm-title-h3 { font-weight: bold; } /* footer.html Start */ .footer { color: #656565; } .footer .footer-contacts { margin-top: 2rem; line-height: 32px; } .footer a { color: #656565; text-decoration: none; } .footer h5 { color: black; font-weight: 600; padding-bottom: 15px; } .footer .link { padding-bottom: 20px; } .footer { background-color: #f0f0f0; padding: 3rem; } .footer .right-column { border-left: 1px solid black; } .footer .footer-aigirl { font-weight: 600; font-size: 2rem; margin-top: 1rem; margin-bottom: 1rem; } .footer .footer-follow { font-size: 1.6rem; margin-bottom: 1rem; color: black; font-size: 1rem; font-weight: 600; margin-top: 2rem; } .footer .footer-socials a { margin-right: 0px; } /* footer.html End */ /* footer_default.html Start */ .footer h4 { text-transform: uppercase; color: white; font-size: 14px; font-weight: 800; } .footer__btn__text { font-size: 1.3rem; color: white; } .footer .btn { border: 2px solid #38a7bb; color: #38a7bb; text-decoration: none; } .followus__btn { text-decoration: none; color: white; } .followus__btn:hover { color: #38a7bb; } .footer .btn:hover { color: white; background-color: #38a7bb; } .followus__txt { display: inline-block; margin-right: 1rem; color: white; font-weight: 600; } .footer-img { height: 60px; } /* footer_default.html End */ /* iframe Start */ .video-box { position: relative; width: 70%; height: 0; padding-bottom: 40%; } @media (max-width: 1199px) { .video-box { width: 80%; padding-bottom: 45%; } } @media (max-width: 767px) { .video-box { margin: 50px auto 0; } } @media (max-width: 576px) { .video-box { width: 90%; padding-bottom: 50%; } } .video-box iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* iframe End */ .category { padding: 2rem 0rem; } .category.dm-description { padding: 2rem 8rem; } .category-sub-h2 { position: relative; } .category-sub-h2::after { position: absolute; content: ""; width: 4rem; height: 1rem; border-bottom: 10px solid #ff892e; left: 50%; top: -1.5rem; transform: translateX(-50%); } .category-btngrp { padding: 0 8rem; } .category-btn { background-color: #a7d9e2; border: none; border-radius: 5rem; outline: none; color: white; font-size: 1.3rem; padding: 0.4rem 2rem; text-decoration: none; } .category-btn.active { background-color: #38a7bb; text-decoration: none; color: white; } .card__rank { border: 1px solid #cecece; box-shadow: 1px 1px 5px 1px rgb(211, 211, 211); position: relative; padding: 1rem 1.5rem; } .top20 .card__rank { margin-bottom: 1.5rem; } .top3 { padding: 3rem 0rem; padding-bottom: 5rem; position: relative; } .top3 .row { padding: 0rem 4rem; } .top3 .backfill { position: absolute; width: 100%; height: 100px; background-color: #ffebe8; left: 0; right: 0; top: 7rem; } .top3__num { color: #fca25e; font-size: 5.8rem; font-family: "Trebuchet MS"; position: absolute; left: 1rem; top: -3.5rem; font-weight: 300; } .card__rank__word { color: #20616d; margin-left: 3rem; font-size: 1.8rem; font-weight: 400; } .card__rank__goto { text-align: right; } .card__rank__link { color: #38a7bb; text-decoration: none; font-weight: 400; } .card__rank__link:hover { color: #19879b; } .top20 { padding-bottom: 5rem; } .top20 .row { padding: 0rem 4rem; } .top20 .card__rank__word { margin-left: 0; } .top20__num { color: #fca25e; font-size: 2.5rem; font-family: "Trebuchet MS"; font-weight: 300; display: inline-block; width: 3rem; } /* 首頁 */ #home img { max-width: 100%; height: auto; } #home .swiper { width: 100%; height: 100%; } #home .swiper-pagination-bullet { width: 13px; height: 13px; margin: 0 13px; } @media (max-width: 991px) { #home .swiper-pagination-bullet { width: 10px; height: 10px; margin: 0 10px; } } #home .swiper-pagination-bullet-active { background-color: #000 !important; } #home .swiper-button-next { right: -50px; } #home .swiper-button-prev { left: -50px; } #home .swiper-button-next, #home .swiper-button-prev { color: #6c6d70; } #home #main { overflow: hidden; } #home #main .content { height: 80vh; padding-left: 15vw; background-image: url("/imgs/home/首頁-01.png"); background-position: center; background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center; } @media (max-width: 991px) { #home #main .content { background-position: -600px -100px; } } @media (max-width: 767px) { #home #main .content { padding-left: 0; align-items: center; } } #home #main .content h4 { color: #6c6d70; line-height: 40px; font-weight: bold; } @media (max-width: 767px) { #home #main .content h4 { text-align: center; } } #home #main .content section h3 { color: #ea5413; margin-left: 10px; font-weight: bold; font-size: 26px; line-height: 40px; } @media (max-width: 767px) { #home #main .content section h3 { font-size: 22px; } } #home #main .content .logo { width: 200px; } #home #main .content div { height: 115px; } #home #main .content .action-btn { margin-top: 60px; padding: 13px 30px; border: none; color: #fff; background-color: #ea5413; text-decoration: none; border-radius: 100px; transition: all 0.3s; } #home #main .content .action-btn:hover { background-color: #d54d13; } #home #main .journey-content { display: flex; align-items: center; background-image: url("/imgs/home/首頁-02.png"); background-size: cover; background-position: top; background-repeat: no-repeat; } #home #main .journey-content h3 { line-height: 40px; text-align: center; font-weight: bold; padding: 260px 0 80px; } @media (max-width: 767px) { #home #main .journey-content h3 { padding: 80px 0; } } #home #main .journey-content h4 { color: #ea5413; text-align: center; font-weight: bold; } #home #main .journey-content .line { display: block; height: 2px; background: #ea5413; width: 100%; margin: 30px 0; } #home #main .journey-content .title { position: relative; } #home #main .journey-content .title img { top: -70px; right: -75px; width: 180px; position: absolute; } @media (max-width: 767px) { #home #main .journey-content .title img { top: -45px; right: -16vw; width: 150px; transform: rotate(90deg); } } @media (max-width: 575px) { #home #main .journey-content .title img { top: -36px; right: -21vw; width: 130px; } } #home #main .journey-content .list { padding: 0 25px; font-size: 18px; } @media (max-width: 1199px) { #home #main .journey-content .list { padding: 0; } } @media (max-width: 991px) { #home #main .journey-content .list { font-size: 16px; } } #home #main .journey-content .list h5 { font-size: 18px; } @media (max-width: 991px) { #home #main .journey-content .list h5 { font-size: 16px; } } #home #main .journey-content .list p { height: 75px; } @media (max-width: 1199px) { #home #main .journey-content .list p { height: 85px; } } @media (max-width: 767px) { #home #main .journey-content .list p { height: auto; } } #home #main .journey-content .list strong { display: block; padding: 15px; margin: 20px auto 50px; text-align: center; color: #fff; background-color: #ea5413; } @media (max-width: 991px) { #home #main .journey-content .list strong { font-size: 13px; } } @media (max-width: 767px) { #home #main .journey-content .list strong { font-size: 16px; margin: 20px auto 10px; } } #home #main .team-content { padding: 100px 0; } #home #main .team-content strong { font-size: 26px; } #home #main .team-content h4 { margin: 20px 0; color: #ea5413; font-weight: bold; line-height: 36px; } @media (max-width: 575px) { #home #main .team-content h4 { font-size: 18px; } } #home #main .team-content ul { list-style: none; padding: 0; margin: 0; } #home #main .team-content ul li { margin: 5px 0; font-size: 18px; } @media (max-width: 575px) { #home #main .team-content ul li { font-size: 16px; } } #home .ad-content { width: 90%; padding: 50px 0 0; border: 1px solid #90268f; } #home .ad-content ul { padding: 0; list-style: none; } #home .ad-content ul li { margin-bottom: 50px; } #home .ad-content ul li p { color: #90268f; font-size: 18px; font-weight: bold; } @media (max-width: 767px) { #home .ad-content ul li p { font-size: 16px; } } #home .ad-content section h4 { text-align: center; font-size: 30px; font-weight: bold; } #home .ad-content section h4 strong { display: block; margin: 20px 0 50px; font-size: 24px; color: #ea5413; } @media (max-width: 767px) { #home .ad-content section h4 strong { font-size: 18px; } } @media (max-width: 575px) { #home .ad-content section h4 strong { padding: 0 20px; line-height: 32px; } } #home .ad-content h5 { font-weight: bold; font-size: 20px; line-height: 32px; } @media (max-width: 991px) { #home .ad-content h5 { font-size: 18px; } } #home .ad-content h5 strong { margin: 30px 0; display: block; color: #90268f; } #home .ad-content .img-text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 1.6vw; font-weight: bold; } @media (max-width: 991px) { #home .ad-content .img-text { font-size: 2vw; } } @media (max-width: 575px) { #home .ad-content .img-text { font-size: 5.5vw; } } #home .tag-item { position: absolute; right: 0; } #home .tag-item img { width: 200px; } #home .tag-item h5 { position: absolute; top: 35px; right: 75px; color: #fff; font-size: 26px; } #home .seo-content { overflow: hidden; } #home .seo-content ul { list-style: none; } #home .seo-content ul li { margin: 10px 0; font-size: 18px; } @media (max-width: 575px) { #home .seo-content ul li { font-size: 16px; } } #home .seo-content section p { color: #6c6d70; font-weight: bold; font-size: 18px; line-height: 32px; } @media (max-width: 575px) { #home .seo-content section p { font-size: 16px; } } #home .seo-content .video-box { width: 55%; padding-bottom: 30%; margin: 50px auto; } @media (max-width: 991px) { #home .seo-content .video-box { width: 100%; padding-bottom: 56%; } } #home .seo-content h4, #home .ai-content h4 { padding-top: 130px; text-align: center; font-size: 30px; font-weight: bold; } #home .ai-content { margin-top: 100px; } #home .ai-content p { line-height: 32px; font-size: 18px; } @media (max-width: 575px) { #home .ai-content p { font-size: 16px; } } #home .ai-content .title { color: #ea5413; font-weight: bold; } @media (max-width: 575px) { #home .ai-content .title { font-size: 22px; } } #home .ai-content .video-title { font-size: 30px; font-weight: bold; } @media (max-width: 991px) { #home .ai-content .img-item { display: flex; justify-content: center; } } @media (max-width: 991px) { #home .ai-content .img-item img { width: 800px; max-width: initial; } } @media (max-width: 575px) { #home .ai-content .img-item img { margin-left: 50px; } } #home .ai-content .img-item p { position: absolute; top: 32%; left: 50%; font-size: 20px; font-weight: bold; line-height: 38px; color: #6c6d70; } @media (max-width: 1400px) { #home .ai-content .img-item p { top: 31%; line-height: 34px; } } @media (max-width: 1199px) { #home .ai-content .img-item p { top: 28%; line-height: 32px; font-size: 18px; } } @media (max-width: 991px) { #home .ai-content .img-item p { top: 25%; line-height: 30px; font-size: 16px; } } @media (max-width: 991px) { #home .ai-content .img-item p { left: 42%; } } @media (max-width: 575px) { #home .ai-content .img-item p { left: 32vw; top: 25%; line-height: 26px; font-size: 15px; } } #home .ai-content .sec-video { margin-top: 0; } @media (max-width: 767px) { #home .ai-content .sec-video { margin-bottom: 0; } } #home .ai-content .sec-video .video-mb-title { font-size: 26px; font-weight: bold; } @media (max-width: 767px) { #home .ai-content .sec-video .video-box { width: 100%; padding-bottom: 45%; } } #home .ai-content .sec-usecase .usecase-title { font-size: 30px; font-weight: bold; } #home .ai-content .sec-usecase .usecase-imgfr { height: auto; } #home .ai-content .sec-usecase .usecase-sub { font-size: 18px; margin-top: 20px; } #home .bg-img { margin-top: -85vw; position: relative; z-index: -1; transform: scale(1.1); -o-object-position: 3vw 0px; object-position: 3vw 0px; } #home .more-btn { padding: 13px 30px; color: #fff; background-color: #ea5413; text-decoration: none; border-radius: 100px; transition: all 0.3s; } #home .more-btn:hover { background-color: #d54d13; } #home .sec-action .action-btn { padding: 0.8rem 3.5rem; font-size: 20px; font-weight: bold; } #home .progress-item { opacity: 0; height: 100%; position: fixed; z-index: 100; top: 0; transition: all 0.3s; } @media (max-width: 767px) { #home .progress-item { display: none; } } #home .progress-item .cont { top: 50%; left: -135px; position: absolute; transform: rotate(90deg); } @media (max-width: 1199px) { #home .progress-item .cont { left: -145px; } } @media (max-width: 991px) { #home .progress-item .cont { left: -150px; } } #home .progress-item .cont #progress-bar { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 360px; color: #000; height: 2px; margin: -2px auto; } @media (max-width: 991px) { #home .progress-item .cont #progress-bar { margin: -1px auto; } } #home .progress-item .cont span { height: 15px; width: 15px; border-radius: 100%; border: 3px solid #a5a7a9; background: #a5a7a9; position: absolute; left: 0; top: 12px; cursor: pointer; transition: all 0.3s ease-in-out; } @media (max-width: 991px) { #home .progress-item .cont span { height: 12px; width: 12px; } } #home .progress-item .cont .journey { left: 70px; } #home .progress-item .cont .team { left: 140px; } #home .progress-item .cont .ai-ad { left: 210px; } #home .progress-item .cont .seo { left: 280px; } #home .progress-item .cont .ai-video { left: 350px; } #home .progress-item .cont .blog { left: 420px; } #home .progress-item .cont #progress-bar::-webkit-progress-value { /* Changes line color */ background: #ea5413; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #home .progress-item .cont #progress-bar::-webkit-progress-bar { /* Changes background color */ background: #a5a7a9; } #home .progress-item .cont .border-change { background: #ea5413; border-color: #ea5413; transition: all 0.3s ease-in-out; } .language-btn { border: none; text-decoration: none; background-color: #fff; color: rgba(0, 0, 0, 0.55); } #home .home-en { display: none; } #home .home-en .ai-content .img-item p { max-width: 500px; top: 35%; left: 48%; } @media (max-width: 1400px) { #home .home-en .ai-content .img-item p { top: 35%; left: 45%; } } @media (max-width: 1199px) { #home .home-en .ai-content .img-item p { max-width: 350px; top: 28%; left: 50%; } } @media (max-width: 767px) { #home .home-en .ai-content .img-item p { max-width: 500px; top: 30%; left: 35%; } } @media (max-width: 475px) { #home .home-en .ai-content .img-item p { top: 25%; } } #home .home-en .journey-content .list span { display: block; height: 155px; } @media (max-width: 991px) { #home .home-en .journey-content .list span { height: 180px; } } #home .home-en .journey-content .list p { height: auto !important; } /* content page */ .cntheader { margin-top: 81px; padding: 4rem 0; position: relative; padding-bottom: 2rem; } .cntheader__sub { color: #38a7bb; font-size: 1.5rem; font-weight: 300; position: relative; } .cntheader__sub::before, .cntheader__sub::after { content: " "; position: absolute; width: 15%; height: 1px; background-color: #38a7bb; top: 50%; } .cntheader__sub::before { left: 18%; } .cntheader__sub::after { left: 67%; } .cntheader .category-btngrp { padding: 0 4rem; } .card__art { padding: 1rem; border: 1px solid #20616d; border-radius: 1rem; margin-bottom: 1rem; } .card__title { font-size: 1.8rem; font-weight: 400; } .card__text { color: #918f8f; } .card__link { display: inline-block; color: #38a7bb; margin-right: 1rem; text-decoration: none; } .card__link:hover { color: #20616d; } .toparticle { border: 1px solid #cecece; box-shadow: 1px 2px 3px 1px rgb(224, 224, 224); } .toparticle__title { color: white; background-color: #38a7bb; text-align: center; font-size: 1.3rem; padding: 0.3rem 0; position: relative; } .toparticle__title img { position: absolute; width: 150px; right: -4rem; top: -3.5rem; } .toparticle__list { padding: 1.5rem; padding-top: 0; list-style: none; padding-bottom: 1rem; } .toparticle__list-item { padding: 0.3rem; border-bottom: 1px solid #cecece; color: #38a7bb; position: relative; } .toparticle__list-item:nth-of-type(10) { border: none; } .toparticle__list-item a { text-decoration: none; color: #38a7bb; } .toparticle__num { color: #fca25e; font-size: 1.8rem; font-family: "Trebuchet MS"; font-weight: 300; margin-right: 8px; } .toparticle__top { font-size: 2rem; } .toparticle__list-item small { position: absolute; right: 0; top: 45%; } .cntsubscribe { text-align: center; } .cntsubscribe__form { position: relative; } .cntsubscribe__sub { border-radius: 10rem; background-color: #fca25e; color: white; border: none; width: 5rem; position: absolute; right: 0; top: 0; padding: 0.45rem 0.8rem; } .cntsubscribe__sub:hover { background-color: #ff892e; color: white; } .cntsubscribe__input { border-radius: 10rem; padding: 0.4rem 0.8rem; width: 100%; } .img-block .img-block-img { width: 70%; } .img-block-list { padding: 2rem 6rem; } .img-block-linecir { position: absolute; right: 10%; bottom: 5%; width: 30%; z-index: -1; } .img-block-linecir.left { right: -10%; bottom: -5%; } .img-block-linecir.right { left: -10%; bottom: -5%; } .img-block-linecir.left { left: -10%; bottom: -5%; } .aboutus_img { width: 100%; } .aboutus_prize_img { border: 1.5rem solid rgb(231, 231, 231); border-radius: 1rem; } .header__ai-training__span { width: 6rem; height: 6rem; padding: 1rem; display: inline-block; font-size: 1.4rem; background-color: rgb(255, 255, 159); border-radius: 50%; } .ai-training__action { border: 3px dashed #ffebe8; } .ai-training__card .card-img-top { height: 35vh; } .ai-training__action ul { list-style: none; line-height: 2rem; } .ai-training__action__box { flex-direction: row; } .ai-training__action__btn { padding: 0.5rem 2rem; border: none; outline: none; border-radius: 4rem; background: #ea5413; font-size: 1.3rem; color: white; } .ai-training__action__img { width: 15rem; height: 15rem; background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 50%; border: 3px solid #ffdbd6; } .hero-btn { border: none; outline: none; border-radius: 3rem; margin-top: 0.5rem; padding: 0.6rem 1.5rem; background: linear-gradient(20deg, #ea5413, #920783); color: white; font-size: 1.1rem; box-shadow: 1px 1px 5px 1px rgba(207, 207, 207, 0.5294117647); } .contact-btn { text-decoration: none; color: white; border: 1px solid #ea5413; padding: 0.6rem 1.5rem; outline: none; background-color: #ea5413; margin-top: 0.5rem; border-radius: 3rem; box-shadow: 1px 1px 5px 1px rgba(201, 201, 201, 0.637); transition: all 0.3s; } .contact-btn:hover { color: #ea5413; background-color: transparent; border: 1px solid #ea5413; } .loaded { box-shadow: 0 4px 8px 0 rgba(53, 105, 128, 0.3019607843), 0 6px 20px 0 rgba(165, 200, 213, 0.4117647059); margin-bottom: 4rem; } .pageForm-title { padding: 0 0 0 40px; background-image: url(/imgs/dm/accept.png); background-position: 0 0; background-repeat: no-repeat; background-size: 30px auto; } .pageForm-txt { padding-left: 40px; } .pageForm-notice { padding-left: 40px; color: grey; margin-top: 50px; } .pageForm-p { padding: 40px; } .btn-detailForm { background-color: transparent; border: none; outline: none; color: #ff892e; padding: 0 0; padding-bottom: 0.1rem; margin-bottom: 0.8rem; display: inline-block; border-bottom: 1px dotted #ff892e; transition: all 0.4s; text-decoration: none; } .btn-detailForm:hover { transform: translate(2px, 2px); text-decoration: none; color: #ff892e; } @media (max-width: 1300px) { .header-right-video { position: absolute; width: 76%; } } @media (max-width: 992px) { .cntheader .header-title { font-size: 2.2rem; } .header-right { height: 40vh; } .header-right-magnifier { right: -2.5rem; bottom: 1rem; } .header__sub { font-size: 1.3rem; } .header__sub::before, .header__sub::after { width: 8%; } .header__sub::before { left: 30%; } .header__sub::after { left: 62%; } .header__form__input { font-size: 0.9rem; } .category-btngrp { padding: 0; } .category-btn { padding: 0.3rem 1.5rem; font-size: 1.2rem; } .ctncategory-btn { padding: 0.2rem 1rem; font-size: 1rem; } .top3 .row { padding: 0; } .card__rank { padding: 0.8rem 1rem; } .top3__num { left: 0.6rem; top: -2.5rem; font-size: 4rem; } .card__rank__word { margin-left: 1.5rem; font-size: 1.2rem; } .card__rank hr { margin-top: 8px; margin-bottom: 8px; } .top20 .row { padding: 0; } .top20__num { font-size: 2.1rem; width: 1.6rem; } .container__footer { width: 95vw; } .header__form { width: 85%; position: relative; } .header__form__input { margin-left: 0; width: 100%; } .header__form__sub { transform: none; position: absolute; right: 0; top: 0; } .header-right-linecir { bottom: 0; } .cntheader__sub { font-size: 1.2rem; } .cntheader__sub::before { left: 13%; } .cntheader__sub::after { left: 72%; } .toparticle__title img { position: absolute; width: 90px; right: -2rem; top: -2rem; } .toparticle__top { font-size: 1.7rem; } .fb__fr { width: 100%; } .cntsubscribe__form { width: 100%; } .ai-training__action__box { flex-direction: column; } } @media (max-width: 767px) { .header .col-md-5 { margin-bottom: 3rem; } .header-right-bubble { width: 15%; } .header-right-magnifier { right: 4rem; bottom: 1rem; } .category { padding-top: 4rem; } .category.dm-description { padding-top: 4rem; padding-left: 0; padding-right: 0; margin-top: 4.5rem; } .category.mt-xl { margin-top: 8.5rem; } .category.dm-description h5 { padding-left: 1rem; padding-right: 1rem; } .top3 { padding-bottom: 2rem; } .top3 .col-md-4 { margin-bottom: 1.5rem; } .top3 .col-md-4:nth-of-type(3) { margin-bottom: 0; } .card__rank { margin-bottom: 1.5rem; } .row-right { margin-top: 2rem; } .cntheader { padding-bottom: 0rem; } .header-right-video { position: absolute; width: 70%; left: 2.3rem; top: 1.5rem; } .img-block-list { padding: 2rem 1.5rem; } .ai-training__card .card-img-top { height: 50vh; } } @media (max-width: 576px) { .header-title { font-size: 2.5rem; } .header.ai-training { height: 80vh; } .header-right { height: 30vh; } .header-right-magnifier { right: 0rem; bottom: 1.5rem; } .category-btn { padding: 0.2rem 1rem; font-size: 1rem; } .category { padding: 1rem; } .footer-img { height: 50px; } .footer { font-size: 0.9rem; } .pageForm-p { padding: 15px; } .pageForm { width: 95%; } } @media (max-width: 480px) { .ctncategory-btn { margin-top: 0.6rem; } .header-right-video { position: absolute; width: 75%; left: 2.1rem; top: 1.3rem; } } /* ai-anchor Start */ #ai-anchor { overflow-x: hidden; } #ai-anchor .stock-bg { height: 850px; left: -15vw; top: -125px; position: absolute; z-index: -1; } @media (max-width: 1400px) { #ai-anchor .stock-bg { top: -130px; } } @media (max-width: 991px) { #ai-anchor .stock-bg { top: -175px; } } @media (max-width: 767px) { #ai-anchor .stock-bg { top: -155px; } } @media (max-width: 490px) { #ai-anchor .stock-bg { top: -130px; } } @media (max-width: 575px) { #ai-anchor .header-title { font-size: 2rem; } } #ai-anchor .header-sub { padding: 0 10px; text-align: start; } #ai-anchor .header-sub span { display: inline-block; margin-top: 35px; font-size: 24px; font-weight: bold; color: #f8a154; } #ai-anchor .header-sub p { width: 450px; margin: 20px auto; } @media (max-width: 991px) { #ai-anchor .header-sub p { width: auto; } } #ai-anchor .ai-description { padding-top: 200px; padding-bottom: 100px; } @media (max-width: 991px) { #ai-anchor .ai-description { padding-top: 100px; } } #ai-anchor .ai-description div .icon { width: 30px; } #ai-anchor .ai-description h5 { margin: 0; font-size: 28px; font-weight: bold; color: #ea5413; } @media (max-width: 375px) { #ai-anchor .ai-description h5 { font-size: 20px; } } #ai-anchor .ai-description .content-box { display: flex; justify-content: space-between; margin-bottom: 150px; } @media (max-width: 991px) { #ai-anchor .ai-description .content-box { flex-direction: column; } } #ai-anchor .ai-description .content-box section { width: 35%; } @media (max-width: 991px) { #ai-anchor .ai-description .content-box section { width: 100%; } } #ai-anchor .ai-description .triangle-item { display: flex; justify-content: center; } @media (max-width: 991px) { #ai-anchor .ai-description .triangle-item { margin-left: -35px; } } #ai-anchor .ai-description .triangle-item img { width: 40px; height: 100%; image-rendering: -webkit-optimize-contrast; } @media (max-width: 991px) { #ai-anchor .ai-description .triangle-item img { transform: rotate(90deg); } } #ai-anchor .faq-content { position: relative; } #ai-anchor .faq-content .img-box { position: relative; } @media (max-width: 575px) { #ai-anchor .faq-content .img-box { width: 330px; margin: auto; } } #ai-anchor .faq-content .img-box .img-mb { width: 500px; margin: auto; } @media (max-width: 575px) { #ai-anchor .faq-content .img-box .img-mb { width: 100%; } } #ai-anchor .faq-content .img-box .text-box { position: absolute; width: 330px; right: 330px; top: 80px; line-height: 35px; font-size: 18px; font-weight: bold; color: #656565; } @media (max-width: 1400px) { #ai-anchor .faq-content .img-box .text-box { right: 260px; top: 55px; } } @media (max-width: 1199px) { #ai-anchor .faq-content .img-box .text-box { font-size: 16px; right: 185px; top: 40px; } } @media (max-width: 991px) { #ai-anchor .faq-content .img-box .text-box { width: 365px; right: 160px; top: 310px; font-size: 18px; } } @media (max-width: 767px) { #ai-anchor .faq-content .img-box .text-box { right: 70px; } } @media (max-width: 575px) { #ai-anchor .faq-content .img-box .text-box { width: 285px; right: 23px; top: 190px; font-size: 14px; } } @media (max-width: 991px) { #ai-anchor .faq-content .img-box .text-box p:last-child { width: 200px; } } @media (max-width: 575px) { #ai-anchor .faq-content .img-box .text-box p:last-child { width: 170px; } } #ai-anchor ul { list-style: none; text-align: center; } @media (max-width: 767px) { #ai-anchor ul { padding: 0; } } #ai-anchor ul li { font-size: 18px; margin-bottom: 10px; font-weight: bold; } @media (max-width: 767px) { #ai-anchor ul li { font-size: 16px; } } #ai-anchor video { width: 75%; height: auto; } @media (max-width: 767px) { #ai-anchor video { width: 90%; } } #ai-anchor .content { width: 800px; margin: 0 auto 10rem; padding: 2rem 8rem; border-radius: 20px; background-color: #fff2ec; font-size: 20px; } @media (max-width: 991px) { #ai-anchor .content { width: 90%; padding: 2rem 5vw; } } @media (max-width: 567px) { #ai-anchor .content { padding-top: 130px; } } #ai-anchor .content .img-01 { position: absolute; top: -75px; left: -30px; z-index: 1; width: 45%; image-rendering: -webkit-optimize-contrast; } @media (max-width: 567px) { #ai-anchor .content .img-01 { top: -40%; width: 250px; } } #ai-anchor .content .ai-anchor-price { background-color: transparent; padding: 2px 1px; border-radius: 5px; font-size: 48px; color: #3190da; background: linear-gradient(transparent 40%, rgba(255, 255, 255, 0) 50%, yellow 75%, yellow 90%, transparent 95%); } #ai-anchor .content, #ai-anchor .ai-description span { font-size: 22px; font-weight: bold; color: #3190da; } /* ai-anchor End */ /* ad-operation Start */ #ad-operation { overflow-x: hidden; } #ad-operation .header { height: auto; margin-top: -20px; } #ad-operation .header p { font-weight: bold; line-height: 32px; } #ad-operation .header p span { font-size: 20px; color: #ea5413; } #ad-operation .header .banner { position: relative; } #ad-operation .header .banner .img { max-width: 100vw; height: auto; } #ad-operation .header .banner .text { width: 100%; position: absolute; z-index: 100; left: -55px; top: -60px; } @media (max-width: 991px) { #ad-operation .header .banner .text { left: -45px; top: -35px; } } @media (max-width: 767px) { #ad-operation .header .banner .text { left: -30px; top: -20px; } } @media (max-width: 575px) { #ad-operation .header .banner .text { left: -15px; top: -15px; } } #ad-operation .header .banner .slogen { display: flex; flex-direction: column; align-items: center; position: absolute; top: 63vw; } #ad-operation .header .banner .slogen h3 { margin-bottom: 0; font-size: 40px; font-weight: bold; } @media (max-width: 1199px) { #ad-operation .header .banner .slogen h3 { font-size: 33px; } } @media (max-width: 991px) { #ad-operation .header .banner .slogen h3 { font-size: 28px; } } @media (max-width: 767px) { #ad-operation .header .banner .slogen h3 { font-size: 20px; } } @media (max-width: 575px) { #ad-operation .header .banner .slogen h3 { font-size: 16px; } } #ad-operation .header .banner .slogen h3 span { margin: 20px 0; display: inline-block; font-size: 70px; color: #900381; } @media (max-width: 1199px) { #ad-operation .header .banner .slogen h3 span { font-size: 58px; } } @media (max-width: 991px) { #ad-operation .header .banner .slogen h3 span { margin: 10px 0; font-size: 50px; } } @media (max-width: 767px) { #ad-operation .header .banner .slogen h3 span { font-size: 36px; } } @media (max-width: 575px) { #ad-operation .header .banner .slogen h3 span { margin: 5px 0; font-size: 20px; } } #ad-operation .header .banner .slogen h3 .point { color: #dd541a; } #ad-operation .header .banner .slogen h3 small { margin-left: 5px; color: #868585; text-decoration: line-through; } #ad-operation .header .banner .slogen h4 { font-size: 46px; font-weight: bold; } @media (max-width: 1199px) { #ad-operation .header .banner .slogen h4 { font-size: 38px; } } @media (max-width: 991px) { #ad-operation .header .banner .slogen h4 { font-size: 32px; } } @media (max-width: 767px) { #ad-operation .header .banner .slogen h4 { font-size: 24px; } } @media (max-width: 575px) { #ad-operation .header .banner .slogen h4 { font-size: 14px; } } #ad-operation .header .banner .slogen button { margin-top: 30px; } @media (max-width: 991px) { #ad-operation .header .banner .slogen button { margin-top: 10px; } } @media (max-width: 575px) { #ad-operation .header .banner .slogen button { margin-top: 5px; } } #ad-operation .header-title { color: #000; font-weight: bold; letter-spacing: 5px; } #ad-operation .header-right-cir { right: -15%; top: 30%; } #ad-operation .img-content { display: flex; justify-content: center; margin: -100px auto; position: relative; z-index: 100; width: 1300px; } @media (max-width: 1199px) { #ad-operation .img-content { width: 1000px; margin: -50px auto; } } @media (max-width: 991px) { #ad-operation .img-content { width: 700px; } } @media (max-width: 767px) { #ad-operation .img-content { width: 600px; } } @media (max-width: 575px) { #ad-operation .img-content { left: -10px; width: 350px; } } #ad-operation .img-content img { width: 100%; } @media (max-width: 575px) { #ad-operation .img-content img { width: 140%; } } #ad-operation .img-content h4 { position: absolute; font-size: 30px; line-height: 40px; font-weight: bold; text-align: center; } @media (max-width: 1199px) { #ad-operation .img-content h4 { font-size: 22px; line-height: 30px; } } @media (max-width: 991px) { #ad-operation .img-content h4 { font-size: 16px; line-height: 24px; } } @media (max-width: 767px) { #ad-operation .img-content h4 { font-size: 14px; line-height: 20px; } } @media (max-width: 575px) { #ad-operation .img-content h4 { font-size: 12px; } } #ad-operation .img-content .left { top: 320px; left: 280px; } @media (max-width: 1199px) { #ad-operation .img-content .left { top: 245px; left: 218px; } } @media (max-width: 991px) { #ad-operation .img-content .left { top: 170px; left: 150px; } } @media (max-width: 767px) { #ad-operation .img-content .left { top: 145px; left: 128px; } } @media (max-width: 575px) { #ad-operation .img-content .left { top: 115px; left: 32px; } } #ad-operation .img-content .center { top: 420px; left: 600px; } @media (max-width: 1199px) { #ad-operation .img-content .center { top: 325px; left: 465px; } } @media (max-width: 991px) { #ad-operation .img-content .center { top: 225px; left: 323px; } } @media (max-width: 767px) { #ad-operation .img-content .center { top: 193px; left: 278px; } } @media (max-width: 575px) { #ad-operation .img-content .center { top: 153px; left: 155px; } } #ad-operation .img-content .right { top: 545px; right: 240px; } @media (max-width: 1199px) { #ad-operation .img-content .right { top: 420px; right: 188px; } } @media (max-width: 991px) { #ad-operation .img-content .right { top: 290px; right: 130px; } } @media (max-width: 767px) { #ad-operation .img-content .right { top: 250px; right: 109px; } } @media (max-width: 575px) { #ad-operation .img-content .right { top: 200px; right: 17px; } } #ad-operation .dm-description { display: flex; flex-direction: column; justify-content: center; align-items: center; } #ad-operation .dm-description h2 { margin: 0; padding: 8px 10px; color: #fff; display: inline-block; text-align: center; font-size: 24px; line-height: 33px; border-radius: 10px; background: #ea5413; } #ad-operation .dm-description h5 { font-size: 22px; letter-spacing: 2px; line-height: 36px; } @media (max-width: 767px) { #ad-operation .dm-description h5 { font-size: 18px; } } #ad-operation .dm-description h5 strong { padding-bottom: 3px; } #ad-operation .dm-description .line { display: block; width: 50px; height: 7px; margin: 80px auto 40px; background-color: #ea5413; } #ad-operation .dm-description .stock-img { position: absolute; z-index: -10; width: 100vw; top: 100%; height: 660px; } @media (max-width: 1199px) { #ad-operation .dm-description .stock-img { height: 535px; } } @media (max-width: 991px) { #ad-operation .dm-description .stock-img { height: 360px; } } @media (max-width: 767px) { #ad-operation .dm-description .stock-img { height: 300px; } } @media (max-width: 575px) { #ad-operation .dm-description .stock-img { height: 235px; } } #ad-operation .dm-description .purple-circle { top: 100px; } #ad-operation .card-content > div { display: flex; flex-direction: column; border: 2px solid #ea5413; border-radius: 10px; } #ad-operation .card-content h3 { width: 60%; margin: -17px auto 0; padding: 8px 5px; display: inline-block; color: #fff; background: #ea5413; text-align: center; font-size: 18px; font-weight: bold; letter-spacing: 2px; border-radius: 10px; box-shadow: 2px 2px 5px #ccc; } @media (max-width: 576px) { #ad-operation .card-content h3 { width: auto; padding: 7px 15px; font-size: 16px; } } #ad-operation .card-content h4, #ad-operation .card-content .table { margin-top: 25px; padding: 20px; font-size: 14px; line-height: 32px; background: #ffebe2; } #ad-operation .card-content h4 span, #ad-operation .card-content .table span { display: block; border-bottom: 1px solid; } #ad-operation .card-content h4 strong, #ad-operation .card-content .table strong { font-size: 20px; } #ad-operation .card-content h4 p, #ad-operation .card-content .table p { margin: 0; line-height: 20px; } #ad-operation .content-box { width: 65%; margin: auto; padding: 30px 0; display: flex; justify-content: center; background: #ffebe2; border: 2px solid #ffebe2; position: relative; } @media (max-width: 991px) { #ad-operation .content-box { width: 90%; } } @media (max-width: 767px) { #ad-operation .content-box { width: 100%; } } @media (max-width: 475px) { #ad-operation .content-box { padding-left: 10px; } } #ad-operation .content-box p { margin: 0; line-height: 32px; } @media (max-width: 767px) { #ad-operation .content-box p { font-size: 14px; } } @media (max-width: 475px) { #ad-operation .content-box p { font-size: 13px; } } #ad-operation .content-box h4 { font-size: 22px; font-weight: bold; margin-bottom: 20px; } @media (max-width: 767px) { #ad-operation .content-box h4 { font-size: 18px; } } @media (max-width: 475px) { #ad-operation .content-box h4 { font-size: 14px; white-space: nowrap; } } #ad-operation .content-box .line { height: 3px; background: #fff; width: 950px; position: absolute; left: -200px; top: 35px; } @media (max-width: 767px) { #ad-operation .content-box .line { top: 33px; } } @media (max-width: 575px) { #ad-operation .content-box .line { top: 30px; } } #ad-operation .content-badge { position: absolute; left: 0; top: -53px; padding: 5px 10px; background: #ea5413; border-radius: 10px; font-size: 22px; font-weight: bold; color: #fff; } #ad-operation .client-content { position: relative; display: flex; justify-content: center; } #ad-operation .client-content p { position: absolute; top: 11vw; z-index: 10; font-size: 32px; font-weight: bold; } @media (max-width: 991px) { #ad-operation .client-content p { font-size: 28px; } } @media (max-width: 767px) { #ad-operation .client-content p { font-size: 22px; } } @media (max-width: 575px) { #ad-operation .client-content p { top: 9vw; font-size: 18px; } } #ad-operation .pageForm { line-height: 32px; letter-spacing: 1px; background: #fff; } #ad-operation .header-lefttop { width: 170%; position: absolute; left: -22vw; top: -225px; z-index: -1; opacity: 0.5; } @media (max-width: 991px) { #ad-operation .header-lefttop { width: 100%; left: -24vw; top: -250px; } } @media (max-width: 991px) { #ad-operation .header-lefttop { top: -26vw; } } #ad-operation .category.dm-description { padding: 2rem 8rem; } @media (max-width: 991px) { #ad-operation .category.dm-description { padding: 2rem 3rem; } } @media (max-width: 767px) { #ad-operation .category.dm-description { padding: 2rem 0rem; } } #ad-operation .accreditation p { font-size: 24px; } @media (max-width: 575px) { #ad-operation .accreditation p { font-size: 20px; } } #ad-operation .accreditation img { width: 150px; position: absolute; top: -35px; left: -25px; } @media (max-width: 767px) { #ad-operation .accreditation img { width: 135px; left: -50px; } } @media (max-width: 575px) { #ad-operation .accreditation img { width: 120px; top: -80px; left: -20px; } } #ad-operation .purple-circle { width: 40%; top: -400px; right: -150px; position: absolute; z-index: -100; } @media (max-width: 991px) { #ad-operation .purple-circle { width: 60%; } } @media (max-width: 767px) { #ad-operation .purple-circle { top: -300px; } } #ad-operation .data-text .circle { top: -220px; left: -5vw; } @media (max-width: 767px) { #ad-operation .data-text .circle { top: -100px; } } /* ad-operation End */ /* blog-traffic Start */ .blog-traffic { overflow-x: hidden; } .blog-traffic .header { padding: 0; } .blog-traffic .banner { width: 100vw; height: auto; position: absolute; z-index: -10; } @media (max-width: 767px) { .blog-traffic .banner { width: 150vw; height: auto; } } .blog-traffic .header-img { width: 150%; height: auto; position: relative; top: -30px; right: 30px; z-index: -1; } @media (max-width: 767px) { .blog-traffic .header-img { width: 100%; top: -45px; right: unset; } } .blog-traffic .header-title { font-size: 2.5rem; line-height: 65px; font-weight: 600; color: #000; } @media (max-width: 768px) { .blog-traffic .header-title { font-size: 2.2rem; } } .blog-traffic .dm-description { margin-top: -250px; } @media (max-width: 1400px) { .blog-traffic .dm-description { margin-top: -190px; } } @media (max-width: 991px) { .blog-traffic .dm-description { margin-top: -100px; } } .blog-traffic .dm-description p { font-size: 20px; line-height: 32px; } .blog-traffic .category { padding: 0; position: relative; } .blog-traffic .category.dm-description { padding: 0; } @media (max-width: 575px) { .blog-traffic .category { padding: 0 10px; } } .blog-traffic .category h4 { font-size: 2rem; } .blog-traffic .category h4, .blog-traffic .category .sub-title { margin: 0; color: #f5ab1b; font-weight: bold; } .blog-traffic .category-sub-h2::after { width: 3rem; border-bottom: 10px solid #ea5413; margin-top: 15px; } .blog-traffic ul { padding: 0; list-style: none; } .blog-traffic ul li { line-height: 32px; } .blog-traffic .img-block-img { width: 12%; -o-object-fit: contain; object-fit: contain; image-rendering: -webkit-optimize-contrast; position: relative; top: -30px; } @media (max-width: 1199px) { .blog-traffic .img-block-img { top: -10px; } } @media (max-width: 991px) { .blog-traffic .img-block-img { width: 15%; } } @media (max-width: 767px) { .blog-traffic .img-block-img { width: 20%; top: 5px; } } @media (max-width: 490px) { .blog-traffic .img-block-img { top: 15px; } } @media (max-width: 414px) { .blog-traffic .img-block-img { top: 22px; } } @media (max-width: 1199px) { .blog-traffic .img-first { top: 0; } } @media (max-width: 767px) { .blog-traffic .img-first { top: 15px; } } @media (max-width: 490px) { .blog-traffic .img-first { top: 40px; } } .blog-traffic .add-img { width: 130px; margin: 10px auto 0; image-rendering: -webkit-optimize-contrast; } @media (max-width: 991px) { .blog-traffic .add-img { margin: 0 auto; } } @media (max-width: 767px) { .blog-traffic .add-img { margin: 10px auto -25px; } } .blog-traffic .purple-circle { width: 50%; left: -250px; bottom: 100px; } @media (max-width: 991px) { .blog-traffic .purple-circle { left: -150px; } } @media (max-width: 767px) { .blog-traffic .purple-circle { left: -50px; } } .blog-traffic .orange-circle { width: 50%; right: -200px; top: -200px; } @media (max-width: 767px) { .blog-traffic .orange-circle { right: -100px; top: -150px; } } .blog-traffic .data-text .circle { top: -250px; right: -5vw; } @media (max-width: 767px) { .blog-traffic .data-text .circle { top: 0px; } } /* blog-traffic End */ /* seo Start */ #seo-dm { overflow: hidden; } #seo-dm .header-title { color: #f6ab1c; } @media (max-width: 767px) { #seo-dm .header-title { font-size: 2rem; } } #seo-dm .bg-img { width: 50%; position: absolute; right: -50px; z-index: -1; } #seo-dm .about-list { margin-top: 90px; } @media (max-width: 767px) { #seo-dm .about-list { margin-top: 60px; } } #seo-dm .about-list ul { margin: 0; padding: 0; list-style: none; } #seo-dm .about-list ul li { margin-bottom: 30px; } #seo-dm .about-list ul li strong { margin-bottom: 5px; display: block; font-size: 22px; } #seo-dm .service { margin-top: 150px; } @media (max-width: 767px) { #seo-dm .service { margin-top: 80px; } } #seo-dm .service img, #seo-dm .point-list img { height: 230px; -o-object-fit: contain; object-fit: contain; } #seo-dm .point-list h4 { font-size: 22px; font-weight: bold; text-align: center; color: #f6ab1c; } #seo-dm .accordion, #seo-dm .news-form { max-width: 900px; margin: 100px auto; } #seo-dm .link-btn { display: inline-block; padding: 12px 35px; margin-top: 25px; border: none; border-radius: 100px; background: #ea5413; transition: all 0.3s; } #seo-dm .link-btn a { font-size: 18px; font-weight: bold; color: #fff; text-decoration: none; } #seo-dm .link-btn:hover { opacity: 0.8; } #seo-dm .block-content { margin-left: -35px; } @media (max-width: 767px) { #seo-dm .block-content { margin-left: auto; } } #seo-dm .block-content h3 { color: #f6ab1c; font-size: 2.2rem; font-weight: bold; line-height: 1.3; } @media (max-width: 991px) { #seo-dm .block-content h3 { font-size: 1.8rem; } } @media (max-width: 575px) { #seo-dm .block-content h3 { font-size: 1.5rem; } } #seo-dm .block-content p { color: #656565; font-weight: bold; } #seo-dm .block-content .block-title { margin-bottom: 20px; } @media (max-width: 575px) { #seo-dm .block-content .block-title { margin-bottom: 0; } } /* seo End */ /* ai-video Start */ #ai-video { margin-top: 75px; } #ai-video h2 { padding: 10px; font-weight: 600; text-align: center; color: #fff; background-color: #910782; } #ai-video p { font-weight: 600; color: #474047; line-height: 2.5; } @media (max-width: 991px) { #ai-video p { line-height: 2; } } #ai-video .ai-line { margin-bottom: -10px; } @media (max-width: 991px) { #ai-video .ai-line { margin-bottom: -5px; } } #ai-video .main-text { font-size: 28px; font-weight: 600; color: #910782; } @media (max-width: 991px) { #ai-video .main-text { line-height: 2; } } @media (max-width: 767px) { #ai-video .main-text { margin-bottom: 1rem; font-size: 22px; } } #ai-video .bg-img { width: 100%; position: absolute; top: 30px; z-index: -1; opacity: 0.5; transform: scale(1.5); } #ai-video .process { display: flex; position: relative; margin: 80px auto 160px; } @media (max-width: 991px) { #ai-video .process { flex-direction: column; align-items: center; margin: 60px auto; } } #ai-video .process .bg-img { top: -185px; opacity: 0.3; } #ai-video .process .main-img { width: 25vw; height: 205px; max-width: 100%; -o-object-fit: cover; object-fit: cover; } @media (max-width: 991px) { #ai-video .process .main-img { width: 100%; height: auto; max-width: 650px; margin: 1rem auto; } } #ai-video .process .arrow-img { width: 5vw; margin: 0 1vw; max-width: 100%; -o-object-fit: contain; object-fit: contain; } @media (max-width: 991px) { #ai-video .process .arrow-img { width: 10vw; margin: 0 5vw; transform: rotate(90deg); } } #ai-video .contrast { position: relative; } #ai-video .contrast p { position: absolute; right: 13vw; top: 3vw; font-size: 20px; } @media (max-width: 1200px) { #ai-video .contrast p { right: 10vw; top: 2vw; } } @media (max-width: 991px) { #ai-video .contrast p { right: 5vw; top: 5vw; font-size: 16px; } } @media (max-width: 767px) { #ai-video .contrast p { top: 6vw; font-size: 14px; } } @media (max-width: 575px) { #ai-video .contrast p { top: 8vw; } } #ai-video .contrast .ai { right: 6vw; } @media (max-width: 1200px) { #ai-video .contrast .ai { right: 2vw; } } @media (max-width: 991px) { #ai-video .contrast .ai { right: -2vw; } } @media (max-width: 767px) { #ai-video .contrast .ai { right: -5vw; } } @media (max-width: 575px) { #ai-video .contrast .ai { right: 13vw; } } @media (max-width: 1200px) { #ai-video .contrast img { margin-left: -20px; } } @media (max-width: 991px) { #ai-video .contrast img { max-width: 120%; margin-top: 20px; } } @media (max-width: 767px) { #ai-video .contrast img { max-width: 40vw; margin-top: 30px; } } @media (max-width: 575px) { #ai-video .contrast img { max-width: 50vw; } } #ai-video .title { font-size: 30px; color: #e95513; text-align: center; } #ai-video .user-content .bg-img { top: 130px; transform: scaleX(-1) scale(1.5); } #ai-video .user-content .item h5 { padding: 20px; color: #fff; font-size: 24px; text-align: center; font-weight: 600; letter-spacing: 1px; border-radius: 20px 20px 0 0; background-color: #e95513; } #ai-video .user-content .item ul { min-height: 250px; padding: 20px 20px 20px 40px; box-shadow: 3px 3px 5px #909090; border-radius: 0 0 20px 20px; background-color: #fff; } #ai-video .user-content .item ul li { margin-bottom: 15px; color: #910782; font-weight: 600; text-align: justify; } #ai-video .user-content .item ul li:last-child { margin-bottom: 0; } #ai-video .faq-list { max-width: 700px; margin: auto; display: flex; flex-direction: column; position: relative; } @media (max-width: 575px) { #ai-video .faq-list { font-size: 14px; } } #ai-video .faq-list p { margin: 0; line-height: 1.6; position: absolute; } #ai-video .faq-list .circle { width: 600px; left: -30vw; top: 300px; z-index: -100; position: absolute; } #ai-video .faq-list .q-item, #ai-video .faq-list .a-item { position: relative; } #ai-video .faq-list .q-item { margin-right: auto; margin-bottom: -35px; } #ai-video .faq-list .q-item p { top: 45px; color: #fff; } #ai-video .faq-list .q-item.q-1 img { width: 380px; height: 120px; margin-bottom: 10px; } #ai-video .faq-list .q-item.q-1 p { left: 60px; } #ai-video .faq-list .q-item.q-2 img { width: 255px; height: 110px; margin-bottom: 30px; } #ai-video .faq-list .q-item.q-2 p { left: 50px; } #ai-video .faq-list .q-item.q-3 img { width: 315px; height: 120px; margin-bottom: 25px; } #ai-video .faq-list .q-item.q-3 p { left: 50px; } #ai-video .faq-list .q-item.q-4 img { width: 470px; height: 115px; margin-bottom: 35px; } @media (max-width: 575px) { #ai-video .faq-list .q-item.q-4 img { width: 400px; } } #ai-video .faq-list .q-item.q-4 p { left: 40px; } @media (max-width: 575px) { #ai-video .faq-list .q-item.q-4 p { left: 30px; } } #ai-video .faq-list .q-item.q-5 img { width: 210px; height: 110px; margin-bottom: 35px; } #ai-video .faq-list .q-item.q-5 p { left: 50px; } #ai-video .faq-list .a-item { display: flex; justify-content: end; } #ai-video .faq-list .a-item p { color: #e95513; } #ai-video .faq-list .a-item.a-1 img { width: 550px; height: 210px; margin-bottom: -20px; } @media (max-width: 575px) { #ai-video .faq-list .a-item.a-1 img { width: 400px; height: 225px; } } #ai-video .faq-list .a-item.a-1 p { width: 435px; top: 53px; right: 53px; } @media (max-width: 575px) { #ai-video .faq-list .a-item.a-1 p { width: 300px; } } #ai-video .faq-list .a-item.a-2 img { width: 420px; height: 140px; } #ai-video .faq-list .a-item.a-2 p { width: 330px; top: 45px; right: 40px; } #ai-video #form { margin: 100px auto; max-width: 800px; } @media (max-width: 991px) { #ai-video #form { margin: 50px auto 100px; max-width: 100%; } } #ai-video #form .title p { font-size: 16px; } /* ai-video End */ /* youtube-views Start */ #youtube-views, #youtube-views-zh { overflow-x: hidden; } #youtube-views h5, #youtube-views-zh h5 { line-height: 32px; } #youtube-views .title, #youtube-views-zh .title { color: #ea5413; font-size: 1.3rem; font-weight: bold; } #youtube-views .header-right, #youtube-views-zh .header-right { background-position: center; } #youtube-views .card-group, #youtube-views-zh .card-group { margin-top: 50px; } #youtube-views .card-group .card, #youtube-views-zh .card-group .card { box-shadow: 0 0 10px rgba(32, 32, 32, 0.2509803922); } #youtube-views .card-group .card ul, #youtube-views-zh .card-group .card ul { padding: 0; list-style: none; } #youtube-views .card-group .card ul img, #youtube-views-zh .card-group .card ul img { margin-bottom: 1px; } #youtube-views .card-group .card .price, #youtube-views-zh .card-group .card .price { width: 100%; padding: 10px 0; font-size: 28px; font-weight: bold; text-align: center; color: #fff; background-color: #ea5413; letter-spacing: 2px; } #youtube-views .card-group .card .buy-btn, #youtube-views-zh .card-group .card .buy-btn { padding: 6px 18px; color: #fff; border: 1px solid transparent; border-radius: 50px; background: #ea5413; transition: all 0.3s; } #youtube-views .card-group .card .buy-btn:hover, #youtube-views-zh .card-group .card .buy-btn:hover { color: #ea5413; border: 1px solid #ea5413; background: #fff; } #youtube-views .card-group .paypal-content, #youtube-views-zh .card-group .paypal-content { margin: 0 20px; box-shadow: none; } #youtube-views .direction-list, #youtube-views-zh .direction-list { margin-top: 100px; } @media (max-width: 991px) { #youtube-views .direction-list, #youtube-views-zh .direction-list { margin-top: 60px; } } #youtube-views .direction-list img, #youtube-views-zh .direction-list img { width: 50px; -o-object-fit: contain; object-fit: contain; filter: invert(33%) sepia(55%) saturate(2232%) hue-rotate(357deg) brightness(102%) contrast(89%); } #youtube-views .direction-list .content > div, #youtube-views-zh .direction-list .content > div { margin-bottom: 40px; padding: 0px 15px; border-left: 1px solid rgba(0, 0, 0, 0.125); border-bottom: 1px solid rgba(0, 0, 0, 0.125); } #youtube-views .direction-list section h5, #youtube-views-zh .direction-list section h5 { margin: 0; font-size: 18px; font-weight: bold; } #youtube-views .direction-list section p, #youtube-views-zh .direction-list section p { font-size: 14px; } #youtube-views .accordion-button, #youtube-views-zh .accordion-button { padding: 20px; } #youtube-views .accordion-button:not(.collapsed), #youtube-views-zh .accordion-button:not(.collapsed) { color: #ea5413 !important; background-color: #ffebe2 !important; } #youtube-views button:focus:not(:focus-visible), #youtube-views-zh button:focus:not(:focus-visible) { box-shadow: none !important; } #youtube-views .accordion-button:not(.collapsed)::after, #youtube-views-zh .accordion-button:not(.collapsed)::after { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ea5413'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); } @media (max-width: 767px) { #youtube-views .category.dm-description, #youtube-views-zh .category.dm-description { padding-top: 6rem; } } @media (max-width: 575px) { #youtube-views .category.dm-description, #youtube-views-zh .category.dm-description { padding-top: 14rem; } } /* youtube-views End */ /* youtube-views-zh Start */ #youtube-views-zh .header { margin-top: 0; padding: 4.8rem 0 3rem; } #youtube-views-zh .header p { max-width: 330px; text-align: start; line-height: 35px; font-size: 18px; font-weight: bold; color: #656565; } @media (max-width: 991px) { #youtube-views-zh .header p { max-width: 100%; } } @media (max-width: 414px) { #youtube-views-zh .header p { font-size: 14px; } } @media (max-width: 991px) { #youtube-views-zh .header .row div { text-align: center; } } #youtube-views-zh .header .bg-img { width: 100%; height: 100%; position: absolute; z-index: -1; top: 0; bottom: 0; } #youtube-views-zh .header .header-title { padding-top: 10rem; margin-bottom: 30px; font-size: 40px; color: #ea5413; line-height: 44px; } @media (max-width: 991px) { #youtube-views-zh .header .header-title { padding-top: 5rem; } } @media (max-width: 414px) { #youtube-views-zh .header .header-title { font-size: 34px; } } #youtube-views-zh .header .header-title small { font-size: 28px; } @media (max-width: 991px) { #youtube-views-zh .header .header-title small { font-size: 22px; } } #youtube-views-zh .qa-block { padding-top: 30px; background-color: #e3c1dc; } #youtube-views-zh .qa-block img { width: 100%; } #youtube-views-zh .qa-block .q-text, #youtube-views-zh .qa-block .a-text { font-size: 1.3vw; position: absolute; font-weight: bold; } @media (max-width: 991px) { #youtube-views-zh .qa-block .q-text, #youtube-views-zh .qa-block .a-text { font-size: 2.5vw; } } #youtube-views-zh .qa-block .q-text { width: 25vw; top: 3.3vw; right: 13.5vw; } @media (max-width: 991px) { #youtube-views-zh .qa-block .q-text { width: 100%; top: 7vw; right: -24%; } } @media (max-width: 490px) { #youtube-views-zh .qa-block .q-text { top: 6vw; right: -21%; } } #youtube-views-zh .qa-block .a-text { top: 3.7vw; right: 5vw; } @media (max-width: 991px) { #youtube-views-zh .qa-block .a-text { top: 7.5vw; right: unset; left: 46vw; } } @media (max-width: 490px) { #youtube-views-zh .qa-block .a-text { top: 6.8vw; left: 42vw; } } @media (max-width: 767px) { #youtube-views-zh .info-content { text-align: center; } } #youtube-views-zh .info-content h4 { font-weight: bold; line-height: 40px; margin-bottom: 30px; } #youtube-views-zh .info-content h4 strong { font-size: 30px; color: #ea5413; } #youtube-views-zh .info-content p { width: 320px; line-height: 35px; color: #656565; } @media (max-width: 767px) { #youtube-views-zh .info-content p { margin: auto; } } #youtube-views-zh .info-content img { width: 100%; max-width: 380px; margin-right: 30px; } @media (max-width: 991px) { #youtube-views-zh .info-content img { max-width: 500px; } } #youtube-views-zh .pick-point { display: flex; justify-content: center; margin: 150px auto; position: relative; } #youtube-views-zh .pick-point ul { padding: 0; list-style: none; } #youtube-views-zh .pick-point ul li span { color: #ea5413; font-size: 20px; font-weight: bold; } #youtube-views-zh .pick-point .bg-img { width: 100%; position: absolute; top: -100px; z-index: -1; } @media (max-width: 767px) { #youtube-views-zh .pick-point .bg-img { width: 151%; top: -65px; } } #youtube-views-zh .pick-point .chat-img { left: 65%; top: -20px; position: absolute; } @media (max-width: 991px) { #youtube-views-zh .pick-point .chat-img { left: 75%; top: 3px; } } @media (max-width: 767px) { #youtube-views-zh .pick-point .chat-img { left: 70%; top: 10px; } } @media (max-width: 575px) { #youtube-views-zh .pick-point .chat-img { display: none; } } #youtube-views-zh .pick-point .chat-img img { width: 250px; } @media (max-width: 991px) { #youtube-views-zh .pick-point .chat-img img { width: 200px; } } @media (max-width: 767px) { #youtube-views-zh .pick-point .chat-img img { width: 170px; } } #youtube-views-zh .pick-point .chat-img p { color: #fff; position: absolute; top: 32px; right: 45px; font-size: 24px; } @media (max-width: 991px) { #youtube-views-zh .pick-point .chat-img p { top: 26px; right: 40px; font-size: 18px; } } @media (max-width: 767px) { #youtube-views-zh .pick-point .chat-img p { top: 20px; right: 25px; } } #youtube-views-zh .trust-item { padding: 5px 0; background-color: #ea5413; } #youtube-views-zh .trust-item p { color: #fff; font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 0; } #youtube-views-zh .price-block { padding: 50px; display: flex; flex-direction: column; align-items: center; } @media (max-width: 991px) { #youtube-views-zh .price-block { padding: 50px; } } #youtube-views-zh .price-block p { text-align: center; font-size: 20px; } #youtube-views-zh .price-block img { width: 100%; max-width: 1000px; } #youtube-views-zh .card-group { margin: 170px auto 50px; } @media (max-width: 575px) { #youtube-views-zh .card-group { margin: 75px auto 50px; } } #youtube-views-zh .card-group .card { border-radius: 20px; } #youtube-views-zh .card-group .card ul { padding: 10px; } #youtube-views-zh .card-group .card .price { font-size: 30px; } #youtube-views-zh .card-group .card .price small { display: block; margin-top: -3px; font-size: 18px; font-weight: normal; text-decoration: line-through; } #youtube-views-zh .card-group .card .buy-btn { display: block; text-decoration: none; } @media (max-width: 767px) { #youtube-views-zh .direction-list { margin-top: 50px; } } #youtube-views-zh .direction-list img { filter: unset; position: absolute; } #youtube-views-zh .direction-list section { margin-bottom: 40px; padding: 0px 35px 10px; border-left: 1px solid #656565; border-bottom: 1px solid #656565; border-radius: 0 0 0 10px; } #youtube-views-zh .direction-list section h5 { margin-bottom: 20px; } #youtube-views-zh .direction-list section p { font-size: 16px; line-height: 30px; color: #656565; } #youtube-views-zh .data-content { position: relative; } #youtube-views-zh .data-content .bg-img { position: absolute; top: -5px; right: 0; left: 0; width: 100%; z-index: -1; } #youtube-views-zh .data-content .row { padding: 0 5vw; } #youtube-views-zh .data-content .row > div { display: flex; flex-direction: column; align-items: center; justify-content: center; } #youtube-views-zh .data-content .row img { width: 100%; max-width: 700px; } #youtube-views-zh .data-content .title { margin-bottom: 10px; text-align: center; } #youtube-views-zh .data-content .title h3 { color: #ea5413; font-size: 20px; font-weight: bold; } #youtube-views-zh .data-content .title h4 { color: #000; font-size: 18px; font-weight: bold; } #youtube-views-zh .data-content .title small { color: #000; } #youtube-views-zh .data-content .info { display: flex; flex-direction: column; align-items: center; } #youtube-views-zh .data-content .info img { width: 100%; max-width: 900px; } #youtube-views-zh .data-content .info h4 { text-align: center; font-weight: bold; } #youtube-views-zh .data-content .info h4 strong { display: inline-block; margin: 7px 0; font-size: 34px; color: #ea5413; } @media (max-width: 767px) { #youtube-views-zh .data-content .info h4 strong { font-size: 24px; } } @media (max-width: 414px) { #youtube-views-zh .data-content .info h4 strong { font-size: 22px; } } /* youtube-views-zh End */ /* seo-image Start */ .seo-image { overflow-x: hidden; } .seo-image p { line-height: 32px; } .seo-image .header { padding: 0; } .seo-image .video-box { width: 100%; padding-bottom: 56%; } .seo-image .content { margin: 150px auto; } @media (max-width: 767px) { .seo-image .content { margin: 80px auto; } } .seo-image .line { width: 820px; position: absolute; top: -70px; left: 345px; } @media (max-width: 1400px) { .seo-image .line { width: 840px; top: -85px; left: 210px; } } @media (max-width: 1199px) { .seo-image .line { width: 880px; top: -90px; left: 114px; } } @media (max-width: 991px) { .seo-image .line { display: none; } } .seo-image .title { font-size: 28px; color: #f6ab1c; font-weight: bold; } @media (max-width: 991px) { .seo-image .img-item { width: 100%; max-width: 100% !important; } } .seo-image .purple-circle, .seo-image .orange-circle { width: 100%; } @media (max-width: 991px) { .seo-image .purple-circle, .seo-image .orange-circle { width: 60%; } } .seo-image .purple-circle { top: -470px; right: -100%; } @media (max-width: 991px) { .seo-image .purple-circle { top: -350px; right: -150px; } } @media (max-width: 767px) { .seo-image .purple-circle { top: -250px; right: -20px; } } .seo-image .orange-circle { top: -200px; left: -100%; } @media (max-width: 991px) { .seo-image .orange-circle { top: -30vw; left: -20vw; } } .seo-image .data-text .circle { top: -400px; right: -5vw; } @media (max-width: 991px) { .seo-image .data-text .circle { top: -250px; } } @media (max-width: 767px) { .seo-image .data-text .circle { top: -120px; } } /* seo-image End */ /* 共用 className Start */ .purple-circle, .orange-circle { position: absolute; z-index: -1; } .data-text { position: relative; } .data-text p { font-size: 28px; font-weight: bold; text-align: center; } .data-text .circle { width: 500px; z-index: -100; position: absolute; } @media (max-width: 991px) { .data-text .circle { width: 400px; } } @media (max-width: 767px) { .data-text .circle { width: 250px; } } /* 共用 className End */ /* ai-presenter Start */ .ai-presenter { margin: 100px auto; overflow: hidden; } .ai-presenter .title-item { display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; } .ai-presenter .title-item img { width: 450px; } @media (max-width: 575px) { .ai-presenter .title-item img { width: 350px; } } .ai-presenter .title-item h4 { text-align: center; margin-top: -41px; margin-left: -10px; font-weight: bold; } @media (max-width: 575px) { .ai-presenter .title-item h4 { margin-top: -34px; } } .ai-presenter .link-btn { display: inline-block; padding: 12px 35px; margin-top: 25px; font-size: 18px; font-weight: bold; border-radius: 100px; text-decoration: none; color: #fff; background: #ea5413; transition: all 0.3s; } .ai-presenter .link-btn:hover { opacity: 0.8; } .ai-presenter .usecace-list { margin-bottom: 100px; } .ai-presenter .usecace-list img { width: 100%; } .ai-presenter .usecace-list h5 { font-size: 18px; text-align: center; } .ai-presenter .usecace-list h5::before { content: ""; font-weight: bold; display: inline-block; border: 5px solid #e0c3dd; border-radius: 20px; margin-right: 10px; margin-bottom: 2px; } .ai-presenter .video-left, .ai-presenter .video-right { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; padding: 20px; background: #d8bbd9; border-radius: 20px; } .ai-presenter .video-left a, .ai-presenter .video-right a { display: flex; width: 100%; text-decoration: none; color: #000; } .ai-presenter .video-left a:hover .click-img, .ai-presenter .video-right a:hover .click-img { top: 50px; } .ai-presenter .video-left .click-img, .ai-presenter .video-right .click-img { position: absolute; width: 50px; top: 60px; right: 40px; } .ai-presenter .video-left strong, .ai-presenter .video-right strong { width: 100%; padding: 20px; font-size: 24px; text-align: center; background: #fff; border-radius: 15px 15px 0 0; } .ai-presenter .video-left .video-box, .ai-presenter .video-right .video-box { width: 100%; margin-top: 20px; padding-bottom: 45%; } .ai-presenter .video-left { background: #d8bbd9; } .ai-presenter .video-right { background: #fde3d9; } .ai-presenter .mp4-box { width: 70%; height: 0; margin: auto; padding-bottom: 45%; } .ai-presenter .mp4-box video { width: 100%; height: auto; } .ai-presenter .step-content, .ai-presenter .template-content { margin: 100px auto; position: relative; } .ai-presenter .step-content .container, .ai-presenter .template-content .container { margin-top: -38px; } .ai-presenter .step-content .bg-top, .ai-presenter .step-content .bg-bottom, .ai-presenter .template-content .bg-top, .ai-presenter .template-content .bg-bottom { width: 100%; position: absolute; z-index: -10; left: 0; right: 0; } .ai-presenter .step-content .bg-top, .ai-presenter .template-content .bg-top { top: -10px; } .ai-presenter .step-content .bg-bottom, .ai-presenter .template-content .bg-bottom { bottom: -10px; } .ai-presenter .step-content ul, .ai-presenter .template-content ul { padding: 0; list-style: none; display: flex; flex-direction: column; justify-content: center; } .ai-presenter .step-content ul li, .ai-presenter .template-content ul li { margin: 30px auto; } .ai-presenter .step-content ul li img, .ai-presenter .template-content ul li img { height: auto; width: 100%; max-width: 800px; } .ai-presenter .step-content ul li h4, .ai-presenter .template-content ul li h4 { color: #ea5413; font-weight: bold; text-align: center; line-height: 34px; } @media (max-width: 575px) { .ai-presenter .step-content ul li h4, .ai-presenter .template-content ul li h4 { font-size: 20px; } } .ai-presenter .step-content ul li .point-list, .ai-presenter .template-content ul li .point-list { list-style: decimal; } .ai-presenter .step-content ul li .point-list li, .ai-presenter .template-content ul li .point-list li { margin: 5px 45px; } @media (max-width: 575px) { .ai-presenter .step-content ul li .point-list li, .ai-presenter .template-content ul li .point-list li { margin: 5px 0 5px 20px; } } .ai-presenter .step-content .excerpt, .ai-presenter .template-content .excerpt { margin: 15px 25px 0; font-size: 18px; font-weight: bold; } .ai-presenter .step-content .excerpt::before, .ai-presenter .template-content .excerpt::before { content: ""; font-weight: bold; display: inline-block; border: 5px solid #ea5413; border-radius: 20px; margin-right: 10px; margin-bottom: 2px; } @media (max-width: 575px) { .ai-presenter .step-content .excerpt, .ai-presenter .template-content .excerpt { font-size: 16px; } } @media (max-width: 575px) { .ai-presenter .step-content .caption, .ai-presenter .template-content .caption { font-size: 15px; } } .ai-presenter .template-content table { display: table; width: 110%; height: auto; margin-left: auto; margin-top: -250px; font-weight: bold; } @media (max-width: 1199px) { .ai-presenter .template-content table { margin-top: -195px; } } @media (max-width: 991px) { .ai-presenter .template-content table { margin-top: -140px; } } @media (max-width: 767px) { .ai-presenter .template-content table { width: 86%; margin-top: 20px; margin-left: 39px; } } @media (max-width: 575px) { .ai-presenter .template-content table { margin: 20px auto 0; margin-left: auto; } } .ai-presenter .template-content table tbody { border: 1px solid #f08757; } .ai-presenter .template-content table td { text-align: center; } .ai-presenter .template-content table tr { border-style: none !important; border-bottom-width: 0px !important; } .ai-presenter .template-content .table-title { margin-top: -242px; text-align: end; } @media (max-width: 1199px) { .ai-presenter .template-content .table-title { margin-top: -185px; } } @media (max-width: 991px) { .ai-presenter .template-content .table-title { margin-top: -133px; } } @media (max-width: 767px) { .ai-presenter .template-content .table-title { margin-top: 0; text-align: start; } } .ai-presenter .template-content .table-striped > tbody > tr:nth-child(odd) > td, .ai-presenter .template-content .table-striped > tbody > tr:nth-child(odd) > th { box-shadow: none; background-color: #fdeae1; border-bottom-width: 0px !important; } .ai-presenter .template-content .table-striped > tbody > tr:nth-child(even) > td, .ai-presenter .template-content .table-striped > tbody > tr:nth-child(even) > th { border-bottom-width: 0px !important; } .ai-presenter .template-content .info img { height: auto; width: 100%; max-width: 800px; } @media (max-width: 767px) { .ai-presenter .template-content .info .img-left { padding: 0 15px; } } .ai-presenter .template-content .info .img-right { width: 107%; } @media (max-width: 767px) { .ai-presenter .template-content .info .img-right { width: 100%; } } .ai-presenter .template-content .info .img-text-left, .ai-presenter .template-content .info .img-text-right { position: absolute; top: 9%; color: #ea5413; font-size: 34px; font-weight: bold; } @media (max-width: 1199px) { .ai-presenter .template-content .info .img-text-left, .ai-presenter .template-content .info .img-text-right { top: 8%; font-size: 28px; } } @media (max-width: 991px) { .ai-presenter .template-content .info .img-text-left, .ai-presenter .template-content .info .img-text-right { font-size: 22px; } } @media (max-width: 767px) { .ai-presenter .template-content .info .img-text-left, .ai-presenter .template-content .info .img-text-right { font-size: 30px; } } @media (max-width: 575px) { .ai-presenter .template-content .info .img-text-left, .ai-presenter .template-content .info .img-text-right { font-size: 4.8vw; } } .ai-presenter .template-content .info .img-text-left { left: 31%; } @media (max-width: 1400px) { .ai-presenter .template-content .info .img-text-left { left: 28.5%; } } @media (max-width: 767px) { .ai-presenter .template-content .info .img-text-left { left: 30%; } } .ai-presenter .template-content .info .img-text-right { left: 24.5%; } @media (max-width: 1400px) { .ai-presenter .template-content .info .img-text-right { left: 20.5%; } } @media (max-width: 991px) { .ai-presenter .template-content .info .img-text-right { left: 18.5%; } } @media (max-width: 767px) { .ai-presenter .template-content .info .img-text-right { top: 13%; left: 19%; } } .ai-presenter .template-content .info .video-box { position: relative; width: 95%; height: 0; padding-bottom: 50%; margin: auto; } .ai-presenter .template-content .pageForm { margin-top: 8rem; background: #fff; } .ai-presenter .template-content .pageForm h3 { line-height: 40px; } .ai-presenter .sec-blogtab { padding-top: 50px; } .ai-presenter .terms-content { font-size: 18px; font-weight: bold; line-height: 32px; color: #6c6d70; text-align: justify; } @media (max-width: 575px) { .ai-presenter .terms-content { padding: 0 20px; } } .ai-presenter .terms-content ul { padding: 0; list-style: none; } .ai-presenter .terms-content ul li::before { content: ""; font-weight: bold; display: inline-block; border: 3px solid #ea5413; border-radius: 20px; margin-right: 10px; margin-bottom: 2px; line-height: 32px; } /* ai-presenter End */ /* sec-blogtab Start */ .sec-blogtab { padding-top: 100px; padding-bottom: 5rem; margin: 0 auto 50px; } .sec-blogtab .blogtab-title { display: inline-block; margin-bottom: 30px; padding-bottom: 7px; font-size: 30px; font-weight: bold; text-align: center; letter-spacing: 1px; border-bottom: 7px solid #ea5413; } .sec-blogtab .blog-txt { font-size: 16px; } .sec-blogtab .blog-txt p { line-height: 32px; letter-spacing: 1px; } .sec-blogtab .btn-light { margin-top: 4rem; padding: 1rem 2.5rem; transition: all 0.3s; outline: none; font-size: 16px; letter-spacing: 1px; text-decoration: none; background-color: white; border: 1px solid #ea5413; border-radius: 3rem; box-shadow: 1px 1px 5px 1px rgba(201, 201, 201, 0.637); } @media (max-width: 767px) { .sec-blogtab .blog-tabs .blog-tabs-nav { padding: 1rem 2rem 3rem; } } .sec-blogtab .blog-tabs-nav a { transition: all 0.3s; text-decoration: none; } .sec-blogtab .blog-tabs-nav a:hover { opacity: 0.8; } /* sec-blogtab End */ /* aboutus Start */ .about-header { position: relative; } .about-header img { width: 100%; height: 500px; -o-object-fit: cover; object-fit: cover; } .about-header section { width: 100%; position: absolute; top: 200px; color: #fff; } @media (max-width: 767px) { .about-header section { top: 170px; } } @media (max-width: 575px) { .about-header section { top: 120px; } } .about-header section h2 { color: #fff; font-size: 2.8rem; } @media (max-width: 575px) { .about-header section h2 { font-size: 2.2rem; } } .about-header section p { margin: auto; max-width: 900px; font-size: 18px; line-height: 32px; } @media (max-width: 767px) { .about-header section p { max-width: 515px; } } @media (max-width: 575px) { .about-header section p { font-size: 16px; max-width: 300px; } } .about-content { padding: 0; } .about-content h2 { font-size: 26px; font-weight: bold; line-height: 38px; text-align: center; color: #6d6d6d; } @media (max-width: 1199px) { .about-content h2 { font-size: 22px; } } @media (max-width: 767px) { .about-content h2 { font-size: 18px; line-height: 30px; } } @media (max-width: 575px) { .about-content h2 { font-size: 16px; } } .about-content h2 small { font-size: 20px; } @media (max-width: 767px) { .about-content h2 small { font-size: 16px; } } @media (max-width: 575px) { .about-content h2 small { font-size: 14px; line-height: 26px; } } .about-content h5 { font-size: 18px; line-height: 40px; color: #656565; } @media (max-width: 767px) { .about-content h5 { font-size: 16px; line-height: 32px; } } .about-content .line { height: 8px; width: 90px; display: block; margin: 70px auto; background-color: #e4562a; } .about-content .project-item h2 { margin-top: 20px; } .about-content .project-item img { width: 100%; height: 280px; -o-object-fit: contain; object-fit: contain; } @media (max-width: 1199px) { .about-content .project-item img { height: 220px; } } @media (max-width: 991px) { .about-content .project-item img { height: auto; } } .about-content .ai-media { margin: 60px auto 120px; } .about-content .ai-media img { width: 100%; max-width: 500px; } .about-content .ai-media .icon img { width: 70px; margin: 0 10px; transition: all 0.3s; } .about-content .ai-media .icon img:hover { opacity: 0.8; } @media (max-width: 767px) { .about-content .ai-media .icon img { width: 55px; } } .about-content .google-maps { display: block; position: relative; overflow: hidden; height: 0; padding: 0; padding-bottom: 50%; } .about-content .google-maps iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } .about-content .progress-item { opacity: 0; height: 100%; position: fixed; z-index: 100; top: 0; transition: all 0.3s; } @media (max-width: 991px) { .about-content .progress-item { display: none; } } .about-content .progress-item .cont { top: 50%; left: -235px; position: absolute; transform: rotate(90deg); } @media (max-width: 1199px) { .about-content .progress-item .cont { left: -240px; } } @media (max-width: 991px) { .about-content .progress-item .cont { left: -150px; } } .about-content .progress-item .cont #progress-bar { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 520px; color: #000; height: 2px; margin: -2px auto; } @media (max-width: 991px) { .about-content .progress-item .cont #progress-bar { margin: -1px auto; } } .about-content .progress-item .cont span { height: 15px; width: 15px; border-radius: 100%; border: 3px solid #a5a7a9; background: #a5a7a9; position: absolute; left: 0; top: 12px; cursor: pointer; transition: all 0.3s ease-in-out; } @media (max-width: 991px) { .about-content .progress-item .cont span { height: 12px; width: 12px; } } .about-content .progress-item .cont .progress-01 { left: 74.2857142857px; } .about-content .progress-item .cont .progress-02 { left: 148.5714285714px; } .about-content .progress-item .cont .progress-03 { left: 222.8571428571px; } .about-content .progress-item .cont .progress-04 { left: 297.1428571429px; } .about-content .progress-item .cont .progress-05 { left: 371.4285714286px; } .about-content .progress-item .cont .progress-06 { left: 445.7142857143px; } .about-content .progress-item .cont .progress-07 { left: 520px; } .about-content .progress-item .cont #progress-bar::-webkit-progress-value { /* Changes line color */ background: #ea5413; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .about-content .progress-item .cont #progress-bar::-webkit-progress-bar { /* Changes background color */ background: #a5a7a9; } .about-content .progress-item .cont .border-change { background: #ea5413; border-color: #ea5413; transition: all 0.3s ease-in-out; } /* aboutus End */ /* carousel Start */ .carousel-wrapper { max-width: 70vw; margin: auto; position: relative; } @media (max-width: 767px) { .carousel-wrapper { max-width: 100vw; } } .carousel-wrapper .carousel { position: relative; } .carousel-wrapper .carousel .wrapper { position: relative; background-image: url("/imgs/home/banner-01.jpg"); background-size: cover; background-repeat: no-repeat; } .carousel-wrapper .carousel .wrapper .video-wrapper { position: absolute; padding-bottom: 20%; padding-top: 25px; height: 0; width: 39%; top: 42%; left: 13%; } .carousel-wrapper .carousel .wrapper .video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .carousel-wrapper .carousel .wrapper .video-wrapper.e-win { left: 28%; padding-bottom: 25%; width: 48%; } @media (max-width: 1199px) { .carousel-wrapper .carousel .wrapper .video-wrapper.e-win { padding-bottom: 22%; width: 46%; } } @media (max-width: 575px) { .carousel-wrapper .carousel .wrapper .video-wrapper.e-win { padding-bottom: 16%; width: 40%; top: 45%; } } .carousel-wrapper .carousel .lang { position: absolute; } .carousel-wrapper .carousel .frame-item { position: absolute; top: 42%; left: 38vw; } @media (max-width: 767px) { .carousel-wrapper .carousel .frame-item { top: 5%; left: unset; right: 3vw; } } .carousel-wrapper .carousel .frame-item select { padding: 8px 20px; border-radius: 8px; } @media (max-width: 1199px) { .carousel-wrapper .carousel .frame-item select { padding: 2px 0px; } } .carousel-wrapper .carousel .toggle-video { position: absolute; top: 42%; left: 4.5vw; z-index: 100; } @media (max-width: 1199px) { .carousel-wrapper .carousel .toggle-video { top: 33%; left: 3vw; } } @media (max-width: 575px) { .carousel-wrapper .carousel .toggle-video { top: 31%; } } .carousel-wrapper .carousel .person-img { width: 25vw; position: absolute; bottom: 0; left: 43vw; z-index: 100; } @media (max-width: 767px) { .carousel-wrapper .carousel .person-img { width: 35vw; left: 57vw; } } .carousel-wrapper .carousel .player-item { top: 15vw; left: 6vw; } .carousel-wrapper .carousel .player-item, .carousel-wrapper .carousel .player-item .poster { width: 35vw; height: 20vw; } @media (max-width: 767px) { .carousel-wrapper .carousel .player-item, .carousel-wrapper .carousel .player-item .poster { width: 45vw; height: 25vw; } } @media (max-width: 767px) { .carousel-wrapper .carousel .player-item { top: 22vw; left: 10vw; } } .carousel-wrapper .carousel .player-item .poster { background-image: url("/imgs/home/video-img.png"); } .carousel-wrapper .carousel .ewin-player-item { top: 42%; right: 23%; } .carousel-wrapper .carousel .ewin-player-item, .carousel-wrapper .carousel .ewin-player-item .ewin { width: 35vw; height: 20vw; } @media (max-width: 767px) { .carousel-wrapper .carousel .ewin-player-item, .carousel-wrapper .carousel .ewin-player-item .ewin { width: 44vw; height: 25vw; } } .carousel-wrapper .carousel .ewin-player-item .ewin { background-image: url("/imgs/home/影片封面-11.webp"); } .carousel-wrapper .carousel .cts-player-item { top: 42%; right: 23%; } .carousel-wrapper .carousel .cts-player-item, .carousel-wrapper .carousel .cts-player-item .cts { width: 35vw; height: 20vw; } @media (max-width: 767px) { .carousel-wrapper .carousel .cts-player-item, .carousel-wrapper .carousel .cts-player-item .cts { width: 44vw; height: 25vw; } } .carousel-wrapper .carousel .cts-player-item .cts { background-image: url("/imgs/home/亞錦賽-08.webp"); } .carousel-wrapper .carousel .cts-player-item, .carousel-wrapper .carousel .player-item, .carousel-wrapper .carousel .ewin-player-item { position: absolute; opacity: 0; } .carousel-wrapper .carousel .cts-player-item iframe, .carousel-wrapper .carousel .player-item iframe, .carousel-wrapper .carousel .ewin-player-item iframe { width: 100%; height: 100%; } .carousel-wrapper .carousel .cts-player-item .poster, .carousel-wrapper .carousel .cts-player-item .ewin, .carousel-wrapper .carousel .cts-player-item .cts, .carousel-wrapper .carousel .player-item .poster, .carousel-wrapper .carousel .player-item .ewin, .carousel-wrapper .carousel .player-item .cts, .carousel-wrapper .carousel .ewin-player-item .poster, .carousel-wrapper .carousel .ewin-player-item .ewin, .carousel-wrapper .carousel .ewin-player-item .cts { background-size: cover; position: absolute; top: 0; left: 0; z-index: 1; cursor: pointer; } /* carousel End */ /* news-content Start */ .news-content { margin: 150px auto; } .news-content #categories { padding: 0; list-style: none; display: flex; margin-bottom: 25px; } .news-content #categories li { margin-right: 15px; } .news-content #categories button { margin-right: 10px; border: 1px solid #ea5413; border-radius: 0.5rem; background-color: #fff; transition: all 0.3s; } .news-content #categories button:hover { opacity: 0.8; } .news-content #categories button a { display: block; padding: 5px 30px; color: #ea5413; font-weight: bold; text-decoration: none; } .news-content #categories .active { background-color: #ea5413 !important; } .news-content #categories .active a { color: #fff !important; } .news-content .list { padding: 0; list-style: none; } .news-content .list a { text-decoration: none; transition: all 0.3s; } .news-content .list a:hover { opacity: 0.8; } .news-content .list li { padding: 30px 50px; border: 1px solid #cccccc; border-radius: 20px; margin-bottom: 30px; } .news-content .list li hr { height: 2px; margin: 10px 0; color: #ea5413; } .news-content .list li h2 { color: #000; font-weight: bold; text-align: center; margin-bottom: 20px; } .news-content .list li section p { font-weight: bold; } .news-content .list li section p:first-child { color: #ea5413; } .news-content .list li section p:last-child { color: #757575; } .news-content .list li .content { color: #757575; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; box-sizing: border-box; } .news-content .list li .more-btn { display: flex; justify-content: end; margin-top: 30px; } .news-content .list li .more-btn a { padding: 5px 20px; border-radius: 10px; color: #000; background-color: #e1e1e1; transition: all 0.3s; } .news-content .list li .more-btn a:hover { opacity: 0.8; } .news-main-content { margin: 75px auto; line-height: 32px; } .news-main-content h1 { position: relative; text-align: center; font-weight: bold; background: url(https://i.imgur.com/N7tVTSh.png); padding: 100px; background-position: center; background-repeat: no-repeat; background-size: cover; } @media (max-width: 767px) { .news-main-content h1 { padding: 40px 20px 60px; font-size: 24px; background-position: initial; } } .news-main-content h1::after { position: absolute; width: 6rem; height: 0.3rem; top: 75%; left: 45%; content: ""; background-color: #ea5413; } @media (max-width: 767px) { .news-main-content h1::after { height: 0.2rem; top: 83%; left: 40%; } } .news-main-content h2 { padding-left: 20px; margin: 30px 0; font-size: 1.8rem; font-weight: bold; border-left: 4px solid #ea5413; letter-spacing: 2px; } @media (max-width: 767px) { .news-main-content h2 { font-size: 1.4rem; } } .news-main-content h3 strong { letter-spacing: 2px; } .news-main-content p { font-size: 16px; margin-bottom: 50px; } .news-main-content img { width: 100%; max-width: 1050px; margin-bottom: 10px; } .news-main-content .align-text-top { width: 185px; } .news-main-content .video-box { width: 100%; padding-bottom: 56%; } .news-main-content .list-link { display: block; margin-top: 50px; text-align: center; color: #ea5413; font-weight: bold; text-decoration: none; } .news-main-content .container { max-width: 50%; } @media (max-width: 991px) { .news-main-content .container { max-width: 90%; } } .news-main-content .link-btn { display: block; padding: 6px 20px; font-size: 16px; font-weight: bold; border-radius: 100px; text-decoration: none; color: #fff; background: #ea5413; transition: all 0.3s; border: none; } .news-main-content .link-btn:hover { opacity: 0.8; } .news-main-content .link-btn a { color: #fff; text-decoration: none; } .news-form { padding: 50px; margin: 50px auto; border-radius: 10px; box-shadow: 0 2px 10px 2px rgb(222, 220, 220); } @media (max-width: 575px) { .news-form { padding: 50px 30px; } } .news-form form { margin: auto; max-width: 600px; } .news-form .title { margin-bottom: 50px; } .news-form .title h4 { margin-bottom: 10px; font-size: 32px; font-weight: bold; } .news-form .title p { margin-bottom: 30px; } .news-form .submit-btn { margin-top: 50px; } .submit-btn { padding: 5px 40px; display: inline-block; color: #fff; background-color: #ea5413; border: 1px solid #ea5413; border-radius: 5px; text-decoration: none; transition: all 0.3s; } .submit-btn:hover { opacity: 0.8; color: #fff; } /* news-content End */ .line-btn a { position: fixed; bottom: 85px; right: 15px; } .line-btn img { width: 63px; height: 63px; transition: all 0.2s ease-in-out; } .line-btn img:hover { width: 68px; height: 68px; } .embed-ai-btn { position: fixed; right: 16px; bottom: 158px; width: 100%; height: 100%; z-index: 1000; } .privacy-consent { max-width: 500px; padding: 25px 50px; display: flex; flex-direction: column; align-items: center; background-color: #fff; border-radius: 5px; box-shadow: 0 2px 10px 2px rgb(204, 204, 204); position: fixed; bottom: 25px; left: 25px; z-index: 999; } .privacy-consent a { font-weight: bold; border-bottom: 1px solid #000; transition: all 0.2s; } .privacy-consent a:hover { opacity: 0.8; } .privacy-consent button { padding: 7px 30px; display: inlinsolution-linke-block; color: #fff; border: none; border-radius: 5px; background-color: #ea5413; transition: all 0.2s; } .privacy-consent button:hover { opacity: 0.8; } .solution-accordion h2 { margin: 0; } .solution-accordion h2 button { font-weight: bold; } .solution-accordion ul { padding-left: 0; list-style: none; } .solution-accordion li, .solution-accordion p { margin-bottom: 10px; } .solution-accordion .accordion-body { padding: 20px 40px; line-height: 2; } .solution-accordion .accordion-item { margin-bottom: 30px; } .solution-accordion .accordion-button:not(.collapsed) { color: #000; background-color: transparent !important; } .solution-accordion .accordion-button:not(.collapsed)::after { filter: invert(32%) sepia(100%) saturate(1158%) hue-rotate(353deg) brightness(101%) contrast(96%); } .solution-accordion .accordion-button:focus { box-shadow: none; } .solution-accordion .accordion-item:not(:first-of-type) { border-top: 1px solid rgba(0, 0, 0, 0.125); } .ai-kiosk { margin: 10rem auto 5rem; } @media (max-width: 991px) { .ai-kiosk { margin: 5rem auto; } } .ai-kiosk .news-main-content { margin-top: 0; padding: 0 5rem; } .ai-kiosk .news-main-content h3 { font-weight: bold; margin-bottom: 2rem; } .ai-kiosk #form { position: sticky; top: 80px; } @media (max-width: 991px) { .ai-kiosk #form { width: 90vw; margin: auto; } } .ai-kiosk #form .news-form { padding: 25px 50px; margin-top: 0; } .ai-kiosk #form .news-form .title { margin-bottom: 0; } .ai-kiosk #form .news-form .title h4 { font-size: 28px; } .ai-kiosk #form .news-form .submit-btn { margin-top: 20px; } .ai-kiosk #form .form-check-input { margin-top: 0.3rem !important; }/*# sourceMappingURL=style.css.map */