CINXE.COM

<!doctype html><html amp lang="ja" i-amphtml-binding i-amphtml-layout i-amphtml-no-boilerplate transformed="self;v=1"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width"><link rel="preload" href="/static/fonts/poppins-v5-latin-700.woff2" as="font" crossorigin><link rel="preload" href="/static/fonts/noto-sans-v7-latin-700.woff2" as="font" crossorigin><meta name="theme-color" content="#005af0"><meta name="robots" content="noindex,follow"><meta name="description" content="Each component reference page provides detailed information on how to integrate."><meta name="twitter:card" content="summary_large_image"><meta name="twitter:description" content="Each component reference page provides detailed information on how to integrate."><meta name="twitter:title" content="Components"><meta name="twitter:creator" content="@ampproject"><meta name="twitter:site" content="@ampproject"><meta name="twitter:image" content="https://amp.dev/static/img/sharing/docs-component-600x314.png"><meta property="og:title" content="Components"><meta property="og:url" content="https://amp.dev/ja/documentation/components/"><meta property="og:image" content="https://amp.dev/static/img/sharing/docs-component-600x314.png"><meta property="og:image:width" content="600"><meta property="og:image:height" content="314"><meta name="supported-amp-formats" content="websites,stories,ads,email"><meta name="page-locale" content="ja"><meta http-equiv="origin-trial" content="AviuuiVhVdQ3GpVtxSpyMT+XsL/qGGYmyiyLvYSKPL3rRDLipe/ard5x+DXVlrATtolwX75VtpSKc9IEzLDd4AkAAABmeyJvcmlnaW4iOiJodHRwczovL2FtcC5kZXY6NDQzIiwiZmVhdHVyZSI6IkV4cGVyaW1lbnRhbEF1dG9wbGF5RHluYW1pY0RlbGVnYXRpb24iLCJleHBpcnkiOjE1NzA1Nzg0NDF9"><style amp-runtime i-amphtml-version="012406131415000">html{overflow-x:hidden!important}html.i-amphtml-fie{height:100%!important;width:100%!important}html:not([amp4ads]),html:not([amp4ads]) body{height:auto!important}html:not([amp4ads]) body{margin:0!important}body{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}html.i-amphtml-singledoc.i-amphtml-embedded{-ms-touch-action:pan-y pinch-zoom;touch-action:pan-y pinch-zoom}html.i-amphtml-fie>body,html.i-amphtml-singledoc>body{overflow:visible!important}html.i-amphtml-fie:not(.i-amphtml-inabox)>body,html.i-amphtml-singledoc:not(.i-amphtml-inabox)>body{position:relative!important}html.i-amphtml-ios-embed-legacy>body{overflow-x:hidden!important;overflow-y:auto!important;position:absolute!important}html.i-amphtml-ios-embed{overflow-y:auto!important;position:static}#i-amphtml-wrapper{overflow-x:hidden!important;overflow-y:auto!important;position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;margin:0!important;display:block!important}html.i-amphtml-ios-embed.i-amphtml-ios-overscroll,html.i-amphtml-ios-embed.i-amphtml-ios-overscroll>#i-amphtml-wrapper{-webkit-overflow-scrolling:touch!important}#i-amphtml-wrapper>body{position:relative!important;border-top:1px solid transparent!important}#i-amphtml-wrapper+body{visibility:visible}#i-amphtml-wrapper+body .i-amphtml-lightbox-element,#i-amphtml-wrapper+body[i-amphtml-lightbox]{visibility:hidden}#i-amphtml-wrapper+body[i-amphtml-lightbox] .i-amphtml-lightbox-element{visibility:visible}#i-amphtml-wrapper.i-amphtml-scroll-disabled,.i-amphtml-scroll-disabled{overflow-x:hidden!important;overflow-y:hidden!important}amp-instagram{padding:54px 0px 0px!important;background-color:#fff}amp-iframe iframe{box-sizing:border-box!important}[amp-access][amp-access-hide]{display:none}[subscriptions-dialog],body:not(.i-amphtml-subs-ready) [subscriptions-action],body:not(.i-amphtml-subs-ready) [subscriptions-section]{display:none!important}amp-experiment,amp-live-list>[update]{display:none}amp-list[resizable-children]>.i-amphtml-loading-container.amp-hidden{display:none!important}amp-list [fetch-error],amp-list[load-more] [load-more-button],amp-list[load-more] [load-more-end],amp-list[load-more] [load-more-failed],amp-list[load-more] [load-more-loading]{display:none}amp-list[diffable] div[role=list]{display:block}amp-story-page,amp-story[standalone]{min-height:1px!important;display:block!important;height:100%!important;margin:0!important;padding:0!important;overflow:hidden!important;width:100%!important}amp-story[standalone]{background-color:#000!important;position:relative!important}amp-story-page{background-color:#757575}amp-story .amp-active>div,amp-story .i-amphtml-loader-background{display:none!important}amp-story-page:not(:first-of-type):not([distance]):not([active]){transform:translateY(1000vh)!important}amp-autocomplete{position:relative!important;display:inline-block!important}amp-autocomplete>input,amp-autocomplete>textarea{padding:0.5rem;border:1px solid rgba(0,0,0,.33)}.i-amphtml-autocomplete-results,amp-autocomplete>input,amp-autocomplete>textarea{font-size:1rem;line-height:1.5rem}[amp-fx^=fly-in]{visibility:hidden}amp-script[nodom],amp-script[sandboxed]{position:fixed!important;top:0!important;width:1px!important;height:1px!important;overflow:hidden!important;visibility:hidden} /*# sourceURL=/css/ampdoc.css*/[hidden]{display:none!important}.i-amphtml-element{display:inline-block}.i-amphtml-blurry-placeholder{transition:opacity 0.3s cubic-bezier(0.0,0.0,0.2,1)!important;pointer-events:none}[layout=nodisplay]:not(.i-amphtml-element){display:none!important}.i-amphtml-layout-fixed,[layout=fixed][width][height]:not(.i-amphtml-layout-fixed){display:inline-block;position:relative}.i-amphtml-layout-responsive,[layout=responsive][width][height]:not(.i-amphtml-layout-responsive),[width][height][heights]:not([layout]):not(.i-amphtml-layout-responsive),[width][height][sizes]:not(img):not([layout]):not(.i-amphtml-layout-responsive){display:block;position:relative}.i-amphtml-layout-intrinsic,[layout=intrinsic][width][height]:not(.i-amphtml-layout-intrinsic){display:inline-block;position:relative;max-width:100%}.i-amphtml-layout-intrinsic .i-amphtml-sizer{max-width:100%}.i-amphtml-intrinsic-sizer{max-width:100%;display:block!important}.i-amphtml-layout-container,.i-amphtml-layout-fixed-height,[layout=container],[layout=fixed-height][height]:not(.i-amphtml-layout-fixed-height){display:block;position:relative}.i-amphtml-layout-fill,.i-amphtml-layout-fill.i-amphtml-notbuilt,[layout=fill]:not(.i-amphtml-layout-fill),body noscript>*{display:block;overflow:hidden!important;position:absolute;top:0;left:0;bottom:0;right:0}body noscript>*{position:absolute!important;width:100%;height:100%;z-index:2}body noscript{display:inline!important}.i-amphtml-layout-flex-item,[layout=flex-item]:not(.i-amphtml-layout-flex-item){display:block;position:relative;-ms-flex:1 1 auto;flex:1 1 auto}.i-amphtml-layout-fluid{position:relative}.i-amphtml-layout-size-defined{overflow:hidden!important}.i-amphtml-layout-awaiting-size{position:absolute!important;top:auto!important;bottom:auto!important}i-amphtml-sizer{display:block!important}@supports (aspect-ratio:1/1){i-amphtml-sizer.i-amphtml-disable-ar{display:none!important}}.i-amphtml-blurry-placeholder,.i-amphtml-fill-content{display:block;height:0;max-height:100%;max-width:100%;min-height:100%;min-width:100%;width:0;margin:auto}.i-amphtml-layout-size-defined .i-amphtml-fill-content{position:absolute;top:0;left:0;bottom:0;right:0}.i-amphtml-replaced-content,.i-amphtml-screen-reader{padding:0!important;border:none!important}.i-amphtml-screen-reader{position:fixed!important;top:0px!important;left:0px!important;width:4px!important;height:4px!important;opacity:0!important;overflow:hidden!important;margin:0!important;display:block!important;visibility:visible!important}.i-amphtml-screen-reader~.i-amphtml-screen-reader{left:8px!important}.i-amphtml-screen-reader~.i-amphtml-screen-reader~.i-amphtml-screen-reader{left:12px!important}.i-amphtml-screen-reader~.i-amphtml-screen-reader~.i-amphtml-screen-reader~.i-amphtml-screen-reader{left:16px!important}.i-amphtml-unresolved{position:relative;overflow:hidden!important}.i-amphtml-select-disabled{-webkit-user-select:none!important;-ms-user-select:none!important;user-select:none!important}.i-amphtml-notbuilt,[layout]:not(.i-amphtml-element),[width][height][heights]:not([layout]):not(.i-amphtml-element),[width][height][sizes]:not(img):not([layout]):not(.i-amphtml-element){position:relative;overflow:hidden!important;color:transparent!important}.i-amphtml-notbuilt:not(.i-amphtml-layout-container)>*,[layout]:not([layout=container]):not(.i-amphtml-element)>*,[width][height][heights]:not([layout]):not(.i-amphtml-element)>*,[width][height][sizes]:not([layout]):not(.i-amphtml-element)>*{display:none}amp-img:not(.i-amphtml-element)[i-amphtml-ssr]>img.i-amphtml-fill-content{display:block}.i-amphtml-notbuilt:not(.i-amphtml-layout-container),[layout]:not([layout=container]):not(.i-amphtml-element),[width][height][heights]:not([layout]):not(.i-amphtml-element),[width][height][sizes]:not(img):not([layout]):not(.i-amphtml-element){color:transparent!important;line-height:0!important}.i-amphtml-ghost{visibility:hidden!important}.i-amphtml-element>[placeholder],[layout]:not(.i-amphtml-element)>[placeholder],[width][height][heights]:not([layout]):not(.i-amphtml-element)>[placeholder],[width][height][sizes]:not([layout]):not(.i-amphtml-element)>[placeholder]{display:block;line-height:normal}.i-amphtml-element>[placeholder].amp-hidden,.i-amphtml-element>[placeholder].hidden{visibility:hidden}.i-amphtml-element:not(.amp-notsupported)>[fallback],.i-amphtml-layout-container>[placeholder].amp-hidden,.i-amphtml-layout-container>[placeholder].hidden{display:none}.i-amphtml-layout-size-defined>[fallback],.i-amphtml-layout-size-defined>[placeholder]{position:absolute!important;top:0!important;left:0!important;right:0!important;bottom:0!important;z-index:1}amp-img[i-amphtml-ssr]:not(.i-amphtml-element)>[placeholder]{z-index:auto}.i-amphtml-notbuilt>[placeholder]{display:block!important}.i-amphtml-hidden-by-media-query{display:none!important}.i-amphtml-element-error{background:red!important;color:#fff!important;position:relative!important}.i-amphtml-element-error:before{content:attr(error-message)}i-amp-scroll-container,i-amphtml-scroll-container{position:absolute;top:0;left:0;right:0;bottom:0;display:block}i-amp-scroll-container.amp-active,i-amphtml-scroll-container.amp-active{overflow:auto;-webkit-overflow-scrolling:touch}.i-amphtml-loading-container{display:block!important;pointer-events:none;z-index:1}.i-amphtml-notbuilt>.i-amphtml-loading-container{display:block!important}.i-amphtml-loading-container.amp-hidden{visibility:hidden}.i-amphtml-element>[overflow]{cursor:pointer;position:relative;z-index:2;visibility:hidden;display:initial;line-height:normal}.i-amphtml-layout-size-defined>[overflow]{position:absolute}.i-amphtml-element>[overflow].amp-visible{visibility:visible}template{display:none!important}.amp-border-box,.amp-border-box *,.amp-border-box :after,.amp-border-box :before{box-sizing:border-box}amp-pixel{display:none!important}amp-analytics,amp-auto-ads,amp-story-auto-ads{position:fixed!important;top:0!important;width:1px!important;height:1px!important;overflow:hidden!important;visibility:hidden}amp-story{visibility:hidden!important}html.i-amphtml-fie>amp-analytics{position:initial!important}[visible-when-invalid]:not(.visible),form [submit-error],form [submit-success],form [submitting]{display:none}amp-accordion{display:block!important}@media (min-width:1px){:where(amp-accordion>section)>:first-child{margin:0;background-color:#efefef;padding-right:20px;border:1px solid #dfdfdf}:where(amp-accordion>section)>:last-child{margin:0}}amp-accordion>section{float:none!important}amp-accordion>section>*{float:none!important;display:block!important;overflow:hidden!important;position:relative!important}amp-accordion,amp-accordion>section{margin:0}amp-accordion:not(.i-amphtml-built)>section>:last-child{display:none!important}amp-accordion:not(.i-amphtml-built)>section[expanded]>:last-child{display:block!important} /*# sourceURL=/css/ampshared.css*/</style><script async src="https://cdn.ampproject.org/v0.mjs" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0.js" crossorigin="anonymous"></script><script async src="https://cdn.ampproject.org/v0/amp-analytics-0.1.mjs" custom-element="amp-analytics" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js" crossorigin="anonymous" custom-element="amp-analytics"></script><script async src="https://cdn.ampproject.org/v0/amp-animation-0.1.mjs" custom-element="amp-animation" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-animation-0.1.js" crossorigin="anonymous" custom-element="amp-animation"></script><script async src="https://cdn.ampproject.org/v0/amp-bind-0.1.mjs" custom-element="amp-bind" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-bind-0.1.js" crossorigin="anonymous" custom-element="amp-bind"></script><script async src="https://cdn.ampproject.org/v0/amp-consent-0.1.mjs" custom-element="amp-consent" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-consent-0.1.js" crossorigin="anonymous" custom-element="amp-consent"></script><script async src="https://cdn.ampproject.org/v0/amp-geo-0.1.mjs" custom-element="amp-geo" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-geo-0.1.js" crossorigin="anonymous" custom-element="amp-geo"></script><script async src="https://cdn.ampproject.org/v0/amp-install-serviceworker-0.1.mjs" custom-element="amp-install-serviceworker" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-install-serviceworker-0.1.js" crossorigin="anonymous" custom-element="amp-install-serviceworker"></script><script async src="https://cdn.ampproject.org/v0/amp-position-observer-0.1.mjs" custom-element="amp-position-observer" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-position-observer-0.1.js" crossorigin="anonymous" custom-element="amp-position-observer"></script><script async src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.mjs" custom-element="amp-sidebar" type="module" crossorigin="anonymous"></script><script async nomodule src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js" crossorigin="anonymous" custom-element="amp-sidebar"></script><link rel="shortcut icon" href="/static/img/favicon.png"><link rel="canonical" href="https://amp.dev/ja/documentation/components/"><link rel="alternate" hreflang="x-default" href="https://amp.dev/documentation/components/"><title>Components - amp.dev</title><script type="application/ld+json">{"@context":"http://schema.org","@type":"Webpage","url":"https://amp.dev/ja/documentation/components/ ","name":"amp.dev","headline":"Components","description":"Each component reference page provides detailed information on how to integrate.","mainEntityOfPage":{"@type":"WebPage","@id":"https://amp.dev"},"publisher":{"@type":"Organization","name":"AMP Project","logo":{"url":"https://amp.dev/static/img/icons/icon-512x512.png","width":512,"height":512,"@type":"ImageObject"}},"image":{"@type":"ImageObject","url":"https://amp.dev/static/img/sharing/docs-component-600x314.png","width":600,"height":314}}</script><style amp-custom>@font-face{font-family:system;font-style:normal;font-weight:300;src:local(".SFNSText-Light"),local(".HelveticaNeueDeskInterface-Light"),local(".LucidaGrandeUI"),local("Ubuntu Light"),local("Segoe UI Light"),local("Roboto-Light"),local("DroidSans"),local("Tahoma")}@font-face{font-family:system;font-style:italic;font-weight:300;src:local(".SFNSText-LightItalic"),local(".HelveticaNeueDeskInterface-Italic"),local(".LucidaGrandeUI"),local("Ubuntu Light Italic"),local("Segoe UI Light Italic"),local("Roboto-LightItalic"),local("DroidSans"),local("Tahoma")}@font-face{font-family:system;font-style:normal;font-weight:400;src:local(".SFNSText-Regular"),local(".HelveticaNeueDeskInterface-Regular"),local(".LucidaGrandeUI"),local("Ubuntu"),local("Segoe UI"),local("Roboto-Regular"),local("DroidSans"),local("Tahoma")}@font-face{font-family:system;font-style:italic;font-weight:400;src:local(".SFNSText-Italic"),local(".HelveticaNeueDeskInterface-Italic"),local(".LucidaGrandeUI"),local("Ubuntu Italic"),local("Segoe UI Italic"),local("Roboto-Italic"),local("DroidSans"),local("Tahoma")}@font-face{font-family:system;font-style:normal;font-weight:500;src:local(".SFNSText-Medium"),local(".HelveticaNeueDeskInterface-MediumP4"),local(".LucidaGrandeUI"),local("Ubuntu Medium"),local("Segoe UI Semibold"),local("Roboto-Medium"),local("DroidSans-Bold"),local("Tahoma Bold")}@font-face{font-family:system;font-style:italic;font-weight:500;src:local(".SFNSText-MediumItalic"),local(".HelveticaNeueDeskInterface-MediumItalicP4"),local(".LucidaGrandeUI"),local("Ubuntu Medium Italic"),local("Segoe UI Semibold Italic"),local("Roboto-MediumItalic"),local("DroidSans-Bold"),local("Tahoma Bold")}@font-face{font-family:system;font-style:normal;font-weight:700;src:local(".SFNSText-Bold"),local(".HelveticaNeueDeskInterface-Bold"),local(".LucidaGrandeUI"),local("Ubuntu Bold"),local("Roboto-Bold"),local("DroidSans-Bold"),local("Segoe UI Bold"),local("Tahoma Bold")}@font-face{font-family:system;font-style:italic;font-weight:700;src:local(".SFNSText-BoldItalic"),local(".HelveticaNeueDeskInterface-BoldItalic"),local(".LucidaGrandeUI"),local("Ubuntu Bold Italic"),local("Roboto-BoldItalic"),local("DroidSans-Bold"),local("Segoe UI Bold Italic"),local("Tahoma Bold")}@font-face{font-family:Noto Sans;font-style:normal;font-weight:400;font-display:optional;src:local("Noto Sans"),local("NotoSans"),url(https://amp.dev/static/fonts/noto-sans-v7-latin-regular.woff2) format("woff2"),url(https://amp.dev/static/fonts/noto-sans-v7-latin-regular.woff) format("woff")}@font-face{font-family:Noto Sans;font-style:normal;font-weight:700;font-display:optional;src:local("Noto Sans Bold"),local("NotoSans-Bold"),url(https://amp.dev/static/fonts/noto-sans-v7-latin-700.woff2) format("woff2"),url(https://amp.dev/static/fonts/noto-sans-v7-latin-700.woff) format("woff")}@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:optional;src:local("Poppins Bold"),local("Poppins-Bold"),url(https://amp.dev/static/fonts/poppins-v5-latin-700.woff2) format("woff2"),url(https://amp.dev/static/fonts/poppins-v5-latin-700.woff) format("woff")}@font-face{font-family:Fira Mono;font-style:normal;font-weight:400;font-display:optional;src:local("Fira Mono"),local("FiraMono"),url(https://amp.dev/static/fonts/fira-mono-v7-latin-500.woff2) format("woff2"),url(https://amp.dev/static/fonts/fira-mono-v7-latin-500.woff) format("woff")}*{box-sizing:border-box}body,html{padding:0;margin:0;min-width:240px;color:#48525c;background-color:#fff;font-size:16px;font-family:Noto Sans,system;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;touch-action:manipulation}@media(max-width:240px){body,html{font-size:14px}}body>*>:not(.ap-o-code-preview)>*>.amp-carousel-button{width:3em;height:3em;border-radius:50%;box-shadow:0 10px 15px 0 rgba(0,0,0,.4);transition:.4s;background-color:#fff;position:relative;box-sizing:border-box;margin:1em;border-style:none;background-position:50% 50%;background-repeat:no-repeat;z-index:10;pointer-events:all}body>*>:not(.ap-o-code-preview)>*>.amp-carousel-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23005AF0'%3E%3Cpath d='M15 8.25H5.87l4.19-4.19L9 3 3 9l6 6 1.06-1.06-4.19-4.19H15v-1.5z'/%3E%3C/svg%3E")}body>*>:not(.ap-o-code-preview)>*>.amp-carousel-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23005AF0' %3E%3Cpath d='M9 3L7.94 4.06l4.19 4.19H3v1.5h9.13l-4.19 4.19L9 15l6-6z'/%3E%3C/svg%3E")}body>*>:not(.ap-o-code-preview)>*>.amp-carousel-button:hover{cursor:pointer;box-shadow:0 20px 30px 0 rgba(0,0,0,.2);background-color:#fff}:target:before{content:"";display:block;visibility:hidden;height:120px;margin-top:-120px}@media(min-width:1024px){h1:target:before{height:75px;margin-top:-75px}h2:target:before{height:81px;margin-top:-81px}h3:target:before{height:87px;margin-top:-87px}h4:target:before{height:90px;margin-top:-90px}h5:target:before{height:93px;margin-top:-93px}h6:target:before{height:97px;margin-top:-97px}}h1,h2,h3,h4,h5{margin-top:1.5rem;margin-bottom:.75em;font-family:Poppins,system;font-weight:700;line-height:1.2em;color:#20202a}h1{font-size:2.2rem;margin-top:3rem}section.-t h1:first-of-type{margin-top:0}@media(min-width:768px){section.-t h1:first-of-type{margin-bottom:2rem}}h2{font-size:1.8rem;margin-top:2rem}h3{font-size:1.414rem;margin-top:1.8rem}h4{font-size:1.2rem}h5{font-size:1rem}.-t .intro,.ap--section .intro{font-size:1rem;padding:0}.-t .intro *,.ap--section .intro *{font-size:inherit}.-t p,.ap--section p{line-height:1.6rem;font-weight:400;color:#48525c;display:block;margin-top:1.1em;margin-bottom:0;font-size:1rem}.-t p small,.ap--section p small{font-size:.875rem}.-t code,.ap--section code{display:inline;padding:2px 4px;font-family:Fira Mono,monospace;font-weight:500;word-break:normal;color:#000;background-color:#e2e5e6;font-size:.9em}.-t code,.-t p,.ap--section code,.ap--section p{overflow-wrap:break-word}.-t a,.ap--section a{position:relative;z-index:10}.-t a code,.ap--section a code{color:#005af0;z-index:-1}.-t pre,.ap--section pre{font-family:Fira Mono,monospace;font-weight:500;font-size:1rem;white-space:pre-wrap}.-t>ol,.-t>ul,.ap--section>ol,.ap--section>ul{line-height:1.6rem;font-weight:400;color:#48525c;display:block;padding-left:2em;margin:1.5em 0}.-t>ol ol,.-t>ol ul,.-t>ul ol,.-t>ul ul,.ap--section>ol ol,.ap--section>ol ul,.ap--section>ul ol,.ap--section>ul ul{padding-left:2em;margin:0}.-t>ol li,.-t>ul li,.ap--section>ol li,.ap--section>ul li{padding-left:.5em}.-t>ol li p,.-t>ul li p,.ap--section>ol li p,.ap--section>ul li p{font-size:1em}.-t figure figcaption,.ap--section figure figcaption{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.8125rem;margin-top:.3em}.-t hr,.ap--section hr{height:1px;margin:.75em 0;background-color:#ebebf0;border:none}.-n{display:flex;align-items:center;text-decoration:none;padding:0 0 1.5em;margin:0}.-r{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;font-weight:700;color:#005af0;line-height:1.3;transition:transform .3s ease}.-i{fill:#005af0;padding:.438em 0;margin-bottom:auto;margin-right:.625em;box-sizing:initial;transition:transform .3s ease}.-n:hover .-i,.-n:hover .-r{transform:translateX(10px)}.-s{border-bottom:1px solid #ebebf0}.-s .-r{font-size:1rem;font-family:Poppins,system;font-weight:700;color:#000;padding-left:10px}.-s .-i{width:1.375em;height:1.375em;fill:#fff;background-color:#005af0;overflow:hidden;padding:.563em}.-s .-i,.-s:hover .-i{box-shadow:0 10px 20px 0 rgba(0,0,0,.25)}.-s:hover .-i svg{animation:duepduep .3s ease}a{font-weight:700;text-decoration:none;color:#005af0}a code{display:inline;padding:2px 4px;font-family:Fira Mono,monospace;font-weight:500;word-break:normal;color:#000;background-color:#e2e5e6;font-size:.9em;color:#005af0}.ap-a-ico{display:flex;font-size:medium;box-sizing:initial;justify-content:center;width:1em;height:1em}.ap-a-btn{font-family:Poppins,system;font-weight:700;line-height:1.2em;color:#20202a;font-size:1em;color:#fff;display:inline-block;max-width:100%;width:auto;height:auto;padding:.75em 1.75em;margin:0;text-decoration:none;text-align:center;border-radius:3px;background-color:#005af0;border:none;cursor:pointer;box-shadow:0 15px 35px -5px rgba(0,0,0,.25);transition:transform .3s ease,box-shadow .3s ease}.ap-a-btn:hover{transform:translateY(-.125em);box-shadow:0 25px 20px -15px rgba(0,0,0,.15)}@media(min-width:768px){.ap-a-btn{padding:1em 2em}}.-o{right:20px;left:auto;bottom:20px;width:calc(100% - 40px);padding:15px;line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;background-color:#fff;box-shadow:0 15px 30px 0 rgba(0,0,0,.15);border-radius:8px}@media(min-width:768px){.-o{max-width:500px}}.-u{position:absolute;right:15px;top:15px;-webkit-appearance:none;background-color:transparent;border:none;padding:0}.-u svg{width:10px;height:10px}.-o button{cursor:pointer}.ap-o-translation-hint{position:fixed;z-index:100;width:100%;left:0;bottom:0}@media(max-width:767px){.ap-o-translation-hint{display:none}}.ap-o-translation-hint-wrapper{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;max-width:1440px;margin:0 auto;padding:1em 30px;background-color:#fff;border-top:5px solid #ffdc00;box-shadow:0 -2px 10px 0 rgba(0,0,0,.07)}.ap-o-translation-hint-link{display:inline-block}.-av+.ap-o-translation-hint{bottom:25px}.ap--footer{position:relative;z-index:15;padding:3em 0 2em;line-height:1.6rem;font-weight:400;color:#48525c;font-size:1rem;color:#fff;background:linear-gradient(45deg,#48525c,#20202a)}.-a{width:100%;max-width:1440px;padding:0 20px;margin:0 auto}.-f{padding-bottom:4em}@media(min-width:768px){.-f{display:flex;align-items:center}}.-l{display:flex;flex-direction:column;margin-left:auto}@media(min-width:1024px){.-l{flex-direction:row}}.-c{margin:3em 2em 1em 0;color:#fff}@media(min-width:768px){.-c{margin:auto 2em auto 1em}}.-h{display:flex;list-style:none;padding:0;margin:0}.-p{flex:1 0 auto}@media(min-width:768px){.-p{margin:16px}}.-d{width:2.5em;height:2.5em;fill:#fff}@media(max-width:240px){.-d{font-size:14px}}@media(min-width:768px){.-v{display:grid;grid-gap:30px;grid-template-columns:repeat(12,1fr)}}.-m{flex:1 1 100%}.-m:nth-child(odd){grid-column:span 3}@media(max-width:1023px){.-m:nth-child(odd){grid-column:span 6}}.-m:nth-child(2n+2){grid-column:span 3}@media(max-width:1023px){.-m:nth-child(2n+2){grid-column:span 6}}.-g{color:#fff}.-y{list-style:none;padding:0}@media(min-width:768px){.-y+.-g{margin-top:2.5em}}.-b{position:relative}.-w{padding-left:35px;font-size:.8125rem;color:#fff}.-x{position:absolute;left:10px;top:8px;width:12px;height:12px;fill:#fff}.-k{display:flex;flex-direction:column;padding-top:4em}@media(min-width:768px){.-k{flex-direction:row;align-items:flex-end}}.-_{width:50%;max-width:200px;margin-bottom:40px;margin-right:auto}@media(min-width:768px){.-_{margin-bottom:0}}.-j{list-style:none;padding:0;margin:0}.-q{display:inline-block;margin-right:1em}.-z{font-size:.8125rem;font-weight:400;color:#fff}.-te{display:block;font-size:.875rem;margin-top:2em;color:#e2e5e6}.-te a{color:#fafafc}.ap-m-format-toggle{position:-webkit-sticky;position:sticky;top:0;margin:0 10px;padding:10px 0 0;width:100%;max-width:85%;z-index:12}@media(min-width:768px){.ap-m-format-toggle{padding:0;margin:0 15px 0 0;max-width:100%}}.ap-m-format-toggle-selected{border:0}.amp-mode-touch .ap-m-format-toggle-selected{position:relative}.ap-m-format-toggle-selected:focus:after,.ap-m-format-toggle-selected:hover:after{position:absolute;top:0;left:0;content:"";display:block;height:300%;width:100%}.ap-m-format-toggle-link,.ap-m-format-toggle-selected{z-index:3;display:flex;align-items:center;width:100%;margin:0 0 2px;padding:5px 8px;overflow:hidden;line-height:1.6rem;font-weight:400;color:#48525c;font-family:Poppins,system;font-weight:700;font-size:12px;text-align:left;border-radius:4px;color:#000;background:#ebebf0;transition:opacity .2s ease;box-shadow:0 5px 15px -5px rgba(0,0,0,.25)}.ap-m-format-toggle-link .ap-a-ico,.ap-m-format-toggle-selected .ap-a-ico{width:14px;height:14px;margin-right:8px;fill:#000}.ap-m-format-toggle-link{color:#000;background:#ebebf0}.ap-m-format-toggle-link .ap-a-ico{fill:#000}.ap-m-format-toggle-link-websites.ap-m-format-toggle-selected,.ap-m-format-toggle-link-websites:hover{background:linear-gradient(225deg,#00dcc0,#005af0 75%);color:#fff}.ap-m-format-toggle-link-websites.ap-m-format-toggle-selected .ap-a-ico,.ap-m-format-toggle-link-websites:hover .ap-a-ico{fill:#fff}.ap-m-format-toggle-link-stories.ap-m-format-toggle-selected,.ap-m-format-toggle-link-stories:hover{background:linear-gradient(225deg,#ec6600,#ffdc00 75%);color:#20202a}.ap-m-format-toggle-link-stories.ap-m-format-toggle-selected .ap-a-ico,.ap-m-format-toggle-link-stories:hover .ap-a-ico{fill:#20202a}.ap-m-format-toggle-link-ads.ap-m-format-toggle-selected,.ap-m-format-toggle-link-ads:hover{background:linear-gradient(225deg,#eb49e1,#5500d7 75%);color:#fff}.ap-m-format-toggle-link-ads.ap-m-format-toggle-selected .ap-a-ico,.ap-m-format-toggle-link-ads:hover .ap-a-ico{fill:#fff}.ap-m-format-toggle-link-email.ap-m-format-toggle-selected,.ap-m-format-toggle-link-email:hover{background:linear-gradient(225deg,#09a600,#e1eb64 75%);color:#20202a}.ap-m-format-toggle-link-email.ap-m-format-toggle-selected .ap-a-ico,.ap-m-format-toggle-link-email:hover .ap-a-ico{fill:#20202a}.ap-m-format-toggle-angle{margin-right:0;margin-left:auto}.ap-m-format-toggle-formats{position:absolute;width:100%;z-index:2;pointer-events:none;opacity:0;transform:translateY(-20px);transition:all .2s ease;transition-delay:.05s}.ap-m-format-toggle-formats:focus-within,.ap-m-format-toggle-formats:hover,.ap-m-format-toggle-selected:focus+.ap-m-format-toggle-formats,.ap-m-format-toggle-selected:hover+.ap-m-format-toggle-formats{pointer-events:auto;opacity:1;transform:translateY(0)}body{top:0;left:0;background-repeat:no-repeat;background-size:100% auto;background-position:100% 0;background-attachment:fixed}body.ap--websites{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 768'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='239.67' y1='855.23' x2='606.28' y2='-152.04' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23d5e6f2'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath fill='url(%23a)' d='M0 0h1024v214L786.37 768H0V0z'/%3E%3C/g%3E%3C/svg%3E%0A")}body.ap--ads{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 768'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='239.67' x2='606.28' y1='855.23' y2='-152.04' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23ddd3eb'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath fill='url(%23a)' d='M0 0h1024v214L786.37 768H0V0z'/%3E%3C/g%3E%3C/svg%3E%0A")}body.ap--stories{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 768'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='239.67' x2='606.28' y1='855.23' y2='-152.04' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23ebdfd3'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath fill='url(%23a)' d='M0 0h1024v214L786.37 768H0V0z'/%3E%3C/g%3E%3C/svg%3E%0A")}body.ap--email{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1024 768'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='239.67' x2='606.28' y1='855.23' y2='-152.04' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23d7ebd3'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg%3E%3Cpath fill='url(%23a)' d='M0 0h1024v214L786.37 768H0V0z'/%3E%3C/g%3E%3C/svg%3E%0A")}.ap--ampsidebar{width:100%;max-width:90vw;background:#fafafc}.ap--ampsidebar-toolbar{top:86px;height:100vh;max-height:calc(100vh - 86px)}@media(min-width:768px){.ap--ampsidebar-toolbar{position:-webkit-sticky;position:sticky;overflow:auto}}.ap--ampsidebar-toolbar>ul{-webkit-overflow-scrolling:touch;margin:0;padding:0}@media(min-width:768px){.ap--ampsidebar-toolbar>ul{overflow:auto;max-height:100%}}.ap--ampsidebar-toolbar>ul::-webkit-scrollbar{width:6px;height:6px}.ap--ampsidebar-toolbar>ul::-webkit-scrollbar-thumb{border-radius:3px;background-color:#91979d}.ap--ampsidebar-toolbar>ul::-webkit-scrollbar-corner{background-color:transparent}.ap--ampsidebar-toolbar>ul::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.1)}.ap-o-sidebar-component{max-width:100%}@media(min-width:768px){.ap-o-sidebar-component .ap-o-sidebar{width:auto;min-height:400px;padding-bottom:0;margin-right:0;margin-left:-10px;background:0 0;box-shadow:none}}.ap-o-sidebar-component .nav{margin:15px 0 0;padding-bottom:15px}.ap-o-sidebar-component .nav-list{max-width:300px;list-style:none;padding:0;margin:0}.ap-o-sidebar-component .nav-list.level-1{margin:0 15px}.ap-o-sidebar-component .nav-list .nav-list{padding-bottom:10px;margin-bottom:10px}.ap-o-sidebar-component .nav-item{position:relative;margin:0;padding:0}.ap-o-sidebar-component .nav-item.level-1{pointer-events:none}.ap-o-sidebar-component .nav-item.level-1 .nav-link{font-family:Poppins,system;font-weight:700;line-height:1.2em;color:#20202a;font-size:1.8rem;padding:0;margin:0;line-height:1;word-break:break-all;pointer-events:auto;color:#e2e5e6}.ap-o-sidebar-component .nav-item.level-1 .nav-link:only-child:not(a){margin:-20px;font-size:0;pointer-events:none;z-index:-1}.ap-o-sidebar-component .nav-item.level-1>.nav-link{padding-top:10px;pointer-events:none;z-index:1;transition:color .15s ease}.ap-o-sidebar-component .nav-item.level-1.active>.nav-link,.ap-o-sidebar-component .nav-item.level-1:hover>.nav-link{color:#91979d}.ap-o-sidebar-component .nav-item.level-2 .nav-link{text-transform:unset;line-height:1.6rem;font-weight:400;color:#48525c;font-family:Noto Sans,system;font-size:.875rem;line-height:1.4em;padding:3px 25px 3px 0;margin:0}.ap-o-sidebar-component .nav-item.active>.nav-link{font-weight:700;color:#005af0}.ap-o-sidebar-component .nav-item:hover>.nav-link{color:#005af0}.ap-o-sidebar-component .nav-link{position:relative;display:block;padding:0;margin:0;color:rgba(0,0,0,.75);border:none;background-color:transparent}.ap-a-pill{display:inline-block;margin:5px;padding:5px 10px;border:none;border-radius:25px;background:var(--background-color,#fff);line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;font-weight:700;box-shadow:0 10px 25px 0 rgba(0,0,0,.15);color:var(--color,#8c8f94);font-family:Noto Sans,system;transition:background-color .2s ease-in,color .2s ease-in,box-shadow .25s ease-in;cursor:pointer}@media(min-width:550px){.ap-a-pill{padding:5px 20px;margin:5px 10px}}@media(min-width:768px){.ap-a-pill{margin:5px;padding:5px 20px}}.ap-a-pill.filtered,.ap-a-pill:hover{box-shadow:0 2px 5px 0 rgba(0,0,0,.15);background:#005af0;color:#fff}.ap-a-pill-link{color:#005af0}.ap-a-pill-small{padding:2px 12px}.ap-a-pill-flat{box-shadow:none;background-color:#ebebf0}.ap-a-pill-meta{box-shadow:none;background-color:#48525c;color:#fff;pointer-events:none}.ap-a-pill-bento{background-color:#d45a5a;color:#fff}.ap-o-filter-bubbles-list{grid-column:7/19;display:flex;flex-wrap:wrap;padding:15px 0;margin:0 -10px}@media(min-width:550px){.ap-o-filter-bubbles-list{padding:30px 10px;margin:0;width:auto}}@media(min-width:768px){.ap-o-filter-bubbles-list{padding:30px 0}}.ap-m-table-component{margin-bottom:59px}.ap-m-table-component-container{background-color:#fff;margin-top:40px}.ap-m-table-component-container h4{margin:40px 0 18px}.ap-m-table-component-container h4:target:before{content:"";display:block;visibility:hidden;height:250px;margin-top:-250px}.ap-m-table-component-row{position:relative;display:flex;flex-direction:column;width:100%;grid-column-gap:10px}@media(min-width:768px){.ap-m-table-component-row{display:grid;grid-template-columns:2% 43% 55%;justify-content:start}.ap-m-table-component-row-components{display:grid;grid-template-columns:15% 45% 40%;justify-content:start}.ap-m-table-component-copy,.ap-m-table-component-header,.ap-m-table-component-info,.ap-m-table-component-link,.ap-m-table-component-name,.ap-m-table-component-row .-fr{align-self:center}}@media(min-width:1024px){.ap-m-table-component-row-components{grid-template-columns:8% 40% 52%}}.ap-m-table-component-link{display:block;border-bottom:1px solid rgba(0,0,0,.05)}.ap-m-table-component-link:hover{background:#ebebf0}.ap-m-table-component-link:first-of-type{border-top:1px solid rgba(0,0,0,.05)}.ap-m-table-component-tags{position:absolute;right:0;top:0;font-size:0;z-index:1}.ap-m-table-component-tags>.ap-m-tag:not(:last-of-type){margin-right:5px}@media(min-width:768px){.ap-m-table-component .ap-m-tag:empty{min-width:8px}.ap-m-table-component-tags{height:8px;align-self:center;position:relative}.ap-m-table-component-tags>.ap-m-tag{border-radius:50%;min-width:8px;margin-right:3px}}.ap-m-table-component-name{display:flex;justify-self:start;align-items:center;height:100%;padding-top:10px;background:0 0}.ap-m-table-component-name-title{margin:0;font-family:Fira Mono,monospace;font-weight:500;font-size:.875em;font-weight:700;color:#48525c}@media(min-width:768px){.ap-m-table-component-name{width:100%;padding-left:15px;padding-top:0}}.ap-m-table-component-info{padding:11px 0}.ap-m-table-component-info .ap-m-table-component-used-components code{color:#20202a}.ap-m-table-component-copy{font-size:.8125rem;display:block;margin:0;line-height:1.6em;font-weight:400;color:#48525c}.ap-m-table-component-components{display:flex;flex-wrap:wrap;justify-content:space-between;width:100%}.ap-m-table-component-components .ap-m-table-component-link{display:flex;width:100%;border:none}@media(min-width:768px){.ap-m-table-component-components .ap-m-table-component-link{width:calc(50% - 30px);margin-right:30px}}.ap-m-table-component-components .ap-m-table-component-link:first-child .ap-m-table-component-row,.ap-m-table-component-components .ap-m-table-component-link:nth-child(2) .ap-m-table-component-row{border-top:1px solid rgba(0,0,0,.05)}@media(min-width:768px){.ap-m-table-component-components .ap-m-table-component-link .ap-m-tag:empty{min-width:8px}}.ap-m-table-component-components .ap-m-table-component-row{grid-template-columns:5% 85%;padding:10px 0;border-bottom:1px solid rgba(0,0,0,.05)}.ap-m-tag{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;font-weight:700;text-align:center;display:inline-block;min-width:80px;line-height:30px;padding:0 5px}.ap-m-tag:empty{min-width:26px;padding:4px 0}.ap-m-tag-websites{color:#fff;background:linear-gradient(225deg,#00dcc0,#005af0 75%)}.ap-m-tag-stories{color:#20202a;background:linear-gradient(225deg,#ec6600,#ffdc00 75%)}.ap-m-tag-ads{color:#fff;background:linear-gradient(225deg,#eb49e1,#5500d7 75%)}.ap-m-tag-email{color:#20202a;background:linear-gradient(225deg,#09a600,#e1eb64 75%)}.ap-m-tag-general{color:#fff;background-color:#005af0}.-fy.-rt{position:relative;margin:0 20px 2em 0;flex:1 0 15em}@media(min-width:575px){.-fy.-rt{margin:0 0 2em}}.-fy.-rt>a{position:relative;display:block;transition:transform .3s ease;height:100%}.-fy.-rt>a:hover{transform:translateY(-2px)}.-fy.-rt>a:hover .-rn{box-shadow:inset 0 0 0 1px #ebebf0,0 25px 60px 0 rgba(0,0,0,.1)}.-fy .-fj{display:grid;grid-template-columns:repeat(12,1fr);align-items:stretch;margin-top:20px}@media(min-width:600px){.-fy .-fj{grid-column-gap:30px}}.-fy .-op{position:absolute;right:0;top:0;font-size:0;z-index:1}.-fy .-rn{overflow:hidden;position:relative;background-color:#fff;border-radius:10px;box-shadow:inset 0 0 0 1px #ebebf0,0 15px 30px 0 rgba(0,0,0,.15);transition:box-shadow .3s ease;height:100%;border-radius:0}.-fy .-fb{display:flex;align-items:center;height:50px;padding:0 1.25em;background:linear-gradient(45deg,#48525c,#20202a);height:90px}.-fy .-fw{line-height:1.6rem;font-weight:400;color:#48525c;display:block;line-height:1.25em;font-size:1rem;font-family:Fira Mono,monospace;font-weight:500;color:#fff;margin:0;font-weight:700}.-fy .-lv{box-shadow:0 15px 30px 0 rgba(0,0,0,.15);margin-bottom:20px;grid-column:span 12;transition:transform .3s ease,box-shadow .3s ease}.-fy .-lv:hover{transform:translate3d(0,-2px,0);box-shadow:0 25px 60px 0 rgba(0,0,0,.1)}@media(min-width:600px){.-fy .-lv{grid-column:span 6}}@media(min-width:1024px){.-fy .-lv{grid-column:span 4}}.-fy .-lv .-rn{overflow:hidden;position:relative;background-color:#fff;box-shadow:none}.-fy .-lv code{font-size:1em;font-weight:700;color:#20202a}.-fy .-lv p{font-size:.75em}.-fy .-rs{padding:15px 25px}.-fy .-lm{margin-top:10px}.-fy .-ro{position:relative}.-fy .-ro:before{content:"";position:absolute;left:-1px;bottom:0;width:calc(100% + 2px);height:150px;background:linear-gradient(0deg,rgba(0,0,0,.12),transparent);z-index:1}.-fy .-ru{font-family:Poppins,system;font-weight:700;line-height:1.2em;color:#20202a;font-size:1rem;margin:0 0 .65em}.-fy .-od{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.8125rem;line-height:1.6em;margin:0}.-lg .-lv{box-shadow:none;border:1px solid #e2e5e6;transition:none}.-lg .-lv:hover{transform:none;box-shadow:none}.-so{display:block;width:100%;height:1px;margin-bottom:.813em;background-color:#fafafc}@media(min-width:768px){.-so{display:none}.-su{display:block}}section.-t.benefits.ads .-r,section.-t.benefits.ads h3-text,section.-t.benefits.websites .-r,section.-t.benefits.websites h3-text{color:#fff}section.-t.benefits.ads .-i,section.-t.benefits.ads h3-icon,section.-t.benefits.websites .-i,section.-t.benefits.websites h3-icon{fill:#005af0;background:#fff}section.-t.benefits.e-mails .-r,section.-t.benefits.e-mails h3-text,section.-t.benefits.stories .-r,section.-t.benefits.stories h3-text{color:#000}.-sa{position:relative;display:flex;margin:20px}@media(min-width:768px){.-sa{padding:0;margin:50px 0;flex:0 0 calc(33.333333333% - 40px)}}.-sf{width:2.5em;height:2.5em;fill:#005af0;margin-right:10px}.-sl{display:flex;flex-direction:column}.-sc{line-height:1.6rem;font-weight:400;color:#48525c;font-weight:700;color:#000;margin-bottom:.3em}.-sh{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;margin-bottom:10px}.-sl b{font-size:.875rem}.-sp{background:linear-gradient(225deg,#00dcc0,#005af0 75%)}.-sd{box-shadow:0 50px 100px 0 rgba(0,0,0,.25);z-index:1}@media(min-width:768px){.-sd{margin-left:55px}}.-sv{box-shadow:0 25px 50px 0 rgba(0,0,0,.21)}.-sm{padding:45px 50px}.-sg{width:60px;height:4px;background-color:#005af0}@media(min-width:1024px){.-sg{margin-bottom:3em}}.ap--benefits-overview{margin-bottom:7em}@media(min-width:1024px){.ap--benefits-overview{margin-bottom:8vw}}.-sy{grid-column:1/16}@media(min-width:1024px){.-sy{grid-column:1/12}}@media(min-width:1280px){.-sy{grid-column:1/10}}.-sb{grid-column:1/13}.-sb h2{margin-top:0}.-sb .-sa{margin:20px 20px 0 0}.-sb .-sf{margin-right:15px}.-sb .-sa.principles{margin:50px 20px 100px 0}@media(min-width:1024px){.-sw{grid-column:2/10}}.-sx{grid-column:13/25}@media(min-width:768px){.-sx{margin-top:5em}}@media(min-width:1024px){.-sx{grid-column:14/22}.-sk{grid-column:3/10}}.-s_{grid-column:17/-1;width:100%;margin-top:2em}@media(min-width:768px){.-s_{width:auto;margin-top:0}}.ap-breadcrumbs,.-ue{display:flex;align-items:center;font-family:Poppins,system;font-weight:700;font-size:.8125rem}.ap-breadcrumbs-angle,.-ut{width:10px;height:10px;margin:0 6px;transform:rotate(-90deg)}#sidebar-left[aria-hidden=true]:not([hidden])~.ap--main .-ur{animation:moveSidebarToggleBackwards .233s cubic-bezier(0,0,.21,1) forwards}#sidebar-left[aria-hidden=true]:not([hidden])~.ap--main .-ur .label-icon svg{transform:rotate(180deg)}#sidebar-left[aria-hidden=true]:not([hidden])~.ap--main .-ur .label-title{transform:translateX(0) scaleX(1);transform-origin:left center}#sidebar-left[open]~.ap--main .-ur{left:0;margin-left:0;animation:moveSidebarToggleForwards .233s cubic-bezier(0,0,.21,1) forwards}#sidebar-left[open]~.ap--main .-ur .label-icon svg{transform:rotate(0)}#sidebar-left[open]~.ap--main .-ur .label-title{transform:translateX(-150vw) scaleX(0);transform-origin:left center}#sidebar-left[aria-hidden=true]:not([hidden])~.ap--main .-ur,#sidebar-left[open]~.ap--main .-ur{z-index:9999999999}.-ui{position:absolute;top:50px}.-us{position:fixed;top:-99px}.-uo{position:fixed;z-index:15;font-size:12px;font-family:Poppins,system;font-weight:700;color:#fff;fill:#fff;cursor:pointer;display:flex;align-items:center}.-uo .label-icon{border-radius:4px;background:#005af0;height:35px;width:32px;padding-left:2px;display:flex;justify-content:center;align-items:center;box-shadow:0 10px 20px -5px rgba(0,0,0,.25);z-index:1}.-uo .label-icon svg{height:14px;width:14px;transition:transform .233s cubic-bezier(0,0,.21,1)}.-uo .label-title{left:32px;display:flex;align-items:center;height:35px;margin-left:-5px;padding:5px 10px 5px 5px;white-space:nowrap;border-radius:0 4px 4px 0;background:#005af0;box-shadow:0 10px 20px -5px rgba(0,0,0,.25);transform:scaleX(0);transform-origin:left;transition:transform .233s cubic-bezier(0,0,.21,1)}.-uu{position:fixed;top:-99px}.-ur{margin-top:-52px;margin-left:-25px}@media(min-width:768px){.-ur{display:none}}.-ur .label-icon svg{transform:rotate(180deg)}.-ua{display:none}.-uf{position:fixed;top:-99px}.-ul{display:none}@media(min-width:768px)and (max-width:1440px){.-ua{display:inline-block}.-ul{position:-webkit-sticky;position:sticky;top:138px;display:inline-flex;transform:translate(-40px,-52px)}.-uf:checked~.-uc{grid-column:1/2}.-uf:checked~.-uc nav{display:none}.-uf:checked~.-uc svg{transform:rotate(180deg)}}@media(min-width:768px)and (max-width:1440px)and (max-width:1023px){.-uf:checked~.ap--toc{grid-column:2/25}}@media(min-width:768px)and (max-width:1440px){.-uf:checked~.ap--toc~.-t{padding-left:80px;padding-right:80px;grid-column:2/20}}@media(min-width:768px)and (max-width:1440px)and (max-width:1023px){.-uf:checked~.ap--toc~.-t{grid-column:2/25}}@media(min-width:768px)and (max-width:1440px){.-uf:checked~.-t,.-uf:checked~.ap--help{grid-column-start:2;padding-left:80px;padding-right:80px}.-uf:checked~.-t .-ul,.-uf:checked~.ap--help .-ul{margin-left:-88px}.-uf:checked~.-t .-ul .label-icon svg,.-uf:checked~.ap--help .-ul .label-icon svg{transform:rotate(180deg)}}.ap--main>.-tf:first-child{padding-top:54px;padding-bottom:3rem}body{background-color:#fafafc}.-fv .-tf{position:relative;display:flex;flex-wrap:wrap;width:100%;max-width:1440px;padding:0 20px;margin-left:auto;margin-right:auto}@media(max-width:767px){.-fv .-tf{padding:0 15px}.-fv .-tf>div,.-fv .-tf section{min-width:0}}@media(min-width:768px){.-fv .-tf{display:grid;grid-gap:30px;grid-template-columns:repeat(24,minmax(0,1fr));padding:0 30px;grid-gap:0}}@media(min-width:1024px){.-fv .-tf{padding:0 15px}}.-fv .-t,.-fv .ap--help{grid-column:1;position:relative;width:100%;padding-left:60px;padding-right:60px;background:#fff;box-shadow:0 25px 40px 0 rgba(0,0,0,.05)}@media(min-width:768px){.-fv .-t,.-fv .ap--help{grid-column:9/25}}@media(min-width:1024px){.-fv .-t,.-fv .ap--help{grid-column:6/25}}.-fv .-t .-uo,.-fv .ap--help .-uo{margin-left:-25px}@media(min-width:768px){.-fv .-t .-uo,.-fv .ap--help .-uo{margin-left:-30px}}.-fv .-uc{grid-column:auto;padding:0}@media(min-width:768px){.-fv .-uc{grid-column:1/8;grid-row:span 6;margin-right:20px}}@media(min-width:1024px){.-fv .-uc{grid-column:1/6}}@media(min-width:768px){.-fv .ap--toc{grid-column:9/25}.-fv .ap--toc~.-t{padding-top:0}}@media(min-width:768px)and (min-width:768px){.-fv .ap--toc~.-t{grid-column:9/25}}@media(min-width:768px)and (min-width:1024px){.-fv .ap--toc~.-t{grid-column:7/19}}@media(min-width:1024px){.-fv .ap--toc{grid-column:20/25;grid-row:span 3;padding-top:46px}.-fv .ap--toc~.-t{padding-top:62px}}@media(min-width:1024px)and (max-width:767px){.-fv .ap--toc~.-t{padding-left:15px;padding-right:15px}}.-fv .-uc+.-t,.-fv .ap--toc+.-t{padding-top:62px}@media(max-width:767px){.-fv .-uc+.-t,.-fv .ap--toc+.-t{padding-left:15px;padding-right:15px}}@media(min-width:1024px){.-fv .-uc+.-t:nth-of-type(2),.-fv .-uc+.-t:nth-of-type(3),.-fv .ap--toc+.-t:nth-of-type(2),.-fv .ap--toc+.-t:nth-of-type(3){grid-row:1}.-fv .ap--benefits--list{display:flex}}.-fv .ap--benefits--list .-sa{margin:20px 0}@media(min-width:768px){.-fv .ap--benefits--list .-sa{margin-right:40px}}.-fm{position:-webkit-sticky;position:sticky;z-index:2;top:90px;padding:20px 30px;margin:2em -30px;text-align:center;background:linear-gradient(180deg,#fafafc 0,#fafafc 80%,rgba(250,250,252,0))}.-fg{line-height:1.6rem;font-weight:400;color:#48525c}.-fg:not(:last-child):after{color:#e2e5e6;content:" |"}.-fv .-rl{flex-wrap:wrap;margin:0;padding:0}@media(max-width:559px){.-fv .-rl .-fy{margin:0 0 2em}}.-fv .-rl .-fy .-fb{align-items:flex-end;padding-bottom:10px;padding-top:30px;height:auto}.-fv .-rl .-fy .-fw{font-size:1.125em}.-fv .-rl .-fy .-rs{padding:1.25em}.-fv .-fx{position:relative;top:-180px}.-fv .-fx:target:before{height:0;margin:0}.-fv .-rf{margin-bottom:10px}.-fv .ap--card-grid{padding:0;margin:0}.-fv .ap--card-grid h2{margin-bottom:0;padding-bottom:0}.-fv .ap-o-card-grid-card .-n{padding:0}.-fv .ap-o-card-grid-card .-n:last-of-type{padding:0 0 10px}.ap-o-burger-menu{display:none;position:fixed;top:0;left:0;width:100vw;height:100vh;padding:110px 20px 80px;z-index:16;background-color:#fff}@media(max-width:240px){.ap-o-burger-menu{padding:37px 20px 0}.has-banner~.ap-o-burger-menu{padding:calc(37px + 31px) 0 0 20px}}.ap-o-burger-menu-label{position:fixed;z-index:1001;top:12px;right:20px;cursor:pointer}.ap-o-burger-menu-label.mainmenuopen{z-index:1004}.has-banner+.ap-o-burger-menu-label{top:calc(12px + 31px)}.amp-hidden+.has-banner+.ap-o-burger-menu-label,amp-user-notification[hidden]+.has-banner+.ap-o-burger-menu-label{top:12px}@media(min-width:768px){.ap-o-burger-menu-label{right:30px}}@media(min-width:1024px){.ap-o-burger-menu-label{display:none}}.ap-o-burger-menu-icon{width:30px;height:30px}@media(min-width:1024px){.ap-o-burger-menu{display:none}}.ap-o-burger-menu.mainmenuopen{display:block;z-index:1003}.ap-o-burger-menu.mainmenuopen~.ap--main{max-height:calc(100vh - 55px)}.has-banner+.ap-o-burger-menu.mainmenuopen~.ap--main{max-height:calc(100vh - 55px - 31px)}.ap-o-burger-menu.mainmenuopen~.ap--footer{display:none}.-th{list-style:none;display:flex;flex-direction:column;height:100%;margin:1rem 0 0;padding:0;overflow-y:auto;-webkit-overflow-scrolling:touch}@media(max-width:240px){.-th{padding:1rem 0}}.-th .-th{margin-top:1rem}.-th .-th .-tp:last-child{margin-bottom:0}.-tp{margin-bottom:1rem;position:relative}.-tp:last-child{margin-top:auto}.-tp ul{display:none}.-td{position:absolute;left:0;top:0;width:100%;height:36px;padding:0;margin:0;background:none transparent;border:none;cursor:pointer;-webkit-appearance:none}.-td:focus{outline:5px auto -webkit-focus-ring-color}.-td:checked~ul{display:block}.-td:checked+.nav-icon .ap-a-ico{transform:rotate(0)}.-td+.nav-icon .ap-a-ico{display:inline-block;transform:rotate(-90deg)}.-tp .ap-a-ico{height:.6em;margin-bottom:.3em;margin-left:.3em;width:.6em}.-tv{position:relative;margin-right:20px;padding-bottom:10px;display:none}@media(max-width:240px){.-tv{margin-right:0}}@media(min-width:1024px){.-tv{margin-right:0;padding-right:30px;display:block}}.-tm{display:flex;align-items:center;font-size:11px;border:none;background:0 0}.-tm:hover{color:#005af0}.-tg{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;padding:0;border:0;-webkit-appearance:none}@media(min-width:1024px){.-tg{width:calc(100% - 30px)}}.-ty{width:10px;height:10px;margin-left:5px}.-tb{list-style:none;display:none;position:absolute;right:15%;margin:0;padding:2px 8px;background:#fff;box-shadow:0 2px 10px 0 rgba(0,0,0,.07)}@media(max-width:240px){.-tb{overflow:auto;max-height:calc(100vh - 55px - 31px)}}.-tb:hover,.-tg:checked~.-tb,.-tg:hover~.-tb,.-tv .-tw{display:block}.-tb:focus-within{display:block}.mainmenuopen .-tv{display:block}.-tw{font-family:Poppins,system;font-weight:700;font-size:1.5em;color:#000}@media(min-width:1024px){.-tw{font-size:1rem}}.-tx{line-height:1.6rem;font-weight:400;color:#48525c;font-size:1rem}@media(min-width:1024px){.-tx{font-size:.875rem}}.-tx.active{text-decoration:underline}.-tw:hover{color:#005af0}.-tw.active{font-weight:700;color:#005af0}.ap--header{width:100%;max-width:2020px;margin:0 auto;position:-webkit-sticky;position:sticky;top:0;z-index:1001;background-color:#fff;box-shadow:0 2px 10px 0 rgba(0,0,0,.07)}.ap--header.mainmenuopen{z-index:1004}.ap--header.mainmenuopen~.ap--main{max-width:100vw;overflow-x:hidden}@media(min-width:1024px){.ap--header{top:0}.ap--header.has-banner{top:-31px}}.ap-o-header{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;max-width:1460px;padding:10px 0 0 20px;margin:0 auto}@media(min-width:1024px){.ap-o-header{display:flex;padding-left:30px}}.ap-o-header-home{position:-webkit-sticky;position:sticky;top:10px;display:flex;align-items:center;margin-right:auto;padding-bottom:10px;overflow:hidden}.ap-o-header-home-logo{height:30px;margin-right:6px;width:30px}.ap-o-header-home-sub-title,.ap-o-header-home-title{margin-left:4px;font-family:Poppins,system;font-weight:700;font-size:1.5em;color:#005af0}@media(min-width:1024px){.ap-o-header-home-sub-title,.ap-o-header-home-title{font-size:1.125rem}}.ap-o-header-home-sub-title{color:#000;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.ap-o-header-main{display:none;flex:1 1 auto;padding:0 30px}@media(min-width:1024px){.ap-o-header-main{display:flex}}.ap-o-header-main-item{position:relative;display:flex;align-items:center;margin:0 18px -5px}.ap-o-header-main-link{display:flex;align-items:center;padding:0 0 14px;border:0;background:0 0}.ap-o-header-main-link-icon{font-size:8px;margin-left:5px;transform:rotate(0);transition:transform .2s ease}.ap-o-header-flyout:hover,.ap-o-header-main-link:focus~.ap-o-header-flyout,.ap-o-header-main-link:hover~.ap-o-header-flyout{opacity:1;pointer-events:all;transition:opacity .2s ease}.ap-o-header-flyout:focus-within{opacity:1;pointer-events:all;transition:opacity .2s ease}.ap-o-header-flyout{box-shadow:0 10px 25px 0 rgba(0,0,0,.2);position:absolute;top:95%;left:0;margin:0;padding:0 0 10px;pointer-events:none;opacity:0;list-style:none;background:#fff;border-radius:0 0 4px 4px;transition:opacity .2s ease}.ap-o-header-flyout:before{content:"";display:block;background:linear-gradient(180deg,rgba(0,0,0,.07) 0,hsla(0,0%,100%,.07));height:8px;margin-bottom:10px}.ap-o-header-flyout-item-secondary{margin:20px 0;white-space:nowrap;min-width:200px}.ap-o-header-flyout-item-secondary a:hover{color:#005af0}.ap-o-header-flyout-item-title{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.875rem;font-family:Poppins,system;font-weight:700;color:#000;line-height:1.4em}.ap-o-header-flyout-item-title.secondary{padding:0 15px}.ap-o-header-flyout-item-description{line-height:1.6rem;font-weight:400;color:#48525c;font-size:.8125rem;opacity:.75;line-height:1.25em}.ap-o-header-flyout-primary-item{position:relative;width:300px}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link{box-shadow:0 10px 25px 0 rgba(0,0,0,.2);background-color:#005af0}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-info>*{color:#fff}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-info-stories .ap-o-header-flyout-item-description,.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-info-stories .ap-o-header-flyout-item-title{color:#20202a}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-info-email .ap-o-header-flyout-item-description,.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-info-email .ap-o-header-flyout-item-title{color:#20202a}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-icon{fill:#fff}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-icon.email,.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link-icon.stories{fill:#20202a}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link.websites{background:linear-gradient(225deg,#00dcc0,#005af0 75%)}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link.stories{background:linear-gradient(225deg,#ec6600,#ffdc00 75%)}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link.ads{background:linear-gradient(225deg,#eb49e1,#5500d7 75%)}.ap-o-header-flyout-primary-item:hover .ap-o-header-flyout-primary-item-link.email{background:linear-gradient(225deg,#09a600,#e1eb64 75%)}.ap-o-header-flyout-primary-item-link{display:flex;align-items:center;border-radius:4px;padding:10px;margin:0 5px}.ap-o-header-flyout-primary-item-link-info{margin:0 20px 0 15px}.ap-o-header-flyout-primary-item-link-icon{display:flex;font-size:medium;box-sizing:initial;justify-content:center;width:2em;height:2em}.ap-o-header-flyout-primary-item-link-icon.websites{fill:url(#gradient-websites) #000}.ap-o-header-flyout-primary-item-link-icon.stories{fill:url(#gradient-stories) #000}.ap-o-header-flyout-primary-item-link-icon.ads{fill:url(#gradient-ads) #000}.ap-o-header-flyout-primary-item-link-icon.email{fill:url(#gradient-email) #000}#blm-banner{background:#111;color:#eee;display:block;text-align:center;padding:.5em}</style><link rel="manifest" href="/manifest.json"></head><body class="ap--websites"> <svg style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <symbol id="close" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M39.503 32l22.963-22.963c2.046-2.046 2.046-5.457 0-7.503s-5.456-2.046-7.503 0l-22.963 22.963-22.963-22.963c-2.046-2.046-5.457-2.046-7.503 0s-2.046 5.457 0 7.503l22.963 22.963-22.963 22.963c-2.046 2.046-2.046 5.456 0 7.503s5.457 2.046 7.503 0l22.963-22.963 22.963 22.963c2.046 2.046 5.456 2.046 7.503 0s2.046-5.456 0-7.503l-22.963-22.963z"/> </symbol><symbol id="stackoverflow" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19 25"><path d="M14.2 14.7h1.6V25H0V14.7h1.6v8.6h12.5c.1-2.8.1-5.7.1-8.6zM9.5 3.2c1.8 2.7 3.6 5.4 5.4 8.2.6-.4 1.1-.8 1.7-1.2C14.8 7.5 13 4.8 11.2 2c-.5.5-1.1.8-1.7 1.2zm5.1 8.5c-2.8-1.7-5.5-3.3-8.2-5-.4.6-.7 1.2-1.1 1.8 2.7 1.7 5.5 3.3 8.2 5 .4-.6.8-1.2 1.1-1.8zM17.4 0c-.7.1-1.3.2-2 .4.5 3.2 1.1 6.5 1.6 9.7.7-.1 1.3-.2 2-.4-.5-3.2-1.1-6.5-1.6-9.7zm-4 14.1c-3.1-.9-6.2-1.7-9.2-2.6-.2.7-.4 1.4-.5 2 3.1.9 6.2 1.7 9.2 2.6.1-.6.3-1.3.5-2zm-.9 5.5H3v2.1h9.5v-2.1zm.3-2.7c-3.2-.3-6.3-.6-9.5-.9-.1.7-.1 1.4-.2 2.1 3.2.3 6.3.6 9.5.9 0-.8.1-1.4.2-2.1z"/></symbol><symbol id="github" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M32 0.792c-17.68 0-32 14.328-32 32 0 14.141 9.168 26.133 21.88 30.36 1.6 0.301 2.187-0.688 2.187-1.539 0-0.76-0.027-2.773-0.040-5.44-8.901 1.931-10.779-4.293-10.779-4.293-1.456-3.693-3.56-4.68-3.56-4.68-2.899-1.984 0.224-1.944 0.224-1.944 3.213 0.224 4.901 3.296 4.901 3.296 2.853 4.893 7.491 3.48 9.32 2.661 0.288-2.069 1.112-3.48 2.027-4.28-7.107-0.8-14.576-3.552-14.576-15.813 0-3.493 1.24-6.347 3.293-8.587-0.36-0.808-1.44-4.061 0.28-8.469 0 0 2.68-0.859 8.8 3.28 2.56-0.712 5.28-1.064 8-1.080 2.72 0.016 5.44 0.368 8 1.080 6.080-4.139 8.76-3.28 8.76-3.28 1.72 4.408 0.64 7.661 0.32 8.469 2.040 2.24 3.28 5.093 3.28 8.587 0 12.293-7.48 15-14.6 15.787 1.12 0.96 2.16 2.923 2.16 5.92 0 4.283-0.040 7.723-0.040 8.763 0 0.84 0.56 1.84 2.2 1.52 12.803-4.197 21.963-16.197 21.963-30.317 0-17.672-14.328-32-32-32z"/> </symbol><symbol id="wordpress" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M57.251 18.2A28.688 28.688 0 0 1 60.766 32c0 10.611-5.749 19.883-14.301 24.867l8.787-25.405c1.64-4.107 2.187-7.389 2.187-10.304 0-1.08-.069-2.08-.187-2.96zm-21.283.277c1.725-.08 3.285-.28 3.285-.28 1.552-.2 1.371-2.48-.179-2.397 0 0-4.68.36-7.68.36-2.837 0-7.6-.4-7.6-.4-1.56-.08-1.763 2.28-.2 2.36 0 0 1.44.163 3 .24l4.48 12.28-6.32 18.88L14.277 18.4c1.731-.08 3.291-.267 3.291-.267 1.56-.2 1.376-2.48-.173-2.389 0 0-4.656.368-7.664.368-.533 0-1.168-.021-1.84-.04C13.096 8.4 21.96 3.24 32 3.24a28.642 28.642 0 0 1 19.429 7.555c-.123-.008-.243-.024-.376-.024-2.827 0-4.832 2.461-4.832 5.104 0 2.373 1.368 4.381 2.827 6.749 1.096 1.92 2.373 4.381 2.373 7.939 0 2.44-.944 5.317-2.189 9.277l-2.867 9.56-10.4-30.96.003.037zM32 60.757c-2.824 0-5.549-.408-8.128-1.165l8.632-25.083 8.84 24.232c.064.141.133.269.208.397A28.794 28.794 0 0 1 32 60.762zM3.229 32c0-4.171.896-8.133 2.493-11.707L19.439 57.89C9.85 53.226 3.231 43.389 3.228 31.999zM32 0C14.36 0 0 14.36 0 32s14.36 32 32 32 32-14.36 32-32S49.64 0 32 0z"/></symbol><symbol id="youtube" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M62.664 16.542c-.773-2.708-2.862-4.797-5.514-5.556l-.057-.014c-4.989-1.336-25.065-1.336-25.065-1.336s-20.026-.027-25.065 1.337c-2.708.773-4.797 2.862-5.556 5.514l-.014.057C.507 21.107 0 26.354 0 31.72l.001.327v-.017.252a83.84 83.84 0 0 0 1.475 15.695l-.083-.521c.773 2.708 2.862 4.797 5.513 5.556l.057.014c4.983 1.339 25.065 1.339 25.065 1.339s20.023 0 25.065-1.339c2.708-.773 4.797-2.862 5.556-5.514l.014-.057c.85-4.469 1.336-9.609 1.336-14.863l-.002-.595v.03c.002-.184.002-.403.002-.621 0-5.255-.486-10.396-1.416-15.38l.08.515zM25.621 41.608V22.42l16.71 9.609z"/></symbol><symbol id="twitter" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M63.875 12.186c-2.36 1.037-4.88 1.744-7.533 2.067 2.704-1.629 4.784-4.197 5.768-7.261-2.536 1.48-5.346 2.557-8.338 3.157-2.389-2.557-5.794-4.157-9.576-4.157-7.245 0-13.119 5.874-13.119 13.111 0 1.040 0.12 2.040 0.339 2.997-10.906-0.515-20.572-5.752-27.042-13.669-1.139 1.925-1.776 4.162-1.776 6.6 0 4.56 2.32 8.568 5.834 10.922-2.152-0.069-4.176-0.661-5.941-1.643v0.163c0 6.36 4.514 11.663 10.522 12.871-1.101 0.296-2.264 0.456-3.456 0.456-0.837 0-1.64-0.080-2.443-0.229 1.683 5.208 6.52 9.005 12.277 9.112-4.48 3.517-10.157 5.613-16.271 5.613-1.040 0-2.077-0.061-3.12-0.179 5.837 3.717 12.714 5.89 20.151 5.89 24.143 0 37.329-19.989 37.329-37.294 0-0.557 0-1.12-0.040-1.68 2.563-1.837 4.8-4.16 6.56-6.794l-0.125-0.053z"/> </symbol><symbol id="download" viewBox="0 0 64 64"> <path d="M8.8 62.32c0-0.88 0.72-1.68 1.68-1.68 10.8 0 32.32 0 43.040 0 0.88 0 1.68 0.72 1.68 1.68 0 0.88-0.72 1.68-1.68 1.68-10.8 0-32.32 0-43.040 0-0.96 0-1.68-0.72-1.68-1.68z"/> <path d="M49.44 34.56c0.72-0.72 0.72-1.84 0-2.56s-1.84-0.72-2.56 0l-13.040 13.040v-43.28c0-0.96-0.88-1.76-1.84-1.76-1.040 0-1.84 0.8-1.84 1.76v43.28l-13.040-13.12c-0.72-0.72-1.84-0.72-2.56 0s-0.72 1.84 0 2.56l16.24 16.24c0.72 0.72 1.84 0.72 2.56 0l16.080-16.16z"/> </symbol><symbol id="internal" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M43.16 10.18c-0.881-0.881-2.322-0.881-3.203 0s-0.881 2.322 0 3.203l16.335 16.335h-54.051c-1.281 0-2.242 1.041-2.242 2.242 0 1.281 0.961 2.322 2.242 2.322h54.051l-16.415 16.335c-0.881 0.881-0.881 2.322 0 3.203s2.322 0.881 3.203 0l20.259-20.259c0.881-0.881 0.881-2.322 0-3.203l-20.179-20.179z"/></symbol><symbol id="experimental" viewBox="0 0 64 64"> <path d="M49.851 38.958v0c0.404 0 0.803 0.022 1.195 0.064l-0.049-0.004c5.484 0.596 9.714 5.201 9.714 10.794 0 5.986-4.845 10.839-10.827 10.854h-0.001c-0.404-0-0.804-0.022-1.197-0.064l0.049 0.004c-5.484-0.596-9.714-5.201-9.714-10.794 0-5.986 4.846-10.84 10.828-10.854h0.001zM49.851 36.244c-7.483 0.014-13.543 6.083-13.543 13.567 0 6.992 5.289 12.749 12.085 13.487l0.060 0.005c0.429 0.047 0.926 0.074 1.43 0.075h0.001c7.482-0.015 13.542-6.083 13.542-13.567 0-6.992-5.289-12.749-12.085-13.487l-0.060-0.005c-0.428-0.047-0.925-0.074-1.429-0.075h-0.001z"/> <path d="M49.869 52.507c-0.749 0-1.356-0.607-1.356-1.356 0-0.001 0-0.001 0-0.001v0-7.875c0.024-0.731 0.622-1.315 1.357-1.315s1.333 0.584 1.357 1.313l0 0.002v7.875c0 0.75-0.608 1.357-1.357 1.357v0z"/> <path d="M31.967 64c-17.659-0.019-31.967-14.339-31.967-32 0-17.673 14.327-32 32-32s32 14.327 32 32c0 2.338-0.251 4.618-0.727 6.814l0.038-0.211c-0.134 0.62-0.677 1.077-1.327 1.077-0.749 0-1.357-0.607-1.357-1.357 0-0.099 0.011-0.196 0.031-0.289l-0.002 0.009c0.401-1.818 0.631-3.905 0.631-6.046 0-16.176-13.113-29.289-29.289-29.289s-29.289 13.113-29.289 29.289c0 16.176 13.113 29.289 29.289 29.289 2.142 0 4.23-0.23 6.241-0.666l-0.193 0.035c0.076-0.015 0.164-0.024 0.254-0.024 0.75 0 1.357 0.608 1.357 1.357 0 0.642-0.445 1.179-1.043 1.321l-0.009 0.002c-1.995 0.438-4.287 0.689-6.638 0.689-0 0-0.001 0-0.001 0h0z"/> <path d="M49.869 57.8c-0.749 0-1.356-0.607-1.356-1.356v0-0.278c-0-0.013-0.001-0.028-0.001-0.043 0-0.75 0.608-1.357 1.357-1.357s1.357 0.608 1.357 1.357c0 0.015-0 0.030-0.001 0.045l0-0.002v0.278c0 0.749-0.607 1.356-1.356 1.356-0.001 0-0.001 0-0.001 0h0z"/> <path d="M34.206 48.225c0.055-0.523 0.133-1.037 0.24-1.542 0.035-0.168 0.085-0.331 0.125-0.496 0.079-0.332 0.157-0.667 0.258-0.985 0.060-0.195 0.133-0.382 0.203-0.574 0.1-0.283 0.199-0.567 0.314-0.844 0.084-0.199 0.179-0.39 0.267-0.585 0.12-0.256 0.24-0.513 0.372-0.76 0.105-0.196 0.22-0.384 0.334-0.575 0.133-0.234 0.278-0.467 0.427-0.693 0.124-0.187 0.256-0.367 0.388-0.549 0.157-0.216 0.316-0.43 0.484-0.637 0.141-0.175 0.29-0.344 0.438-0.514s0.287-0.326 0.438-0.482l-13.494-0.202 4.238-7.265c0.116-0.196 0.184-0.432 0.184-0.683v-12.206h5.427v12.21c0 0 0 0.001 0 0.002 0 0.251 0.068 0.486 0.188 0.688l-0.003-0.006 4.024 6.906 0.017-0.016q0.287-0.267 0.586-0.522 0.259-0.22 0.526-0.431c0.207-0.16 0.418-0.314 0.633-0.463 0.133-0.091 0.251-0.188 0.383-0.275l-3.647-6.25v-11.842h1.368c0.749 0 1.356-0.607 1.356-1.356s-0.607-1.356-1.356-1.356v0h-13.571c-0.749 0-1.356 0.607-1.356 1.356s0.607 1.356 1.356 1.356v0h1.356v11.843l-9.311 15.963c-0.116 0.196-0.185 0.432-0.185 0.683 0 0.749 0.607 1.356 1.356 1.356 0 0 0 0 0.001 0h15.623c0.007-0.081 0.004-0.171 0.013-0.256z"/> </symbol><symbol id="extended" viewBox="0 0 64 64"> <path d="M31.839 63.722c-17.583-0.018-31.829-14.276-31.829-31.861 0-17.596 14.265-31.861 31.861-31.861s31.861 14.265 31.861 31.861c0 2.329-0.25 4.599-0.724 6.786l0.038-0.21c-0.133 0.617-0.674 1.072-1.322 1.072-0.746 0-1.351-0.605-1.351-1.351 0-0.099 0.011-0.195 0.031-0.287l-0.002 0.009c0.398-1.807 0.627-3.883 0.627-6.012 0-16.101-13.052-29.153-29.153-29.153s-29.153 13.052-29.153 29.153c0 16.101 13.052 29.153 29.153 29.153 2.13 0 4.206-0.228 6.206-0.662l-0.192 0.035c0.084-0.018 0.18-0.029 0.278-0.029 0.746 0 1.351 0.605 1.351 1.351 0 0.647-0.456 1.188-1.063 1.32l-0.009 0.002c-1.985 0.436-4.266 0.686-6.605 0.686-0.002 0-0.003 0-0.005 0h0z"/> <path d="M50.468 39.664v0c0.402 0 0.799 0.022 1.189 0.064l-0.048-0.004c5.46 0.595 9.671 5.18 9.671 10.748 0 5.958-4.821 10.79-10.774 10.808h-0.002c-0.403-0-0.8-0.022-1.191-0.063l0.049 0.004c-5.465-0.589-9.683-5.176-9.683-10.749 0-5.963 4.828-10.797 10.788-10.808h0.001zM50.468 36.964c-7.464 0.002-13.514 6.054-13.514 13.518 0 7.466 6.052 13.518 13.518 13.518s13.518-6.052 13.518-13.518c0-6.966-5.269-12.701-12.039-13.438l-0.060-0.005c-0.41-0.044-0.887-0.069-1.368-0.069-0.019 0-0.039 0-0.058 0h0.003z"/> <path d="M50.486 57.23c-0.001 0-0.002 0-0.003 0-0.746 0-1.35-0.605-1.35-1.35 0 0 0 0 0 0v0-10.808c0-0.746 0.605-1.35 1.35-1.35s1.35 0.605 1.35 1.35v0 10.808c0 0 0 0 0 0 0 0.745-0.603 1.349-1.347 1.35h-0z"/> <path d="M55.889 51.827h-10.808c-0.746 0-1.35-0.605-1.35-1.35s0.605-1.35 1.35-1.35v0h10.808c0.746 0 1.35 0.605 1.35 1.35s-0.605 1.35-1.35 1.35v0z"/> <path d="M28.473 49.43h-2.204l2.183-13.369-6.842 0.011c-0.609-0.005-1.101-0.499-1.101-1.109 0-0.002 0-0.005 0-0.007v0c0.041-0.267 0.127-0.507 0.25-0.723l-0.005 0.010 12.125-20.495 2.24 0.008-2.238 13.391 6.891-0.008c0.002 0 0.004 0 0.006 0 0.604 0 1.094 0.49 1.094 1.094 0 0.256-0.088 0.492-0.236 0.679l0.002-0.002z"/> </symbol><symbol id="built-in" viewBox="0 0 64 64"> <path d="M32 2.667c16.2 0 29.333 13.133 29.333 29.333s-13.133 29.333-29.333 29.333c-16.2 0-29.333-13.133-29.333-29.333v0c0.019-16.193 13.141-29.314 29.331-29.333h0.002zM32 0c-17.673 0-32 14.327-32 32s14.327 32 32 32c17.673 0 32-14.327 32-32v0c0-17.673-14.327-32-32-32v0z"/> <path d="M29.813 49.613h-2.175l2.151-13.2-6.759 0.009c-0.601-0.005-1.087-0.493-1.087-1.095 0-0.002 0-0.004 0-0.006v0c0.040-0.263 0.124-0.5 0.245-0.713l-0.005 0.010 11.973-20.233 2.212 0.009-2.205 13.22 6.803-0.008c0.6 0.004 1.085 0.491 1.085 1.092 0 0.003 0 0.007-0 0.010v-0c-0.005 0.246-0.091 0.47-0.232 0.649l0.002-0.002z"/> </symbol><symbol id="sidebar-toggle" viewBox="0 0 64 64"> <path d="M36.032 7.9c0.985-0.996 2.624-0.996 3.643 0 0.985 0.963 0.985 2.565 0 3.526l-18.471 18.060h40.246c1.421 0.002 2.55 1.107 2.55 2.496s-1.129 2.529-2.55 2.529h-40.246l18.471 18.026c0.985 0.996 0.985 2.601 0 3.562-1.019 0.996-2.66 0.996-3.643 0l-22.844-22.336c-1.019-0.963-1.019-2.565 0-3.526l22.844-22.338z"/> <path d="M2.071 3.012c1.144 0 2.071 0.927 2.071 2.071v53.835c0 1.144-0.927 2.071-2.071 2.071s-2.071-0.927-2.071-2.071v-53.835c0-1.144 0.927-2.071 2.071-2.071z"/> </symbol><symbol id="menu" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M2.133 13.867h59.733c1.178 0 2.133 0.955 2.133 2.133v2.133c0 1.178-0.955 2.133-2.133 2.133h-59.733c-1.178 0-2.133-0.955-2.133-2.133v-2.133c0-1.178 0.955-2.133 2.133-2.133z"/> <path d="M2.133 28.8h59.733c1.178 0 2.133 0.955 2.133 2.133v2.133c0 1.178-0.955 2.133-2.133 2.133h-59.733c-1.178 0-2.133-0.955-2.133-2.133v-2.133c0-1.178 0.955-2.133 2.133-2.133z"/> <path d="M2.133 43.733h59.733c1.178 0 2.133 0.955 2.133 2.133v2.133c0 1.178-0.955 2.133-2.133 2.133h-59.733c-1.178 0-2.133-0.955-2.133-2.133v-2.133c0-1.178 0.955-2.133 2.133-2.133z"/> </symbol><symbol id="wrench" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M64 18.267c0 1.608-0.214 3.21-0.636 4.767l0.008 0.169c0.028 0.598-0.186 1.18-0.592 1.619-2.713 7.035-9.527 11.712-17.107 11.712-1.852 0-3.671-0.275-5.427-0.819l-25.943 25.854c-1.573 1.567-3.667 2.431-5.889 2.431s-4.318-0.864-5.89-2.431l-0.087-0.087c-3.25-3.238-3.25-8.508 0-11.747l23.75-23.669c0.66-0.657 1.046-1.529 1.090-2.456l0.173-3.404c-0.070-0.657-0.105-1.308-0.105-1.939 0-10.074 8.221-18.267 18.327-18.267 3.298 0 6.532 0.883 9.353 2.555 0.602 0.357 1.005 0.979 1.083 1.675 0.011 0.098 0.017 0.161 0.020 0.237 0.044 1.158-0.297 1.536-9.858 10.586l3.847 3.921c1.149-1.058 3.185-2.929 8.997-8.27 0.542-0.497 1.293-0.697 2.010-0.534 0.719 0.163 1.311 0.668 1.583 1.351 0.856 2.147 1.291 4.418 1.292 6.745zM59.819 22.4c0.395-1.346 0.595-2.737 0.594-4.132 0-1.194-0.141-2.367-0.422-3.507-2.922 2.685-8.959 8.231-9.040 8.307-0.536 0.494-1.37 0.474-1.88-0.046l-6.953-7.087c-0.252-0.258-0.39-0.605-0.384-0.965s0.158-0.702 0.42-0.95c2.985-2.825 7.47-7.107 9.54-9.166-1.884-0.84-3.936-1.278-6.022-1.278-8.129 0-14.742 6.59-14.742 14.691 0 0.533 0.032 1.090 0.096 1.654 0.007 0.071 0.010 0.142 0.007 0.214l-0.174 3.646c-0.087 1.818-0.847 3.528-2.138 4.816l-23.75 23.668c-1.85 1.844-1.85 4.844 0 6.688l0.087 0.087c0.897 0.893 2.088 1.385 3.356 1.385s2.46-0.492 3.355-1.385l26.429-26.338c0.2-0.199 0.419-0.39 0.693-0.601 0.377-0.292 0.882-0.363 1.326-0.187 1.743 0.692 3.578 1.044 5.456 1.044 6.243 0 11.831-3.943 13.905-9.811 0.044-0.126 0.107-0.244 0.187-0.351-0.002-0.134 0.016-0.268 0.054-0.396z"/> </symbol><symbol id="template" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><path d="M1.44 0h62.56v64h-64v-64h1.44zM20.64 60.88v-39.52h-17.76v39.6h17.76zM23.44 21.36v39.6h37.44v-39.6h-37.44zM2.88 18.24h58.080v-15.36h-58.080v15.36z"/></symbol><symbol id="learn" viewBox="0 0 64 64"> <path d="M57.674 35.257c0 1.779 1.416 3.221 3.163 3.221s3.163-1.442 3.163-3.221c0-1.155-0.602-2.16-1.498-2.728v-8.973c0-0.682-0.401-1.297-1.018-1.563l-29.585-12.716c-0.413-0.178-0.881-0.178-1.295 0l-29.586 12.716c-0.617 0.265-1.018 0.881-1.018 1.563s0.401 1.297 1.018 1.562l6.662 2.863v17.587c0 4.624 7.288 9.29 23.571 9.29s23.571-4.666 23.571-9.29v-17.587l4.349-1.869v6.417c-0.896 0.569-1.497 1.573-1.497 2.728zM51.491 45.567c0 1.575-4.797 5.898-20.24 5.898s-20.24-4.323-20.24-5.898v-16.155l19.593 8.421c0.207 0.089 0.427 0.134 0.647 0.134s0.441-0.045 0.647-0.134l19.593-8.421v16.155zM31.251 34.43l-25.303-10.875 25.303-10.875 25.302 10.875-25.302 10.875z"/> </symbol><symbol id="examples-flyout" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 20"><g><path d="M20 19.3a.9.9 0 1 1 0-1.7 1.9 1.9 0 0 0 1.9-1.9v-3a3.6 3.6 0 0 1 1.3-2.7 3.6 3.6 0 0 1-1.3-2.8v-3A1.9 1.9 0 0 0 20 2.3a.9.9 0 1 1 0-1.7 3.6 3.6 0 0 1 3.6 3.6v3a1.9 1.9 0 0 0 2 2v1.6a1.9 1.9 0 0 0-2 2v3a3.6 3.6 0 0 1-3.6 3.5zm-14 0a3.6 3.6 0 0 1-3.6-3.6v-3a1.9 1.9 0 0 0-2-1.9V9.1a1.9 1.9 0 0 0 2-1.9v-3A3.6 3.6 0 0 1 6 .6a.9.9 0 1 1 0 1.8A1.9 1.9 0 0 0 4 4.2v3A3.6 3.6 0 0 1 2.8 10a3.6 3.6 0 0 1 1.3 2.7v3A1.9 1.9 0 0 0 6 17.6a.9.9 0 1 1 0 1.7z"/><g transform="translate(5.8 8.5)"><circle cx="12.3" cy="1.4" r="1.4"/><circle cx="7.3" cy="1.4" r="1.4"/><circle cx="2.2" cy="1.4" r="1.4"/></g></g></symbol><symbol id="components-flyout" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 22"><path d="M8.7 17l-2.5-2.2-4-3.5-.9-.8v1l2.5-2.2 4-3.5 1-.8c.2-.3.2-.8 0-1a.8.8 0 0 0-1.2 0L5.1 6l-4 3.6-.8.8c-.3.2-.3.8 0 1l2.5 2.2 4 3.6.8.8c.3.2.8.3 1.1 0 .3-.3.3-.8 0-1.1zM19.3 5l2.5 2.2 4 3.5.9.8v-1l-2.5 2.2-4 3.5-.9.8c-.3.3-.3.8 0 1 .3.4.8.3 1 0L23 16l4-3.6.9-.8c.3-.2.3-.8 0-1l-2.5-2.3-4-3.5-1-.8c-.2-.3-.7-.3-1 0-.3.3-.3.8 0 1zm-8 16.4l.7-2 1.6-5a3563.7 3563.7 0 0 1 2-5.8l1.7-5.1.8-2.5c.2-.4-.1-.9-.5-1a.8.8 0 0 0-1 .6c-.1.7-.4 1.3-.6 2l-1.6 4.9-2 5.9-1.7 5-.8 2.6c-.2.4.1.8.5 1a.8.8 0 0 0 1-.6z"/></symbol><symbol id="guides-documents" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 31 32"><path d="M6.7 28H1.2c-.4 0-.6-.4-.6-.8L.5.7c0-.4.3-.7.7-.7h21.1c.5 0 .7.3.7.7V2c0 .5-.2.7-.7.7-.4 0-.6-.2-.6-.7v-.6H1.8L2 26.6h4.8c.4 0 .7.2.7.6 0 .4-.3.7-.7.7z"/><path d="M8 6.8H6c-.4 0-.7-.3-.7-.7 0-.4.3-.7.7-.7h2c.5 0 .7.3.7.7 0 .4-.2.7-.7.7zM8 10.9H6c-.4 0-.7-.3-.7-.7 0-.4.3-.7.7-.7h2c.5 0 .7.3.7.7 0 .4-.2.7-.7.7zM8 15H6c-.4 0-.7-.3-.7-.7 0-.4.3-.7.7-.7h2c.5 0 .7.3.7.7 0 .4-.2.7-.7.7zM8 19H6c-.4 0-.7-.2-.7-.6 0-.4.3-.7.7-.7h2c.5 0 .7.3.7.7 0 .4-.2.7-.7.7z"/><path d="M29.8 4H8.7c-.5 0-.7.4-.7.8v26.5c0 .4.3.7.7.7h21.1c.4 0 .7-.3.7-.7V4.8c0-.4-.3-.7-.7-.7zm-.6 26.6H9.4V5.4h19.8v25.2z"/><path d="M18.1 22.8h-.6l.6-3.8h-1.9c-.2 0-.3-.1-.3-.3v-.2l3.4-5.8h.7l-.7 3.8h2c.2 0 .3.1.3.3v.2L18 22.8z"/></symbol><symbol id="start" viewBox="0 0 64 64"> <path d="M63.195 1.874c-0.143-0.52-0.549-0.926-1.069-1.069-10.765-2.978-20.385 2.978-24.355 6.948l-11.452 11.452-5.421-1.756c-3.551-1.163-7.454-0.217-10.078 2.443l-3.359 3.359c-0.582 0.594-0.582 1.544 0 2.138l7.329 7.329-4.199 6.948c-0.343 0.593-0.25 1.342 0.229 1.832l11.681 11.605c0.471 0.504 1.223 0.63 1.832 0.305l6.948-4.123h0.076l7.329 7.329c0.594 0.582 1.544 0.582 2.138 0l3.359-3.359c2.66-2.624 3.606-6.527 2.443-10.078l-1.756-5.421 11.452-11.452c3.894-4.047 9.849-13.666 6.871-24.431zM23.799 50.126l-9.925-9.925 3.13-5.268 12.063 12.063-5.268 3.13zM54.109 24.015l-12.139 12.139c-0.4 0.399-0.547 0.987-0.382 1.527l2.061 6.337c0.783 2.448 0.136 5.128-1.68 6.948l-2.29 2.29-29.012-29.012 2.29-2.29c1.819-1.815 4.5-2.463 6.948-1.68l6.337 2.061c0.54 0.165 1.128 0.018 1.527-0.382l12.216-12.063c3.436-3.359 11.452-8.398 20.461-6.337 2.061 9.085-2.978 17.102-6.337 20.461z"/> <path d="M10.667 51.195l-9.009 9.009c-0.478 0.358-0.703 0.963-0.576 1.547s0.583 1.040 1.167 1.167c0.584 0.127 1.188-0.098 1.547-0.576l9.009-9.009c0.456-0.608 0.396-1.459-0.142-1.996s-1.388-0.598-1.996-0.142z"/> <path d="M11.66 63.563c0.594 0.582 1.544 0.582 2.138 0l4.581-4.581c0.456-0.608 0.395-1.459-0.142-1.996s-1.388-0.598-1.996-0.142l-4.581 4.581c-0.582 0.594-0.582 1.544 0 2.138z"/> <path d="M1.505 52.798c0.403-0.006 0.787-0.17 1.069-0.458l4.581-4.581c0.478-0.358 0.703-0.963 0.576-1.547s-0.583-1.040-1.167-1.167c-0.584-0.127-1.188 0.098-1.547 0.576l-4.581 4.581c-0.428 0.436-0.554 1.086-0.322 1.65s0.78 0.937 1.391 0.945z"/> <path d="M43.726 13.021c-2.003 2.003-2.003 5.25 0 7.253s5.25 2.003 7.253 0c2.003-2.003 2.003-5.25 0-7.253s-5.25-2.003-7.253 0zM48.841 18.136c-0.699 0.692-1.79 0.794-2.605 0.243s-1.127-1.601-0.745-2.508c0.382-0.907 1.351-1.417 2.315-1.219s1.653 1.050 1.646 2.033c-0.004 0.545-0.223 1.067-0.611 1.451z"/> </symbol><symbol id="amp-email" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <defs> <linearGradient id="gradient-email" x1="76.2776137%" x2="20.8316146%" y1="-25.8400575%" y2="121.578822%"> <stop offset="0%" stop-color="#F1F068"/> <stop offset="46.2139774%" stop-color="#96D64F"/> <stop offset="100%" stop-color="#2DB932"/> </linearGradient> </defs> <path d="M64 14.080c0-3.291-2.56-5.851-5.851-5.851h-52.297c-3.291 0-5.851 2.56-5.851 5.851v35.84c0 3.291 2.56 5.851 5.851 5.851h52.297c3.291 0 5.851-2.56 5.851-5.851v-35.84zM5.851 11.154h52.297c0.183 0 0.366 0 0.549 0l-24.503 25.417c-0.549 0.549-1.28 0.914-2.194 0.914-0.731 0-1.646-0.366-2.194-0.914l-24.32-25.417c0 0 0.183 0 0.366 0zM2.926 14.080c0-0.366 0-0.731 0.183-1.097l15.36 16.091-15.543 19.2v-34.194zM58.149 52.846h-52.297c-0.731 0-1.646-0.366-2.194-0.914l16.823-20.663 7.131 7.497c1.097 1.097 2.56 1.829 4.206 1.829s3.109-0.731 4.206-1.829l6.583-6.949 17.371 20.114c-0.366 0.549-1.097 0.914-1.829 0.914v0zM61.074 48.274l-16.091-18.834 15.909-16.64c0.183 0.366 0.183 0.731 0.183 1.097v34.377z"/> </symbol><symbol id="amp-ads" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <defs> <linearGradient id="gradient-ads" x1="100%" x2="14.5415777%" y1="0%" y2="123.368881%"> <stop offset="0%" stop-color="#FF52E1"/> <stop offset="100%" stop-color="#5500D7"/> </linearGradient> </defs> <path d="M56.399 14.68c3.654-3.846 9.616-10.963 6.924-13.847-2.885-2.885-10.001 3.269-13.847 6.731l-0.577-0.577c-0.385-0.385-0.962-0.577-1.539-0.385l-15.963 3.077c-0.385 0-0.577 0.192-0.769 0.385l-30.195 30.195c-0.577 0.577-0.577 1.731 0 2.308l20.963 20.963c0.385 0.385 0.769 0.385 1.154 0.385s0.769-0.192 1.154-0.385l30.003-30.003c0.192-0.192 0.385-0.577 0.385-0.769v0l3.077-15.963c0.192-0.577 0-1.154-0.385-1.539l-0.385-0.577zM53.899 16.988l-2.885 14.424-28.464 28.656-18.655-18.655 28.656-28.656 14.424-2.885c-1.539 1.731-4.039 4.423-5.962 7.116-1.923-0.192-3.654 0.385-5.193 1.923-2.5 2.5-2.5 6.731 0 9.232s6.731 2.5 9.232 0c1.346-1.346 2.116-3.27 1.923-5.193-0.192-1.154-0.577-2.308-1.154-3.077-0.192-0.385-0.385-0.577-0.769-0.769-0.192-0.192-0.577-0.577-0.769-0.769 1.154-1.731 2.885-3.654 5.193-5.962l2.5 2.5 1.923 2.116zM43.321 24.873c-0.192 0.385-0.385 0.577-0.577 0.962-1.346 1.346-3.27 1.346-4.616 0s-1.346-3.27 0-4.616c0.192-0.192 0.577-0.385 0.962-0.577 1.154-0.577 2.308-0.385 3.462 0.385 0.192 0 0.192 0.192 0.385 0.192 0 0 0.192 0.192 0.192 0.385 0.577 0.962 0.769 2.116 0.192 3.27zM54.091 12.372l-2.5-2.5c4.039-3.846 7.308-5.77 8.847-6.347-0.577 1.539-2.5 4.616-6.347 8.847z"/> </symbol><symbol id="amp-stories" viewBox="0 0 36 32"> <defs> <linearGradient id="gradient-stories" x1="81.726943%" x2="23.7165981%" y1="-28.3832685%" y2="119.978062%"> <stop offset="0%" stop-color="#FFF300"/> <stop offset="100%" stop-color="#FF8F00"/> </linearGradient> </defs> <path d="M7.111 0h21.333v32h-21.333v-32zM9.481 2.37v27.259h16.593v-27.259h-16.593zM0 4.741h2.37v22.519h-2.37v-22.519zM33.185 4.741h2.37v22.519h-2.37v-22.519z"/> </symbol><symbol id="amp-websites" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <defs> <linearGradient id="gradient-websites" x1="81.8129399%" x2="33.8766928%" y1="0%" y2="94.4849088%"> <stop offset="0%" stop-color="#00DCC0"/> <stop offset="100%" stop-color="#005AF0"/> </linearGradient> </defs> <path d="M63.196 4.646h-62.253c-0.566 0-0.943 0.377-0.943 0.755v53.010c0 0.566 0.377 0.943 0.943 0.943h62.253c0.566 0 0.755-0.377 0.755-0.755v-53.198c0.189-0.377-0.189-0.755-0.755-0.755zM3.395 18.040h57.348v33.202h-57.348v-33.202zM60.744 7.853v6.98h-57.348v-6.98h57.348zM3.395 56.147v-1.509h57.348v1.509h-57.348zM9.055 7.853c1.132 0 1.886 0.754 1.886 1.886s-0.755 1.886-1.886 1.886-1.886-0.755-1.886-1.886 0.943-1.886 1.886-1.886zM12.828 7.853c1.132 0 1.886 0.754 1.886 1.886s-0.755 1.886-1.886 1.886-1.886-0.755-1.886-1.886 0.943-1.886 1.886-1.886zM18.487 7.853c1.132 0 1.886 0.754 1.886 1.886s-0.755 1.886-1.886 1.886-1.886-0.755-1.886-1.886 0.943-1.886 1.886-1.886zM51.123 39.734l-11.13-13.96c-0.189-0.189-0.377-0.377-0.755-0.377v0c-0.189 0-0.566 0-0.755 0.377l-8.3 9.621-4.716-6.225c-0.189-0.189-0.377-0.377-0.755-0.377s-0.566 0-0.755 0.377l-8.866 10.376c-0.377 0.377-0.189 0.943 0 1.132s0.377 0.189 0.566 0.189c0.189 0 0.566 0 0.754-0.377l8.3-9.621 4.528 5.471-2.452 3.018c-0.377 0.377-0.189 0.943 0 1.132 0.377 0.189 0.943 0.189 1.132 0l11.319-13.017 10.376 13.205c0.189 0.189 0.377 0.377 0.755 0.377 0.189 0 0.377 0 0.566-0.189 0.377-0.377 0.566-0.943 0.189-1.132zM27.165 26.718c1.509 0 2.641-1.132 2.641-2.641 0-1.321-1.132-2.641-2.641-2.641s-2.641 1.132-2.641 2.641c0 1.509 1.132 2.641 2.641 2.641zM27.165 23.322c0.566 0 0.943 0.377 0.943 0.943s-0.377 0.943-0.943 0.943-0.943-0.377-0.943-0.943c0-0.566 0.377-0.943 0.943-0.943z"/> </symbol><symbol id="angle-down-solid" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"> <path d="M56.293 16.003c1.761-1.645 4.553-1.645 6.314 0 1.857 1.734 1.857 4.623 0 6.357l-27.45 25.638c-1.761 1.645-4.553 1.645-6.314 0l-27.45-25.638c-0.899-0.839-1.393-1.963-1.393-3.178s0.494-2.339 1.393-3.178c1.761-1.645 4.553-1.645 6.314 0l24.293 22.689 24.293-22.689z"/> </symbol><symbol id="logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30"><g fill="none" fill-rule="evenodd"><path fill="#FFF" d="M0 15c0 8.284 6.716 15 15 15 8.285 0 15-6.716 15-15 0-8.284-6.715-15-15-15C6.716 0 0 6.716 0 15z"/><path fill="#005AF0" fill-rule="nonzero" d="M13.85 24.098h-1.14l1.128-6.823-3.49.005h-.05a.57.57 0 0 1-.568-.569c0-.135.125-.363.125-.363l6.272-10.46 1.16.005-1.156 6.834 3.508-.004h.056c.314 0 .569.254.569.568 0 .128-.05.24-.121.335L13.85 24.098zM15 0C6.716 0 0 6.716 0 15c0 8.284 6.716 15 15 15 8.285 0 15-6.716 15-15 0-8.284-6.715-15-15-15z"/></g></symbol> </defs> </svg> <header class="ap--header " [class]="'ap--header ' + (mainmenuopen ? 'mainmenuopen' : '')" i-amphtml-binding> <div class="ap-o-header"> <a class="ap-o-header-home" href="/ja/"> <svg class="ap-o-header-home-logo"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#logo"/></svg> <span class="ap-o-header-home-title">AMP</span> </a> <nav class="ap-o-header-main"> <div class="ap-o-header-main-item"> <button class="ap-o-header-main-link -tw "> AMP について <div class="ap-a-ico ap-o-header-main-link-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </button> <ul class="ap-o-header-flyout"> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link websites" href="/ja/about/websites/"> <div class="ap-o-header-flyout-primary-item-link-icon websites"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-websites"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info ap-o-header-flyout-primary-item-link-info-websites"> <div class="ap-o-header-flyout-item-title">AMP ウェブサイト</div> <div class="ap-o-header-flyout-item-description">完璧なウェブ体験をもたらします</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link stories" href="/ja/about/stories/"> <div class="ap-o-header-flyout-primary-item-link-icon stories"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-stories"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info ap-o-header-flyout-primary-item-link-info-stories"> <div class="ap-o-header-flyout-item-title">Web Stories</div> <div class="ap-o-header-flyout-item-description">誰もが気軽に楽しめるストーリー</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link ads" href="/ja/about/ads/"> <div class="ap-o-header-flyout-primary-item-link-icon ads"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-ads"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info ap-o-header-flyout-primary-item-link-info-ads"> <div class="ap-o-header-flyout-item-title">AMP 広告</div> <div class="ap-o-header-flyout-item-description">超高速なウェブ広告</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link email" href="/ja/about/email/"> <div class="ap-o-header-flyout-primary-item-link-icon email"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-email"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info ap-o-header-flyout-primary-item-link-info-email"> <div class="ap-o-header-flyout-item-title">AMP メール</div> <div class="ap-o-header-flyout-item-description">次世代型メール</div> </div> </a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/about/how-amp-works/">AMP の仕組み</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/about/mission-and-vision/">ビジョンとミッション</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/about/use-cases/">使用事例</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/success-stories/">成功事例</a> </li> </ul> </div> <div class="ap-o-header-main-item"> <button class="ap-o-header-main-link -tw "> ドキュメント <div class="ap-a-ico ap-o-header-main-link-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </button> <ul class="ap-o-header-flyout"> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/documentation/">スタートガイド</a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/guides-and-tutorials/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#guides-documents"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">ガイドとチュートリアル</div> <div class="ap-o-header-flyout-item-description">AMP を使い始める</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/components/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#components-flyout"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">コンポーネント</div> <div class="ap-o-header-flyout-item-description">AMP ライブラリ一式</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/examples/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#examples-flyout"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">実例</div> <div class="ap-o-header-flyout-item-description">Hands-on introduction to AMP</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/courses/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#learn"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">コース</div> <div class="ap-o-header-flyout-item-description">無料の AMP 学習コース</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/templates/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#template"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">テンプレート</div> <div class="ap-o-header-flyout-item-description">すぐに使えます</div> </div> </a> </li> <li class="ap-o-header-flyout-primary-item"> <a class="ap-o-header-flyout-primary-item-link " href="/ja/documentation/tools/"> <div class="ap-o-header-flyout-primary-item-link-icon "> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#wrench"/></svg> </div> <div class="ap-o-header-flyout-primary-item-link-info"> <div class="ap-o-header-flyout-item-title">ツール</div> <div class="ap-o-header-flyout-item-description">構築を始めましょう</div> </div> </a> </li> </ul> </div> <div class="ap-o-header-main-item"> <button class="ap-o-header-main-link -tw "> コミュニティ <div class="ap-a-ico ap-o-header-main-link-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </button> <ul class="ap-o-header-flyout"> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/documentation/guides-and-tutorials/contribute/">貢献</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/community/roadmap/">ロードマップ</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/community/governance/">ガバナンス</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/community/working-groups/access-subscriptions/">ワーキンググループ</a> </li> </ul> </div> <div class="ap-o-header-main-item"> <button class="ap-o-header-main-link -tw "> イベント <div class="ap-a-ico ap-o-header-main-link-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </button> <ul class="ap-o-header-flyout"> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/events/amp-fest-2020/">AMP Fest 2020</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/events/amp-roadshow/">AMP ロードショー</a> </li> </ul> </div> <div class="ap-o-header-main-item"> <a class="ap-o-header-main-link -tw" href="https://blog.amp.dev">ブログ</a> </div> <div class="ap-o-header-main-item"> <button class="ap-o-header-main-link -tw "> サポート <div class="ap-a-ico ap-o-header-main-link-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </button> <ul class="ap-o-header-flyout"> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/support/">ヘルプ</a> </li> <li class="ap-o-header-flyout-item-secondary"> <a class="ap-o-header-flyout-item-title secondary" href="/ja/support/faq/">よくある質問</a> </li> </ul> </div> </nav> <div class="-tv"> <span class="-tm" aria-label="言語を選択してください" tabindex="-1"> <span class="-tw">JA</span> <div class="ap-a-ico -ty"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </div> </span> <input class="-tg" type="checkbox" name="language-selector"> <div class="-tb" role="list"> <a class="-tw" href="/documentation/components/" role="listitem">English</a> <a class="-tw" href="/de/documentation/components/" role="listitem">Deutsch</a> <a class="-tw" href="/fr/documentation/components/" role="listitem">Français</a> <a class="-tw" href="/ar/documentation/components/" role="listitem">العربية</a> <a class="-tw" href="/es/documentation/components/" role="listitem">Español</a> <a class="-tw" href="/it/documentation/components/" role="listitem">Italiano</a> <a class="-tw" href="/id/documentation/components/" role="listitem">Indonesia</a> <a class="-tw" href="/ko/documentation/components/" role="listitem">한국어</a> <a class="-tw" href="/pt_br/documentation/components/" role="listitem">Português</a> <a class="-tw" href="/ru/documentation/components/" role="listitem">Русский</a> <a class="-tw" href="/tr/documentation/components/" role="listitem">Türkçe</a> <a class="-tw" href="/zh_cn/documentation/components/" role="listitem">中文</a> <a class="-tw" href="/pl/documentation/components/" role="listitem">Polski</a> <a class="-tw" href="/vi/documentation/components/" role="listitem">Tiếng việt</a> </div> </div> </div> </header> <label class="ap-o-burger-menu-label" on="tap:AMP.setState({mainmenuopen: !mainmenuopen, noScrollState: !noScrollState})" [class]="'ap-o-burger-menu-label ' + (mainmenuopen ? 'mainmenuopen ' : '')" for="burger-menu" tabindex="0" role="button" aria-label="ハンバーガーメニュー" i-amphtml-binding> <div class="ap-a-ico ap-o-burger-menu-icon"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#menu"/></svg> </div> </label> <nav class="ap-o-burger-menu" [class]="mainmenuopen ? 'ap-o-burger-menu mainmenuopen' : 'ap-o-burger-menu'" i-amphtml-binding> <ul class="-th"> <li class="-tp"> <label class="ap-o-burger-menu-link -tw "> AMP について </label> <input class="-td" type="checkbox" aria-label="About"> <span class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> <ul class="-th"> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/websites/"> AMP ウェブサイト </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/stories/"> Web Stories </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/ads/"> AMP 広告 </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/email/"> AMP メール </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/how-amp-works/"> AMP の仕組み </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/mission-and-vision/"> ビジョンとミッション </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/about/use-cases/"> 使用事例 </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/success-stories/"> 成功事例 </a> </li> </ul> </li> <li class="-tp"> <label class="ap-o-burger-menu-link -tw "> ドキュメント </label> <input class="-td" type="checkbox" aria-label="Documentation"> <span class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> <ul class="-th"> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/"> スタートガイド </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/guides-and-tutorials/"> ガイドとチュートリアル </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/components/"> コンポーネント </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/examples/"> 実例 </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/courses/"> コース </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/templates/"> テンプレート </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/tools/"> ツール </a> </li> </ul> </li> <li class="-tp"> <label class="ap-o-burger-menu-link -tw "> コミュニティ </label> <input class="-td" type="checkbox" aria-label="Community"> <span class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> <ul class="-th"> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/documentation/guides-and-tutorials/contribute/"> 貢献 </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/community/roadmap/"> ロードマップ </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/community/governance/"> ガバナンス </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/community/working-groups/access-subscriptions/"> ワーキンググループ </a> </li> </ul> </li> <li class="-tp"> <label class="ap-o-burger-menu-link -tw "> イベント </label> <input class="-td" type="checkbox" aria-label="Events"> <span class="nav-icon"> <svg class="ap-a-ico"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> <ul class="-th"> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/events/amp-fest-2020/"> AMP Fest 2020 </a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tx" href="/ja/events/amp-roadshow/"> AMP ロードショー </a> </li> </ul> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tw" href="https://blog.amp.dev">ブログ</a> </li> <li class="-tp"> <a class="ap-o-burger-menu-link -tw " href="/ja/support/"> ヘルプ </a> </li> </ul> </nav> <div class="-ui"> <amp-position-observer on="enter:slideTransition.start; exit:slideTransition.start,slideTransition.reverse" intersection-ratios="1" layout="nodisplay" class="i-amphtml-layout-nodisplay" hidden="hidden" i-amphtml-layout="nodisplay"> </amp-position-observer> <amp-animation id="slideTransition" layout="nodisplay" class="i-amphtml-layout-nodisplay" hidden="hidden" i-amphtml-layout="nodisplay"> <script type="application/json">{"duration":"150ms","fill":"both","easing":"ease-out","iterations":"1","animations":[{"selector":".label-title","keyframes":[{"transform":"scale3d(0, 1, 1)"},{"transform":"scale3d(1, 1, 1)"}]}]}</script> </amp-animation> </div><main class="ap--main -fv"> <div class="-tf"> <input class="-uu ap-a-sidebar-mobile-toggle-input-sidebar" type="checkbox" name="sidebar" id="sidebar" autocomplete="off"> <input class="-uf ap-a-sidebar-desktop-toggle-input-sidebar" type="checkbox" name="sidebar-desktop" id="sidebar-desktop" autocomplete="off"> <span id="ap--sidebar-content" class="-uc"></span> <section class="-t"> <label class="-uo -ur ap-a-sidebar-mobile-toggle-label-sidebar" for="sidebar" on="tap:sidebar-left.toggle" role="categoriemenutrigger" tabindex="0"> <span class="label-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sidebar-toggle"/></svg></span> <span class="label-title">サイドバーの切り替え</span> </label> <label class="-uo -ul ap-a-sidebar-desktop-toggle-label-sidebar" for="sidebar-desktop" role="categoriemenutrigger-desktop" tabindex="0"> <span class="label-icon"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#sidebar-toggle"/></svg></span> <span class="label-title">サイドバーの切り替え</span> </label> <nav class="-ue"> <a class="ap-m-breadcrumbs-crumb" href="/ja/documentation/">ドキュメント</a> <span class="ap-m-breadcrumbs-divider"> <svg class="ap-a-ico -ut"><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> <a class="ap-m-breadcrumbs-crumb" href="/ja/documentation/components/">コンポーネント</a> </nav> <h1>The AMP Component Catalogue</h1> <p>The AMP HTML library consists of a basic runtime that brings the core functionalities of AMP to your page. If you want to add additional features you can do so by using one or more of the ready-to-use AMP components. They are classified as:</p> <div class="ap--benefits--list"> <div class="-sa"> <div class="-sf"> <svg class="-sf"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#built-in"/> </svg> </div> <div class="-sl"> <span class="-sc">Built-in</span> <span class="-sh">Components that are included in the base library, such as <a href="/ja/documentation/components/amp-img/"><code>amp-img</code></a> and <a href="/ja/documentation/components/amp-pixel/"><code>amp-pixel</code></a>.</span> </div> </div> <div class="-sa"> <div class="-sf"> <svg class="-sf"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#extended"/> </svg> </div> <div class="-sl"> <span class="-sc">Extended</span> <span class="-sh">Extensions to the base library that must be explicitly included in the document as custom elements.</span> </div> </div> <div class="-sa"> <div class="-sf"> <svg class="-sf"> <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#experimental"/> </svg> </div> <div class="-sl"> <span class="-sc">Experimental</span> <span class="-sh">Components that are released but are not yet ready for wide use.</span> </div> </div> </div> <hr> <section class="ap--section"> <h2>Highlighted Components</h2> <div class="-fy"> <div class="-fj"> <div class="-rt -lv"> <a href="/ja/documentation/components/amp-analytics/"> <div class="-rn"> <div class="-op"> <div class="ap-m-tag ap-m-tag-websites"></div> <div class="ap-m-tag ap-m-tag-stories"></div> <div class="ap-m-tag ap-m-tag-ads"></div> </div> <div class="-rs"> <div class="-lm"> <code><span>amp-analytics</span></code> <p>AMP ドキュメントからアナリティクスデータを収集します。</p> </div> </div> </div> </a> </div> <div class="-rt -lv"> <a href="/ja/documentation/components/amp-autocomplete/"> <div class="-rn"> <div class="-op"> <div class="ap-m-tag ap-m-tag-websites"></div> <div class="ap-m-tag ap-m-tag-email"></div> </div> <div class="-rs"> <div class="-lm"> <code><span>amp-autocomplete</span></code> <p>Suggests completed results corresponding to the user input as they type into the input field.</p> </div> </div> </div> </a> </div> <div class="-rt -lv"> <a href="/ja/documentation/components/amp-carousel-v0.2/"> <div class="-rn"> <div class="-op"> <div class="ap-m-tag ap-m-tag-websites"></div> <div class="ap-m-tag ap-m-tag-ads"></div> </div> <div class="-rs"> <div class="-lm"> <code><span>amp-carousel</span></code> <p>Displays multiple similar pieces of content along a horizontal axis.</p> </div> </div> </div> </a> </div> <div class="-rt -lv"> <a href="/ja/documentation/components/amp-ad/"> <div class="-rn"> <div class="-op"> <div class="ap-m-tag ap-m-tag-websites"></div> </div> <div class="-rs"> <div class="-lm"> <code><span>amp-ad</span></code> <p>広告を表示するコンテナです。</p> </div> </div> </div> </a> </div> <div class="-rt -lv"> <a href="/ja/documentation/components/amp-list/"> <div class="-rn"> <div class="-op"> <div class="ap-m-tag ap-m-tag-websites"></div> <div class="ap-m-tag ap-m-tag-stories"></div> <div class="ap-m-tag ap-m-tag-email"></div> </div> <div class="-rs"> <div class="-lm"> <code><span>amp-list</span></code> <p>データを動的にダウンロードし、テンプレートを使用してリスト項目を作成します。</p> </div> </div> </div> </a> </div> </div> </div> </section> <section id="filter" class="ap-m-table-component-container"> <h2>Filter by category</h2> <div class="ap-o-filter-bubbles-list"> <a class="ap-a-pill filtered" href="/ja/documentation/components/#filter" name="all"> すべて </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=ads-analytics#filter" name="広告分析"> 広告分析 </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=dynamic-content#filter" name="動的コンテンツ"> 動的コンテンツ </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=layout#filter" name="レイアウト"> レイアウト </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=media#filter" name="メディア"> メディア </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=presentation#filter" name="プレゼンテーション"> プレゼンテーション </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=social#filter" name="ソーシャル"> ソーシャル </a> <a class="ap-a-pill " href="/ja/documentation/components/?category=social-login#filter" name="social login"> social login </a> </div> <div id="ads-analytics" class="ap-m-table-component"> <h4 id="ads-analytics">広告分析</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-ad-custom/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-ad-custom</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Alternative way to serve valid AMPHTML ads.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-ad-exit/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-ad-exit</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides configurable behavior for ad exits for AMPHTML ads.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-ad/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-ad</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">広告を表示するコンテナです。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-analytics/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-analytics</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">AMP ドキュメントからアナリティクスデータを収集します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-auto-ads/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-auto-ads</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">リモートで提供される設定ファイルを使用して、AMP ページに広告を動的に挿入します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-call-tracking/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-call-tracking</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Dynamically replaces a phone number in a hyperlink to enable call tracking.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-experiment/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-experiment</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Used to conduct user experience experiments on AMP pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-pixel/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-pixel</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">ページビューをカウントするトラッキングピクセルです。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-social-share/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-social-share</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">共有トラッキング機能を開発中です。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-sticky-ad/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-sticky-ad</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a way to display and stick ad content at the bottom of the page.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-auto-analytics/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-auto-analytics</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Automatically generates analytics configs for stories.</div> </div> </div> </a> </div> <div id="dynamic-content" class="ap-m-table-component"> <h4 id="dynamic-content">動的コンテンツ</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-access-laterpay/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-access-laterpay</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">このコンポーネントにより、サイト運営者は LaterPay マイクロペイメントプラットフォームと簡単に統合できます。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-access-poool/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-access-poool</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Poool paywall.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-access-scroll/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-access-scroll</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Integrates with Scroll membership.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-access/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-access</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">AMP ペイウォールとサブスクリプションのサポートを提供します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-action-macro/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-action-macro</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Creates reusable actions.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-autocomplete/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-autocomplete</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Suggests completed results corresponding to the user input as they...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-bind/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-bind</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">データバインディングや JS に似た単純な式を使用して、ユーザーの操作やデータの変更に応じた要素の変更を可能にします。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-byside-content/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-byside-content</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays dynamic content from the BySide service.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-consent/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-consent</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides the ability to collect and store a user's consent through...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-date-picker/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-date-picker</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a widget to select dates. The date picker can render as...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-form/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-form</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Allows you to create forms to submit input fields in an AMP document.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-geo/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-geo</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides an approximate country-level geolocation interface.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-gist/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-gist</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Creates an iframe and displays a GitHub Gist.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-google-document-embed/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-google-document-embed</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a document file supported by Google Drive.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-inputmask/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-inputmask</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides input masking capabilities to inputs in AMP forms</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-install-serviceworker/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-install-serviceworker</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Installs a ServiceWorker for the current page.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-link-rewriter/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-link-rewriter</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Allows publishers to rewrite URL based on configurable pattern</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-list/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-list</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">データを動的にダウンロードし、テンプレートを使用してリスト項目を作成します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-live-list/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-live-list</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a way to display and update content live.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-minute-media-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-minute-media-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Minute Media player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-mraid/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-mraid</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Supports interaction with the MRAID host API within Ad webviews in...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-mustache/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-mustache</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Mustache.js テンプレートのレンダリングを可能にします。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-next-page/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-next-page</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Infinite scrolling experience for document-level page recommendations.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-recaptcha-input/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-recaptcha-input</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Appends a reCAPTCHA v3 token to AMP form submissions.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-render/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-render</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Renders remote or inline data using a template.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-script/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-script</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Runs custom JavaScript in a Web Worker.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-selector/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-selector</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">オプションのメニューを提示し、ユーザーに選択を求めるコントロールを表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-smartlinks/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-smartlinks</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Run Narrativ's Linkmate process inside your AMP page</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-interactive/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-interactive</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A rich set of interactive experiences for stories, including...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-subscriptions-google/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-subscriptions-google</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Implements subscription-style access protocol for Subscribe with Google.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-subscriptions/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-subscriptions</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Implements subscription-style access protocol.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-user-notification/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-user-notification</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a dismissable notification to the user.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-video-docking/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-video-docking</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Functionality for videos that minimize ("dock") to a corner or a...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-web-push/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-web-push</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Allows users to subscribe to web push notifications.</div> </div> </div> </a> </div> <div id="layout" class="ap-m-table-component"> <h4 id="layout">レイアウト</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-accordion/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-accordion</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">閲覧者がコンテンツの概要を一目で把握し、選択した任意のセクションにジャンプできるようにします。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-app-banner/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-app-banner</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A wrapper and minimal UI for a cross-platform, fixed-position...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-base-carousel/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-base-carousel</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays multiple similar pieces of content along a horizontal...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-carousel/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-carousel</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">横軸に沿って複数の類似コンテンツを表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-fx-collection/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-fx-collection</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a collection of preset visual effects, such as parallax.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-fx-flying-carpet/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-fx-flying-carpet</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Wraps its children in a unique full-screen scrolling container...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-iframe/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-iframe</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">iframe を表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-image-lightbox/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-image-lightbox</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a lightbox effect for a specified image.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-image-slider/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-image-slider</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A slider to compare two images.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-inline-gallery/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-inline-gallery</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays multiple similar pieces of content along a horizontal...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-layout/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-layout</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">The amp-layout` component allows you to apply aspect-ratio based...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-lightbox-gallery/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-lightbox-gallery</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides a "lightbox” experience. Upon user interaction, a UI...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-lightbox/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-lightbox</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">フルビューポートの「ライトボックス」モーダル内に要素を表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-mega-menu/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-mega-menu</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays top-level navigational content inside expandable containers.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-nested-menu/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-nested-menu</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a drilldown menu with arbitrary levels of nested submenus.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-orientation-observer/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-orientation-observer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Monitors the orientation of an element within the viewport as a...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-position-observer/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-position-observer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Monitors the position of an element within the viewport as a user...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-sidebar/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-sidebar</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">一時的なアクセスを目的としたメタコンテンツ（ナビゲーション、リンク、ボタン、メニューなど）を表示できます。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-stream-gallery/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-stream-gallery</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays multiple similar pieces of content at a time along a...</div> </div> </div> </a> </div> <div id="media" class="ap-m-table-component"> <h4 id="media">メディア</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-3d-gltf/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-3d-gltf</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">GL Transmission Format（glTF）の 3D モデルを表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-3q-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-3q-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds videos from 3Q SDN.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-anim/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-anim</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Manages an animated image, typically a GIF.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-apester-media/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-apester-media</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Apester smart unit.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-audio/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-audio</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Replaces the HTML5 audio tag.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-bodymovin-animation/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-bodymovin-animation</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an AirBnB Bodymovin animation player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-brid-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-brid-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Brid.tv player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-brightcove/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-brightcove</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Brightcove Video Cloud or Perform player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-connatix-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-connatix-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a cloud-hosted Connatix Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-dailymotion/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-dailymotion</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Dailymotion video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-delight-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-delight-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">The amp-delight-player element displays a cloud-hosted Delight Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-embedly-card/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-embedly-card</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Embedly card.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-google-read-aloud-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-google-read-aloud-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds the Google Read Aloud Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-hulu/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-hulu</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an embedded Hulu video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-ima-video/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-ima-video</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds a video player for instream video ads that are integrated...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-img/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-img</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">HTML5 の img タグを置き換えます。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-imgur/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-imgur</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Imgur post.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-izlesene/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-izlesene</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Izlesene video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-jwplayer/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-jwplayer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a cloud-hosted JW Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-kaltura-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-kaltura-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays the Kaltura Player as used in Kaltura's Video Platform.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-megaphone/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-megaphone</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Megaphone.fm podcast episode or playlist.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-mowplayer/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-mowplayer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a cloud-hosted Mow Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-nexxtv-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-nexxtv-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a media stream from the nexxOMNIA platform.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-o2-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-o2-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an AOL O2Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-ooyala-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-ooyala-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Ooyala video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-playbuzz/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-playbuzz</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays any Playbuzz item content (e.g., list, poll, etc.).</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-powr-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-powr-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">An amp-powr-player component displays the Powr Player as...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-reach-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-reach-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Beachfront Reach video player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-skimlinks/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-skimlinks</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Run skimlinks inside your AMP page.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-soundcloud/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-soundcloud</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Soundcloud clip.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-springboard-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-springboard-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Springboard Platform video player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-360/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-360</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds 360 images and videos, explorable by gyroscope or...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-panning-media/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-panning-media</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Transition an image's position and zoom between pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-video-iframe/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-video-iframe</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds an iframe containing a video player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-video/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-video</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">HTML5 video タグの代替機能です。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-vimeo/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-vimeo</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Vimeo video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-viqeo-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-viqeo-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Viqeo video player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-wistia-player/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-wistia-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Wistia video.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-yotpo/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-yotpo</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds a Yotpo on-site widget.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-youtube/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-youtube</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">YouTube 動画を表示します。</div> </div> </div> </a> </div> <div id="presentation" class="ap-m-table-component"> <h4 id="presentation">プレゼンテーション</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-access-fewcents/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-access-fewcents</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Allows publishers to integrate with the Fewcents micropayments platform.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-animation/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-animation</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">アニメーションを定義して表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-date-countdown/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-date-countdown</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a countdown sequence to a specified date.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-date-display/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-date-display</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">The amp-date-display component displays time data that you can...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-dynamic-css-classes/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-dynamic-css-classes</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Adds several dynamic CSS class names onto the <body> element.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-fit-text/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-fit-text</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Expands or shrinks font size to fit the content within the space given.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-font/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-ads ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-font</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Trigger and monitor the loading of custom fonts on AMP pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-mathml/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-mathml</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a MathML formula.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-pan-zoom/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-pan-zoom</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides zooming and panning for arbitrary content.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-slikeplayer/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-slikeplayer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a cloud-hosted Slike Player.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-animation/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-animation</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A component for configuring custom animations in amp-story.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-audio-sticker/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-audio-sticker</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A sticker for users to click and unmute the story.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-auto-ads/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-auto-ads</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Dynamically inserts ads into a Story.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-captions/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-captions</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Custom video captions rendering.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-cta-layer/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-cta-layer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A single layer of a single page of an AMP story, which allows...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-grid-layer/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-grid-layer</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A single layer of a single page of an AMP story that positions its...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-page-outlink/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-page-outlink</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A CTA button for opening external links with one tap in AMP story pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-page/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-page</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A single screen of an AMP story.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-player/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-player</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A player for embedding and playing your favorite stories in your...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-shopping/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-shopping</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A configurable, templated shopping experience in AMP story pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story-subscriptions/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story-subscriptions</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A configurable, templated subscriptions experience in AMP story pages.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-story/" hidden> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-story</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">A rich, visual storytelling format.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-timeago/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-email ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-timeago</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Provides fuzzy timestamps by formatting dates as time ago (for...</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-truncate-text/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-truncate-text</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Truncates text with an ellipsis, optionally showing an overflow element.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-wordpress-embed/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-wordpress-embed</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds a WordPress post.</div> </div> </div> </a> </div> <div id="social" class="ap-m-table-component"> <h4 id="social">ソーシャル</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-addthis/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-addthis</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">AddThis の埋め込みウェブサイトツールを表示します。</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-beopinion/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-beopinion</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds BeOpinion content.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-facebook-comments/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-facebook-comments</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds the Facebook comments plugin.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-facebook-like/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-facebook-like</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds the Facebook like button plugin.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-facebook-page/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-facebook-page</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds the Facebook page plugin.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-facebook/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-facebook</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Facebook post, video or comment.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-gfycat/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-gfycat</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Gfycat video GIF.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-iframely/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-iframely</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays Iframely.com-powered rich media embeds</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-instagram/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-instagram</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays an Instagram embed.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-pinterest/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-pinterest</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Pinterest widget, Save button, or Follow button.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-reddit/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-reddit</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Reddit comment or post embed.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-riddle-quiz/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-riddle-quiz</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays Riddle content (e.g., quiz, list, poll, etc.).</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-tiktok/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-tiktok</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a TikTok video embed.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-twitter/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> <div class="ap-m-tag ap-m-tag-stories ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-twitter</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Twitter Tweet or Moment.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-vine/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-vine</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays a Vine simple embed.</div> </div> </div> </a> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-vk/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-vk</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Embeds a VK post or poll widget.</div> </div> </div> </a> </div> <div id="social login" class="ap-m-table-component"> <h4 id="social login">social login</h4> <a class="ap-m-table-component-link" href="/ja/documentation/components/amp-onetap-google/"> <div class="ap-m-table-component-row-components"> <div class="ap-m-table-component-tags"> <div class="ap-m-tag ap-m-tag-websites ap-m-table-component-tag"></div> </div> <div class="ap-m-table-component-name"> <span class="ap-m-table-component-name-title">amp-onetap-google</span> </div> <div class="ap-m-table-component-info"> <div class="ap-m-table-component-copy">Displays Google One Tap.</div> </div> </div> </a> </div> </section> </section> </div> </main> <amp-sidebar id="sidebar-left" class="ap--ampsidebar i-amphtml-layout-nodisplay" layout="nodisplay" side="left" hidden="hidden" i-amphtml-layout="nodisplay"> <nav class="ap--ampsidebar-toolbar" toolbar="(min-width: 768px)" toolbar-target="ap--sidebar-content"> <ul> <div class="ap-m-format-toggle"> <button class="ap-m-format-toggle-selected ap-m-format-toggle-link-websites"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-websites"/></svg> </span> <span>websites</span> <span class="ap-a-ico ap-m-format-toggle-angle"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#angle-down-solid"/></svg> </span> </button> <div class="ap-m-format-toggle-formats"> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-stories" href="/ja/documentation/components/stories/"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-stories"/></svg> </span> <span>stories</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-ads" href="/ja/documentation/components/ads/"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-ads"/></svg> </span> <span>ads</span> </a> <a class="ap-m-format-toggle-link ap-m-format-toggle-link-email" href="/ja/documentation/components/email/"> <span class="ap-a-ico"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#amp-email"/></svg> </span> <span>email</span> </a> </div> </div> <div class="ap-o-sidebar-component"> <div class="ap-o-sidebar"> <div class="nav"> <ul class="nav-list level-1"> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">3</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-3d-gltf/">amp-3d-gltf</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-3q-player/">amp-3q-player</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">A</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-access-fewcents/">amp-access-fewcents</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-access-laterpay/">amp-access-laterpay</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-access-poool/">amp-access-poool</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-access-scroll/">amp-access-scroll</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-access/">amp-access</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-accordion/">amp-accordion</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-action-macro/">amp-action-macro</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-ad-exit/">amp-ad-exit</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-ad/">amp-ad</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-addthis/">amp-addthis</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-analytics/">amp-analytics</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-anim/">amp-anim</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-animation/">amp-animation</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-apester-media/">amp-apester-media</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-app-banner/">amp-app-banner</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-audio/">amp-audio</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-auto-ads/">amp-auto-ads</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-autocomplete/">amp-autocomplete</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">B</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-base-carousel/">amp-base-carousel</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-beopinion/">amp-beopinion</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-bind/">amp-bind</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-bodymovin-animation/">amp-bodymovin-animation</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-brid-player/">amp-brid-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-brightcove/">amp-brightcove</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-byside-content/">amp-byside-content</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">C</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-call-tracking/">amp-call-tracking</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-carousel/">amp-carousel</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-connatix-player/">amp-connatix-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-consent/">amp-consent</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">D</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-dailymotion/">amp-dailymotion</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-date-countdown/">amp-date-countdown</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-date-display/">amp-date-display</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-date-picker/">amp-date-picker</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-delight-player/">amp-delight-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-dynamic-css-classes/">amp-dynamic-css-classes</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">E</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-embedly-card/">amp-embedly-card</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-experiment/">amp-experiment</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">F</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-facebook-comments/">amp-facebook-comments</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-facebook-like/">amp-facebook-like</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-facebook-page/">amp-facebook-page</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-facebook/">amp-facebook</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-fit-text/">amp-fit-text</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-font/">amp-font</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-form/">amp-form</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-fx-collection/">amp-fx-collection</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-fx-flying-carpet/">amp-fx-flying-carpet</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">G</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-geo/">amp-geo</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-gfycat/">amp-gfycat</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-gist/">amp-gist</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-google-document-embed/">amp-google-document-embed</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-google-read-aloud-player/">amp-google-read-aloud-player</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">H</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-hulu/">amp-hulu</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">I</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-iframe/">amp-iframe</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-iframely/">amp-iframely</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-ima-video/">amp-ima-video</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-image-lightbox/">amp-image-lightbox</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-image-slider/">amp-image-slider</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-img/">amp-img</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-imgur/">amp-imgur</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-inline-gallery/">amp-inline-gallery</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-inputmask/">amp-inputmask</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-instagram/">amp-instagram</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-install-serviceworker/">amp-install-serviceworker</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-izlesene/">amp-izlesene</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">J</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-jwplayer/">amp-jwplayer</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">K</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-kaltura-player/">amp-kaltura-player</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">L</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-layout/">amp-layout</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-lightbox-gallery/">amp-lightbox-gallery</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-lightbox/">amp-lightbox</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-link-rewriter/">amp-link-rewriter</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-list/">amp-list</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-live-list/">amp-live-list</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">M</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-mathml/">amp-mathml</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-mega-menu/">amp-mega-menu</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-megaphone/">amp-megaphone</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-minute-media-player/">amp-minute-media-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-mowplayer/">amp-mowplayer</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-mustache/">amp-mustache</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">N</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-nested-menu/">amp-nested-menu</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-next-page/">amp-next-page</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-nexxtv-player/">amp-nexxtv-player</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">O</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-o2-player/">amp-o2-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-onetap-google/">amp-onetap-google</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-ooyala-player/">amp-ooyala-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-orientation-observer/">amp-orientation-observer</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">P</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-pan-zoom/">amp-pan-zoom</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-pinterest/">amp-pinterest</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-pixel/">amp-pixel</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-playbuzz/">amp-playbuzz</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-position-observer/">amp-position-observer</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-powr-player/">amp-powr-player</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">R</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-reach-player/">amp-reach-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-recaptcha-input/">amp-recaptcha-input</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-reddit/">amp-reddit</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-render/">amp-render</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-riddle-quiz/">amp-riddle-quiz</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">S</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-script/">amp-script</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-selector/">amp-selector</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-sidebar/">amp-sidebar</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-skimlinks/">amp-skimlinks</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-slikeplayer/">amp-slikeplayer</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-smartlinks/">amp-smartlinks</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-social-share/">amp-social-share</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-soundcloud/">amp-soundcloud</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-springboard-player/">amp-springboard-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-sticky-ad/">amp-sticky-ad</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-stream-gallery/">amp-stream-gallery</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-subscriptions-google/">amp-subscriptions-google</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-subscriptions/">amp-subscriptions</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">T</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-tiktok/">amp-tiktok</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-timeago/">amp-timeago</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-truncate-text/">amp-truncate-text</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-twitter/">amp-twitter</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">U</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-user-notification/">amp-user-notification</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">V</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-video-docking/">amp-video-docking</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-video-iframe/">amp-video-iframe</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-video/">amp-video</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-vimeo/">amp-vimeo</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-vine/">amp-vine</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-viqeo-player/">amp-viqeo-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-vk/">amp-vk</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">W</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-web-push/">amp-web-push</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-wistia-player/">amp-wistia-player</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-wordpress-embed/">amp-wordpress-embed</a> </li> </ul> </li> <li class="nav-item level-1"> <ul class="nav-list level-2"> <li class="nav-link">Y</li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-yotpo/">amp-yotpo</a> </li> <li class="nav-item level-2 "> <a class="nav-link" href="/ja/documentation/components/websites/amp-youtube/">amp-youtube</a> </li> </ul> </li> </ul> </div> </div> </div> </ul> </nav> </amp-sidebar> <footer class="ap--footer"> <div class="-a"> <div class="-f"> <div class="ap-o-footer-hint">もちろん、このサイトはAMPで作成されています！</div> <div class="-l"> <h5 class="-c">最新情報をチェック</h5> <ul class="-h"> <li class="-p"> <a class="ap-a-ico -d" href="https://twitter.com/AMPhtml" rel="noopener" title="Twitter"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#twitter"/></svg> </a> </li> <li class="-p"> <a class="ap-a-ico -d" href="https://www.youtube.com/channel/UCXPBsjgKKG2HqsKBhWA4uQw" rel="noopener" title="YouTube"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#youtube"/></svg> </a> </li> <li class="-p"> <a class="ap-a-ico -d" href="https://blog.amp.dev/" rel="noopener"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#wordpress" title="WordPress"/></svg> </a> </li> <li class="-p"> <a class="ap-a-ico -d" href="https://github.com/ampproject" title="GitHub"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#github"/></svg> </a></li> <li class="-p"> <a class="ap-a-ico -d" href="https://stackoverflow.com/questions/tagged/amp-html" rel="noopener" title="Stackoverflow"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#stackoverflow"/></svg></a> </li> </ul> </div> </div> <div class="-v"> <div class="-m"> <h5 class="-g">概要</h5> <ul class="-y"> <li class="-b"><a href="/ja/about/websites/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>AMP フレームワーク</a></li> <li class="-b"><a href="/ja/about/use-cases/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>使用事例</a></li> <li class="-b"><a href="/ja/success-stories/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>成功事例</a></li> <li class="-b"><a href="/ja/about/how-amp-works/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>機能</a></li> </ul> </div> <div class="-m"> <h5 class="-g">ドキュメント</h5> <ul class="-y"> <li class="-b"><a href="/ja/documentation/guides-and-tutorials/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>スタートガイド</a></li> <li class="-b"><a href="/ja/documentation/guides-and-tutorials/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>ガイドとチュートリアル</a></li> <li class="-b"><a href="/ja/documentation/components/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>コンポーネント</a></li> <li class="-b"><a href="/ja/documentation/examples/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>実例</a></li> <li class="-b"><a href="/ja/documentation/templates/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>デザインテンプレート</a></li> <li class="-b"><a href="/ja/documentation/tools/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>ツール</a></li> </ul> </div> <div class="-m"> <h5 class="-g">コミュニティ</h5> <ul class="-y"> <li class="-b"><a href="/ja/support/faq/platform-and-vendor-partners/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>プラットフォームとベンダーパートナー</a></li> <li class="-b"><a href="/ja/documentation/guides-and-tutorials/contribute/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>貢献</a></li> <li class="-b"><a href="/ja/community/roadmap/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>ロードマップ</a></li> </ul> <h5 class="-g">OpenJS Foundation</h5> <ul class="-y"> <li class="-b"><a class="-w" href="https://openjsf.org" rel="noopener"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>The OpenJS Foundation</a></li> <li class="-b"><a class="-w" href="https://bylaws.openjsf.org" rel="noopener"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>OpenJS Foundation Bylaws</a></li> <li class="-b"><a class="-w" href="https://trademark-policy.openjsf.org" rel="noopener"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>Trademark Policy</a></li> <li class="-b"><a class="-w" href="https://trademark-list.openjsf.org" rel="noopener"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>Trademark List</a></li> </ul> </div> <div class="-m"> <h5 class="-g">イベント</h5> <ul class="-y"> <li class="-b"><a href="https://blog.amp.dev/2020/02/20/amp-conf-2020-return-to-nyc/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>AMP Conf 2020</a></li> <li class="-b"><a href="/ja/events/amp-cs-2019/" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#internal"/></svg></div>AMP Contributor Summit 2019</a></li> </ul> <h5 class="-g">AMP のブランド素材</h5> <ul class="-y"> <li class="-b"><a href="/static/files/brand-material/AMP_Mini_Styleguide.pdf" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#download"/></svg></div>スタイルガイド</a></li> <li class="-b"><a href="/static/files/brand-material/AMP_Logo_Rebrush.zip" class="-w"><div class="ap-a-ico -x"><svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#download"/></svg></div>ロゴ</a></li> </ul> </div> </div> <div class="-k"> <div class="-_"> <amp-img src="/static/img/logo-openjsf.svg" alt="Logo of the OpenJS Foundation" width="315" height="100" layout="responsive" class="i-amphtml-layout-responsive i-amphtml-layout-size-defined" i-amphtml-layout="responsive"><i-amphtml-sizer slot="i-amphtml-svc" style="display:block;padding-top:31.746%"></i-amphtml-sizer></amp-img> </div> <ul class="-j"> <li class="-q"><a class="-z" href="https://terms-of-use.openjsf.org" rel="noopener">Terms of Use</a></li> <li class="-q"><a class="-z" href="https://privacy-policy.openjsf.org" rel="noopener">プライバシーポリシー</a></li> <li class="-q"><a class="-z" href="https://www.linuxfoundation.org/cookies" rel="noopener">Cookie Policy</a></li> </ul> </div> <div class="-te"> © <a href="https://openjsf.org">OpenJS Foundation</a> and AMP Project contributors. All rights reserved. The <a href="https://openjsf.org">OpenJS Foundation</a> has registered trademarks and uses trademarks. For a list of trademarks of the <a href="https://openjsf.org">OpenJS Foundation</a>, please see our <a href="https://trademark-policy.openjsf.org">Trademark Policy</a> and <a href="https://trademark-list.openjsf.org">Trademark List</a>. Trademarks and logos not indicated on the <a href="https://trademark-list.openjsf.org">list of OpenJS Foundation trademarks</a> are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them. <br><br> The services available at <a href="https://cdn.ampproject.org">cdn.ampproject.org</a> are provided by Google and the respective <a href="https://policies.google.com/privacy?hl=en">privacy policy</a> applies. </div> </div> </footer> <aside class="ap-o-translation-hint"> <p class="ap-o-translation-hint-wrapper">Sadly this page isn't translated yet, but will be shortly - check back soon!</p> </aside> <amp-analytics type="gtag" data-credentials="include" data-block-on-consent class="i-amphtml-layout-fixed i-amphtml-layout-size-defined" style="width:1px;height:1px;" i-amphtml-layout="fixed"> <script type="application/json">{"extraUrlParams":{"cd2":"${ampdocHost}"},"requests":{"CWV_EVENT":"${base}?v=1\u0026t=event\u0026tid=${gtag_id}\u0026cid=0\u0026ec=cwv","base":"https://google-analytics.com/collect/"},"triggers":{"banner":{"on":"click","selector":"#top-banner","vars":{"event_action":"click","event_category":"components","event_label":"banner","event_name":"banner"}},"breadcrumbLink":{"on":"click","selector":".ap-m-breadcrumbs-crumb","vars":{"event_action":"link","event_category":"components","event_label":"breadcrumbs","event_name":"breadcrumbs"}},"cls":{"extraUrlParams":{"cls":"${cumulativeLayoutShift}"},"on":"visible","request":"CWV_EVENT"},"defaultPageview":{"on":"visible","request":"pageview","vars":{"title":"{{title}}"}},"fid":{"extraUrlParams":{"fid":"${firstInputDelay}"},"on":"visible","request":"CWV_EVENT"},"formatToggle":{"on":"click","selector":".ap-m-format-toggle-link","vars":{"event_action":"link","event_category":"components","event_label":"format-toggle","event_name":"format-toggle"}},"lcp":{"extraUrlParams":{"lcp":"${largestContentfulPaint}"},"on":"visible","request":"CWV_EVENT"},"navigation":{"on":"click","selector":".ap--header a, .ap-o-burger-menu-link","vars":{"event_action":"link","event_category":"components","event_label":"navigation","event_name":"navigation"}},"scrolledEnd":{"on":"scroll","scrollSpec":{"verticalBoundaries":[90]},"vars":{"event_action":"end","event_category":"components","event_label":"scroll","event_name":"scroll"}},"scrolledHalf":{"on":"scroll","scrollSpec":{"verticalBoundaries":[50]},"vars":{"event_action":"half","event_category":"components","event_label":"scroll","event_name":"scroll"}},"searchButton":{"on":"click","selector":"#searchTriggerOpen","vars":{"event_action":"open","event_category":"search","event_label":"search","event_name":"search"}},"sidebarLink":{"on":"click","selector":".ap-o-sidebar a","vars":{"event_action":"link","event_category":"components","event_label":"sidebar","event_name":"sidebar"}},"sidebarToggle":{"on":"click","selector":"label[for=\"sidebar-desktop\"], label[for=\"sidebar\"]","vars":{"event_action":"toggle","event_category":"components","event_label":"sidebar","event_name":"sidebar"}}},"vars":{"config":{"G-TYM9BH1XCX":{"groups":"default"}},"gtag_id":"G-TYM9BH1XCX"}}</script> </amp-analytics><amp-geo layout="nodisplay" class="i-amphtml-layout-nodisplay" hidden="hidden" i-amphtml-layout="nodisplay"> <script type="application/json">{"ISOCountryGroups":{"eu":["preset-eea"],"doubleOptIn":["de","at","no","gr","lu"]}}</script> </amp-geo> <amp-consent id="consent" class="-o i-amphtml-layout-nodisplay" layout="nodisplay" hidden="hidden" i-amphtml-layout="nodisplay"> <script type="application/json">{"consentInstanceId":"consent","promptUI":"consent-popup","consentRequired":false,"geoOverride":{"eu":{"consentRequired":true}}}</script> <div id="consent-popup" class="consent-popup"> <button type="reset" class="-u" on="tap:consent.dismiss" role="button" tabindex="0" aria-label="同意を却下する"> <svg><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#close"/></svg> </button> <p class="ap-o-consent-text"> We use cookies to understand how you use our site and to improve your experience. By continuing to use our site, you accept our <a href="https://policies.google.com/technologies/cookies">use of cookies</a> and <a href="https://policies.google.com/privacy">privacy policy</a>. </p> <button on="tap:consent.accept" class="ap-a-btn" role="button" aria-label="Cookie の仕様を受け入れる">了解！</button> </div> </amp-consent> <amp-install-serviceworker src="/serviceworker.js" data-iframe-src="https://amp.dev/serviceworker.html" layout="nodisplay" class="i-amphtml-layout-nodisplay" hidden="hidden" i-amphtml-layout="nodisplay"></amp-install-serviceworker> <style amp-keyframes>@keyframes duepduep{0%{transform:translate(0)}49%{transform:translate(40px)}50%{transform:translate(-40px)}to{transform:translate(0)}}@keyframes moveSidebarToggleBackwards{0%{transform:translateX(calc(90vw - 50%))}to{transform:translateX(0)}}@keyframes moveSidebarToggleForwards{0%{transform:translateX(0)}to{transform:translateX(calc(90vw - 50%))}}</style></body></html>