@charset "utf-8";

/*
 * File       : rwd-blocks.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.2.0
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 01) 1480px
 * 02) 1200px
 * 03) 1023px
 * 04) 781px
 * 05) 540px
 */



/* **************************************** *
 * 1480px
 * **************************************** */
@media (max-width: 1480px){

    /* LAYOUT */
    .jt-blocks > *.alignwide { margin-left: 120rem; margin-right: 120rem; }

    /* SEPARATOR */
    .jt-blocks .wp-block-separator.is-style-wide { width: calc(100% - 240rem); }

    /* CUSTOM COLUMNS DETAIL */
    .jt-blocks .wp-block-columns.jt-block-summary .wp-block-separator.is-style-wide { width: 100%; }

}



/* **************************************** *
 * 1200px
 * **************************************** */
@media (max-width: 1200px){

    /* LAYOUT */
    .jt-blocks > *.alignwide { margin-left: 46rem; margin-right: 46rem; }

    /* LINK, BUTTON */
    .jt-blocks .wp-block-button .wp-block-button__link { padding: 10rem 42rem; }
    .jt-blocks .wp-block-button .wp-block-button__link:after { width: 11rem; height: 11rem; }

    /* LIST */
    .jt-blocks ul > li:before { width: 5px; height: 5px; }
    .jt-blocks ul.has-jt-01-font-size > li:before { top: 23rem; }

    html.ios .jt-blocks ul > li:before { top: 12rem; }

    html.android .jt-blocks ul.has-jt-02-font-size > li:before { top: 20rem; }
    html.android .jt-blocks ul.has-jt-04-font-size > li:before { top: 15rem; }

    /* GALLERY */
    .jt-blocks .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding-top: 50rem; }

    /* SEPARATOR */
    .jt-blocks .wp-block-separator.is-style-wide { width: calc(100% - 92rem); }

    /* JT BLOCK FLOW */
    .jt-blocks .jt-block-flow > .wp-block-group { padding-left: 62rem; }
    .jt-blocks .jt-block-flow > .wp-block-group:before { left: calc(34rem/2 - 1rem); }
    .jt-blocks .jt-block-flow > .wp-block-group:after { width: 34rem; height: 34rem; line-height: 34rem; }

}



/* **************************************** *
 * 1023px
 * **************************************** */
