@charset "utf-8";

/*
 * File       : block.css
 * Author     : STUDIO-JT (KMS, Chaehee)
 * Guideline  : JTstyle 2.0
 *
 * Dependency : css/reset.css
 *
 * SUMMARY:
 * 01) CUSTOM COLOR PALETTE
 * 02) HEADING AND TEXT
 * 03) LINK
 * 04) BUTTON
 * 05) LIST
 * 06) GALLERY
 * 07) IMAGE
 * 08) BLOCKQUOTE
 * 09) EMBED
 * 10) SEPARATOR
 * 11) OVERWRITE
 * 12) SLIDESHOW
 * 13) HEADER
 */



/* **************************************** *
 * CUSTOM COLOR PALETTE
 * !important required to work correctly (TODO dry this code)
 * **************************************** */
.jt-blocks .has-type-01-color,
.jt-blocks p.has-type-01-color { color: #666 }
.jt-blocks .has-type-02-color,
.jt-blocks p.has-type-02-color { color: #ddd; }
.jt-blocks .has-type-03-color,
.jt-blocks p.has-type-03-color { color: var(--color-primary); }
.jt-blocks .has-type-04-color,
.jt-blocks p.has-type-04-color { color: #fff; }

.jt-blocks .has-type-01-background-color,
.jt-blocks .wp-block-button__link.has-type-01-background-color,
.jt-blocks a.wp-block-button__link.has-type-01-background-color,
.jt-blocks button.wp-block-button__link.has-type-01-background-color { background-color: #666 !important; border-color: #666; }

.jt-blocks .has-type-02-background-color,
.jt-blocks .wp-block-button__link.has-type-02-background-color,
.jt-blocks a.wp-block-button__link.has-type-02-background-color,
.jt-blocks button.wp-block-button__link.has-type-02-background-color { background-color: #ddd !important; border-color: #ddd; }

.jt-blocks .has-type-03-background-color,
.jt-blocks .wp-block-button__link.has-type-03-background-color,
.jt-blocks a.wp-block-button__link.has-type-03-background-color,
.jt-blocks button.wp-block-button__link.has-type-03-background-color { background-color: var(--color-primary) !important; border-color: var(--color-primary); }

.jt-blocks .has-type-04-background-color,
.jt-blocks .wp-block-button__link.has-type-04-background-color,
.jt-blocks a.wp-block-button__link.has-type-04-background-color,
.jt-blocks button.wp-block-button__link.has-type-04-background-color { background-color: #fff !important; border-color: #fff; }
 
.jt-blocks > * { max-width: 720rem; margin-left: auto; margin-right: auto; }
.jt-blocks > .instagram-media { margin: 80rem auto !important; max-width: 720rem !important; }
.jt-blocks > h1 + .instagram-media,
.jt-blocks > h2 + .instagram-media,
.jt-blocks > h3 + .instagram-media,
.jt-blocks > h4 + .instagram-media,
.jt-blocks > h5 + .instagram-media,
.jt-blocks > h6 + .instagram-media { margin-top: 0 !important; }
.jt-blocks > .wp-block-image { max-width: inherit; }
.jt-blocks > .wp-block-embed { max-width: 1200rem; }
.jt-blocks > .wp-block-gallery { max-width: 1800rem; margin-left: auto; margin-right: auto; }
.jt-blocks > .jt-cover-header { max-width: inherit; }
.jt-blocks > .jt-basic-header { max-width: 1200rem; }



/* **************************************** *
 * HEADING AND TEXT
 * **************************************** */
.jt-blocks { min-height: 360rem; }
.jt-blocks h1,
.jt-blocks h2,
.jt-blocks h3,
.jt-blocks h4,
.jt-blocks h5,
.jt-blocks h6 { clear: both; }

.jt-blocks h1:last-child,
.jt-blocks h2:last-child,
.jt-blocks h3:last-child,
.jt-blocks h4:last-child,
.jt-blocks h5:last-child,
.jt-blocks h6:last-child { margin-bottom: 0; }

.jt-blocks h1, .jt-blocks .font-size-heading-01 { font-size: 56rem; line-height: 1.21; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 80rem; margin-bottom: 28rem; }
.jt-blocks h2, .jt-blocks .font-size-heading-02 { font-size: 48rem; line-height: 1.29; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 80rem; margin-bottom: 23rem; }
.jt-blocks h3, .jt-blocks .font-size-heading-03 { font-size: 40rem; line-height: 1.3; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 80rem; margin-bottom: 17rem; }
.jt-blocks h4, .jt-blocks .font-size-heading-04 { font-size: 26rem; line-height: 1.39; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 80rem; margin-bottom: 11rem; }
.jt-blocks h5, .jt-blocks .font-size-heading-05 { font-size: 16rem; line-height: 1.5; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 70rem; margin-bottom: 8rem; }
.jt-blocks h6, .jt-blocks .font-size-heading-06 { font-size: 13rem; line-height: 1.54; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 71rem; margin-bottom: 10rem; }

.jt-blocks p, 
.jt-blocks .font-size-typography { margin-bottom: 28rem; font-size: 17rem; line-height: 1.77; font-weight: 400; letter-spacing: var(--letter-spacing); color: #666; word-break: keep-all; }
.jt-blocks p.indent { text-indent: 79rem; }
.jt-blocks b { font-weight: 700; }
.jt-blocks em { background: #fbf4d4; }
.jt-blocks strong,
.jt-blocks strong a { font-weight: 700; }

.jt-blocks h1 + p,
.jt-blocks h2 + p,
.jt-blocks h3 + p,
.jt-blocks h4 + p,
.jt-blocks h5 + p,
.jt-blocks h6 + p { margin-top: 0; }
 


/* **************************************** *
 * LINK
 * **************************************** */
.jt-blocks a { word-break: break-all; }
.jt-blocks p a,
.jt-blocks ul a,
.jt-blocks ol a { position: relative; }

.jt-blocks p a:not(.wp-block-button__link),
.jt-blocks ul a:not(.wp-block-button__link),
.jt-blocks ol a:not(.wp-block-button__link) { color: var(--color-primary); border-bottom: 1rem solid #666; -webkit-transition: border .3s; transition: border .3s; }
 html.desktop .jt-blocks p a:not(.wp-block-button__link):hover,
 html.desktop .jt-blocks ul a:not(.wp-block-button__link):hover,
 html.desktop .jt-blocks ol a:not(.wp-block-button__link):hover { border-bottom-color: var(--color-primary); }
 


/* **************************************** *
 * BUTTON
 * **************************************** */
.jt-blocks .wp-block-buttons { display: block; font-size: 0; }
.jt-blocks .wp-block-button__link { background-color: #666; border-radius: 100rem !important; } /* no jt-block to avoid custom override */
.jt-blocks .is-style-outline .wp-block-button__link,
.jt-blocks .wp-block-button__link.is-style-outline { color: var(--color-primary); border-color: var(--color-primary); padding: 6rem 22rem 6rem; } /* no jt-block to avoid custom override */
.jt-blocks .wp-block-button__link { padding: 8rem 24rem 8rem; font-size: 16rem; font-weight: 600; border-width: 2rem; border-radius: 0; -webkit-transition: border .3s, background .3s; transition: border .3s, background .3s; }

.jt-blocks .wp-block-buttons { margin-top: 32rem; margin-bottom: 80rem; }
.jt-blocks .wp-block-buttons .wp-block-button:not(:only-child) { padding-left: 10rem; }
.jt-blocks .wp-block-buttons .wp-block-button:first-child:not(:only-child) { padding-left: 0; }
.jt-blocks .wp-block-buttons.has-text-align-center .wp-block-button:not(:only-child) { padding: 0 10rem; }

.jt-blocks .is-content-justification-center { text-align: center; }
.jt-blocks .is-content-justification-left { text-align: left; }
.jt-blocks .is-content-justification-right { text-align: right; }

html.desktop .jt-blocks .wp-block-button__link:hover { border-color: var(--color-primary); background: var(--color-primary); }
html.desktop .jt-blocks .is-style-outline .wp-block-button__link:hover { background: #ddd; }
 


/* **************************************** *
 * LIST
 * **************************************** */
.jt-blocks p + ul:not(.blocks-gallery-grid),
.jt-blocks p + ol:not(.blocks-gallery-grid) { margin-top: 30rem; }
.jt-blocks ul:not(.blocks-gallery-grid),
.jt-blocks ol:not(.blocks-gallery-grid) { display: block; margin-bottom: 60rem; }
.jt-blocks li:not(:last-child) ul:not(.blocks-gallery-grid),
.jt-blocks li:not(:last-child) ol:not(.blocks-gallery-grid) { margin-top: 7rem; margin-bottom: 7rem; margin-left: 12rem; }
.jt-blocks li:not(.blocks-gallery-item) { margin-bottom: 7rem; position: relative; font-size: 16rem; font-weight: 400; line-height: 1.5; letter-spacing: var(--letter-spacing); color: var(--color-primary); }
.jt-blocks li:not(.blocks-gallery-item):last-child { margin-bottom: 0; }
.jt-blocks ul:not(.blocks-gallery-grid) > li { padding-left: 12rem; }
.jt-blocks ul:not(.blocks-gallery-grid) > li:before { content: ''; display: block; width: 4rem; height: 4rem; position: absolute; top: 9rem; left: 0; background: var(--color-primary); border-radius: 50%; }
.jt-blocks ul:not(.blocks-gallery-grid) > li ol > li { padding-left: 20rem; }
.jt-blocks ul:not(.blocks-gallery-grid) > li ol > li:nth-child(n + 10) { padding-left: 30rem; }
.jt-blocks > ul:not(.blocks-gallery-grid) > li ul > li:before { background: #999; }
.jt-blocks > ol:not(.blocks-gallery-grid) > li ul > li:before { background: #999; }
.jt-blocks ol:not(.blocks-gallery-grid) { list-style-type: none; list-style-position: inside; counter-reset: item; }
.jt-blocks ol:not(.blocks-gallery-grid) > li { counter-increment: item; padding-left: 20rem; margin-bottom: 7rem; }
.jt-blocks ol:not(.blocks-gallery-grid) > li:nth-child(n + 10) { padding-left: 30rem; }
.jt-blocks ol:not(.blocks-gallery-grid) > li:last-child { margin-bottom: 0; }
.jt-blocks ol:not(.blocks-gallery-grid) > li:before { content: counter(list-item)'.'; display: block; position: absolute; top: 0; left: 0; font-feature-settings: 'tnum'; width: auto; height: auto; background: none; border-radius: 0; }

 
 
/* **************************************** *
 * GALLERY
 * **************************************** */
.jt-blocks .wp-block-gallery { margin-top: 80rem; margin-bottom: 80rem; gap: 30rem; --wp--style--unstable-gallery-gap: 30rem; }
.jt-blocks .wp-block-gallery + .wp-block-gallery { margin-top: -50rem; }
.jt-blocks .wp-block-gallery .blocks-gallery-grid { margin: 0 auto; } 
.jt-blocks .wp-block-gallery .blocks-gallery-item { padding: 0; } 
.jt-blocks .wp-block-gallery .blocks-gallery-item img { max-width: inherit; margin: 0; } 
.jt-blocks .wp-block-gallery .blocks-gallery-item figcaption { font-size: 13rem; line-height: 1.55; } 
.jt-blocks .wp-block-gallery li.blocks-gallery-item figure > a { display: block; position: relative; border-bottom: none; overflow: hidden; }
.jt-blocks .wp-block-gallery .wp-block-image:after { content: ''; display: block; width: 100%; height: 70%; position: absolute; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.55) 100%); }
.jt-blocks .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { width: 100%; text-align: left; padding: 0 24rem 20rem; left: auto; margin-left: auto; background: none; max-height: unset; z-index: 1; }



/* **************************************** *
 * IMAGE
 * **************************************** */
.jt-blocks img,
.jt-blocks div.wp-caption { display: block; max-width: 100%; height: auto; } 
.jt-blocks .wp-block-image { margin: 75rem auto 80rem; } 
.jt-blocks .wp-block-image a { display: block; } 
.jt-blocks .wp-block-image img { max-width: 100%; margin: 0 auto; }
.jt-blocks .wp-block-image figcaption { display: inline-block; margin: 13rem 0 0; font-size: 13rem; line-height: 1.54; font-weight: 400; letter-spacing: var(--letter-spacing); width: 360rem; max-width: unset; text-align: left; position: relative; left: 50%; margin-left: -360rem; color: #666; } 



/* **************************************** *
 * BLOCKQUOTE
 * **************************************** */
.jt-blocks blockquote.wp-block-quote { margin: 75rem auto; }
.jt-blocks blockquote.wp-block-quote.is-style-plain { padding-top: 0; padding-left: 40rem; border-left: 4rem solid var(--color-primary); border-image: linear-gradient(180deg, rgba(0,0,0,0) 8rem, rgba(0,0,0,1) 8rem, rgba(0,0,0,1) calc(100% - 6rem), rgba(0,0,0,0) calc(100% - 6rem)); border-image-slice: 1; }
.jt-blocks blockquote.wp-block-quote.is-style-plain:before { display: none; }

.jt-blocks .wp-block-quote { margin: 0; padding: 21rem 0 0; position: relative; font-style: normal; border: 0; }
.jt-blocks .wp-block-quote p,
.jt-blocks .wp-block-media-text__content .wp-block-quote p { margin-top: 0; margin-bottom: 8rem; font-size: 17rem; line-height: 1.77; font-weight: 400; letter-spacing: var(--letter-spacing); font-style: normal; color: var(--color-primary); }
.jt-blocks .wp-block-quote:before { content: ''; display: block; width: 12rem; height: 8rem; position: absolute; top: 0; left: 0; background: url(../images/blocks/quote.svg) no-repeat center center; background-size: contain; }

.jt-blocks .wp-block-quote__citation,
.jt-blocks .wp-block-quote cite,
.jt-blocks .wp-block-quote footer { font-size: 16rem; line-height: 1.5; font-weight: 700; letter-spacing: var(--letter-spacing); color: var(--color-primary); }

.jt-blocks .wp-block-quote.is-style-plain p { position: relative; }
.jt-blocks .wp-block-quote.is-style-plain cite { position: relative; }


 
/* **************************************** *
 * EMBED
 * **************************************** */
.jt-blocks .wp-block-embed { margin: 75rem auto 80rem; }
.jt-blocks .wp-block-embed figcaption { font-size: 16rem; line-height: 1.5; font-weight: 700; letter-spacing: var(--letter-spacing); color: var(--color-primary); text-align: left; margin-top: 12rem; width: 360rem; max-width: unset; text-align: left; position: relative; left: 50%; margin-left: -360rem; }

.jt-embed-video { margin-left: auto; margin-right: auto; position: relative; } 
.jt-embed-video__inner { position: relative; width: 100%; padding-top: 56.25%; } 
.jt-embed-video__inner iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; background: var(--color-primary) url(../images/layout/spin.gif) no-repeat center center; background-size: 32rem 32rem; } 
.jt-embed-video__poster { width: 100%; height: 100%; position: absolute; top: 0; left: 0; cursor: pointer; z-index: 1; } 
.jt-embed-video__poster .jt-embed-video__img { display: block; width: 100%; margin: 0; } 
.jt-embed-video__overlay { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: var(--color-primary); background: rgba(0, 0, 0, .4); } 
.jt-embed-video__overlay-btn { display: block; width: 48rem; height: 48rem; margin-top: -24rem; margin-left: -24rem; position: absolute; top: 50%; left: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: scale(1) translateZ(0); transform: scale(1) translateZ(0); -webkit-transition: opacity .5s cubic-bezier(.165, .84, .44, 1), -webkit-transform 1s cubic-bezier(.23, 1, .32, 1); transition: opacity .5s cubic-bezier(.165, .84, .44, 1), -webkit-transform 1s cubic-bezier(.23, 1, .32, 1); transition: opacity .5s cubic-bezier(.165, .84, .44, 1), transform 1s cubic-bezier(.23, 1, .32, 1); transition: opacity .5s cubic-bezier(.165, .84, .44, 1), transform 1s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.23, 1, .32, 1); } 
.jt-embed-video__overlay-btn svg path { fill: #fff; }
html.desktop .jt-embed-video__poster:hover .jt-embed-video__overlay-btn { opacity: 1; -webkit-transform: scale(1.2) translateZ(0); transform: scale(1.2) translateZ(0); } 

.ios .jt-embed-video__poster { opacity: 0; visibility: hidden; }



/* **************************************** *
 * SEPARATOR
 * **************************************** */
.jt-blocks .wp-block-separator { margin-top: 60rem; margin-bottom: 60rem; border-bottom-width: 2rem; border-color: var(--color-primary); opacity: 1; }
.jt-blocks .wp-block-separator:not(.is-style-wide):not(.is-style-dots) { width: 100rem; }
.jt-blocks .wp-block-separator.is-style-wide { border-bottom-width: 1rem; }



/* **************************************** *
 * OVERWRITE
 * **************************************** */
.jt-blocks > *:first-child:not(.jt-basic-header, .jt-cover-header) { margin-top: 200rem !important; }



/* **************************************** *
 * SLIDESHOW
 * **************************************** */
.block-slideshow { margin-top: 80rem; margin-bottom: 80rem; }
.jt-slideshow { position: relative; max-width: 720rem; overflow: visible; }
.jt-slideshow__slide { padding-bottom: 23rem; }
.jt-slideshow__popup { position: relative; display: block; padding-top: 100%; }
.jt-slideshow__figure { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: #f4f4f4; }
.jt-slideshow__figure img { margin: 0 auto; width: 100%; height: 100%; object-fit: contain; }
.jt-slideshow .swiper-navigation button { top: 360rem; }
.jt-slideshow .swiper-navigation button.swiper-button-disabled { opacity: 0; }
.jt-blocks .jt-slideshow__title { margin-top: 20rem; }



/* **************************************** *
 * HEADER
 * **************************************** */
.jt-cover-header .wp-block-cover__inner-container { max-width: 1200rem; margin-left: auto; margin-right: auto; font-size: 0; }
.jt-blocks .jt-cover-header { position: relative; padding-bottom: 62rem; border-bottom: 4rem solid var(--color-primary); }
.jt-blocks .jt-cover-header:after { content: ''; display: block; width: 100%; height: 2rem; background: var(--color-primary); position: absolute; bottom: 20rem; left: 0; }
.jt-blocks .jt-cover-header *:last-child { margin-bottom: 0; }
.jt-blocks .jt-cover-header + * { margin-top: 114rem; }
.jt-blocks .jt-cover-header .wp-block-cover { padding: 306rem 0 165rem; }
.jt-blocks .jt-cover-header h1 { font-size: 56rem; line-height: 1.21; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 0; margin-bottom: 18rem; }
.jt-blocks .jt-cover-header p { font-size: 16rem; line-height: 1.5; font-weight: 400; letter-spacing: var(--letter-spacing); }
.jt-blocks .jt-cover-header__meta { display: inline-block; vertical-align: top; font-size: 0; margin-bottom: 21rem; }
.jt-blocks .jt-cover-header .jt-cover-header__cat { position: relative; display: inline-block; vertical-align: top; font-size: 13rem; line-height: 1.17; font-weight: 700; letter-spacing: var(--letter-spacing); font-family: var(--font-secondary); text-transform: uppercase; margin-bottom: 0; padding-right: 22rem; }
.jt-blocks .jt-cover-header .jt-cover-header__cat:after { content: ''; display: block; width: 2rem; height: 9rem; background: #fff; position: absolute; top: 2rem; right: 10rem; }
.jt-blocks .jt-cover-header .wp-block-post-terms a { font-size: 13rem; line-height: 1.17; font-weight: 700; letter-spacing: var(--letter-spacing); color: inherit; }
.jt-blocks .jt-cover-header .wp-block-post-date { display: inline-block; vertical-align: top; }
.jt-blocks .jt-cover-header .wp-block-post-date time { font-size: 13rem; line-height: 1.17; font-weight: 700; letter-spacing: var(--letter-spacing); font-family: var(--font-secondary); text-transform: uppercase; }
html.desktop.mac .jt-blocks .jt-cover-header .jt-cover-header__cat:after { top: 3rem; }

.jt-blocks .jt-basic-header { padding: 194rem 0 74rem; }
.jt-blocks .jt-basic-header h1 { font-size: 56rem; line-height: 1.21; font-weight: 700; letter-spacing: var(--letter-spacing); margin-top: 0; margin-bottom: 18rem; }
.jt-blocks .jt-basic-header p { font-size: 16rem; line-height: 1.5; font-weight: 400; letter-spacing: var(--letter-spacing); color: var(--color-primary); }
.jt-blocks .jt-basic-header *:last-child { margin-bottom: 0; }
.jt-blocks .jt-basic-header__meta { display: inline-block; vertical-align: top; font-size: 0; margin-bottom: 21rem; }
.jt-blocks .jt-basic-header .jt-basic-header__cat { position: relative; display: inline-block; vertical-align: top; font-size: 13rem; line-height: 1.17; font-weight: 700; letter-spacing: var(--letter-spacing); font-family: var(--font-secondary); text-transform: uppercase; margin-bottom: 0; padding-right: 22rem; }
.jt-blocks .jt-basic-header .jt-basic-header__cat:after { content: ''; display: block; width: 2rem; height: 9rem; background: var(--color-primary); position: absolute; top: 2rem; right: 10rem; }
.jt-blocks .jt-basic-header .wp-block-post-date { display: inline-block; vertical-align: top; }
.jt-blocks .jt-basic-header .wp-block-post-date time { font-size: 13rem; line-height: 1.17; font-weight: 700; letter-spacing: var(--letter-spacing); font-family: var(--font-secondary); text-transform: uppercase; }
html.desktop.mac .jt-blocks .jt-basic-header .jt-basic-header__cat:after { top: 3rem; }

.jt-blocks .jt-basic-header + * { margin-top: 0; }

.jt-blocks .jt-basic-header + h1,
.jt-blocks .jt-basic-header + h2,
.jt-blocks .jt-basic-header + h3,
.jt-blocks .jt-basic-header + h4,
.jt-blocks .jt-basic-header + h5,
.jt-blocks .jt-basic-header + h6 { margin-top: 32rem; }
.jt-blocks .jt-basic-header + p { margin-top: 32rem; }
.jt-blocks .jt-basic-header + blockquote.wp-block-quote { margin-top: 40rem; }
.jt-blocks .jt-basic-header + .jt-blocks ul:not(.blocks-gallery-grid), 
.jt-blocks .jt-basic-header + .jt-blocks ol:not(.blocks-gallery-grid) { margin-top: 35rem; }



/* **************************************** *
 *  POST PASSWORD FORM
 * **************************************** */
.jt-single .jt-blocks > *.post-password-form { margin : 0 auto; padding-top: 66rem; padding-bottom: 200rem; }
.jt-blocks > .post-password-form { max-width: 1200rem; text-align: center; }
.jt-blocks .post-password-form p { margin-bottom: 0; }
.jt-blocks h2.post-password-form__title { margin-top: 0; margin-bottom: 12rem; }
.jt-blocks p.post-password-form__desc { margin-bottom: 34rem; }
.post-password-form__field-wrap { display: inline-block; vertical-align: top; font-size: 0; }
.post-password-form__field-wrap > * { position: relative; display: inline-block; vertical-align: top; }
.post-password-form__field-wrap > *:first-child { margin-right: 10rem;}
.post-password-form__field-wrap input[type="password"] { width: 341rem; height: 47rem; font-size: 16rem; line-height: normal; border: 1rem solid #ddd; background: transparent; border-radius: 0; padding: 10rem 64rem 10rem 20rem; transition: border .2s; }
.post-password-form__field-wrap input[type="password"]:focus, .post-password-form__field-wrap input[type="password"]:hover { border-color: #000; }
.post-password-form__reset { display: block; width: 24rem; height: 24rem; margin: 0; padding: 0; position: absolute; right: 20rem; top: 12rem; background: #d9d9d9; border: 0; border-radius: 50%; opacity: 0; -webkit-transition: opacity .15s; transition: opacity .15s; cursor: pointer; }
.post-password-form__reset:before { content: ''; display: block; width: 10rem; height: 2rem; background: var(--color-primary); position: absolute; top: 50%; left: 50%; margin-top: -1rem; margin-left: -5rem; transform: rotate(45deg); }
.post-password-form__reset:after { content: ''; display: block; width: 10rem; height: 2rem; background: var(--color-primary); position: absolute; top: 50%; left: 50%; margin-top: -1rem; margin-left: -5rem; transform: rotate(-45deg); }
.post-password-form--active .post-password-form__reset { opacity: 1; visibility: visible; }
.post-password-form__submit { font-size: 16rem; font-weight: 700; line-height: 1.5; letter-spacing: var(--letter-spacing); border: 2rem solid #000; background: transparent; padding: 10rem 53rem 9rem; color: var(--color-primary); margin: 0; transition: background .3s, color .3s; cursor: pointer; }
.post-password-form__submit:hover { background: var(--color-primary); color: #fff; }
html.mac.safari .post-password-form__submit { padding-top: 11rem; padding-bottom: 8rem; }