/* Josh's Custom CSS Reset https://www.joshwcomeau.com/css/custom-css-reset/ */ *,*::before,*::after{box-sizing:border-box;} *{margin:0} html,body{height:100%} body{line-height:1.5;-webkit-font-smoothing:antialiased} img,video,canvas,svg{display:inline-block;max-width:100%;height: auto;} input,button,textarea,select{font:inherit} p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word} #root,#__next{isolation:isolate} /* 要素の初期値 */ html,body{ width:100%; min-width: 1140px; width:expression(document.body.clientWidth < 1140? "1140px" : "auto"); } body{ margin:auto; letter-spacing: .03em; line-height:1.5; font-size: 16px; font-weight: normal; font-family: "Noto Sans JP",'ＭＳ ゴシック',"游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", sans-serif; color: #222222; } h1,h2,h3,h4,h5,h6,p,ul,li{ padding: 0; margin: 0; font-weight: normal; } ul,li{list-style: none;} a{ text-decoration: none; color: #222222; } a:hover{ opacity: .8; } img { image-rendering: -webkit-optimize-contrast; backface-visibility: hidden; -webkit-backface-visibility: hidden; } @media screen and (max-width:751px) { html,body{ min-width: unset; width:100%; } body{ font-size: 3.2vw; font-feature-settings: "palt"; } img { image-rendering: auto; } } /* lightbox */ .lb-loader,.lightbox{text-align:center;line-height:0;position:absolute;left:0}body.lb-disable-scrolling{overflow:hidden}.lightboxOverlay{position:absolute;top:0;left:0;z-index:9999;background-color:#000;filter:alpha(Opacity=80);opacity:.8;display:none}.lightbox{width:100%;z-index:10000;font-weight:400;outline:0}.lightbox .lb-image{display:block;height:auto;max-width:inherit;max-height:none;border-radius:3px;border:4px solid #fff}.lightbox a img{border:none}.lb-outerContainer{position:relative;width:250px;height:250px;margin:0 auto;border-radius:4px;background-color:#fff}.lb-outerContainer:after{content:"";display:table;clear:both}.lb-loader{top:43%;height:25%;width:100%}.lb-cancel{display:block;width:32px;height:32px;margin:0 auto;background:url(../../image/lightbox/loading.gif) no-repeat}.lb-nav{position:absolute;top:0;left:0;height:100%;width:100%;z-index:10}.lb-container>.nav{left:0}.lb-nav a{outline:0;background-image:url(data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==)}.lb-next,.lb-prev{height:100%;cursor:pointer;display:block}.lb-nav a.lb-prev{width:34%;left:0;float:left;background:url(../../image/lightbox/prev.png) left 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-prev:hover{filter:alpha(Opacity=100);opacity:1}.lb-nav a.lb-next{width:64%;right:0;float:right;background:url(../../image/lightbox/next.png) right 48% no-repeat;filter:alpha(Opacity=0);opacity:0;-webkit-transition:opacity .6s;-moz-transition:opacity .6s;-o-transition:opacity .6s;transition:opacity .6s}.lb-nav a.lb-next:hover{filter:alpha(Opacity=100);opacity:1}.lb-dataContainer{margin:0 auto;padding-top:5px;width:100%;border-bottom-left-radius:4px;border-bottom-right-radius:4px}.lb-dataContainer:after{content:"";display:table;clear:both}.lb-data{padding:0 4px;color:#ccc}.lb-data .lb-details{width:85%;float:left;text-align:left;line-height:1.1em}.lb-data .lb-caption{font-size:13px;font-weight:700;line-height:1em}.lb-data .lb-caption a{color:#4ae}.lb-data .lb-number{display:block;clear:left;padding-bottom:1em;font-size:12px;color:#999}.lb-data .lb-close{display:block;float:right;width:30px;height:30px;background:url(../../image/lightbox/close.png) top right no-repeat;text-align:right;outline:0;filter:alpha(Opacity=70);opacity:.7;-webkit-transition:opacity .2s;-moz-transition:opacity .2s;-o-transition:opacity .2s;transition:opacity .2s}.lb-data .lb-close:hover{cursor:pointer;filter:alpha(Opacity=100);opacity:1} /** * Swiper 8.3.2 https://swiperjs.com **/ @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-pointer-events{touch-action:pan-y}.swiper-pointer-events.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d,.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide,.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top,.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-horizontal.swiper-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-vertical.swiper-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:50%;background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:10px;top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-next+.swiper-slide,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden} /* 共通幅 */ .common_wfull{ width: 100%; margin-left: auto; margin-right: auto; } .common_w{ width: 1140px; margin-left: auto; margin-right: auto; } .common_w940{ width: 92%; max-width: 940px; margin-left: auto; margin-right: auto; } @media screen and (max-width:751px) { .common_w{ width: 92%; } .common_w.mb_w84,.common_w940.mb_w84,.common_wfull.mb_w84{ width: 84%; } } /* 共通レイアウト */ .flex{ display:-webkit-box; display:-ms-flexbox; display:flex; } .flex.Between { -webkit-box-pack : justify; -ms-flex-pack : justify; justify-content : space-between; } .flex.Around{ -ms-flex-pack : distribute; justify-content : space-around; } .flex.End{ -webkit-justify-content : flex-end; -ms-flex-pack : end; justify-content : flex-end; } .flex.Center{ -webkit-justify-content : center; -ms-flex-pack : center; justify-content : center; } .flex.align_s{ align-items:flex-start } .flex.align_c{ -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex.column{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .flex.wrap{ flex-wrap: wrap; } .flex.column1 > *{ width: 100%; } .flex.column2 > *{ width: 50%; } .flex.column3 > *{ width: 33%; } @media screen and (max-width:751px) { .pc_only{display: none!important;} } @media screen and (min-width:751px) { .mb_only{display: none!important;} } /* ボタン */ .gcv_btn{ background-color: #C7B692; background: -webkit-gradient(0deg,linear,left top,left bottom,from(#C7B692),color-stop(0.5, #C7B692),color-stop(0.5, #E0D6C6), to(#E0D6C6)); background: -moz-linear-gradient(0deg, #C7B692 0%, #C7B692 50%, #E0D6C6 50%,#E0D6C6); background: linear-gradient(0deg, #C7B692 0%, #C7B692 50%, #E0D6C6 50%,#E0D6C6); color: #fff; } .rcv_btn{ background-color: #EB6261; background: -webkit-gradient(0deg,linear,left top,left bottom,from(#EB6261),color-stop(0.5, #EB6261),color-stop(0.5, #E8786E), to(#E8786E)); background: -moz-linear-gradient(0deg, #EB6261 0%, #EB6261 50%, #E8786E 50%,#E8786E); background: linear-gradient(0deg, #EB6261 0%, #EB6261 50%, #E8786E 50%,#E8786E); color: #fff; } .blink_btn{ padding: .4em 0; text-align: center; background-color: #477684; background: -webkit-gradient(0deg,linear,left top,left bottom,from(#477684),color-stop(0.5, #477684),color-stop(0.5, #889aa1), to(#889aa1)); background: -moz-linear-gradient(0deg, #477684 0%, #477684 50%, #889aa1 50%,#889aa1); background: linear-gradient(0deg, #477684 0%, #477684 50%, #889aa1 50%,#889aa1); font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; font-weight: 500; color: #fff; letter-spacing: .1em; } .rarrow{ padding-right: 20px; position: relative; } .rarrow::after{ content:""; display: block; width: 6px; height: 9px; margin: auto; background-image:url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%207.6%2010%22%20style%3D%22enable-background%3Anew%200%200%207.6%2010%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23FFFFFF%3B%7D%3C%2Fstyle%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%221%2C10%200%2C8.8%205%2C5%200%2C1.3%201%2C0%207.6%2C5%20%22%2F%3E%3C%2Fsvg%3E'); background-repeat: no-repeat; background-size: contain; background-position: center; position: absolute; top: 0;bottom: 0; right: 0px; } a.txt_larrow::before, .txt_larrow a::before{ content: ">"; } a.txt_rarrow::after, .txt_rarrow a::after{ content: ">"; margin-left: 0.5em; } .arcs_wrap{ margin-top: 25px; text-align: center; } .arc_btn{ display: inline-block; background-image: url(../../image/home/home_arc_icon.svg); background-repeat: no-repeat; background-position: bottom center; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; color: #889aa1; line-height: 1; } @media screen and (min-width:751px){ .arc_btn{ padding-bottom: 20px; background-size: 81px auto; font-size: 87.5%; } } @media screen and (max-width:751px){ .blink_btn{ font-weight: 600; } .rarrow{ padding-right: 5.33vw; } .rarrow::after{ width: 2vw; height: 3vw; } .arcs_wrap{ margin-top: 6.66vw; } .arc_btn{ padding-bottom: 5.33vw; background-size: 20vw auto; font-size: 3.7vw; } } /* アンカーリンク */ .anc_wrap{ text-align: center; } .anc_wrap .anc_btn{ display: inline-block; padding: .4em 1.2em; border: 1px solid #022222; background-image: url(../../image/common/btn_bk.svg); background-position: right bottom; background-size: contain; background-repeat: no-repeat; color: #022222; line-height: 1; } .anc_wrap .anc_btn span{ display: inline-block; padding-right:1em; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2010.6%208.3%22%20style%3D%22enable-background%3Anew%200%200%2010.6%208.3%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23022222%3B%7D%3C%2Fstyle%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%225.3%2C8.3%200%2C1.2%201.6%2C0%205.3%2C4.9%209%2C0%2010.6%2C1.2%20%22%2F%3E%3C%2Fsvg%3E'); background-size: 0.7em; background-position: center right; background-repeat: no-repeat; background-position: bottom 0.15em right; } @media screen and (min-width:751px){ .anc_wrap{ margin-bottom: 55px; } .anc_wrap .anc_btn{ font-size: 82.5%; } .anc_wrap .anc_btn + .anc_btn{ margin-left: 24px; } } @media screen and (max-width:751px){ .anc_wrap{ margin-bottom: 13.33vw; } .anc_wrap .anc_btn{ width: 39.33vw; padding-left: 0; padding-right: 0; border-width: .133vw; font-size: 2.9vw; } .anc_wrap .anc_btn + .anc_btn{ margin-left: 4.15vw; } } /******************** // サイトヘッダー header *********************/ .site_header{ border-bottom: 3px solid #C7B692; z-index: 11111111; } /* headerlogo */ .site_header .logo{ padding: 34px 0 6px 80px; background-image: url(../../image/common/header_logo_pc.svg); background-size: 69px; background-position: left bottom 1px; background-repeat: no-repeat; } .site_header .logo .site_tit{ line-height: 1.2; letter-spacing: 0em; font-size: 81.25%; font-weight: 500; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; font-feature-settings: "palt"; color: #84969d; } /* gnav */ .site_header .gnav a{ font-size: 87.5%; font-weight: 600; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; } @media screen and (min-width:751px) { .site_header{ position: fixed; width: 100%; background-color: #fff; } .site_header .gnav{ max-width: 820px; padding-bottom: 16px; } .site_header .contacts{ justify-content: flex-end; font-size: 100%; letter-spacing: .06em; line-height: 1; } .site_header .contacts li{ display: inline-block; margin-left: 1px; } .site_header .contacts a{ display: block; width: 180px; min-height: 30px; padding: 8px 5px; box-sizing: border-box; text-align: center; line-height: 1; letter-spacing: .1em; } .site_header .contacts a.tel{ padding: 0 15px; line-height: 0; } .site_header nav{ justify-content: flex-end; margin-top: 37px; font-size: 100%; letter-spacing: .02em; line-height: 1; } .site_header nav a{ color: #022222; } .site_header nav .menu>.menu-item{ display: inline-block; padding-right: 1em; line-height: 1; position: relative; } .site_header nav .menu>.menu-item:last-of-type{ padding-right: 0; } .site_header nav .menu>.menu-item .sub-menu{ transition: all 0.5s 0s ease; opacity: 0; pointer-events: none; padding: 0 15px; border-top: 15px solid #fff; background-color: rgba(199, 182, 146, .85); position: absolute; top: 100%; } .site_header nav .menu>.menu-item:hover .sub-menu, .site_header nav .sub-menu:hover{ opacity: 1; pointer-events: all; } .site_header nav .menu>.menu-item .sub-menu::before{ content: ""; display: block; width: 0; height: 0; border-style: solid; border-width: 0 3.5px 15px 3.5px; border-color: transparent transparent rgba(199, 182, 146, .8) transparent; position:absolute; left: 10px; bottom: 100%; } .site_header nav .sub-menu a{ display: block; padding: 15px 10px; white-space: nowrap; color: #fff; } .site_header nav .sub-menu .menu-item{position: relative;} .site_header nav .sub-menu .menu-item + .menu-item::after{ content: ""; display: block; width: 100%; height: 3px; background-color: #fff; border-radius: 1.5px; /* 線幅の半分 */ position: absolute; top: 0; left: 0; } } @media screen and (max-width:751px) { .site_header{ position: fixed; width: 100%; padding: 2.4vw 0; border-width: 1.333vw; background: #fff; } .site_header .common_w{ width: 95.33%; } .site_header .gnav a { font-size: 2.66vw; } .site_header .logo { padding: 7vw 0 .5vw 14.5vw; background-image: url(../../image/common/header_logo.svg); background-size: 13.33vw; background-position: left bottom 0.2vw; z-index: 11111; } .site_header .logo .site_tit{ font-size: 2.66vw; } .site_header .tel_icon{ display: block; width: 8vw; line-height: 0; } .site_header .menu_icon{ margin-right: 1.67vw; position: relative; z-index: 1111; } .site_header .menu_icon>* + *{ margin-left: 4vw; } /* .gnav_wrap ハンバーガーメニュアイコン*/ .site_header .navbar{ width: 8vw; height: 8vw; position: relative; } .site_header .navbar span{ display: block; width: 100%; height: 1.33vw; margin: auto; background-color: #C7B692; transition: all 0.6s; transform: rotate(0deg); position: absolute; } .site_header .navbar span:first-of-type{transform-origin:0 0 0;top: .667vw;} .site_header .navbar span:nth-of-type(2){top:0;bottom:0;} .site_header .navbar span:last-of-type{transform-origin:0% 100% 0;bottom: .667vw;} .site_header .navbar.active span:first-of-type { transform: rotate(45deg); left: 0.7vw; } .site_header .navbar.active span:nth-of-type(2){opacity: 0;} .site_header .navbar.active span:last-of-type { transform: rotate(-45deg); left: 0.7vw; } /* .gnav_wrap ハンバーガーメニュの内容*/ .site_header .gnav_wrap{ width:53.33vw; height: 100%; padding-top: 20vw; padding-bottom: 4vw; border-bottom: 1.66vw solid #477684; background: rgba(255,255,255,.85); overflow: hidden; transition: all 0.6s; position: fixed; z-index: 999; top:0; right: -120%; } .site_header .gnav_wrap.panelactive{ right: 0; } .site_header .gnav_wrap .yscrool{ max-height: 100%; overflow: scroll; } .site_header .gnav_wrap nav{ display: block; width: 75%; margin: 0 auto; } .site_header .gnav nav a{ letter-spacing: .02em; font-family: 'ＭＳ Ｐゴシック','ＭＳ ゴシック',"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif; } .site_header .gnav_wrap nav ul:not(.sub-menu) a{ display: block; width: 100%; padding: 2.66vw 0; border-bottom: .4vw solid #C7B692; color: #477684; position: relative; } .site_header .menu-item-has-children > a{ pointer-events: none; } .site_header .menu-item-has-children > a::after{ content: ""; display: block; width: 2.66vw; height: 2.66vw; margin: auto; background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2019.5%2019.4%22%20style%3D%22enable-background%3Anew%200%200%2019.5%2019.4%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Benable-background%3Anew%3B%7D%20.st1%7Bfill%3A%23E8786E%3B%7D%3C%2Fstyle%3E%3Cg%20class%3D%22st0%22%3E%20%3Cpath%20class%3D%22st1%22%20d%3D%22M0%2C8.7h8.8V0h1.9v8.7h8.8v1.9h-8.8v8.8H8.8v-8.8H0V8.7z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E'); background-repeat: no-repeat; background-size: contain; transition: all 0.6s; position: absolute; top:0; right: -4vw; bottom: 0; } .site_header .menu-item-has-children.active > a::after{ transform: rotate(45deg); transform-origin:50% 50% 0; } .site_header .menu-item-has-children ul.sub-menu{ display: none; } .site_header .gnav_wrap nav ul.sub-menu a{ padding-left: 3.66vw; } /* .reserve_menu メニュー内のボタンエリア*/ .site_header .reserve_menu{ background-color: #F2F2F0; padding: 3.33vw 0; margin-top: 2.66vw; } .site_header .reserve_menu a{ display: flex; justify-content: center; align-items: center; height: 9.13vw; padding-left: 8vw; text-align: center; font-size: 3.9vw; letter-spacing: 0; position: relative; } .site_header .reserve_menu a + a{ margin-top: 1.6vw; } .site_header .reserve_menu a::before{ content:""; display: block; width: 5.6vw; height: 5.6vw; margin: auto; background-repeat: no-repeat; background-size: contain; position: absolute; top:0; bottom: 0; left: 2vw; } .site_header .reserve_menu a.webReserve::before{ background-image: url(../../image/common/icon_webReserve.svg); } .site_header .reserve_menu a.telReserve::before{ background-image: url(../../image/common/icon_telReserve.svg); } .site_header .reserve_menu a span{ display: inline-block; } .site_header .reserve_menu a.telReserve img{ width: 8.5em; } /* .reserve_menu メニュー内最下部のボタンエリア*/ .site_header .others_menu{ width: 92%; margin-top: 4vw; margin-left: auto; margin-right: auto; } .site_header .others_menu a{ display: block; width: 24vw; padding: 1.66vw 0; background-color: #C7B692; border-bottom:1.33vw solid #EB6261; text-align: center; color: #fff; font-size: 3.2vw; letter-spacing: .05em; line-height: 1; } .site_header .others_menu a span{ display: inline-block; padding-top: 6.66vw; background-repeat: no-repeat; background-position: center top -1vw; background-size: 7vw; } .site_header .others_menu a.shiryo span{ background-image: url(../../image/common/icon_shiryo.svg); } .site_header .others_menu a.model span{ background-image: url(../../image/common/icon_model.svg); } } /******************** // main // ヘッダーの高さ分調整 *********************/ @media screen and (min-width:751px) { main{padding-top: 103px;} } @media screen and (max-width:751px) { main{padding-top: 20vw;} } /* パンくず */ .breadcrub{letter-spacing: 0;} .breadcrub li{display: inline-block;} .breadcrub li::after{content:"＞";margin: 0 .2em;} .breadcrub li:last-of-type:after{content:unset;} @media screen and (min-width:751px) { .breadcrub{padding:20px 0 55px;text-align: right;font-size: 75%;} } @media screen and (max-width:751px) { .breadcrub{padding:3.33vw 0 14.66vw;font-size: 2.4vw;} } /******************** // サイトフッター #foot *********************/ #foot{ padding-top: 30px; background-color: #889AA1; border-bottom: 5px solid #EB6261; } #foot .footer_logo{ text-align: center; } #foot .footer_logo img{ display: inline-block; width: 212px; } #foot .txt_wrap{ padding: 100px 0 10px; font-size: 87.5%; color: #fff; } #foot .txt_wrap .sec + .sec{ margin-top: 60px; } #foot .txt_wrap .menu-item{ display: inline-block; } #foot .txt_wrap a{ color: #fff; } #foot .txt_larrow a{ margin-right: 1em; } @media screen and (min-width:751px) { #foot .foot_wrap{ border-bottom: 20px solid #C7B692; } } @media screen and (max-width:751px) { #foot .footer_logo img { width: 35.33vw; } #foot .txt_wrap .sec + .sec { margin-top: 4vw; } #foot .txt_wrap { width: 84vw; padding: 8vw 0 31.33vw; font-size: 2.66vw; } .mb_floatb{ display: none; position: fixed; bottom: 0; width: 100%; background-color: #fff; border-top: 0.8vw solid #fff; border-bottom:1.33vw solid #EB6261; z-index: 1111; } .mb_floatb.active{ display: flex; } .mb_floatb a{ display: block; width: 27.73vw; padding: 1.2vw 0 2.13vw; background-color: #C7B692; text-align: center; color: #fff; font-size: 3.2vw; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; font-weight: 600; letter-spacing: .05em; line-height: 1; } .mb_floatb a.tel{ width: 15vw; } .mb_floatb a span{ display: inline-block; padding-top: 8.2vw; background-repeat: no-repeat; background-position: center bottom 1.5em; background-size: auto 6.66vw; } .mb_floatb a.shiryo span{ background-image: url(../../image/common/icon_shiryo.svg); } .mb_floatb a.model span{ background-image: url(../../image/common/icon_model.svg); } .mb_floatb a.counsel span{ background-image: url(../../image/common/icon_counsel.svg); } .mb_floatb a.tel span{ background-image: url(../../image/common/icon_tel.svg); } } /******************** // 共通コンテンツ *********************/ /* タイトル */ .contents_head{ margin-bottom: 150px; font-feature-settings: "palt"; } .contents_head .wrap{ padding-left: 77.5px; color: #022222; position: relative; } .contents_head .wrap::after{ content:""; display: block; width: 45px; height: 45px; background: #fff; border: 15px solid #C7B692; position: absolute; left: 12.5px; top: 0; } .contents_head .tit{ font-size: 150%; letter-spacing: .05em; line-height: 1; } .contents_head .fear{ margin-top: 8px; font-size: 75%; letter-spacing: 0; line-height: 1; } .contents_head .visual{ width: 100%; height: 218px; margin-top: 50px; background-repeat: no-repeat; background-size: auto 100%; transition: all 1s; } .contents_head .lead{ width: 600px; margin-top: 30px; margin-left: auto; margin-right: auto; line-height: 1.3125; letter-spacing: .05em; text-align: justify; text-align-last: left; } .contents_head.tit_only .wrap{ display: flex; align-items: center; flex-wrap: wrap; min-height: 45px; } .contents_head.tit_only.newline .wrap::after { top: 0.2em; } .contents_head.tit_only.newline .tit { line-height: 1.2; } /* contents_tit01 */ .contents_tit01{ text-align: center; margin-bottom: 50px; font-feature-settings: "palt"; } .contents_tit01 .wrap{ display: inline-block; padding-bottom: 40px; color: #022222; position: relative; } .contents_tit01 .wrap::after{ content:""; width: 50px; max-width: 100%; height: 10px; background-color: #889AA1; border-radius: 30px; margin: auto; position: absolute; left: 0; right: 0; bottom: 0; } .contents_tit01 .tit{ font-size: 150%; line-height: 1.25; letter-spacing: .05em; } .contents_tit01 .fear{ margin-top: 10px; font-size: 112.5%; line-height: 1; } /* contents_tit02 */ .contents_tit02{ margin-bottom: 16px; text-align: center; } .contents_tit02 .wrap{ display: inline-block; position: relative; } .contents_tit02 .icon{ display: inline-block; min-width: 50px; padding-top: 34px; margin-bottom: 14px; background-image: url(../../image/common/content_tit02.svg); background-repeat: no-repeat; background-position: center top; background-size: 27.6px; font-size: 10px; color: #889AA1; letter-spacing: 0; line-height: 1; } .contents_tit02 .tit{ font-size: 18px; color: #022222; letter-spacing: .05em; line-height: 1.2; } .contents_tit02 .wrap + p{ margin-top: 8px; font-size: 12px; color: #889AA1; line-height: 1.25; letter-spacing: 0; } @media screen and (max-width:751px){ .contents_head { margin-bottom: 26.66vw; } .contents_head .wrap{ width: 86.2vw; padding-left: 4vw; } .contents_head .wrap::after{ width: 2vw; height: 100%; background: #C7B692; border: unset; left: 0; } .contents_head .tit{ font-size: 5.33vw; } .contents_head .fear{ margin-top: 1.33vw; font-size: 2.66vw; line-height: 1.25; } .contents_head .visual{ width: 100%; height: 29.33vw; margin-top: 5.33vw; } .contents_head .lead{ width: 84vw; margin-top: 13.33vw; font-size: 3.2vw; line-height: 1.54; letter-spacing: .03em; } .contents_head.tit_only .wrap { padding-left: 4vw; min-height: unset; } .contents_head.tit_only .wrap::after { width: 2vw; height: 100%; background: #C7B692; border: unset; } /* contents_tit01 */ .contents_tit01, .contents_tit01.tit_only{ margin-bottom: 6.66vw; } .contents_tit01 .wrap{ padding-bottom: 4vw; } .contents_tit01 .wrap::after{ width: 6.66vw; height: 2vw; } .contents_tit01 .tit{ font-size: 4.8vw; line-height: 1.3; } .contents_tit01 .fear{ margin-top: 3.66vw; font-size: 2.66vw; } .contents_tit01.min .tit{ font-size: 5.33vw; line-height: 1; } .contents_tit01.min .fear { margin-top: 2.16vw; letter-spacing: 0; } /* contents_tit02 */ .contents_tit02{ margin-bottom: 5.33vw; } .contents_tit02 .icon{ display: inline-block; min-width: 6.67vw; padding-top: 8vw; margin-bottom: 2.66vw; background-size: 6.8vw; font-size: 2.66vw; } .contents_tit02 .tit{ font-size: 4vw; } .contents_tit02 .wrap + p{ margin-top: 2.66vw; font-size: 2.66vw; } } /* 区切り */ .ob-line { background-image: url(../../image/common/block_border.png); background-repeat: no-repeat; background-position: center bottom; padding-bottom: 110px; } @media screen and (max-width:751px){ .ob-line { padding-bottom: 16vw; } } /******************** // CVエリア *********************/ /* cvarea_main */ .cvarea_main a{ display: block; line-height: 1; } @media screen and (min-width:751px){ .cvarea_main{ padding: 30px 0 25px; background-color: #F2F2F0; } .cvarea_main a{ width: 366px; } } @media screen and (max-width:751px){ .cvarea_main{ width: 92%; margin-left: auto; margin-right: auto; } .cvarea_main a{ width: 100%; } .cvarea_main a + a{ margin-top: 2.13vw; } } /* cvarea_bet */ .cvarea_bet{ padding: 30px 0; border-top: 15px solid #F9F9F9; background-color: #F2F2F0; text-align: center; } .cvarea_bet .tit{ display: inline-block; width: 680px; margin-bottom: 16px; line-height: 1; } .btn_area{ width: 100%; max-width: 1140px; margin-left: auto; margin-right: auto; } .cvarea_bet a{ display: flex; justify-content: center; align-items: center; width: 48.25%; height: 60px; padding-left: 30px; text-align: center; font-size: 162.5%; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; font-weight: 600; letter-spacing: .05em; position: relative; } .cvarea_bet a::before{ content:""; display: block; width: 38px; height: 38px; margin: auto; background-repeat: no-repeat; background-size: contain; position: absolute; top:0; bottom: 0; left: 15px; } .cvarea_bet a.webReserve::before{ background-image: url(../../image/common/icon_webReserve.svg); } .cvarea_bet a.telReserve::before{ background-image: url(../../image/common/icon_telReserve.svg); } .cvarea_bet a.webReserve span{ width: 425px; } .cvarea_bet a.telReserve span{ width: 436px; } .cvarea_bet a span picture,.cvarea_bet a span img{ display: block; } .cvarea_bet a .rarrow{ padding-right: 30px; } @media screen and (min-width:751px){ .cvarea_bet .tit{ position: relative; } .cvarea_bet .tit::after{ content:""; display: block; width: 188px; height: 75px; background-image: url(../../image/common/cvarea_pre01_pc.png); background-repeat: no-repeat;background-size: contain; position: absolute; left: 104%; bottom: -10px; } .cvarea_bet a .rarrow::after { width: 13px; height: 20px; } } @media screen and (max-width:751px){ .cvarea_bet { padding: 4vw 0; border-width: 2vw; } .cvarea_bet .btn_area{ position: relative; } .cvarea_bet .btn_area::after{ content:""; display: block; width: 31.73vw; height: 13.86vw; margin: auto; background-image: url(../../image/common/cvarea_pre01_sp.png); background-repeat: no-repeat;background-size: contain; position: absolute; left: 2.66vw; bottom: 0; top: 0; z-index: 11; } .cvarea_bet .tit{ width: 94vw; margin-bottom: 2vw; } .cvarea_bet a{ width: 100%; height: 10.66vw; padding-left: 46vw; padding-right: 7vw; font-size: 4.6vw; } .cvarea_bet a::before{ width: 6.66vw; height: 6.66vw; left: 36.8vw; } .cvarea_bet a.webReserve{ order:1; } .cvarea_bet a.telReserve{ order:2; margin-top: 2vw; } .cvarea_bet a.webReserve span{ width: auto; line-height: 1; } .cvarea_bet a.telReserve span { width: 10.5em; } .cvarea_bet a .rarrow { padding-right: 5.33vw; } } /* cvarea_model */ .cvarea_model{ padding: 30px 0; border-top: 15px solid #F9F9F9; background-color: #F2F2F0; text-align: center; } .cvarea_model .btn_area{ position: relative; } .cvarea_model .btn_area::after{ content:""; display: block; width: 180px; height: 79px; margin: auto; background-image: url(../../image/common/cvarea_pre01_sp.png); background-repeat: no-repeat;background-size: contain; position: absolute; left: 28%; bottom: 0; top: 0; } .cvarea_model .tit{ display: inline-block; width: 680px; margin-bottom: 16px; line-height: 1; } .cvarea_model a{ display: flex; justify-content: center; align-items: center; width: 100%; height: 60px; padding-left: 430px; text-align: center; font-size: 162.5%; font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; font-weight: 600; letter-spacing: .05em; position: relative; } .cvarea_model a::before{ content:""; display: block; width: 38px; height: 38px; margin: auto; background-repeat: no-repeat; background-size: contain; position: absolute; top:0; bottom: 0; left: 520px; } .cvarea_model a.telReserve{ margin-top: 10px; } .cvarea_model a.webReserve::before{ background-image: url(../../image/common/icon_webReserve.svg); } .cvarea_model a.telReserve::before{ background-image: url(../../image/common/icon_telReserve.svg); } .cvarea_model a.telReserve span { width: 10em; line-height: 0; } .cvarea_model a span picture,.cvarea_bet a span img{ display: block; } .cvarea_model a .rarrow{ padding-right: 30px; } @media screen and (min-width:751px){ .cvarea_model a{ padding-right: 165px; } .cvarea_model a .rarrow::after { width: 17px; height: 22px; } } @media screen and (max-width:751px){ .cvarea_model { padding: 4vw 0; border-width: 2vw; } .cvarea_model .btn_area::after{ width: 31.73vw; height: 13.86vw; left: 2.66vw; } .cvarea_model .tit{ width: 90vw; margin-bottom: 2vw; } .cvarea_model a{ height: 10.66vw; padding-left: 46vw; padding-right: 7vw; font-size: 4.6vw; } .cvarea_model a::before{ width: 6.66vw; height: 6.66vw; left: 36.8vw; } .cvarea_model a.telReserve{ margin-top: 2vw; } .cvarea_model a.webReserve span{ width: auto; line-height: 1; } .cvarea_model a.telReserve span { width: 10.5em; } .cvarea_model a .rarrow { padding-right: 5.33vw; } } /* cv_flcounsel */ .cv_flcounsel{ display: block; max-width: 620px; width: 40%; box-sizing: border-box; padding-right: 60px; margin-left: auto; background-color: #EB6261; background: -webkit-gradient(0deg,linear,left top,left bottom,from(#EB6261),color-stop(0.5, #EB6261),color-stop(0.5, #E8786E), to(#E8786E)); background: -moz-linear-gradient(0deg, #EB6261 0%, #EB6261 50%, #E8786E 50%,#E8786E); background: linear-gradient(0deg, #EB6261 0%, #EB6261 50%, #E8786E 50%,#E8786E); color: #fff; position: relative; } .cv_flcounsel::after{ content: "※Amazonギフトカードは前日までにご予約いただき、初めて当店をご利用の方に限ります。\A※キャンペーン主催：株式会社オノヤ\A※AmazonはAmazon.co,Inc.またはその関連会社の商標です。"; white-space: pre; font-size: 10px; color: #000; position: absolute; top: 105%; left: 0; } .cv_flcounsel span{ display: inline-block; padding: 8px 0px 8px 8px; line-height: 0; position: relative; } .cv_flcounsel span:after{ content:""; width: 114px; height: 100px; background-image: url(../../image/common/cv_flcounsel_visual.png); position: absolute; right: -57px; top:-25px; } .cv_flcounsel img{ width: 360px; height: auto; } /* cv_caution */ .cv_caution{ text-align: left; font-size: 10px; } @media screen and (max-width:751px){ .cv_caution{ padding: 1vw 2vw 0; font-size: 2vw; } .cvarea_main .cv_caution{ padding-left: 0; padding-right: 0; } } .cvarea_main .cv_caution, .cvarea_bet .cv_caution, .cvarea_taste .cv_caution, .cvarea_model .cv_caution{ margin-left: auto; margin-right: auto; } @media screen and (min-width:751px){ .cvarea_main .cv_caution, .cvarea_bet .cv_caution, .cvarea_taste .cv_caution, .cvarea_model .cv_caution{ max-width: 1140px; margin-top: 10px; } } /* cvarea_panel */ .cvarea_panel a{ line-height: 0; box-shadow: 5px 5px 7px rgba(0, 0, 0, .25); } .cvarea_panel .cv_caution{ letter-spacing: 0; } @media screen and (max-width:751px){ .cvarea_panel a + a{ margin-top:4vw; } .cvarea_panel .cv_caution{ margin-top: 2.66vw; } } /* cvarea_taste */ .cvarea_taste a{ display: block; width: 100%; line-height: 1; background-repeat: no-repeat; background-size: contain; background-position: top left; position: relative; } .cvarea_taste .txt_wrap .tit{ color: #e8786e; font-weight: bold; font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", sans-serif; } .cvarea_taste .btn_txt{ text-align: right; color: #fff; } .cvarea_taste .lead{ line-height: 1.5; letter-spacing: .02em; } .cvarea_taste .txt_wrap p:last-of-type{ line-height: 1.25; letter-spacing: -.0125em; } .cvarea_taste .txt_wrap p:last-of-type span{ letter-spacing: -.1em; } .cvarea_taste .reserve_btn .visual{ background-image: url(../../image/common/cvarea-taste-reserve-slow.png); background-position: center; background-size: cover; background-repeat: no-repeat; position: absolute; } .cvarea_taste .reserve_btn .visual.INDUSTRIAL{ background-image: url(../../image/common/cvarea-taste-reserve-industrial.png); } .cvarea_taste .reserve_btn .visual.SLOW_CAFE{ background-image: url(../../image/common/cvarea-taste-reserve-slow.png); } .cvarea_taste .reserve_btn .visual.FRENCH{ background-image: url(../../image/common/cvarea-taste-reserve-french.png); } .cvarea_taste .reserve_btn .visual.JAPANESE_MODERN{ background-image: url(../../image/common/cvarea-taste-reserve-japanese.png); } .cvarea_taste .reserve_btn .visual.VILLA{ background-image: url(../../image/common/cvarea-taste-reserve-villa.png); } .cvarea_taste .reserve_btn .visual.SIMPLE{ background-image: url(../../image/common/cvarea-taste-reserve-simple.png); } @media screen and (min-width:751px){ .cvarea_taste{ padding: 30px 0 20px; background-color: #F2F2F0; } .cvarea_taste .block{ width: 556px; } .cvarea_taste .block > .tit{ margin-bottom: 10px; font-size: 22px; text-align: center; letter-spacing: 0.025em; } .cvarea_taste .btn_area{ width: 1140px; margin-left: auto; margin-right: auto; } .cvarea_taste a{ aspect-ratio: 556 / 271; } .cvarea_taste .txt_wrap .tit{ margin: 6px 0 12px; font-size: 22px; line-height: 1.2; } .cvarea_taste .txt_wrap p{ font-size: 15px; } .cvarea_taste .btn_txt{ font-size: 16px; position: absolute; bottom: 25px; right: 55px; } /* それぞれ */ .cvarea_taste .document_btn{ background-image: url(../../image/common/cvarea-taste-document.png); } .cvarea_taste .document_btn .txt_wrap{ display: flex; flex-direction: column; justify-content: center; width: 326px; height: 81.5%; text-align: center; } .cvarea_taste .reserve_btn{ background-image: url(../../image/common/cvarea-taste-reserve.png); } .cvarea_taste .reserve_btn .txt_wrap{ display: flex; flex-direction: column; justify-content: center; width: 282px; height: 81.5%; text-align: center; padding-left: 6px; } .cvarea_taste .reserve_btn .visual{ width: 258px; aspect-ratio: 258 / 187; top: 18px; right: 14px; } } @media screen and (max-width:751px){ .cvarea_taste > .flex{ gap: 10.66vw; } .cvarea_taste .block{ width: 100%; } .cvarea_taste .block > .tit{ margin-bottom: 2.133vw; font-size: 4vw; text-align: center; } .cvarea_taste a{ aspect-ratio: 375 / 182; } .cvarea_taste .txt_wrap{ display: flex; flex-direction: column; justify-content: center; height: 81.5%; padding-left: 2.5vw; text-align: center; } .cvarea_taste .txt_wrap p{ font-size: 2.8vw; line-height: 1.6; letter-spacing: .02em; } .cvarea_taste .lead{ font-size: 2.65vw; } .cvarea_taste .txt_wrap .tit{ margin: 1.6vw 0 2vw; font-size: 4vw; line-height: 1.3; } .cvarea_taste .btn_txt { text-align: right; color: #fff; font-size: 2.8vw; padding-right: 9vw; position: absolute; bottom: 5.25vw; width: 100%; } /* それぞれ */ .cvarea_taste .document_btn{ background-image: url(../../image/common/cvarea-taste-document_mb.png); } .cvarea_taste .document_btn .txt_wrap{ width: 56.5vw; } .cvarea_taste .reserve_btn{ background-image: url(../../image/common/cvarea-taste-reserve_mb.png); } .cvarea_taste .reserve_btn .txt_wrap{ width: 49.6vw; padding-bottom: 3vw; } .cvarea_taste .reserve_btn .visual{ width: 46vw; aspect-ratio: 345 / 228; top: 4vw; right: 4vw; } } /******************** // サイドバー *********************/ #sideBar .cat_wrap{ background-color: #F2F2F0; padding: 20px; } @media screen and (min-width:751px){ #sideBar{width: 260px;} #sideBar .container{ position: sticky; top: 160px; } #sideBar .cat_wrap .contents_tit01 {margin-bottom: 20px;} #sideBar .cat_wrap .contents_tit01 .wrap{padding-bottom: 20px;} } @media screen and (max-width:751px){ #sideBar{width: 92%;margin-left: auto;margin-right: auto;} } /******************** // 投稿 *********************/ /* 基本の一覧 */ .basic_posts .cats_list, .cats_list.clone{ max-width: 1140px; margin-left: auto; margin-right: auto; margin-top: 30px; text-align: center; } .basic_posts .cats_list li, .cats_list.clone li{ display: inline-block; text-align: center; border: 1px solid #6A818A; line-height: 1; } .basic_posts .cats_list li a, .cats_list.clone li a{ color: #6A818A; } .basic_posts .contents_tit01 .tit { line-height: 1.25; } .basic_posts .txt_wrap .info{ margin-bottom: 10px; vertical-align: middle; font-size: 70%; } .basic_posts .txt_wrap .info .cat{ display: inline-block; min-width: 60px; padding: 5px 10px; margin-right: 5px; text-align: center; background-color: #E0D6C6; line-height: 1; } .basic_posts .txt_wrap .info .date{ color: #889AA1; } .basic_posts .item_lists{ width: 1000px; margin-left: auto; margin-right: auto; } .basic_posts .item .txt_wrap{ flex:1; } .basic_posts .item .tit{ font-weight: 500; font-size: 113%; line-height: 1.5; margin-bottom: 7px; } .basic_posts .item .tit + p{font-size: 80%;line-height: 1.6;} @media screen and (min-width:751px) { .basic_posts .cats_list li, .cats_list.clone li{ min-width: 60px; padding: 3px 15px 5px; margin-right: 5px; } .basic_posts .item{ width: 44%; margin-top: 5%; } .basic_posts .item:nth-of-type(-n+2){ margin-top: 0;; } .basic_posts .item .visual{ width: 140px; margin-right: 15px; } } @media screen and (max-width:751px){ .basic_posts .cats_list li, .cats_list.clone li { margin-right: 1.33vw; margin-bottom: 1.33vw; padding: 1vw 1.33vw 1.33vw; font-size: 3.2vw; } .basic_posts .item_lists{ width: 84%; } .basic_posts .item{ width: 100%; margin-top: 5.266vw; padding-top: 5.266vw; border-top: 1px dashed #ccc; } .basic_posts .item:nth-of-type(-n+1){ margin-top: 0; padding-top: 0; border-top: unset; } .basic_posts .item .visual { width: 18.66vw; margin-right: 4vw; } .basic_posts .txt_wrap .info { margin-bottom: 1.33vw; } .basic_posts .item .tit { margin-bottom: .933vw; font-size: 115%; } } /* ページネーション */ .pagenation_wrap, .wp-pagenavi{ margin-top: 100px; text-align: center; } .pagenation_wrap li{ display: inline-block; } .pagenation_wrap li span:not(.dots), .pagenation_wrap li a, .wp-pagenavi span:not(.extend), .wp-pagenavi a{ display: inline-block; width: 35px; background-color: #CCCCCC; font-size: 125%; color: #fff; font-family: "Sawarabi Gothic"; line-height: 35px; letter-spacing: -0.5px; } .wp-pagenavi span, .wp-pagenavi a{ margin: 0 5px; } .wp-pagenavi span.extend{ font-size: 25px; letter-spacing: 0px; vertical-align: top; line-height: 23px; } .pagenation_wrap li span.dots{ display: inline-block; width: 35px; text-align: center; letter-spacing: 0px; font-family: "Sawarabi Gothic"; line-height: 1; vertical-align: super; } .pagenation_wrap li span.dots.prev{ text-indent: 0.3em; } .pagenation_wrap li a.next,.pagenation_wrap li a.prev{ font-size: 120%; } .pagenation_wrap li span.current, .wp-pagenavi span.current{ background-color: #889AA1; color: #fff; } @media screen and (max-width:751px){ .pagenation_wrap, .wp-pagenavi{ margin-top: 13.33vw; } .wp-pagenavi span, .wp-pagenavi a { margin: 0 0.95vw; } .pagenation_wrap li span:not(.dots), .pagenation_wrap li a, .wp-pagenavi span:not(.extend), .wp-pagenavi a{ width: 5.84vw; font-size: 3.25vw; line-height: 5.84vw; } .pagenation_wrap li span.dots{ width: 5.84vw; font-size: 3.25vw; } .pagenation_wrap li a.next,.pagenation_wrap li a.prev{ font-size: 3.25vw; } .wp-pagenavi span.extend { font-size: 4.25vw; line-height: 3.8vw; } } /* 基本の投稿 */ .basic_post .posts_w{ width: 980px; margin-left: auto; margin-right: auto; margin-bottom: 70px; } .basic_post .post_wrap{width: 640px;} .basic_post #sideBar{width: 260px;} .basic_post .info{ margin-bottom: 20px; vertical-align: middle; font-size: 80%; } .basic_post .info .cat{ display: inline-block; min-width: 60px; padding: 4px 5px 7px; margin-right: 5px; text-align: center; border: 1px solid #6A818A; color: #6A818A; line-height: 1; } .basic_post .info .date{ color: #6A818A; } .basic_post .contents_head.tit_only { margin-bottom: 20px;} .basic_post .cotent_wrap h2{ border-bottom: 2px #222222 solid; display: inline-block; margin: 2em 0 1em 0; font-weight: bold; font-size: 135%; } .basic_post .cotent_wrap h3 { margin: 2em 0 1em 0; font-weight: bold; font-size: 100%; } .basic_post .cotent_wrap p{ text-align: justify; text-align-last:left; font-size: 87.5%; line-height: 1.8; letter-spacing: .05em; } .basic_post .cotent_wrap li{ font-size: 87.5%; letter-spacing: .05em; } .basic_post .cotent_wrap p + p, .basic_post .cotent_wrap p + ul, .basic_post .cotent_wrap ul + p{margin-top: 20px;} .basic_post .contet_wrap img { max-width: 100%; height: auto; margin: 20px 0; } .basic_post .contet_wrap h2 + p img{ margin-top: 0; } .basic_post .sns_btns li { width: 100px; text-align: left; } .basic_post .sns_btns .fb{ margin-right: 25px; } .basic_post .under{ border-top: #222222 solid 1px; padding-top: 10px; margin-top: 50px; } .basic_post .under a.txt_larrow::before{ margin-right: .5em; } @media screen and (min-width:751px){ .basic_post .info .cat{ padding: 3px 5px 4px; } } @media screen and (max-width:751px){ .basic_post .posts_w{ width: 84%; margin-bottom: 6vw; } .basic_post .post_wrap{width: 100%;} .basic_post #sideBar{width: 100%;margin-top: 6.66vw;} .basic_post .info { margin-bottom: 2.66vw; font-size: 2.66vw; } .basic_post .info .cat{ padding: 4px 5px 5px; } .basic_post .contents_head .wrap{ /* width: 92vw; */ } .basic_post .cotent_wrap h2 { font-size: 160%; } .basic_post .cotent_wrap h3 { font-size: 3.66vw; } .basic_post .cotent_wrap p, .basic_post .cotent_wrap li { font-size: 3.2vw; line-height: 2; } .basic_post .under{ justify-content: center; } .basic_post .under .sns_btns{order:1;width: 100%;margin-left: -15px;margin-bottom: 2vw;justify-content: center;} .basic_post .under .back_archive{order:2;font-size: 3.2vw;} .basic_post #sideBar .cat_wrap { padding: 5.22vw; font-size: 3.2vw; } } /* モデル/事例の一覧 */ .contents_item { width: 360px; margin-top: 50px; margin-left: 25px; } .contents_item:only-of-type { margin-top: 0; margin-left: 0; } .contents_item .visual { margin-bottom: 10px; line-height: 0; } .contents_item .tit { line-height: 1.5; } .contents_item .tit+ p { margin-top: 12px; margin-bottom: 42px; font-size: 75%; line-height: 1.5; } .contents_item .modelinfo { margin-top: 15px; font-size: 87.5%; } @media screen and (min-width:751px) { .contents_item:nth-of-type(3n-2){ margin-left: 0; } .contents_item:nth-of-type(-n+3){ margin-top: 0; } .contents_item .tit{ font-size: 100%; min-height: 48px; } } @media screen and (max-width:751px){ .contents_item { width: 100%; margin-top: 0px; margin-left: 0; } .contents_item .visual { margin-bottom: 6.66vw; } .contents_item .tit { font-size: 4vw; line-height: 1.4; } .contents_item .tit+ p { margin-top: 5.23vw; margin-bottom: 4.66vw; font-size: 2.66vw; line-height: 1.6; } .contents_item .modelinfo { margin-top: 4.66vw; font-size: 3.2vw; } } /* ブログの一覧 */ .blogs_item{ background-color:#f2f2f0; } .blogs_item .visual{ line-height: 0; } .blogs_item .info .cat{ display: inline-block; text-align: center; color: #889AA1; line-height: 1; letter-spacing: 0; } .blogs_item .tit{ line-height: 1; } .blogs_item p{ letter-spacing: 0; } @media screen and (min-width:751px){ .blogs_item p{ font-size: 75%; } .blogs_item .info .cat{ border: 1px solid #889AA1; padding: 0.2em 1em 0.3em; } } @media screen and (max-width:751px){ .blogs_item{ padding: 2vw; } .blogs_item .visual{ width: 20vw; margin-right: 2vw; } .blogs_item .txt_wrap{ width: 56vw; } .blogs_item .info{ margin-bottom: 2vw; } .blogs_item .info .cat{ border: 0.133vw solid #889AA1; padding: 0.1em 0.5em 0.2em; } .blogs_item .tit{ font-size: 3.2vw; } .blogs_item .info,.blogs_item p{ font-size: 2.66vw; } .blogs_item p{ margin-top: 2.66vw; } } /* ファイル */ .file_vis_item { padding: 32px 20px 15px; border: 1px solid #889aa1; border-top: unset; position: relative; } .file_vis_item::after { content: ""; width: calc(50% + 1px); border-top: 1px solid #889aa1; position: absolute; left: 0; } .file_vis_item::before { content: ""; width: 50%; border-left: 1px solid #889aa1; border-bottom: 1px solid #889aa1; background: #fff; right: -1px; position: absolute; } @media screen and (min-width:751px){ .file_vis_item::after { /* background-image: url(../../image/home/home_event_bk.svg); */ } .file_vis_item::after { height: 1px; top: -2px; } .file_vis_item::before { height: 13px; top: -2px; } } /* イベントの一覧 */ .event_item .info{ font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3"; line-height: 1; } .event_item .info span{ white-space: nowrap; background-color: #6a818a; color: #fff; } .event_item .phead{ text-align: justify; font-size: 75%; position: relative; } .event_item .phead::after{ content: "／"; margin: auto; position: absolute; right: 0; top: 0; bottom: 0; } @media screen and (min-width:751px){ .event_item { width: 360px; padding: 45px 18px 15px; margin-left: 30px; margin-top: 30px; border: 1px solid #889aa1; border-top: unset; position: relative; } .event_item:nth-of-type(-n+3){ margin-top: 0; } .event_item:nth-of-type(3n-2){ margin-left: 0; } .event_item::after{ content:""; width: 360px; height: 14px; background-color: #fff; background-image: url(../../image/home/home_event_bk.svg); background-repeat: no-repeat; background-size: cover; position: absolute; top: -2px; left: 0; } .event_item .info{ margin-bottom: 25px; font-size: 75%; letter-spacing: 0; } .event_item .info span{ margin-right: 6px; padding: 2px 12px 2px; } .event_item .txt_wrap{ margin-bottom: 25px; line-height: 1; } .event_item .tit{ font-size: 112.5%; letter-spacing: .02em; line-height: 1.3; } .event_item .txt_wrap .tit + div{ margin-top: 10px; } .event_item .txt_wrap div + div { margin-top: .3em; } .event_item .phead{ width: 4.5em; padding-right: .75em; font-size: 75%; } .event_item .pbody{ padding-left: .75em; font-size: 75%; line-height: 1.25; letter-spacing: 0.02em; } } @media screen and (max-width:751px){ .event_item + .event_item{ display: block; width: 100%; } .event_item + .event_item{ margin-top: 10.66vw; } .event_item .txt_wrap { width: 80vw; margin-left: auto; margin-right: auto; line-height: 1.4; } .event_item .visual{ background-color: #F2F2F0; padding: 4.66vw 10vw; margin-top: 3.33vw; } .event_item .info{ margin-bottom: 4vw; } .event_item .info span{ display: inline-block; padding: 0.4em 1.5em 0.3em; margin-right: 1.33vw; background-color: #fff; border: .133vw solid #6a818a; font-size: 2.66vw; color: #6a818a; } .event_item .tit { font-size: 4.26vw; letter-spacing: .02em; line-height: 1.3; } .event_item .txt_wrap .tit + div { margin-top: 4vw; } .event_item .phead{ width: 5em; padding-right: 1em; font-size: 2.66vw; } .event_item .pbody{ padding-left: 1em; font-size: 2.66vw; } } /* ページ下CV&&text */ .page_foot > div:last-of-type{margin-bottom: 0;} .page_foot_txt{ color: #022222; } @media screen and (min-width:751px){ .page_foot{ margin-top: 150px; margin-bottom: 250px; } .page_foot > div{ margin-bottom: 100px; } .page_foot .page_foot_txt .tit{ font-size: 150%; } .page_foot .page_foot_txt p{ margin-top: 20px; font-size: 112.5%; } .page_foot .page_foot_txt a{ display: block; margin-top: 25px; font-size: 87.5%; } } @media screen and (max-width:751px){ .page_foot{ margin-top: 20vw; margin-bottom: 33.33vw; } .page_foot > div{ margin-bottom: 20vw; } .page_foot .page_foot_txt .tit{ font-size: 4vw; line-height: 1.4; } .page_foot .page_foot_txt p{ margin-top: 3.33vw; font-size: 3.24vw; } .page_foot .page_foot_txt a{ display: block; margin-top: 4vw; font-size: 2.66vw; } } /* 入力 */ input[type="text"],input[type="tel"],input[type="email"],select{ min-height: 35px; padding:0 5px; border:1px solid #ccc; border-radius: 0; } input[type="radio"],input[type="checkbox"]{margin-right:.3em;} input[type="checkbox"]{vertical-align: middle;} select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; padding-right: 40px; background-color: #fff; background-image: none; border: 1px solid #ccc; color: #222222; -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; position: relative; } select{ background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2010%206.4%22%20style%3D%22enable-background%3Anew%200%200%2010%206.4%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23022222%3B%7D%3C%2Fstyle%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C0.8%201.3%2C0%205%2C4.2%208.8%2C0%2010%2C0.8%205%2C6.4%20%22%2F%3E%3C%2Fsvg%3E'); background-repeat: no-repeat; background-size: 7px; background-position:right 7px center; } select:hover{ background-image: url('data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20id%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2010%206.4%22%20style%3D%22enable-background%3Anew%200%200%2010%206.4%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%20.st0%7Bfill%3A%23566666%3B%7D%3C%2Fstyle%3E%3Cpolygon%20class%3D%22st0%22%20points%3D%220%2C0.8%201.3%2C0%205%2C4.2%208.8%2C0%2010%2C0.8%205%2C6.4%20%22%2F%3E%3C%2Fsvg%3E'); } textarea{ border-radius: 0; } @media screen and (min-width:751px){ input[type="checkbox"]{vertical-align: baseline;} } @media screen and (max-width:751px){ input[type="text"],input[type="tel"],input[type="email"],select{ padding: 2.66vw 1.33vw; font-size: 3.66vw; } select{ padding-right: 5.66vw; line-height: 5.66vw; } } /* フォーム */ #form .roboto { font-family: 'Roboto Condensed', sans-serif; } #form .tit_wrap{ margin-bottom: 50px; text-align: center; } #form .tit{ display: inline-block; padding-top: 10px; padding-bottom: 10px; padding-left: 50px; background-image:url(../../image/contact/mail.png); background-repeat: no-repeat; background-position: left center; background-size: 32px; font-size: 105%; font-weight: bold; } #form .flow{ margin-bottom: 70px; text-align: center; } #form .flow li{ display: inline-block; background-image: url(../../image/contact/arrow.png); background-repeat: no-repeat; background-position: right center; padding-right: 3%; padding-left: 2%; width: 25%; } #form .flow li:last-of-type{ background-image: none; } #form .flow li dl{ border: #889AA1 1px solid; padding: 10px; font-size: 87.5%; line-height: 1.5; } #form .flow li dl.current{ background-color: #889AA1; color: #fff; } #form .flow li dd{ font-weight: bold; } #form form{ width: 900px; margin-left: auto; margin-right: auto; } #form form table{ width: 100%; margin-bottom: 50px; border-top: #ccc dashed 1px; text-align: left; } #form form th { border-bottom: #ccc dashed 1px; padding: 15px; width: 280px; } #form form th p{flex:1} #form form th .req{ width: 50px; background-color: #E8786E; text-align: center; font-size: 75%; font-weight: bold; color: #fff; } #form form td { border-bottom: #ccc dashed 1px; padding: 15px; padding-left: 20px; } #form form tr.noline th, #form form tr.noline td { border-bottom: unset; } #form form td.middle input, #form form td.middle textarea{ width: 400px; } #form form td.middle textarea{ height: 150px; max-width: 580px; } #form form td.address p{ width: 100%; margin-bottom: 5px; font-size: 80%; } #form form td.address #post_code{ width: 10em; margin-right: .5em; } #form form #address{ margin-top: 10px; } #form form td.address #post_code + span{ display: inline-block; background-color: #477684; padding: 5px 10px; vertical-align: middle; color: #fff; cursor: pointer; } #form form label{ margin-right: 1em; white-space: nowrap; } #form form .caution{ margin-top: 5px; font-size: 80%; line-height: 1.6; } #form form input + select{ margin-left: 1em; } #form #before-submit { padding: 35px 50px 50px; border: 1px solid #ccc; background-color: #F2F2F0; max-width: 600px; margin: 50px auto; text-align: left; } #form #before-submit .block-head { margin-bottom: 20px; } #form #before-submit h2 { font-size: 120%; line-height: 1; } #form #before-submit .icon { display: inline-block; width: 50px; height: 50px; line-height: 1; padding-top: 12px; margin-right: 20px; border-radius: 50%; background-color: #e8786e; color: #fff; text-align: center; font-size: 30px; letter-spacing: 0; vertical-align: sub; box-sizing: border-box; } #form #before-submit .block-body p { margin-bottom: 20px; font-size: 94%; color: #222222; line-height: 1.8; } #form #before-submit .block-body .bold { font-size: 120%; } #form #before-submit .block-body span { font-size: 125%; line-height: 1.4; color: #e8786e; font-weight: bold; text-decoration: underline; } #form #before-submit .block-body span a{color: #e8786e;} #form .submit_wrap{ max-width: 600px; width: 100%; margin: auto; } #form .submit_wrap button, #contact.comp #form .submit_wrap>a, #contact.event_comp #form .submit_wrap>a, #contact.li #form .submit_wrap>a { display: block; width: 100%; padding: 30px 15px; background-color: #477684; border-color: #477684; text-align: center; font-weight: bold; color: #fff; cursor: pointer; } #form .submit_wrap button:hover{ background-color: #fff; color: #477684; } #form .submit_wrap.back button { background-color: #889AA1; border-color: #889AA1; } #form .submit_wrap.back button:hover{ background-color: #fff; color: #889AA1; } #form .error{ margin-top: 5px; color: #E8786E; } #form .choice .submit_wrap{ max-width: 250px; margin-left: 2%; margin-right: 2%; } #form .choice .submit_wrap button, #contact.comp #form .submit_wrap>a, #contact.event_comp #form .submit_wrap>a, #contact.li #form .submit_wrap>a{ padding: 15px; } #form .desc{ margin-bottom: 50px; } #form .attention { width: 900px; margin-left: auto; margin-right: auto; margin-bottom: 50px; margin-top: 50px; } #form .attention li{ text-align: left; padding-left: 15px; margin-bottom: 3px; position: relative; } #form .attention li::after{ content:""; width: 10px; height: 10px; background-color: #222222; border-radius: 50%; position: absolute; left: 0; top: 0.4em; } #form .conf-txt{ text-align: center; margin-bottom: 50px; } @media screen and (max-width:751px){ #form .tit_wrap { margin-bottom: 6.66vw; text-align: center; } #form .tit{ font-size: 3.84vw; } #form .flow { text-align: center; margin-bottom: 8vw; } #form .flow li{ display: block; width: 100%; padding-right: 0%; padding-left: 0%; padding-bottom: 4vw; margin-bottom: 1.33vw; background-image: url(../../image/contact/arrow_sp.png); background-size: 4vw; background-position: center bottom; } #form .flow li:last-of-type{ padding-bottom: 0; margin-bottom: 0; } #form .flow dt,#form .flow dd { display: inline-block; font-size: 3.2vw; } #form form{ width: 100%; } #form form table{ margin-bottom: 5.33vw; } #form form th,#form form td { width: 100%; display: block; } #form form th { padding: 2.66vw 0 1.33vw; border: unset; } #form form th .req{ width: auto; padding: 0.32vw 1.33vw; } #form form td{ padding: 0 0 2.66vw; } #form form td p{ font-size: 3.2vw; } #form form td.address #post_code + span{ line-height: 8.666vw; } #form form td.middle input, #form form td.middle textarea { width: 100%; font-size: 3.5vw; max-width: 83.6vw; } #form form td.date input{ width: 50%; } #form form td label{ display: block; } #form form td label + label{ margin-top: 1.33vw; } #form .submit_wrap button, #contact.comp #form .submit_wrap>a, #contact.event_comp #form .submit_wrap>a, #contact.li #form .submit_wrap>a{ padding: 4vw; } #form #before-submit { padding: 5.66vw 4vw 5.66vw; margin: 10.33vw 0 } #form #before-submit .block-body { text-align: center; } #form #before-submit .block-body p{ margin-bottom: 5.33vw; font-size: 3.2vw; text-align: left; } #form #before-submit .block-body .bold { text-align: center; } #form #before-submit .block-body .bold span{ font-size: 5.35vw; } #form #before-submit .block-head { text-align: center; } #form #before-submit .icon { width: 10.66vw; height: 10.66vw; margin-right: 0; margin-bottom: 2.66vw; padding-top: 2.5vw; font-size: 130%; } #form .error{ margin-top: 1.33vw; font-size: 2.66vw; color: #E8786E; } #form .choice .submit_wrap{ max-width: 100%; margin-left: 0; margin-right: 0; } #form .choice .submit_wrap + .submit_wrap{ margin-top: 2.66vw; } #form .choice .submit_wrap button, #contact.comp #form .submit_wrap>a, #contact.event_comp #form .submit_wrap>a, #contact.li #form .submit_wrap>a{ padding: 4vw; } #form .grecaptcha-badge{ bottom: 20vw!important; } #form .desc{ margin-bottom: 5.33vw; } #form .attention { width: 100%; margin-bottom: 6.66vw; margin-top: 6.66vw; } #form .attention li { padding-left: 2.66vw; } #form .attention li::after { top: 1.66vw; width: 1.33vw; height: 1.33vw; } #form .conf-txt{ margin-bottom: 10.33vw; margin-top: 10.33vw; } } /* カウンター */ #form_counter{ position: fixed; right: 10px; bottom: 10px; background: #e8786e; color: #fff; transition: all .2s 0s ease; opacity: 0; pointer-events: none; } #form_counter.view{ opacity: 1; transition: all 1.5s 0s ease; } #form_counter.complete{ opacity: 0; } #form_counter .variable{ font-size: 160%; padding: 0 0.2em; } @media screen and (min-width:751px){ #form_counter{ padding: 20px; font-size: 14px; right: 10px; bottom: 10px; } } @media screen and (max-width:751px){ #form_counter{ padding: 3.22vw; font-size: 2.93vw; right: 1.33vw; bottom: 18vw; } } /******************** // 読み込みコンテンツ上書き *********************/ /* ライトボックス */ .lightboxOverlay{z-index: 11111112;} .lightbox{z-index: 11111113;} /* スワイパー */ .swiper-button-prev:after,.swiper-button-next:after { display: none; } .swiper-button-prev:after,.swiper-button-next:after { color: #222222; }