@media (max-width: 1023px){

    /* LAYOUT */
    .jt-blocks > *.alignwide { margin-left: 36rem; margin-right: 36rem; }

    /* LINK, BUTTON */
    .jt-blocks .wp-block-button .wp-block-button__link { padding: 10rem 38rem; }
    .jt-blocks .wp-block-button .wp-block-button__link:after { width: 10rem; height: 10rem; }
    .jt-blocks .wp-block-buttons.is-layout-flex { gap: 8rem; }

    /* LIST */
    .jt-blocks ul > li:before { top: 11rem; }

    .jt-blocks ul.has-jt-01-font-size > li:before { width: 9rem; height: 9rem; }
    .jt-blocks ul.has-jt-02-font-size > li:before { width: 7rem; height: 7rem; top: 18rem; }
    .jt-blocks ul.has-jt-03-font-size > li:before { top: 15rem; }
    .jt-blocks ul.has-jt-04-font-size > li:before { width: 6px; height: 6px; top: 14rem; }
    .jt-blocks ul.has-jt-05-font-size > li:before { top: 14rem; }
    .jt-blocks ul.has-jt-06-font-size > li:before { top: 12rem; }
    .jt-blocks ul.has-jt-08-font-size > li:before { width: 4px; height: 4px; }
    .jt-blocks ul.has-jt-09-font-size > li:before { width: 4px; height: 4px; top: 10rem; }
    .jt-blocks ul.has-jt-10-font-size > li:before { width: 3px; height: 3px; top: 9rem; }

    html.ios .jt-blocks ul > li:before { top: 11rem; }
    html.ios .jt-blocks ul.has-jt-02-font-size > li:before { top: 18rem; }
    html.ios .jt-blocks ul.has-jt-04-font-size > li:before { top: 14rem; }
    html.ios .jt-blocks ul.has-jt-05-font-size > li:before { top: 14rem; }
    html.ios .jt-blocks ul.has-jt-06-font-size > li:before { top: 12rem; }
    html.ios .jt-blocks ul.has-jt-09-font-size > li:before { top: 10rem; }
    html.ios .jt-blocks ul.has-jt-10-font-size > li:before { top: 9rem; }

    html.android .jt-blocks ul.has-jt-02-font-size > li:before { top: 18rem; }
    html.android .jt-blocks ul.has-jt-04-font-size > li:before { top: 14rem; }

    /* BLOCKQUOTE */
    .jt-blocks .wp-block-quote.is-style-plain:before { width: 16rem; height: 12rem; }

    /* TABLE */
    .jt-blocks .wp-block-table th,
    .jt-blocks .wp-block-table td { padding-left: 16rem; padding-right: 16rem; }

    /* GALLERY */
    .jt-blocks .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding-top: 42rem; }

    /* SEPARATOR */
    .jt-blocks .wp-block-separator.is-style-wide { width: calc(100% - 72rem); }

    /* JT BLOCK FLOW */
    .jt-blocks .jt-block-flow > .wp-block-group { padding-left: 56rem; }
    .jt-blocks .jt-block-flow > .wp-block-group:before { left: calc(32rem/2 - 1rem); }
    .jt-blocks .jt-block-flow > .wp-block-group:after { width: 32rem; height: 32rem; line-height: 32rem; }

    /* CUSTOM COLUMNS DETAIL */
    .jt-blocks .wp-block-columns.jt-block-summary a:after { width: 17rem; height: 17rem; background-size: 7rem auto; }

}



/* **************************************** *
 * 781px
 * **************************************** */
@media (max-width: 781px){

    /* LAYOUT */
    .jt-blocks > *,
    .jt-blocks > *.alignwide { margin-left: 24rem; margin-right: 24rem; }
    .jt-blocks > *.alignfull { margin-left: auto; margin-right: auto; }

    /* LINK, BUTTON */
    .jt-blocks .wp-block-button .wp-block-button__link:after { width: 9rem; height: 10rem; top: -2rem; }
    .jt-blocks .wp-block-button .wp-block-button__link:not([target="_blank"]):after { top: -2rem; }

    html.ios .jt-blocks .wp-block-button .wp-block-button__link { padding-bottom: 9rem; }

    /* LIST */
    .jt-blocks ul > li { padding-left: 0.88em; }

    .jt-blocks ul.has-jt-02-font-size > li:before { top: 19rem; }
    .jt-blocks ul.has-jt-03-font-size > li:before { width: 6px; height: 6px; top: 18rem; }
    .jt-blocks ul.has-jt-04-font-size > li:before { top: 15rem; }

    html.ios .jt-blocks ul > li:before { top: 10rem; }
    html.ios .jt-blocks ul.has-jt-01-font-size > li:before { top: 21rem; }
    html.ios .jt-blocks ul.has-jt-02-font-size > li:before { top: 16rem; }
    html.ios .jt-blocks ul.has-jt-03-font-size > li:before { top: 15rem; }
    html.ios .jt-blocks ul.has-jt-04-font-size > li:before { top: 14rem; }
    html.ios .jt-blocks ul.has-jt-05-font-size > li:before { top: 12rem; }
    html.ios .jt-blocks ul.has-jt-06-font-size > li:before { top: 11rem; }
    html.ios .jt-blocks ul.has-jt-08-font-size > li:before { top: 10rem; }
    html.ios .jt-blocks ul.has-jt-09-font-size > li:before { top: 9rem; }
    html.ios .jt-blocks ul.has-jt-10-font-size > li:before { top: 8rem; }
    html.ios .jt-blocks ul.has-jt-11-font-size > li:before { top: 7rem; }

    /* TABLE */
    .jt-blocks .wp-block-table th,
    .jt-blocks .wp-block-table td { padding-left: 12rem; padding-right: 12rem; }

    /* GALLERY */
    .jt-blocks .wp-block-gallery.has-nested-images.alignleft, 
    .jt-blocks .wp-block-gallery.has-nested-images.alignright { width: auto; }

    .jt-blocks .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding-top: 38rem; }
    .jt-blocks .wp-block-gallery.has-nested-images.alignwide figure.wp-block-image figcaption { padding-left: var(--wp--preset--spacing--jt-xxsmall); padding-right: var(--wp--preset--spacing--jt-xxsmall); padding-bottom: var(--wp--preset--spacing--jt-xxsmall); }

    /* EMBED */
    .jt-blocks .wp-block-embed.alignleft, 
    .jt-blocks .wp-block-embed.alignright, 
    .jt-blocks .wp-block[data-align=left] > [data-type="core/embed"], 
    .jt-blocks .wp-block[data-align=right] > [data-type="core/embed"] { width: auto; }

    /* SEPARATOR */
    .jt-blocks .wp-block-separator { margin-left: auto; margin-right: auto; }
    .jt-blocks .wp-block-separator.is-style-wide { width: calc(100% - 48rem); }

}

