@charset "UTF-8"; body { --black: #2a2a2a; --gray: #888; --light-gray: #f5f5f5; --dark-gray: #666; --yellow: #f7bd24; --orange: #ffa353; --pink: #fd84a0; --brown: #7b6e39; --dbrown: #8a6d3b; --lbrown: #faf5de; --bg-color: white; --bg-light-color: #f5f8fa; --paid-color: #bc9a57; --paid-light-color: #e0cfa4; --site-color: #64bdcf; --light-site-color: #c1dae4; --dark-site-color: #2092bc; --sub-color: #f7f5de; --acc-color: #e97273; --acc-color-rgb: 255, 0, 0; --link-color: #333; --hover-color: #ffc400; --link-color: #0056b3; } /*** The new CSS reset - version 1.8.3 (last updated 21.1.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ pre { all: revert; } /* reset default text opacity of input placeholder */ ::-webkit-input-placeholder { color: unset; } ::-moz-placeholder { color: unset; } :-ms-input-placeholder { color: unset; } ::-ms-input-placeholder { color: unset; } ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } html body { font-weight: 500; letter-spacing: 0; color: var(--black); } @media (max-width: 757px) { html body { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body { font-size: 1.6rem; } } @media (min-width: 1330px) { html body { font-size: 1.6rem; } } html body main ::-moz-selection { background-color: lightblue; color: white; } html body main ::selection { background-color: lightblue; color: white; } html body p:empty { display: none; } html body .page--wrapper { padding: 30px 0; } html body .page--wrapper .container .contents a { cursor: pointer; } html body .page--wrapper .container .contents.flex { display: -webkit-box; display: -ms-flexbox; display: flex; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents.flex.has-left-sidebar { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents.flex.has-left-sidebar { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media (max-width: 757px) { html body .page--wrapper .container .contents.flex.has-left-sidebar { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } html body .page--wrapper .container .contents main .entry-content h2 { font-weight: bolder; letter-spacing: normal; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content h2 { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .entry-content h2 { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .entry-content h2 { font-size: 2.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .entry-content h2 { font-size: 2.2rem; } } html body .page--wrapper .container .contents main .entry-content h2 + p { margin-top: 1em; } html body .page--wrapper .container .contents main .entry-content h3 { font-weight: bolder; letter-spacing: normal; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content h3 { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .entry-content h3 { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .entry-content h3 { font-size: 2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .entry-content h3 { font-size: 2rem; } } html body .page--wrapper .container .contents main .entry-content h3 + p { margin-top: 0.3em; } html body .page--wrapper .container .contents main .entry-content h4 { font-weight: bolder; letter-spacing: normal; margin: 1.1rem 0; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content h4 { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .entry-content h4 { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .entry-content h4 { font-size: 2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .entry-content h4 { font-size: 2rem; } } html body .page--wrapper .container .contents main .entry-content h5 { font-weight: bolder; letter-spacing: normal; margin-bottom: 1.1rem; } html body .page--wrapper .container .contents main .entry-content h6 { font-weight: bolder; letter-spacing: normal; margin-bottom: 1.1rem; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content p { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .entry-content p { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .entry-content p { font-size: 1.6rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .entry-content p { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .entry-content p + p { margin-top: 1.5rem; } html body .page--wrapper .container .contents main .entry-content .text-center { text-align: center; } html body .page--wrapper .container .contents main .entry-content table { width: 100%; margin-top: 1em; margin-bottom: 2em; border-collapse: separate; border-right: solid 1px var(--black); border-bottom: solid 1px var(--black); border-spacing: 0px; } html body .page--wrapper .container .contents main .entry-content table tr td.first { background: #f0f0f1; } html body .page--wrapper .container .contents main .entry-content table th, html body .page--wrapper .container .contents main .entry-content table td { border: solid 1px var(--black); padding: 8px 15px; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content table th, html body .page--wrapper .container .contents main .entry-content table td { padding: 8px 10px; } } html body .page--wrapper .container .contents main .entry-content table th { background-color: var(--bg-light-color); text-align: left; border-right: 0px; border-bottom: 0px; font-size: 0.8em; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content table th { font-size: 0.7em; min-width: 50px; } } html body .page--wrapper .container .contents main .entry-content table td { border-right: 0px; border-bottom: 0px; font-size: 0.9em; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .entry-content table td { font-size: 0.8em; min-width: 50px; } } html body .page--wrapper .container .contents main .entry-content .wp-block-table { overflow-x: auto; } html body .page--wrapper .container .contents main .entry-content .alignright { float: right; margin-left: 15px; } html body .page--wrapper .container .contents main .entry-content .alignleft { float: left; margin-right: 15px; } html body .page--wrapper .container .contents main .entry-content .wp-caption { max-width: 100%; } html body .page--wrapper .container .contents main .entry-content .wp-caption img { max-width: 100%; } html body .page--wrapper .container .contents main .entry-content .wp-caption p { margin-top: 10px; font-size: 80%; line-height: 1.5; } html body .page--wrapper .container .contents main .grid-container article { margin: 15px 0 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; position: relative; padding-bottom: 1.5em; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article { padding-bottom: 15px; } } html body .page--wrapper .container .contents main .grid-container article:first-child { margin-top: 0; } html body .page--wrapper .container .contents main .grid-container article.mainv .post-eyecatch { width: 100%; height: auto; } html body .page--wrapper .container .contents main .grid-container article a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; cursor: pointer; } html body .page--wrapper .container .contents main .grid-container article a:hover { -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } html body .page--wrapper .container .contents main .grid-container article a:hover .post-eyecatch img { opacity: 1; } html body .page--wrapper .container .contents main .grid-container article a .post-eyecatch { width: 350px; height: 200px; position: relative; } html body .page--wrapper .container .contents main .grid-container article a .post-eyecatch img { -o-object-fit: cover; object-fit: cover; } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .post-eyecatch { width: 300px; height: 200px; } } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .post-eyecatch { width: 150px; height: auto; margin-right: 1em; } } html body .page--wrapper .container .contents main .grid-container article a .wrap { width: calc(100% - 350px); padding-left: 20px; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap { width: calc(100% - 300px); } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap { width: calc(100% - 300px); } } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap { width: calc(100% - 150px); padding-left: 0; } } html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-weight: normal; word-break: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; margin: 1em 0 10px; text-align: left; line-height: 1.5; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { letter-spacing: normal; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; margin: 5px 0 10px; } } @media (max-width: 757px) and (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-title { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-content { margin-bottom: 20px; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-content { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-content { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-content { font-size: 1.6rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .post-content { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { display: block; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { font-size: 1.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { font-size: 1.2rem; } } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text time { margin: 5px 0; } } html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .tag { padding-bottom: 0; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } html body .page--wrapper .container .contents main .grid-container article a .catbtn { padding: 3px 10px; color: white; background: rgba(0, 0, 0, 0.5); display: inline-block; position: absolute; right: 0; top: 0; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.2rem; } } @media (max-width: 757px) and (max-width: 757px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.08rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.08rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.2rem; } } @media (max-width: 757px) and (min-width: 1330px) { html body .page--wrapper .container .contents main .grid-container article a .catbtn { font-size: 1.2rem; } } html body .page--wrapper .container .contents main .grid-container article .tag { line-height: 1.2; padding-top: 0; padding-bottom: 5px; } html body .page--wrapper .container .contents main .grid-container article .tag span { font-size: 1.2rem; display: inline-block; padding: 0 8px 0 0; } html body .page--wrapper .container .contents main .grid-container article .tag span:first-child { padding-left: 0; } html body .page--wrapper .container .contents main .navigation { margin: 5em 0 0; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation { margin: 2em 0 1em; } } html body .page--wrapper .container .contents main .navigation.last-post { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } html body .page--wrapper .container .contents main .navigation.first-post { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } html body .page--wrapper .container .contents main .navigation .navigation--previous, html body .page--wrapper .container .contents main .navigation .navigation--next { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-preferred-size: 50%; flex-basis: 50%; position: relative; } html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { letter-spacing: normal; line-height: 1.6; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.6rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.6rem; } } @media (max-width: 757px) and (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous a, html body .page--wrapper .container .contents main .navigation .navigation--next a { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .navigation .navigation--previous a img, html body .page--wrapper .container .contents main .navigation .navigation--next a img { display: none; min-width: 50px; max-width: 50px; } html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text { letter-spacing: normal; margin: 0; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text { font-size: 1.6rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { display: block; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.6rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.6rem; } } @media (max-width: 757px) and (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-text span, html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--previous-text span { font-size: 1.6rem; } } html body .page--wrapper .container .contents main .navigation .navigation--next { padding-right: 35px; padding-left: 20px; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; text-align: right; } html body .page--wrapper .container .contents main .navigation .navigation--next:before, html body .page--wrapper .container .contents main .navigation .navigation--next:after { content: ""; width: 20px; height: 3px; display: inline-block; border-radius: 2px; background: #aaa; position: absolute; right: 0; } html body .page--wrapper .container .contents main .navigation .navigation--next:before { top: 20px; -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 0; } html body .page--wrapper .container .contents main .navigation .navigation--next:after { top: 33px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); right: 0; } html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-link:before { content: "次の記事"; display: inline-block; background: var(--site-color); color: white; padding: 5px 10px; border-radius: 5px; line-height: 1; margin-bottom: 10px; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-link:before { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-link:before { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-link:before { font-size: 1.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--next .navigation--next-link:before { font-size: 1.2rem; } } html body .page--wrapper .container .contents main .navigation .navigation--previous { padding-left: 35px; padding-right: 20px; position: relative; } html body .page--wrapper .container .contents main .navigation .navigation--previous:before, html body .page--wrapper .container .contents main .navigation .navigation--previous:after { content: ""; width: 20px; height: 3px; display: inline-block; border-radius: 2px; background: #aaa; position: absolute; left: 0; } html body .page--wrapper .container .contents main .navigation .navigation--previous:before { top: 20px; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); left: 0; } html body .page--wrapper .container .contents main .navigation .navigation--previous:after { top: 33px; -webkit-transform: rotate(45deg); transform: rotate(45deg); left: 0; } html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-link:before { content: "前の記事"; display: inline-block; background: var(--site-color); color: white; padding: 5px 10px; border-radius: 5px; line-height: 1; margin-bottom: 10px; } @media (max-width: 757px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-link:before { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-link:before { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-link:before { font-size: 1.2rem; } } @media (min-width: 1330px) { html body .page--wrapper .container .contents main .navigation .navigation--previous .navigation--previous-link:before { font-size: 1.2rem; } } html body .page--wrapper .container .contents.has-left-sidebar main { padding-left: 6%; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents.has-left-sidebar main { padding-left: 6%; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents.has-left-sidebar main { padding-left: 0; } } @media (max-width: 757px) { html body .page--wrapper .container .contents.has-left-sidebar main { padding-left: 0; } } html body .page--wrapper .container .contents.has-right-sidebar main { padding-right: 8%; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .page--wrapper .container .contents.has-right-sidebar main { padding-right: 8%; } } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents.has-right-sidebar main { padding-right: 0; } } @media (max-width: 757px) { html body .page--wrapper .container .contents.has-right-sidebar main { padding-right: 0; } } html body .page--wrapper .container .contents.full-width { width: 100%; } @media (min-width: 758px) and (max-width: 1024px) { html body .page--wrapper .container .contents.has-left-sidebar main, html body .page--wrapper .container .contents.has-right-sidebar main { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } } @media (max-width: 757px) { html body .page--wrapper .container .contents.has-left-sidebar main, html body .page--wrapper .container .contents.has-right-sidebar main { -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } } html body .container { padding-left: 0; padding-right: 0; margin-left: auto; margin-right: auto; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body .container { padding-right: 6%; padding-left: 6%; } } @media (min-width: 758px) and (max-width: 1024px) { html body .container { padding-right: 6%; padding-left: 6%; } } @media (max-width: 757px) { html body .container { padding-right: 6%; padding-left: 6%; } } html body .flex-container { display: -webkit-box; display: -ms-flexbox; display: flex; } @media (min-width: 758px) and (max-width: 1024px) { html body .flex-container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } @media (max-width: 757px) { html body .flex-container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } html body time { font-size: 1.2rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; white-space: nowrap; } html body time img { max-width: 13px; vertical-align: middle; } html body time .reloaded { border: 1px solid var(--black); font-size: 1rem; padding: 5px 6px; border-radius: 33px; line-height: 1; margin-left: 1em; } html body figure img { height: auto; } html body figure + p { margin-top: 0.3rem; } html body figure figcaption { color: gray; padding: 0.5em 0; } @media (max-width: 757px) { html body figure figcaption { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body figure figcaption { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body figure figcaption { font-size: 1.6rem; } } @media (min-width: 1330px) { html body figure figcaption { font-size: 1.6rem; } } html body figure p { margin-bottom: 0; display: none; } html body img { max-width: 100%; width: 100%; height: auto; display: block; } html body > a { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; outline: none; text-decoration: none; color: var(--black); } html body > a:hover, html body > a:focus, html body > a:target, html body > a:active { color: var(--hover-color); text-decoration: none; } html body > a.btn:hover, html body > a.btn:focus, html body > a.btn:target, html body > a.btn:active { text-decoration: none; } html body > a.btn.focus, html body > a.btn:focus { -webkit-box-shadow: none; box-shadow: none; } html body > a img:hover { opacity: 0.7; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } html body strong { font-weight: bolder; } html body del { text-decoration: line-through; } html body pre { overflow: auto; margin: 0 0 1.5em; font-size: 80%; padding: 1em; background: #f3f6fc; } html body sub { vertical-align: sub; font-size: smaller; } html body sup { vertical-align: super; font-size: smaller; } html body var { font-style: italic; } html body kbd { font-family: monospace; } html body em { font-style: italic; } html body cite { font-style: italic; } html body abbr[title] { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } html body address { display: block; font-style: italic; } html body h1 { font-weight: bolder; } @media (max-width: 757px) { html body h1 { font-size: 1.75rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body h1 { font-size: 2.125rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body h1 { font-size: 2.5rem; } } @media (min-width: 1330px) { html body h1 { font-size: 2.5rem; } } html body h1 + p { margin-top: 0.3em; } @media (max-width: 757px) { html body small { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { html body small { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { html body small { font-size: 1.2rem; } } @media (min-width: 1330px) { html body small { font-size: 1.2rem; } } header.header { position: fixed; width: 100%; z-index: 15; top: 0; padding-top: 1.5rem; padding-bottom: 1.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: white; -webkit-transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; transition: background-color 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), height 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-box-shadow 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important; -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform, background; -webkit-font-smoothing: antialiased; height: 100px; padding-left: 6%; padding-right: 6%; } @media (max-width: 757px) { header.header { padding: 10px 15px; } } header.header.scrolled { background: rgba(255, 255, 255, 0.95); -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); padding-top: 10px; padding-bottom: 10px; height: 100px; } header.header.scrolled .drawer-desktop { background-color: transparent !important; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { header.header.scrolled { height: 80px; } } @media (min-width: 758px) and (max-width: 1024px) { header.header.scrolled { height: 80px; } } @media (max-width: 757px) { header.header.scrolled { height: 80px; } } header.header .header--wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 auto; } @media (min-width: 758px) and (max-width: 1024px) { header.header .header--wrapper { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (max-width: 757px) { header.header .header--wrapper { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } header.header .header--wrapper .header--left .site_logo--text a .brand { font-family: "Kaisei Opti", serif; font-style: normal; font-weight: 700; letter-spacing: -2px; } @media (max-width: 757px) { header.header .header--wrapper .header--left .site_logo--text a .brand { font-size: 2rem; } } header.header .header--wrapper .header--left .site_logo--text a .brand span { color: var(--site-color); letter-spacing: -3px; } header.header .header--wrapper .header--left .site_logo--text a .brand small { font-size: 0.7em; display: inline-block; padding-left: 0.5rem; } header.header .header--wrapper .header--left .site_logo--img { width: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } header.header .header--wrapper .header--left .site_logo--img .home-link { display: block; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } header.header .header--wrapper .header--left .site_logo--img .home-link:hover { opacity: 0.8; } header.header .header--wrapper .header--left .site_logo--img a img { display: block; height: 100px; width: auto; padding: 15px 0 0; will-change: transform; -webkit-transform-origin: left center; transform-origin: left center; -webkit-transition: padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); transition: padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), padding 0.4s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.4s cubic-bezier(0.4, 0, 0.2, 1); } header.header .header--wrapper .header--left .site_logo--img a img.scrolled { -webkit-transform: scale(0.6); transform: scale(0.6); padding: 0; } @media (min-width: 758px) and (max-width: 1024px) { header.header .header--wrapper .header--left .site_logo--img a img { height: 100px; margin-right: 5px; padding: 15px 0; } } @media (max-width: 757px) { header.header .header--wrapper .header--left .site_logo--img a img { max-height: 60px; margin-right: 5px; padding: 0; } } header.header .header--wrapper .header--left .site_logo--img .site-description { margin-left: 1.5rem; } header.header .header--wrapper .header--right { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; display: -webkit-box; display: -ms-flexbox; display: flex; } @media (max-width: 757px) { header.header .header--wrapper .header--right .drawer-mobile { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } header.header .header--wrapper .header--right .drawer-desktop { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 758px) and (max-width: 1024px) { header.header .header--wrapper .header--right .drawer-desktop { display: none; } } @media (max-width: 757px) { header.header .header--wrapper .header--right .drawer-desktop { display: none; } } header.header .header--wrapper .header--right .drawer-desktop .menu-list { list-style: none; padding: 0; margin-right: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item { margin: 0 15px; position: relative; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a { text-decoration: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: inherit; position: relative; font-weight: 700; -webkit-transition: color 0.5s ease, -webkit-transform 0.3s ease; transition: color 0.5s ease, -webkit-transform 0.3s ease; transition: transform 0.3s ease, color 0.5s ease; transition: transform 0.3s ease, color 0.5s ease, -webkit-transform 0.3s ease; } @media (max-width: 757px) { header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a { font-size: 1.4rem; } } @media (min-width: 1330px) { header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a { font-size: 1.4rem; } } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a:before { -webkit-transition: border-color 0.5s ease, -webkit-transform 0.3s ease; transition: border-color 0.5s ease, -webkit-transform 0.3s ease; transition: transform 0.3s ease, border-color 0.5s ease; transition: transform 0.3s ease, border-color 0.5s ease, -webkit-transform 0.3s ease; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a:hover { -webkit-transform: translateX(-3px); transform: translateX(-3px); color: var(--hover-color); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a:hover:before { border-color: var(--hover-color); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .menu-item a .menu-icon { width: 20px; height: 20px; margin-right: 5px; -o-object-fit: contain; object-fit: contain; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; will-change: transform; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-item { position: relative; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item { width: 0; margin: 0; padding: 0; overflow: hidden; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; visibility: hidden; position: absolute; right: 100%; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item.active { width: 250px; margin: 0 15px; visibility: visible; position: static; opacity: 1; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper { padding: 8px; z-index: 1000; white-space: nowrap; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield { width: 100%; padding: 10px 12px; border: 1px solid #e0e0e0; border-radius: 5rem; opacity: 1; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; background-color: #f8f8f8; font-size: 14px; color: #333; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield::-webkit-input-placeholder { color: #656565; font-size: 13px; font-weight: 300; opacity: 0.8; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield::-moz-placeholder { color: #656565; font-size: 13px; font-weight: 300; opacity: 0.8; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield:-ms-input-placeholder { color: #656565; font-size: 13px; font-weight: 300; opacity: 0.8; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield::-ms-input-placeholder { color: #656565; font-size: 13px; font-weight: 300; opacity: 0.8; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield::placeholder { color: #656565; font-size: 13px; font-weight: 300; opacity: 0.8; } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchfield:focus { outline: none; border-color: #007bff; -webkit-box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.2); box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.2); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchsubmit { margin-left: 8px; width: 50px; height: 40px; background: var(--site-color) url('data:image/svg+xml;utf8,') center no-repeat; background-size: 18px; color: transparent; border: none; border-radius: 50%; cursor: pointer; font-size: 0; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchsubmit:hover { background-color: #0056b3; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); -webkit-transform: translateY(-1px); transform: translateY(-1px); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item .search-form-wrapper .searchsubmit:active { -webkit-transform: translateY(0); transform: translateY(0); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } header.header .header--wrapper .header--right .drawer-desktop .menu-list .search-form-item.active .search-field { opacity: 1; -webkit-box-shadow: 0 0 3px rgba(0, 123, 255, 0.3); box-shadow: 0 0 3px rgba(0, 123, 255, 0.3); } body #cta { background-image: url("wp-content/themes/company/img/current/cta_bg.webp"); background-size: cover; background-position: center; padding: 10em 0; overflow: hidden; position: relative; } @media (min-width: 758px) and (max-width: 1024px) { body #cta { padding: 6em 0; } } @media (max-width: 757px) { body #cta { padding: 2em 0; } } body #cta::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: black; opacity: 0.2; } body #cta .container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; text-align: left; } @media (min-width: 758px) and (max-width: 1024px) { body #cta .container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; padding: 30px 0; } } @media (max-width: 757px) { body #cta .container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; padding: 30px 0; margin-left: 6%; margin-right: 6%; } } body #cta .container .cta-content { position: relative; margin: 0 auto; } body #cta .container .cta-content .cta-text { text-align: center; } body #cta .container .cta-content .cta-text .cta-catch { margin-bottom: 3rem; font-weight: 900; color: white; } @media (max-width: 757px) { body #cta .container .cta-content .cta-text .cta-catch { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #cta .container .cta-content .cta-text .cta-catch { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #cta .container .cta-content .cta-text .cta-catch { font-size: 2rem; } } @media (min-width: 1330px) { body #cta .container .cta-content .cta-text .cta-catch { font-size: 2rem; } } body #cta .container .cta-content .cta-text .cta-title { color: #ffa500; border-bottom: 3px solid #ffa500; display: inline-block; margin-bottom: 3rem; font-weight: 900; } @media (max-width: 757px) { body #cta .container .cta-content .cta-text .cta-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #cta .container .cta-content .cta-text .cta-title { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #cta .container .cta-content .cta-text .cta-title { font-size: 2.2rem; } } @media (min-width: 1330px) { body #cta .container .cta-content .cta-text .cta-title { font-size: 2.2rem; } } body #cta .container .cta-content .cta-text .cta-description { color: white; margin-bottom: 3rem; } body #cta .container .cta-content .cta-text .cta-list { padding: 3rem; background-color: rgb(255, 255, 255); border-radius: 8px; -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2); } body #cta .container .cta-content .cta-text .cta-list ul { list-style: none; padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body #cta .container .cta-content .cta-text .cta-list ul li { position: relative; padding-left: 1.5rem; margin-bottom: 1rem; font-weight: bold; color: var(--site-color); display: inline-block; } @media (max-width: 757px) { body #cta .container .cta-content .cta-text .cta-list ul li { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #cta .container .cta-content .cta-text .cta-list ul li { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #cta .container .cta-content .cta-text .cta-list ul li { font-size: 1.8rem; } } @media (min-width: 1330px) { body #cta .container .cta-content .cta-text .cta-list ul li { font-size: 1.8rem; } } body #cta .container .cta-content .cta-text .cta-list ul li::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); left: -0.5rem; width: 0.6rem; height: 0.6rem; background-color: var(--site-color); border-radius: 50%; } body #cta .container .cta-content input[class^=formbox-field_] { -webkit-box-sizing: border-box; box-sizing: border-box; -moz-appearance: none; appearance: none; -webkit-appearance: none; outline: none; border: 2px solid #f1f2f2; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: none; transition: none; background-color: #ffffff; padding: 15px; width: 100%; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content input[class^=formbox-field_]:focus { outline: none; border: 2px solid #f1f2f2; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: none; transition: none; background-color: #ffffff; } body #cta .container .cta-content input[class^=formbox-field_]::-webkit-input-placeholder { color: #c4c4c4; font-weight: normal; font-style: normal; font-family: Helvetica, Arial, sans-serif; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content input[class^=formbox-field_]::-moz-placeholder { color: #c4c4c4; font-weight: normal; font-style: normal; font-family: Helvetica, Arial, sans-serif; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content input[class^=formbox-field_]:-ms-input-placeholder { color: #c4c4c4; font-weight: normal; font-style: normal; font-family: Helvetica, Arial, sans-serif; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content input[class^=formbox-field_]::-ms-input-placeholder { color: #c4c4c4; font-weight: normal; font-style: normal; font-family: Helvetica, Arial, sans-serif; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content input[class^=formbox-field_]::placeholder { color: #c4c4c4; font-weight: normal; font-style: normal; font-family: Helvetica, Arial, sans-serif; line-height: 1; text-align: center; font-size: 14px; } body #cta .container .cta-content [id^=formbox_screen_subscribe_] { padding-top: 10px; } body #cta .container .cta-content .cta-copy { color: white; font-weight: 700; margin-top: 5rem; } body #cta .container .cta-content .cta-action { text-align: center; } body #cta .container .cta-content .cta-action .cta-button { display: inline-block; padding: 1rem 5rem; background-color: #ffa500; color: #fff; font-weight: bold; text-decoration: none; border-radius: 50px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; } body #cta .container .cta-content .cta-action .cta-button:after { content: ""; width: 6px; height: 6px; border: 0; border-top: solid 2px white; border-right: solid 2px white; -webkit-transform: rotate(45deg); transform: translateY(-50%) rotate(45deg); position: absolute; top: 50%; right: 20px; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } body #cta .container .cta-content .cta-action .cta-button:hover { background-color: #eca309; } footer.footer { overflow: hidden; } footer.footer .footer--wrapper { padding-top: 5rem; } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 757px) { footer.footer .footer--wrapper { padding-left: 6%; padding-right: 6%; } } footer.footer .footer--wrapper .footer--left { padding-right: 30px; -ms-flex-preferred-size: 45%; flex-basis: 45%; } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left { -ms-flex-preferred-size: 100%; flex-basis: 100%; padding-right: 0; } } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left { padding-right: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } footer.footer .footer--wrapper .footer--left a { display: -webkit-box; display: -ms-flexbox; display: flex; color: var(--black); } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } footer.footer .footer--wrapper .footer--left a img { max-width: 200px; margin-right: 1.5rem; } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a img { max-width: 130px; margin-right: 0; margin-bottom: 1rem; } } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left a img { max-width: 130px; } } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a .site-description { font-weight: 700; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.6rem; } } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left a .site-description { font-weight: 700; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } @media (max-width: 757px) and (max-width: 757px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { footer.footer .footer--wrapper .footer--left a .site-description { font-size: 1.6rem; } } footer.footer .footer--wrapper .footer--left a .brand { font-family: "Kaisei Opti", serif; font-style: normal; font-weight: 700; letter-spacing: -2px; } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left a .brand { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left a .brand { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { footer.footer .footer--wrapper .footer--left a .brand { font-size: 2rem; } } @media (min-width: 1330px) { footer.footer .footer--wrapper .footer--left a .brand { font-size: 2rem; } } footer.footer .footer--wrapper .footer--left a .brand span { color: var(--site-color); letter-spacing: -3px; } footer.footer .footer--wrapper .footer--left a .brand small { font-size: 0.7em; display: inline-block; padding-left: 0.5rem; } footer.footer .footer--wrapper .footer--left .access { margin-top: 1.5rem; margin-bottom: 3rem; } @media (max-width: 1024px) { footer.footer .footer--wrapper .footer--left .access { margin-top: 1rem; } } @media (max-width: 768px) { footer.footer .footer--wrapper .footer--left .access { margin-top: 0.5rem; } } @media (max-width: 1024px) { footer.footer .footer--wrapper .footer--left .access { margin-bottom: 2rem; } } @media (max-width: 768px) { footer.footer .footer--wrapper .footer--left .access { margin-bottom: 1rem; } } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left .access { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .footer--left .access { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { footer.footer .footer--wrapper .footer--left .access { font-size: 1.2rem; } } @media (min-width: 1330px) { footer.footer .footer--wrapper .footer--left .access { font-size: 1.2rem; } } @media (max-width: 757px) { footer.footer .footer--wrapper .footer--left .access { margin-bottom: 2rem; } } footer.footer .footer--wrapper .footer--left .sns-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 15px; } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon { display: block; width: 25px; height: 25px; background-size: contain; background-repeat: no-repeat; background-position: center; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.facebook { background-image: url("../img/sns/facebook.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.x-twitter { background-image: url("../img/sns/twitter.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.instagram { background-image: url("../img/sns/instagram.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.threads { background-image: url("../img/sns/threads.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.tiktok { background-image: url("../img/sns/tiktok.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.youtube { background-image: url("../img/sns/youtube.svg"); } footer.footer .footer--wrapper .footer--left .sns-icons .sns-icon.line { background-image: url("../img/sns/line.svg"); } footer.footer .footer--wrapper nav.footer--nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; width: initial; } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper nav.footer--nav { margin: 3rem 0 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 757px) { footer.footer .footer--wrapper nav.footer--nav { margin-top: 20px; } } footer.footer .footer--wrapper nav.footer--nav ul { list-style: none; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 600px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } @media (max-width: 757px) { footer.footer .footer--wrapper nav.footer--nav ul { max-width: 100%; } } footer.footer .footer--wrapper nav.footer--nav ul li { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 5px 0 5px 15px; } @media (max-width: 757px) { footer.footer .footer--wrapper nav.footer--nav ul li { -webkit-box-flex: 0; -ms-flex: 0 0 33%; flex: 0 0 33%; margin-top: 5px; padding: 0; border: none; } } footer.footer .footer--wrapper nav.footer--nav ul li a { font-weight: 700; margin-left: 10px; text-align: left; color: var(--black); -webkit-transition: color 0.5s ease, -webkit-transform 0.5s ease; transition: color 0.5s ease, -webkit-transform 0.5s ease; transition: transform 0.5s ease, color 0.5s ease; transition: transform 0.5s ease, color 0.5s ease, -webkit-transform 0.5s ease; padding: 12px 10px; } @media (max-width: 757px) { footer.footer .footer--wrapper nav.footer--nav ul li a { padding: 10px 0 10px 10px; } } footer.footer .footer--wrapper nav.footer--nav ul li a:before { -webkit-transition: border-color 0.5s ease, -webkit-transform 0.5s ease; transition: border-color 0.5s ease, -webkit-transform 0.5s ease; transition: transform 0.5s ease, border-color 0.5s ease; transition: transform 0.5s ease, border-color 0.5s ease, -webkit-transform 0.5s ease; } footer.footer .footer--wrapper nav.footer--nav ul li a:hover { -webkit-transform: translateX(-3px); transform: translateX(-3px); color: var(--hover-color); } footer.footer .footer--wrapper nav.footer--nav ul li a:hover:before { border-color: var(--hover-color); } footer.footer .footer--wrapper .social-links { position: relative; text-align: center; } @media (min-width: 758px) and (max-width: 1024px) { footer.footer .footer--wrapper .social-links { margin-bottom: 3em; } } footer.footer .footer--wrapper .social-links .social-bg { position: relative; display: inline-block; padding: 2em 3em; } footer.footer .footer--wrapper .social-links .social-bg::before { content: ""; position: absolute; top: 50%; left: 50%; width: 200px; height: 200px; background: url("../img/current/sns-back.svg") no-repeat center center; background-size: contain; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: rotate 20s linear infinite; animation: rotate 20s linear infinite; z-index: -1; } footer.footer .footer--wrapper .social-links .social-bg .sns-decoration { display: block; width: auto; height: auto; margin: 0 auto; } footer.footer .footer--wrapper .social-links .social-bg .sns-decoration.top { max-width: 100%; } footer.footer .footer--wrapper .social-links .social-bg .sns-decoration.bottom { max-width: 100%; margin-top: 0.5em; margin-bottom: 1em; } footer.footer .footer--wrapper .social-links h3 { font-size: 1.2em; font-weight: 700; margin-bottom: 0; } footer.footer .footer--wrapper .social-links .social-icons { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 1.5em; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } footer.footer .footer--wrapper .social-links .social-icons img { max-width: 25px; } footer.footer .footer--wrapper .social-links .social-icon { -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } footer.footer .footer--wrapper .social-links .social-icon:hover { -webkit-transform: translateY(-3px); transform: translateY(-3px); } @-webkit-keyframes rotate { from { -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } to { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } @keyframes rotate { from { -webkit-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } to { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg); } } footer.footer .footer-illustration { margin-top: 1em; text-align: center; } footer.footer .footer-illustration .illustration-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; max-width: 1200px; margin: 0 auto; } footer.footer .footer-illustration .illustration-container img { width: auto; height: auto; } footer.footer .footer-illustration .illustration-container img:nth-child(1) { max-height: 160px; } @media (max-width: 757px) { footer.footer .footer-illustration .illustration-container img:nth-child(1) { max-height: 70px; } } footer.footer .footer-illustration .illustration-container img:nth-child(2) { max-height: 150px; } @media (max-width: 757px) { footer.footer .footer-illustration .illustration-container img:nth-child(2) { max-height: 60px; } } footer.footer .footer-illustration .illustration-container img:nth-child(3) { max-height: 120px; } @media (max-width: 757px) { footer.footer .footer-illustration .illustration-container img:nth-child(3) { max-height: 50px; } } footer.footer .copyright { text-align: center; background-color: #f8f8de; padding: 2rem; } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero { margin-top: 120px; } } @media (max-width: 757px) { body.home #hero { margin-top: 90px; } } @media (max-width: 757px) { body.home #hero .container { padding: 0; } } body.home #hero .container .swiper { padding-left: 0; padding-right: 0; } body.home #hero .container .hero-swiper { width: 100%; } body.home #hero .container .hero-swiper .swiper-slide { opacity: 0; -webkit-transition: opacity 1.5s ease-in-out; transition: opacity 1.5s ease-in-out; } body.home #hero .container .hero-swiper .swiper-slide-active { opacity: 1; } body.home #hero .container .hero-swiper .swiper-pagination { bottom: 20px; } @media (max-width: 757px) { body.home #hero .container .hero-swiper .swiper-pagination { display: none; } } body.home #hero .container .hero-swiper .swiper-pagination .swiper-pagination-bullet { background: #fff; opacity: 0.5; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-swiper .swiper-pagination .swiper-pagination-bullet { background: #4c4c4c; } } body.home #hero .container .hero-swiper .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; } body.home #hero .container .hero-content { position: relative; width: 100%; min-height: 33vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content { min-height: 460px; height: auto; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } } @media (max-width: 757px) { body.home #hero .container .hero-content { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; min-height: unset; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } body.home #hero .container .hero-content .hero-image { width: 43vw; height: 100%; max-height: 45vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #hero .container .hero-content .hero-image { height: 100%; max-height: 100%; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-image { width: 50%; height: 400px; max-height: 100%; } } @media (max-width: 757px) { body.home #hero .container .hero-content .hero-image { width: 100%; max-height: 35vh; } } body.home #hero .container .hero-content .hero-image img { width: 100%; height: 600px; max-width: 900px; -o-object-fit: cover; object-fit: cover; border-radius: 0 0 0 50px; display: block; } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-image img { height: 100%; max-width: none; width: 100%; border-radius: 0 16px 16px 0; } } @media (max-width: 757px) { body.home #hero .container .hero-content .hero-image img { border-radius: 0; } } body.home #hero .container .hero-content .hero-text { position: absolute; left: 0; bottom: 50px; z-index: 2; background: #e8e872; border-radius: 16px; -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); padding: 3rem 3.5rem 3rem 3rem; width: 25vw; max-width: 90%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1rem; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #hero .container .hero-content .hero-text { width: 38vw; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-text { position: relative; width: 50%; max-width: 100%; height: 400px; padding: 2rem 2.5rem; left: auto; bottom: auto; border-radius: 16px 0 0 16px; } } @media (max-width: 757px) { body.home #hero .container .hero-content .hero-text { position: static; width: 100%; margin-top: -2.5rem; padding: 2rem; } } body.home #hero .container .hero-content .hero-text h1 { font-weight: 700; line-height: 1.5; } @media (max-width: 757px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 1.75rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 2.125rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 2.5rem; } } @media (min-width: 1330px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 2.5rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 1.54rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 1.87rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 2.2rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #hero .container .hero-content .hero-text h1 { font-size: 2.2rem; } } body.home #hero .container .hero-content .hero-text .category { color: #fff; font-weight: bold; margin-bottom: 0.5rem; background: #a99900; padding: 0.3em 0.8em; border-radius: 4px; -ms-flex-item-align: start; align-self: flex-start; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.4em; } body.home #hero .container .hero-content .hero-text .category .map-pin { width: 1em; height: 1em; display: block; } body.home #hero .container .hero-content .hero-text .excerpt { margin-bottom: 1rem; } @media (max-width: 757px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.6rem; } } @media (min-width: 1330px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.6rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.26rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.26rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.4rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #hero .container .hero-content .hero-text .excerpt { font-size: 1.4rem; } } body.home #hero .container .hero-content .hero-text .read-more { color: #a99900; font-weight: bold; text-decoration: none; margin-top: auto; text-align: right; position: relative; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; line-height: 1; margin-right: 1rem; } body.home #hero .container .hero-content .hero-text .read-more:after { content: ""; width: 0.5em; height: 0.5em; border: 0; border-top: solid 0.12em #a99900; border-right: solid 0.12em #a99900; -webkit-transform: rotate(45deg); transform: translateY(-50%) rotate(45deg); -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; top: 50%; right: -0.7em; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } body.home #hero .container .hero-content .hero-text .read-more:hover { color: var(--hover-color); -webkit-transform: scale(1.05); transform: scale(1.05); } body.home #hero .container .hero-content .hero-text .read-more:hover:after { border-color: var(--hover-color); -webkit-transform: translateY(-50%) rotate(45deg) scale(1.05); transform: translateY(-50%) rotate(45deg) scale(1.05); } body.home header.header { background: transparent; } body.home header.header.scrolled { background: #fff; } body.home header.header .header--wrapper .header--left .site_logo--img a img { padding-bottom: 0; } body.home header.header .header--wrapper .header--right .drawer-desktop { background-color: #fff; border-radius: 50px 0 0 50px; padding-left: 2rem; height: 50px; } body.home .container h2 { text-align: left; font-weight: 500; letter-spacing: -0.01em; font-size: 5rem; font-family: "Poppins", sans-serif; } body.home .container h2 span { letter-spacing: 0; } body.home #popular-articles { padding: 8rem 0 5rem; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles { padding: 2rem 0 5rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles { padding: 0 0 5rem; } } @media (max-width: 757px) { body.home #popular-articles { padding: 2rem 0 5rem; } } body.home #popular-articles .container { position: relative; } body.home #popular-articles .container h2 { text-align: left; margin-bottom: 3rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; left: 0; -webkit-transform: none; transform: none; color: #7ed6df; padding-bottom: 0.3em; } @media (max-width: 757px) { body.home #popular-articles .container h2 { margin-bottom: 1rem; } } body.home #popular-articles .container h2 span { display: inline-block; font-weight: 800; color: var(--black); border-bottom: 2px solid #7ed6df; width: 100%; margin-left: 1rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } @media (max-width: 757px) { body.home #popular-articles .container h2 span { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container h2 span { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles .container h2 span { font-size: 2rem; } } @media (min-width: 1330px) { body.home #popular-articles .container h2 span { font-size: 2rem; } } body.home #popular-articles .container .bus-icon { position: absolute; bottom: 0; left: 50px; width: 100px; height: auto; } @media (max-width: 757px) { body.home #popular-articles .container .bus-icon { left: unset; right: 40px; bottom: 20%; } } body.home #popular-articles .container .grid-container { display: grid; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, auto); gap: 30px; margin-bottom: 5rem; } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; gap: 20px; } body.home #popular-articles .container .grid-container article { grid-column: auto !important; grid-row: auto !important; } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(2), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(3), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(4), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(5) { grid-column: auto !important; grid-row: auto !important; grid-area: auto !important; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container { grid-template-columns: repeat(2, 1fr); grid-template-rows: auto; gap: 15px; } body.home #popular-articles .container .grid-container article { grid-column: auto !important; grid-row: auto !important; } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(2), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(3), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(4), body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(5) { grid-column: auto !important; grid-row: auto !important; grid-area: auto !important; } } body.home #popular-articles .container .grid-container article.featured-post { grid-column: 1/3; grid-row: 1/3; } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(2) { grid-area: 1/3; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(2) { grid-area: auto; } } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(3) { grid-area: 1/4; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(3) { grid-area: auto; } } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(4) { grid-area: 2/3; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(4) { grid-area: auto; } } body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(5) { grid-area: 2/4; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post ~ article:nth-child(5) { grid-area: auto; } } body.home #popular-articles .container .grid-container article.featured-post .post-eyecatch img { height: 615px; -o-object-fit: cover; object-fit: cover; } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article.featured-post .post-eyecatch img { height: 300px; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post .post-eyecatch img { height: 150px; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article.featured-post { grid-column: 1/-1 !important; grid-row: auto; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post { grid-column: 1/-1; grid-row: auto; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article.featured-post .post-text .post-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article.featured-post .post-text .post-title { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles .container .grid-container article.featured-post .post-text .post-title { font-size: 2.2rem; } } @media (min-width: 1330px) { body.home #popular-articles .container .grid-container article.featured-post .post-text .post-title { font-size: 2.2rem; } } body.home #popular-articles .container .grid-container article a { display: block; text-decoration: none; text-align: center; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; background: rgba(255, 255, 255, 0.1); border-radius: 8px; overflow: hidden; color: var(--black); } body.home #popular-articles .container .grid-container article a:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); } body.home #popular-articles .container .grid-container article a .post-eyecatch { position: relative; margin-bottom: 1rem; } body.home #popular-articles .container .grid-container article a .post-eyecatch .catbtn { position: absolute; top: 0; right: 0; background-color: rgba(255, 255, 255, 0.6); padding: 6px 12px; border-radius: 0 8px 0 8px; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article a .post-eyecatch .catbtn span { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article a .post-eyecatch .catbtn span { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles .container .grid-container article a .post-eyecatch .catbtn span { font-size: 1.4rem; } } @media (min-width: 1330px) { body.home #popular-articles .container .grid-container article a .post-eyecatch .catbtn span { font-size: 1.4rem; } } body.home #popular-articles .container .grid-container article a .post-eyecatch img { width: 100%; height: 220px; -o-object-fit: cover; object-fit: cover; display: block; border-radius: 20px; } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article a .post-eyecatch img { height: 200px; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article a .post-eyecatch img { height: 150px; } } body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-weight: bold; margin: 1rem 0 1.5rem 0; line-height: 1.4; text-align: left; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 2rem; } } @media (min-width: 1330px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 2rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } body.home #popular-articles .container .grid-container article a .wrap .post-text .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.5rem; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { border: 1px solid #71d4e8; font-weight: 500; padding: 0.8rem 1.3rem; line-height: 1; border-radius: 20px; } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (min-width: 1330px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (max-width: 757px) { body.home #popular-articles .container .grid-container article a .wrap .post-text .tag span { padding: 0.6rem 1rem; } } body.home #area-list { padding: 5rem 0 0; } @media (max-width: 757px) { body.home #area-list { padding: 2rem 0 0; } } body.home #area-list .container { position: relative; } body.home #area-list .container .area-list-bg { background: #f7f5de; border-radius: 30px 0 0 30px; width: calc(100% - 80px); height: 90%; padding: 5rem 0; position: absolute; z-index: -1; right: 0; } @media (max-width: 757px) { body.home #area-list .container .area-list-bg { width: 100%; height: 100%; } } body.home #area-list .container h2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; width: 100%; color: #e8e873; line-height: 0.3; } body.home #area-list .container h2 span { display: inline-block; font-weight: 700; color: var(--black); width: auto; margin-left: 1rem; margin-right: 0.3em; } @media (max-width: 757px) { body.home #area-list .container h2 span { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container h2 span { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #area-list .container h2 span { font-size: 2.2rem; } } @media (min-width: 1330px) { body.home #area-list .container h2 span { font-size: 2.2rem; } } body.home #area-list .container .area-list__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 3rem; padding: 5rem 0; } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__content { gap: 0; } } @media (max-width: 757px) { body.home #area-list .container .area-list__content { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2rem; padding: 3rem 0; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__table { width: 100%; } } body.home #area-list .container .area-list__table ul { list-style: none; padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 1.2rem; } @media (max-width: 757px) { body.home #area-list .container .area-list__table ul { gap: 1rem; } } body.home #area-list .container .area-list__table li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; border-radius: 12px; font-weight: bold; gap: 1.5rem; background: #f7f7f7; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03); margin-bottom: 1rem; padding-right: 2rem; } @media (max-width: 757px) { body.home #area-list .container .area-list__table li { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__table li { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #area-list .container .area-list__table li { font-size: 1.6rem; } } @media (min-width: 1330px) { body.home #area-list .container .area-list__table li { font-size: 1.6rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #area-list .container .area-list__table li { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__table li { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #area-list .container .area-list__table li { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #area-list .container .area-list__table li { font-size: 1.6rem; } } body.home #area-list .container .area-list__table li .area-parent { min-width: 130px; font-weight: bold; border-radius: 8px 0 0 8px; padding: 1rem 1.6rem; color: #fff; margin-right: 1rem; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-item-align: stretch; align-self: stretch; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__table li .area-parent { min-width: 110px; padding: 0.8rem 1.2rem; } } @media (max-width: 757px) { body.home #area-list .container .area-list__table li .area-parent { min-width: 90px; padding: 0.8rem 1rem; font-size: 0.9em; } } body.home #area-list .container .area-list__table li.area-chubu .area-parent { background: #b6c94b; } body.home #area-list .container .area-list__table li.area-south .area-parent { background: #7ecb6c; } body.home #area-list .container .area-list__table li.area-north .area-parent { background: #5ec6e7; } body.home #area-list .container .area-list__table li.area-shikoku .area-parent { background: #a97be2; } body.home #area-list .container .area-list__table li.area-kinki .area-parent { background: #e6b05e; } body.home #area-list .container .area-list__table li.area-kanto .area-parent { background: #e16b5c; } body.home #area-list .container .area-list__table li .area-children { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.8em; padding: 1rem 0; } body.home #area-list .container .area-list__table li .area-children .area-child { position: relative; font-weight: 500; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body.home #area-list .container .area-list__table li .area-children .area-child a { color: var(--black); text-decoration: none; -webkit-transition: color 0.2s; transition: color 0.2s; } body.home #area-list .container .area-list__table li .area-children .area-child a:hover { color: var(--hover-color); } body.home #area-list .container .area-list__table li .area-grandchild { display: block; font-size: 0.9em; margin-left: 1em; } body.home #area-list .container .area-list__table li .area-grandchild a { color: var(--black); text-decoration: none; -webkit-transition: color 0.2s; transition: color 0.2s; } body.home #area-list .container .area-list__table li .area-grandchild a:hover { color: var(--hover-color); } body.home #area-list .container .area-list__table .area-child.has-children { cursor: pointer; position: relative; padding-right: 20px; } body.home #area-list .container .area-list__table .area-child.has-children .toggle-icon { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-size: 14px; color: var(--site-color); width: 16px; height: 16px; text-align: center; line-height: 14px; border: 1px solid var(--site-color); border-radius: 50%; } body.home #area-list .container .area-list__table .area-child.has-children.active + .sub-categories { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } body.home #area-list .container .area-list__table .sub-categories { display: none; -ms-flex-wrap: wrap; flex-wrap: wrap; border: 1px solid #ccc; border-radius: 2rem; margin: 5px 0; padding: 0.5rem 0; width: 100%; } body.home #area-list .container .area-list__map { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; position: relative; min-width: 320px; } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__map { display: none; } } body.home #area-list .container .area-list__map img { width: 100%; max-width: 500px; height: auto; display: block; margin: 0 auto; } @media (min-width: 758px) and (max-width: 1024px) { body.home #area-list .container .area-list__map img:first-child { height: 100%; width: auto; max-width: none; max-height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: right center; object-position: right center; } } body.home #area-list .container .area-list__map .area-list__airplane { position: absolute; top: 18%; left: 30%; width: 80px; pointer-events: none; } body.home #area-list .container .area-list__map .area-list__shinkansen { position: absolute; top: 38%; left: 45%; width: 90px; pointer-events: none; } body.home #latest-articles { padding: 5rem 0; } body.home #latest-articles .container h2 { text-align: left; margin-bottom: 3rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; left: 0; -webkit-transform: none; transform: none; color: #e87272; padding-bottom: 0.3em; } @media (max-width: 757px) { body.home #latest-articles .container h2 { margin-bottom: 0; } } body.home #latest-articles .container h2 span { display: inline-block; font-weight: 800; color: var(--black); border-bottom: 2px solid #e87272; width: 100%; margin-left: 1rem; padding-bottom: 0.5rem; padding-left: 0.5rem; } @media (max-width: 757px) { body.home #latest-articles .container h2 span { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container h2 span { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #latest-articles .container h2 span { font-size: 2rem; } } @media (min-width: 1330px) { body.home #latest-articles .container h2 span { font-size: 2rem; } } body.home #latest-articles .container .grid-container { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; margin-bottom: 5rem; } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container { grid-template-columns: repeat(1, 1fr); gap: 20px; } } @media (max-width: 757px) { body.home #latest-articles .container .grid-container { grid-template-columns: repeat(1, 1fr); gap: 15px; } } body.home #latest-articles .container .grid-container article a { display: -webkit-box; display: -ms-flexbox; display: flex; text-decoration: none; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; background: rgba(255, 255, 255, 0.1); overflow: hidden; color: var(--black); gap: 10px; } body.home #latest-articles .container .grid-container article a:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); } body.home #latest-articles .container .grid-container article a .post-eyecatch { -webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; position: relative; } body.home #latest-articles .container .grid-container article a .post-eyecatch img { width: 100%; height: 100%; border-radius: 12px; -o-object-fit: cover; object-fit: cover; display: block; } body.home #latest-articles .container .grid-container article a .wrap { -webkit-box-flex: 0; -ms-flex: 0 0 60%; flex: 0 0 60%; padding: 1.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap { padding: 1.2rem; } } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap { padding: 1rem; } } body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-weight: bold; margin: 0 0 1rem 0; line-height: 1.4; } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } @media (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { margin: 0 0 0.8rem 0; } } @media (max-width: 757px) and (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .post-title { font-size: 1.6rem; } } body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { line-height: 1.6; margin-bottom: 1rem; display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { margin-bottom: 0.8rem; -webkit-line-clamp: 2; line-clamp: 2; } } @media (max-width: 757px) and (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.08rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.08rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.2rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .excerpt { font-size: 1.2rem; } } body.home #latest-articles .container .grid-container article a .wrap .post-text .tag { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.5rem; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag { gap: 0.3rem; } } body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { border: 1px solid #e87272; font-weight: 500; padding: 0.8rem 1.3rem; line-height: 1; border-radius: 20px; } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { padding: 0.6rem 1rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 0.9rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 0.9rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #latest-articles .container .grid-container article a .wrap .post-text .tag span { font-size: 1rem; } } body.home #tags.tags-section { background: #f8f8de; padding: 10rem 0; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section { padding: 8rem 0; } } @media (max-width: 757px) { body.home #tags.tags-section { padding: 6rem 0; } } body.home #tags.tags-section .container { position: relative; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container { padding-right: 0; } } @media (max-width: 757px) { body.home #tags.tags-section .container { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } body.home #tags.tags-section .container .tags-visual { position: absolute; top: -40px; left: 40px; z-index: 2; } body.home #tags.tags-section .container .tags-visual .tags-visual-img { width: 220px; max-width: 40vw; height: auto; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-visual { position: static; text-align: center; } body.home #tags.tags-section .container .tags-visual .tags-visual-img { width: 200px; } } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-visual { position: static; text-align: center; } body.home #tags.tags-section .container .tags-visual .tags-visual-img { width: 120px; } } body.home #tags.tags-section .container .tags-box { background: #fff; border-radius: 40px 0 0 40px; -webkit-box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08); box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08); margin: 0 0 0 5vw; padding: 48px 32px 32px 32px; max-width: 1100px; position: relative; z-index: 1; min-height: 320px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-box { padding: 36px 0 24px 50px; margin: 0 0 0 3vw; } } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-box { padding: 24px 16px 16px 16px; border-radius: 20px; min-height: unset; margin: 0; } } body.home #tags.tags-section .container .tags-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 16px; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } body.home #tags.tags-section .container .tags-header .tags-title { color: #e6a96b; letter-spacing: 0.05em; line-height: 0.8; margin-bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body.home #tags.tags-section .container .tags-header .tags-title span { display: inline-block; font-weight: 700; color: var(--black); width: auto; margin-left: 1rem; margin-right: 0.3em; } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-header .tags-title span { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-header .tags-title span { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #tags.tags-section .container .tags-header .tags-title span { font-size: 2.2rem; } } @media (min-width: 1330px) { body.home #tags.tags-section .container .tags-header .tags-title span { font-size: 2.2rem; } } body.home #tags.tags-section .container .tags-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px 32px; width: 100%; max-width: 900px; justify-items: start; } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-list { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 15px 24px; } } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-list { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px 8px; } } body.home #tags.tags-section .container .tags-list .tag { font-weight: 600; color: var(--black); text-decoration: none; background: none; border: none; padding: 0; -webkit-transition: color 0.2s; transition: color 0.2s; } @media (max-width: 757px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.6rem; } } @media (min-width: 1330px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.6rem; } } @media (max-width: 757px) and (max-width: 757px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.26rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.26rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.4rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.home #tags.tags-section .container .tags-list .tag { font-size: 1.4rem; } } body.home #tags.tags-section .container .tags-list .tag.tag-main { color: #e6a96b; } body.home #tags.tags-section .container .tags-list .tag:hover { text-decoration: underline; color: #e6a96b; } body.home #tags.tags-section .container .tags-list .tag-hash { color: #e6a96b; font-weight: 900; margin-right: 2px; } body.home .image-slider { width: 100%; overflow: hidden; } body.home .slider-track { display: -webkit-box; display: -ms-flexbox; display: flex; width: -webkit-max-content; width: -moz-max-content; width: max-content; -webkit-animation: slide 120s linear infinite; animation: slide 120s linear infinite; } body.home .slider-track img { width: 10vw; height: auto; -o-object-fit: cover; object-fit: cover; } @media (min-width: 758px) and (max-width: 1024px) { body.home .slider-track img { width: 20vw; } } @media (max-width: 757px) { body.home .slider-track img { width: 40vw; } } @-webkit-keyframes slide { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); } } @keyframes slide { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); } } body.page .page--header { margin-top: 130px; background-color: var(--sub-color); height: 250px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--header { height: 200px; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--header { height: 200px; } } @media (max-width: 757px) { body.page .page--header { height: 200px; } } body.page .page--header .container .subtitle { text-align: center; font-weight: 400; line-height: 1; margin-bottom: 10px; } body.page .page--header .container h1 { text-align: center; font-weight: bolder; } @media (max-width: 757px) { body.page .page--header .container h1 { font-size: 1.75rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--header .container h1 { font-size: 2.125rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--header .container h1 { font-size: 2.5rem; } } @media (min-width: 1330px) { body.page .page--header .container h1 { font-size: 2.5rem; } } body.page .page--wrapper .container .contents main.has-left-sidebar { padding-left: 7%; } body.page .page--wrapper .container .contents main.has-right-sidebar { padding-right: 7%; } body.page .page--wrapper .container .contents main.full-width { width: 100%; } body.page .page--wrapper .container .contents main section { padding: 0; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main section { padding: 30px 0; } } body.page .page--wrapper .container .contents main article { word-break: break-all; } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-meta { padding-left: 6%; padding-right: 6%; } } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-meta { padding-left: 6%; padding-right: 6%; } } body.page .page--wrapper .container .contents main article .entry-meta .flex { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 1rem; } body.page .page--wrapper .container .contents main article .entry-meta .flex .catbtn ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } body.page .page--wrapper .container .contents main article .entry-meta .flex .catbtn ul li a { padding: 3px 15px; display: inline-block; font-size: 1.2rem; border-radius: 5px; margin-right: 5px; } body.page .page--wrapper .container .contents main article .entry-meta .flex .catbtn ul li a:hover { background: var(--hover-color); } body.page .page--wrapper .container .contents main article .entry-meta .site-tag { margin: 1em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } body.page .page--wrapper .container .contents main article .entry-meta .site-tag li { margin-right: 0.7rem; } body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a { color: gray; } @media (max-width: 757px) and (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a { font-size: 1.6rem; } } body.page .page--wrapper .container .contents main article .entry-meta .site-tag li a:hover { color: var(--hover-color); } body.page .page--wrapper .container .contents main article .post-eyecatch { margin: 0 0 1em 0; } body.page .page--wrapper .container .contents main article .entry-title { text-align: center; } body.page .page--wrapper .container .contents main article .entry-title h1 { border-bottom: 2px solid var(--light-site-color); color: var(--site-color); padding: 1.2em 0 20px; display: inline-block; margin-bottom: 1rem; } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-title h1 { padding-left: 6%; padding-right: 6%; } } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-title h1 { padding-left: 6%; padding-right: 6%; line-height: 1.5; letter-spacing: normal; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; } } body.page .page--wrapper .container .contents main article .entry-title h1 + h2 { margin-top: 0; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-title h1 + h2 { margin-top: 1rem; } } body.page .page--wrapper .container .contents main article .entry-content { margin-bottom: 3.5rem; } body.page .page--wrapper .container .contents main article .entry-content a { text-decoration: none; color: var(--link-color); } body.page .page--wrapper .container .contents main article .entry-content a:hover { text-decoration: underline; color: var(--dbrown); } body.page .page--wrapper .container .contents main article .entry-content h2 { font-weight: 600; margin-top: 5rem; margin-bottom: 2rem; padding-bottom: 1rem; padding-left: 2rem; -webkit-box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1); letter-spacing: 0.04rem; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; position: relative; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content h2 { font-size: 1.76rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content h2 { font-size: 1.76rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content h2 { font-size: 2.2rem; } } @media (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content h2 { font-size: 2.2rem; } } body.page .page--wrapper .container .contents main article .entry-content h2:first-child { margin-top: 0; } body.page .page--wrapper .container .contents main article .entry-content h2::before { content: ""; width: 8px; height: 100%; background: var(--site-color); position: absolute; left: 0; top: 0; border-radius: 2px; } body.page .page--wrapper .container .contents main article .entry-content h2 + p { margin-top: 0; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content h2 + p { margin-top: 1rem; } } body.page .page--wrapper .container .contents main article .entry-content h3 { font-weight: 600; padding: 0.9rem 1.8rem; border-radius: 8px; margin-top: 5rem; margin-bottom: 2rem; letter-spacing: 0.04rem; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; -webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content h3 { font-size: 1.76rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content h3 { font-size: 1.76rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content h3 { font-size: 2.2rem; } } @media (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content h3 { font-size: 2.2rem; } } body.page .page--wrapper .container .contents main article .entry-content h3:first-child { margin-top: 0; } body.page .page--wrapper .container .contents main article .entry-content h3 + p { margin-top: 0; } body.page .page--wrapper .container .contents main article .entry-content h4, body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { margin-top: 1rem; margin-bottom: 1rem; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content h4, body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content h4, body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content h4, body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { font-size: 1.8rem; } } @media (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content h4, body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { font-size: 1.8rem; } } body.page .page--wrapper .container .contents main article .entry-content h4 + p, body.page .page--wrapper .container .contents main article .entry-content h5 + p, body.page .page--wrapper .container .contents main article .entry-content h6 + p { margin-top: 0; } body.page .page--wrapper .container .contents main article .entry-content h5, body.page .page--wrapper .container .contents main article .entry-content h6 { border-bottom: 2px solid #ccc; padding: 5px 0; } body.page .page--wrapper .container .contents main article .entry-content p { line-height: 2; margin-top: 2rem; margin-bottom: 2rem; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.8rem; } } @media (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.8rem; } } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content p { -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; text-align: justify; letter-spacing: normal; margin: 3rem 0; line-height: 1.8; } } @media (max-width: 757px) and (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content p { font-size: 1.6rem; } } body.page .page--wrapper .container .contents main article .entry-content .editor { margin-bottom: 2rem; } body.page .page--wrapper .container .contents main article .entry-content ol { list-style-type: decimal; padding-left: 1.5rem; margin: 1em 0; } body.page .page--wrapper .container .contents main article .entry-content ol > li { margin-bottom: 0.5rem; } body.page .page--wrapper .container .contents main article .entry-content ol[type=a] { list-style-type: lower-alpha; } body.page .page--wrapper .container .contents main article .entry-content ol[type=A] { list-style-type: upper-alpha; } body.page .page--wrapper .container .contents main article .entry-content ol[type=i] { list-style-type: lower-roman; } body.page .page--wrapper .container .contents main article .entry-content ol[type=I] { list-style-type: upper-roman; } body.page .page--wrapper .container .contents main article .entry-content ul { list-style-type: disc; padding-left: 1.5rem; margin: 1em 0; } body.page .page--wrapper .container .contents main article .entry-content ul > ul { list-style-type: circle; } body.page .page--wrapper .container .contents main article .entry-content ul > ul > ul { list-style-type: square; } body.page .page--wrapper .container .contents main article .entry-content ul > li { margin-bottom: 0.5rem; } body.page .page--wrapper .container .contents main article .entry-content li { line-height: 2; } body.page .page--wrapper .container .contents main article .entry-content code { font-size: 0.875rem; color: var(--site-color); background: var(--lbrown); border-radius: 4px; padding: 1px 3px; margin: auto 4px; word-break: break-word; } body.page .page--wrapper .container .contents main article .entry-content pre { white-space: pre-wrap; background: var(--lbrown); color: var(--site-color); padding: 1rem; border-radius: 5px; } body.page .page--wrapper .container .contents main article .entry-content blockquote { padding: 25px 36px; line-height: 2.25rem; background-color: var(--lbrown); border-left: 5px solid var(--site-color); color: var(--dbrown); } body.page .page--wrapper .container .contents main article .entry-content blockquote p { margin-top: 1rem; margin-bottom: 1rem; } @media (max-width: 757px) { body.page .page--wrapper .container .contents main article .entry-content blockquote p { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .container .contents main article .entry-content blockquote p { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .container .contents main article .entry-content blockquote p { font-size: 1.6rem; } } @media (min-width: 1330px) { body.page .page--wrapper .container .contents main article .entry-content blockquote p { font-size: 1.6rem; } } body.page .page--wrapper .contents main section .container .contact-title { font-weight: 800; line-height: 1.6; margin-bottom: 2em; position: relative; text-align: center; color: var(--site-color); } @media (max-width: 757px) { body.page .page--wrapper .contents main section .container .contact-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .contents main section .container .contact-title { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .contents main section .container .contact-title { font-size: 2.2rem; } } @media (min-width: 1330px) { body.page .page--wrapper .contents main section .container .contact-title { font-size: 2.2rem; } } body.page .page--wrapper .contents main section .container .contact-description { max-width: 800px; margin: 1em auto 5em; } body.page .page--wrapper .contents main .wpcf7 { max-width: 800px; margin: 0 auto 5rem; } body.page .page--wrapper .contents main .wpcf7 form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2rem; } body.page .page--wrapper .contents main .wpcf7 form label { display: block; font-weight: 600; margin-bottom: 0.5rem; color: #333; width: 100%; } @media (max-width: 757px) { body.page .page--wrapper .contents main .wpcf7 form label { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .contents main .wpcf7 form label { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .contents main .wpcf7 form label { font-size: 1.6rem; } } @media (min-width: 1330px) { body.page .page--wrapper .contents main .wpcf7 form label { font-size: 1.6rem; } } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap { display: block; margin-top: 0.5rem; width: 100%; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap input[type=text], body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap input[type=email], body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap select, body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap textarea { width: 100%; padding: 0.8rem 1rem; border: 1px solid #ddd; border-radius: 8px; background-color: #f9f9f9; font-size: 16px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap input[type=text]:focus, body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap input[type=email]:focus, body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap select:focus, body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap textarea:focus { outline: none; border-color: var(--site-color); -webkit-box-shadow: 0 0 0 2px rgba(126, 214, 223, 0.2); box-shadow: 0 0 0 2px rgba(126, 214, 223, 0.2); background-color: #fff; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap select { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1rem center; background-size: 16px; padding-right: 2.5rem; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-form-control-wrap textarea { min-height: 150px; resize: vertical; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { -ms-flex-item-align: center; align-self: center; background-color: var(--site-color); color: white; border: none; border-radius: 30px; padding: 1rem 3rem; font-weight: 600; cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; margin-top: 1rem; } @media (max-width: 757px) { body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { font-size: 1.6rem; } } @media (min-width: 1330px) { body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { font-size: 1.6rem; } } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit:hover { background-color: #55c9d5; -webkit-transform: translateY(-2px); transform: translateY(-2px); } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit:active { -webkit-transform: translateY(0); transform: translateY(0); } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-spinner { margin: 0 auto; display: block; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-response-output { margin: 2rem 0 0; padding: 1rem; border-radius: 8px; text-align: center; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-response-output.wpcf7-validation-errors { background-color: #fff3cd; border: 1px solid #ffeeba; color: #856404; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-response-output.wpcf7-mail-sent-ok { background-color: #d4edda; border: 1px solid #c3e6cb; color: #155724; } body.page .page--wrapper .contents main .wpcf7 .wpcf7-not-valid-tip { color: #dc3545; font-size: 14px; margin-top: 0.5rem; } body.page .page--wrapper .contents main .wpcf7 .wpcf7-not-valid { border-color: #dc3545; background-color: #fff8f8; } @media (min-width: 758px) and (max-width: 1024px) { body.page .page--wrapper .contents main .wpcf7 { padding: 0 2rem; } } @media (max-width: 757px) { body.page .page--wrapper .contents main .wpcf7 { padding: 0 1rem; } body.page .page--wrapper .contents main .wpcf7 form { gap: 1.5rem; } body.page .page--wrapper .contents main .wpcf7 form .wpcf7-submit { width: 100%; padding: 0.8rem 1.5rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single nav { display: none; } } @media (max-width: 757px) { body.single nav { display: none; } } @media (min-width: 758px) and (max-width: 1024px) { body.single nav.drawer-menu { display: block; } } @media (max-width: 757px) { body.single nav.drawer-menu { display: block; } } body.single .page--wrapper { margin-top: 100px; } @media (max-width: 757px) { body.single .page--wrapper { margin-top: 70px; } } body.single .page--wrapper .container .contents main { padding-bottom: 3em; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main { padding-bottom: 0; } } body.single .page--wrapper .container .contents main.full-width { width: 100%; } body.single .page--wrapper .container .contents main article .post-eyecatch img { border-radius: 10px; } body.single .page--wrapper .container .contents main #map-canvas { width: 100%; height: 0; overflow: hidden; opacity: 0; -webkit-transition: height 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s; transition: height 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s; } body.single .page--wrapper .container .contents main #map-canvas.open { height: 400px; opacity: 1; -webkit-transition: height 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s; transition: height 0.7s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s; } body.single .page--wrapper .container .contents main #map-canvas.close { height: 0; opacity: 0; -webkit-transition: height 0.4s, opacity 0.3s; transition: height 0.4s, opacity 0.3s; } body.single .page--wrapper .container .contents main .map-area { margin: 2rem 0; } body.single .page--wrapper .container .contents main article .post-eyecatch img { max-height: 400px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } body.single .page--wrapper .container .contents main article .entry-meta .site-tag li { margin-right: 1rem; } body.single .page--wrapper .container .contents main article .entry-meta .site-tag li a { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; font-weight: bold; } body.single .page--wrapper .container .contents main article .entry-meta .site-tag li a:hover { color: var(--hover-color); } body.single .page--wrapper .container .contents main article .entry-meta.normal .flex { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 2rem 0 1rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex { padding: 1rem 0 0; gap: 5px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time { font-size: 1.4rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time { font-size: 1.4rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time span { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time span { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time span { font-size: 1.4rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex time span { font-size: 1.4rem; } } body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li:first-child a { margin-left: 0; } } body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { color: white; background-color: var(--site-color); padding: 3px 15px; display: inline-block; border-radius: 5px; margin-left: 1rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { font-size: 1.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { font-size: 1.2rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a { padding: 3px 5px; text-decoration: none; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; border-radius: 4px; white-space: nowrap; margin-bottom: 0.3em; } } body.single .page--wrapper .container .contents main article .entry-meta.normal .flex .catbtn ul li a:hover { background: var(--site-color); color: white; opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag { margin-top: 1rem; margin-bottom: 3rem; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; background: var(--bg-color); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag { margin-top: 2rem; margin-bottom: 1.5rem; } } body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a { color: var(--site-color); font-weight: bold; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a { font-size: 1.4rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a { font-size: 1.4rem; } } body.single .page--wrapper .container .contents main article .entry-meta.normal ul.site-tag li a:hover { color: var(--hover-color); } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 20px; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-image img { width: 50px; height: 50px; border-radius: 50%; overflow: hidden; -o-object-fit: cover; object-fit: cover; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .author-name { font-weight: bold; font-size: 16px; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details time { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details time { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details time { font-size: 1.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details time { font-size: 1.2rem; } } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .reloaded { color: var(--accent-color); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .reloaded { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .reloaded { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .reloaded { font-size: 1.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .author-info .author-details .reloaded { font-size: 1.2rem; } } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info { text-align: right; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { background: var(--site-color); color: white; padding: 3px 15px; display: inline-block; border-radius: 5px; margin-left: 1rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { font-size: 1.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { font-size: 1.2rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a { padding: 3px 5px; text-decoration: none; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; border-radius: 4px; white-space: nowrap; margin-bottom: 0.3em; } } body.single .page--wrapper .container .contents main article .entry-meta.author .flex-container .category-info .catbtn ul li a:hover { background: var(--hover-color); opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } body.single .page--wrapper .container .contents main article .entry-title { padding-top: 3rem; line-height: 1.5; } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title { padding-top: 3rem; line-height: 1.5; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title { padding-top: 0; margin-top: 1rem; margin-bottom: 1rem; letter-spacing: normal; } } body.single .page--wrapper .container .contents main article .entry-title h1 { font-weight: 600; letter-spacing: 0.04em; pointer-events: auto; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; text-orientation: mixed; -webkit-text-orientation: mixed; -webkit-writing-mode: horizontal-tb; writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb; padding: 2rem 0; border-bottom: 2px solid var(--site-color); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.31rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.805rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 3.3rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 3.3rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title h1 { padding: 2rem 0; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 1.89rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.295rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.7rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.7rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title h1 { padding: 1rem 0 2rem; } } @media (max-width: 757px) and (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 1.89rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.295rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.7rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-title h1 { font-size: 2.7rem; } } body.single .page--wrapper .container .contents main article .entry-title h1 + h2 { margin-top: 0; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title h1 + h2 { margin-top: 1em; } } body.single .page--wrapper .container .contents main article .entry-title .site-tag { margin: 1em 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title .site-tag { margin: 10px 0 0; } } body.single .page--wrapper .container .contents main article .entry-title .site-tag li { margin-right: 0.7em; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-title .site-tag li a { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-title .site-tag li a { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-title .site-tag li a { font-size: 1.6rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-title .site-tag li a { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main article .entry-title .site-tag li a:hover { color: var(--hover-color); } body.single .page--wrapper .container .contents main article .entry-content p { line-height: 2.25; margin: 3.6rem 0; -webkit-font-kerning: normal; font-kerning: normal; background-color: #f7f5de; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); border-radius: 5rem; padding: 4.5rem 5rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.8rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.8rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-content p { -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; letter-spacing: normal; margin: 3rem 0; padding: 3.5rem 4rem; line-height: 1.8; } } @media (max-width: 757px) and (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.single .page--wrapper .container .contents main article .entry-content p { font-size: 1.6rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main article .entry-content p br { margin-bottom: 1rem; display: block; } } body.single .page--wrapper .container .contents main .shop-list { margin: 3rem 0; } body.single .page--wrapper .container .contents main .shop-list .shop { margin-bottom: 3rem; border-radius: 8px; padding: 2rem; position: relative; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop { padding: 1rem 0; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product { margin: 5rem 0; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product { margin: 3rem 0; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title { margin-bottom: 1.5rem; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3 { font-weight: bold; background-color: var(--site-color); color: #fff; border-radius: 5rem; padding: 1.5rem 3rem 1.5rem 5rem; position: relative; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3 { font-size: 1.76rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3 { font-size: 1.76rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3 { font-size: 2.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3 { font-size: 2.2rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-title h3::before { position: absolute; top: 25%; left: 30px; width: 6px; height: 50%; content: ""; border-radius: 3px; background: #fff; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading { margin: 2.5rem 0; text-align: center; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading h4 { font-weight: bold; letter-spacing: 0.02em; padding: 1rem; display: inline-block; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading h4 { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading h4 { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading h4 { font-size: 1.8rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .product-heading h4 { font-size: 1.8rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image h4 { font-weight: bold; color: white; letter-spacing: 0.02em; padding: 0.5rem 1rem; z-index: 2; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); text-align: center; width: 100%; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image h4 { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image h4 { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image h4 { font-size: 1.8rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image h4 { font-size: 1.8rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image p { width: 100%; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image a { display: block; width: 100%; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-image a img { display: block; width: 100%; height: 100%; max-height: 450px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; border-radius: 4px; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper { margin: 3rem 0; overflow: hidden; height: 400px; } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper { height: 300px; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper { height: 260px; margin: 0; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-wrapper .swiper-slide { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #fff; max-height: 450px; position: relative; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-wrapper .swiper-slide .shop-product-image-title { position: absolute; bottom: 0; left: 0; width: 100%; background: rgba(0, 0, 0, 0.5); color: white; padding: 0.5rem; font-size: 0.9rem; text-align: center; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-wrapper .swiper-slide:hover .shop-product-image-title { opacity: 1; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-prev { color: var(--site-color); background: rgba(255, 255, 255, 0.7); width: 40px; height: 40px; border-radius: 50%; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-next:after, body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-prev:after { font-size: 1.5rem; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-button-prev:hover { background: rgba(255, 255, 255, 0.9); color: var(--hover-color); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-pagination { bottom: 0; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-pagination .swiper-pagination-bullet { background: var(--site-color); opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-pagination .swiper-pagination-bullet-active { opacity: 1; background: var(--site-color); -webkit-transform: scale(1.2); transform: scale(1.2); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .swiper .swiper-pagination { position: relative; margin-top: 10px; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-image-comment { text-align: center; margin: 1rem 0 3rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-image-comment { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-image-comment { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-image-comment { font-size: 1.4rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-image-comment { font-size: 1.4rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment { margin: 1.5rem 0 5rem; padding: 0 3rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment { padding: 0 2rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { letter-spacing: 0.02em; text-align: justify; margin: 0; line-height: 2; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.8rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.8rem; } } @media (max-width: 757px) and (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .comment p { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic { margin: 2rem 0 3rem; position: relative; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic p { letter-spacing: 0.02em; text-align: justify; margin: 0; line-height: 2; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic p { font-size: 1.62rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic p { font-size: 1.62rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic p { font-size: 1.8rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .shop-product-topic p { font-size: 1.8rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information { margin: 3rem 0; padding: 2.5rem 3rem; list-style: none; background: #f9f9f9; border-radius: 8px; -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.03); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.03); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { margin-bottom: 0.8rem; position: relative; padding-left: 1.2rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { font-size: 1.6rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li:before { content: ""; width: 6px; height: 6px; background: var(--site-color); border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li:last-child { margin-bottom: 0; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.8em; -ms-flex-wrap: wrap; flex-wrap: wrap; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span a { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span a:hover { -webkit-transform: translateY(-2px) scale(1.05); transform: translateY(-2px) scale(1.05); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span a img { height: 25px !important; width: auto !important; max-width: 100px; max-height: 45px; -o-object-fit: contain; object-fit: contain; vertical-align: middle; border-radius: 4px; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); background: #fff; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information { padding: 1.2rem 1.5rem; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li { padding-left: 1rem; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li:before { width: 5px; height: 5px; top: 0.6rem; } } @media (max-width: 757px) and (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li:before { top: 1.4rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span { gap: 0.5em; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .rent-information li span a img { height: 20px !important; max-width: 80px; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation { margin: 3rem 0 2rem; padding: 2.8rem 3rem 3.2rem 3rem; border-radius: 8px; background: #f7f5de; -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation { padding: 2.8rem 3rem 3.2rem 3rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation { padding: 3rem 1.5rem 4rem; margin: 2.5rem 0 1.5rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title { font-weight: bold; margin-bottom: 1.5rem; padding-bottom: 0.8rem; text-align: center; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title { font-size: 1.6rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title br { display: none; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-title br { display: block; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 2.2rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li { list-style: none; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a { display: block; -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button { background: #e6a96b; color: white; padding: 0.6rem 1.5rem; border-radius: 4px; text-decoration: none; font-weight: bold; letter-spacing: 0.05em; -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button { font-size: 1.6rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a.official-site-button:hover { background: var(--hover-color); -webkit-transform: translateY(-2px); transform: translateY(-2px); -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a img { display: block; border-radius: 4px; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); background: #fff; padding: 3px; } body.single .page--wrapper .container .contents main .shop-list .shop .shop-product .hotel-reservation-items .flex-wrap li a img:hover { -webkit-transform: translateY(-2px); transform: translateY(-2px); -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .shop-product .shop-product-title h3 { background-color: hsl(0, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .product-heading h4 { color: #6d4141; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .shop-product-topic h4 { background-color: rgba(166, 130, 130, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .rent-information { background-color: #f2eded; border: 1px solid #d9caca; -webkit-box-shadow: 0 2px 8px rgba(102, 62, 62, 0.1); box-shadow: 0 2px 8px rgba(102, 62, 62, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .rent-information li::before { background-color: hsl(0, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .hotel-reservation { background-color: #d3c1c1; -webkit-box-shadow: 0 2px 8px rgba(90, 54, 54, 0.15); box-shadow: 0 2px 8px rgba(90, 54, 54, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .hotel-reservation-title { color: #663e3e; border-bottom: 1px dashed #ccb8b8; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .hotel-reservation .official-site-button { background-color: #734545 !important; -webkit-box-shadow: 0 2px 6px rgba(77, 46, 46, 0.25) !important; box-shadow: 0 2px 6px rgba(77, 46, 46, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .hotel-reservation .official-site-button:hover { background-color: #663e3e !important; -webkit-box-shadow: 0 3px 8px rgba(64, 39, 39, 0.3) !important; box-shadow: 0 3px 8px rgba(64, 39, 39, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #c0a6a6; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(0, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-button-prev { color: hsl(0, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(1) .swiper .swiper-button-prev:hover { color: #6d4141; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .shop-product .shop-product-title h3 { background-color: hsl(30, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .product-heading h4 { color: #6d5741; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .shop-product-topic h4 { background-color: rgba(166, 148, 130, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .rent-information { background-color: #f2f0ed; border: 1px solid #d9d1ca; -webkit-box-shadow: 0 2px 8px rgba(102, 82, 62, 0.1); box-shadow: 0 2px 8px rgba(102, 82, 62, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .rent-information li::before { background-color: hsl(30, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .hotel-reservation { background-color: #d3c9c1; -webkit-box-shadow: 0 2px 8px rgba(90, 71, 54, 0.15); box-shadow: 0 2px 8px rgba(90, 71, 54, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .hotel-reservation-title { color: #66523e; border-bottom: 1px dashed #ccc2b8; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .hotel-reservation .official-site-button { background-color: #735c45 !important; -webkit-box-shadow: 0 2px 6px rgba(77, 61, 46, 0.25) !important; box-shadow: 0 2px 6px rgba(77, 61, 46, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .hotel-reservation .official-site-button:hover { background-color: #66523e !important; -webkit-box-shadow: 0 3px 8px rgba(64, 51, 39, 0.3) !important; box-shadow: 0 3px 8px rgba(64, 51, 39, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #c0b3a6; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(30, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-button-prev { color: hsl(30, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(2) .swiper .swiper-button-prev:hover { color: #6d5741; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .shop-product .shop-product-title h3 { background-color: hsl(60, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .product-heading h4 { color: #6d6d41; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .shop-product-topic h4 { background-color: rgba(166, 166, 130, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .rent-information { background-color: #f2f2ed; border: 1px solid #d9d9ca; -webkit-box-shadow: 0 2px 8px rgba(102, 102, 62, 0.1); box-shadow: 0 2px 8px rgba(102, 102, 62, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .rent-information li::before { background-color: hsl(60, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .hotel-reservation { background-color: #d3d3c1; -webkit-box-shadow: 0 2px 8px rgba(90, 90, 54, 0.15); box-shadow: 0 2px 8px rgba(90, 90, 54, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .hotel-reservation-title { color: #66663e; border-bottom: 1px dashed #ccccb8; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .hotel-reservation .official-site-button { background-color: #737345 !important; -webkit-box-shadow: 0 2px 6px rgba(77, 77, 46, 0.25) !important; box-shadow: 0 2px 6px rgba(77, 77, 46, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .hotel-reservation .official-site-button:hover { background-color: #66663e !important; -webkit-box-shadow: 0 3px 8px rgba(64, 64, 39, 0.3) !important; box-shadow: 0 3px 8px rgba(64, 64, 39, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #c0c0a6; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(60, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-button-prev { color: hsl(60, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(3) .swiper .swiper-button-prev:hover { color: #6d6d41; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .shop-product .shop-product-title h3 { background-color: hsl(90, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .product-heading h4 { color: #576d41; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .shop-product-topic h4 { background-color: rgba(148, 166, 130, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .rent-information { background-color: #f0f2ed; border: 1px solid #d1d9ca; -webkit-box-shadow: 0 2px 8px rgba(82, 102, 62, 0.1); box-shadow: 0 2px 8px rgba(82, 102, 62, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .rent-information li::before { background-color: hsl(90, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .hotel-reservation { background-color: #c9d3c1; -webkit-box-shadow: 0 2px 8px rgba(71, 90, 54, 0.15); box-shadow: 0 2px 8px rgba(71, 90, 54, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .hotel-reservation-title { color: #52663e; border-bottom: 1px dashed #c2ccb8; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .hotel-reservation .official-site-button { background-color: #5c7345 !important; -webkit-box-shadow: 0 2px 6px rgba(61, 77, 46, 0.25) !important; box-shadow: 0 2px 6px rgba(61, 77, 46, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .hotel-reservation .official-site-button:hover { background-color: #52663e !important; -webkit-box-shadow: 0 3px 8px rgba(51, 64, 39, 0.3) !important; box-shadow: 0 3px 8px rgba(51, 64, 39, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #b3c0a6; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(90, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-button-prev { color: hsl(90, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(4) .swiper .swiper-button-prev:hover { color: #576d41; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .shop-product .shop-product-title h3 { background-color: hsl(120, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .product-heading h4 { color: #416d41; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .shop-product-topic h4 { background-color: rgba(130, 166, 130, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .rent-information { background-color: #edf2ed; border: 1px solid #cad9ca; -webkit-box-shadow: 0 2px 8px rgba(62, 102, 62, 0.1); box-shadow: 0 2px 8px rgba(62, 102, 62, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .rent-information li::before { background-color: hsl(120, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .hotel-reservation { background-color: #c1d3c1; -webkit-box-shadow: 0 2px 8px rgba(54, 90, 54, 0.15); box-shadow: 0 2px 8px rgba(54, 90, 54, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .hotel-reservation-title { color: #3e663e; border-bottom: 1px dashed #b8ccb8; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .hotel-reservation .official-site-button { background-color: #457345 !important; -webkit-box-shadow: 0 2px 6px rgba(46, 77, 46, 0.25) !important; box-shadow: 0 2px 6px rgba(46, 77, 46, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .hotel-reservation .official-site-button:hover { background-color: #3e663e !important; -webkit-box-shadow: 0 3px 8px rgba(39, 64, 39, 0.3) !important; box-shadow: 0 3px 8px rgba(39, 64, 39, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #a6c0a6; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(120, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-button-prev { color: hsl(120, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(5) .swiper .swiper-button-prev:hover { color: #416d41; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .shop-product .shop-product-title h3 { background-color: hsl(150, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .product-heading h4 { color: #416d57; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .shop-product-topic h4 { background-color: rgba(130, 166, 148, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .rent-information { background-color: #edf2f0; border: 1px solid #cad9d1; -webkit-box-shadow: 0 2px 8px rgba(62, 102, 82, 0.1); box-shadow: 0 2px 8px rgba(62, 102, 82, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .rent-information li::before { background-color: hsl(150, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .hotel-reservation { background-color: #c1d3c9; -webkit-box-shadow: 0 2px 8px rgba(54, 90, 71, 0.15); box-shadow: 0 2px 8px rgba(54, 90, 71, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .hotel-reservation-title { color: #3e6652; border-bottom: 1px dashed #b8ccc2; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .hotel-reservation .official-site-button { background-color: #45735c !important; -webkit-box-shadow: 0 2px 6px rgba(46, 77, 61, 0.25) !important; box-shadow: 0 2px 6px rgba(46, 77, 61, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .hotel-reservation .official-site-button:hover { background-color: #3e6652 !important; -webkit-box-shadow: 0 3px 8px rgba(39, 64, 51, 0.3) !important; box-shadow: 0 3px 8px rgba(39, 64, 51, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #a6c0b3; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(150, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-button-prev { color: hsl(150, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(6) .swiper .swiper-button-prev:hover { color: #416d57; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .shop-product .shop-product-title h3 { background-color: hsl(180, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .product-heading h4 { color: #416d6d; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .shop-product-topic h4 { background-color: rgba(130, 166, 166, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .rent-information { background-color: #edf2f2; border: 1px solid #cad9d9; -webkit-box-shadow: 0 2px 8px rgba(62, 102, 102, 0.1); box-shadow: 0 2px 8px rgba(62, 102, 102, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .rent-information li::before { background-color: hsl(180, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .hotel-reservation { background-color: #c1d3d3; -webkit-box-shadow: 0 2px 8px rgba(54, 90, 90, 0.15); box-shadow: 0 2px 8px rgba(54, 90, 90, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .hotel-reservation-title { color: #3e6666; border-bottom: 1px dashed #b8cccc; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .hotel-reservation .official-site-button { background-color: #457373 !important; -webkit-box-shadow: 0 2px 6px rgba(46, 77, 77, 0.25) !important; box-shadow: 0 2px 6px rgba(46, 77, 77, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .hotel-reservation .official-site-button:hover { background-color: #3e6666 !important; -webkit-box-shadow: 0 3px 8px rgba(39, 64, 64, 0.3) !important; box-shadow: 0 3px 8px rgba(39, 64, 64, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #a6c0c0; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(180, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-button-prev { color: hsl(180, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(7) .swiper .swiper-button-prev:hover { color: #416d6d; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .shop-product .shop-product-title h3 { background-color: hsl(210, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .product-heading h4 { color: #41576d; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .shop-product-topic h4 { background-color: rgba(130, 148, 166, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .rent-information { background-color: #edf0f2; border: 1px solid #cad1d9; -webkit-box-shadow: 0 2px 8px rgba(62, 82, 102, 0.1); box-shadow: 0 2px 8px rgba(62, 82, 102, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .rent-information li::before { background-color: hsl(210, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .hotel-reservation { background-color: #c1c9d3; -webkit-box-shadow: 0 2px 8px rgba(54, 71, 90, 0.15); box-shadow: 0 2px 8px rgba(54, 71, 90, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .hotel-reservation-title { color: #3e5266; border-bottom: 1px dashed #b8c2cc; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .hotel-reservation .official-site-button { background-color: #455c73 !important; -webkit-box-shadow: 0 2px 6px rgba(46, 61, 77, 0.25) !important; box-shadow: 0 2px 6px rgba(46, 61, 77, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .hotel-reservation .official-site-button:hover { background-color: #3e5266 !important; -webkit-box-shadow: 0 3px 8px rgba(39, 51, 64, 0.3) !important; box-shadow: 0 3px 8px rgba(39, 51, 64, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #a6b3c0; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(210, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-button-prev { color: hsl(210, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(8) .swiper .swiper-button-prev:hover { color: #41576d; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .shop-product .shop-product-title h3 { background-color: hsl(240, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .product-heading h4 { color: #41416d; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .shop-product-topic h4 { background-color: rgba(130, 130, 166, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .rent-information { background-color: #ededf2; border: 1px solid #cacad9; -webkit-box-shadow: 0 2px 8px rgba(62, 62, 102, 0.1); box-shadow: 0 2px 8px rgba(62, 62, 102, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .rent-information li::before { background-color: hsl(240, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .hotel-reservation { background-color: #c1c1d3; -webkit-box-shadow: 0 2px 8px rgba(54, 54, 90, 0.15); box-shadow: 0 2px 8px rgba(54, 54, 90, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .hotel-reservation-title { color: #3e3e66; border-bottom: 1px dashed #b8b8cc; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .hotel-reservation .official-site-button { background-color: #454573 !important; -webkit-box-shadow: 0 2px 6px rgba(46, 46, 77, 0.25) !important; box-shadow: 0 2px 6px rgba(46, 46, 77, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .hotel-reservation .official-site-button:hover { background-color: #3e3e66 !important; -webkit-box-shadow: 0 3px 8px rgba(39, 39, 64, 0.3) !important; box-shadow: 0 3px 8px rgba(39, 39, 64, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #a6a6c0; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(240, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-button-prev { color: hsl(240, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(9) .swiper .swiper-button-prev:hover { color: #41416d; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .shop-product .shop-product-title h3 { background-color: hsl(270, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .product-heading h4 { color: #57416d; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .shop-product-topic h4 { background-color: rgba(148, 130, 166, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .rent-information { background-color: #f0edf2; border: 1px solid #d1cad9; -webkit-box-shadow: 0 2px 8px rgba(82, 62, 102, 0.1); box-shadow: 0 2px 8px rgba(82, 62, 102, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .rent-information li::before { background-color: hsl(270, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .hotel-reservation { background-color: #c9c1d3; -webkit-box-shadow: 0 2px 8px rgba(71, 54, 90, 0.15); box-shadow: 0 2px 8px rgba(71, 54, 90, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .hotel-reservation-title { color: #523e66; border-bottom: 1px dashed #c2b8cc; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .hotel-reservation .official-site-button { background-color: #5c4573 !important; -webkit-box-shadow: 0 2px 6px rgba(61, 46, 77, 0.25) !important; box-shadow: 0 2px 6px rgba(61, 46, 77, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .hotel-reservation .official-site-button:hover { background-color: #523e66 !important; -webkit-box-shadow: 0 3px 8px rgba(51, 39, 64, 0.3) !important; box-shadow: 0 3px 8px rgba(51, 39, 64, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #b3a6c0; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(270, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-button-prev { color: hsl(270, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(10) .swiper .swiper-button-prev:hover { color: #57416d; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .shop-product .shop-product-title h3 { background-color: hsl(300, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .product-heading h4 { color: #6d416d; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .shop-product-topic h4 { background-color: rgba(166, 130, 166, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .rent-information { background-color: #f2edf2; border: 1px solid #d9cad9; -webkit-box-shadow: 0 2px 8px rgba(102, 62, 102, 0.1); box-shadow: 0 2px 8px rgba(102, 62, 102, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .rent-information li::before { background-color: hsl(300, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .hotel-reservation { background-color: #d3c1d3; -webkit-box-shadow: 0 2px 8px rgba(90, 54, 90, 0.15); box-shadow: 0 2px 8px rgba(90, 54, 90, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .hotel-reservation-title { color: #663e66; border-bottom: 1px dashed #ccb8cc; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .hotel-reservation .official-site-button { background-color: #734573 !important; -webkit-box-shadow: 0 2px 6px rgba(77, 46, 77, 0.25) !important; box-shadow: 0 2px 6px rgba(77, 46, 77, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .hotel-reservation .official-site-button:hover { background-color: #663e66 !important; -webkit-box-shadow: 0 3px 8px rgba(64, 39, 64, 0.3) !important; box-shadow: 0 3px 8px rgba(64, 39, 64, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #c0a6c0; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(300, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-button-prev { color: hsl(300, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(11) .swiper .swiper-button-prev:hover { color: #6d416d; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .shop-product .shop-product-title h3 { background-color: hsl(330, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .product-heading h4 { color: #6d4157; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .shop-product-topic h4 { background-color: rgba(166, 130, 148, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .rent-information { background-color: #f2edf0; border: 1px solid #d9cad1; -webkit-box-shadow: 0 2px 8px rgba(102, 62, 82, 0.1); box-shadow: 0 2px 8px rgba(102, 62, 82, 0.1); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .rent-information li::before { background-color: hsl(330, 25%, 40%); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .hotel-reservation { background-color: #d3c1c9; -webkit-box-shadow: 0 2px 8px rgba(90, 54, 71, 0.15); box-shadow: 0 2px 8px rgba(90, 54, 71, 0.15); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .hotel-reservation-title { color: #663e52; border-bottom: 1px dashed #ccb8c2; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .hotel-reservation .official-site-button { background-color: #73455c !important; -webkit-box-shadow: 0 2px 6px rgba(77, 46, 61, 0.25) !important; box-shadow: 0 2px 6px rgba(77, 46, 61, 0.25) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .hotel-reservation .official-site-button:hover { background-color: #663e52 !important; -webkit-box-shadow: 0 3px 8px rgba(64, 39, 51, 0.3) !important; box-shadow: 0 3px 8px rgba(64, 39, 51, 0.3) !important; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-pagination .swiper-pagination-bullet { background-color: #c0a6b3; opacity: 0.7; } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-pagination .swiper-pagination-bullet-active { background-color: hsl(330, 25%, 40%); opacity: 1; -webkit-transform: scale(1.2); transform: scale(1.2); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-button-next, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-button-prev { color: hsl(330, 25%, 40%); background-color: rgba(255, 255, 255, 0.8); } body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-button-next:hover, body.single .page--wrapper .container .contents main .shop-list .shop:nth-of-type(12) .swiper .swiper-button-prev:hover { color: #6d4157; background-color: rgba(255, 255, 255, 0.95); } body.single .page--wrapper .container .contents main .shop-indexes { border-radius: 8px; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); padding: 1.2rem 1.5rem; border: 1px solid var(--dark-gray); max-width: 300px; margin: 5rem auto; } body.single .page--wrapper .container .contents main .shop-indexes details summary { font-weight: bold; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: color 0.2s; transition: color 0.2s; } body.single .page--wrapper .container .contents main .shop-indexes details summary:hover { color: var(--hover-color); -webkit-transform: scale(1.05); transform: scale(1.05); } body.single .page--wrapper .container .contents main .shop-indexes details summary:hover:after { border-color: var(--hover-color); -webkit-transform: translateY(-50%) rotate(45deg) scale(1.05); transform: translateY(-50%) rotate(45deg) scale(1.05); } body.single .page--wrapper .container .contents main .shop-indexes details summary:hover { color: var(--hover-color); } body.single .page--wrapper .container .contents main .shop-indexes details .shop-indexes-list { padding-left: 1.5em; margin-top: 1.5em; border-left: 2px solid var(--site-color, #007bff); margin-left: 0.2em; } body.single .page--wrapper .container .contents main .shop-indexes details .shop-indexes-list li { margin-bottom: 0.3em; padding: 0.2em 0.4em; border-bottom: 1px dashed var(--border-color, #e0e0e0); } body.single .page--wrapper .container .contents main .shop-indexes details .shop-indexes-list li:last-child { border-bottom: none; } body.single .page--wrapper .container .contents main .shop-indexes details .shop-indexes-list li .in-link { color: var(--site-color); text-decoration: underline; -webkit-transition: color 0.2s; transition: color 0.2s; } body.single .page--wrapper .container .contents main .shop-indexes details .shop-indexes-list li .in-link:hover { color: var(--hover-color); -webkit-text-decoration: underline wavy; text-decoration: underline wavy; } body.single .page--wrapper .container .contents main .same-leaf-category { margin: 3rem 0; padding: 2rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category { padding: 0; } } body.single .page--wrapper .container .contents main .same-leaf-category-title { font-weight: bold; margin: 0 0 2rem; padding-bottom: 1rem; border-bottom: 2px solid var(--site-color); } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-title { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .same-leaf-category-title { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .same-leaf-category-title { font-size: 2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .same-leaf-category-title { font-size: 2rem; } } body.single .page--wrapper .container .contents main .same-leaf-category-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 2.5rem; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-items { grid-template-columns: 1fr; } } body.single .page--wrapper .container .contents main .same-leaf-category-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background: white; border-radius: 6px; overflow: hidden; -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; } body.single .page--wrapper .container .contents main .same-leaf-category-item:hover { -webkit-transform: translateY(-5px); transform: translateY(-5px); -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); } body.single .page--wrapper .container .contents main .same-leaf-category-image-link { display: block; overflow: hidden; height: 220px; } body.single .page--wrapper .container .contents main .same-leaf-category-image-link img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } body.single .page--wrapper .container .contents main .same-leaf-category-content { padding: 1rem; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-weight: 500; text-decoration: none; margin-bottom: 0.5rem; line-height: 1.4; -webkit-transition: color 0.2s ease; transition: color 0.2s ease; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.6rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.6rem; } } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-weight: bold; margin: 1rem 0; } } @media (max-width: 757px) and (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.single .page--wrapper .container .contents main .same-leaf-category-title-link { font-size: 1.6rem; } } body.single .page--wrapper .container .contents main .same-leaf-category-title-link:hover { color: var(--site-color); } body.single .page--wrapper .container .contents main .same-leaf-category-categories { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.5rem; margin-top: auto; padding-top: 0.5rem; } body.single .page--wrapper .container .contents main .same-leaf-category-category { background: var(--site-color); color: white; padding: 0.2rem 0.6rem; border-radius: 3px; text-decoration: none; -webkit-transition: background-color 0.2s ease; transition: background-color 0.2s ease; } @media (max-width: 757px) { body.single .page--wrapper .container .contents main .same-leaf-category-category { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.single .page--wrapper .container .contents main .same-leaf-category-category { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.single .page--wrapper .container .contents main .same-leaf-category-category { font-size: 1.2rem; } } @media (min-width: 1330px) { body.single .page--wrapper .container .contents main .same-leaf-category-category { font-size: 1.2rem; } } body.single .page--wrapper .container .contents main .same-leaf-category-category:hover { background: var(--hover-color); } @media (min-width: 758px) and (max-width: 1024px) { body.archive nav, body.taxonomy nav, body.category nav, body.search nav, body.page.latest nav, body.page.popular nav { display: none; } } @media (max-width: 757px) { body.archive nav, body.taxonomy nav, body.category nav, body.search nav, body.page.latest nav, body.page.popular nav { display: none; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive nav.drawer-menu, body.taxonomy nav.drawer-menu, body.category nav.drawer-menu, body.search nav.drawer-menu, body.page.latest nav.drawer-menu, body.page.popular nav.drawer-menu { display: block; } } @media (max-width: 757px) { body.archive nav.drawer-menu, body.taxonomy nav.drawer-menu, body.category nav.drawer-menu, body.search nav.drawer-menu, body.page.latest nav.drawer-menu, body.page.popular nav.drawer-menu { display: block; } } body.archive .page--header, body.taxonomy .page--header, body.category .page--header, body.search .page--header, body.page.latest .page--header, body.page.popular .page--header { margin-top: 100px; background-color: var(--sub-color); height: 250px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.archive .page--header, body.taxonomy .page--header, body.category .page--header, body.search .page--header, body.page.latest .page--header, body.page.popular .page--header { margin-top: 100px; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--header, body.taxonomy .page--header, body.category .page--header, body.search .page--header, body.page.latest .page--header, body.page.popular .page--header { margin-top: 100px; height: 200px; } } @media (max-width: 757px) { body.archive .page--header, body.taxonomy .page--header, body.category .page--header, body.search .page--header, body.page.latest .page--header, body.page.popular .page--header { margin-top: 100px; height: 120px; } } body.archive .page--header .container .subtitle, body.taxonomy .page--header .container .subtitle, body.category .page--header .container .subtitle, body.search .page--header .container .subtitle, body.page.latest .page--header .container .subtitle, body.page.popular .page--header .container .subtitle { text-align: center; font-weight: 400; line-height: 1; margin-bottom: 10px; } body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { text-align: center; font-weight: bolder; } @media (max-width: 757px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 1.75rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 2.125rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 2.5rem; } } @media (min-width: 1330px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 2.5rem; } } @media (max-width: 757px) and (max-width: 757px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 1.8rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.archive .page--header .container h1, body.taxonomy .page--header .container h1, body.category .page--header .container h1, body.search .page--header .container h1, body.page.latest .page--header .container h1, body.page.popular .page--header .container h1 { font-size: 1.8rem; } } body.archive .page--wrapper .container .contents main #grid .grid-container article, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article, body.category .page--wrapper .container .contents main #grid .grid-container article, body.search .page--wrapper .container .contents main #grid .grid-container article, body.page.latest .page--wrapper .container .contents main #grid .grid-container article, body.page.popular .page--wrapper .container .contents main #grid .grid-container article { padding: 1.5em 0; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article, body.category .page--wrapper .container .contents main #grid .grid-container article, body.search .page--wrapper .container .contents main #grid .grid-container article, body.page.latest .page--wrapper .container .contents main #grid .grid-container article, body.page.popular .page--wrapper .container .contents main #grid .grid-container article { padding: 1.005em 0; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article, body.category .page--wrapper .container .contents main #grid .grid-container article, body.search .page--wrapper .container .contents main #grid .grid-container article, body.page.latest .page--wrapper .container .contents main #grid .grid-container article, body.page.popular .page--wrapper .container .contents main #grid .grid-container article { padding: 0.495em 0; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article, body.category .page--wrapper .container .contents main #grid .grid-container article, body.search .page--wrapper .container .contents main #grid .grid-container article, body.page.latest .page--wrapper .container .contents main #grid .grid-container article, body.page.popular .page--wrapper .container .contents main #grid .grid-container article { padding: 1.2em 0; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article, body.category .page--wrapper .container .contents main #grid .grid-container article, body.search .page--wrapper .container .contents main #grid .grid-container article, body.page.latest .page--wrapper .container .contents main #grid .grid-container article, body.page.popular .page--wrapper .container .contents main #grid .grid-container article { padding: 1em 0; border-bottom: 1px solid rgba(0, 0, 0, 0.05); } } body.archive .page--wrapper .container .contents main #grid .grid-container article a, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a, body.category .page--wrapper .container .contents main #grid .grid-container article a, body.search .page--wrapper .container .contents main #grid .grid-container article a, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a { display: -webkit-box; display: -ms-flexbox; display: flex; text-decoration: none; color: var(--black); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a, body.category .page--wrapper .container .contents main #grid .grid-container article a, body.search .page--wrapper .container .contents main #grid .grid-container article a, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a:hover, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a:hover, body.category .page--wrapper .container .contents main #grid .grid-container article a:hover, body.search .page--wrapper .container .contents main #grid .grid-container article a:hover, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a:hover, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a:hover { -webkit-transform: scale(1.02); transform: scale(1.02); } body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch { width: 250px; height: auto; overflow: hidden; -ms-flex-negative: 0; flex-shrink: 0; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch { width: 200px; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch { width: 130px; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -webkit-box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.0784313725); box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.0784313725); border-radius: 2.5rem; -webkit-transition: -webkit-transform 0.4s ease; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img { border-radius: 1.5rem; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover, body.category .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover, body.search .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .post-eyecatch img:hover { -webkit-transform: scale(1.05); transform: scale(1.05); } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap { position: relative; width: calc(100% - 250px); padding-left: 35px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; min-height: 150px; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap { width: calc(100% - 200px); padding-left: 25px; min-height: 120px; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap { width: 100%; padding-left: 0; min-height: auto; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { margin-top: 0; margin-bottom: 10px; font-weight: bold; color: var(--site-color); line-height: 1.4; } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { margin-bottom: 8px; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.87rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 2.2rem; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { margin-bottom: 10px; } } @media (max-width: 757px) and (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .post-title { font-size: 1.8rem; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { margin-bottom: 10px; color: var(--black); line-height: 1.6; } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { font-size: 1.6rem; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .excerpt { display: none; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag { margin-top: 1rem; } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag { margin-top: 0.5rem; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { color: var(--gray); } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.2rem; } } @media (max-width: 757px) and (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.26rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.26rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.4rem; } } @media (max-width: 757px) and (min-width: 1330px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .post-text .tag span { font-size: 1.4rem; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more { position: absolute; bottom: 10px; right: 10px; font-family: "Noto Serif JP", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "游明朝", "Yu Mincho", "MS P明朝", "MS PMincho", serif; font-size: 14px; font-style: italic; font-weight: bold; color: var(--site-color); text-decoration: none; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more { bottom: 5px; right: 5px; font-size: 13px; } } @media (max-width: 757px) { body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more { position: static; margin-top: 10px; text-align: center; display: block; width: 100%; } } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more::after { content: "→"; display: inline-block; margin-left: 5px; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } body.archive .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after, body.taxonomy .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after, body.category .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after, body.search .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after, body.page.latest .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after, body.page.popular .page--wrapper .container .contents main #grid .grid-container article a .wrap .read-more:hover::after { -webkit-transform: translateX(3px); transform: translateX(3px); } body.archive .pagination-container, body.taxonomy .pagination-container, body.category .pagination-container, body.search .pagination-container, body.page.latest .pagination-container, body.page.popular .pagination-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 50px auto; gap: 8px; -ms-flex-wrap: wrap; flex-wrap: wrap; } body.archive .pagination-container .page-numbers, body.taxonomy .pagination-container .page-numbers, body.category .pagination-container .page-numbers, body.search .pagination-container .page-numbers, body.page.latest .pagination-container .page-numbers, body.page.popular .pagination-container .page-numbers { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 40px; height: 40px; padding: 0 12px; border-radius: 20px; background-color: #f5f5f5; color: var(--site-color); font-weight: 600; text-decoration: none; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body.archive .pagination-container .page-numbers, body.taxonomy .pagination-container .page-numbers, body.category .pagination-container .page-numbers, body.search .pagination-container .page-numbers, body.page.latest .pagination-container .page-numbers, body.page.popular .pagination-container .page-numbers { min-width: 36px; height: 36px; padding: 0 10px; } } @media (max-width: 757px) { body.archive .pagination-container .page-numbers, body.taxonomy .pagination-container .page-numbers, body.category .pagination-container .page-numbers, body.search .pagination-container .page-numbers, body.page.latest .pagination-container .page-numbers, body.page.popular .pagination-container .page-numbers { min-width: 32px; height: 32px; padding: 0 8px; font-size: 14px; } } body.archive .pagination-container .page-numbers:hover, body.taxonomy .pagination-container .page-numbers:hover, body.category .pagination-container .page-numbers:hover, body.search .pagination-container .page-numbers:hover, body.page.latest .pagination-container .page-numbers:hover, body.page.popular .pagination-container .page-numbers:hover { background-color: var(--site-color); color: white; } body.archive .pagination-container .page-numbers.current, body.taxonomy .pagination-container .page-numbers.current, body.category .pagination-container .page-numbers.current, body.search .pagination-container .page-numbers.current, body.page.latest .pagination-container .page-numbers.current, body.page.popular .pagination-container .page-numbers.current { background-color: var(--site-color); color: white; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); } body.archive .pagination-container .page-numbers.dots, body.taxonomy .pagination-container .page-numbers.dots, body.category .pagination-container .page-numbers.dots, body.search .pagination-container .page-numbers.dots, body.page.latest .pagination-container .page-numbers.dots, body.page.popular .pagination-container .page-numbers.dots { background-color: transparent; color: var(--gray); pointer-events: none; } body.archive .pagination-container .page-numbers.next, body.archive .pagination-container .page-numbers.prev, body.taxonomy .pagination-container .page-numbers.next, body.taxonomy .pagination-container .page-numbers.prev, body.category .pagination-container .page-numbers.next, body.category .pagination-container .page-numbers.prev, body.search .pagination-container .page-numbers.next, body.search .pagination-container .page-numbers.prev, body.page.latest .pagination-container .page-numbers.next, body.page.latest .pagination-container .page-numbers.prev, body.page.popular .pagination-container .page-numbers.next, body.page.popular .pagination-container .page-numbers.prev { padding: 0 15px; } @media (max-width: 757px) { body.archive .pagination-container .page-numbers.next, body.archive .pagination-container .page-numbers.prev, body.taxonomy .pagination-container .page-numbers.next, body.taxonomy .pagination-container .page-numbers.prev, body.category .pagination-container .page-numbers.next, body.category .pagination-container .page-numbers.prev, body.search .pagination-container .page-numbers.next, body.search .pagination-container .page-numbers.prev, body.page.latest .pagination-container .page-numbers.next, body.page.latest .pagination-container .page-numbers.prev, body.page.popular .pagination-container .page-numbers.next, body.page.popular .pagination-container .page-numbers.prev { padding: 0 10px; } } body #mobile_menu { display: none; position: fixed; bottom: -150px; left: 0; width: 100%; background: rgba(255, 255, 255, 0.8); color: white; z-index: 100; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px; -webkit-transition: bottom 0.5s ease; transition: bottom 0.5s ease; } @media (max-width: 757px) { body #mobile_menu { display: -webkit-box; display: -ms-flexbox; display: flex; } } body #mobile_menu .mobile-reception { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; padding: 15px 0; cursor: pointer; background: var(--sub-color); } body #mobile_menu .mobile-reception a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: white; font-weight: 700; } body #mobile_menu .mobile-reception a img { max-width: 20px; max-height: 25px; margin-right: 5px; display: inline-block; } body #mobile_menu .mobile-reception + .mobile-reception { border-left: 1px solid white; background: var(--site-color); } .widget-area { background-color: var(--light-gray); border-radius: 2.5rem; padding: 3rem 2.5rem 2rem; -ms-flex-preferred-size: 25%; flex-basis: 25%; } @media (max-width: 757px) { .widget-area { margin-top: 3rem; } } .widget-area aside, .widget-area section { margin-top: 15px; margin-bottom: 50px; } .widget-area aside:first-child, .widget-area section:first-child { margin-top: 0; } .widget-area aside:last-child, .widget-area section:last-child { margin-bottom: 0; } .widget-area aside .widget-title, .widget-area aside h2, .widget-area aside h3, .widget-area section .widget-title, .widget-area section h2, .widget-area section h3 { line-height: 1; border-bottom: 2px solid var(--site-color); padding: 10px 0; margin-bottom: 2rem; font-weight: bolder; } @media (max-width: 757px) { .widget-area aside .widget-title, .widget-area aside h2, .widget-area aside h3, .widget-area section .widget-title, .widget-area section h2, .widget-area section h3 { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .widget-title, .widget-area aside h2, .widget-area aside h3, .widget-area section .widget-title, .widget-area section h2, .widget-area section h3 { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .widget-title, .widget-area aside h2, .widget-area aside h3, .widget-area section .widget-title, .widget-area section h2, .widget-area section h3 { font-size: 1.8rem; } } @media (min-width: 1330px) { .widget-area aside .widget-title, .widget-area aside h2, .widget-area aside h3, .widget-area section .widget-title, .widget-area section h2, .widget-area section h3 { font-size: 1.8rem; } } .widget-area aside.new-posts .new-posts--header h3, .widget-area section.new-posts .new-posts--header h3 { margin-bottom: 10px; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new, .widget-area section.new-posts ul.new { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 20px; } } @media (max-width: 757px) { .widget-area aside.new-posts ul.new, .widget-area section.new-posts ul.new { display: grid; grid-template-columns: 1fr; gap: 25px 20px; } } .widget-area aside.new-posts ul.new li a.new-entry-title, .widget-area section.new-posts ul.new li a.new-entry-title { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 15px 0; gap: 20px; border-top: 1px solid #ddd; } .widget-area aside.new-posts ul.new li a.new-entry-title:hover, .widget-area section.new-posts ul.new li a.new-entry-title:hover { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch { position: relative; width: 40%; height: auto; background-size: cover; background-position: center center; overflow: hidden; } .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch img, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch img { -o-object-fit: cover; object-fit: cover; -o-object-position: top; object-position: top; width: 100%; height: 100%; } .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn { padding: 3px 10px; color: white; background: rgba(0, 0, 0, 0.5); display: inline-block; font-size: 0.75rem; position: absolute; right: 0; top: 0; } @media (max-width: 757px) { .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn { font-size: 0.9rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn { font-size: 0.9rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn { font-size: 1rem; } } @media (min-width: 1330px) { .widget-area aside.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn, .widget-area section.new-posts ul.new li a.new-entry-title .post-eyecatch .catbtn { font-size: 1rem; } } .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content { width: 60%; } .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content p, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content p { font-weight: bolder; font-weight: 500; line-height: 1.4; margin-bottom: 1em; } @media (max-width: 757px) { .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content p, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content p { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content p, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content p { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content p, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content p { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside.new-posts ul.new li a.new-entry-title .new-posts--content p, .widget-area section.new-posts ul.new li a.new-entry-title .new-posts--content p { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { text-align: right; display: block; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.2rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.2rem; } } @media (max-width: 757px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { text-align: right; display: block; font-weight: normal; } } @media (max-width: 757px) and (max-width: 757px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.08rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.08rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.2rem; } } @media (max-width: 757px) and (min-width: 1330px) { .widget-area aside.new-posts ul.new li a time, .widget-area section.new-posts ul.new li a time { font-size: 1.2rem; } } .widget-area aside.new-posts ul.new li:first-of-type a, .widget-area section.new-posts ul.new li:first-of-type a { border-top: none; } .widget-area aside .category-thumb, .widget-area section .category-thumb { padding-left: 0; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb, .widget-area section .category-thumb { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 2em; } } @media (max-width: 757px) { .widget-area aside .category-thumb, .widget-area section .category-thumb { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 0; } } .widget-area aside .category-thumb .no-img a .title:before, .widget-area section .category-thumb .no-img a .title:before { content: ""; display: inline-block; width: 7px; height: 7px; margin-left: 5px; margin-right: 10px; border-radius: 50%; background-color: var(--site-color); } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .category-thumb .no-img a .title:before, .widget-area section .category-thumb .no-img a .title:before { margin-right: 5px; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb .no-img a .title:before, .widget-area section .category-thumb .no-img a .title:before { margin-right: 5px; } } @media (max-width: 757px) { .widget-area aside .category-thumb .no-img a .title:before, .widget-area section .category-thumb .no-img a .title:before { margin-right: 5px; } } .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 10px; letter-spacing: normal; -webkit-transition: all 0.3s; transition: all 0.3s; line-height: 1.5; } @media (max-width: 757px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { font-size: 1.6rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { padding: 0 10px 0 0; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { padding: 0 10px 0 0; } } @media (max-width: 757px) { .widget-area aside .category-thumb li a, .widget-area section .category-thumb li a { padding: 0 5px 0 0; } } .widget-area aside .category-thumb li a:hover, .widget-area section .category-thumb li a:hover { opacity: 0.75; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .widget-area aside .category-thumb li a img, .widget-area section .category-thumb li a img { border-radius: 300px; width: 40px; height: 40px; padding: 3px; display: inline-block; margin-right: 5px; } .widget-area aside .category-thumb li a img:hover, .widget-area section .category-thumb li a img:hover { opacity: 1; } .widget-area aside .category-thumb li a span, .widget-area section .category-thumb li a span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .widget-area aside .category-thumb li a span .number, .widget-area section .category-thumb li a span .number { color: var(--black); margin-left: 10px; width: 20px; display: inline-block; text-align: center; font-size: 1.2rem; border-radius: 50px; background: #eceff2; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb li a span .number, .widget-area section .category-thumb li a span .number { margin-left: 5px; } } @media (max-width: 757px) { .widget-area aside .category-thumb li a span .number, .widget-area section .category-thumb li a span .number { margin-left: 5px; } } .widget-area aside .category-thumb li ul, .widget-area section .category-thumb li ul { padding-left: 32px; position: relative; } @media (max-width: 757px) { .widget-area aside .category-thumb li ul, .widget-area section .category-thumb li ul { padding-left: 25px; } } .widget-area aside .category-thumb li ul:before, .widget-area section .category-thumb li ul:before { content: ""; display: block; position: absolute; top: -5px; left: 8px; bottom: 23px; width: 0; border-left: 1px solid #ccc; } .widget-area aside .category-thumb li ul li, .widget-area section .category-thumb li ul li { position: relative; margin: 0; padding: 3px 0; text-decoration: none; text-transform: uppercase; font-weight: normal; line-height: 20px; } .widget-area aside .category-thumb li ul li:before, .widget-area section .category-thumb li ul li:before { content: ""; display: block; position: absolute; bottom: 23px; left: -24px; width: 20px; height: 0; border-top: 1px solid #737373; border-right: 1px solid #737373; } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .category-thumb li ul li:before, .widget-area section .category-thumb li ul li:before { left: -17px; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .category-thumb li ul li:before, .widget-area section .category-thumb li ul li:before { left: -17px; } } @media (max-width: 757px) { .widget-area aside .category-thumb li ul li:before, .widget-area section .category-thumb li ul li:before { left: -17px; } } .widget-area aside .category-thumb li ul li a .number, .widget-area section .category-thumb li ul li a .number { color: var(--black); margin-left: 5px; width: 20px; display: inline-block; text-align: center; font-size: 1.2rem; border-radius: 50px; background: #eceff2; } .widget-area aside .tagcloud, .widget-area section .tagcloud { margin: 2em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (max-width: 757px) { .widget-area aside .tagcloud, .widget-area section .tagcloud { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } .widget-area aside .tagcloud a, .widget-area section .tagcloud a { text-decoration: none; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; position: relative; background: var(--gray); border-radius: 4px; margin-bottom: 0.3em; margin-right: 5px; -webkit-transition: all 1s; transition: all 1s; font-size: 1.3rem !important; font-weight: 500; padding: 6px 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .widget-area aside .tagcloud a:hover, .widget-area section .tagcloud a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); color: white; background: var(--hover-color); border-color: var(--hover-color); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .widget-area .wp-block-tag-cloud { margin: 2em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (max-width: 757px) { .widget-area .wp-block-tag-cloud { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } .widget-area .wp-block-tag-cloud a { text-decoration: none; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; position: relative; background: var(--gray); border-radius: 4px; margin-bottom: 0.3em; margin-right: 5px; -webkit-transition: all 1s cubic-bezier(0.25, 1, 0.5, 1); transition: all 1s cubic-bezier(0.25, 1, 0.5, 1); font-size: 1.3rem !important; font-weight: 500; padding: 6px 12px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .widget-area .wp-block-tag-cloud a:hover { -webkit-transform: scale(1.05); transform: scale(1.05); color: white; background: var(--hover-color); border-color: var(--hover-color); -webkit-transition-duration: 0.6s; transition-duration: 0.6s; } .widget-area aside.tags { margin: 2em 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.5em; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .widget-area aside.tags a.tag { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--black, #333); border-radius: 2em; padding: 0.35em 0.7em 0.35em 0.7em; font-weight: 500; margin: 0 0 0.5em 0; text-decoration: none; -webkit-transition: background 0.3s, color 0.3s, -webkit-transform 0.3s; transition: background 0.3s, color 0.3s, -webkit-transform 0.3s; transition: background 0.3s, color 0.3s, transform 0.3s; transition: background 0.3s, color 0.3s, transform 0.3s, -webkit-transform 0.3s; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); border: 1px solid #e0e0e0; } @media (max-width: 757px) { .widget-area aside.tags a.tag { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.tags a.tag { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside.tags a.tag { font-size: 1.4rem; } } @media (min-width: 1330px) { .widget-area aside.tags a.tag { font-size: 1.4rem; } } .widget-area aside.tags a.tag:hover { background: var(--site-color, #0073aa); color: #fff; -webkit-transform: translateY(-2px) scale(1.08); transform: translateY(-2px) scale(1.08); border-color: var(--site-color, #0073aa); } .widget-area aside.tags a.tag .tag-hash { color: var(--site-color, #0073aa); font-weight: bold; margin-right: 0.3em; font-size: 1.1em; -webkit-transition: color 0.3s; transition: color 0.3s; } .widget-area aside .widget, .widget-area section .widget { position: relative; } .widget-area aside .widget > ul, .widget-area section .widget > ul { background: white; list-style: none; line-height: 1.8rem; padding-left: 0; margin-top: 1em; margin-bottom: 2.5em; } .widget-area aside .widget ul, .widget-area section .widget ul { padding: 0; list-style: none; } .widget-area aside .widget ul li ul, .widget-area section .widget ul li ul { padding-left: 20px; } .widget-area aside .widget ul li ul.children, .widget-area section .widget ul li ul.children { list-style: none; font-weight: normal; padding-left: 0.75rem; } .widget-area aside .widget ul li ul.children a, .widget-area section .widget ul li ul.children a { position: relative; padding: 0.5em 0 0.5em 2em; font-size: 1.2rem; } .widget-area aside .widget ul li ul.children a:before, .widget-area section .widget ul li ul.children a:before { content: ""; width: 6px; height: 6px; border: 0px; border-top: solid 1px #737373; border-right: solid 1px #737373; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 16px; left: 10px; } .widget-area aside .widget ul li ul.children a span, .widget-area section .widget ul li ul.children a span { line-height: 1em; float: right; margin: 0 0 0 8px; padding: 6px 8px; border-radius: 200px; color: var(--site-color); background: white; font-weight: normal; border: 1px solid var(--site-color); } @media (max-width: 757px) { .widget-area aside .widget ul li ul.children a span, .widget-area section .widget ul li ul.children a span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .widget ul li ul.children a span, .widget-area section .widget ul li ul.children a span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .widget ul li ul.children a span, .widget-area section .widget ul li ul.children a span { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside .widget ul li ul.children a span, .widget-area section .widget ul li ul.children a span { font-size: 1.6rem; } } .widget-area aside .widget ul li a, .widget-area section .widget ul li a { text-decoration: none; padding: 0.5em 0 0.5em 1.2em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1.5; position: relative; } @media (max-width: 757px) { .widget-area aside .widget ul li a, .widget-area section .widget ul li a { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .widget ul li a, .widget-area section .widget ul li a { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .widget ul li a, .widget-area section .widget ul li a { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside .widget ul li a, .widget-area section .widget ul li a { font-size: 1.6rem; } } .widget-area aside .widget ul li a span, .widget-area section .widget ul li a span { line-height: 1em; float: right; margin: 0 0 0 8px; padding: 6px 8px; border-radius: 200px; color: white; background: var(--site-color); font-weight: normal; border: 1px solid var(--site-color); } @media (max-width: 757px) { .widget-area aside .widget ul li a span, .widget-area section .widget ul li a span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .widget ul li a span, .widget-area section .widget ul li a span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside .widget ul li a span, .widget-area section .widget ul li a span { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside .widget ul li a span, .widget-area section .widget ul li a span { font-size: 1.6rem; } } .widget-area aside .widget ul li a:hover, .widget-area section .widget ul li a:hover { opacity: 0.75; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .widget-area aside .widget ul li a:before, .widget-area section .widget ul li a:before { content: ""; width: 8px; height: 8px; border: 0px; border-top: solid 2px var(--site-color); border-right: solid 2px var(--site-color); -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 16px; left: -1px; } .widget-area aside .widget ul li a .post-count, .widget-area section .widget ul li a .post-count { display: block; float: right; color: white; background: var(--site-color); font-size: 1.2rem; line-height: 1; padding: 3px 5px; border: 1px solid var(--site-color); border-radius: 200px; } .widget-area aside .widget_recent_entries ul li a, .widget-area section .widget_recent_entries ul li a { padding-bottom: 1em; } .widget-area aside .widget-info, .widget-area section .widget-info { border-left: 2px solid var(--site-color); border-right: 2px solid var(--site-color); border-top: 2px solid var(--site-color); border-bottom: 2px solid var(--site-color); padding: 50px 1.5em 1.5em; background-image: url(../img/prof-bg.webp); background-position: top center; background-size: 105%; background-repeat: no-repeat; margin-bottom: 3em; text-align: center; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside .widget-info, .widget-area section .widget-info { padding-left: 10px; padding-right: 10px; } } .widget-area aside .widget-info img, .widget-area section .widget-info img { margin-bottom: 1em; } .widget-area aside .widget-info .prof, .widget-area section .widget-info .prof { max-width: 100px; margin: 0 auto 1em; } .widget-area aside .widget-info p, .widget-area section .widget-info p { font-size: 1.3rem; margin-bottom: 1em; text-align: left; } .widget-area aside .widget-info .sns, .widget-area section .widget-info .sns { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 1em; } .widget-area aside .widget-info .sns div:last-child img, .widget-area section .widget-info .sns div:last-child img { margin-right: 0; } .widget-area aside .widget-info .sns div img, .widget-area section .widget-info .sns div img { max-width: 25px; margin-right: 1.2em; margin-bottom: 1em; } .widget-area aside .widget-info h4, .widget-area section .widget-info h4 { font-size: 1.6rem; } .widget-area aside .widget-info .more, .widget-area section .widget-info .more { color: var(--site-color); font-size: 1.3rem; font-weight: 600; position: relative; padding-left: 5px; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; line-height: 1; } .widget-area aside .widget-info .more:before, .widget-area section .widget-info .more:before { content: ""; width: 0.5em; height: 0.5em; border: 0; border-top: solid 0.12em #000; border-right: solid 0.12em #000; -webkit-transform: rotate(45deg); transform: translateY(-50%) rotate(45deg); position: absolute; top: 50%; left: -0.9em; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } .widget-area aside .widget-info .more:before, .widget-area section .widget-info .more:before { top: 38%; } .widget-area aside .widget-info .more:hover, .widget-area section .widget-info .more:hover { color: var(--hover-color); } .widget-area aside .widget-info .more img, .widget-area section .widget-info .more img { max-width: 12px; margin-left: 5px; vertical-align: -webkit-baseline-middle; } .widget-area aside.profile h3, .widget-area section.profile h3 { display: none; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.profile h3, .widget-area section.profile h3 { display: block; } } @media (max-width: 757px) { .widget-area aside.profile h3, .widget-area section.profile h3 { display: block; } } .widget-area aside.profile .author-meta, .widget-area section.profile .author-meta { background-color: var(--light-site-color); padding: 30px; border-radius: 8px; text-align: center; } .widget-area aside.profile .author-meta .author-title, .widget-area section.profile .author-meta .author-title { font-weight: bold; margin-bottom: 15px; } .widget-area aside.profile .author-meta .author-details, .widget-area section.profile .author-meta .author-details { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .widget-area aside.profile .author-meta .author-details .author-avatar, .widget-area section.profile .author-meta .author-details .author-avatar { margin-bottom: 5px; } .widget-area aside.profile .author-meta .author-details .author-avatar img, .widget-area section.profile .author-meta .author-details .author-avatar img { border-radius: 50%; width: 100px; height: 100px; -o-object-fit: cover; object-fit: cover; } .widget-area aside.profile .author-meta .author-details .author-bio .author-name, .widget-area section.profile .author-meta .author-details .author-bio .author-name { font-weight: bold; text-decoration: none; margin-bottom: 10px; } @media (max-width: 757px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-name, .widget-area section.profile .author-meta .author-details .author-bio .author-name { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-name, .widget-area section.profile .author-meta .author-details .author-bio .author-name { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-name, .widget-area section.profile .author-meta .author-details .author-bio .author-name { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-name, .widget-area section.profile .author-meta .author-details .author-bio .author-name { font-size: 1.6rem; } } .widget-area aside.profile .author-meta .author-details .author-bio .author-description, .widget-area section.profile .author-meta .author-details .author-bio .author-description { margin: 15px 0 0; line-height: 1.8; white-space: normal; text-align: justify; } @media (max-width: 757px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-description, .widget-area section.profile .author-meta .author-details .author-bio .author-description { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-description, .widget-area section.profile .author-meta .author-details .author-bio .author-description { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-description, .widget-area section.profile .author-meta .author-details .author-bio .author-description { font-size: 1.4rem; } } @media (min-width: 1330px) { .widget-area aside.profile .author-meta .author-details .author-bio .author-description, .widget-area section.profile .author-meta .author-details .author-bio .author-description { font-size: 1.4rem; } } .widget-area aside.profile .author-meta .author-sns, .widget-area section.profile .author-meta .author-sns { margin-top: 20px; } .widget-area aside.profile .author-meta .author-sns .sns-links, .widget-area section.profile .author-meta .author-sns .sns-links { list-style: none; padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 15px; } .widget-area aside.profile .author-meta .author-sns .sns-links li, .widget-area section.profile .author-meta .author-sns .sns-links li { display: inline-block; } .widget-area aside.profile .author-meta .author-sns .sns-links li a, .widget-area section.profile .author-meta .author-sns .sns-links li a { display: inline-block; text-decoration: none; } .widget-area aside.profile .author-meta .author-sns .sns-links li a .sns-icon, .widget-area section.profile .author-meta .author-sns .sns-links li a .sns-icon { width: 25px; height: auto; max-height: 20px; -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease; transition: opacity 0.3s ease, -webkit-transform 0.3s ease; transition: transform 0.3s ease, opacity 0.3s ease; transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease; } .widget-area aside.profile .author-meta .author-sns .sns-links li a .sns-icon:hover, .widget-area section.profile .author-meta .author-sns .sns-links li a .sns-icon:hover { -webkit-transform: scale(1.2); transform: scale(1.2); opacity: 0.8; } .widget-area .wp-block-archives-list { list-style: none; margin-bottom: 50px; padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .widget-area .wp-block-archives-list li ul { padding-left: 20px; } .widget-area .wp-block-archives-list li ul.children { list-style: none; font-weight: normal; padding-left: 0.75rem; } .widget-area .wp-block-archives-list li ul.children a { position: relative; padding: 0.5em 0 0.5em 2em; font-size: 1.2rem; } .widget-area .wp-block-archives-list li ul.children a:before { content: ""; width: 6px; height: 6px; border: 0px; border-top: solid 1px #737373; border-right: solid 1px #737373; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 16px; left: 10px; } .widget-area .wp-block-archives-list li ul.children a span { line-height: 1em; float: right; margin: 0 0 0 8px; padding: 6px 8px; border-radius: 200px; color: var(--site-color); background: white; font-weight: normal; border: 1px solid var(--site-color); } @media (max-width: 757px) { .widget-area .wp-block-archives-list li ul.children a span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-archives-list li ul.children a span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area .wp-block-archives-list li ul.children a span { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area .wp-block-archives-list li ul.children a span { font-size: 1.6rem; } } .widget-area .wp-block-archives-list li a { text-decoration: none; padding: 0.5em 0 0.5em 1.2em; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 1.5; position: relative; } @media (max-width: 757px) { .widget-area .wp-block-archives-list li a { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-archives-list li a { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area .wp-block-archives-list li a { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area .wp-block-archives-list li a { font-size: 1.6rem; } } .widget-area .wp-block-archives-list li a span { line-height: 1em; float: right; margin: 0 0 0 8px; padding: 6px 8px; border-radius: 200px; color: white; background: var(--site-color); font-weight: normal; border: 1px solid var(--site-color); } @media (max-width: 757px) { .widget-area .wp-block-archives-list li a span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-archives-list li a span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area .wp-block-archives-list li a span { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area .wp-block-archives-list li a span { font-size: 1.6rem; } } .widget-area .wp-block-archives-list li a:hover { opacity: 0.75; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .widget-area .wp-block-archives-list li a:before { content: ""; width: 8px; height: 8px; border: 0px; border-top: solid 2px var(--site-color); border-right: solid 2px var(--site-color); -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 16px; left: -1px; } .widget-area .wp-block-archives-list li a .post-count { display: block; float: right; color: white; background: var(--site-color); font-size: 1.2rem; line-height: 1; padding: 3px 5px; border: 1px solid var(--site-color); border-radius: 200px; } .widget-area .wp-block-latest-posts__list { list-style: none; padding: 0; } .widget-area .wp-block-latest-posts__list li { margin: 10px 0; padding-bottom: 10px; line-height: 1.4; border-bottom: 1px solid #ddd; } .widget-area .wp-block-latest-posts__list li:last-child { margin-bottom: 0; border-bottom: none; } .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { font-weight: 600; color: #0073aa; text-decoration: none; -webkit-transition: color 0.3s; transition: color 0.3s; } @media (max-width: 757px) { .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title { font-size: 1.6rem; } } .widget-area .wp-block-latest-posts__list li .wp-block-latest-posts__post-title:hover { color: #005f8d; text-decoration: underline; } .widget-area .wp-block-latest-comments { list-style: none; padding: 0; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment { margin: 10px 0; padding-bottom: 10px; line-height: 1.4; border-bottom: 1px solid #ddd; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment:last-child { margin-bottom: 0; border-bottom: none; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta { color: #555; } @media (max-width: 757px) { .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta { font-size: 1.6rem; } } @media (min-width: 1330px) { .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta { font-size: 1.6rem; } } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link { font-weight: bold; color: #0073aa; text-decoration: none; -webkit-transition: color 0.3s; transition: color 0.3s; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-link:hover { color: #005f8d; text-decoration: underline; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author { font-weight: 600; color: #333; text-decoration: none; margin-left: 5px; -webkit-transition: color 0.3s; transition: color 0.3s; } .widget-area .wp-block-latest-comments li.wp-block-latest-comments__comment article footer.wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-author:hover { color: #0073aa; } .widget-area .wp-block-search { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; max-width: 400px; margin: 0 auto; } @media (min-width: 758px) and (max-width: 1024px) { .widget-area .wp-block-search { max-width: 100%; } } @media (max-width: 757px) { .widget-area .wp-block-search { max-width: 100%; } } .widget-area .wp-block-search__label { line-height: 1; border-bottom: 2px solid var(--site-color); padding: 10px 0; margin-bottom: 2rem; font-weight: bolder; } .widget-area .wp-block-search__inside-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; } .widget-area .wp-block-search__input { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 10px 15px; font-size: 1rem; border: 1px solid #ccc; border-radius: 4px; -webkit-transition: border-color 0.3s, -webkit-box-shadow 0.3s; transition: border-color 0.3s, -webkit-box-shadow 0.3s; transition: border-color 0.3s, box-shadow 0.3s; transition: border-color 0.3s, box-shadow 0.3s, -webkit-box-shadow 0.3s; } .widget-area .wp-block-search__input:focus { border-color: var(--site-color); -webkit-box-shadow: 0 0 5px rgba(0, 115, 170, 0.5); box-shadow: 0 0 5px rgba(0, 115, 170, 0.5); outline: none; } .widget-area .wp-block-search__input::-webkit-input-placeholder { color: #aaa; } .widget-area .wp-block-search__input::-moz-placeholder { color: #aaa; } .widget-area .wp-block-search__input:-ms-input-placeholder { color: #aaa; } .widget-area .wp-block-search__input::-ms-input-placeholder { color: #aaa; } .widget-area .wp-block-search__input::placeholder { color: #aaa; } .widget-area .wp-block-search__button { padding: 10px 20px; font-size: 1rem; font-weight: bold; color: #fff; background-color: #0073aa; border: none; border-radius: 4px; cursor: pointer; -webkit-transition: background-color 0.3s, -webkit-transform 0.3s; transition: background-color 0.3s, -webkit-transform 0.3s; transition: background-color 0.3s, transform 0.3s; transition: background-color 0.3s, transform 0.3s, -webkit-transform 0.3s; margin: 0; } .widget-area .wp-block-search__button:hover { background-color: #005f8d; -webkit-transform: scale(1.05); transform: scale(1.05); } .widget-area .wp-block-search__button:focus { outline: 2px solid #005f8d; } @media (max-width: 757px) { body header.header .header--wrapper .header--right .drawer-mobile { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } } body header.header .header--wrapper .header--right #nav-drawer { width: 35px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media (min-width: 1330px) { body header.header .header--wrapper .header--right #nav-drawer { display: none; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body header.header .header--wrapper .header--right #nav-drawer { display: none; } } @media (min-width: 758px) and (max-width: 1024px) { body header.header .header--wrapper .header--right #nav-drawer { display: -webkit-box; display: -ms-flexbox; display: flex; } } @media (max-width: 757px) { body header.header .header--wrapper .header--right #nav-drawer { display: -webkit-box; display: -ms-flexbox; display: flex; } } body header.header .header--wrapper .header--right #nav-drawer .nav-unshown { display: none; } body header.header .header--wrapper .header--right #nav-drawer #nav-open { display: inline-block; vertical-align: middle; cursor: pointer; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn { position: relative; width: 25px; min-height: 50px; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn span { display: inline-block; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; left: 0; height: 2px; border-radius: 3px; background: var(--site-color); width: 100%; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn span:nth-of-type(1) { top: 8px; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn span:nth-of-type(2) { top: 16px; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn span:nth-of-type(3) { top: 24px; } body header.header .header--wrapper .header--right #nav-drawer #nav-open .openbtn p { font-size: 1.1rem; font-weight: 900; position: absolute; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); top: 29px; font-family: sans-serif; white-space: nowrap; } body #nav-close { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--black); opacity: 0; -webkit-transition: 0.3s ease-in-out; transition: 0.3s ease-in-out; z-index: 99; } body #nav-content { top: 0; left: 0; width: 90%; max-width: 45vw; height: 100%; -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transition: -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); -webkit-transform: translateX(-105%); transform: translateX(-105%); background: white; z-index: 100; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 758px) and (max-width: 1024px) { body #nav-content { padding: 5em 15px; max-width: 50vw; } } @media (max-width: 757px) { body #nav-content { padding: 3em 15px; max-width: 75vw; } } body #nav-content .nav-in { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body #nav-content .nav-in .menu-logo { margin-bottom: 10px; } body #nav-content .nav-in .menu-logo img { max-width: 150px; margin: 0 auto; } body #nav-content .nav-in .menu-logo p { font-weight: bolder; } @media (max-width: 757px) { body #nav-content .nav-in .menu-logo p { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #nav-content .nav-in .menu-logo p { font-size: 1.7rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #nav-content .nav-in .menu-logo p { font-size: 2rem; } } @media (min-width: 1330px) { body #nav-content .nav-in .menu-logo p { font-size: 2rem; } } body #nav-content .nav-in .site_logo--img { margin-bottom: 1rem; } body #nav-content .nav-in .site_logo--img img { max-width: 170px; margin: 0 auto; } body #nav-content .nav-in .site-description { margin-top: 0.5rem; max-width: 200px; font-weight: bold; } @media (max-width: 757px) { body #nav-content .nav-in .site-description { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #nav-content .nav-in .site-description { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #nav-content .nav-in .site-description { font-size: 1.6rem; } } @media (min-width: 1330px) { body #nav-content .nav-in .site-description { font-size: 1.6rem; } } body #nav-content .nav-in .menu-list { list-style: none; margin: 3rem 0; padding: 0; } body #nav-content .nav-in .menu-list .menu-item { border-bottom: 1px solid rgba(255, 255, 255, 0.1); } body #nav-content .nav-in .menu-list .menu-item:last-child { border-bottom: none; } body #nav-content .nav-in .menu-list .menu-item a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 16px 0; color: var(--black); text-decoration: none; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } body #nav-content .nav-in .menu-list .menu-item a:hover, body #nav-content .nav-in .menu-list .menu-item a:active { opacity: 0.7; } body #nav-content .nav-in .menu-list .menu-item .menu-icon { width: 24px; height: 24px; margin-right: 12px; } body #nav-content .nav-in .menu-list .menu-item span { font-size: 16px; font-weight: 500; letter-spacing: 0.05em; } body #nav-content .nav-in #search-form { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; border: 1px solid var(--site-color); -webkit-box-shadow: 0 0 4px var(--site-color); box-shadow: 0 0 4px var(--site-color); border-radius: 50px; background-color: rgba(233, 248, 255, 0.6); } body #nav-content .nav-in #search-form .searchfield { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 12px 16px; color: var(--black); font-size: 14px; } body #nav-content .nav-in #search-form .searchfield::-webkit-input-placeholder { color: rgba(0, 0, 0, 0.6); } body #nav-content .nav-in #search-form .searchfield::-moz-placeholder { color: rgba(0, 0, 0, 0.6); } body #nav-content .nav-in #search-form .searchfield:-ms-input-placeholder { color: rgba(0, 0, 0, 0.6); } body #nav-content .nav-in #search-form .searchfield::-ms-input-placeholder { color: rgba(0, 0, 0, 0.6); } body #nav-content .nav-in #search-form .searchfield::placeholder { color: rgba(0, 0, 0, 0.6); } body #nav-content .nav-in #search-form .searchfield:focus { outline: none; border-color: rgba(255, 255, 255, 0.6); background-color: rgba(255, 255, 255, 0.15); } body #nav-content .nav-in #search-form .searchsubmit { padding: 12px 24px; border: none; border-radius: 4px; background-size: 20px; background-position: center; cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; white-space: nowrap; } body #nav-content .nav-in #search-form .searchsubmit:hover { opacity: 0.9; -webkit-transform: translateY(-1px); transform: translateY(-1px); } body #nav-content .nav-in #search-form .searchsubmit:active { -webkit-transform: translateY(0); transform: translateY(0); } body a.btn { --btn-bg-color: #fff; --btn-hover-bg-color: var(--site-color, #043c9d); --btn-text-color: #222; --btn-hover-text-color: #fff; width: 200px; height: 50px; margin: 1em auto; border-radius: 40px; border: 1px solid #fff; color: var(--btn-text-color); font-weight: 800; padding: 10px 50px; cursor: pointer; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0px 5px 10px; box-shadow: rgba(0, 0, 0, 0.25) 0px 5px 10px; background: var(--btn-bg-color); background-blend-mode: multiply; -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body a.btn { width: 300px; height: 70px; padding: 10px 40px; } } @media (max-width: 757px) { body a.btn { width: 220px; height: 50px; padding: 8px 30px; } } body a.btn::after { content: ""; width: 6px; height: 6px; border: 0; border-top: solid 2px white; border-right: solid 2px white; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 0; right: 15px; bottom: 0; margin: auto; margin-left: 10px; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } @media (min-width: 758px) and (max-width: 1024px) { body a.btn::after { right: 12px; margin-left: 6px; } } @media (max-width: 757px) { body a.btn::after { margin-left: 5px; } } body a.btn:hover { -webkit-transform: scale(1.05); transform: scale(1.05); background-color: var(--btn-hover-bg-color); color: var(--btn-hover-text-color); } @media (min-width: 758px) and (max-width: 1024px) { body a.btn:hover { -webkit-transform: scale(1.04); transform: scale(1.04); } } @media (max-width: 757px) { body a.btn:hover { -webkit-transform: scale(1.03); transform: scale(1.03); } } body a.btn:hover::after { -webkit-transform: translateX(5px) rotate(45deg); transform: translateX(5px) rotate(45deg); } body a.btn img { max-width: 20px; margin-right: 10px; } @media (max-width: 757px) { body a.btn img { max-width: 16px; margin-right: 8px; } } body a.btn.pupular-btn { --btn-bg-color: #71d4e8; --btn-text-color: #fff; --btn-hover-bg-color: #0080ff; --btn-hover-text-color: #fff; } body a.btn.latest-btn { --btn-bg-color: #e87272; --btn-text-color: #fff; --btn-hover-bg-color: #c0392b; --btn-hover-text-color: #fff; } body a.btn.red { --btn-bg-color: red; --btn-hover-bg-color: darkred; --btn-text-color: #fff; --btn-hover-text-color: #fff; } body a.btn.light { --btn-bg-color: #ffe; --btn-hover-bg-color: #fff; --btn-text-color: #222; --btn-hover-text-color: #222; } body .map-btn { width: 180px; height: 44px; margin: 1em auto; border-radius: 30px; background-color: #e6a96b; color: #fff; font-weight: bold; letter-spacing: 0.05em; cursor: pointer; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: background 0.2s, color 0.2s, border 0.2s, -webkit-transform 0.2s; transition: background 0.2s, color 0.2s, border 0.2s, -webkit-transform 0.2s; transition: background 0.2s, color 0.2s, border 0.2s, transform 0.2s; transition: background 0.2s, color 0.2s, border 0.2s, transform 0.2s, -webkit-transform 0.2s; padding: 0.6em 1.5em; } body .map-btn:hover { background: var(--site-color, #043c9d); color: #fff; border-color: var(--site-color, #043c9d); -webkit-transform: translateY(-2px) scale(1.03); transform: translateY(-2px) scale(1.03); } body { /* 目次のスタイル */ } body #toc--container { position: relative; background-color: #ebf0ff; border: 1px solid #c7d4f7; border-radius: 8px; max-width: 80%; margin: 0 auto 2em; -webkit-transition: all 0.3s; transition: all 0.3s; } @media (max-width: 757px) { body #toc--container { max-width: 85%; } } body #toc--container #toc--header span { font-size: 1.4rem; border-bottom: 1px solid #c7d4f7; background-color: rgba(0, 0, 0, 0.05); display: block; font-weight: bolder; padding: 10px 30px; color: #333; } @media (max-width: 757px) { body #toc--container #toc--header span { padding: 5px 15px; } } body #toc--container #show { -webkit-transition: all 0.3s; transition: all 0.3s; background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.15)), to(transparent)); background: linear-gradient(360deg, rgba(0, 0, 0, 0.15), transparent); position: absolute; font-size: 1.4rem; bottom: 0; left: 0; right: 0; margin: 0; padding: 10px 0; color: var(--site-color); text-align: center; cursor: pointer; border: none; border-radius: 0 0 5px 5px; } @media (max-width: 757px) { body #toc--container #show { font-size: 1.2rem; } } body #toc--container #show:hover { background-color: rgba(0, 0, 0, 0.1); } body #toc--container ul#toc { list-style: none; padding: 10px 30px; } @media (max-width: 757px) { body #toc--container ul#toc { padding: 5px 15px; } } body #toc--container ul#toc li { margin-bottom: 10px; } body #toc--container ul#toc li.h2 { font-weight: bold; } @media (max-width: 757px) { body #toc--container ul#toc li.h2 { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #toc--container ul#toc li.h2 { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #toc--container ul#toc li.h2 { font-size: 1.6rem; } } @media (min-width: 1330px) { body #toc--container ul#toc li.h2 { font-size: 1.6rem; } } body #toc--container ul#toc li.h3 { padding-left: 20px; } @media (max-width: 757px) { body #toc--container ul#toc li.h3 { font-size: 1.08rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #toc--container ul#toc li.h3 { font-size: 1.08rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #toc--container ul#toc li.h3 { font-size: 1.2rem; } } @media (min-width: 1330px) { body #toc--container ul#toc li.h3 { font-size: 1.2rem; } } body #toc--container ul#toc li:last-child { margin-bottom: 0; } body #toc--container ul#toc li a { text-decoration: none; color: #333; } body #toc--container ul#toc li a:hover { text-decoration: underline; } .fadeUpTrigger, .fadeLeftTrigger, .fadeRightTrigger { opacity: 0; } .fadeRightTrigger { -webkit-animation-name: fadeLeft; animation-name: fadeLeft; -webkit-animation-direction: alternate; animation-direction: alternate; } @-webkit-keyframes fadeLeft { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeLeft { from { opacity: 1; } to { opacity: 0; } } .fadeUp, .fadeLeft, .fadeRight { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0s; animation-delay: 0s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; opacity: 0; } @media (max-width: 757px) { .fadeUp, .fadeLeft, .fadeRight { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } } .fadeUp { -webkit-animation-name: fadeUpAnime; animation-name: fadeUpAnime; -webkit-animation-direction: alternate; animation-direction: alternate; } .fadeLeft { -webkit-animation-name: fadeLeftAnime; animation-name: fadeLeftAnime; -webkit-animation-direction: alternate; animation-direction: alternate; } .fadeRight { -webkit-animation-name: fadeRightAnime; animation-name: fadeRightAnime; -webkit-animation-direction: alternate; animation-direction: alternate; } @-webkit-keyframes fadeUpAnime { from { opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); @media (max-width: 757px) { -webkit-transform: translateY(50px); transform: translateY(50px); } } to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeUpAnime { from { opacity: 0; -webkit-transform: translateY(100px); transform: translateY(100px); @media (max-width: 757px) { -webkit-transform: translateY(50px); transform: translateY(50px); } } to { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes fadeLeftAnime { from { opacity: 0; -webkit-transform: translateX(100px); transform: translateX(100px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeLeftAnime { from { opacity: 0; -webkit-transform: translateX(100px); transform: translateX(100px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes fadeRightAnime { from { opacity: 0; -webkit-transform: translateX(-100px); transform: translateX(-100px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeRightAnime { from { opacity: 0; -webkit-transform: translateX(-100px); transform: translateX(-100px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } .slide-in { overflow: hidden; display: inline-block; } .slide-in.leftAnime { opacity: 0; } .slide-in .slide-in_inner { display: inline-block; } .slideAnimeLeftRight { -webkit-animation-name: slideTextX100; animation-name: slideTextX100; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; opacity: 0; } @-webkit-keyframes slideTextX100 { from { -webkit-transform: translateX(-100%); transform: translateX(-100%); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes slideTextX100 { from { -webkit-transform: translateX(-100%); transform: translateX(-100%); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } .slideAnimeRightLeft { -webkit-animation-name: slideTextX-100; animation-name: slideTextX-100; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; opacity: 0; } @-webkit-keyframes slideTextX-100 { from { -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes slideTextX-100 { from { -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } .bgextend { -webkit-animation-name: bgextendAnimeBase; animation-name: bgextendAnimeBase; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; position: relative; overflow: hidden; opacity: 0; } @-webkit-keyframes bgextendAnimeBase { from { opacity: 0; } to { opacity: 1; } } @keyframes bgextendAnimeBase { from { opacity: 0; } to { opacity: 1; } } .bgappear { -webkit-animation-name: bgextendAnimeSecond; animation-name: bgextendAnimeSecond; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0.6s; animation-delay: 0.6s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; opacity: 0; } @-webkit-keyframes bgextendAnimeSecond { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes bgextendAnimeSecond { 0% { opacity: 0; } 100% { opacity: 1; } } /*左から右*/ .bgLRextend::before { -webkit-animation-name: bgLRextendAnime; animation-name: bgLRextendAnime; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; content: ""; position: absolute; width: 100%; height: 100%; top: 10%; bottom: 0; background-color: #666; } @-webkit-keyframes bgLRextendAnime { 0% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(0); transform: scaleX(0); } 50% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(1); transform: scaleX(1); } 50.001% { -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform-origin: right; transform-origin: right; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes bgLRextendAnime { 0% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(0); transform: scaleX(0); } 50% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(1); transform: scaleX(1); } 50.001% { -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform-origin: right; transform-origin: right; -webkit-transform: scaleX(0); transform: scaleX(0); } } .bgappearTrigger, .bgLRextendTrigger { opacity: 0; } /* Floating animations */ .float-icon1 { -webkit-animation: floating1 3s ease-in-out infinite; animation: floating1 3s ease-in-out infinite; } .float-icon2 { -webkit-animation: floating2 4s ease-in-out infinite; animation: floating2 4s ease-in-out infinite; } .float-icon3 { -webkit-animation: floating3 5s ease-in-out infinite; animation: floating3 5s ease-in-out infinite; } @-webkit-keyframes floating1 { 0% { -webkit-transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -15px); } 100% { -webkit-transform: translate(0, 0px); } } @keyframes floating1 { 0% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -15px); transform: translate(0, -15px); } 100% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } } @-webkit-keyframes floating2 { 0% { -webkit-transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -25px); } 100% { -webkit-transform: translate(0, 0px); } } @keyframes floating2 { 0% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -25px); transform: translate(0, -25px); } 100% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } } @-webkit-keyframes floating3 { 0% { -webkit-transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -10px); } 100% { -webkit-transform: translate(0, 0px); } } @keyframes floating3 { 0% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } 50% { -webkit-transform: translate(0, -10px); transform: translate(0, -10px); } 100% { -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } } .blur { -webkit-animation-name: blurAnime; animation-name: blurAnime; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; } @-webkit-keyframes blurAnime { from { -webkit-filter: blur(10px); filter: blur(10px); -webkit-transform: scale(1.02); transform: scale(1.02); opacity: 0; } to { -webkit-filter: blur(0); filter: blur(0); -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes blurAnime { from { -webkit-filter: blur(10px); filter: blur(10px); -webkit-transform: scale(1.02); transform: scale(1.02); opacity: 0; } to { -webkit-filter: blur(0); filter: blur(0); -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } .zoom { -webkit-animation-name: zoomAnime, focusAnime; animation-name: zoomAnime, focusAnime; -webkit-animation-duration: 5.5s, 1s; animation-duration: 5.5s, 1s; /* ズームはゆっくり、ぼかしは短く */ -webkit-animation-timing-function: ease-out, ease-out; animation-timing-function: ease-out, ease-out; /* 両方スムーズに遷移 */ -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; background-size: 120%; /* 初期状態で少しズームしておく */ background-position: center; background-repeat: no-repeat; -webkit-filter: blur(10px); filter: blur(10px); /* 初期状態でぼやける */ } @-webkit-keyframes zoomAnime { 0% { background-size: 120%; /* 初期状態で背景画像を少し大きく */ } 100% { background-size: 100%; /* ズームが終わる時の背景画像サイズ */ } } @keyframes zoomAnime { 0% { background-size: 120%; /* 初期状態で背景画像を少し大きく */ } 100% { background-size: 100%; /* ズームが終わる時の背景画像サイズ */ } } @-webkit-keyframes focusAnime { 0% { -webkit-filter: blur(10px); filter: blur(10px); /* 初期状態でぼやけた状態 */ } 100% { -webkit-filter: blur(0); filter: blur(0); /* 鮮明な状態 */ } } @keyframes focusAnime { 0% { -webkit-filter: blur(10px); filter: blur(10px); /* 初期状態でぼやけた状態 */ } 100% { -webkit-filter: blur(0); filter: blur(0); /* 鮮明な状態 */ } } /* スクロールをしたら出現する要素にはじめに透過0を指定　*/ .blurTrigger, .flipRightTrigger { opacity: 0; } .delayScroll > * { opacity: 0; } .flipRight { -webkit-animation-name: flipRightAnime; animation-name: flipRightAnime; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-perspective-origin: right center; perspective-origin: right center; opacity: 0; } @-webkit-keyframes flipRightAnime { from { -webkit-transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg); transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg); opacity: 0; } to { -webkit-transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg); transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg); opacity: 1; } } @keyframes flipRightAnime { from { -webkit-transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg); transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg); opacity: 0; } to { -webkit-transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg); transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg); opacity: 1; } } .lineTrigger::before { content: ""; position: absolute; bottom: 0; height: 2px; background-color: var(--site-color); width: 0; } .lineTrigger.left::before { left: 0; -webkit-transform-origin: left; transform-origin: left; } .lineTrigger.right::before { right: 0; -webkit-transform-origin: right; transform-origin: right; } .lineTrigger.draw.left::before { -webkit-animation: draw-line-left 1s ease-in-out 0.5s forwards; animation: draw-line-left 1s ease-in-out 0.5s forwards; } .lineTrigger.draw.right::before { -webkit-animation: draw-line-right 1s ease-in-out 1s forwards; animation: draw-line-right 1s ease-in-out 1s forwards; } .lineTrigger.reset.left::before, .lineTrigger.reset.right::before { -webkit-animation: reset-line 1s ease-in-out forwards; animation: reset-line 1s ease-in-out forwards; } @-webkit-keyframes draw-line-left { from { width: 0; } to { width: 100%; } } @keyframes draw-line-left { from { width: 0; } to { width: 100%; } } @-webkit-keyframes draw-line-right { from { width: 0; } to { width: 100%; } } @keyframes draw-line-right { from { width: 0; } to { width: 100%; } } @-webkit-keyframes reset-line { from { width: 100%; } to { width: 0; } } @keyframes reset-line { from { width: 100%; } to { width: 0; } } body #page_top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-transition: opacity 0.5s, -webkit-transform 0.5s; transition: opacity 0.5s, -webkit-transform 0.5s; transition: opacity 0.5s, transform 0.5s; transition: opacity 0.5s, transform 0.5s, -webkit-transform 0.5s; position: fixed; right: 30px; bottom: 30px; opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); z-index: 99; } @media (min-width: 758px) and (max-width: 1024px) { body #page_top { right: 20px; bottom: 20px; } } @media (max-width: 757px) { body #page_top { right: 15px; bottom: 20px; } } body #page_top.LeftMove { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } body #page_top.LeftMove #web_reception .reception { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } body #page_top.LeftMove #phone_reception .reception { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } @-webkit-keyframes PageTopLeftAnime { from { opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes PageTopLeftAnime { from { opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); } to { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } body #page_top.RightMove { opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); } @-webkit-keyframes PageTopRightAnime { from { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } to { opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); } } @keyframes PageTopRightAnime { from { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } to { opacity: 0; -webkit-transform: translateX(300px); transform: translateX(300px); } } body #page_top .top { width: 60px; height: 60px; border-radius: 200px; background: var(--site-color); display: block; color: white; text-align: center; letter-spacing: 0.05em; line-height: 70px; text-decoration: none; -webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2), 0 0 2px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 3px 4px rgba(0, 0, 0, 0.2), 0 0 2px 0 rgba(0, 0, 0, 0.2); position: relative; font-weight: 200; font-size: 1.6rem; cursor: pointer; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } @media (min-width: 758px) and (max-width: 1024px) { body #page_top .top { width: 50px; height: 50px; line-height: 60px; } } @media (max-width: 757px) { body #page_top .top { width: 45px; height: 45px; line-height: 55px; } } body #page_top .top:before { content: ""; width: 16px; height: 16px; border: 0; border-top: solid 2px white; border-right: solid 2px white; position: absolute; top: 55%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); } @media (min-width: 758px) and (max-width: 1024px) { body #page_top .top:before { width: 14px; height: 14px; } } @media (max-width: 757px) { body #page_top .top:before { width: 12px; height: 12px; } } body #page_top .top:hover, body #page_top .top:active { background: var(--hover-color); -webkit-transform: translateY(-5px); transform: translateY(-5px); } body #page_top .reception { border-radius: 200px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: white; font-weight: 900; line-height: 60px; text-decoration: none; cursor: pointer; -webkit-transition: background 0.3s ease-in-out, -webkit-transform 0.4s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease-in-out, -webkit-transform 0.4s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease-in-out, transform 0.4s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease-in-out, transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), -webkit-transform 0.4s cubic-bezier(0.25, 1, 0.5, 1); position: relative; margin-bottom: 20px; -webkit-box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; font-size: 0.9em; line-height: 1.4; border: 1px solid #fff; } @media (min-width: 1330px) { body #page_top .reception { width: 230px; height: 70px; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #page_top .reception { width: 220px; height: 55px; } } @media (min-width: 758px) and (max-width: 1024px) { body #page_top .reception { width: 220px; height: 55px; } } @media (min-width: 758px) and (max-width: 1024px) and (max-width: 757px) { body #page_top .reception { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 758px) and (max-width: 1024px) { body #page_top .reception { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) and ((min-width: 1025px) and (max-width: 1329px)), (min-width: 758px) and (max-width: 1024px) and (max-height: 1080px) { body #page_top .reception { font-size: 1.6rem; } } @media (min-width: 758px) and (max-width: 1024px) and (min-width: 1330px) { body #page_top .reception { font-size: 1.6rem; } } @media (max-width: 757px) { body #page_top .reception { width: 110px; height: 40px; } } @media (max-width: 757px) and (max-width: 757px) { body #page_top .reception { font-size: 1.44rem; } } @media (max-width: 757px) and (min-width: 758px) and (max-width: 1024px) { body #page_top .reception { font-size: 1.44rem; } } @media (max-width: 757px) and ((min-width: 1025px) and (max-width: 1329px)), (max-width: 757px) and (max-height: 1080px) { body #page_top .reception { font-size: 1.6rem; } } @media (max-width: 757px) and (min-width: 1330px) { body #page_top .reception { font-size: 1.6rem; } } body #page_top .reception img { max-width: 20px; max-height: 30px; margin-right: 8px; } @media (min-width: 758px) and (max-width: 1024px) { body #page_top .reception img { max-width: 20px; max-height: 30px; } } @media (max-width: 757px) { body #page_top .reception img { max-width: 15px; max-height: 25px; } } body #page_top .reception:hover, body #page_top .reception:active { -webkit-transform: translateY(-5px) scale(1.05); transform: translateY(-5px) scale(1.05); -webkit-box-shadow: rgba(0, 0, 0, 0.45) 0px 8px 20px; box-shadow: rgba(0, 0, 0, 0.45) 0px 8px 20px; } body #page_top .reception::after { content: ""; width: 6px; height: 6px; border: 0; border-top: solid 2px white; border-right: solid 2px white; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 0; right: 15px; bottom: 0; margin: auto; margin-left: 10px; -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } @media (min-width: 758px) and (max-width: 1024px) { body #page_top .reception::after { right: 12px; margin-left: 6px; } } @media (max-width: 757px) { body #page_top .reception::after { margin-left: 5px; } } body #page_top .reception:hover::after { -webkit-transform: translateX(5px) rotate(45deg) scale(1.2); transform: translateX(5px) rotate(45deg) scale(1.2); } body #page_top #first_reception { display: none; } @media (max-width: 757px) { body #page_top #first_reception { display: none; } } body #page_top #first_reception span.reception { background: var(--sub-color); -webkit-transition: background 0.3s ease, -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; transition: background 0.3s ease, -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease; transition: background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease, -webkit-box-shadow 0.3s ease, -webkit-transform 0.3s ease; } body #page_top #first_reception span.reception:hover { background: var(--site-color); } body #page_top #second_reception { display: none; } @media (max-width: 757px) { body #page_top #second_reception { display: none; } } body #page_top #second_reception span.reception { background: -webkit-gradient(linear, left top, right top, from(#fd6a00), color-stop(98.48%, #f8478f)); background: linear-gradient(90deg, #fd6a00 0%, #f8478f 98.48%); -webkit-transition: background 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease, -webkit-transform 0.3s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease, transform 0.3s cubic-bezier(0.25, 1, 0.5, 1); transition: background 0.3s ease, transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), -webkit-transform 0.3s cubic-bezier(0.25, 1, 0.5, 1); } body #page_top #second_reception span.reception:hover { background: -webkit-gradient(linear, left top, right top, from(#ff8000), color-stop(98.48%, #ff4da6)); background: linear-gradient(90deg, #ff8000 0%, #ff4da6 98.48%); } body #contact form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; max-width: 80%; margin: 0 auto; } @media (max-width: 757px) { body #contact form { max-width: 100%; } } body #contact input::-webkit-input-placeholder, body #contact textarea::-webkit-input-placeholder { color: #bbb; opacity: 0.8; } body #contact input::-moz-placeholder, body #contact textarea::-moz-placeholder { color: #bbb; opacity: 0.8; } body #contact input:-ms-input-placeholder, body #contact textarea:-ms-input-placeholder { color: #bbb; opacity: 0.8; } body #contact input::-ms-input-placeholder, body #contact textarea::-ms-input-placeholder { color: #bbb; opacity: 0.8; } body #contact input::placeholder, body #contact textarea::placeholder { color: #bbb; opacity: 0.8; } body #contact label { text-align: left; margin-bottom: 20px; } body #contact label:not(.checkbox-group label):not(.wpcf7-checkbox label) { margin-top: 2em; line-height: 1; } body #contact label:not(.checkbox-group label):not(.wpcf7-checkbox label):first-child { margin-top: 0; } body #contact input[type=text], body #contact input[type=email], body #contact textarea { text-align: left; padding: 10px; margin-bottom: 15px; border: 1px solid #ccc; background: white; color: var(--black); border-radius: 5px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } body #contact .checkbox-group, body #contact .wpcf7-checkbox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: left; margin-bottom: 15px; border: 2px solid white; border-radius: 5px; padding: 40px; } body #contact .checkbox-group label, body #contact .wpcf7-checkbox label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; } body #contact input[type=checkbox] { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; width: 16px; height: 16px; margin-right: 8px; } body #contact .wpcf7 .wpcf7-response-output { display: none; opacity: 0; visibility: hidden; -webkit-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition: opacity 0.8s ease, -webkit-transform 0.8s ease; transition: opacity 0.8s ease, -webkit-transform 0.8s ease; transition: opacity 0.8s ease, transform 0.8s ease; transition: opacity 0.8s ease, transform 0.8s ease, -webkit-transform 0.8s ease; position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: rgba(0, 0, 0, 0.8); z-index: 1000; text-align: center; } body #contact .wpcf7 .wpcf7-form.invalid .wpcf7-response-output { padding: 10px 15px; border-radius: 15px; font-weight: 600; } @media (max-width: 757px) { body #contact .wpcf7 .wpcf7-form.invalid .wpcf7-response-output { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #contact .wpcf7 .wpcf7-form.invalid .wpcf7-response-output { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #contact .wpcf7 .wpcf7-form.invalid .wpcf7-response-output { font-size: 1.6rem; } } @media (min-width: 1330px) { body #contact .wpcf7 .wpcf7-form.invalid .wpcf7-response-output { font-size: 1.6rem; } } body #contact .wpcf7 .wpcf7-form .wpcf7-response-output .message-box { background: white; border-radius: 15px; padding: 20px; -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); text-align: center; max-width: 80%; } @media (max-width: 757px) { body #contact .wpcf7 .wpcf7-form .wpcf7-response-output .message-box { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body #contact .wpcf7 .wpcf7-form .wpcf7-response-output .message-box { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body #contact .wpcf7 .wpcf7-form .wpcf7-response-output .message-box { font-size: 1.6rem; } } @media (min-width: 1330px) { body #contact .wpcf7 .wpcf7-form .wpcf7-response-output .message-box { font-size: 1.6rem; } } body #contact .wpcf7 form.sent .wpcf7-response-output { display: -webkit-box; display: -ms-flexbox; display: flex; opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); border: none; padding: 0; margin: 0; color: white; font-weight: 600; } body .cta-service { background-color: white; padding: 60px 20px; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 30px 0; border-radius: 20px; -webkit-box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1); border: 1px solid #e0e0e0; background: linear-gradient(135deg, #64c3eb 0%, #043c9d 100%); } @media (max-width: 757px) { body .cta-service { margin: 30px 0 10px; } } body .cta-service p { font-weight: 700; line-height: 1.6; color: white; margin-bottom: 30px; text-shadow: 1px 1px 5px rgba(0, 4, 59, 0.6); } @media (max-width: 757px) { body .cta-service p { font-size: 1.54rem; } } @media (min-width: 758px) and (max-width: 1024px) { body .cta-service p { font-size: 1.87rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body .cta-service p { font-size: 2.2rem; } } @media (min-width: 1330px) { body .cta-service p { font-size: 2.2rem; } } body .cta-service .cta-button { background-color: #ffdd00; color: var(--site-color); font-weight: bold; } body .cta-button { position: relative; white-space: nowrap; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: var(--site-color); color: white; text-decoration: none; font-weight: 900; font-size: 1.8rem; padding: 1rem 3rem; -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; border-radius: 200px; -webkit-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; } @media (max-width: 757px) { body .cta-button { font-size: 1.6rem; } } body .cta-button:hover { background-color: var(--hover-color); -webkit-transform: scale(1.05); transform: scale(1.05); } body .cta-button:hover::after { -webkit-transform: translateX(5px) rotate(45deg); transform: translateX(5px) rotate(45deg); -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } body .cta-button svg { width: 35px; height: auto; margin-left: 0.6rem; -webkit-transition: margin-left 0.3s ease; transition: margin-left 0.3s ease; } @media (max-width: 757px) { body .cta-button svg { width: 30px; } } body a.story-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; border-radius: 10px; padding: 2rem; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; background-color: #fff; -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; -webkit-transition: background-color 0.5s ease, -webkit-box-shadow 0.5s ease; transition: background-color 0.5s ease, -webkit-box-shadow 0.5s ease; transition: box-shadow 0.5s ease, background-color 0.5s ease; transition: box-shadow 0.5s ease, background-color 0.5s ease, -webkit-box-shadow 0.5s ease; -webkit-transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease, -webkit-transform 0.3s ease, -webkit-box-shadow 0.3s ease; } body a.story-item .story-content { -webkit-transition: -webkit-transform 0.5s ease, -webkit-box-shadow 0.5s ease; transition: -webkit-transform 0.5s ease, -webkit-box-shadow 0.5s ease; transition: transform 0.5s ease, box-shadow 0.5s ease; transition: transform 0.5s ease, box-shadow 0.5s ease, -webkit-transform 0.5s ease, -webkit-box-shadow 0.5s ease; } body a.story-item:hover { -webkit-transform: scale(1.02); transform: scale(1.02); -webkit-box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; background-color: #fff; } body a.story-item:hover .story-image img { opacity: 0.8; } body a.story-item:hover .arrow-link span { color: var(--hover-color); -webkit-transform: translateX(5px); transform: translateX(5px); } body a.story-item:hover .arrow-link span:before { background-color: var(--hover-color); -webkit-transform: translateY(-50%); transform: translateY(-50%); } body a.story-item .story-image { position: relative; } body a.story-item .story-image img { width: 100%; aspect-ratio: 4/3; -o-object-fit: cover; object-fit: cover; border-radius: 5px; margin-bottom: 1rem; -webkit-transition: opacity 0.5s ease; transition: opacity 0.5s ease; } body a.story-item h3 { color: var(--site-color); font-weight: bold; margin: 2rem 0 1rem; text-align: left; -webkit-transition: color 0.5s ease; transition: color 0.5s ease; } @media (max-width: 757px) { body a.story-item h3 { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body a.story-item h3 { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body a.story-item h3 { font-size: 1.8rem; } } @media (min-width: 1330px) { body a.story-item h3 { font-size: 1.8rem; } } body a.story-item p { text-align: left; margin-bottom: 2.5rem; -webkit-transition: color 0.5s ease; transition: color 0.5s ease; } @media (max-width: 757px) { body a.story-item p { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body a.story-item p { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body a.story-item p { font-size: 1.6rem; } } @media (min-width: 1330px) { body a.story-item p { font-size: 1.6rem; } } body .pick-up { position: absolute; display: inline-block; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; top: -30px; left: -30px; padding: 8px 16px; border: 2px solid var(--site-color); background: white; color: var(--site-color); -webkit-transition: background-color 0.3s ease, color 0.3s ease; transition: background-color 0.3s ease, color 0.3s ease; } @media (max-width: 757px) { body .pick-up { left: -10px; } } body .pick-up::after { content: ""; position: absolute; top: calc(100% + 5px); left: 50%; width: 30px; height: 2px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: var(--site-color); rotate: 50deg; -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; } body .arrow-link { text-align: right; padding-right: 20px; } body .arrow-link span { color: var(--site-color); padding-right: 0.5rem; font-weight: bold; text-decoration: none; position: relative; display: inline-block; -webkit-transition: color 0.3s ease, -webkit-transform 0.3s ease; transition: color 0.3s ease, -webkit-transform 0.3s ease; transition: color 0.3s ease, transform 0.3s ease; transition: color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; } @media (max-width: 757px) { body .arrow-link span { font-size: 1.44rem; } } @media (min-width: 758px) and (max-width: 1024px) { body .arrow-link span { font-size: 1.44rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body .arrow-link span { font-size: 1.6rem; } } @media (min-width: 1330px) { body .arrow-link span { font-size: 1.6rem; } } body .arrow-link span:before { content: ""; position: absolute; top: 50%; right: -20px; width: 20px; height: 20px; background-color: var(--site-color); border-radius: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); z-index: 0; background-size: 10px; background-image: url("../img/object/arrow.svg"); background-repeat: no-repeat; background-position: center; -webkit-transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, -webkit-transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease; transition: background-color 0.3s ease, transform 0.3s ease, -webkit-transform 0.3s ease; } body .breadcrumbs { width: 100%; padding: 1.2rem 0; color: var(--gray); background: none; margin-bottom: 2rem; } @media (max-width: 757px) { body .breadcrumbs { font-size: 1.26rem; } } @media (min-width: 758px) and (max-width: 1024px) { body .breadcrumbs { font-size: 1.26rem; } } @media ((min-width: 1025px) and (max-width: 1329px)), (max-height: 1080px) { body .breadcrumbs { font-size: 1.4rem; } } @media (min-width: 1330px) { body .breadcrumbs { font-size: 1.4rem; } } @media (min-width: 758px) and (max-width: 1024px) { body .breadcrumbs { margin-bottom: 1rem; } } @media (max-width: 757px) { body .breadcrumbs { margin-bottom: 1rem; } } body .breadcrumbs ol { list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 0.5em; margin: 0; padding: 0; } body .breadcrumbs li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } body .breadcrumbs li + li:before { content: ">"; display: inline-block; color: var(--gray); margin: 0 0.5em; font-size: 0.9em; } body .breadcrumbs a { color: var(--gray); text-decoration: underline; -webkit-transition: color 0.3s; transition: color 0.3s; } body .breadcrumbs a:hover, body .breadcrumbs a:focus { color: var(--hover-color); text-decoration: underline; } body .breadcrumbs .current { color: var(--gray); font-weight: bold; pointer-events: none; cursor: default; } @media (max-width: 757px) { body .breadcrumbs { font-size: 13px; padding: 0.7rem 0; } body .breadcrumbs ol { gap: 0.3em; } body .breadcrumbs li + li:before { margin: 0 0.3em; } } .no-elementor-styles { margin: 0 !important; padding: 0 !important; background: transparent !important; border: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } body.elementor-page .elementor-page-wrapper { width: 100%; max-width: 100%; padding: 0; margin: 0; } body.elementor-page .elementor-page-wrapper .elementor-section-wrap { margin: 0; padding: 0; } body.elementor-page .elementor-page-wrapper .elementor-section { padding-left: 0; padding-right: 0; } body.elementor-page .elementor-widget:not(:last-child) { margin-bottom: 0; } html body .container.md { max-width: 999.6px; } html body .container.sm { max-width: 800.4px; } html body .container.xs { max-width: 620px; } html body .mt-0 { margin-top: 0em; } html body .mb-0 { margin-bottom: 0em; } html body .ml-0 { margin-left: 0em; } html body .mr-0 { margin-right: 0em; } html body .m-0 { margin: 0em; } html body .pt-0 { padding-top: 0em; } html body .pb-0 { padding-bottom: 0em; } html body .pl-0 { padding-left: 0em; } html body .pr-0 { padding-right: 0em; } html body .p-0 { padding: 0em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-0 { margin-top: 0em; } html body .mb-0 { margin-bottom: 0em; } html body .ml-0 { margin-left: 0em; } html body .mr-0 { margin-right: 0em; } html body .m-0 { margin: 0em; } html body .pt-0 { padding-top: 0em; } html body .pb-0 { padding-bottom: 0em; } html body .pl-0 { padding-left: 0em; } html body .pr-0 { padding-right: 0em; } html body .p-0 { padding: 0em; } } @media (max-width: 757px) { html body .mt-0 { margin-top: 0em; } html body .mb-0 { margin-bottom: 0em; } html body .ml-0 { margin-left: 0em; } html body .mr-0 { margin-right: 0em; } html body .m-0 { margin: 0em; } html body .pt-0 { padding-top: 0em; } html body .pb-0 { padding-bottom: 0em; } html body .pl-0 { padding-left: 0em; } html body .pr-0 { padding-right: 0em; } html body .p-0 { padding: 0em; } } html body .mt-1 { margin-top: 1em; } html body .mb-1 { margin-bottom: 1em; } html body .ml-1 { margin-left: 1em; } html body .mr-1 { margin-right: 1em; } html body .m-1 { margin: 1em; } html body .pt-1 { padding-top: 1em; } html body .pb-1 { padding-bottom: 1em; } html body .pl-1 { padding-left: 1em; } html body .pr-1 { padding-right: 1em; } html body .p-1 { padding: 1em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-1 { margin-top: 0.7em; } html body .mb-1 { margin-bottom: 0.7em; } html body .ml-1 { margin-left: 0.7em; } html body .mr-1 { margin-right: 0.7em; } html body .m-1 { margin: 0.7em; } html body .pt-1 { padding-top: 0.7em; } html body .pb-1 { padding-bottom: 0.7em; } html body .pl-1 { padding-left: 0.7em; } html body .pr-1 { padding-right: 0.7em; } html body .p-1 { padding: 0.7em; } } @media (max-width: 757px) { html body .mt-1 { margin-top: 0.5em; } html body .mb-1 { margin-bottom: 0.5em; } html body .ml-1 { margin-left: 0.5em; } html body .mr-1 { margin-right: 0.5em; } html body .m-1 { margin: 0.5em; } html body .pt-1 { padding-top: 0.5em; } html body .pb-1 { padding-bottom: 0.5em; } html body .pl-1 { padding-left: 0.5em; } html body .pr-1 { padding-right: 0.5em; } html body .p-1 { padding: 0.5em; } } html body .mt-2 { margin-top: 2em; } html body .mb-2 { margin-bottom: 2em; } html body .ml-2 { margin-left: 2em; } html body .mr-2 { margin-right: 2em; } html body .m-2 { margin: 2em; } html body .pt-2 { padding-top: 2em; } html body .pb-2 { padding-bottom: 2em; } html body .pl-2 { padding-left: 2em; } html body .pr-2 { padding-right: 2em; } html body .p-2 { padding: 2em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-2 { margin-top: 1.4em; } html body .mb-2 { margin-bottom: 1.4em; } html body .ml-2 { margin-left: 1.4em; } html body .mr-2 { margin-right: 1.4em; } html body .m-2 { margin: 1.4em; } html body .pt-2 { padding-top: 1.4em; } html body .pb-2 { padding-bottom: 1.4em; } html body .pl-2 { padding-left: 1.4em; } html body .pr-2 { padding-right: 1.4em; } html body .p-2 { padding: 1.4em; } } @media (max-width: 757px) { html body .mt-2 { margin-top: 1em; } html body .mb-2 { margin-bottom: 1em; } html body .ml-2 { margin-left: 1em; } html body .mr-2 { margin-right: 1em; } html body .m-2 { margin: 1em; } html body .pt-2 { padding-top: 1em; } html body .pb-2 { padding-bottom: 1em; } html body .pl-2 { padding-left: 1em; } html body .pr-2 { padding-right: 1em; } html body .p-2 { padding: 1em; } } html body .mt-3 { margin-top: 3em; } html body .mb-3 { margin-bottom: 3em; } html body .ml-3 { margin-left: 3em; } html body .mr-3 { margin-right: 3em; } html body .m-3 { margin: 3em; } html body .pt-3 { padding-top: 3em; } html body .pb-3 { padding-bottom: 3em; } html body .pl-3 { padding-left: 3em; } html body .pr-3 { padding-right: 3em; } html body .p-3 { padding: 3em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-3 { margin-top: 2.1em; } html body .mb-3 { margin-bottom: 2.1em; } html body .ml-3 { margin-left: 2.1em; } html body .mr-3 { margin-right: 2.1em; } html body .m-3 { margin: 2.1em; } html body .pt-3 { padding-top: 2.1em; } html body .pb-3 { padding-bottom: 2.1em; } html body .pl-3 { padding-left: 2.1em; } html body .pr-3 { padding-right: 2.1em; } html body .p-3 { padding: 2.1em; } } @media (max-width: 757px) { html body .mt-3 { margin-top: 1.5em; } html body .mb-3 { margin-bottom: 1.5em; } html body .ml-3 { margin-left: 1.5em; } html body .mr-3 { margin-right: 1.5em; } html body .m-3 { margin: 1.5em; } html body .pt-3 { padding-top: 1.5em; } html body .pb-3 { padding-bottom: 1.5em; } html body .pl-3 { padding-left: 1.5em; } html body .pr-3 { padding-right: 1.5em; } html body .p-3 { padding: 1.5em; } } html body .mt-4 { margin-top: 4em; } html body .mb-4 { margin-bottom: 4em; } html body .ml-4 { margin-left: 4em; } html body .mr-4 { margin-right: 4em; } html body .m-4 { margin: 4em; } html body .pt-4 { padding-top: 4em; } html body .pb-4 { padding-bottom: 4em; } html body .pl-4 { padding-left: 4em; } html body .pr-4 { padding-right: 4em; } html body .p-4 { padding: 4em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-4 { margin-top: 2.8em; } html body .mb-4 { margin-bottom: 2.8em; } html body .ml-4 { margin-left: 2.8em; } html body .mr-4 { margin-right: 2.8em; } html body .m-4 { margin: 2.8em; } html body .pt-4 { padding-top: 2.8em; } html body .pb-4 { padding-bottom: 2.8em; } html body .pl-4 { padding-left: 2.8em; } html body .pr-4 { padding-right: 2.8em; } html body .p-4 { padding: 2.8em; } } @media (max-width: 757px) { html body .mt-4 { margin-top: 2em; } html body .mb-4 { margin-bottom: 2em; } html body .ml-4 { margin-left: 2em; } html body .mr-4 { margin-right: 2em; } html body .m-4 { margin: 2em; } html body .pt-4 { padding-top: 2em; } html body .pb-4 { padding-bottom: 2em; } html body .pl-4 { padding-left: 2em; } html body .pr-4 { padding-right: 2em; } html body .p-4 { padding: 2em; } } html body .mt-5 { margin-top: 5em; } html body .mb-5 { margin-bottom: 5em; } html body .ml-5 { margin-left: 5em; } html body .mr-5 { margin-right: 5em; } html body .m-5 { margin: 5em; } html body .pt-5 { padding-top: 5em; } html body .pb-5 { padding-bottom: 5em; } html body .pl-5 { padding-left: 5em; } html body .pr-5 { padding-right: 5em; } html body .p-5 { padding: 5em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-5 { margin-top: 3.5em; } html body .mb-5 { margin-bottom: 3.5em; } html body .ml-5 { margin-left: 3.5em; } html body .mr-5 { margin-right: 3.5em; } html body .m-5 { margin: 3.5em; } html body .pt-5 { padding-top: 3.5em; } html body .pb-5 { padding-bottom: 3.5em; } html body .pl-5 { padding-left: 3.5em; } html body .pr-5 { padding-right: 3.5em; } html body .p-5 { padding: 3.5em; } } @media (max-width: 757px) { html body .mt-5 { margin-top: 2.5em; } html body .mb-5 { margin-bottom: 2.5em; } html body .ml-5 { margin-left: 2.5em; } html body .mr-5 { margin-right: 2.5em; } html body .m-5 { margin: 2.5em; } html body .pt-5 { padding-top: 2.5em; } html body .pb-5 { padding-bottom: 2.5em; } html body .pl-5 { padding-left: 2.5em; } html body .pr-5 { padding-right: 2.5em; } html body .p-5 { padding: 2.5em; } } html body .mt-6 { margin-top: 6em; } html body .mb-6 { margin-bottom: 6em; } html body .ml-6 { margin-left: 6em; } html body .mr-6 { margin-right: 6em; } html body .m-6 { margin: 6em; } html body .pt-6 { padding-top: 6em; } html body .pb-6 { padding-bottom: 6em; } html body .pl-6 { padding-left: 6em; } html body .pr-6 { padding-right: 6em; } html body .p-6 { padding: 6em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-6 { margin-top: 4.2em; } html body .mb-6 { margin-bottom: 4.2em; } html body .ml-6 { margin-left: 4.2em; } html body .mr-6 { margin-right: 4.2em; } html body .m-6 { margin: 4.2em; } html body .pt-6 { padding-top: 4.2em; } html body .pb-6 { padding-bottom: 4.2em; } html body .pl-6 { padding-left: 4.2em; } html body .pr-6 { padding-right: 4.2em; } html body .p-6 { padding: 4.2em; } } @media (max-width: 757px) { html body .mt-6 { margin-top: 3em; } html body .mb-6 { margin-bottom: 3em; } html body .ml-6 { margin-left: 3em; } html body .mr-6 { margin-right: 3em; } html body .m-6 { margin: 3em; } html body .pt-6 { padding-top: 3em; } html body .pb-6 { padding-bottom: 3em; } html body .pl-6 { padding-left: 3em; } html body .pr-6 { padding-right: 3em; } html body .p-6 { padding: 3em; } } html body .mt-7 { margin-top: 7em; } html body .mb-7 { margin-bottom: 7em; } html body .ml-7 { margin-left: 7em; } html body .mr-7 { margin-right: 7em; } html body .m-7 { margin: 7em; } html body .pt-7 { padding-top: 7em; } html body .pb-7 { padding-bottom: 7em; } html body .pl-7 { padding-left: 7em; } html body .pr-7 { padding-right: 7em; } html body .p-7 { padding: 7em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-7 { margin-top: 4.9em; } html body .mb-7 { margin-bottom: 4.9em; } html body .ml-7 { margin-left: 4.9em; } html body .mr-7 { margin-right: 4.9em; } html body .m-7 { margin: 4.9em; } html body .pt-7 { padding-top: 4.9em; } html body .pb-7 { padding-bottom: 4.9em; } html body .pl-7 { padding-left: 4.9em; } html body .pr-7 { padding-right: 4.9em; } html body .p-7 { padding: 4.9em; } } @media (max-width: 757px) { html body .mt-7 { margin-top: 3.5em; } html body .mb-7 { margin-bottom: 3.5em; } html body .ml-7 { margin-left: 3.5em; } html body .mr-7 { margin-right: 3.5em; } html body .m-7 { margin: 3.5em; } html body .pt-7 { padding-top: 3.5em; } html body .pb-7 { padding-bottom: 3.5em; } html body .pl-7 { padding-left: 3.5em; } html body .pr-7 { padding-right: 3.5em; } html body .p-7 { padding: 3.5em; } } html body .mt-8 { margin-top: 8em; } html body .mb-8 { margin-bottom: 8em; } html body .ml-8 { margin-left: 8em; } html body .mr-8 { margin-right: 8em; } html body .m-8 { margin: 8em; } html body .pt-8 { padding-top: 8em; } html body .pb-8 { padding-bottom: 8em; } html body .pl-8 { padding-left: 8em; } html body .pr-8 { padding-right: 8em; } html body .p-8 { padding: 8em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-8 { margin-top: 5.6em; } html body .mb-8 { margin-bottom: 5.6em; } html body .ml-8 { margin-left: 5.6em; } html body .mr-8 { margin-right: 5.6em; } html body .m-8 { margin: 5.6em; } html body .pt-8 { padding-top: 5.6em; } html body .pb-8 { padding-bottom: 5.6em; } html body .pl-8 { padding-left: 5.6em; } html body .pr-8 { padding-right: 5.6em; } html body .p-8 { padding: 5.6em; } } @media (max-width: 757px) { html body .mt-8 { margin-top: 4em; } html body .mb-8 { margin-bottom: 4em; } html body .ml-8 { margin-left: 4em; } html body .mr-8 { margin-right: 4em; } html body .m-8 { margin: 4em; } html body .pt-8 { padding-top: 4em; } html body .pb-8 { padding-bottom: 4em; } html body .pl-8 { padding-left: 4em; } html body .pr-8 { padding-right: 4em; } html body .p-8 { padding: 4em; } } html body .mt-9 { margin-top: 9em; } html body .mb-9 { margin-bottom: 9em; } html body .ml-9 { margin-left: 9em; } html body .mr-9 { margin-right: 9em; } html body .m-9 { margin: 9em; } html body .pt-9 { padding-top: 9em; } html body .pb-9 { padding-bottom: 9em; } html body .pl-9 { padding-left: 9em; } html body .pr-9 { padding-right: 9em; } html body .p-9 { padding: 9em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-9 { margin-top: 6.3em; } html body .mb-9 { margin-bottom: 6.3em; } html body .ml-9 { margin-left: 6.3em; } html body .mr-9 { margin-right: 6.3em; } html body .m-9 { margin: 6.3em; } html body .pt-9 { padding-top: 6.3em; } html body .pb-9 { padding-bottom: 6.3em; } html body .pl-9 { padding-left: 6.3em; } html body .pr-9 { padding-right: 6.3em; } html body .p-9 { padding: 6.3em; } } @media (max-width: 757px) { html body .mt-9 { margin-top: 4.5em; } html body .mb-9 { margin-bottom: 4.5em; } html body .ml-9 { margin-left: 4.5em; } html body .mr-9 { margin-right: 4.5em; } html body .m-9 { margin: 4.5em; } html body .pt-9 { padding-top: 4.5em; } html body .pb-9 { padding-bottom: 4.5em; } html body .pl-9 { padding-left: 4.5em; } html body .pr-9 { padding-right: 4.5em; } html body .p-9 { padding: 4.5em; } } html body .mt-10 { margin-top: 10em; } html body .mb-10 { margin-bottom: 10em; } html body .ml-10 { margin-left: 10em; } html body .mr-10 { margin-right: 10em; } html body .m-10 { margin: 10em; } html body .pt-10 { padding-top: 10em; } html body .pb-10 { padding-bottom: 10em; } html body .pl-10 { padding-left: 10em; } html body .pr-10 { padding-right: 10em; } html body .p-10 { padding: 10em; } @media (min-width: 758px) and (max-width: 1024px) { html body .mt-10 { margin-top: 7em; } html body .mb-10 { margin-bottom: 7em; } html body .ml-10 { margin-left: 7em; } html body .mr-10 { margin-right: 7em; } html body .m-10 { margin: 7em; } html body .pt-10 { padding-top: 7em; } html body .pb-10 { padding-bottom: 7em; } html body .pl-10 { padding-left: 7em; } html body .pr-10 { padding-right: 7em; } html body .p-10 { padding: 7em; } } @media (max-width: 757px) { html body .mt-10 { margin-top: 5em; } html body .mb-10 { margin-bottom: 5em; } html body .ml-10 { margin-left: 5em; } html body .mr-10 { margin-right: 5em; } html body .m-10 { margin: 5em; } html body .pt-10 { padding-top: 5em; } html body .pb-10 { padding-bottom: 5em; } html body .pl-10 { padding-left: 5em; } html body .pr-10 { padding-right: 5em; } html body .p-10 { padding: 5em; } }/*# sourceMappingURL=child-styles.css.map */