@charset "UTF-8"; /* Normalize.css ======================================================== */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } main { display: block; } h1 { font-size: 2em; margin: 0.67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: 0.35em 0.75em 0.625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } /* Soft reset */ figure { margin: 0; } ul, ol, dd { margin: 0; padding: 0; list-style: none; } h1, h2 h3, h4, h5, h6 { margin: 0; font-size: inherit; font-weight: inherit; } p { margin: 0; } /* Colorbox ======================================================== */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);} #cboxWrapper {max-width:none;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} #colorbox{outline:0;} #cboxTopLeft{width:21px; height:21px;} #cboxTopRight{width:21px; height:21px;} #cboxBottomLeft{width:21px; height:21px;} #cboxBottomRight{width:21px; height:21px;} #cboxMiddleLeft{width:21px;} #cboxMiddleRight{width:21px;} #cboxTopCenter{height:21px;} #cboxBottomCenter{height:21px; } #cboxContent{background:#fff; overflow:hidden;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:28px;} #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;} #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;} #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; } #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;} #cboxPrevious{position:absolute; bottom:0; left:0; width:25px; height:25px; text-indent:-9999px;} #cboxPrevious:hover{background-position:-75px -25px;} #cboxNext{position:absolute; bottom:0; left:27px; width:25px; height:25px; text-indent:-9999px;} #cboxNext:hover{background-position:-50px -25px;} #cboxClose{position:absolute; bottom:0; right:0; width:25px; height:25px; text-indent:-9999px;} #cboxClose:hover{background-position:-25px -25px;} .cboxIE #cboxTopLeft, .cboxIE #cboxTopCenter, .cboxIE #cboxTopRight, .cboxIE #cboxBottomLeft, .cboxIE #cboxBottomCenter, .cboxIE #cboxBottomRight, .cboxIE #cboxMiddleLeft, .cboxIE #cboxMiddleRight {filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);} @media screen and (max-width: 600px) { #cboxOverlay{ background: #000; opacity: 0.8 !important; } } /* Slick ======================================================== */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 12vw; height: 12vw; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } .slick-prev:before, .slick-next:before { font-family: 'slick'; font-size: 20px; line-height: 1; opacity: 1; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: -25px; } [dir='rtl'] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: '←'; } [dir='rtl'] .slick-prev:before { content: '→'; } .slick-next { right: -25px; } [dir='rtl'] .slick-next { right: auto; left: -25px; } .slick-next:before { content: '→'; } [dir='rtl'] .slick-next:before { content: '←'; } .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -2vw; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li { background: none !important; border: none !important; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { color: #917b00; opacity: 0.7; } .slick-dots li button:before { font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 1.5rem; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '\f111'; text-align: center; opacity: 1; color: #b6b6b6; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { opacity: 1; color: #000; } .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slider .slick-arrow { width: 1.75vw; height: auto; position: absolute; z-index: 1; top: 47%; opacity: 0.5; } .slider .slick-arrow:hover { opacity: 1; cursor: pointer; } .slider .prev-arrow { left: 0; } .slider .next-arrow { right: 0; } @media only screen and (min-width:600px) and (max-width:1200px) { .slick-dotted.slick-slider { margin-bottom: 2.5vw; } .slick-dots li { margin: 0 0.41vw; width: 1.7vw; height: 1.7vw; } .slick-dots li button:before { font-size: 1.25vw; width: 1.7vw; height: 1.7vw; } } @media screen and (max-width: 600px) { } /* Lite YouTube Embed ======================================================== */ lite-youtube { background-color: #000; position: relative; display: block; contain: content; background-position: center center; background-size: cover; cursor: pointer; max-width: 720px; } /* gradient */ lite-youtube::before { content: attr(data-title); display: block; position: absolute; top: 0; /* Pixel-perfect port of YT's gradient PNG, using https://github.com/bluesmoon/pngtocss plus optimizations */ background-image: linear-gradient(180deg, rgb(0 0 0 / 67%) 0%, rgb(0 0 0 / 54%) 14%, rgb(0 0 0 / 15%) 54%, rgb(0 0 0 / 5%) 72%, rgb(0 0 0 / 0%) 94%); height: 99px; width: 100%; font-family: "YouTube Noto",Roboto,Arial,Helvetica,sans-serif; color: hsl(0deg 0% 93.33%); text-shadow: 0 0 2px rgba(0,0,0,.5); font-size: 18px; padding: 25px 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; box-sizing: border-box; } lite-youtube:hover::before { color: white; } /* responsive iframe with a 16:9 aspect ratio thanks https://css-tricks.com/responsive-iframes/ */ lite-youtube::after { content: ""; display: block; padding-bottom: calc(100% / (16 / 9)); } lite-youtube > iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; border: 0; } /* play button */ lite-youtube > .lty-playbtn { display: block; /* Make the button element cover the whole area for a large hover/click target… */ width: 100%; height: 100%; /* …but visually it's still the same size */ background: no-repeat center/68px 48px; /* YT's actual play button svg */ background-image: url('data:image/svg+xml;utf8,'); position: absolute; cursor: pointer; z-index: 1; filter: grayscale(100%); transition: filter .1s cubic-bezier(0, 0, 0.2, 1); border: 0; } lite-youtube:hover > .lty-playbtn, lite-youtube .lty-playbtn:focus { filter: none; } /* Post-click styles */ lite-youtube.lyt-activated { cursor: unset; } lite-youtube.lyt-activated::before, lite-youtube.lyt-activated > .lty-playbtn { opacity: 0; pointer-events: none; } .lyt-visually-hidden { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } /* Common ======================================================== */ html { font-size: 62.5%; } body { font-family: "M PLUS Rounded 1c", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica, sans-serif; font-optical-sizing: auto; font-style: normal; font-size: 1.6rem; /* 16px */ letter-spacing: 0.05em; overflow-x: hidden; position: relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a, .mce-content-body a { text-decoration: underline; } a:hover { cursor: pointer; text-decoration: none; opacity: 0.7; } #toc_container { } #toc_container a, #ez-toc-container a { font-weight: 400; } #toc_container a:visited, #ez-toc-container a:visited { font-weight: 400; } p, .mce-content-body p { font-size: 1.6rem; line-height: 1.6; } p small, .mce-content-body p small { display: inline-block; line-height: 1.5; } header, main section, main div { gap: 0; } /* Heading */ main h2, section h2, .mce-content-body h2 { clear: both; margin: 0 auto 3rem; padding: 10px 2%; width: 96%; color: #fff; font-size: 2.7rem; font-weight: 700; line-height: 1.3; text-align: left; } main h3, .mce-content-body h3 { clear: both; margin: 3rem auto 3rem; padding: 12px 1%; width: 98%; font-size: 2.3rem; font-weight: 700; line-height: 1.3; text-align: left; border-bottom-width: 2px; border-bottom-style: solid; } main h4, .mce-content-body h4 { clear: both; margin: 3rem auto 3rem; padding: 8px 1% 8px 0; width: 99%; font-size: 2.2rem; font-weight: 700; line-height: 1.3; border-bottom-width: 2px; border-bottom-style: solid; } main h5, .mce-content-body h5 { clear: both; margin: 3rem auto 3rem; padding: 5px 1%; width: 98%; font-size: 2.0rem; font-weight: 700; line-height: 1.3; border-left-width: 5px; border-left-style: solid; } main h6, .mce-content-body h6 { clear: both; margin: 3rem auto 3rem; padding: 14px 1%; width: 98%; font-size: 1.6rem; font-weight: 400; line-height: 1.3; } .Body__Page ul li, .Body__Single ul li, .mce-content-body ul li { list-style: disc; margin-left: 2rem; font-size: 1.6rem; line-height: 1.5; } #toc_container { margin-bottom: 50px; } @media only screen and (min-width:600px) and (max-width:1200px) { main h2 { margin: 0 auto 2.5vw; padding: 0.83vw 2%; font-size: 2.25vw; } main h3 { margin: 2.5vw auto 2.5vw; padding: 1vw 1%; font-size: 1.916vw; border-bottom-width: 0.2vw; } main h4 { margin: 2.5vw auto 2.5vw; padding: 0.67vw 1% 0.67vw 0; font-size: 1.833vw; border-bottom-width: 0.2vw; } main h5 { margin: 2.5vw auto 2.5vw; padding: 0.42vw 1%; font-size: 1.666vw; border-left-width: 0.45vw; } main h6 { margin: 2.5vw auto 2.5vw; padding: 1.16vw 1%; font-size: 1.333vw; } p { font-size: 1.33vw; } .Body__Single ul li { margin-left: 1.66vw; font-size: 1.5vw; } .Body__Page ul li, .Body__Single ul li { font-size: 1.33vw; } #toc_container { margin-bottom: 4.15vw; } } @media screen and (max-width: 600px) { html { font-size: 50%; } body { width: 100%; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } html.open { height: 100%; overflow: hidden; } body.open { position: fixed; width: 100%; height: 100%; left: 0; overflow: hidden; } p { font-size: 1.7rem; line-height: 2.0; } /* Heading */ main h2 { padding: 3vw 4%; width: 92%; } main h3 { padding: 3vw 1%; } main h4 { padding: 1.5vw 1% 1.5vw 0; } main h5 { padding: 1.5vw 1% 1.5vw 2%; width: 97%; border-left-width: 4px; } main h6 { } #toc_container { margin-bottom: 10vw; } } /* WordPress Default ======================================================== */ .is-layout-flex { gap: 0; } .has-text-align-left { text-align: left; } .has-text-align-center { text-align: center; } .has-text-align-right { text-align: right; } .aligncenter { display: block; margin-right: auto; margin-left: auto; } .alignright { float: right; margin-bottom: 20px; margin-left: 20px; } .alignleft { float: left; margin-right: 20px; margin-bottom: 20px; } .wp-caption, [class*='wp-image'] { display: block; max-width: 100% !important; margin-top: 1.5em; text-align: center; } .wp-caption-text { margin-top: 0; } .mce-item-table { max-width: 100% !important; border-collapse: collapse; margin-bottom: 2rem; } .mce-item-table th { padding: 1rem 2rem; border: 1px solid #eaeaea; word-break: break-all; } .mce-item-table td { padding: 1rem 2rem; border: 1px solid #eaeaea; line-height: 1.5; word-break: break-all; } /* TinyMCEの独自スタイル */ .lightweight-accordion { margin-bottom: 3rem !important; } .--SupplementaryFrame, .--CautionFrame { position: relative; display: block; margin: 0 auto 3rem; padding: 15px 15px 15px 63px; width: 760px; line-height: 1.7; border-width: 1px; border-style: solid; border-radius: 5px; } .--SupplementaryFrame { background: #fff7cc; border-color: #ffe766; } .--CautionFrame { background: #fdf2f2; border-color: #f6b8b8; } .--SupplementaryFrame:before { content: "\21"; background: #ffd700; border-radius: 50%; } .--CautionFrame:before { content: "\21"; } .--SupplementaryFrame:before, .--CautionFrame:before { position: absolute; z-index: 1; top: 10px; left: 10px; display: flex; justify-content: center; align-items: center; width: 40px; height: 40px; color: #fff; font-size: 2.2rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .--CautionFrame:after { position: absolute; z-index: 0; top: -12px; left: 12px; content: "\f04b"; color: #f6b8b8; font-size: 4.6rem; font-family: "Font Awesome 6 Free"; font-weight: bold; transform: rotate(-90deg); } .--SimpleFrame { display: block; margin: 0 auto 3rem; padding: 15px; width: 810px; line-height: 1.7; border: 1px solid #ccc; border-radius: 5px; } .--LabelBox { position: relative; display: flex; flex-direction: column; align-items: flex-start; margin: 3rem auto; padding: 15px; width: 810px; background: #f3fafe; border: 1px solid #bde3fb; border-radius: 5px; } .--LabelBoxTitle { display: inline-block; margin: -35px 0 15px; padding: 10px 15px; color: #fff; font-weight: 500; background: #87cefa; border-radius: 5px; } .--DefaultButton, .--SimpleButton { display: flex; justify-content: center; align-items: center; margin: 0 auto 3rem; } .--DefaultButton a, .--SimpleButton a { display: flex; justify-content: center; align-items: center; margin: 0 auto; font-size: 1.8rem; font-weight: 500; text-decoration: none; border-radius: 5px; box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .15); } .--DefaultButton a { padding: 15px 30px; color: #fff !important; } .--SimpleButton a { padding: 15px 35px; border-width: 2px; border-style: solid; } .--RedMarker { background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffabab 0%) repeat scroll 0 0; /*赤色マーカー*/ } .--BlueMarker { background:rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #dec8fd 0%) repeat scroll 0 0; /*紫色マーカー*/ } .--YellowMarker { background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffc800 0%) repeat scroll 0 0; /*黄色マーカー*/ } /* テーブル */ table { max-width: 100% !important; border-collapse: collapse; margin-bottom: 2rem; } table tbody { max-width: 100% !important; } table th { padding: 5px 5px; border-width: 1px; border-style: solid; border-color: #eaeaea; word-break: break-all; } table td { padding: 5px 5px; border-width: 1px; border-style: solid; border-color: #eaeaea; line-height: 1.5; word-break: break-all; } table th p, table td p { margin-bottom: 0 !important; } table.mainstyle th { background: #ffffCC; } table.NoLine th { border: none; } table.NoLine td { border: none; } @media only screen and (min-width:600px) and (max-width:1200px) { .--SupplementaryFrame, .--CautionFrame { margin: 0 auto 2.5vw; padding: 1.25vw 1.25vw 1.25vw 5.21vw; width: 63.3vw; border-radius: 0.4vw; } .--SupplementaryFrame:before, .--CautionFrame:before { top: 0.83vw; left: 0.83vw; width: 3.33vw; height: 3.33vw; font-size: 1.8vw; } .--CautionFrame:after { top: -1vw; left: 1vw; font-size: 3.83vw; } .--SimpleFrame { margin: 0 auto 2.5vw; padding: 1.25vw; width: 67.5vw; border-radius: 0.4vw; } .--LabelBox { margin: 2.5vw auto; padding: 1.25vw; width: 67.5vw; border-radius: 0.4vw; } .--LabelBoxTitle { margin: -2.9vw 0 1.25vw; padding: 0.83vw 1.25vw; border-radius: 0.4vw; } .lightweight-accordion-body { padding: 0.83vw !important; border-width: 0.2vw !important; } .lightweight-accordion-title p, .lightweight-accordion .lightweight-accordion-title span { font-size: 1.5vw !important; } .--SupplementaryFrame, .--CautionFrame, .--SimpleFrame, .--LabelBox { font-size: 1.33vw; } .--DefaultButton, .--SimpleButton { margin: 0 auto 2.5vw; } .--DefaultButton a, .--SimpleButton a { font-size: 1.5vw; border-radius: 0.4vw; } .--DefaultButton a { padding: 1.25vw 2.49vw; } .--SimpleButton a { padding: 1.25vw 2.9vw; } table th, table td, table th p, table td p { font-size: 1.33vw; } table th { padding: 0.83vw 1.66vw; } table td { padding: 0.83vw 1.66vw; } } @media screen and (max-width: 600px) { table { width: 100% !important; table-layout: fixed; } .lightweight-accordion-title p, .lightweight-accordion .lightweight-accordion-title span { font-size: 1.7rem !important; } .--SupplementaryFrame, .--CautionFrame { padding: 2% 2% 2% 14%; width: 84%; line-height: 1.5; } .--SupplementaryFrame:before, .--CautionFrame:before { top: 2vw; left: 2vw; width: 8vw; height: 8vw; } .--CautionFrame:after { top: -1.5vw; left: 2.5vw; font-size: 4.4rem; } .--SimpleFrame { padding: 2%; width: 96%; line-height: 1.5; } .--LabelBox { padding: 2%; width: 96%; } .--LabelBoxTitle { margin: -5vw 0 2vw; padding: 2% 3vw; } .--DefaultButton a { padding: 3.5vw 6vw; } .--SimpleButton a { padding: 3vw 7vw; } } /* Utility classes ======================================================== */ .--PC { display: block; } .--SP { display: none !important; } .editor-styles-wrapper .is-root-container .--SP { display: block !important; } @media screen and (max-width: 600px) { .--PC { display: none !important; } .--SP { display: block !important; } } .--Wrap { margin: 0 auto !important; width: 1000px; } .--PositionFixed { position: fixed; z-index: 99; } /* Heading */ .--TopHeading { position: relative; display: flex; justify-content: center; margin: 0 auto 70px !important; padding: 0 0 20px; font-size: 3.6rem; font-weight: 700; line-height: 1.5; text-align: center; background: none; border: none; } .--TopHeading:before { display: none; } .--TopHeading:after { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: inline-block; content: ""; width: 35px; height: 5px; } .--TopSubHeading { margin: 0; padding: 10px 0; width: 100%; font-size: 3.0rem; font-weight: 700; text-align: center; border-bottom-width: 3px; border-bottom-style: solid; } /* Button */ .--Button a { position: relative; display: inline-block; margin: 0 auto; padding: 20px 0; color: #fff; font-size: 2.3rem; font-weight: 500; text-decoration: none; text-align: center; border-radius: 100px; } .--Button a:after { position: absolute; right: 30px; top: 50%; transform: translateY(-50%); display: inline-block; content: '\f138'; font-size: 2.1rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } /* Shadow */ .--BoxShadow { box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .15); } /* Font */ .--Mincho { font-family: "Hiragino Mincho ProN","Hiragino Mincho Pro",游明朝,"Yu Mincho",YuMincho,HGS明朝E,メイリオ,Meiryo,serif; } .--Gothic { font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3",sans-serif; } .--RobotoCondensed { font-family: "Roboto Condensed", sans-serif; } /* Color */ /* Alignment */ .--AlignLeft { text-align: left; } .--AlignCenter { text-align: center; } .--AlignRight { text-align: right; } /* Image */ .--ObjectFitCover { position: relative; display: block; width: 100%; background: #eaeaea; overflow: hidden; object-fit: cover; } .--ObjectFitCover:before { content: ""; display: block; } .--ObjectFitCover img { position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; margin: auto; object-fit: cover; } @media only screen and (min-width:600px) and (max-width:1200px) { .--TopHeading { margin: 0 auto 5.8vw !important; padding: 0 0 1.7vw; font-size: 3.0vw; } .--TopHeading:after { width: 2.9vw; height: 0.42vw; } .--TopSubHeading { padding: 0.82vw 0; font-size: 2.5vw; border-bottom-width: 0.25vw; } .--Button a { padding: 1.65vw 0; font-size: 1.92vw; } .--Button a:after { right: 2.5vw; font-size: 1.75vw; } #ez-toc-container { margin-bottom: 0.83vw; padding: 0.83vw 1.66vw 0.83vw 0.83vw; border-radius: 0.3vw; /*目次*/ } div#ez-toc-container .ez-toc-title { font-size: 1.6vw; } #ez-toc-container .ez-toc-js-icon-con, #ez-toc-container .ez-toc-toggle label, .ez-toc-cssicon { border-radius: 0.42vw; left: 0.83vw; width: 2.9vw; } .ez-toc-icon-toggle-span { width: 2.95vw; height: 2.5vw; } div#ez-toc-container nav ul ul li { font-size: 1.14vw; } div#ez-toc-container ul li { font-size: 1.27vw; } #ez-toc-container ul ul, .ez-toc div.ez-toc-widget-container ul ul { margin-left: 1.9vw; } } @media screen and (max-width: 600px) { .--TopHeading { margin: 0 auto 6vw !important; padding: 0 0 3vw; width: 100%; font-size: 2.8rem; line-height: 1.2; } .--TopHeading:after { width: 5vw; height: 0.7vw; } .--TopSubHeading { padding: 2vw 0; font-size: 2.6rem; border-bottom-width: 2px; } .--Button a { padding: 3vw 0; font-size: 1.9rem; } .--Button a:after { right: 5vw; font-size: 1.4rem; } } /* Inview.js ======================================================== */ .--InviewFade { opacity: 0; /*表示前に透明にしておく */ transform: translateY(60px); /*表示前の位置 */ transition: 0.8s; /*移動にかける時間 */ transition-delay: 0.1s; /*遅延をかける秒数 */ } .--InviewFade.fadeInUp { opacity: 1; transform: translateY(0); } .--InviewFade.--Delay1 { transition-delay: 0.3s; } .--InviewFade.--Delay2 { transition-delay: 0.6s; } .--InviewFade.--Delay3 { transition-delay: 0.9s; } .--InviewFade.--Delay4 { transition-delay: 1.2s; } .--InviewFade.--Delay5 { transition-delay: 1.5s; } .--InviewFade.--Delay6 { transition-delay: 1.8s; } .--InviewRight { opacity: 0; /*表示前に透明にしておく */ transform: translateX(60px); /*表示前の位置 */ transition: 0.8s; /*移動にかける時間 */ transition-delay: 0.1s; /*遅延をかける秒数 */ } .--InviewRight.fadeInLeft { opacity: 1; transform: translateX(0); } .--InviewRight.--Delay1 { transition-delay: 0.3s; } .--InviewRight.--Delay2 { transition-delay: 0.6s; } .--InviewRight.--Delay3 { transition-delay: 0.9s; } .--InviewRight.--Delay4 { transition-delay: 1.2s; } .--InviewRight.--Delay5 { transition-delay: 1.5s; } .--InviewRight.--Delay6 { transition-delay: 1.8s; } .--InviewLeft { opacity: 0; /*表示前に透明にしておく */ transform: translateX(-60px); /*表示前の位置 */ transition: 0.8s; /*移動にかける時間 */ transition-delay: 0.1s; /*遅延をかける秒数 */ } .--InviewLeft.fadeInRight { opacity: 1; transform: translateX(0); } .--InviewLeft.--Delay1 { transition-delay: 0.3s; } .--InviewLeft.--Delay2 { transition-delay: 0.6s; } .--InviewLeft.--Delay3 { transition-delay: 0.9s; } .--InviewLeft.--Delay4 { transition-delay: 1.2s; } .--InviewLeft.--Delay5 { transition-delay: 1.5s; } .--InviewLeft.--Delay6 { transition-delay: 1.8s; } /* Header ======================================================== */ .Body__Header { margin: 0 auto; padding: 0; width: 100%; background: #fff; } .Header { padding: 10px 0; width: 1100px; } .Header__Primary { /* padding: 0 0 0 80px; */ } .Header__PrimaryCatchcopy { margin: 0 20px 5px 0 !important; padding: 5px 15px; min-width: 360px; font-size: 1.3rem; font-weight: 400; letter-spacing: 0; } .Header__Primary .--SitenameImage { width: 390px; } .Header__Primary .--SitenameImage img { width: 100%; height: auto; } .Header__Primary .--Sitename { margin: 0; padding: 10px 0; font-size: 3.1rem; font-weight: 700; line-height: 1; } .Header__Primary .--Sitename a { color: #3b2300; text-decoration: none; } .Header__Primary .--Sitename strong { font-weight: 700; } .Header__Primary .--Sitename em { font-style: normal; } .Header__Primary .--Management { padding: 0 1rem 0 0; letter-spacing: 0; } .Header__Primary .--Management:before { content: "運営："; } .Header__Primary .--Management, .Header__Primary .--Access { font-size: 1.3rem; letter-spacing: 0; } .Header__Secondary { align-items: initial !important; } .Header__SecondaryList { display: flex; align-items: flex-start; } .Header__SecondaryButton { display: flex; margin-right: 10px; } .Header__SecondaryButton a { position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding: 5px; width: 85px; height: 85px; font-size: 1.4rem; font-weight: 500; line-height: 1.1; letter-spacing: 0; text-align: center; text-decoration: none; border-width: 1px; border-style: solid; border-radius: 8px; } .Header__SecondaryButton:last-child a i { font-size: 2.0rem; } .Header__SecondaryButton a strong { display: flex; align-items: center; height: 50px; font-weight: 500; } .Header__SecondaryButton .--IconBeginner { position: relative; display: inline-block; width: 14px; height: 17px; vertical-align: middle; } .Header__SecondaryButton .--IconBeginner:before, .Header__SecondaryButton .--IconBeginner:after { position: absolute; top: 0; content: ""; display: block; width: 50%; height: 100%; border-width: 1px; border-style: solid; border-bottom-width: .15em; box-sizing: border-box; } .Header__SecondaryButton .--IconBeginner:before { left: 0; background: transparent; transform: skewY(45deg); border-radius: 4px 0 0 2px; border-right: none; } .Header__SecondaryButton .--IconBeginner:after { right: 0; transform: skewY(-45deg); border-radius: 0 4px 2px 0; border-left: none } .Header__SecondaryPhone { width: 280px; } .Header__SecondaryPhoneHeading { padding: 5px 0; width: 100%; color: #fff; font-size: 1.3rem; line-height: 1; text-align: center; border-radius: 100px; } .Header__SecondaryPhone .--PhoneNumber { padding: 5px 0; font-size: 3.8rem; font-weight: 700; line-height: 1; } .Header__SecondaryPhone .--PhoneNumber a { display: flex; text-decoration: none; letter-spacing: 0; pointer-events: none; } .Header__SecondaryPhone .--PhoneNumber a:before { display: flex; align-items: center; margin-right: 5px; content: "\f098"; font-size: 3.0rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Header__SecondaryPhoneInfo { position: relative; margin: 5px 0 0 20px !important; } .Header__SecondaryPhone .--ReceptionHours { display: flex; align-items: center; padding-left: 68px; font-size: 1.2rem; font-weight: 500; letter-spacing: 0; line-height: 1; } .Header__SecondaryPhone .--ReceptionHours:before { position: absolute; left: 0; top: 50%; transform: translateY(-50%); content: "受付時間"; display: flex; margin: 0 10px 0 0; padding: 5px; } .Header__SecondaryPhone .--Annotation { margin-left: 68px; font-size: 1.1rem; font-weight: 500; letter-spacing: 0; line-height: 1; } @media only screen and (min-width:600px) and (max-width:1200px) { .Header { padding: 0.82vw 0; width: 91.6vw; } .Header__Primary { padding: 0; } .Header__PrimaryCatchcopy { margin: 0 1.666vw 0.416vw 0 !important; padding: 0.416vw 1.25vw; min-width: 30vw; font-size: 1.083vw; } .Header__Primary .--SitenameImage { width: 32.5vw; } .Header__Primary .--Sitename { padding: 0.85vw 0; font-size: 2.58vw; } .Header__Primary .--Management, .Header__Primary .--Access { font-size: 1.083vw; } .Header__Primary .--Management { padding: 0 0.833vw 0 0; } .Header__SecondaryButton { margin-right: 0.85vw; } .Header__SecondaryButton a { padding: 0.425vw; width: 7.1vw; height: 7.1vw; font-size: 1.17vw; border-radius: 0.7vw; } .Header__SecondaryButton:last-child a i { font-size: 1.67vw; } .Header__SecondaryButton .--IconBeginner { width: 1.2vw; height: 1.42vw; } .Header__SecondaryButton .--IconBeginner:before, .Header__SecondaryButton .--IconBeginner:after { border-width: 0.1vw; } .Header__SecondaryButton .--IconBeginner:before { border-radius: ; } .Header__SecondaryButton .--IconBeginner:after { border-radius: ; } .Header__SecondaryButton a strong { height: 4.17vw; } .Header__SecondaryPhone { width: 23.3vw; } .Header__SecondaryPhoneHeading { padding: 0.42vw 0; font-size: 1.08vw; } .Header__SecondaryPhone .--PhoneNumber { padding: 0.42vw 0; font-size: 3.17vw; } .Header__SecondaryPhone .--PhoneNumber a:before { margin-right: 0.4vw; font-size: 2.5vw; } .Header__SecondaryPhoneInfo { margin: 0.416vw 0 0 1.666vw !important; } .Header__SecondaryPhone .--ReceptionHours { padding-left: 5.666vw; } .Header__SecondaryPhone .--ReceptionHours:before { margin: 0 0.83vw 0 0; padding: 0.42vw; } .Header__SecondaryPhone .--ReceptionHours { font-size: 1.0vw; } .Header__SecondaryPhone .--Annotation { margin-left: 5.7vw; font-size: 0.917vw; } } @media screen and (max-width: 600px) { .Header { justify-content: space-between !important; padding: 2vw 0 1vw; width: 98%; } .Header__Primary { margin: 0 auto; padding: 0 0 0 3vw; } .Header__PrimaryCatchcopy { padding: 1vw 2vw 0.5vw; min-width: 47vw; font-size: 0.9rem; line-height: 1; } .Header__Primary .--SitenameImage { width: 62vw; } .Header__Primary .--Sitename { padding: 1.5vw 0 0 0; font-size: 2.7rem; letter-spacing: 0; } .Header__Primary .--Management, .Header__Primary .--Access { font-size: 0.9rem; letter-spacing: 0; } .Header__Secondary { display: none !important; } } /* GlobalNavi ======================================================== */ .Body__GlobalNavi { position: relative; display: flex; justify-content: center; width: 100%; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #fff; } .Body__GlobalNavi.--PositionFixed { left: 0; position: fixed; top: 0; z-index: 100; } .GlobalNavi { display: flex; justify-content: space-between; align-items: center; } .GlobalNavi li { position: relative; width: 110px; text-align: center; } .GlobalNavi li:before { content: ""; display: inline-block; position: absolute; top: 5px; left: 0; height: 85%; width: 1px; } .GlobalNavi li:last-child a { letter-spacing: -0.025em; } .GlobalNavi li:last-child:after { content: ""; display: inline-block; position: absolute; top: 5px; right: 0; height: 85%; width: 1px; } .GlobalNavi a { display: flex; flex-direction: column; padding: 10px 0; color: #fff; font-size: 1.5rem; font-weight: 400; letter-spacing: 0; text-decoration: none; } .GlobalNavi a i { display: inline-block; padding: 0 0 10px; font-size: 2.0rem; } .GlobalNavi li { position: relative; /* ドロップダウンメニュー(PC) */ } .GlobalNavi li a:hover .sub-menu { transform: scaleY(1); } .GlobalNavi .sub-menu { z-index: 1000; display: none; background: rgba(102,102,102,0.9); position: absolute; top: 67px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); width: 200px; } .GlobalNavi .sub-menu li { position: relative; display: flex; flex-direction: column; margin: 0; padding: 0; width: 100%; } .GlobalNavi .sub-menu li:before, .GlobalNavi .sub-menu li:after { display: none; } .GlobalNavi .sub-menu li a { display: block; margin: 0 auto; padding: 10px 5%; width: 90%; color: #fff; font-size: 1.5rem; text-align: left; border-bottom: 1px solid #fff; } .GlobalNavi .sub-menu li a:hover { opacity: 0.7; } .GlobalNavi .sub-menu li a:after { display: none; } .GlobalNavi .open { display: block !important; } .Body__Modal { display: none !important; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); visibility: hidden; opacity: 0; } .editor-styles-wrapper .is-root-container .Body__Modal { display: block !important; position: initial; visibility: visible; opacity: 1; background: rgba(255, 255, 255, 1); } .Modal { display: none; } @media only screen and (min-width:600px) and (max-width:1200px) { .GlobalNavi { width: 91.7vw; } .GlobalNavi li { width: 10vw; } .GlobalNavi li:before, .GlobalNavi li:last-child:after { top: 0.4vw; width: 0.1vw; } .GlobalNavi a { padding: 0.83vw 0; font-size: 1.25vw; } .GlobalNavi a i { padding: 0 0 0.84vw; font-size: 1.68vw; } .GlobalNavi .sub-menu { top: 5.6vw; width: 16.7vw; } .GlobalNavi .sub-menu li a { padding: 0.84vw 5%; font-size: 1.25vw; } } @media screen and (max-width: 600px) { .MobileNavi { justify-content: center; gap: 0; padding: 2%; background: #0849a3; border-top: 1px solid #fff; } .MobileNavi figure { width: 23%; margin: 1% !important; } .MobileNavi figure img { margin-top: 0; } .fixed { position: fixed; z-index: 99; top: 0; } /* ハンバーガーボタン */ .menu-btn { position: fixed; z-index: 102; top: 2.5vw; right: 2.5vw; width: 13vw; height: 13vw; cursor: pointer; -webkit-transition: all 3s ease-in-out; transition: all .3s ease-in-out; /* border-radius: 1vw; */ } .menu-btn:after { position: absolute; bottom: 1vw; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); z-index: 0; content: "メニュー"; display: block; color: #fff; font-size: 1.1rem; font-weight: bold; letter-spacing: 0; white-space: nowrap; } body.open .menu-btn { background: none; } body.open .menu-btn:after { display: none; } .menu-btn-line { position: absolute; top: -3vw; bottom: 0; left: 0; right: 0; margin: auto; height: 3px; width: 50%; background: #fff; -webkit-transition: all 3s ease-in-out; transition: all .3s ease-in-out; } .menu-btn-line:before, .menu-btn-line:after { content: ""; height: 3px; width: 100%; background: #fff; position: absolute; left: 0; -webkit-transition: inherit; transition: inherit; } .menu-btn-line:before { top: -2.5vw; } .menu-btn-line:after { top: 2.5vw; } body.open .menu-btn { border-color: #fff; } body.open .menu-btn-line { background-color: transparent; } body.open .menu-btn-line:before, body.open .menu-btn-line:after { top: 0; background: #333; } body.open .menu-btn-line:before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } body.open .menu-btn-line:after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } /* モーダルウィンドウ */ body.open { position: fixed; width: 100%; height: 100%; } body.open .Body__Modal { display: block !important; visibility: visible; opacity: 1; overflow-y: auto; } .Modal { display: block; position: fixed; z-index: 101; top: 0; right: 0; margin: 0 !important; padding: 0; width: 93vw; height: 100%; transform: translate(93vw); transition: all 0.5s; overflow-y: scroll; -webkit-overflow-scrolling: touch; } .Modal.active { transform: translateZ(0); } /* .Modal__Intro { margin: 0 auto 2vw; padding: 1vw 2vw; width: 90%; color: #fff; font-size: 2.0rem; font-weight: bold; background: #ff9600; } */ .Modal nav { margin: 0 auto 2vw !important; width: 94%; } .Modal nav:before { content: "MENU"; display: flex; margin: 15vw 0 3vw; padding: 3vw 2%; width: 96%; color: #fff; font-size: 2.0rem; font-weight: bold; } .Modal__List { display: flex; flex-direction: column; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; width: 100%; } .Modal__List li { display: flex; margin: 0 0 2vw; width: 100%; } .Modal__List li a { position: relative; display: flex; justify-content: flex-start; align-items: flex-start; margin: 0; padding: 1.5vw 1% 2.5vw; width: 98%; color: #333; font-size: 1.7rem; font-weight: 500; text-align: left; text-decoration: none; border-bottom: 1px solid #ccc; } .Modal__List li a i { display: flex; justify-content: center; width: 8vw; } .Modal__List li a span { width: 90%; } .Modal__Heading { position: relative; display: flex; justify-content: center; align-items: center; margin: 0 auto 3vw !important; padding: 3.5vw 0; width: 100%; font-size: 2.4rem; font-weight: 500; text-align: center; background: #fffaed; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; } .Modal__Heading .--BtnAcd { position: absolute; display: flex; justify-content: flex-end; align-items: center; width: 100%; height: 100%; } .Modal__Heading .--BtnAcd:after { display: inline-block; margin: 0 2vw 0 0; padding: 1.5vw 2vw; content: "\2b"; font-size: 1.7rem; font-family: "Font Awesome 6 Free"; font-weight: bold; background: #fff; } .Modal__Heading .--BtnAcd.Selected:after { content: "\f068"; } .Modal__Close { display: flex; justify-content: center; margin: 0 auto; width: 100%; } .Modal__Close a { display: flex; margin: 0 auto; padding: 1vw 9vw; color: #fff; font-size: 1.9rem; font-weight: 500; text-align: center; text-decoration: none; background: #999; border-radius: 5px; } .Modal__Menu { display: none; } .Body__GlobalNavi { display: none; } body.open .Body__GlobalNavi { display: flex; justify-content: center; } .Body__GlobalNavi ul { transform:translateY(10%) !important; margin: 0; padding: 0; width: 100vw; height: 90%; list-style-type: none; } .Body__GlobalNavi li { width: 100%; text-align: center; } .GlobalNavi, ul.wp-block-navigation { transform: initial !important; margin: 0; padding: 0; list-style-type: none; display: flex; flex-direction: column; border-top: 1px solid #e18200; /*▼グロナビ(SP) */ } .GlobalNavi li, ul.wp-block-navigation li { width: 100%; text-align: left; border-bottom: 1px solid #e18200; } .GlobalNavi li:before, ul.wp-block-navigation li:before { display: none; } .GlobalNavi li a, ul.wp-block-navigation li a { position: relative; display: block; margin: 0; padding: 4vw 0; font-size: 2.2rem; font-weight: bold; color: #fff; text-decoration: none; text-align: center; } .GlobalNavi li a:hover, ul.wp-block-navigation li a:hover { transform: initial; -webkit-transition: initial; transition: initial; opacity: 1.0; margin: 0; padding: 4vw 0; text-indent: initial; } .GlobalNavi li:last-child:after, ul.wp-block-navigation li:last-child:after { display: none; } .GlobalNavi li a i, ul.wp-block-navigation li a i { padding-right: 2vw; } .GlobalNavi li.menu-item-has-children a:after, ul.wp-block-navigation li.menu-item-has-children a:after { position: absolute; right: 2vw; top: 50%; transform: translateY(-50%); content: "\f107"; font-family: "Font Awesome 6 Free"; font-weight: bold; } .GlobalNavi li.menu-item-has-children a.on, ul.wp-block-navigation li.menu-item-has-children a.on { color: #ecbed3; } .GlobalNavi li.menu-item-has-children a.on:after, ul.wp-block-navigation li.menu-item-has-children a.on:after { content: "\f106"; } .GlobalNavi .sub-menu, ul.wp-block-navigation .sub-menu { z-index: initial; background: initial; position: initial; top: initial; left: initial; transform: initial; -webkit-transform: initial; -ms-transform: initial; width: initial; box-shadow: initial; margin: initial; } .GlobalNavi .sub-menu li:first-child, ul.wp-block-navigation .sub-menu li:first-child { border-top: 1px solid #ff7200; } .GlobalNavi .sub-menu li:last-child, ul.wp-block-navigation .sub-menu li:last-child { border-bottom: none; } .GlobalNavi .sub-menu li a, ul.wp-block-navigation .sub-menu li a { padding: 3.5vw 5%; color: #ff7200; font-size: 2.0rem; text-align: center; background: #fff; } .GlobalNavi .sub-menu li a:after, ul.wp-block-navigation .sub-menu li a:after { display: none; } .GlobalNavi .open, ul.wp-block-navigation .open { display: block; margin: 0; padding: 0; } } /* メインビジュアル ======================================================== */ .Body__MainVisual { margin: 0 auto; padding: 0; width: 100%; background-image: url(/wp-content/uploads/2025/06/mv-bg-pc.jpg); background-repeat: no-repeat; background-position: center top; background-size: cover; } html.webp .Body__MainVisual { background-image: url(/wp-content/uploads/2025/06/mv-bg-pc.jpg.webp); } .MainVisual { position: relative; overflow-x: visible; display: flex; justify-content: space-between; /* align-items: center; */ flex-wrap: wrap; margin: 0 auto; padding: 0 0 15px; width: 1100px; } .MainVisual__Primary { display: flex; flex-direction: column; margin: 0; padding: 25px 0 0; width: 630px; line-height: 0; } .MainVisual__PrimaryHeading { z-index: 1; font-size: 3.9rem; font-weight: 700; line-height: 1.1; letter-spacing: 0; text-align: center; white-space: nowrap; text-shadow: 0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff,0 0 10px #fff; } .MainVisual__PrimaryHeading strong { color: #f36e21; font-size: 4.8rem; font-weight: 700; } .mce-content-body .MainVisual__PrimaryHeading { font-size: 3.9rem; } .mce-content-body .MainVisual__PrimaryHeading strong { font-size: 4.8rem; } .MainVisual__PrimaryHeading em { font-size: 3.3rem; font-style: normal; } .MainVisual__PrimaryImage { position: absolute; z-index: 0; left: 50px; bottom: 80px; width: 560px; } .MainVisual__PrimaryImage img { width: 100%; height: auto; } .MainVisual__Reason { z-index: 1; margin: 20px 0; padding: 0; width: 470px; background: #fff; } .mce-content-body .MainVisual__Reason { width: 39.0vw; } .MainVisual__Reason dt { font-size: 3.0rem; font-weight: 500; line-height: 1; text-align: center; background-image: url(/wp-content/uploads/2025/06/mv-reason-bg.png); background-repeat: no-repeat; background-position: center center; background-size: auto 100%; } html.webp .MainVisual__Reason dt { background-image: url(/wp-content/uploads/2025/06/mv-reason-bg.png.webp); } .MainVisual__Reason dt strong { font-size: 7.0rem; font-weight: 500; } .MainVisual__Reason dd { position: relative; margin: 0; padding: 10px 0 10px 40px; font-size: 2.2rem; font-weight: 500; line-height: 1.25; letter-spacing: 0; counter-increment: faq-num; } .MainVisual__Reason dd:nth-child(3), .MainVisual__Reason dd:nth-child(5) { padding-top: 20px; padding-bottom: 20px; } .MainVisual__Reason dd strong { font-weight: 500; } .MainVisual__Reason dd small { font-size: 1.4rem; } .MainVisual__Reason dd:before { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); display: inline-block; font-size: 2.7rem; font-weight: 500; content: counter(faq-num); } .MainVisual__Reason dd:nth-child(even):before { color: #fecc3e; } .MainVisual__Reason dd:nth-child(odd):before { color: #fecc3e; } .MainVisual__Achievements { position: relative; display: flex; margin: 0 0 0 50px; padding: 0; width: 1000px; background: #fff; border-width: 3px; border-style: solid; border-radius: 10px; } .MainVisual__Achievements dt { position: relative; display: flex; padding: 10px 15px; color: #fff; font-size: 2.6rem; } .MainVisual__Achievements dt:before { content: ""; position: absolute; top: 50%; left: 100%; margin-top: -10px; border: 10px solid transparent; border-left-width: 15px; border-left-style: solid; } .MainVisual__Achievements dt strong { display: flex; align-items: center; font-weight: 500; } .MainVisual__Achievements dd { display: flex; padding: 8px 0 8px 50px; } .MainVisual__Achievements dd p { display: flex; line-height: 1; } .MainVisual__Achievements dd strong { font-size: 2.2rem; font-weight: 500; line-height: 1.7; } .MainVisual__Achievements dd em { font-size: 3.0rem; font-weight: 700; font-style: normal; } .MainVisual__Achievements dd small { display: block; padding: 0 0 0 15px; font-size: 1.6rem; font-weight: 400; } .MainVisual__AchievementsButton a { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); display: flex; padding: 12px 25px 12px 35px; color: #fff; font-size: 1.9rem; font-weight: 500; text-decoration: none; border-radius: 100px; } .MainVisual__AchievementsButton a:after { display: flex; align-items: center; margin-left: 10px; content: "\f138"; font-size: 1.5rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } @media only screen and (min-width:600px) and (max-width:1200px) { .MainVisual { padding: 0 0 1.25vw; width: 91.7vw; } .MainVisual__Primary { padding: 2.083vw 0 0; width: 52.5vw; } .MainVisual__PrimaryHeading { font-size: 3.25vw; text-shadow: 0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff,0 0 0.8vw #fff; } .MainVisual__PrimaryHeading strong { font-size: 4.0vw; } .mce-content-body .MainVisual__PrimaryHeading { font-size: 3.25vw; } .mce-content-body .MainVisual__PrimaryHeading strong { font-size: 4.0vw; } .MainVisual__PrimaryImage { left: 4.166vw; bottom: 6.666vw; width: 46.666vw; } .MainVisual__Reason { margin: 1.67vw 0; width: 39.2vw; } .MainVisual__Reason dt { font-size: 2.5vw; } .MainVisual__Reason dt strong { font-size: 5.8vw; } .MainVisual__Reason dd { padding: 0.833vw 0 0.833vw 3.333vw; font-size: 1.833vw; } .MainVisual__Reason dd:before { left: 0.833vw; font-size: 2.25vw; } .MainVisual__Reason dd:nth-child(3), .MainVisual__Reason dd:nth-child(5) { padding-top: 1.666vw; padding-bottom: 1.666vw; } .MainVisual__Achievements { margin: 0 0 0 4.2vw; width: 83.4vw; border-width: 0.25vw; border-radius: 0.8vw; } .MainVisual__Achievements dt { padding: 0.84vw 1.25vw; font-size: 2.17vw; } .MainVisual__Achievements dt:before { margin-top: -0.84vw; border: 0.84vw solid transparent; border-left: 1.25vw solid #468c01; } .MainVisual__Achievements dd { padding: 0.66vw 0 0.66vw 4.18vw; } .MainVisual__Achievements dd strong { font-size: 1.83vw; } .MainVisual__Achievements dd em { font-size: 2.5vw; } .MainVisual__Achievements dd small { padding: 0 0 0 1.25vw; font-size: 1.33vw; } .MainVisual__AchievementsButton a { right: 1.25vw; padding: 1vw 2.1vw 1vw 2.9vw; font-size: 1.58vw; } .MainVisual__AchievementsButton a:after { margin-left: 0.84vw; font-size: 1.25vw; } } @media screen and (max-width: 600px) { .Body__MainVisual { background-color: #e9f2fe; background-image: url(/wp-content/uploads/2025/06/mv-bg-sp.jpg); background-size: 100% auto; } html.webp .Body__MainVisual { background-image: url(/wp-content/uploads/2025/06/mv-bg-sp.jpg.webp); } .MainVisual { padding: 0; width: 100%; flex-direction: row; } .MainVisual__Primary { order: 1; margin: 0 auto; padding: 0; width: 100%; } .MainVisual__PrimaryHeading { padding: 3vw 0 45vw; font-size: 3.08rem; line-height: 1.2; text-align: center; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; } .MainVisual__PrimaryHeading strong { font-size: 4.28rem; } .MainVisual__PrimaryHeading em { font-size: 2.8rem; } .MainVisual__PrimaryHeading span { display: block; } .MainVisual__PrimaryHeading span + br { display: none; } .MainVisual__PrimaryImage { bottom: initial; top: 22vw; left: 0; margin: 0 10%; width: 80%; } .MainVisual__Achievements { order: 2; flex-direction: column; margin: -8vw auto 4vw; width: 90%; border: 2px solid #468c01; } .MainVisual__Achievements dt:before { display: none; } .MainVisual__Achievements dt { justify-content: center; padding: 1.5vw 0; font-size: 2.4rem; border-radius: 1vw 1vw 0 0; } .MainVisual__Achievements dd { flex-direction: column; align-items: center; padding: 1vw 0 2vw; font-size: 2.4rem; } .MainVisual__Achievements dd p { padding: 1vw 0 2vw; white-space: nowrap; } .MainVisual__Achievements dd strong { display: flex; padding: 0.5vw 0 0; font-size: 1.6rem; } .MainVisual__Achievements dd em { display: flex; align-items: center; font-size: 2.5rem; } .MainVisual__Achievements dd small { display: flex; padding: 1vw 0 0 1vw; font-size: 1.4rem; } .MainVisual__AchievementsButton { display: flex; } .MainVisual__AchievementsButton a { position: initial; transform: initial; padding: 1.5vw 4vw 1.5vw 6vw; font-size: 1.7rem; } .MainVisual__Reason { order: 3; margin: 0; width: 100%; box-shadow: none; } .MainVisual__Reason dt { padding: 1vw 0; font-size: 2.4rem; } .MainVisual__Reason dt strong { font-size: 5.0rem; } .MainVisual__Reason dd { padding: 1vw 0 1vw 10vw; font-size: 2.4rem; } .MainVisual__Reason dd:before { left: 3vw; } .MainVisual__Reason dd:nth-child(3), .MainVisual__Reason dd:nth-child(5) { padding-top: 3.5vw; padding-bottom: 3.5vw; } /* .MainVisual__Reason dd:nth-child(3) { display: flex; flex-direction: column; 2項目目を指定位置で改行 } */ } /* MV下のメニュー ======================================================== */ .Body__MainVisualBottom { display: none; } @media screen and (max-width: 600px) { .Body__MainVisualBottom { margin: 0 auto; padding: 3vw 0 1vw; width: 100%; } .MainVisualBottom { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto !important; width: 94%; } .MainVisualBottom li { margin: 0 0 2vw; width: 48%; } .MainVisualBottom li a { display: flex; align-items: center; margin: 0; padding: 2.5vw 2vw; font-size: 1.8rem; font-weight: 500; text-decoration: none; text-align: center; border-radius: 5px; } .MainVisualBottom li a i { display: flex; justify-content: center; align-items: center; width: 8vw; height: 8vw; font-size: 2.2rem; border-radius: 50%; } .MainVisualBottom li a strong { display: flex; justify-content: center; width: 30vw; font-weight: 500; } } /* フロントページ：セミナー・無料相談会のご案内 ======================================================== */ .Body__TopSeminar { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 80px 0; } .TopSeminar { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 0; width: 1100px; } .TopSeminar__Item { display: flex; justify-content: flex-start; align-items: flex-start; margin: 0 auto 40px; padding: 4%; width: 92%; background: #fff; border-width: 2px; border-style: solid; border-radius: 20px; } .TopSeminar__Primary { margin: 0 60px 0 0; width: 260px; } .TopSeminar__Primary:before { padding-top: 135%; } .TopSeminar__Secondary { width: 630px; } .TopSeminar__Heading { margin: 0 0 10px; padding: 5px 0; color: #f26100; font-size: 2.9rem; font-weight: 700; line-height: 1.3; background: none; border: none; } .TopSeminar__Item dl { display: flex; flex-wrap: wrap; margin: 0 0 30px; padding: 0; } .TopSeminar__Item dl dt, .TopSeminar__Item dl dd { margin: 0; padding: 10px 0; font-size: 2.1rem; font-weight: 500; line-height: 1.5; border-bottom: 1px solid #dadada; } .TopSeminar__Item dl dt { display: flex; justify-content: space-between; width: 14%; white-space: nowrap; } .TopSeminar__Item dl dt:after { content: "："; } .TopSeminar__Item dl dd { width: 85%; } .TopSeminar__Item .--Button { display: flex; justify-content: center; } .TopSeminar__Item .--Button a { padding-right: 20px; width: 470px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__TopSeminar { padding: 6.7vw 0; } .TopSeminar { width: 91.7vw; } .TopSeminar__Item { margin: 0 auto 3.3vw; padding: 3.7vw; width: 84vw; border-width: 0.2vw; border-radius: 1.7vw; } .TopSeminar__Primary { margin: 0 5vw 0 0; width: 21.7vw; } .TopSeminar__Secondary { width: 52.5vw; } .TopSeminar__Heading { margin: 0 0 0.84vw; padding: 0.42vw 0; font-size: 2.42vw; } .TopSeminar__Item dl { margin: 0 0 2.5vw; } .TopSeminar__Item dl dt { width: 7.35vw; } .TopSeminar__Item dl dd { width: 44.6vw; } .TopSeminar__Item dl dt, .TopSeminar__Item dl dd { padding: 0.84vw 0; font-size: 1.75vw; } .TopSeminar__Item .--Button a { padding-right: 1.7vw; width: 39.2vw; } } @media screen and (max-width: 600px) { .Body__TopSeminar { margin-bottom: -20vw; padding: 8vw 0 0; } .TopSeminar { padding: 25vw 0 0; width: 90%; } .TopSeminar__Item { flex-direction: column; margin: 0 auto 30vw; padding: 0; width: 100%; border-width: 1px; border-style: solid; border-radius: 10px; } .TopSeminar__Primary { margin: -25vw auto 0; width: 40vw; } .TopSeminar__Secondary { margin: 0 auto; padding: 4vw 0; width: 90%; } .TopSeminar__Heading { margin: 0; padding: 0 0 1vw; font-size: 2.3rem; } .TopSeminar__Item dl { margin: 0 0 4vw; } .TopSeminar__Item dl dt, .TopSeminar__Item dl dd { padding: 1vw 0; font-size: 1.8rem; } .TopSeminar__Item dl dt { width: 20%; } .TopSeminar__Item dl dd { width: 80%; } .TopSeminar__Item .--Button a { padding-right: 2vw; width: 100%; } } /* 相続・遺言の無料相談受付中 ======================================================== */ .Body__FreeConsulting { margin: 0 auto; padding: 35px 0 50px; width: 100%; } .FreeConsulting { display: flex; align-items: center; flex-direction: column; margin: 0 auto; padding: 0; width: 1100px; } .FreeConsulting__Primary { position: relative; margin: 0 !important; padding: 0 0 0 110px; } .FreeConsulting__PrimaryImage { position: absolute; left: -10px; bottom: -5px; display: inline-block; width: 110px; } .mce-content-body .FreeConsulting__PrimaryImage { position: initial; left: 0; float: left; } .FreeConsulting__PrimaryImage img { width: 100%; height: auto; } .FreeConsulting__PrimaryText { display: flex; align-items: center; flex-wrap: wrap; width: 520px; } .FreeConsulting__PrimaryText em { display: block; padding: 0 10% 0 0; width: 90%; font-size: 3.8rem; font-weight: 500; font-style: normal; line-height: 1; text-align: center; } .FreeConsulting__PrimaryText em:before, .FreeConsulting__PrimaryText em:after { position: relative; display: inline-block; content: ""; margin: 0 25px; margin-top: -10px; width: 1px; height: 40px; vertical-align: middle; background-color: #333; } .FreeConsulting__PrimaryText em:before { transform: rotate(-30deg); } .FreeConsulting__PrimaryText em:after { transform: rotate(30deg); } .FreeConsulting__PrimaryText span { display: flex; justify-content: center; align-items: center; margin: 0 3px; padding: 0; width: 80px; height: 80px; font-size: 5.4rem; font-weight: 700; border-radius: 50%; } .FreeConsulting__PrimaryText strong { font-size: 5.6rem; font-weight: 700; } .FreeConsulting__Primary .--PhoneNumber { display: flex; padding-left: 20px; line-height: 1; white-space: nowrap; } .FreeConsulting__Primary .--PhoneNumber a { display: flex; font-size: 7.1rem; font-weight: 700; letter-spacing: 0; text-decoration: none; pointer-events: none; } .FreeConsulting__Primary .--PhoneNumber a:before { display: flex; align-items: center; margin-right: 10px; content: "\f098"; font-size: 4.5rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .FreeConsulting__SecondaryText { padding: 5px 60px 15px 0; } .FreeConsulting__Primary .--ReceptionHours { margin: 0 0 0 60px; padding: 0; color: #fff; font-size: 2.4rem; font-weight: 400; line-height: 1; letter-spacing: 0; text-align: center; } .FreeConsulting__Primary .--ReceptionHours:before { content: "受付時間　"; } .FreeConsulting__Primary .--Annotation { margin: 0; padding: 0 0 0 5px; color: #fff; font-size: 2.0rem; font-weight: 400; line-height: 1; letter-spacing: 0; } .FreeConsulting__Text { position: relative; margin: 0; padding: 3%; width: 94%; background: #fff; border-radius: 10px; } .FreeConsulting__Text p { font-size: 3.0rem; font-weight: 500; line-height: 1.5; text-align: center; } .FreeConsulting__List { position: relative; display: flex; justify-content: space-between; margin: 0; padding: 20px 0 0; width: 100%; } .FreeConsulting__List dt { display: flex; justify-content: center; align-items: center; margin: 0; padding: 15px 0; width: 220px; font-size: 2.4rem; font-weight: 500; line-height: 1.3; letter-spacing: 0; text-align: center; border-radius: 10px; } .FreeConsulting__List dt:nth-child(1) { background: #d4eefc; } .FreeConsulting__List dt:nth-child(2) { background: #fcdeea; } .FreeConsulting__List dt:nth-child(3) { background: #fde5c3; } .FreeConsulting__Button { display: flex; align-items: center; } .FreeConsulting__Button a { display: flex; padding: 20px 60px 20px 70px; font-size: 2.8rem; font-weight: 700; text-decoration: none; line-height: 1; border-bottom-width: 4px; border-bottom-style: solid; border-radius: 100px; } .mce-content-body .FreeConsulting__Button a { color: #333; } .FreeConsulting__Button a:after { display: flex; align-items: center; margin-left: 10px; content: "\f138"; font-size: 2.2rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__FreeConsulting { padding: 2.92vw 0 4.15vw; } .FreeConsulting { width: 91.7vw; } .FreeConsulting__Primary { padding: 0 0 0 9.166vw; } .FreeConsulting__PrimaryImage { left: -0.833vw; bottom: -0.416vw; width: 9.166vw; } .FreeConsulting__PrimaryText { width: 43.333vw; } .FreeConsulting__PrimaryText em { padding: 0 0.84vw 0 0; width: 39vw; font-size: 3.16vw; } .FreeConsulting__PrimaryText em:before, .FreeConsulting__PrimaryText em:after { margin: 0 2.1vw; margin-top: -0.8vw; height: 3.3vw; } .FreeConsulting__PrimaryText span { margin: 0 0.25vw; width: 6.6vw; height: 6.6vw; font-size: 4.5vw; } .FreeConsulting__PrimaryText strong { font-size: 4.67vw; } .FreeConsulting__Primary .--PhoneNumber { padding-left: 1.5vw; } .FreeConsulting__Primary .--PhoneNumber a { font-size: 5.92vw; } .FreeConsulting__Primary .--PhoneNumber a:before { margin-right: 0.84vw; font-size: 3.75vw; } .FreeConsulting__SecondaryText { padding: 0.416vw 5vw 1.25vw 0; } .FreeConsulting__Primary .--ReceptionHours { margin: 0 0 0 5.0vw; } .FreeConsulting__Primary .--ReceptionHours, .FreeConsulting__Primary .--Annotation { font-size: 2.0vw; } .FreeConsulting__Text { padding: 2.76vw; width: 86.2vw; border-radius: 0.8vw; } .FreeConsulting__Text p { font-size: 2.5vw; } .FreeConsulting__List { padding: 1.66vw 0 0; } .FreeConsulting__List dt { padding: 1.25vw 0; width: 18.35vw; font-size: 2.0vw; border-radius: 0.8vw; } .FreeConsulting__Button a { padding: 1.66vw 5vw 1.66vw 5.8vw; font-size: 2.34vw; border-bottom-width: 0.35vw; } .FreeConsulting__Button a:after { margin-left: 0.84vw; font-size: 1.85vw; } } @media screen and (max-width: 600px) { .Body__FreeConsulting { padding: 5vw 0 5vw; } .FreeConsulting { width: 90%; } .FreeConsulting__Primary { margin: 0 !important; padding: 0 0 0 16vw; } .FreeConsulting__PrimaryImage { left: 0; bottom: -4vw; width: 16%; } .FreeConsulting__PrimaryText { width: 100%; } .FreeConsulting__PrimaryText em { font-size: 2.4rem; } .FreeConsulting__PrimaryText em:before, .FreeConsulting__PrimaryText em:after { margin: 0 3vw; margin-top: -1vw; width: 0.1vw; height: 5vw; } .FreeConsulting__PrimaryText span { margin: 0 0.5vw; width: 10vw; height: 10vw; font-size: 3.4rem; } .FreeConsulting__PrimaryText strong { font-size: 3.5rem; } .FreeConsulting__Primary .--PhoneNumber { padding: 0 3vw; } .FreeConsulting__Primary .--PhoneNumber a { font-size: 4.4rem; } .FreeConsulting__Primary .--PhoneNumber a:before { margin-right: 2vw; font-size: 3.0rem; } .FreeConsulting__SecondaryText { flex-direction: column; padding: 0 6vw 2vw 0; } .FreeConsulting__Primary .--ReceptionHours, .FreeConsulting__Primary .--Annotation { margin: 0; font-size: 1.4rem; } .FreeConsulting__Text { padding: 3.5vw 3%; border-radius: 5px; } .FreeConsulting__Text p { font-size: 1.9rem; line-height: 1.3; } .FreeConsulting__List { flex-wrap: wrap; padding: 3vw 0 0; } .FreeConsulting__List dt { padding: 2vw 0; width: 32%; font-size: 1.6rem; line-height: 1.25; border-radius: 5px; } .FreeConsulting__Button { padding: 3vw 0 0; width: 100%; } .FreeConsulting__Button a { justify-content: center; margin: 0 20%; padding: 3vw 0 3vw 2vw; width: 60%; font-size: 1.9rem; border-bottom: 2px solid #d73400; } .FreeConsulting__Button a:after { margin-left: 2vw; font-size: 1.4rem; } } /* フロントページ：ご相談の多いメニュー ======================================================== */ .Body__PopularMenu { display: flex; flex-direction: column; margin: 0 auto; padding: 80px 0; width: 100%; background-repeat: repeat; background-position: center top; background-size: 5px auto; } .PopularMenu { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; padding: 0; width: 1100px; } .PopularMenu__Item { display: flex; flex-direction: column; margin: 0 0 30px; padding: 0; width: 530px; background: #fff; border-width: 3px; border-style: solid; border-radius: 20px; } .PopularMenu__Primary { display: flex; align-items: stretch; border-radius: 15px 15px 0 0; } .PopularMenu__Image { display: flex; align-items: center; width: 90px; background: none; } .PopularMenu__Image:before { padding-top: 111%; } .PopularMenu__Shoulder { display: flex; justify-content: center; align-items: center; width: 440px; color: #fff; font-size: 2.3rem; font-weight: 700; line-height: 1.1; text-align: center; } .PopularMenu__Secondary { position: relative; flex-grow: 1; display: flex; justify-content: center; flex-direction: column; padding: 0 5%; width: 90%; min-height: 150px; } .PopularMenu__Name { position: relative; z-index: 1; padding: 10px 0; font-size: 3.5rem; font-weight: 700; line-height: 1.1; } .PopularMenu__Item:nth-of-type(4) .PopularMenu__Name { padding-bottom: 0; } .PopularMenu__Price { color: #d50711; font-size: 4.7rem; font-weight: 700; line-height: 1; } .PopularMenu__Price span { font-size: 3.8rem; } .PopularMenu__Price small { font-size: 3.5rem; } .PopularMenu__Price em { color: #d50711; font-style: normal; } .PopularMenu__Icon { position: absolute; top: 15px; right: 15px; display: inline-block; width: 80px; } .PopularMenu__Icon img { width: 100%; height: auto; } .PopularMenu__Button { display: flex; padding: 10px 0 20px; } .PopularMenu__Button a { padding: 15px 0; width: 330px; font-size: 2.2rem; font-weight: 700; } .PopularMenu__Button a:after { font-size: 1.8rem; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__PopularMenu { padding: 6.66vw 0; } .PopularMenu { width: 91.7vw; } .PopularMenu__Item { margin: 0 0 2.5vw; width: 44.2vw; border-width: 0.28vw; border-radius: 1.7vw; } .PopularMenu__Primary { border-radius: 1.25vw 1.25vw 0 0; } .PopularMenu__Image { width: 7.5vw; } .PopularMenu__Shoulder { width: 36.7vw; font-size: 1.92vw; } .PopularMenu__Secondary { padding: 0 2.2vw; width: 39.8vw; min-height: 12.5vw; } .PopularMenu__Name { padding: 0.84vw 0; font-size: 2.92vw; } .PopularMenu__Price { font-size: 3.91vw; } .PopularMenu__Price span { font-size: 3.166vw; } .PopularMenu__Price small { font-size: 2.9vw; } .PopularMenu__Price em { font-size: ; } .PopularMenu__Icon { top: 1.25vw; right: 1.25vw; width: 6.7vw; } .PopularMenu__Button { padding: 0.82vw 0 1.68vw; } .PopularMenu__Button a { padding: 1.25vw 0; width: 27.5vw; font-size: 1.84vw; } .PopularMenu__Button a:after { font-size: 1.5vw; } } @media screen and (max-width: 600px) { .Body__PopularMenu { padding: 8vw 0; } .PopularMenu { flex-direction: column; width: 90%; } .PopularMenu__Item { margin: 0 auto 5vw; width: 100%; border-radius: 10px; } .PopularMenu__Primary { border-radius: 6px 6px 0 0; } .PopularMenu__Image { width: 16%; } .PopularMenu__Shoulder { width: 80%; font-size: 2.0rem; letter-spacing: 0; } .PopularMenu__Secondary { min-height: 23vw; } .PopularMenu__Name { padding: 1.5vw 0; font-size: 2.8rem; } .PopularMenu__Price { font-size: 3.4rem; } .PopularMenu__Price span { font-size: 3.2rem; } .PopularMenu__Price small { font-size: 2.4rem; } .PopularMenu__Price em { font-size: 3.2rem; } .PopularMenu__Icon { top: 3vw; right: 3vw; width: 13vw; } .PopularMenu__Button { padding: 1vw 0 4vw; } .PopularMenu__Button a { padding: 2vw 0; width: 60%; font-size: 1.9rem; } .PopularMenu__Button a:after { font-size: 1.4rem; } .PopularMenu__Item:nth-of-type(1) { border: 2px solid #d73c3c; /*相続登記サポート*/ } .PopularMenu__Item:nth-of-type(2) { border: 2px solid #70ac48; /*相続手続きまるごとサポート*/ } .PopularMenu__Item:nth-of-type(3) { border: 2px solid #4373c5; /*相続放棄サポート*/ } .PopularMenu__Item:nth-of-type(4) { border: 2px solid #7f58b5; /*遺言コンサルティング*/ } .PopularMenu__Item:nth-of-type(5) { border: 2px solid #ed7d31; /*相続不動産のサポート*/ } .PopularMenu__Item:nth-of-type(6) { border: 2px solid #987d4f; /*負動産売却サポート*/ } } /* フロントページ：YouTube ======================================================== */ .Body__YouTube { padding: 70px 0 0; } .YouTube { margin: 0 auto; padding: 0 0 70px; width: 720px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__YouTube { padding: 5.833vw 0 0; } .YouTube { padding: 0 0 5.833vw; width: 60vw; } } @media screen and (max-width: 600px) { .Body__YouTube { padding: 10vw 0 0; } .YouTube { padding: 0 0 10vw; width: 90%; } } /* フロントページ：このようなお悩みはありませんか？ ======================================================== */ .Body__Worries { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 70px 0; width: 100%; } .Worries { display: flex; flex-direction: column; margin: 0 auto !important; padding: 0; width: 900px; } .Worries__Item { position: relative; display: flex; justify-content: flex-start; align-items: center; margin: 0 0 20px; padding: 0; border-width: 1px; border-style: solid; border-radius: 10px; } .Worries__Item:after { position: absolute; z-index: 0; right: 0; top: 50%; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; width: 20px; height: 101%; content: "\f0da"; color: #fff; font-size: 1.8rem; font-family: "Font Awesome 6 Free"; font-weight: bold; border-radius: 0 8px 8px 0; } .Worries__Item a { position: absolute; z-index: 1; display: block; width: 100%; height: 100%; background: #fff; opacity: 0; } .Worries__Item a:hover { opacity: 0.3; } .Worries__Icon { margin: 5px 20px 5px 5px; width: 66px; } .Worries__Icon img { width: 100%; height: auto; } .Worries__Text { font-size: 2.5rem; font-weight: 500; line-height: 1.2; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Worries { padding: 5.85vw 0; } .Worries { width: 75vw; } .Worries__Item { margin: 0 0 1.67vw; border-radius: 0.8vw; } .Worries__Item:after { width: 1.65vw; font-size: 1.5vw; border-radius: 0 0.7vw 0.7vw 0; } .Worries__Icon { margin: 0.42vw 1.66vw 0.42vw 0.42vw; width: 5.5vw; } .Worries__Text { font-size: 2.08vw; } } @media screen and (max-width: 600px) { .Body__Worries { padding: 10vw 0 0; } .Worries { width: 90%; } .Worries__Item { margin: 0 0 4vw; border-radius: 5px; } .Worries__Item a { background: none; opacity: initial; } .Worries__Item a:active { background: #fff; opacity: 0.3; } .Worries__Item:after { width: 4vw; font-size: 1.4rem; border-radius: 0 3px 3px 0; } .Worries__Icon { margin: 2.5vw 2% 2vw; width: 14%; } .Worries__Text { width: 77%; font-size: 2.2rem; } } /* フロントページ：このような方は注意が必要です ======================================================== */ .Body__Attention { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 70px 0; width: 100%; } .Attention { display: flex; flex-direction: column; margin: 0 auto; padding: 0; width: 900px; } .Attention__Item { position: relative; display: flex; justify-content: flex-start; align-items: center; margin: 0 0 20px; padding: 0; border-width: 1px; border-style: solid; border-radius: 10px; } .Attention__Item:after { position: absolute; z-index: 0; right: 0; top: 50%; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; width: 20px; height: 101%; content: "\f0da"; color: #fff; font-size: 1.8rem; font-family: "Font Awesome 6 Free"; font-weight: bold; border-radius: 0 8px 8px 0; } .Attention__Item a { position: absolute; z-index: 1; display: block; width: 100%; height: 100%; background: #fff; opacity: 0; } .Attention__Item a:hover { opacity: 0.3; } .Attention__Icon { margin: 5px 20px 5px 5px; width: 66px; } .Attention__Icon img { width: 100%; height: auto; } .Attention__Text { color: #fff; font-size: 2.5rem; font-weight: 500; line-height: 1.2; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Attention { padding: 5.85vw 0; } .Attention { width: 75vw; } .Attention__Item { margin: 0 0 1.67vw; border-radius: 0.8vw; } .Attention__Item a { background: none; opacity: initial; } .Attention__Item a:active { background: #fff; opacity: 0.3; } .Attention__Item:after { width: 1.65vw; font-size: 1.5vw; border-radius: 0 0.7vw 0.7vw 0; } .Attention__Icon { margin: 0.42vw 1.66vw 0.42vw 0.42vw; width: 5.5vw; } .Attention__Text { font-size: 2.08vw; } } @media screen and (max-width: 600px) { .Body__Attention { padding: 8vw 0; } .Attention { width: 90%; } .Attention__Item { margin: 0 0 4vw; border-radius: 5px; } .Attention__Item:after { width: 4vw; font-size: 1.4rem; border-radius: 0 3px 3px 0; } .Attention__Icon { margin: 2.5vw 2% 2vw; width: 14%; } .Attention__Text { width: 77%; font-size: 2.2rem; } } /* フロントページ：相続手続きの流れ ======================================================== */ .Body__Flow { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 80px 0; width: 100%; } .Flow { position: relative; display: flex; flex-direction: column; margin: 0 auto; padding: 0; width: 900px; } .Flow:before { position: absolute; z-index: 1; left: 35px; top: 50%; transform: translateY(-50%); content: ""; display: inline-block; width: 5px; height: 95%; } .Flow__Item { position: relative; padding: 15px 0; display: flex; justify-content: space-between; align-items: center; counter-increment: flow-num; } .Flow__Item:after { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); content: ""; display: inline-block; width: 100%; height: 1px; background: #d3d3d3; } .Flow__Item:nth-last-of-type(1):after { display: none; } .Flow__Item:before { position: absolute; z-index: 1; left: 0; top: 50%; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; width: 76px; height: 76px; color: #fff; font-size: 2.9rem; font-weight: 500; border-radius: 50%; content: counter(flow-num, decimal-leading-zero); } .Flow__Text { padding: 0 0 0 150px; font-size: 2.6rem; font-weight: 500; line-height: 1.2; } .Flow__Icon { padding: 0 40px 0 0; width: 80px; } .Flow__Icon img { width: 100%; height: auto; } .Body__Flow .--Button { padding: 40px 0 0; } .Body__Flow .--Button a { width: 520px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Flow { padding: 6.7vw 0; } .Flow { width: 75vw; } .Flow:before { left: 2.9vw; width: 0.4vw; height: 65vw; } .Flow__Item { padding: 1.25vw 0; } .Flow__Item:before { width: 6.3vw; height: 6.3vw; font-size: 2.4vw; } .Flow__Text { padding: 0 0 0 12.5vw; font-size: 2.17vw; } .Flow__Icon { padding: 0 3.35vw 0 0; width: 6.67vw; } .Body__Flow .--Button { padding: 3.35vw 0 0; } .Body__Flow .--Button a { width: 43.3vw; } } @media screen and (max-width: 600px) { .Body__Flow { padding: 8vw 0; } .Flow { width: 90%; } .Flow:before { left: 5.5vw; width: 0.8vw; } .Flow__Item { padding: 2.5vw 0; } .Flow__Item:before { width: 12vw; height: 12vw; font-size: 2.3rem; } .Flow__Text { padding: 0 0 0 15vw; width: 55vw; font-size: 2.3rem; } .Flow__Icon { padding: 0; width: 14vw; } .Body__Flow .--Button { padding: 4vw 0 0; width: 86%; } .Body__Flow .--Button a { width: 100%; } } /* フロントページ：相続相談室のご紹介 ======================================================== */ .Body__Introduction { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 80px 0 120px; width: 100%; } .Introduction { display: flex; justify-content: space-between; align-items: center; margin: 0 auto; padding: 0; width: 1100px; border-width: 3px; border-style: solid; border-color: #d8d8d8; border-radius: 20px; } .Introduction__Image { width: 530px; line-height: 0; border-right-width: 3px; border-right-style: solid; border-right-color: #d8d8d8; } .Introduction__Image img { width: 100%; height: auto; border-radius: 16px 0 0 16px; } .Introduction__Text { margin: 0; padding: 30px 25px 30px 5px; width: 540px; } .Introduction__Text h3 { margin: 0; padding: 0 0 30px; color: #139019; font-size: 3.2rem; font-weight: 700; background: none; border: none; } .Introduction__Text ul { margin: 0; padding: 0; } .Introduction__Text ul li { position: relative; margin: 0; padding: 0 0 10px 25px; font-size: 1.9rem; font-weight: 500; line-height: 1.55; letter-spacing: 0; } .Introduction__Text ul li:before { position: absolute; left: 0; top: 0; margin: 10px 0 0; padding: 0 10px; content: "\f111"; font-size: 0.6rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Introduction__Text ul li small { font-size: 1.6rem; } .Introduction__Text p { margin: 0 auto; width: 94%; font-size: 2.0rem; font-weight: 500; line-height: 1.7; } .Introduction__Text p strong { color: #ff9600; font-size: 1.9rem; font-weight: 500; line-height: 1.7; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Introduction { padding: 6.68vw 0 10vw; } .Introduction { width: 91.7vw; border-width: 0.25vw; border-radius: 1.7vw; } .Introduction__Image { width: 44.2vw; border-right-width: 0.25vw; } .Introduction__Image img { border-radius: 1.4vw 0 0 1.4vw; } .Introduction__Text { padding: 2.5vw 2.083vw 2.5vw 0.416vw; width: 45vw; } .Introduction__Text h3 { padding: 0 0 2.5vw; font-size: 2.66vw; } .Introduction__Text p { font-size: 1.666vw; } .Introduction__Text p strong { font-size: 1.59vw; } .Introduction__Text ul li { padding: 0 0 0.83vw 2.1vw; font-size: 1.59vw; } .Introduction__Text ul li:before { margin: 0.83vw 0 0; padding: 0 0.83vw; font-size: 0.5vw; } .Introduction__Text ul li small { font-size: 1.33vw; } } @media screen and (max-width: 600px) { .Body__Introduction { padding: 10vw 0 14vw; } .Introduction { flex-direction: column; width: 90%; border: 2px solid #d8d8d8; border-radius: 10px; } .Introduction__Image { position: relative; display: block; width: 100%; border-right: none; overflow: hidden; object-fit: cover; } .Introduction__Image:before { content: ""; display: block; padding-top: 62%; } .Introduction__Image img { position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; margin: auto; object-fit: cover; border-radius: 8px 8px 0 0; } .Introduction__Text { padding: 6vw 4%; width: 92%; } .Introduction__Text h3 { padding: 0 0 4vw; font-size: 2.3rem; text-align: center; } .Introduction__Text p { font-size: 1.8rem; } .Introduction__Text ul { padding: 0 0 3vw; } .Introduction__Text ul li { padding: 0 0 1vw 5vw; font-size: 1.9rem; line-height: 1.45; } .Introduction__Text ul li:before { padding: 0 2vw; } } /* 代表挨拶 ======================================================== */ .Body__Greeting { margin: 0; padding: 0 0 50px; } .Greeting { display: flex; justify-content: space-between; margin: 0 auto; padding: 0; width: 1100px; } .Greeting__Image { width: 360px; } .Greeting__Image img { width: 100%; height: auto; } .Greeting__Text { margin: 0; padding: 0; width: 700px; } .Greeting__Text p { margin: 0; padding: 0 0 3rem; font-size: 1.8rem; font-weight: 500; line-height: 1.85; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Greeting { padding: 0 0 4.2vw; } .Greeting { width: 91.7vw; } .Greeting__Image { width: 30vw; } .Greeting__Text { width: 58.35vw; } .Greeting__Text p { padding: 0 0 2.5vw; font-size: 1.5vw; } } @media screen and (max-width: 600px) { .Body__Greeting { padding: 0 0 5vw; } .Body__Greeting .--TopHeading { margin-bottom: 10vw !important; } .Greeting { flex-direction: column; width: 90%; } .Greeting__Image { margin: 0 auto 8vw; width: 52%; } .Greeting__Text { width: 100%; } .Greeting__Text p { line-height: 1.55; } } /* フロントページ：相続サポートの特徴・メリット ======================================================== */ .Body__Merit { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 80px 0; width: 100%; } .Merit { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; padding: 0; width: 1100px; } .Merit__Item { position: relative; display: flex; flex-direction: column; margin: 0 0 80px; padding: 65px 0 35px; width: 525px; background: #fff; border-width: 5px; border-style: solid; border-radius: 20px; counter-increment: merit-num; } .Merit__Item:before { position: absolute; top: -43px; left: 50%; transform: translateX(-50%); display: flex; justify-content: center; align-items: center; width: 86px; height: 86px; color: #fff; font-size: 3.0rem; font-weight: 700; border-radius: 50%; content: counter(merit-num, decimal-leading-zero); } .Merit__Text { flex-grow: 1; margin: 0; padding: 0 0 35px 30px; color: #f36e21; font-size: 2.8rem; font-weight: 700; line-height: 1.4; } .Merit__Image { position: relative; display: flex; justify-content: center; height: 350px; } .Merit__Image a { display: block; width: 100%; text-align: center; } .Merit__Image:before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: inline-block; padding: 20px; background: rgba(255,255,255,0.9); content: "\f00e"; font-size: 2.8rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Merit__Image img { width: auto; height: 100%; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Merit { padding: 6.65vw 0; } .Merit { width: 91.7vw; } .Merit__Item { margin: 0 0 6.66vw; padding: 5.45vw 0 2.9vw; width: 43.75vw; border-width: 0.45vw; border-radius: 1.7vw; } .Merit__Item:before { top: -3.57vw; width: 7.2vw; height: 7.2vw; font-size: 2.5vw; } .Merit__Text { padding: 0 0 2.9vw 2.5vw; font-size: 2.33vw; } .Merit__Image { height: 29.2vw; } .Merit__Image:before { padding: 1.65vw; font-size: 2.35vw; } } @media screen and (max-width: 600px) { .Body__Merit { padding: 10vw 0 0; } .Merit { flex-direction: column; padding: 8vw 0 0; width: 90%; } .Merit__Item { margin: 0 0 14vw; padding: 10vw 0 6vw; width: 99%; border-width: 3px; border-style: solid; border-radius: 10px; } .Merit__Item:before { top: -8vw; width: 15vw; height: 15vw; font-size: 2.6rem; } .Merit__Text { padding: 0 0 3vw 0; font-size: 2.4rem; line-height: 1.25; text-align: center; } .Merit__Image { margin: 0 auto; width: 90%; height: auto; } .Merit__Image:before { padding: 5vw; font-size: 3.4rem; pointer-events: none; } .Merit__Image img { width: 100%; height: auto; } } /* フロントページ：解決事例・お客様の声・よくあるご質問 ======================================================== */ .Body__TopNews { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; margin: 0 auto; padding: 80px 0; width: 1100px; } .TopCase, .TopCustomer { display: flex; flex-direction: column; margin: 0; padding: 0; width: 520px; } .TopCase .--TopSubHeading, .TopCustomer .--TopSubHeading { flex-grow: 1; display: flex; justify-content: center; align-items: center; } .TopCase__Item, .TopCustomer__Item { display: flex; width: 100%; } .TopCase__Item a, .TopCustomer__Item a { display: flex; justify-content: flex-start; align-items: center; margin: 0; padding: 35px 0; width: 100%; text-decoration: none; border-bottom: 1px solid #d3d3d3; } .TopCase__Image, .TopCustomer__Image { width: 110px; } .TopCase__Image:before, .TopCustomer__Image:before { padding-top: 100%; } .TopCase__Text, .TopCustomer__Text { padding: 0 0 0 30px; width: 350px; } .TopCase__Text p, .TopCustomer__Text p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 2.2rem; font-weight: 500; line-height: 1.5; } .TopCase__Button, .TopCustomer__Button { display: flex; justify-content: center; margin: 0; padding: 35px 0; width: 100%; } .TopCase__Button p, .TopCustomer__Button p { width: 100%; text-align: center; } .TopCase__Button a, .TopCustomer__Button a { padding: 10px 0; width: 480px; } .TopFaq { display: flex; flex-direction: column; margin: 0; padding: 40px 0; width: 100%; } .TopFaq .--TopSubHeading { margin-bottom: 40px; } .TopFaq ul { display: flex; flex-direction: column; } .TopFaq ul li { counter-increment: faq-num; } .TopFaq ul li { position: relative; display: block; margin: 0; padding: 35px 0 35px 70px; font-size: 2.5rem; font-weight: 500; line-height: 1.35; text-decoration: none; border-bottom: 1px solid #d3d3d3; } .TopFaq ul li:hover { opacity: 0.7; } .TopFaq ul li:before { position: absolute; top: 20px; left: 0; display: flex; justify-content: center; align-items: center; width: 60px; height: 60px; color: #fff; font-size: 2.9rem; font-weight: 700; border-radius: 50%; content: counter(faq-num); pointer-events: none; } .TopFaq ul li:after { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; justify-content: flex-end; align-items: center; padding: 0 20px 0 0; width: 180px; height: 45px; content: "\f138"; font-size: 1.6rem; font-family: "Font Awesome 6 Free"; font-weight: bold; border-width: 2px; border-style: solid; border-radius: 100px; pointer-events: none; color: #f36e21; border-color: #f36e21; } .TopFaq ul li a { position: absolute; top: 0; left: 0; display: flex; justify-content: flex-end; align-items: center; padding: 0 5% 0 0; width: 95%; height: 100%; font-size: 2.0rem; font-weight: 500; text-align: right; text-decoration: none; } .TopFaq__Button { display: flex; justify-content: center; margin: 0; padding: 40px 0 0; } .TopFaq__Button a { padding: 15px 0; width: 480px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__TopNews { padding: 6.66vw 0; width: 91.7vw; } .TopCase, .TopCustomer { width: 43.35vw; } .TopCase__Item a, .TopCustomer__Item a { padding: 2.92vw 0; } .TopCase__Image, .TopCustomer__Image { width: 9.2vw; } .TopCase__Text, .TopCustomer__Text { padding: 0 0 0 2.48vw; width: 30vw; } .TopCase__Text p, .TopCustomer__Text p { font-size: 1.83vw; } .TopCase__Button, .TopCustomer__Button { padding: 2.9vw 0; } .TopCase__Button a, .TopCustomer__Button a { padding: 1.25vw 0; width: 40vw; } .TopFaq { padding: 3.34vw 0; } .TopFaq .--TopSubHeading { margin-bottom: 3.33vw; } .TopFaq ul li { padding: 2.92vw 0 2.92vw 5.8vw; font-size: 2.08vw; } .TopFaq ul li:before { top: 1.66vw; width: 5.0vw; height: 5.0vw; font-size: 2.4vw; } .TopFaq ul li:after { padding: 0 1.67vw 0 0; width: 15vw; height: 3.75vw; font-size: 1.33vw; border-width: 0.2vw; } .TopFaq ul li a { font-size: 1.67vw; } .TopFaq__Button { padding: 3.35vw 0 0; } .TopFaq__Button a { padding: 1.25vw 0; width: 40vw; } } @media screen and (max-width: 600px) { .Body__TopNews { flex-direction: column; padding: 10vw 0; width: 90%; } .TopCase, .TopCustomer { width: 100%; } .TopCase__Item a, .TopCustomer__Item a { padding: 6vw 0; } .TopCase__Image, .TopCustomer__Image { width: 20%; } .TopCase__Text, .TopCustomer__Text { padding: 0 0 0 5%; width: 75%; } .TopCase__Text p, .TopCustomer__Text p { font-size: 1.9rem; } .TopCase__Button, .TopCustomer__Button { padding: 6vw 0; } .TopCase__Button p, .TopCustomer__Button p { line-height: 1.0; } .TopCase__Button a, .TopCustomer__Button a { padding: 3vw 0; width: 90%; } .TopFaq { padding: 2vw 0; } .TopFaq .--TopSubHeading { margin-bottom: 4vw; } .TopFaq ul li { padding: 4vw 0 15vw 12vw; font-size: 2.1rem; } .TopFaq ul li:before { top: 5vw; width: 10vw; height: 10vw; font-size: 2.4rem; } .TopFaq ul li:after { top: initial; bottom: 3vw; left: 50%; transform: translateX(-50%); padding: 0.5vw 10vw 0.5vw 0; width: 46%; height: 7vw; font-size: 1.4rem; text-align: center; border-width: 1px; } .TopFaq ul li a { justify-content: center; align-items: flex-end; padding: 0; width: 100%; font-size: 1.9rem; line-height: 3.7; } .TopFaq__Button { padding: 5vw 0 0; } .TopFaq__Button a { padding: 3vw 0; width: 90%; } } /* フロントページ：相続がわかるコラム ======================================================== */ .TopColumn { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; padding: 80px 0; width: 1100px; } .TopColumn .--TopHeading { margin-bottom: 40px; } .TopColumn .--TopSubHeading { margin-bottom: 30px; } .TopColumn__Item { display: flex; flex-direction: column; align-items: flex-start; flex-wrap: wrap; margin: 0 0 50px; padding: 0; width: 520px; } .TopColumn__Heading { position: relative; display: flex; justify-content: center; margin: 0; padding: 15px 0; width: 100%; font-size: 2.6rem; font-weight: 700; background: none; border: 1px solid #898989; } /* .TopColumn__Item > div { display: flex; flex-direction: column; margin: 0; padding: 0; width: 100%; } */ .TopColumn__Acd { display: flex; flex-direction: column; margin: 0; padding: 0; width: 100%; } .TopColumn__Acd article { display: flex; } .TopColumn__Item article a { display: flex; justify-content: flex-start; align-items: center; margin: 0; padding: 15px 0; width: 100%; text-decoration: none; border-bottom: 1px solid #d3d3d3; } .TopColumn__Image { width: 110px; } .TopColumn__Image:before { padding-top: 100%; } .TopColumn__Text { padding: 0 0 5px 30px; width: 350px; } .TopColumn__Text span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; font-size: 2.2rem; font-weight: 500; line-height: 1.5; } @media only screen and (min-width:600px) and (max-width:1200px) { .TopColumn { padding: 6.67vw 0; width: 91.7vw; } .TopColumn .--TopHeading { margin-bottom: 3.33vw; } .TopColumn .--TopSubHeading { margin-bottom: 2.5vw; } .TopColumn__Item { margin: 0 0 4.2vw; width: 43.35vw; } .TopColumn__Heading { padding: 1.25vw 0; font-size: 2.17vw; } .TopColumn__Item article a { padding: 2.92vw 0; } .TopColumn__Image { width: 9.2vw; } .TopColumn__Text { padding: 0 0 0.45vw 2.48vw; width: 30vw; } .TopColumn__Text span { font-size: 1.83vw; } } @media screen and (max-width: 600px) { .TopColumn { flex-direction: column; padding: 10vw 0; width: 100%; } .TopColumn .--TopHeading { margin-bottom: 0 !important; } .TopColumn .--TopSubHeading { margin: 6vw 0 4vw; } .TopColumn__Item { margin: 0 0 4vw; width: 100%; } .TopColumn__Heading { padding: 2vw 0; font-size: 2.2rem; } .TopColumn__Heading .--BtnAcd { position: absolute; display: flex; justify-content: flex-end; align-items: center; width: 100%; height: 100%; cursor: pointer; white-space: nowrap; overflow: hidden; right: 0; top: 50%; transform: translateY(-50%); } .TopColumn__Heading .--BtnAcd:after { content: "\f107"; margin-right: 4vw; font-size: 2.2rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .TopColumn__Heading .--BtnAcd.Selected:after { content: "\f106"; } .TopColumn__Acd { display: none; } .TopColumn__Item article a { padding: 3vw 0; } .TopColumn__Image { width: 20%; } .TopColumn__Text { padding: 0 0 0 5%; width: 75%; } .TopColumn__Text span { font-size: 2.0rem; } } /* フッター　 ======================================================== */ .Body__Footer { margin: 0 auto; padding: 0; width: 100%; } .Body__FooterNavi { display: flex; justify-content: center; margin: 0 auto; padding: 40px 0 0; width: 100%; } .FooterNavi { display: flex; flex-direction: column; align-items: flex-end; flex-wrap: wrap; margin: 0 auto 50px; width: 1000px; height: 200px; } .FooterNavi li { display: flex; align-items: flex-start; padding: 0 0 15px; width: 230px; } .FooterNavi li.--First { margin-bottom: 30px; } .FooterNavi li.--Second { margin-bottom: 20px; } .FooterNavi li.--Third { margin-bottom: 20px; } .FooterNavi li:before { display: flex; margin: 2px 10px 0 0; content: "\f054"; font-size: 1.2rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .FooterNavi li a { display: block; width: 100%; font-size: 1.5rem; text-decoration: none; } .Body__FooterInfo { margin: 0 auto; padding: 0 0 80px; width: 100%; } .FooterInfo { align-items: stretch !important; } .FooterInfo__Primary { /* justify-content: center; */ padding: 20px 0 20px 20px; width: 560px; background: #fff; } .FooterInfo__Primary p { font-size: 1.4rem; line-height: 2; letter-spacing: 0; } .FooterInfo__Primary .--Management { display: inline-block; padding: 0 0 10px; font-size: 2.0rem; font-weight: 500; line-height: 1.3; } .FooterInfo__Primary .--OfficeSummary { display: flex; flex-direction: column; margin: 0; padding: 20px 0; } .FooterInfo__Primary .--OfficeSummary dt { margin: 0; padding: 0 0 5px; font-size: 1.6rem; font-weight: 700; } .FooterInfo__Primary .--OfficeSummary dd { position: relative; margin: 0; padding: 0 0 15px 45px; font-size: 1.4rem; } .FooterInfo__Primary .--OfficeSummary dd:before { position: absolute; left: 0; top: 0; content: "住所："; } .FooterInfo__Primary .--Management span { display: none; } .FooterInfo__Primary .--Address { line-height: 1.4; } .FooterInfo__Primary .--Address:before { content: "住所："; } .FooterInfo__Primary .--Address span { display: inline; } .FooterInfo__Primary .--PhoneNumber:before { content: "電話："; } .FooterInfo__Primary .--PhoneNumber a { font-family: "M PLUS Rounded 1c", "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica, sans-serif; text-decoration: none; pointer-events: none; } .FooterInfo__Secondary { width: 420px; margin: 0; padding: 0; background: #fff; } .FooterInfo__Secondary ul { display: flex; flex-direction: column; margin: 0; padding: 0; width: 100%; height: 100%; } .FooterInfo__Secondary ul li { display: flex; flex-direction: column; margin: 0; padding: 0; width: 100%; height: 100%; } .FooterInfo__Secondary ul li strong { display: flex; margin: 0; padding: 10px 0; font-size: 1.4rem; font-weight: 500; } .FooterInfo__Secondary ul li iframe { width: 100%; height: 100%; border: none; } .FooterInfo__List { display: flex; justify-content: space-between; } .FooterInfo__List li { display: flex; margin: 30px 25px 0 0; } .FooterInfo__List li figure { width: 260px; } .FooterInfo__List li figure img { width: 100%; height: auto; } .FooterInfo__List a { display: flex; flex-direction: column; align-items: center; font-size: 1.6rem; } .Footer { display: flex; justify-content: space-between; align-items: flex-start !important; margin: 0 auto; padding: 0; width: 1000px; } .Footer__Primary { display: flex; flex-direction: column; padding: 25px 0; width: 500px; } .Footer__PrimarySitename { margin: 0 0 10px !important; padding: 0 20px 10px 10px; width: 410px; background-color: #fff; border-radius: 10px; } .Footer__PrimaryText { margin: 0; padding: 10px 5px; min-width: 450px; font-size: 1.3rem; font-weight: 400; line-height: 1; letter-spacing: 0; } .Footer__Primary .--SitenameImage { width: 100%; } .Footer__Primary .--SitenameImage img { width: 100%; height: auto; } .Footer__Primary .--SitenameText { margin: 0; padding: 10px 0; color: #fff; font-size: 3.2rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1; } .Footer__Primary .--SitenameText a { color: #fff; text-decoration: none; } .Footer__Primary .--SitenameText a strong, .Footer__Primary .--SitenameText a em { color: #fff; font-style: normal; } .Footer__Primary .--Management { margin: 0; padding: 0 0 10px; color: #fff; font-size: 1.3rem; font-weight: 500; letter-spacing: 0; line-height: 1; } .Footer__Primary .--Management:before { content: "運営："; } .Footer__Primary .--Address { color: #fff; font-size: 1.4rem; font-weight: 400; letter-spacing: 0; line-height: 1.35; } .Footer__Primary .--Address span { display: inline; } .Footer__Secondary { display: flex; flex-direction: column; align-items: center; margin: 20px 0 0 !important; padding: 15px; border: 1px solid #fff; border-radius: 10px; } .Footer__Secondary .--PhoneNumber { padding: 5px 0; font-size: 5.6rem; font-weight: 700; line-height: 1; } .Footer__Secondary .--PhoneNumber a { display: flex; color: #fff; text-decoration: none; letter-spacing: 0; pointer-events: none; } .Footer__Secondary .--PhoneNumber a:before { display: flex; align-items: center; margin-right: 10px; content: "\f098"; font-size: 5.0rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Footer__SecondaryText { display: flex; align-items: center; } .Footer__SecondaryText .--ReceptionHours { display: flex; align-items: center; color: #fff; font-size: 1.2rem; font-weight: 400; line-height: 1; } .Footer__SecondaryText .--ReceptionHours:before { content: "受付時間"; display: flex; margin: 0 10px 0 0; padding: 5px; background: #fff; } .Footer__SecondaryText .--Annotation { padding-left: 10px; color: #fff; font-size: 1.2rem; font-weight: 400; line-height: 1; } .Copyright { display: flex; justify-content: center; margin: 0 auto; padding: 10px 0; width: 100%; } .Copyright p { color: #fff; font-size: 1.1rem; font-weight: 400; letter-spacing: 0; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__FooterNavi { padding: 3.34vw 0 0; } .FooterNavi { margin: 0 auto 4.166vw; width: 83.333vw; height: 16.666vw; } .FooterNavi li { padding: 0 0 1.25vw; width: 19.166vw; } .FooterNavi li.--First { margin-bottom: ; } .FooterNavi li.--Second { margin-bottom: 1.666vw; } .FooterNavi li.--Third { margin-bottom: 1.666vw; } .FooterNavi li:before { margin: 0.17vw 0.84vw 0 0; font-size: 1vw; } .FooterNavi li a { font-size: 1.25vw; } .Body__FooterInfo { padding: 0 0 6.66vw; } .FooterInfo__Primary { padding: 1.666vw 0 1.666vw 1.666vw; width: 46.666vw; } .FooterInfo__Primary p { font-size: 1.166vw; } .FooterInfo__Primary .--Management { padding: 0 0 0.833vw; font-size: 1.666vw; } .FooterInfo__List li { margin: 2.5vw 2.083vw 0 0; } .FooterInfo__List a { font-size: 1.333vw; min-height: ; } .FooterInfo__List li figure { width: 21.666vw; } .FooterInfo__Secondary { width: 35vw; } .FooterInfo__Secondary ul li { /* margin: 0 1.67vw 0 0; width: 23.35vw; */ } .FooterInfo__Secondary ul li strong { padding: 0.83vw 0; font-size: 1.17vw; } .FooterInfo__Secondary ul li iframe { height: ; } .Footer { width: 83.4vw; } .Footer__Primary { padding: 2.083vw 0; width: 41.666vw; } .Footer__PrimarySitename { margin: 0 0 0.833vw !important; padding: 0 1.666vw 0.833vw 0.833vw; width: 34.166vw; border-radius: 0.833vw; } .Footer__PrimaryText { padding: 0.42vw; min-width: 37.5vw; font-size: 1.08vw; } .Footer__Primary .--Sitename { padding: 0.83vw 0; font-size: 2.67vw; } .Footer__Primary .--Management { padding: 0 0 0.833vw; font-size: 1.083vw; } .FooterInfo__Primary .--OfficeSummary { padding: 1.67vw 0; } .FooterInfo__Primary .--OfficeSummary dt { padding: 0 0 0.42vw; font-size: 1.33vw; } .FooterInfo__Primary .--OfficeSummary dd { padding: 0 0 1.25vw 3.75vw; font-size: 1.17vw; } .Footer__Primary .--Address, .Footer__Primary .--Address2 { font-size: 1.166vw; } .Footer__PrimaryAddress { font-size: 1.17vw; } .Footer__Secondary { padding: 1.25vw; border-radius: 0.8vw; } .Footer__Secondary .--PhoneNumber { padding: 0.42vw; font-size: 4.66vw; } .Footer__Secondary .--PhoneNumber a:before { margin-right: 0.84vw; font-size: 4.15vw; } .Footer__SecondaryText .--ReceptionHours { font-size: 1.0vw; } .Footer__SecondaryText .--ReceptionHours:before { margin: 0 0.83vw 0 0; padding: 0.42vw; } .Footer__SecondaryText .--Annotation { font-size: 1vw; } .Copyright { padding: 0.83vw 0; } .Copyright p { font-size: 0.92vw; } } @media screen and (max-width: 600px) { .Body__Footer { margin-bottom: 20vw; } .Body__FooterNavi { display: none; } .FooterNavi { /* column-count: 2; column-width: 43vw; */ display: flex; flex-wrap: wrap; width: 90vw; } .FooterNavi li { margin-right: 2vw; padding: 0 0 4vw; width: 43vw; min-height: initial; } .FooterNavi li.--First { margin-bottom: 0; } .FooterNavi li.--Second { margin-bottom: 0; } .FooterNavi li.--Third { margin-bottom: 0; } .FooterNavi li:nth-child(even) { margin-right: 0; } .FooterNavi li:before { margin: 0.7vw 2vw 0 0; } .FooterNavi li a { width: 100%; font-size: 1.8rem; } .Body__FooterInfo { padding: 6vw 0 2vw; } .FooterInfo { flex-direction: column; margin: 0 auto !important; width: 90%; } .FooterInfo__Primary { margin-bottom: 0 !important; padding: 5vw; width: initial; } .FooterInfo__Primary p { font-size: 1.6rem; line-height: 1.8; } .FooterInfo__Primary .--Management { padding-bottom: 4vw; font-size: 2.2rem; } .FooterInfo__Primary .--Address { position: relative; padding: 0 0 2vw 10vw; line-height: 1.15; } .FooterInfo__Primary .--Address:before { position: absolute; top: 0; left: 0; } .FooterInfo__Primary .--Address span { } .FooterInfo__Primary .--PhoneNumber { padding: 0 0 2vw; } .FooterInfo__Primary p span + br { display: none; } .FooterInfo__Primary .--OfficeSummary { padding: 0 0 2vw; } .FooterInfo__Primary .--OfficeSummary dt { padding: 0 0 2vw; font-size: 1.8rem; } .FooterInfo__Primary .--OfficeSummary dd { padding: 0 0 3vw 11vw; font-size: 1.7rem; } .FooterInfo__List { flex-wrap: wrap; padding-top: 4vw; width: 100%; } .FooterInfo__List li { /* margin: 0; width: 48%; */ margin: 0 auto; width: 74%; } .FooterInfo__List li:first-child { margin-bottom: 0; } .FooterInfo__List a { font-size: 1.6rem; } .FooterInfo__List li figure { margin-bottom: 1vw; width: 86%; } .FooterInfo__Secondary { width: 100%; background: none; } .FooterInfo__Secondary ul { flex-direction: column; width: 100%; } .FooterInfo__Secondary ul li { margin: 0 0 5vw; width: 100%; } .FooterInfo__Secondary ul li strong { padding: 0 0 2vw; font-size: 1.8rem; } .FooterInfo__Secondary ul li iframe { height: 60vw; /* GoogleMap */ } .Footer { flex-direction: column; align-items: center !important; padding: 5vw 0; width: 100%; } .Footer__Primary { padding: 0; width: 90%; } .Footer__PrimarySitename { margin: 0 0 4vw !important; padding: 0 2vw 1vw; width: 90vw; border-radius: 5px; } .Footer__Primary .--SitenameImage { width: 97%; } .Footer__PrimaryText { padding: 1.5vw 2%; min-width: 76%; font-size: 1.3rem; } .Footer__Primary .--Sitename { padding: 3vw 0; font-size: 3.0rem; } .Footer__Primary .--Management { padding: 0 0 3vw; font-size: 1.5rem; } .Footer__Primary .--Address span { display: block; } .Footer__Secondary { padding: 0; width: 80%; border-radius: 5px; } .Footer__Secondary .--PhoneNumber { padding: 2vw 0 1vw; font-size: 4.6rem; } .Footer__Secondary .--PhoneNumber a:before { margin-right: 3vw; font-size: 3.6rem; } .Footer__SecondaryText { padding: 0 0 2vw; } .Footer__SecondaryText .--ReceptionHours, .Footer__SecondaryText .--Annotation { font-size: 1.3rem; } .Footer__SecondaryText .--ReceptionHours:before { margin: 0 2vw 0 0; padding: 0.7vw 1vw; } .Footer__SecondaryText .--Annotation { padding-left: 1vw; } .Copyright { padding: 2.5vw 0; } } /* サイドフローティング　 ======================================================== */ .SideFloating { position: fixed; z-index: 101; right: 0; top: 120px; display: flex; flex-direction: column; width: 60px; } .editor-styles-wrapper .is-root-container .SideFloating { position: initial; } .SideFloating li { writing-mode: vertical-rl; -ms-writing-mode: tb-rl; text-orientation: upright; margin: 0 0 5px; padding: 0; } .SideFloating li a { display: block; margin: 0; padding: 15px 10px; color: #fff; font-size: 1.6rem; text-decoration: none; border-radius: 5px 0 0 5px; } .SideFloating li a i { padding-bottom: 5px; } .SideFloating li a:hover { opacity: 1; filter: brightness(1.1); } .SideFloating li:nth-child(1) a { background: #f36e21; } .SideFloating li:nth-child(2) a { background: #73c864; } .SideFloating li:nth-child(3) a { background: #303a74; } .SideFloating li:nth-child(4) a { background: #e0b744; } @media only screen and (min-width:600px) and (max-width:1200px) { .SideFloating { top: 10vw; width: 5vw; } .SideFloating li { margin: 0 0 0.4vw 0; } .SideFloating li a { padding: 1.25vw 0.84vw; font-size: 1.33vw; border-radius: 0.4vw 0 0 0.4vw; } .SideFloating li a i { padding-bottom: 0.42vw; } } @media screen and (max-width: 600px) { .SideFloating { display: none !important; } } /* フローティングフッター（SP）　 ======================================================== */ .FloatingFooter { display: none !important; } .editor-styles-wrapper .is-root-container .FloatingFooter { display: block !important; } @media screen and (max-width: 600px) { .FloatingFooter { position: fixed; z-index: 99; bottom: 0; display: flex !important; flex-direction: column; align-items: center; margin: 0; padding: 0; width: 100%; background: #fff; } .FloatingFooter__Heading { margin: 0; padding: 2vw 0 1vw; width: 100%; text-align: center; } .FloatingFooter__Heading strong { display: block; font-size: 2.0rem; font-weight: 500; font-style: normal; line-height: 1; text-align: center; } .FloatingFooter__Heading strong:before, .FloatingFooter__Heading strong:after { position: relative; display: inline-block; content: ""; margin: 0 3vw; margin-top: -1vw; width: 0.1vw; height: 5vw; vertical-align: middle; background-color: #ed7255; } .FloatingFooter__Heading strong:before { transform: rotate(-30deg); } .FloatingFooter__Heading strong:after { transform: rotate(30deg); } .FloatingFooter__List { display: flex; justify-content: space-between; margin: 0; padding: 0; width: 100%; } .FloatingFooter__List li { display: flex; width: 100%; } .FloatingFooter__List li a { display: flex; justify-content: center; align-items: center; margin: 0; padding: 3vw 0; width: 100%; color: #fff; font-size: 1.9rem; font-weight: 500; letter-spacing: 0; text-decoration: none; } .FloatingFooter__List li a i, .FloatingFooter__List li a strong { margin-right: 1vw; } .FloatingFooter__List li:nth-child(1) a i { font-size: 1.8rem; } .FloatingFooter__List li:nth-child(2) a i { font-size: 2.4rem; } .FloatingFooter__List li:nth-child(3) a i { font-size: 2.4rem; } } /* インラインコンテンツ（SP）　 ======================================================== */ .Inline { display: none !important; } .editor-styles-wrapper .is-root-container .Inline { display: block; } @media screen and (max-width: 600px) { .Inline__Item { margin: 0; padding: 8vw 0 0; text-align: center; } .Inline__Item p { margin: 0; padding: 0 0 5vw; width: 100%; font-size: 1.9rem; font-weight: 500; line-height: 1.65; } .Inline__Button a { position: relative; display: inline-block; margin: 0 auto; padding: 2.5vw 0; width: 86%; color: #fff; font-size: 2.4rem; font-weight: 700; text-decoration: none; text-align: center; border-radius: 100px; } .Inline__Button a:after { position: absolute; right: 5vw; top: 50%; transform: translateY(-50%); display: inline-block; content: '\f138'; font-size: 1.6rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Inline__Button.--Mail a { background: linear-gradient(to bottom, #9b9182, #837154); } .Inline__Button.--Line a { background: linear-gradient(to bottom, #6ed26e, #10cb10); } .Inline__Button.--Consulting a { background: linear-gradient(to bottom, #d73801, #a92a00); } } /* PageTop ======================================================== */ .PageTop { position: fixed; bottom: 90px; right: 40px; z-index: 99; } .PageTop__Button { position: relative; display: inline-block; width: 60px; height: 60px; background: #333; border-radius: 50%; opacity: 0.7; } .PageTop__Button:before { position: absolute; display: inline-block; top: 50%; left: 50%; transform: translate(-50%, -50%); content: "\f077"; color: #fff; font-size: 2.4rem; font-family: "Font Awesome 6 Free"; font-weight: bold; line-height: 0.9; text-align: center; } .PageTop__Button:hover { background: #666; /* filter:brightness(1.1); -webkit-filter:brightness(1.1); -moz-filter:brightness(1.1); filter:brightness(1.1); */ } @media only screen and (min-width:600px) and (max-width:1200px) { .PageTop { bottom: 7.5vw; right: 3.33vw; } .PageTop__Button { width: 5vw; height: 5vw; } .PageTop__Button:before { font-size: 2vw; } } @media screen and (max-width: 600px) { .PageTop { position: fixed; bottom: 22vw; right: 2vw; z-index: 99; } .PageTop__Button { position: relative; display: inline-block; width: 15vw; height: 15vw; background: #666; border-radius: 50%; opacity: 0.7; } .PageTop__Button:before { position: absolute; display: inline-block; top: 53%; left: 50%; transform: translate(-50%, -47%); content: "PAGE\ATOP"; white-space: pre; color: #fff; font-size: 1.4rem; font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3",sans-serif; line-height: 1.15; text-align: center; } } /* 下層固定ページ ======================================================== */ .Body__TwoColumns { display: flex; justify-content: space-between; flex-direction: row-reverse; align-items: flex-start; margin: 0 auto; padding: 60px 0; width: 1100px; } .Body__Sidebar { margin: 0; padding: 0; width: 230px; } .Body__Page { margin: 0; padding: 0; width: 840px; } .Body__PageTitle { position: relative; display: flex; justify-content: center; align-items: center; margin: 0; padding: 0; /* min-height: 200px; background: #fffaed; overflow: hidden; */ } .Body__PageTitleBg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: auto; height: auto; min-width: 100%; min-height: 100%; max-width: inherit; } .BreadCrumbs { position: absolute; z-index: 1; top: 0; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; margin: 0 auto; padding: 10px 0; width: 1100px; font-size: 1.2rem; white-space: nowrap; } .BreadCrumbs dt { display: flex; align-items: center; overflow-x: auto; margin-right: 10px; } .BreadCrumbs dt { --sb-track-color: #999; --sb-thumb-color: #e6e6e6; --sb-size: 5px; } .BreadCrumbs dt::-webkit-scrollbar { height: var(--sb-size) } .BreadCrumbs dt::-webkit-scrollbar-track { background: var(--sb-track-color); border-radius: 3px; } .BreadCrumbs dt::-webkit-scrollbar-thumb { background: var(--sb-thumb-color); border-radius: 3px; } .BreadCrumbs .searchform > div { display: flex; } .BreadCrumbs .searchform label { display: none; } .BreadCrumbs .searchform input[type="text"] { -webkit-appearance: initial; appearance: none; padding: 8px; text-decoration: unset !important; border: 1px solid #dbdbdb; } .BreadCrumbs .searchform input[type="submit"] { margin-left: 10px; color: #fff; font-size: 1.4rem; background: #717171; border: none; white-space: nowrap; } .BreadCrumbs .searchform input[type="submit"]:hover { cursor: pointer; opacity: 0.7; } .PageTitle { position: relative; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 0 auto; padding: 50px 0; width: 1100px; } .PageTitle__Primary { display: flex; flex-direction: column; margin: 0 auto; width: 100%; } .PageTitle__PrimaryHeading { margin: 0 auto; padding: 20px 0; color: #ff7d00; font-size: 4.0rem; font-weight: 700; line-height: 1.3; text-align: center; } .PageTitle__Secondary, .PageTitle__Secondary p { margin: 0 auto; width: 100%; font-size: 2.0rem; font-weight: 500; line-height: 1.5; text-align: center; } .ReleaseUpdate { display: flex; align-items: center; margin: 0; padding: 0 0 20px; color: #666; font-size: 1.4rem; } .ReleaseUpdate dt { padding: 0 20px 20px 0; } .ReleaseUpdate dd { padding: 0 0 20px 0; } .ReleaseUpdate i { padding-right: 5px; } .Body__Top img, .Body__Page img, .Body__Single img { max-width: 100%; height: auto; } .Body__Page iframe { max-width: 100%; } .Body__Page img, .Body__Page iframe, .Body__Page p, .Body__Archive p, .Body__Single p { margin-bottom: 3rem; } .Body__Page iframe, .Body__Single iframe { max-width: 100%; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__TwoColumns { padding: 5vw 0; width: 91.7vw; } .Body__Sidebar { width: 19.2vw; } .Body__Page { width: 70vw; } .Body__PageTitle { /* min-height: 16.7vw; */ } .BreadCrumbs { padding: 0.85vw 0; width: 91.7vw; font-size: 1vw; } .BreadCrumbs dt { margin-right: 0.83vw; } .BreadCrumbs dt { --sb-size: 0.42vw; } .BreadCrumbs .searchform input[type="text"] { padding: 0.67vw; } .BreadCrumbs .searchform input[type="submit"] { margin-left: 0.85vw; font-size: 1.18vw; } .PageTitle { padding: 4.15vw 0; width: 91.7vw; } .PageTitle__PrimaryHeading { padding: 1.65vw 0; font-size: 3.33vw; } .PageTitle__Secondary, .PageTitle__Secondary p { font-size: 1.67vw; } .ReleaseUpdate { padding: 0 0 1.7vw; font-size: 1.17vw; } .ReleaseUpdate dt { padding: 0 1.5vw 1.5vw 0; } .ReleaseUpdate dd { padding: 0 0 1.5vw 0; } .ReleaseUpdate i { padding-right: 0.4vw; } .Body__Page img, .Body__Page iframe, .Body__Page p, .Body__Archive p, .Body__Single p { margin-bottom: 2.5vw; } } @media screen and (max-width: 600px) { .Body__TwoColumns { flex-direction: column; padding: 0; width: 100%; } .Body__Sidebar { display: none; } .Body__Page { margin: 0 calc(50% - 50vw); padding: 6vw 5vw; width: 90vw; background: #fff; } .Body__PageTitle { padding: 0 0 8vw; width: 100%; /* min-height: 24vw; */ } .BreadCrumbs { padding: 0; width: 90%; } .BreadCrumbs dt { padding: 2vw 0 1vw; width: 100%; overflow-x: auto; } .BreadCrumbs dd { display: none; } .PageTitle { padding: 6vw 0 2vw; width: 90%; } .PageTitle__PrimaryHeading { padding: 1.8vw 0; width: 100%; font-size: 2.8rem; } .PageTitle__Secondary, .PageTitle__Secondary p { margin: 0 auto; width: 90%; font-size: 2.0rem; } .ReleaseUpdate { padding: 0 0 4vw; } .ReleaseUpdate dt { padding: 0 4vw 4vw 0; } .ReleaseUpdate dd { padding: 0 0 4vw 0; } .Modal .Sidebar__Menu { margin: 0 auto 3vw; } .Modal .Sidebar__Menu li:last-child a { border-bottom: 1px solid #e2e2e2; } .Modal .Sidebar__Menu li a { position: relative; padding: 3vw 2vw; font-size: 1.9rem; } .Modal .Sidebar__Menu li a:before { display: none; } .Modal .Sidebar__Menu li a:after { position: absolute; z-index: 0; right: 1vw; top: 50%; transform: translateY(-50%); content: " \f054"; font-size: 1.3rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } } /* サイトマップ ======================================================== */ .simple-sitemap-container h3 { padding: 1rem 1rem; white-space: nowrap; font-size: 1.6rem; font-weight: 500 !important; background: none; border: none; } .simple-sitemap-container h3:before { display: none; } .simple-sitemap-container.tab-enabled label { margin-bottom: -1px !important; background-color: #f4f4f4; } /* Default tab */ .simple-sitemap-container.tab-enabled input:checked + label > * { position: relative; z-index: 1; background-color: #fff; border: 1px solid #ddd; border-bottom: none; border-radius: 4px 4px 0 0; } /* Current tab */ .simple-sitemap-container.tab-enabled input:checked + label { background-color: initial !important; } .simple-sitemap-wrap { padding: 0 0 2rem; } .simple-sitemap-container ul { margin: 0 auto !important; width: 94%; } .simple-sitemap-container ul li { margin-left: 0; padding-bottom: 0; list-style: none; } .sitemap-item { margin: 3rem 0 0; } .sitemap-item a { display: block; padding: 0.2rem 1rem; background: #faf8f2; border: 1px solid #cacaca; font-size: 1.7rem; } .children .sitemap-item { margin: 1rem 0 0; padding: 0; } .children .sitemap-item a { display: inline-block; width: 100%; font-size: 1.5rem; background: none; border: none; } .children .sitemap-item a:before { content: '\f30b'; font-family: "Font Awesome 6 Free"; font-weight: bold; color: #ccc; margin-right: 0.5rem; display: inline-block; } ul.children { margin-left: 2rem !important; } .page_under01 ul.children { margin-left: 0 !important; } @media only screen and (min-width:600px) and (max-width:1200px) { .simple-sitemap-container.tab-enabled label { margin: 0 0.42vw 0 0; border-radius: 0.3vw 0.3vw 0 0; } .simple-sitemap-container h3 { padding: 0.83vw 0.83vw; font-size: 1.33vw; } .simple-sitemap-container.tab-enabled .panel { border-radius: 0 0 0.3vw 0.3vw; } .sitemap-item { margin: 2.5vw 0 0; } ul.children { margin-left: 1.69vw !important; } .sitemap-item a { padding: 0.17vw 0.83vw; font-size: 1.42vw; } .children .sitemap-item { margin: 0.83vw 0 0; } .children .sitemap-item a { font-size: 1.25vw; } .children .sitemap-item a:before { margin-right: 0.42vw; } } @media screen and (max-width: 600px) { .simple-sitemap-container.tab-enabled label { margin-right: 2px !important; width: 16% !important; height: 10vw; } .simple-sitemap-container.tab-enabled input:checked + label { padding-right: 0; } .simple-sitemap-container h3 { padding: 2vw 0; height: 100%; font-size: 1.3rem; text-align: center; white-space: initial; } } /* 親子ページのリスト　 ======================================================== */ .ParentChild { margin: 80px auto; width: 100%; font-size: 1.6rem; border-width: 1px; border-style: solid; } .ParentChild__Heading a { display: block; padding: 15px 10px; color: #fff; text-decoration: none; } .ParentChild ul { margin: 0; padding: 0; } .ParentChild ul.children { margin-left: 0 !important; } .ParentChild ul li { margin: 0; padding-bottom: 0; list-style: none; } .ParentChild ul li a { display: block; padding: 15px 10px; text-decoration: none; border-bottom-width: 1px; border-bottom-style: solid; } .ParentChild ul li a:before { display: inline-block; content: " \f105"; font-family: "Font Awesome 6 Free"; font-size: 1.4rem; font-weight: 700; padding: 0 5px 0 0; } .ParentChild ul li.page_item_has_children a, .ParentChild ul li:last-child a { border-bottom: none; } .ParentChild ul li.page_item_has_children:last-child ul.children li:last-child a { margin-bottom: -1px; } .ParentChild ul li.page_item_has_children ul li a { padding: 15px 10px 15px 35px; border-bottom: none; } .ParentChild ul li.page_item_has_children ul li:last-child a { border-bottom-width: 1px; border-bottom-style: solid; } .ParentChild ul li.page_item_has_children ul li a:before { content: " \f0da"; } @media only screen and (min-width:600px) and (max-width:1200px) { .ParentChild { margin: 6.66vw auto; font-size: 1.33vw; } .ParentChild__Heading a { padding: 1.25vw 0.83vw; } .ParentChild ul li a { padding: 1.25vw 0.83vw; } .ParentChild ul li a:before { padding: 0 0.42vw 0 0; font-size: 1.16vw; } .ParentChild ul li.page_item_has_children ul li a { padding: 1.25vw 0.83vw 1.25vw 2.93vw; } } @media screen and (max-width: 600px) { .ParentChild { margin: 8vw auto; } .ParentChild__Heading a { padding: 3vw 2vw; } .ParentChild ul li a { padding: 3vw 2vw; } .ParentChild ul li a:before { padding: 0 0.5vw 0 0; } .ParentChild ul li.page_item_has_children ul li a { padding: 3vw 2vw 3vw 6vw; } } /* 執筆者情報 ======================================================== */ .SubPage__Author { clear: both; margin: 80px auto; padding: 0; width: 100%; } .SubPage__AuthorHeading { display: inline-block; width: initial; margin: 0; padding: 1rem 2rem 0.5rem; color: #fff; font-size: 1.4rem; font-weight: 500; } .Author { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; padding: 20px; border-width: 2px; border-style: solid; } .Author__Primary { position: relative; display: block; margin: 0 4% 0 0; width: 22%; overflow: hidden; object-fit: cover; } .Author__Primary:before { content: ""; display: block; padding-top: 126%; } .Author__Primary img { position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; margin: auto; object-fit: cover; } .Author__Text { display: flex; align-items: center; flex-wrap: wrap; width: 70%; } .Author__Text dt, .Author__Text dd { margin-bottom: 1rem; width: 100%; border-bottom: 1px solid #ebebeb; } .Author__TradeName { display: inline-block; margin: 0; padding: 0 0 1rem; width: 100%; font-size: 1.4rem; } .Author__Position { display: inline-block; margin: 0; padding: 0 2rem 1rem 0; font-size: 1.4rem; } .Author__FullName { display: inline-block; margin: 0; padding: 0 0 1rem 0; font-size: 2.4rem; font-weight: 500; } .Author table { border-collapse: separate; width: 100%; margin-bottom: 1rem; } .Author table th { display: inline-block; vertical-align: top; margin: 0.35rem 0; padding: 0.5rem 1rem; width: 10%; font-size: 1.2rem; font-weight: 400; border: none; white-space: nowrap; } .Author table td { display: inline-block; margin: 0 0 0 2rem; padding: 0.5rem 0; width: 80%; font-size: 1.4rem; border: none; } .Author__Button { width: 100%; text-align: center; } .Author__Button a { display: inline-block; margin: 0 30%; padding: 1.5rem 0; width: 40%; font-size: 1.7rem; font-weight: 500; text-decoration: none; border-radius: 100px; } .Author__Button a:after { display: inline-block; margin-left: 1rem; content: "\f054"; font-size: 1.4rem; font-weight: bold; font-family: "Font Awesome 6 Free"; } @media only screen and (min-width:600px) and (max-width:1200px) { .SubPage__Author { margin: 6.7vw auto; } .SubPage__AuthorHeading { padding: 0.88vw 1.7vw 0.43vw; font-size: 1.2vw; } .Author { padding: 1.75vw; border-width: 0.2vw; } .Author__Text dt, .Author__Text dd { margin-bottom: 0.9vw; border-bottom-width: 0.1vw; } .Author__TradeName { padding: 0 0 0.88vw; font-size: 1.21vw; } .Author__Position { padding: 0 1.7vw 0.9vw 0; font-size: 1.21vw; } .Author__FullName { padding: 0 0 0.9vw 0; font-size: 2.07vw; } .Author table { margin-bottom: 0.9vw; } .Author table th { margin: 0.32vw 0; padding: 0.4vw 0.85vw; font-size: 1.04vw; } .Author table td { margin: 0 0 0 1.68vw; padding: 0.42vw 0; font-size: 1.16vw; } .Author__Button a { padding: 1.3vw 0; font-size: 1.47vw; } .Author__Button a:after { font-size: 1.22vw; } } @media screen and (max-width: 600px) { .SubPage__Author { margin: 8vw auto; } .Author { flex-direction: column; } .Author__Primary { margin: 0 auto; width: 50%; } .Author__Image { margin: 0 auto 1rem; width: 50%; } .Author__Text { width: 100%; } .Author__Text dt { text-align: center; } .Author table { font-size: 1.6rem; } .Author table th { width: 13%; } .Author table td { width: 75%; } .Author__Button a { margin: 0 15%; width: 70%; } } /* サイドバー　 ======================================================== */ .Sidebar__ContentMenu, .Sidebar__Access { margin-bottom: 20px; border-width: 1px; border-style: solid; border-color: #e2e2e2; border-radius: 10px 10px 0 0; width: 100%; gap: 0; } .Sidebar__ContentMenu { border-bottom: none; } .Sidebar__Access ul { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 0; width: 200px; } .Sidebar__Access ul li { display: flex; flex-direction: column; margin: 0; padding: 10px 0; } .Sidebar__Access ul li strong { display: flex; justify-content: flex-start; margin: 0; padding: 10px 0; width: 100%; font-size: 1.4rem; font-weight: 500; } .Sidebar__Access ul li iframe { width: 100%; height: 185px; } .Sidebar__Phone:hover { opacity: 0.7; } .Sidebar__Phone { position: relative; min-height: 300px !important; width: 100%; padding: 0 !important; margin-bottom: 10px !important; } .Sidebar__PhoneNumber { position: relative; display: block; margin-top: 95px; padding: 0 0 20px; text-align: center; white-space: nowrap; } .Sidebar__PhoneNumber p { width: 100%; color: #fff !important; font-size: 2.8rem; line-height: 1; font-family: 'Roboto Condensed', sans-serif; font-weight: 700; text-align: center; } .Sidebar__PhoneNumber p:before { display: inline-block; margin: 0 1rem 0.5rem 0; vertical-align: middle; content: "\f098"; font-size: 2.3rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Sidebar__ReceptionHours { display: block; margin: 0 auto; padding: 0; width:; text-align: left; } .Sidebar__ReceptionHours p { color: #fff !important; font-size: 1.2rem; font-weight: 400; line-height: 1.3; text-align: center; } .Sidebar__ReceptionHours p strong { display: block; font-weight: normal; } .Sidebar__ReceptionHours p small { font-size: 1.2rem; } .Sidebar__Mail { min-height: 65px !important; width: 100%; padding: 0 !important; margin-bottom: 10px !important; } .Sidebar__PrimaryButton { min-height: 62px !important; width: 100%; padding: 0 !important; margin-bottom: 0 !important; } .Sidebar__SecondaryButton { min-height: 74px !important; width: 100%; padding: 0 !important; margin-bottom: 10px !important; } .Sidebar__SecondaryButton.--First { margin-top: 20px !important; } .Sidebar__Phone img, .Sidebar__Mail img, .Sidebar__PrimaryButton img, .Sidebar__SecondaryButton img { height: auto !important; } .Sidebar__Tel:hover, .Sidebar__Mail:hover, .Sidebar__PrimaryButton:hover, .Sidebar__SecondaryButton:hover { opacity: 0.7; } .Sidebar__AccessOffice { padding: 0 0 10px; } .Sidebar__Access iframe { padding: 5px 0; width: 90%; height: 185px; } .Sidebar__Heading { padding: 10px 0; width: 100%; color: #fff; font-size: 1.8rem; font-weight: 700; letter-spacing: 0; text-align: center; border-radius: 8px 8px 0 0; } .Sidebar__MapText { padding: 0 0 15px; font-size: 1.4rem; font-weight: 400; } .Sidebar__Search { margin-bottom: 20px; width: 100%; background: #ececec; } .Sidebar__Search label { display: none; } .Sidebar__Search .wp-block-search__inside-wrapper { padding: 4%; max-width: 80%; } .Sidebar__Search .wp-block-search__input { width: 200px; border-width: 1px; border-style: solid; border-color: #dbdbdb; } .Sidebar__Search .wp-block-search__button { color: #fff; font-size: 1.4rem; background: #717171; border: none; white-space: nowrap; } .Sidebar__Search .wp-block-search__button:hover { cursor: pointer; opacity: 0.7; } .Sidebar__ContentMenu .wp-block-lazyblock-content-menu { width: 100%; } .Sidebar__ContentMenu .menu-sidebar-menu-container { margin: 0; padding: 0; width: 100%; } .Sidebar__Menu { margin: 0 auto; padding: 0; width: 100%; } .Sidebar__Menu li { margin: 0; padding: 0; width: 100%; text-align: left; } .Sidebar__Menu li a { display: flex; align-items: flex-start; padding: 15px 10px; font-size: 1.5rem; text-decoration: none; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #e2e2e2; } /* .Sidebar__Menu li:last-child a { border-bottom: none; } */ .Sidebar__Menu li a:before { display: inline-block; margin: 2px 5px 0 0; content: "\f105"; font-size: 1.3rem; font-family: "Font Awesome 6 Free"; font-weight: bold; } .Sidebar__Menu li.menu-item-has-children ul.sub-menu { display: none; border-bottom: 1px solid #e2e2e2; } .Sidebar__Menu li.menu-item-has-children ul.sub-menu li a { padding-left: 20px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Sidebar__ContentMenu, .Sidebar__Access { margin-bottom: 1.7vw; border-radius: 0.83vw 0.83vw 0 0; } .Sidebar__Heading { padding: 0.83vw 0; font-size: 1.5vw; border-radius: 0.7vw 0.7vw 0 0; } .Sidebar__Menu li a { padding: 1.25vw 0.83vw; font-size: 1.25vw; border-bottom-width: 0.09vw; } .Sidebar__Menu li a:before { margin: 0.17vw 0.4vw 0 0; font-size: 1.07vw; } .Sidebar__MapText { padding: 0 0 1.25vw; font-size: 1.16vw; } .Sidebar__Access ul { width: 16.7vw; } .Sidebar__Access ul li { padding: 0.83vw 0; } .Sidebar__Access ul li strong { padding: 0.83vw 0; font-size: 1.17vw; } .Sidebar__Access ul li iframe { padding: 0.42vw 0; height: 15.4vw; } .Sidebar__Search { margin-bottom: 1.67vw; } .Sidebar__Search .wp-block-search__input { padding: 0.67vw; width: 16.7vw; } .Sidebar__Search .wp-block-search__button { margin-left: 0.83vw; font-size: 1.16vw; } } /* サイドバーのバナー　 ======================================================== */ .Body__Sidebar .sidebar-primary, .Body__Sidebar .sidebar-secondary { width: 100%; } .Body__Sidebar .BoxMenu__Item { position: relative; display: flex; flex-direction: column; justify-content: center; margin: 0 auto 10px; text-decoration: none; overflow: hidden; } .Body__Sidebar .BoxMenu__Image { position: absolute; top: 0; left: 0; width: 100%; } .Body__Sidebar .BoxMenu__Image img { width: 100%; height: auto; } .Body__Sidebar .sidebar-primary { padding-bottom: 10px; /* プライマリー */ } .BoxMenu.sidebar-primary .BoxMenu__Item { padding: 0 10px 0 45px; height: 62px; } .BoxMenu.sidebar-primary .BoxMenu__Item:after { position: absolute; right: 2px; top: 2px; display: flex; justify-content: center; align-items: center; width: 8px; height: 94%; content: " \f054"; font-family: "Font Awesome 6 Free"; font-weight: bold; color: #fff; font-size: 0.8rem; } .BoxMenu.sidebar-primary .BoxMenu__Title { position: relative; padding: 0 0 3px; font-size: 1.8rem; font-weight: 500; } .BoxMenu.sidebar-primary .BoxMenu__Description { position: relative; padding: 0 0 0 1px; font-size: 1.1rem; font-weight: 400; line-height: 1.25; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; } .Body__Sidebar .sidebar-secondary { padding-bottom: 10px; /* セカンダリー */ } .BoxMenu.sidebar-secondary .BoxMenu__Item { padding: 0 40px 0 10px; height: 94px; } .BoxMenu.sidebar-secondary .BoxMenu__Title { position: relative; padding: 0 0 5px; font-size: 2.0rem; font-weight: 500; line-height: 1.0; white-space: nowrap; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-of-type(1) .BoxMenu__Title { color: #d73c3c; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-of-type(2) .BoxMenu__Title { color: #70ac48; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-of-type(3) .BoxMenu__Title { color: #7f58b5; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-of-type(4) .BoxMenu__Title { color: #4373c5; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-of-type(4) { margin-bottom: 10px; } .BoxMenu.sidebar-secondary .BoxMenu__Description { position: relative; padding: 0 0 0 1px; font-size: 1.2rem; line-height: 1.25; font-weight: 400; white-space: nowrap; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) { padding: 0 90px 0 0; height: 73px; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) .BoxMenu__Title { padding: 5px 0 0; font-size: 2.0rem; line-height: 1.1; text-align: center; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) .BoxMenu__Title strong { display: block; font-size: 3.0rem; font-weight: 700; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Sidebar .sidebar-primary { padding-bottom: 0.82vw; } .Body__Sidebar .BoxMenu__Item { margin: 0 auto 0.82vw; } .BoxMenu.sidebar-primary .BoxMenu__Item { padding: 0 0.82vw 0 3.75vw; height: 5.16vw; } .BoxMenu.sidebar-primary .BoxMenu__Item:after { right: 0.17vw; top: 0.17vw; width: 0.7vw; font-size: 0.66vw; } .BoxMenu.sidebar-primary .BoxMenu__Title { padding: 0 0 0.25vw; font-size: 1.5vw; } .BoxMenu.sidebar-primary .BoxMenu__Description { padding: 0 0 0 0.1vw; font-size: 0.92vw; } .Body__Sidebar .sidebar-secondary { padding-bottom: 0.82vw; } .BoxMenu.sidebar-secondary .BoxMenu__Item { padding: 0 3.3vw 0 0.82vw; height: 7.85vw; } .BoxMenu.sidebar-secondary .BoxMenu__Title { padding: 0 0 0.43vw; font-size: 1.67vw; } .BoxMenu.sidebar-secondary .BoxMenu__Description { padding: 0 0 0 0.1vw; font-size: 1vw; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) { padding: 0 7.52vw 0 0; height: 6.1vw; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) .BoxMenu__Title { padding: 0.4vw 0 0; font-size: 1.67vw; } .BoxMenu.sidebar-secondary .BoxMenu__Item:nth-last-of-type(1) .BoxMenu__Title strong { font-size: 2.49vw; } } /* 下層コンテンツ下の共通パーツ　 ======================================================== */ .SubPage { padding: 40px 0; } .SubPage__Banner h5, .SubPage__Contents h5 { margin-bottom: 40px !important; font-weight: 500; border-left: none; border-bottom-width: 2px; border-bottom-style: solid; } .SubPage .BoxMenu__Item { position: relative; display: flex; flex-direction: column; justify-content: center; margin: 0 auto 10px; text-decoration: none; overflow: hidden; } .SubPage .BoxMenu__Item:after { position: absolute; display: flex; justify-content: center; align-items: center; margin: 0; padding: 5px 15px; font-size: 1.2rem; border-radius: 5px; } .SubPage .BoxMenu__Image { position: absolute; top: 0; left: 0; width: 100%; } .SubPage .BoxMenu__Image img { width: 99.7%; height: auto; border-radius: 10px; border-width: 1px; border-style: solid; } .SubPage .Body__FreeConsulting { padding: 20px 0; border-radius: 20px; /* 相続・遺言の無料相談受付中！ */ } .SubPage .FreeConsulting { width: 100%; } .SubPage .FreeConsulting__Primary { margin: 0 0 0 40px !important; } .SubPage .FreeConsulting__PrimaryImage { bottom: -40px; width: 100px; } .SubPage .FreeConsulting__Text { position: relative; width: 84%; } .SubPage .FreeConsulting__PrimaryText { margin: 0 auto; } .SubPage .FreeConsulting__PrimaryText em { font-size: 3.5rem; } .SubPage .FreeConsulting__PrimaryText span { width: 70px; height: 70px; font-size: 5.0rem; } .SubPage .FreeConsulting__PrimaryText strong { font-size: 5.3rem; } .SubPage .FreeConsulting__Primary .--PhoneNumber { margin: 0 auto; padding: 0 0 0 20px; } .SubPage .FreeConsulting__Primary .--PhoneNumber a { font-size: 6.5rem; } .SubPage .FreeConsulting__Primary .--PhoneNumber a:before { font-size: 4.2rem; } .SubPage .FreeConsulting__Primary .--ReceptionHours, .SubPage .FreeConsulting__Primary .--Annotation { font-size: 1.7rem; } .SubPage .FreeConsulting__Primary .--Annotation { padding: 0 20px 0 0; } .SubPage .FreeConsulting__Text p { margin-bottom: 0; font-size: 2.4rem; } .SubPage .FreeConsulting__List { width: 90%; } .SubPage .FreeConsulting__List dt { padding: 0; width: 160px; font-size: 1.8rem; } .SubPage .FreeConsulting__Button a { padding: 20px 0 20px 20px; width: 220px; font-size: 2.2rem; text-align: center; } .SubPage .FreeConsulting__Button a:after { margin-left: 5px; font-size: 1.8rem; } .SubPage .Body__PopularMenu { padding: 30px 0; background: none; } .SubPage .PopularMenu { width: 100%; } .SubPage .PopularMenu__Item { width: 400px; } .SubPage .PopularMenu__Image { width: 70px; } .SubPage .PopularMenu__Image img { margin-bottom: 0; } .SubPage .PopularMenu__Shoulder { margin-bottom: 0; width: 330px; font-size: 1.7rem; } .SubPage .PopularMenu__Secondary { width: 90%; min-height: 110px; } .SubPage .PopularMenu__Name { margin-bottom: 0; padding: 5px 0; font-size: 2.6rem; } .SubPage .PopularMenu__Price { margin-bottom: 0; font-size: 3.6rem; } .SubPage .PopularMenu__Price span { font-size: 2.9rem; } .SubPage .PopularMenu__Price small { font-size: 2.6rem; } .SubPage .PopularMenu__Price em { font-size: 2.9rem; } .SubPage .PopularMenu__Icon { top: 15px; width: 60px; } .SubPage .PopularMenu__Button { padding: 5px 0 15px; } .SubPage .PopularMenu__Button a { padding: 10px ; width: 230px; font-size: 1.7rem; } .SubPage .PopularMenu__Button a:after { font-size: 1.3rem; } .SubPage__Trust { margin: 0; padding: 0 0 40px; /* 家族信託をお考えの方へ */ } .SubPage__Trust h2 { margin-bottom: 20px !important; } .SubPage .BoxMenu.subpage-primary { width: 100%; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) { padding: 0 0 0 230px; height: 168px; overflow: visible; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1):after { right: 15px; bottom: 10px; content: "こちらをクリック ▸"; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Image img { border-color: #a06948; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Title { position: relative; font-size: 2.1rem; font-weight: 500; letter-spacing: 0.1em; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Title strong { display: block; padding: 5px 0 10px; font-size: 6.0rem; font-weight: 700; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Description { position: relative; font-size: 1.9rem; font-weight: 500; letter-spacing: 0.2em; } .SubPage__Banner { margin: 0; padding: 0; /* 相続のご相談は当相談窓口にお任せください */ } .SubPage__Banner .BoxMenu { display: flex; justify-content: space-between; margin: 0 auto; padding: 0; width: 100%; } .SubPage__Banner .BoxMenu__Item { margin: 0; width: 400px; height: 140px; overflow: visible; } .SubPage__Banner .BoxMenu__Item:after { left: 15px; bottom: 5px; content: "詳しくはこちらをクリック ▸"; } .SubPage__Banner .BoxMenu__Image img { border-color: #8c7f52; } .SubPage__Banner .BoxMenu__Title { position: relative; padding: 0 0 0 15px; font-size: 2.7rem; font-weight: 500; line-height: 1.1; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; } .SubPage__Banner .BoxMenu__Title strong { font-size: 4.3rem; } .SubPage__Banner .BoxMenu__Item:nth-of-type(2) .BoxMenu__Title strong { display: inline-block; padding-left: 55px; font-size: 3.6rem; } .SubPage__Banner .BoxMenu__Description { position: absolute; z-index: 1; top: 4px; left: 50%; transform: translateX(-50%); color: #fff; font-size: 1.6rem; font-weight: 400; white-space: nowrap; } .SubPage__Banner .BoxMenu__Description span { font-size: 2.0rem; } .SubPage__ContentsBg { display: flex; justify-content: space-between; align-items: flex-end; margin: 0; padding: 0; width: 100%; height: 310px; background-size: auto 85% !important; border-width: 2px; border-style: solid; } .SubPage__ContentsList { display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 15px 0 0; padding: 0; width: 415px; } .SubPage__ContentsList li { position: relative; list-style: none !important; margin: 0 0 15px !important; padding: 0; width: 200px; } .SubPage__ContentsList li:after { position: absolute; right: 0; top: 0; display: flex; justify-content: center; align-items: center; width: 10px; height: 100%; content: " \f0da"; color: #fff; font-size: 1.0rem; font-family: "Font Awesome 6 Free"; font-weight: bold; pointer-events: none; } .SubPage__ContentsList li a { display: flex; align-items: center; padding: 15px 0; font-size: 1.7rem; font-weight: 500; text-decoration: none; background: linear-gradient(to bottom, #fff, #e6e6e6); border-width: 1px; border-style: solid; } .SubPage__ContentsList li a i { display: flex; justify-content: center; margin: 0; width: 40px; } .SubPage__ContentsText { margin-bottom: 19rem !important; width: 390px; font-size: 2.9rem; font-weight: 700; line-height: 1.25; text-align: center; text-shadow: 0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff,0 0 5px #fff; } @media only screen and (min-width:600px) and (max-width:1200px) { .SubPage { padding: 3.33vw 0; } .SubPage__Banner h5, .SubPage__Contents h5 { margin-bottom: 3.3vw !important; border-bottom-width: 0.2vw; } .SubPage .Body__FreeConsulting { padding: 1.67vw 0; border-radius: 1.67vw; } .SubPage .FreeConsulting__PrimaryImage { left: -0.83vw; bottom: -4.15vw; width: 8.34vw; } .SubPage .FreeConsulting__Text { padding: 2vw; width: 59vw; } .SubPage .FreeConsulting__PrimaryText { width: 43.3vw; } .SubPage .FreeConsulting__Text p { font-size: 2.17vw; } .SubPage .FreeConsulting__PrimaryText em { font-size: 2.92vw; } .SubPage .FreeConsulting__PrimaryText span { width: 5.83vw; height: 5.83vw; font-size: 4.17vw; } .SubPage .FreeConsulting__PrimaryText strong { font-size: 4.42vw; } .SubPage .FreeConsulting__Primary .--PhoneNumber { padding: 0 0 0 1.67vw; } .SubPage .FreeConsulting__Primary .--PhoneNumber a { font-size: 5.42vw; } .SubPage .FreeConsulting__Primary .--PhoneNumber a:before { font-size: 3.5vw; } .SubPage .FreeConsulting__Primary .--ReceptionHours, .SubPage .FreeConsulting__Primary .--Annotation { font-size: 1.41vw; } .SubPage .FreeConsulting__List dt { width: 13.3vw; font-size: 1.5vw; } .SubPage .FreeConsulting__Button a { padding: 1.8vw 0 1.8vw 1.67vw; width: 18.3vw; font-size: 1.83vw; } .SubPage .FreeConsulting__Button a:after { margin-left: 0.42vw; font-size: 1.52vw; } .SubPage .Body__PopularMenu { padding: 2.5vw 0; /* 主な相続手続きのメニュー */ } .SubPage .PopularMenu__Item { width: 33.3vw; } .SubPage .PopularMenu__Image { width: 5.8vw; } .SubPage .PopularMenu__Shoulder { width: 27.5vw; font-size: 1.42vw; } .SubPage .PopularMenu__Secondary { width: 29vw; min-height: 8.34vw; } .SubPage .PopularMenu__Name { padding: 0.42vw 0; font-size: 2.17vw; } .SubPage .PopularMenu__Price { font-size: 3vw; } .SubPage .PopularMenu__Price span { font-size: 2.416vw; } .SubPage .PopularMenu__Price small { font-size: 2.18vw; } .SubPage .PopularMenu__Price em { font-size: 2.416vw; } .SubPage .PopularMenu__Icon { width: 5vw; } .SubPage .PopularMenu__Button { padding: 0.42vw 0 1.25vw; } .SubPage .PopularMenu__Button a { padding: 0.83vw; width: 19.2vw; font-size: 1.42vw; } .SubPage .PopularMenu__Button a:after { font-size: 1.08vw; } .SubPage__Trust { padding: 0 0 3.3vw; /* 家族信託サポート */ } .SubPage .BoxMenu__Image img { border-radius: 0.83vw; } .SubPage .BoxMenu__Item:after { padding: 0.42vw 1.25vw; font-size: 1vw; border-radius: 0.42vw; } .SubPage__Trust h2 { margin-bottom: 1.67vw !important; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1):after { right: 1.25vw; bottom: 0.83vw; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) { padding: 0 0 0 19.15vw; height: 14vw; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Title { font-size: 1.75vw; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Title strong { padding: 0.42vw 0 0.82vw; font-size: 5vw; } .SubPage__Trust .BoxMenu__Item:nth-of-type(1) .BoxMenu__Description { font-size: 1.58vw; } .SubPage__Banner .BoxMenu__Item { width: 33.3vw; height: 11.7vw; /* 相続のご相談は当相談窓口にお任せください */ } .SubPage__Banner .BoxMenu__Item:after { left: 1.25vw; bottom: 0.42vw; } .SubPage__Banner .BoxMenu__Title { padding: 0 0 0 1.25vw; font-size: 2.25vw; } .SubPage__Banner .BoxMenu__Title strong { font-size: 3.6vw; } .SubPage__Banner .BoxMenu__Item:nth-of-type(2) .BoxMenu__Title strong { padding-left: 4.6vw; font-size: 3vw; } .SubPage__Banner .BoxMenu__Description { top: 0.35vw; font-size: 1.33vw; } .SubPage__Banner .BoxMenu__Description span { font-size: 1.67vw; } .SubPage__ContentsBg { height: 25.833vw; border-width: 0.17vw; /* よくご覧いただくコンテンツ一覧 */ } .SubPage__ContentsText { margin-bottom: 15.833vw !important; width: 32.5vw; font-size: 2.416vw; } .SubPage__ContentsList { margin: 0 1.25vw 0 0; width: 34.6vw; } .SubPage__ContentsList li { margin: 0 0 1.25vw !important; width: 16.68vw; } .SubPage__ContentsList li:after { width: 0.83vw; font-size: 0.82vw; } .SubPage__ContentsList li a { padding: 1.25vw 0; font-size: 1.42vw; } .SubPage__ContentsList li a i { width: 3.33vw; } } @media screen and (max-width: 600px) { .SubPage { display: none; /*後で変更*/ } } /* アーカイブ・詳細 ======================================================== */ .Body__Archive, .Body__Single { margin: 0; padding: 0; width: 840px; } .Body__ArchiveTwoColumns { display: flex; flex-wrap: wrap; justify-content: space-between; } .Page__Image img, .Single__Image img { display: block; margin: 0 auto 60px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Archive, .Body__Single { width: 70vw; } } @media screen and (max-width: 600px) { .Body__Archive, .Body__Single { position: relative; z-index: 1; margin: 0 calc(50% - 50vw); padding: 6vw 5vw; width: 90vw; background: #fff; } .Body__ArchiveTwoColumns { flex-direction: column; } } /* 絞り込み検索 ======================================================== */ .SearchFilter { padding: 0 0 60px; } .SearchFilter__Heading { margin: 0 0 20px !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } .SearchFilter .searchandfilter { width: 100%; } .searchandfilter div > ul { display: block; width: 100%; } .searchandfilter div > ul li { display: block; width: 100%; } .searchandfilter div > ul li ul { display: flex; justify-content: flex-start; flex-wrap: wrap; } .searchandfilter input[type="checkbox"], .searchandfilter input[type="radio"] { display: none; } .searchandfilter div > ul li.cat-item { position: relative; display: flex; margin: 0 1% 1% 0; padding: 0; width: 32%; font-size: 1.5rem; font-weight: 500; background: linear-gradient(to bottom, #fff, #ededed); border: 1px solid #e3e3e3; } .searchandfilter div > ul li.cat-item:nth-child(3n) { margin-right: 0; } .searchandfilter div > ul li.cat-item:before { position: absolute; right: 0; top: 50%; transform: translate(-50%, -50%); content: " \f0da"; font-family: "Font Awesome 6 Free"; font-weight: bold; color: #fff; font-size: 1.0rem; z-index: 1; } .searchandfilter div > ul li.cat-item:after { content: ""; position: absolute; top: 0; right: 0; width: 10px; height: 100%; } .searchandfilter div > ul li.cat-item label { display: flex; align-items: center; width: 100%; padding: 10px 20px 10px 10px; } .searchandfilter div > ul li.cat-item label:hover { cursor: pointer; opacity: 0.7; } .searchandfilter input[type="submit"] { display: none; } @media only screen and (min-width:600px) and (max-width:1200px) { .SearchFilter { padding: 0 0 5vw; } .searchandfilter div > ul li.cat-item { font-size: 1.25vw; } .searchandfilter div > ul li.cat-item:before { font-size: 0.83vw; } .searchandfilter div > ul li.cat-item:after { width: 0.83vw; } .searchandfilter div > ul li.cat-item label { padding: 0.83vw 1.67vw 0.83vw 0.83vw; } } @media screen and (max-width: 600px) { .SearchFilter { padding: 0 0 6vw; } .searchandfilter div > ul li ul { justify-content: space-between; } .searchandfilter div > ul li.cat-item { width: 49%; margin: 0 0 1vw; } .searchandfilter div > ul li.cat-item label { padding: 2.5vw 4vw 2.5vw 2.5vw; } } /* アーカイブ ======================================================== */ .ArchiveCase, .ArchiveColumn, .ArchiveCustomer, .ArchiveSeminar, .ArchiveOld, .ArchiveMovie, .ArchiveNews { position: relative; margin: 0 0 40px; padding: 0 0 40px; border-bottom:1px #eaeaea solid; } .ArchiveMovie { width: 48%; } .ArchiveCase a, .ArchiveColumn a, .ArchiveCustomer a, .ArchiveSeminar a, .ArchiveOld a, .ArchiveMovie a, .ArchiveNews a { position: absolute; z-index: 1; top: 0; left: 0; display: block; width: 100%; height: 100%; background: #fff; opacity: 0; } .ArchiveCase a:hover, .ArchiveColumn a:hover, .ArchiveCustomer a:hover, .ArchiveSeminar a:hover, .ArchiveOld a:hover, .ArchiveMovie a:hover, .ArchiveNews a:hover { opacity: 0.3; } .ArchiveCase__Title, .ArchiveColumn__Title, .ArchiveCustomer__Title, .ArchiveSeminar__Title, .ArchiveOld__Title, .ArchiveMovie__Title, .ArchiveNews__Title { margin: 0 0 20px; } .ArchiveCase__Title:before, .ArchiveColumn__Title:before, .ArchiveCustomer__Title:before, .ArchiveSeminar__Title:before, .ArchiveOld__Title:before, .ArchiveMovie__Title:before, .ArchiveNews__Title:before { display: none; } .ArchiveCase__Primary, .ArchiveColumn__Primary, .ArchiveCustomer__Primary, .ArchiveSeminar__Primary, .ArchiveOld__Primary, .ArchiveMovie__Primary, .ArchiveNews__Primary { display: flex; justify-content: space-between; align-items: flex-start; } .ArchiveMovie__Primary { flex-direction: column; } .ArchiveCase__Image, .ArchiveColumn__Image, .ArchiveCustomer__Image, .ArchiveSeminar__Image, .ArchiveOld__Image, .ArchiveNews__Image { width: 20%; } .ArchiveMovie__Image { width: 100%; margin-bottom: 10px; } .ArchiveCase__Image:before, .ArchiveColumn__Image:before, .ArchiveOld__Image:before, .ArchiveNews__Image:before { padding-top: 100%; } .ArchiveCustomer__Image:before, .ArchiveSeminar__Image:before { padding-top: 135%; } .ArchiveMovie__Image:before { padding-top: 67%; } .ArchiveCase__Text, .ArchiveColumn__Text, .ArchiveCustomer__Text, .ArchiveSeminar__Text, .ArchiveOld__Text, .ArchiveMovie__Text, .ArchiveNews__Text { display: flex; align-items: center; width: 100%; } .ArchiveCase__Primary.--ThumbOn .ArchiveCase__Text, .ArchiveColumn__Primary.--ThumbOn .ArchiveColumn__Text, .ArchiveCustomer__Primary.--ThumbOn .ArchiveCustomer__Text , .ArchiveSeminar__Primary.--ThumbOn .ArchiveSeminar__Text, .ArchiveOld__Primary.--ThumbOn .ArchiveOld__Text, .ArchiveNews__Primary.--ThumbOn .ArchiveNews__Text { width: 76%; } .ArchiveMovie__Primary.--ThumbOn .ArchiveMovie__Text { width: 100%; } .ArchiveCase__Text p, .ArchiveColumn__Text p, .ArchiveCustomer__Text p, .ArchiveSeminar__Text p, .ArchiveOld__Text p, .ArchiveMovie__Text p, .ArchiveNews__Text p { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 30px; font-size: 1.6rem; line-height: 1.5; } .ArchiveMovie__Text p { margin: 0; } .ArchiveCase__Primary.--ThumbOn .ArchiveCase__Text p, .ArchiveColumn__Primary.--ThumbOn .ArchiveColumn__Text p, .ArchiveCustomer__Primary.--ThumbOn .ArchiveCustomer__Text p, .ArchiveSeminar__Primary.--ThumbOn .ArchiveSeminar__Text p, .ArchiveOld__Primary.--ThumbOn .ArchiveOld__Text p, .ArchiveMovie__Primary.--ThumbOn .ArchiveMovie__Text p, .ArchiveNews__Primary.--ThumbOn .ArchiveNews__Text p { marign: 0; } .ArchiveCase__Secondary, .ArchiveColumn__Secondary, .ArchiveCustomer__Secondary, .ArchiveSeminar__Secondary, .ArchiveOld__Secondary, .ArchiveMovie__Secondary, .ArchiveNews__Secondary { padding: 10px 0 0; width: 77%; display: flex; flex-direction: column; } .ArchiveCase__Date, .ArchiveColumn__Date, .ArchiveCustomer__Date, .ArchiveSeminar__Date, .ArchiveOld__Date, .ArchiveMovie__Date, .ArchiveNews__Date { padding: 10px 0; color: #666; font-size: 1.3rem;} .ArchiveCase__Category, .ArchiveColumn__Category, .ArchiveCustomer__Category, .ArchiveSeminar__Category, .ArchiveOld__Category, .ArchiveMovie__Category, .ArchiveNews__Category { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; } .ArchiveCase__Category span, .ArchiveColumn__Category span, .ArchiveCustomer__Category span, .ArchiveSeminar__Category span, .ArchiveOld__Category span, .ArchiveMovie__Category span, .ArchiveNews__Category span { display: inline-block; margin: 0 10px 10px 0; padding: 5px 10px; border-radius: 2px; background: #eaeaea; font-size: 1.4rem; } .ArchiveCase:after, .ArchiveColumn:after, .ArchiveCustomer:after, .ArchiveSeminar:after, .ArchiveOld:after, .ArchiveMovie:after, .ArchiveNews:after { content: "続きを見る »"; position: absolute; right: 0; bottom: 3rem; padding: 10px 30px; color:#fff; font-size: 1.6rem; font-weight: 500; border-radius: 5px; pointer-events: none; } @media only screen and (min-width:600px) and (max-width:1200px) { .ArchiveCase, .ArchiveColumn, .ArchiveCustomer, .ArchiveSeminar, .ArchiveOld, .ArchiveMovie, .ArchiveNews { margin: 0 0 3.33vw; padding: 0 0 3.33vw; } .ArchiveCase__Title, .ArchiveColumn__Title, .ArchiveCustomer__Title, .ArchiveSeminar__Title, .ArchiveOld__Title, .ArchiveMovie__Title, .ArchiveNews__Title { margin: 0 0 1.67vw; } .ArchiveMovie__Image { margin-bottom: 0.83vw; } .ArchiveCase__Text p, .ArchiveColumn__Text p, .ArchiveCustomer__Text p, .ArchiveSeminar__Text p, .ArchiveOld__Text p, .ArchiveMovie__Text p, .ArchiveNews__Text p { margin: 0 0 2.5vw; font-size: 1.33vw; } .ArchiveCase__Secondary, .ArchiveColumn__Secondary, .ArchiveCustomer__Secondary, .ArchiveSeminar__Secondary, .ArchiveOld__Secondary, .ArchiveMovie__Secondary, .ArchiveNews__Secondary { padding: 0.82vw 0 0; } .ArchiveCase__Date, .ArchiveColumn__Date, .ArchiveCustomer__Date, .ArchiveSeminar__Date, .ArchiveOld__Date, .ArchiveMovie__Date, .ArchiveNews__Date { padding: 0.83vw 0; font-size: 1.08vw; } .ArchiveCase__Category span, .ArchiveColumn__Category span, .ArchiveCustomer__Category span, .ArchiveSeminar__Category span, .ArchiveOld__Category span, .ArchiveMovie__Category span, .ArchiveNews__Category span { margin: 0 0.83vw 0.83vw 0; padding: 0.42vw 0.83vw; font-size: 1.17vw; } .ArchiveCase:after, .ArchiveColumn:after, .ArchiveCustomer:after, .ArchiveSeminar:after, .ArchiveOld:after, .ArchiveMovie:after, .ArchiveNews:after { bottom: 2.5vw; padding: 0.83vw 2.48vw; font-size: 1.33vw; } } @media screen and (max-width: 600px) { .ArchiveCase, .ArchiveColumn, .ArchiveCustomer, .ArchiveSeminar, .ArchiveOld, .ArchiveMovie, .ArchiveNews { margin: 0 0 4vw; padding: 0 0 4vw; } .ArchiveNews { padding-bottom: 12vw; } .ArchiveCase a:hover, .ArchiveColumn a:hover, .ArchiveCustomer a:hover, .ArchiveSeminar a:hover, .ArchiveOld a:hover, .ArchiveMovie a:hover, .ArchiveNews a:hover { opacity: 0; } .ArchiveCase a:active, .ArchiveColumn a:active, .ArchiveCustomer a:active, .ArchiveSeminar a:active, .ArchiveOld a:active, .ArchiveMovie a:active, .ArchiveNews a:active { opacity: 0.3; } .ArchiveMovie { width: 100%; } .ArchiveCase__Title, .ArchiveColumn__Title, .ArchiveCustomer__Title, .ArchiveSeminar__Title, .ArchiveOld__Title, .ArchiveMovie__Title, .ArchiveNews__Title { margin: 0 0 4vw; } .ArchiveCase__Primary, .ArchiveColumn__Primary, .ArchiveCustomer__Primary, .ArchiveSeminar__Primary, .ArchiveOld__Primary, .ArchiveMovie__Primary, .ArchiveNews__Primary { flex-direction: column; } .ArchiveCase__Image, .ArchiveColumn__Image, .ArchiveCustomer__Image, .ArchiveSeminar__Image, .ArchiveOld__Image, .ArchiveMovie__Image, .ArchiveNews__Image { margin: 0 auto 3vw; width: 50%; } .ArchiveMovie__Image { width: 100%; } .ArchiveCase__Text, .ArchiveCase__Primary.--ThumbOn .ArchiveCase__Text, .ArchiveColumn__Text, .ArchiveColumn__Primary.--ThumbOn .ArchiveColumn__Text, .ArchiveCustomer__Text, .ArchiveCustomer__Primary.--ThumbOn .ArchiveCustomer__Text, .ArchiveSeminar__Text, .ArchiveSeminar__Primary.--ThumbOn .ArchiveSeminar__Text, .ArchiveOld__Text, .ArchiveOld__Primary.--ThumbOn .ArchiveOld__Text, .ArchiveMovie__Text, .ArchiveMovie__Primary.--ThumbOn .ArchiveMovie__Text, .ArchiveNews__Text, .ArchiveNews__Primary.--ThumbOn .ArchiveNews__Text { padding-bottom: 4vw; width: 100%; } .ArchiveCase__Text p, .ArchiveColumn__Text p, .ArchiveCustomer__Text p, .ArchiveSeminar__Text p, .ArchiveOld__Text p, .ArchiveMovie__Text p, .ArchiveNews__Text p { margin-bottom: 0; font-size: 1.7rem; } .ArchiveCase__Secondary, .ArchiveColumn__Secondary, .ArchiveCustomer__Secondary, .ArchiveSeminar__Secondary, .ArchiveOld__Secondary, .ArchiveMovie__Secondary, .ArchiveNews__Secondary { padding: 0; width: 60%; } .ArchiveCase__Date, .ArchiveColumn__Date, .ArchiveCustomer__Date, .ArchiveSeminar__Date, .ArchiveOld__Date, .ArchiveMovie__Date, .ArchiveNews__Date { padding: 2vw 0; font-size: 1.4rem; } .ArchiveCase__Category span, .ArchiveColumn__Category span, .ArchiveCustomer__Category span, .ArchiveSeminar__Category span, .ArchiveOld__Category span, .ArchiveMovie__Category span, .ArchiveNews__Category span { margin: 0 2vw 2vw 0; padding: 1vw 2vw; } .ArchiveCase:after, .ArchiveColumn:after, .ArchiveCustomer:after, .ArchiveSeminar:after, .ArchiveOld:after, .ArchiveMovie:after, .ArchiveNews:after { bottom: 6vw; padding: 2vw 6vw; font-size: 1.7rem; } } /* 関連する事例　 ======================================================== */ .Body__Yarpp { margin: 0 auto; padding: 0 0 30px; width: 100%; } .Yarpp__Heading { clear: both; margin-bottom: 10px; padding: 10px 0; width: 100%; font-size: 2.8rem; font-weight: 700; text-align: center; background: #f6f2ed; border-left: none; border-bottom-width: 3px; border-bottom-style: solid; border-bottom-color: #ffa63d; } .Yarpp { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0 auto; padding: 0; width: 100%; } .Yarpp__Item { display: flex; width: 48%; } .Yarpp__Item a { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: 15px 0; width: 100%; text-decoration: none; border-bottom: 1px solid #d3d3d3; } .Yarpp__Primary { width: 25%; } .Yarpp__Primary:before { padding-top: 100%; } .Yarpp__Primary img { height: 100%; } .Yarpp__Secondary { display: flex; flex-direction: column; margin: 0; padding: 0; width: 72%; } .Yarpp__Title { margin: 0; padding: 10px 0; } .Yarpp__Title h6 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin: 0; padding: 0; font-size: 2.0rem; font-weight: 500; line-height: 1.3; background: none; border: none; } .Yarpp__Text { margin: 0; padding: 0 0 10px; } .Yarpp__Text p { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin: 0; padding: 0; font-size: 1.6rem; font-weight: 400; line-height: 1.5; } .Yarpp__Item dl { display: flex; flex-direction: column; margin: 0; padding: 0; } .Yarpp__Item dl dt { padding: 0 0 10px; color: #666; font-size: 1.3rem; font-weight: 400; } .Yarpp__Item dl dd { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; } .Yarpp__Item dl dd span { display: inline-block; margin: 0 10px 10px 0; padding: 5px 10px; border-radius: 2px; background: #eaeaea; font-size: 1.4rem; font-weight: 400; } @media only screen and (min-width:600px) and (max-width:1200px) { .Body__Yarpp { padding: ; } .Body__Yarpp h5 { margin-bottom: ; padding: ; font-size: ; border-bottom-width: ; } .Yarpp__Item a { padding: ; } .Yarpp__Title { padding: ; } .Yarpp__Title h6 { font-size: ; } .Yarpp__Text { padding: ; } .Yarpp__Text p { font-size: ; } .Yarpp__Item dl dt { padding: ; font-size: ; } .Yarpp__Item dl dd span { margin: ; padding: ; font-size: ; } } @media screen and (max-width: 600px) { .Body__Yarpp { padding: 0 0 6vw; } .Body__Yarpp h5 { margin-bottom: 2vw; padding: 1vw 0 1vw 2vw; font-size: 2.6rem; border-bottom-width: 2px; } .Yarpp { flex-direction: column; } .Yarpp__Item { width: 100%; } .Yarpp__Item a { padding: 4vw 0; } .Yarpp__Primary { width: 20%; } .Yarpp__Secondary { width: 75%; } .Yarpp__Title { padding: 0; } .Yarpp__Title h6 { line-height: 1.5; } .Yarpp__Item dl dd span { margin: 0 2vw 2vw 0; padding: 1vw 2vw; } } /* Page Navi　 ======================================================== */ .PageNavi { display: flex; flex-direction: column; width: 100%; margin: 0 auto; padding: 30px 0 60px; } .PageNavi__Info { padding-bottom: 20px; } .PageNavi__Info, .wp-pagenavi { display: flex; justify-content: center; margin: 0; width: 100%; } .wp-pagenavi .pages, .wp-pagenavi .previouspostslink .wp-pagenavi .nextpostslink { display: none; } .wp-pagenavi a, .wp-pagenavi span { padding: 0.5vw 0.75vw !important; border-width: 1px; border-style: solid; border-radius: 3px; } .wp-pagenavi span.current { color: #fff; } .wp-pagenavi a:hover, .wp-pagenavi span.current { font-weight: 400; } .wp-pagenavi a, .wp-pagenavi span { font-weight: 400; } @media only screen and (min-width:600px) and (max-width:1200px) { .PageNavi { padding: 2.5vw 0 5vw; font-size: 1.33vw; } .PageNavi__Info { padding-bottom: 1.7vw; } } @media screen and (max-width: 600px) { .PageNavi { margin: 0 auto; padding: 4vw 0 4vw; width: 100%; flex-direction: column; } .PageNavi div { text-align: center; font-size: 1.6rem; flex-wrap: wrap; } .PageNavi__Info { padding-bottom: 4vw; } .wp-pagenavi { width: 100%; } .wp-pagenavi a, .wp-pagenavi span { padding: 2vw 3vw !important; font-size: 1.8rem !important; } } /* PageNation */ ul.PageNation { position: relative; display: flex; justify-content: space-between; text-align: center; margin: 0 auto; padding: 50px 0; /* border-top: 1px solid #efefef; */ } .PageNation li { display: inline-block; margin-left: 0; padding: 0 5px; } .PageNation li a { display: block; padding: 10px 40px; font-size: 1.6rem; font-weight: 500; text-decoration: none; border-width: 1px; border-style: solid; border-radius: 5px; } .PageNation li a:hover { color: #fff; opacity: 1.0; } .PageNation .--Back { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media only screen and (min-width:600px) and (max-width:1200px) { ul.PageNation { padding: 4.17vw 0; } .PageNation li { padding: 0 0.4vw; } .PageNation li a { padding: 0.83vw 3.3vw; font-size: 1.34vw; border-radius: 0.4vw; } } @media screen and (max-width: 600px) { ul.PageNation { padding: 3vw 0; } .PageNation li { margin-left: 0 !important; padding: 0 1%; width: 30%; } .PageNation li a { padding: 1vw 0; width: 100%; font-size: 1.6rem; border: 1px solid #ff7200; } } /* お問い合わせフォーム　 ======================================================== */ .ContactForm {} .ContactForm table, #wpcf7cpcnf table { border-collapse: collapse; width: 100%; } .ContactForm table tr, #wpcf7cpcnf table tr { display: flex; margin: -1px 0 0; } .ContactForm table th, #wpcf7cpcnf table th { display: flex; justify-content: flex-start; align-items: flex-start; position: relative; margin: 0; padding: 2%; width: 26%; font-size: 1.7rem; line-height: 1.2; text-align: left; border-right: none; } .ContactForm table th:after, #wpcf7cpcnf table th:after { position: absolute; top: 0; right: 0; content: ""; display: inline-block; width: 1px; height: 100%; background: #eaeaea; } .ContactForm table td, #wpcf7cpcnf table td { position: relative; display: flex; align-items: flex-start; margin: 0 0 0 -1px; padding: 2%; width: 66%; } .ContactForm .--Required { position: absolute; right: 10px; top: 20px; display: flex; justify-content: center; align-items: center; margin: 0; padding: 0 8px; color: #fff; font-size: 1.2rem; font-weight: 400; border-radius: 2px; } .ContactForm table th p, .ContactForm table td p, #wpcf7cpcnf table th p, #wpcf7cpcnf table td p { margin: 0; width: 100%; } /* #wpcf7cpcnf table tr:last-child { display: none;確認画面の最後の項目(チェックする)を非表示 */ } .ContactForm__Date { flex-direction: column; } .ContactForm table td em { font-style: normal; } .ContactForm table td .--Required { right: initial; top: 20px; left: 150px; } .ContactForm table td small { display: inline-block; font-size: 1.3rem; line-height: 1.5; } .ContactForm .wpcf7-list-item { margin-left: 0; } .ContactForm input[type="text"], .ContactForm input[type="email"], .ContactForm input[type="tel"] { width: 95%; padding: 2%; margin: 0; border: 1px solid #ccc; } .ContactForm textarea { width: 95%; padding: 2%; margin: 0; border: 1px solid #ccc; } .ContactForm input[type="submit"], .wpcf7cp-btns button { display: block; margin: 20px auto; padding: 20px 0; width: 50%; color: #fff; font-size: 2.4rem; font-weight: bold; border: none; border-radius: 10px; } .ContactForm input[type="submit"]:hover, .wpcf7cp-btns button:hover { opacity: 0.7; cursor: pointer; } .wpcf7cp-btns { display: flex; justify-content: center; } .wpcf7cp-btns button { margin: 0 1%; width: 47%; } .ContactForm input[type="submit"]:disabled { opacity: 0.3; cursor: not-allowed; } .ContactForm__Date input[type="text"] { margin-bottom: 20px; } @media only screen and (min-width:600px) and (max-width:1200px) { .ContactForm .--Required { right: 0.85vw; top: 1.66vw; padding: 0 0.65vw; font-size: 1vw; } .ContactForm table td small { font-size: 1vw; } .ContactForm table td .--Required { left: 12.5vw; top: 1.8vw; } .ContactForm__Date input[type="text"] { margin-bottom: 1.8vw; } .ContactForm input[type="submit"], .wpcf7cp-btns button { margin-bottom: 1.68vw auto; padding: 1.68vw 0; font-size: 2vw; border-radius: 0.8vw; } } @media screen and (max-width: 600px) { div#wpcf7cpcnf { z-index: 2; } .ContactForm table tr, #wpcf7cpcnf tr { flex-direction:column; } .ContactForm table th, #wpcf7cpcnf table th { border-right: 1px solid #eaeaea; } .ContactForm table td, #wpcf7cpcnf table td { margin: -1px 0 0 0; } .ContactForm table th, .ContactForm table td, #wpcf7cpcnf table th, #wpcf7cpcnf table td { width: 96%; } .ContactForm .--Required { right: 3vw; top: 3vw; padding: 0 2vw; font-size: 1.3rem; } .ContactForm table th:after, #wpcf7cpcnf table th:after { display: none; } .ContactForm table td, #wpcf7cpcnf table td { padding: 2rem 2%; } .ContactForm table td .--Required { top: 4.5vw; left: 25vw; } .ContactForm input[type="submit"] { width: 80%; } .wpcf7cp-btns button { margin: 0 auto 4vw; width: 100%; } .wpcf7cp-btns { flex-direction: column; } .ContactForm__Date input[type="text"] { margin-bottom: 4vw; } .ContactForm .--AlignCenter { line-height: 1.5; } } /* 404 Not found ======================================================== */ .Page404 { display: flex; flex-direction: column; align-items: center; margin: 0 auto; padding: 100px 0 200px; } @media only screen and (min-width:600px) and (max-width:1200px) { .Page404 { padding: 8.4vw 0 16.7vw; } } @media screen and (max-width: 600px) { .Page404 { padding: 20vw 0 25vw; } } /* Search Results ======================================================== */ .SearchResults dd { margin: 0; } .SearchResults dt { text-align: center; } .SearchResults dd a { display: block; padding: 1.5rem 0; border-bottom: 1px dotted #eee; }