@media (max-width: 781px) and (min-width: 541px){

    /* GROUP, COLUMNS - tablet detail (custom) */
    .jt-blocks .wp-block-columns.jt-columns--tablet-2column { flex-wrap: wrap !important; }
    .jt-blocks .wp-block-columns.jt-columns--tablet-2column > .wp-block-column { flex-basis: calc(50% - var(--wp--preset--spacing--jt-large) / 2) !important; flex-grow: 0; }

}



/* **************************************** *
 * 540px
 * **************************************** */
@media (max-width: 540px){

    /* LINK, BUTTON */
    .jt-blocks .wp-block-buttons.is-layout-flex { gap: 6rem; }
    .jt-blocks .wp-block-button .wp-block-button__link { padding: 9rem 32rem; }

    html.ios .jt-blocks .wp-block-button .wp-block-button__link { padding-bottom: 8rem; }
    html.ios .jt-blocks .wp-block-button .wp-block-button__link:after { top: -1rem; }
    
    /* LIST */
    .jt-blocks li ul, 
    .jt-blocks li ol { margin-left: 0.5em; }

    .jt-blocks ol > li { padding-left: 1em; }
    .jt-blocks ol > li:nth-child(n+10) { padding-left: 1.6em; }
    .jt-blocks ol[reversed] > li { padding-left: 1.6em; }
    .jt-blocks ol[reversed] > li:nth-last-child(-n+9) { padding-left: 1em; }

    .jt-blocks ul > li:before { width: 4px; height: 4px; }

    .jt-blocks ul.has-jt-01-font-size > li:before { width: 8px; height: 8px; top: 18rem; }
    .jt-blocks ul.has-jt-02-font-size > li:before { width: 6px; height: 6px; top: 15rem; }
    .jt-blocks ul.has-jt-03-font-size > li:before { width: 6px; height: 6px; top: 14rem; }
    .jt-blocks ul.has-jt-04-font-size > li:before { width: 5px; height: 5px; top: 13rem; }
    .jt-blocks ul.has-jt-05-font-size > li:before { top: 13rem; }
    .jt-blocks ul.has-jt-08-font-size > li:before { width: 4px; height: 4px; }
    .jt-blocks ul.has-jt-09-font-size > li:before { width: 3px; height: 3px; }
    .jt-blocks ul.has-jt-10-font-size > li:before { width: 3px; height: 3px; top: 8rem; }
    .jt-blocks ul.has-jt-11-font-size > li:before { width: 3px; height: 3px; }

    html.ios .jt-blocks ul > li:before { top: 9.5rem; }
    html.ios .jt-blocks ul.has-jt-01-font-size > li:before { top: 17rem; }
    html.ios .jt-blocks ul.has-jt-02-font-size > li:before { top: 13rem; }
    html.ios .jt-blocks ul.has-jt-03-font-size > li:before { top: 12rem; }
    html.ios .jt-blocks ul.has-jt-04-font-size > li:before { top: 11rem; }
    html.ios .jt-blocks ul.has-jt-05-font-size > li:before { top: 11rem; }
    html.ios .jt-blocks ul.has-jt-06-font-size > li:before { top: 10rem; }
    html.ios .jt-blocks ul.has-jt-09-font-size > li:before { top: 8rem; }
    html.ios .jt-blocks ul.has-jt-10-font-size > li:before { top: 7rem; }

    html.android .jt-blocks ul > li:before { top: 10rem; }
    html.android .jt-blocks ul.has-jt-01-font-size > li:before { top: 18rem; }
    html.android .jt-blocks ul.has-jt-02-font-size > li:before { top: 15rem; }
    html.android .jt-blocks ul.has-jt-03-font-size > li:before { top: 13rem; }
    html.android .jt-blocks ul.has-jt-04-font-size > li:before { top: 13rem; }
    html.android .jt-blocks ul.has-jt-05-font-size > li:before { top: 12rem; }
    html.android .jt-blocks ul.has-jt-06-font-size > li:before { top: 12rem; }
    html.android .jt-blocks ul.has-jt-08-font-size > li:before { top: 11rem; }
    html.android .jt-blocks ul.has-jt-09-font-size > li:before { top: 9rem; }
    html.android .jt-blocks ul.has-jt-10-font-size > li:before { top: 8rem; }
    html.android .jt-blocks ul.has-jt-11-font-size > li:before { top: 7rem; }

    /* BLOCKQUOTE */
    .jt-blocks .wp-block-quote { border-left-width: 3rem; }

    .jt-blocks .wp-block-quote:not(.is-style-plain).has-text-align-right { border-right-width: 3rem; }

    .jt-blocks .wp-block-quote.is-style-plain { padding-top: 22rem; }
    .jt-blocks .wp-block-quote.is-style-plain:before { width: 14rem; height: 11rem; }

    /* TABLE */
    .jt-blocks .wp-block-table th,
    .jt-blocks .wp-block-table td { padding-left: 10rem; padding-right: 10rem; }
    .jt-blocks .wp-block-table :not(.has-fixed-layout) tbody td:first-child { width: 144rem; }

    /* GALLERY */
    .jt-blocks .wp-block-gallery { --wp--style--gallery-gap-default: 12rem; }

    .jt-blocks .wp-block-gallery.has-nested-images > figcaption { margin-top: 0; }
    .jt-blocks .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding-top: 30rem; }

    /* SEPARATOR */
    .jt-blocks .wp-block-separator.is-style-wide { width: calc(100% - 40rem); }

    /* JT BLOCK FLOW */
    .jt-blocks .jt-block-flow > .wp-block-group { padding-left: 46rem; }
    .jt-blocks .jt-block-flow > .wp-block-group:before { left: calc(30rem/2 - 1rem); }
    .jt-blocks .jt-block-flow > .wp-block-group:after { width: 30rem; height: 30rem; line-height: 30rem; }

    /* CUSTOM COLUMNS DETAIL */
    .jt-blocks .wp-block-group.jt-block-bloglist--large .wp-block-columns { flex-wrap: wrap !important; border-bottom: none !important; }
    .jt-blocks .wp-block-group.jt-block-bloglist--large .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }

    .jt-blocks .wp-block-group.jt-block-bloglist--small .wp-block-columns { flex-wrap: wrap !important; }
    .jt-blocks .wp-block-group.jt-block-bloglist--small .wp-block-columns > .wp-block-column { flex-basis: 100% !important; }

    .jt-blocks .wp-block-columns.jt-block-summary a:after { width: 16rem; height: 16rem; margin-left: 4rem; }
    html.ios .jt-blocks .wp-block-columns.jt-block-summary a:after { top: -1.5rem; }

}