@charset "utf-8";
/*-------------------------------------
  Apply customizer style
-------------------------------------*/
/* hero area */
.isHideHero .snsVisualSection, .isHideHeroTitle .snsVisualSection .siteName, .isHideHeroDescription .snsVisualSection .siteDescription { display: none; }
.snsVisualSection::before { width: 100%; height: 100%; background-color: var(--hero-overlay-color); display: block; content: ''; position: absolute; top: 0; left: 0; opacity: calc(var(--hero-overlay-opacity) / 100); }
.snsVisualSection .siteName { color: var(--title-color); font-family: var(--title-font-family); font-size: calc(var(--title-font-size) - 36 * (900px - 100vw) / 900); font-weight: var(--title-font-weight); font-style: var(--title-font-style); text-decoration-line: var(--title-text-decoration-line); text-shadow: 1px 1px 12px var(--title-shadow-color), -1px -1px 12px var(--title-shadow-color); }
.snsVisualSection .siteDescription { color: var(--description-color); font-family: var(--description-font-family); font-size: calc(var(--description-font-size) - 10 * (900px - 100vw) / 900); font-weight: var(--description-font-weight); font-style: var(--description-font-style); text-decoration-line: var(--description-text-decoration-line); text-shadow: 1px 1px 12px var(--description-shadow-color), -1px -1px 12px var(--description-shadow-color); }
@media screen and (min-width: 900px) {
  .snsVisualSection .siteName { font-size: var(--title-font-size); }
  .snsVisualSection .siteDescription { font-size: var(--description-font-size); text-align: center; }
}
/* header */
.isFixedHeader { padding-top: 50px; }
.isFixedHeader .glbHeader { position: fixed; top: 0; left: 0; }
.isFixedHeader .glbHeader .logo { position: fixed; z-index: 1001; }
.glbHeader, .glbHeader .logo { background-color: var(--header-background-color); }
body:not(.isOpenDrawer) .glbHeader::after { background-color: var(--header-border-bottom-color); }
.glbHeader { box-shadow: 0 2px 10px var(--header-shadow-color); }
.glbHeader .logo::before { background-color: var(--header-overlay-color); opacity: calc(var(--header-overlay-opacity) / 100); }
.isOpenDrawer .glbHeader .logo::before { background-color: var(--header-overlay-color); opacity: calc(var(--header-overlay-opacity) / 100); }
.isCloseDrawer .glbHeader .logo::before { background-color: var(--header-overlay-color); opacity: calc(var(--header-overlay-opacity) / 100); }
.glbHeader, .glbHeader .logo a, .glbHeader .logo a:hover { color: var(--logo-color); font-family: var(--logo-font-family); font-size: var(--logo-font-size); font-weight: var(--logo-font-weight); font-style: var(--logo-font-style); text-decoration-line: var(--logo-text-decoration-line); }
.glbHeader .logo a { text-shadow: 1px 1px 12px var(--logo-shadow-color), -1px -1px 12px var(--logo-shadow-color); }
.snsWrap .postListTitle, .snsWrap .postMainCategory, .snsWrap .mypageTitle { color: var(--logo-color); }
/* nav */
.isHideNavigation .glbHeader .glbNav { display: none; }
.glbHeader .glbNav a { background-color: var(--nav-background-color); color: var(--nav-color); font-family: var(--nav-font-family); font-size: var(--nav-font-size); font-weight: var(--nav-font-weight); font-style: var(--nav-font-style); text-decoration-line: var(--nav-text-decoration-line); }
.glbHeader .glbNav a:hover { background-color: var(--nav-hover-background-color); color: var(--nav-hover-color); font-style: var(--nav-hover-font-style); text-decoration-line: var(--nav-hover-text-decoration-line); }
/* drawer */
@media screen and (min-width: 900px) {
  .isHideDrawer .drawer { display: none; }
  .glbHeader .toggleMenu.isActive .megaMenuList li::before { width: 100%; height: 100%; background-color: var(--header-overlay-color); display: block; content: ''; position: absolute; top: 0; left: 0; opacity: calc(var(--header-overlay-opacity) / 100); transition: none; }
  .glbHeader .toggleMenu.isActive .megaMenuList ul a { background-color: var(--nav-background-color); position: relative; }
  .glbHeader .toggleMenu.isActive .megaMenuList ul a:hover { background-color: var(--nav-hover-background-color); }
}
.drawer .iconDrawer, .drawer .iconDrawer::before, .drawer .iconDrawer::after { background: var(--drawer-bar-color); }
.drawer .drawerBtn { border-color: var(--drawer-border-color); background: var(--drawer-background-color); }
.drawer .drawerBtn { border-radius: var(--drawer-close-border-radius); }
.drawer.isOpen .drawerBtn { border-radius: var(--drawer-open-border-radius); }
.drawer::before { background-color: var(--header-background-color); }
.drawer .drawerMenuWrap { background-color: var(--drawer-menu-background-color); }
.glbHeader .drawer .drawerMenu a { background-color: var(--drawer-menu-background-color); color: var(--drawer-menu-color); font-family: var(--drawer-menu-font-family); font-size: var(--drawer-menu-font-size); font-weight: var(--drawer-menu-font-weight); font-style: var(--drawer-menu-font-style); text-decoration-line: var(--drawer-menu-text-decoration-line); }
.glbHeader .drawer .drawerMenu a.isSelected { background-color: var(--drawer-menu-selected-background-color); }
/* body background */
body::before { width: 100%; height: 100%; background-color: var(--background-overlay-color); display: block; content: ''; position: fixed; top: 0; left: 0; z-index: -1; opacity: calc(var(--background-overlay-opacity) / 100); }
/* footer */
.isFixedFooter { height: auto; padding-bottom: 150px; }
.isFixedFooter .glbFooter { position: fixed; bottom: 0; left: 0; }
.glbFooter::before { width: 100%; height: 100%; background-color: var(--footer-overlay-color); display: block; content: ''; position: absolute; top: 0; left: 0; opacity: calc(var(--footer-overlay-opacity) / 100); }
.glbFooter::after { background-color: var(--footer-border-bottom-color); }
.glbFooter { background-color: var(--footer-background-color); }
.glbFooter { box-shadow: 0 -2px 10px var(--footer-box-shadow-color); text-shadow: 1px 1px 12px var(--footer-text-shadow-color), -1px -1px 12px var(--footer-text-shadow-color); }
.glbFooter { color: var(--footer-color); font-family: var(--footer-font-family); font-size: var(--footer-font-size); font-weight: var(--footer-font-weight); font-style: var(--footer-font-style); text-decoration-line: var(--footer-text-decoration-line); white-space: nowrap; }
/* typography    site text */
html, body, 
body > .tox-tinymce-aux.tox .tox-dialog__title, body > .tox-tinymce-aux.tox .tox-dialog__header, body > .tox-tinymce-aux.tox .tox-label, body > .tox-tinymce-aux.tox .tox-toolbar-label, body > .tox-tinymce-aux.tox .tox-textfield, 
.wp-core-ui .media-modal-content div, .wp-core-ui .media-modal-content h1, .wp-core-ui .media-modal-content h2, body .wp-core-ui .media-modal-content .name, 
body .media-modal.wp-core-ui, .media-frame input[type=color], .media-frame input[type=date], .media-frame input[type=datetime-local], .media-frame input[type=datetime], .media-frame input[type=email], .media-frame input[type=month], .media-frame input[type=number], .media-frame input[type=password], .media-frame input[type=search], .media-frame input[type=tel], .media-frame input[type=text], .media-frame input[type=time], .media-frame input[type=url], .media-frame input[type=week], .media-frame select, .media-frame textarea, 
.snsWrap, .snsWrap .snsCommentForm .commentAuthor, .snsWrap input[type="text"], .snsWrap input[type="tel"], .snsWrap input[type="email"], .snsWrap input[type="url"], .snsWrap input[type="search"], .snsWrap input[type="password"], .snsWrap input[type="color"], .snsWrap .select select { color: var(--site-text-color); font-family: var(--site-text-font-family); }
:root { --form-radio-color: var(--site-text-color); }
:root {--form-radio-checked-color: var(--site-text-color); }
/* typography    post title */
.snsWrap .postTitle, .snsWrap .postTitle a { color: var(--post-title-color); font-family: var(--post-title-font-family); font-weight: var(--post-title-font-weight); font-style: var(--post-title-font-style); text-decoration-line: var(--post-title-text-decoration-line); }
/* typography    post title in single page */
.snsWrap .isSingle .postTitle { font-size: var(--post-title-font-size); }
/* typography    post content */
.postList p, .snsArticle p, .editContent .contentHTML { color: var(--post-content-color); font-family: var(--post-content-font-family); font-weight: var(--post-content-font-weight); font-style: var(--post-content-font-style); text-decoration-line: var(--post-content-text-decoration-line); }
/* typography    post content in single page */
.snsWrap .isSingle .snsArticle p { font-size: var(--post-content-font-size); }
/* typography    post author */
.snsWrap .authorLink, .snsWrap .authorLink a, .snsWrap .userName { color: var(--post-author-color); font-family: var(--post-author-font-family); font-weight: var(--post-author-font-weight); font-style: var(--post-author-font-style); text-decoration-line: var(--post-author-text-decoration-line); }
/* typography    post author in single page */
.snsWrap .isSingle .authorLink { font-size: var(--post-author-font-size); }
/* typography    post date */
.snsWrap .postDate, .snsWrap .postDate a { color: var(--post-date-color); font-family: var(--post-date-font-family); font-weight: var(--post-date-font-weight); font-style: var(--post-date-font-style); text-decoration-line: var(--post-date-text-decoration-line); }
/* typography    post date in single page */
.snsWrap .isSingle .postDate { font-size: var(--post-date-font-size); }
/* typography    comment */
.snsWrap .commentContent .guestComment, #snsEditCommentForm .commentHTML, #snsCommentForm textarea[name="comment"] { color: var(--comment-color); font-family: var(--comment-font-family); font-weight: var(--comment-font-weight); font-style: var(--comment-font-style); text-decoration-line: var(--comment-text-decoration-line); }
/* typography    comment in single page */
.snsWrap .isSingle .commentContent .guestComment, .snsWrap .isSingle #snsEditCommentForm .commentHTML, .snsWrap .isSingle #snsCommentForm textarea[name="comment"] { font-size: var(--comment-font-size); }
/* typography    comment author */
.snsWrap .commentAuthor, .snsWrap .commentAuthor a { color: var(--comment-author-color); font-family: var(--comment-author-font-family); font-weight: var(--comment-author-font-weight); font-style: var(--comment-author-font-style); text-decoration-line: var(--comment-author-text-decoration-line); }
/* typography    comment author in single page */
.snsWrap .isSingle .commentAuthor { font-size: var(--comment-author-font-size); }
/* typography    comment date */
.snsWrap .commentMetaData time, #snsComments .commentMetaData time { color: var(--comment-date-color); font-family: var(--comment-date-font-family); font-weight: var(--comment-date-font-weight); font-style: var(--comment-date-font-style); text-decoration-line: var(--comment-date-text-decoration-line); }
/* typography    comment date in single page */
.snsWrap .isSingle #snsComments .commentMetaData time { font-size: var(--comment-date-font-size); }
/* typography    link */
a:not(.button) { color: var(--link-color); font-family: var(--link-font-family); font-style: var(--link-font-style); text-decoration-line: var(--link-text-decoration-line); }
a:not(.button):hover { color: var(--link-hover-color); font-style: var(--link-hover-font-style); text-decoration-line: var(--link-hover-text-decoration-line); }
@media screen and (min-width: 900px) {
  .snsWrap a:not(.button, .postMediaLink, .avatarLink):hover { opacity: calc(var(--link-hover-opacity) / 100); }
  .snsWrap .snsPagination a:hover { opacity: 1; }
}
/* TinyMCE button (and text) */
body > .tox-tinymce-aux.tox .tox-button:not(.tox-button--icon) { padding: 0 16px; }
body > .tox-tinymce-aux.tox .tox-button, body > .tox-tinymce-aux.tox .tox-button:focus { border-color: var(--button-border-color); border-radius: var(--button-border-radius); background-color: var(--button-background-color); color: var(--button-color); font-family: var(--button-font-family); font-size: var(--button-font-size); font-weight: var(--button-font-weight); line-height: var(--button-line-height); fill: var(--button-color) !important; }
body > .tox-tinymce-aux.tox .tox-tbtn, body > .tox-tinymce-aux.tox .tox-tbtn svg { background-color: transparent; color: var(--button-color); fill: var(--button-color) !important; }
body > .tox-tinymce-aux.tox .tox-slider__handle { border-color: var(--button-color); border-radius: var(--button-border-radius); background: var(--button-color); }
body > .tox-tinymce-aux.tox .tox-slider__rail { border-color: var(--button-color); }
body > .tox-tinymce-aux.tox input[type="range"]::-webkit-slider-runnable-track { border-color: var(--button-color); }
body > .tox-tinymce-aux.tox input[type="range"]::-webkit-slider-thumb { border-color: var(--button-color); background: var(--button-color); }
body > .tox-tinymce-aux.tox input[type="range"]::-moz-range-thumb { border-color: var(--button-color); background: var(--button-color); }
@media screen and (min-width: 641px) and (min-height: 401px) {
  body > .tox-tinymce-aux.tox .tox-tbtn:hover, body > .tox-tinymce-aux.tox .tox-tbtn:hover svg { background-color: var(--button-hover-background-color); color: var(--button-hover-color); fill: var(--button-hover-color) !important; }
  body > .tox-tinymce-aux.tox .tox-button--naked.tox-button--icon:hover:not(:disabled) { border-color: var(--button-hover-border-color); border-radius: var(--button-hover-border-radius); background: var(--button-hover-background-color); color: var(--button-hover-color); }
  body > .tox-tinymce-aux.tox .tox-button:hover:not(:disabled), body > .tox-tinymce-aux.tox .tox-button--secondary:hover:not(:disabled) { border-color: var(--button-hover-border-color); border-radius: var(--button-hover-border-radius); background: var(--button-hover-background-color); color: var(--button-hover-color); fill: var(--button-hover-color) !important; }
}
/* Media uploader button */
.media-router .media-menu-item:focus { box-shadow: none; }
.media-modal.wp-core-ui .button, .media-modal.wp-core-ui .media-sidebar .copy-attachment-url, .media-modal.wp-core-ui .media-frame .mediaInfoBtnWrap .mediaInfoBtn { width: auto; min-height: auto; padding: 0 8px; border-color: var(--button-border-color); border-radius: var(--button-border-radius); background-color: var(--button-background-color); color: var(--button-color); font-family: var(--button-font-family); font-size: var(--button-font-size); font-weight: var(--button-font-weight); box-shadow: none; transition: all 0.3s; }
.media-modal.wp-core-ui .media-sidebar .copy-attachment-url { padding: 0 4px; font-size:min(var(--button-font-size), 13px); }
.media-modal.wp-core-ui .attachments-browser .load-more, .media-modal.wp-core-ui .attachments-browser .load-more-jump { font-size:min(var(--button-font-size), 16px); }
.media-modal.wp-core-ui .media-frame .mediaInfoBtnWrap .mediaInfoBtn { padding: 0 2px; font-size:min(var(--button-font-size), 13px); }
.media-modal.wp-core-ui .media-menu-item { color: var(--button-color); font-family: var(--button-font-family); font-weight: var(--button-font-weight); box-shadow: none; }
.media-modal.wp-core-ui .button, .media-modal.wp-core-ui .media-frame .mediaInfoBtnWrap .mediaInfoBtn { line-height: var(--button-line-height); }
.wp-core-ui .attachment.details, .wp-core-ui .attachment.details:focus, .wp-core-ui .attachment:focus, .wp-core-ui .selected.attachment:focus { box-shadow: inset 0 0 2px 3px #FFF, inset 0 0 0 7px var(--button-color); }
.wp-core-ui .attachment.details .check, .wp-core-ui .attachment.selected .check:focus, .wp-core-ui .media-frame.mode-grid .attachment.selected .check { background-color: var(--button-color); box-shadow: 0 0 0 1px #FFF, 0 0 0 2px var(--button-color); }
.wp-core-ui .media-progress-bar div { background: var(--button-color); }
@media screen and (min-width: 900px) {
  .media-router .media-menu-item:not(.active):hover { color: var(--button-color); }
  .media-modal.wp-core-ui .button:hover { border-color: var(--button-hover-border-color); border-radius: var(--button-hover-border-radius); background-color: var(--button-hover-background-color); color: var(--button-hover-color); line-height: var(--button-line-height); box-shadow: none; }
  .media-modal.wp-core-ui .media-sidebar .copy-attachment-url { padding: 0 8px; font-size:min(var(--button-font-size), 16px); }
}
/* button */
.snsWrap .button:not(.metaBtn) { border-color: var(--button-border-color); border-radius: var(--button-border-radius); background-color: var(--button-background-color); color: var(--button-color); }
.snsWrap .button:not(.metaBtn, .dashicons) { font-family: var(--button-font-family); font-size: var(--button-font-size); font-weight: var(--button-font-weight); line-height: var(--button-line-height); }
@media screen and (min-width: 900px) {
  .snsWrap .button:not(.disabled, .metaBtn):hover, .snsWrap .button:not(.disabled, .metaBtn):active { border-color: var(--button-hover-border-color); border-radius: var(--button-hover-border-radius); background-color: var(--button-hover-background-color); color: var(--button-hover-color); }
}
/* post meta button */
.snsPostMetaForm .metaBtn { border-color: var(--post-meta-button-color); border-radius: var(--post-meta-button-border-radius); background-color: var(--post-meta-button-background-color); color: var(--post-meta-button-color); font-family: var(--post-meta-button-font-family); font-size: var(--post-meta-button-font-size); font-weight: var(--post-meta-button-font-weight); line-height: var(--post-meta-button-line-height); }
.snsPostMetaForm .metaCount .count { font-family: arial, sans-serif; color: var(--post-meta-button-color); }
/* user meta button */
.snsUserMetaForm .metaBtn { border-color: var(--user-meta-button-color); border-radius: var(--user-meta-button-border-radius); background-color: var(--user-meta-button-background-color); color: var(--user-meta-button-color); font-family: var(--user-meta-button-font-family); font-size: var(--user-meta-button-font-size); font-weight: var(--user-meta-button-font-weight); line-height: var(--user-meta-button-line-height); }
.snsUserMetaForm .metaCount .count { font-family: arial, sans-serif; color: var(--user-meta-button-color); }
/* pagination */
.snsPagination a, .snsPagination .current { min-width: var(--pagination-height); height: var(--pagination-height); border-width: var(--pagination-border-width); border-color: var(--pagination-border-color); border-radius: var(--pagination-border-radius); background: var(--pagination-background-color); color: var(--pagination-color); font-family: var(--pagination-font-family); font-size: var(--pagination-font-size); font-weight: var(--pagination-font-weight); line-height: var(--pagination-line-height); }
.snsPagination a:hover, .snsPagination .current { border-color: var(--pagination-hover-border-color); border-radius: var(--pagination-hover-border-radius); background: var(--pagination-hover-background-color); color: var(--pagination-hover-color); }
.snsPagination .hellip { color: var(--pagination-color); font-family: var(--pagination-font-family); font-size: calc(var(--pagination-font-size) / 2); font-weight: 700; }
