{"version":3,"file":"menu-style.css","mappings":"AAAA,iBACI,YAGJ,kBACI,eAGJ,UACI,WACA,kBACA,iBACA,sBAEA,aACI,kBACA,kBAEA,qBACI,WACA,kBACA,SACA,SACA,2BACA,UACA,WACA,sBAKZ,yBACI,eAGJ,mCACI,iBAGJ,qBACI,eAEA,qCACI,aACA,QACA,2BACA,mBAEA,iDACI,WACA,YACA,yCACA,sBAKZ,+BACI,iBAGJ,wBACI,eAGJ,kCACI,iBAGJ,mCACI,aACA,uCACA,QAGJ,8BACI,YACA,sBAGJ,kCACI,kBACA,iBACA,YACA,YACA,sBAIA,8DACI,kBACA,kBACA,gBAEA,sEACI,WACA,kBACA,QACA,YACA,qBACA,MAIR,+DACI,kBACA,4BAKA,6EACI,gEAGJ,sEACI,yDAIZ,qDACI,GACI,QACA,OACA,wBAEJ,IACI,WACA,OACA,uBAEJ,IACI,WACA,OACA,WAEJ,IACI,QACA,QACA,UAEJ,KACI,QACA,QACA,WAIR,8CACI,GACI,4BAEJ,IACI,4BAEJ,IACI,wBAEJ,KACI,yBAMJ,yBACI,qBACA,4BACA,UACA,4BACA,wBACA,sDACA,yDACA,mCAKR,wBACI,GACI,UACA,4BAEJ,GACI,UACA,0BAEJ,IACI,UACA,wBAEJ,KACI,UACA,yBAMJ,yBACI,qBACA,2BACA,UACA,4BACA,wBACA,sDACA,yDACA,mCAKR,wBACI,GACI,UACA,2BAEJ,GACI,UACA,2BAEJ,IACI,UACA,wBAEJ,KACI,UACA,yBAMP,uBACC,qBACA,mBACM,sBACA,mCACA,wCAEA,sCACI,8BAGJ,uCACI,+BAKZ,0BACC,GACI,0BAEF,IACE,mCACH,4BAED,IACC,0BACA,oBAEC,KACE,2BAIL,2BACC,GACI,0BAEF,IACE,mCACH,4BAEC,KACK,2BAIR,wBACI,eAEA,oFACI,yBACA,iBAGJ,sDACI,YAIR,eACI,aACA,iBAGJ,4BACI,gBACA,iBAGJ,8BACI,aACA,mBAEA,sDACI,S","sources":["webpack://tantive-text-effects/./src/css/menu-style.scss"],"sourcesContent":[".ttef-usage-wrap {\r\n    padding: 1em;\r\n}\r\n\r\n.ttef-section-toc {\r\n    margin-top: 2em;\r\n}\r\n\r\n.ttef-toc {\r\n    width: 20em;\r\n    padding-right: 1em;\r\n    padding-left: 1em;\r\n    border: 1px solid #ccc;\r\n\r\n    h2 {\r\n        position: relative;\r\n        text-align: center;\r\n\r\n        &::before {\r\n            content: \"\";\r\n            position: absolute;\r\n            bottom: 0;\r\n            left: 50%;\r\n            transform: translateX(-50%);\r\n            width: 50%;\r\n            height: 2px;\r\n            background-color: #ccc;\r\n        }\r\n    }\r\n}\r\n\r\n.ttef-section-basicUsage {\r\n    margin-top: 2em;\r\n}\r\n\r\n.ttef-section-basicUsage--contents {\r\n    padding-left: 2em;\r\n}\r\n\r\n.ttef-section-notice {\r\n    margin-top: 2em;\r\n\r\n    .hasDisplayFlex {\r\n        display: flex;\r\n        gap: 2em;\r\n        justify-content: flex-start;\r\n        align-items: center;\r\n\r\n        .ttef-arrow {\r\n            width: 30px;\r\n            height: 30px;\r\n            clip-path: polygon(0 0, 100% 50%, 0 200%);\r\n            background-color: #ccc;\r\n        }\r\n    }\r\n}\r\n\r\n.ttef-section-notice--contents {\r\n    padding-left: 2em;\r\n}\r\n\r\n.ttef-section-catalogue {\r\n    margin-top: 2em;\r\n}\r\n\r\n.ttef-section-catalogue--contents {\r\n    padding-left: 2em;\r\n}\r\n\r\n.ttef-section-catalogue__container {\r\n    display: grid;\r\n    grid-template-columns: repeat(3, 200px);\r\n    gap: 1em;\r\n}\r\n\r\n.ttef-section-catalogue__item {\r\n    padding: 1em;\r\n    border: 1px solid #ccc;\r\n}\r\n\r\n.ttef-section-catalogue__playArea {\r\n    margin-right: auto;\r\n    margin-left: auto;\r\n    padding: 1em;\r\n    height: 75px;\r\n    background-color: white;\r\n}\r\n\r\n.animSquareSlideInFromLeft {\r\n    .animSquareSlideInFromLeft__Square {\r\n        position: relative;\r\n        width: fit-content;\r\n        overflow: hidden;\r\n        \r\n        &::before {\r\n            content: \"\";\r\n            position: absolute;\r\n            width: 0;\r\n            height: 100%;\r\n            background-color: red;\r\n            top: 0;\r\n        }\r\n    }\r\n\r\n    .animSquareSlideInFromLeft__content {\r\n        width: fit-content;\r\n        transform: translateX(-100%);\r\n    }\r\n}\r\n\r\n.ttef-section-catalogue__playArea {\r\n        .animSquareSlideInFromLeft__Square::before {\r\n            animation: animSquareSlideInFromLeft__square--before 2s infinite;\r\n        }\r\n\r\n        .animSquareSlideInFromLeft__content {\r\n            animation: animSquareSlideInFromLeft__content 2s infinite;\r\n        }\r\n}\r\n\r\n@keyframes animSquareSlideInFromLeft__square--before {\r\n    0% {\r\n        width: 0;\r\n        left: 0;\r\n        transform: translateX(0);\r\n    }\r\n    16% {\r\n        width: 100%;\r\n        left: 0;\r\n        transform: translatX(0);\r\n    }\r\n    40% {\r\n        width: 100%;\r\n        left: 0;\r\n        right: 100%;\r\n    }\r\n    50% {\r\n        width: 0;\r\n        right: 0;\r\n        left: 100%;\r\n    }\r\n    100% {\r\n        width: 0;\r\n        right: 0;\r\n        left: 100%;\r\n    }\r\n}\r\n\r\n@keyframes animSquareSlideInFromLeft__content {\r\n    0% {\r\n        transform: translateX(-100%);\r\n    }\r\n    40% {\r\n        transform: translateX(-100%);\r\n    }\r\n    50% {\r\n        transform: translateX(0);\r\n    }\r\n    100% {\r\n        transform: translateX(0);\r\n    }\r\n}\r\n\r\n.animWavyDrop {\r\n\r\n    .tteLetter {\r\n        display: inline-block;\r\n        transform: translateY(-100%);\r\n        opacity: 0;\r\n        animation-name: animWavyDrop;\r\n        animation-duration: 7.5s;\r\n        animation-delay: calc(0.1s * var(--animWavyDropDuration));\r\n        animation-timing-function:cubic-bezier(.42,0,.33,1);\r\n        animation-iteration-count: infinite;\r\n    }\r\n    \r\n}\r\n  \r\n@keyframes animWavyDrop {\r\n    0% {\r\n        opacity: 0;\r\n        transform: translateY(-100%);\r\n    }\r\n    5% {\r\n        opacity: 1;\r\n        transform: translateY(30%);\r\n    }\r\n    10% {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n    100% {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n.animWavyRise {\r\n\r\n    .tteLetter {\r\n        display: inline-block;\r\n        transform: translateY(100%);\r\n        opacity: 0;\r\n        animation-name: animWavyRise;\r\n        animation-duration: 7.5s;\r\n        animation-delay: calc(0.1s * var(--animWavyRiseDuration));\r\n        animation-timing-function:cubic-bezier(.42,0,.33,1);\r\n        animation-iteration-count: infinite;\r\n    }\r\n    \r\n}\r\n  \r\n@keyframes animWavyRise {\r\n    0% {\r\n        opacity: 0;\r\n        transform: translateY(100%);\r\n    }\r\n    5% {\r\n        opacity: 1;\r\n        transform: translateY(-30%);\r\n    }\r\n    10% {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n    100% {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n    }\r\n}\r\n\r\n.animPopOut {\r\n\t\r\n\t.tteLetter {\r\n\t\tdisplay: inline-block;\r\n\t\tmargin-right: 0.25em;\r\n        animation-duration: 2s;\r\n        animation-iteration-count: infinite;\r\n        animation-timing-function: steps(1, end);\r\n\r\n        &:nth-child(odd) {\r\n            animation-name: animPopOut-odd;\r\n        }\r\n    \r\n        &:nth-child(even) {\r\n            animation-name: animPopOut-even;\r\n        }\r\n\t}\r\n}\r\n\r\n@keyframes animPopOut-odd {\r\n\t0% {\r\n    \ttransform: translate(0, 0);\r\n  \t}\r\n  \t25% {\r\n    \ttransform: translate(0.1em, -0.1em);\r\n\t\ttext-shadow: -0.1em 0.1em red;\r\n  \t}\r\n\t75% {\r\n\t\ttransform: translate(0, 0);\r\n\t\ttext-shadow: 0 0  red;\r\n\t}\r\n  \t100% {\r\n    \ttransform: translate(0, 0);\r\n  \t}\r\n}\r\n\r\n@keyframes animPopOut-even {\r\n\t0% {\r\n    \ttransform: translate(0, 0);\r\n  \t}\r\n  \t50% {\r\n    \ttransform: translate(0.1em, -0.1em);\r\n\t\ttext-shadow: -0.1em 0.1em red;\r\n  \t}\r\n  \t100% {\r\n        transform: translate(0, 0);\r\n  \t}\r\n}\r\n\r\n.ttef-section-setttings {\r\n    margin-top: 2em;\r\n\r\n    table, td, th {\r\n        border-collapse: collapse;\r\n        border: 1px solid;\r\n    }\r\n\r\n    td, th {\r\n        padding: 1em;\r\n    }\r\n}\r\n\r\n.tteSettingBox {\r\n    display: flex;\r\n    padding-left: 2em;\r\n}\r\n\r\n.tteSettingsContents--title {\r\n    margin-left: 1em;\r\n    margin-right: 1em;\r\n}\r\n\r\n.tteSettingsContents--content {\r\n    display: flex;\r\n    align-items: center;\r\n\r\n    .wp-color-result.button {\r\n        margin: 0;\r\n    }\r\n}\r\n"],"names":[],"sourceRoot":""}