@charset "UTF-8"; @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap"); @font-face { font-family:swiper-icons; font-style:normal; font-weight:400; 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") } :root { --swiper-theme-color:#007aff } .swiper { list-style:none; margin-left:auto; margin-right:auto; overflow:hidden; padding:0; position:relative; z-index:1 } .swiper-vertical>.swiper-wrapper { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .swiper-wrapper { -webkit-box-sizing:content-box; box-sizing:content-box; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; position:relative; -webkit-transition-property:-webkit-transform; transition-property:-webkit-transform; transition-property:transform; transition-property:transform,-webkit-transform; width:100%; z-index:1 } .swiper-android .swiper-slide, .swiper-wrapper { -webkit-transform:translateZ(0); transform:translateZ(0) } .swiper-pointer-events { -ms-touch-action:pan-y; touch-action:pan-y } .swiper-pointer-events.swiper-vertical { -ms-touch-action:pan-x; touch-action:pan-x } .swiper-slide { -ms-flex-negative:0; flex-shrink:0; height:100%; position:relative; -webkit-transition-property:-webkit-transform; transition-property:-webkit-transform; transition-property:transform; transition-property:transform,-webkit-transform; width:100% } .swiper-slide-invisible-blank { visibility:hidden } .swiper-autoheight, .swiper-autoheight .swiper-slide { height:auto } .swiper-autoheight .swiper-wrapper { -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; -webkit-transition-property:height,-webkit-transform; transition-property:height,-webkit-transform; transition-property:transform,height; transition-property:transform,height,-webkit-transform } .swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper { -webkit-perspective:1200px; 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 { -webkit-transform-style:preserve-3d; 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 { height:100%; left:0; pointer-events:none; position:absolute; top:0; width:100%; z-index:10 } .swiper-3d .swiper-slide-shadow { background:rgba(0,0,0,.15) } .swiper-3d .swiper-slide-shadow-left { background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(transparent)); background-image:linear-gradient(270deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-right { background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(transparent)); background-image:linear-gradient(90deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-top { background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(transparent)); background-image:linear-gradient(0deg,rgba(0,0,0,.5),transparent) } .swiper-3d .swiper-slide-shadow-bottom { background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(transparent)); background-image:linear-gradient(180deg,rgba(0,0,0,.5),transparent) } .swiper-css-mode>.swiper-wrapper { -ms-overflow-style:none; overflow:auto; scrollbar-width: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 { -ms-scroll-snap-type:x mandatory; scroll-snap-type:x mandatory } .swiper-vertical.swiper-css-mode>.swiper-wrapper { -ms-scroll-snap-type:y mandatory; scroll-snap-type:y mandatory } .swiper-centered>.swiper-wrapper:before { -ms-flex-negative:0; -webkit-box-ordinal-group:10000; -ms-flex-order:9999; content:""; flex-shrink:0; order:9999 } .swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child { -webkit-margin-start:var(--swiper-centered-offset-before); 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 { -webkit-margin-before:var(--swiper-centered-offset-before); margin-block-start:var(--swiper-centered-offset-before) } .swiper-centered.swiper-vertical>.swiper-wrapper:before { height:var(--swiper-centered-offset-after); min-width:1px; width:100% } .swiper-centered>.swiper-wrapper>.swiper-slide { scroll-snap-align:center center } .swiper-virtual.swiper-css-mode .swiper-wrapper:after { content:""; left:0; pointer-events:none; position:absolute; top:0 } .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 { height:var(--swiper-virtual-size); width:1px } :root { --swiper-navigation-size:44px } .swiper-button-next, .swiper-button-prev { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; color:var(--swiper-navigation-color,var(--swiper-theme-color)); cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; height:var(--swiper-navigation-size); justify-content:center; margin-top:calc(0px - var(--swiper-navigation-size)/2); position:absolute; top:50%; width:calc(var(--swiper-navigation-size)/44*27); z-index:10 } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { cursor:auto; opacity:.35; pointer-events:none } .swiper-button-next:after, .swiper-button-prev:after { font-family:swiper-icons; font-size:var(--swiper-navigation-size); font-variant:normal; letter-spacing:0; line-height:1; text-transform:none!important; text-transform:none } .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 { left:auto; right:10px } .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after { content:"next" } .swiper-button-lock { display:none } .swiper-pagination { position:absolute; text-align:center; -webkit-transform:translateZ(0); transform:translateZ(0); -webkit-transition:opacity .3s; transition:opacity .3s; z-index:10 } .swiper-pagination.swiper-pagination-hidden { opacity:0 } .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 { font-size:0; overflow:hidden } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { position:relative; -webkit-transform:scale(.33); transform:scale(.33) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { -webkit-transform:scale(1); transform:scale(1) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { -webkit-transform:scale(.66); transform:scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { -webkit-transform:scale(.33); transform:scale(.33) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform:scale(.66); transform:scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { -webkit-transform:scale(.33); transform:scale(.33) } .swiper-pagination-bullet { background:var(--swiper-pagination-bullet-inactive-color,#000); border-radius:50%; display:inline-block; height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px)); opacity:var(--swiper-pagination-bullet-inactive-opacity,.2); width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px)) } button.swiper-pagination-bullet { -webkit-appearance:none; -moz-appearance:none; appearance:none; border:none; -webkit-box-shadow:none; box-shadow:none; margin:0; padding:0 } .swiper-pagination-clickable .swiper-pagination-bullet { cursor:pointer } .swiper-pagination-bullet:only-child { display:none!important } .swiper-pagination-bullet-active { background:var(--swiper-pagination-color,var(--swiper-theme-color)); opacity:var(--swiper-pagination-bullet-opacity,1) } .swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical>.swiper-pagination-bullets { right:10px; top:50%; -webkit-transform:translate3d(0,-50%,0); transform:translate3d(0,-50%,0) } .swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { display:block; margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0 } .swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top:50%; -webkit-transform:translateY(-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; -webkit-transition:top .2s,-webkit-transform .2s; transition:top .2s,-webkit-transform .2s; transition:transform .2s,top .2s; transition:transform .2s,top .2s,-webkit-transform .2s } .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%; -webkit-transform:translateX(-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 { -webkit-transition:left .2s,-webkit-transform .2s; transition:left .2s,-webkit-transform .2s; transition:transform .2s,left .2s; transition:transform .2s,left .2s,-webkit-transform .2s } .swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition:right .2s,-webkit-transform .2s; transition:right .2s,-webkit-transform .2s; transition:transform .2s,right .2s; transition:transform .2s,right .2s,-webkit-transform .2s } .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)); height:100%; left:0; position:absolute; top:0; -webkit-transform:scale(0); transform:scale(0); -webkit-transform-origin:left top; transform-origin:left top; width:100% } .swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { -webkit-transform-origin:right top; 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 { height:4px; left:0; top:0; width:100% } .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 { height:100%; left:0; top:0; width:4px } .swiper-pagination-lock { display:none } .swiper-scrollbar { background:rgba(0,0,0,.1); border-radius:10px; position:relative; -ms-touch-action:none } .swiper-horizontal>.swiper-scrollbar { bottom:3px; height:5px; left:1%; position:absolute; width:98%; z-index:50 } .swiper-vertical>.swiper-scrollbar { height:98%; position:absolute; right:3px; top:1%; width:5px; z-index:50 } .swiper-scrollbar-drag { background:rgba(0,0,0,.5); border-radius:10px; height:100%; left:0; position:relative; top:0; width:100% } .swiper-scrollbar-cursor-drag { cursor:move } .swiper-scrollbar-lock { display:none } .swiper-zoom-container { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; justify-content:center; text-align:center; width:100% } .swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg { max-height:100%; max-width:100%; -o-object-fit:contain; object-fit:contain } .swiper-slide-zoomed { cursor:move } .swiper-lazy-preloader { -webkit-animation:swiper-preloader-spin 1s linear infinite; animation:swiper-preloader-spin 1s linear infinite; border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color)); border-radius:50%; border-top:4px solid transparent; -webkit-box-sizing:border-box; box-sizing:border-box; height:42px; left:50%; margin-left:-21px; margin-top:-21px; position:absolute; top:50%; -webkit-transform-origin:50%; transform-origin:50%; width:42px; z-index:10 } .swiper-lazy-preloader-white { --swiper-preloader-color:#fff } .swiper-lazy-preloader-black { --swiper-preloader-color:#000 } @-webkit-keyframes swiper-preloader-spin { to { -webkit-transform:rotate(1turn); transform:rotate(1turn) } } @keyframes swiper-preloader-spin { to { -webkit-transform:rotate(1turn); transform:rotate(1turn) } } .swiper .swiper-notification { left:0; opacity:0; pointer-events:none; position:absolute; top:0; z-index:-1000 } .swiper-free-mode>.swiper-wrapper { margin:0 auto; -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out } .swiper-grid>.swiper-wrapper { -ms-flex-wrap:wrap; flex-wrap:wrap } .swiper-grid-column>.swiper-wrapper { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; -ms-flex-wrap:wrap; flex-wrap:wrap } .swiper-fade.swiper-free-mode .swiper-slide { -webkit-transition-timing-function:ease-out; transition-timing-function:ease-out } .swiper-fade .swiper-slide { pointer-events:none; -webkit-transition-property:opacity; 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 { -webkit-backface-visibility:hidden; backface-visibility:hidden; height:100%; pointer-events:none; -webkit-transform-origin:0 0; transform-origin:0 0; visibility:hidden; width:100%; z-index:1 } .swiper-cube .swiper-slide .swiper-slide { pointer-events:none } .swiper-cube.swiper-rtl .swiper-slide { -webkit-transform-origin:100% 0; 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 { -webkit-backface-visibility:hidden; backface-visibility:hidden; z-index:0 } .swiper-cube .swiper-cube-shadow { bottom:0; height:100%; left:0; opacity:.6; position:absolute; width:100%; z-index:0 } .swiper-cube .swiper-cube-shadow:before { background:#000; bottom:0; content:""; -webkit-filter:blur(50px); filter:blur(50px); left:0; position:absolute; right:0; top:0 } .swiper-flip { overflow:visible } .swiper-flip .swiper-slide { -webkit-backface-visibility:hidden; backface-visibility:hidden; pointer-events:none; 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 { -webkit-backface-visibility:hidden; backface-visibility:hidden; z-index:0 } .swiper-creative .swiper-slide { -webkit-backface-visibility:hidden; backface-visibility:hidden; overflow:hidden; -webkit-transition-property:opacity,height,-webkit-transform; transition-property:opacity,height,-webkit-transform; transition-property:transform,opacity,height; transition-property:transform,opacity,height,-webkit-transform } .swiper-cards { overflow:visible } .swiper-cards .swiper-slide { -webkit-backface-visibility:hidden; backface-visibility:hidden; overflow:hidden; -webkit-transform-origin:center bottom; transform-origin:center bottom } .flatpickr-calendar { -webkit-animation:none; animation:none; background:transparent; background:#fff; border:0; border-radius:5px; -webkit-box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,.08); box-shadow:1px 0 0 #e6e6e6,-1px 0 0 #e6e6e6,0 1px 0 #e6e6e6,0 -1px 0 #e6e6e6,0 3px 13px rgba(0,0,0,.08); -webkit-box-sizing:border-box; box-sizing:border-box; direction:ltr; display:none; font-size:14px; line-height:24px; opacity:0; padding:0; position:absolute; text-align:center; -ms-touch-action:manipulation; touch-action:manipulation; visibility:hidden; width:307.875px } .flatpickr-calendar.inline, .flatpickr-calendar.open { max-height:640px; opacity:1; visibility:visible } .flatpickr-calendar.open { display:inline-block; z-index:99999 } .flatpickr-calendar.animate.open { -webkit-animation:fpFadeInDown .3s cubic-bezier(.23,1,.32,1); animation:fpFadeInDown .3s cubic-bezier(.23,1,.32,1) } .flatpickr-calendar.inline { display:block; position:relative; top:2px } .flatpickr-calendar.static { position:absolute; top:calc(100% + 2px) } .flatpickr-calendar.static.open { display:block; z-index:999 } .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) { -webkit-box-shadow:none!important; box-shadow:none!important } .flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) { -webkit-box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6; box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6 } .flatpickr-calendar .hasTime .dayContainer, .flatpickr-calendar .hasWeeks .dayContainer { border-bottom:0; border-bottom-left-radius:0; border-bottom-right-radius:0 } .flatpickr-calendar .hasWeeks .dayContainer { border-left:0 } .flatpickr-calendar.hasTime .flatpickr-time { border-top:1px solid #e6e6e6; height:40px } .flatpickr-calendar.noCalendar.hasTime .flatpickr-time { height:auto } .flatpickr-calendar:after, .flatpickr-calendar:before { border:solid transparent; content:""; display:block; height:0; left:22px; pointer-events:none; position:absolute; width:0 } .flatpickr-calendar.arrowRight:after, .flatpickr-calendar.arrowRight:before, .flatpickr-calendar.rightMost:after, .flatpickr-calendar.rightMost:before { left:auto; right:22px } .flatpickr-calendar.arrowCenter:after, .flatpickr-calendar.arrowCenter:before { left:50%; right:50% } .flatpickr-calendar:before { border-width:5px; margin:0 -5px } .flatpickr-calendar:after { border-width:4px; margin:0 -4px } .flatpickr-calendar.arrowTop:after, .flatpickr-calendar.arrowTop:before { bottom:100% } .flatpickr-calendar.arrowTop:before { border-bottom-color:#e6e6e6 } .flatpickr-calendar.arrowTop:after { border-bottom-color:#fff } .flatpickr-calendar.arrowBottom:after, .flatpickr-calendar.arrowBottom:before { top:100% } .flatpickr-calendar.arrowBottom:before { border-top-color:#e6e6e6 } .flatpickr-calendar.arrowBottom:after { border-top-color:#fff } .flatpickr-calendar:focus { outline:0 } .flatpickr-wrapper { display:inline-block; position:relative } .flatpickr-months { display:-webkit-box; display:-ms-flexbox; display:flex } .flatpickr-months .flatpickr-month { fill:rgba(0,0,0,.9); -webkit-box-flex:1; background:transparent; color:rgba(0,0,0,.9); -ms-flex:1; flex:1; height:34px; line-height:1; overflow:hidden; position:relative; text-align:center; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none } .flatpickr-months .flatpickr-next-month, .flatpickr-months .flatpickr-prev-month { fill:rgba(0,0,0,.9); color:rgba(0,0,0,.9); cursor:pointer; height:34px; padding:10px; position:absolute; text-decoration:none; top:0; z-index:3 } .flatpickr-months .flatpickr-next-month.flatpickr-disabled, .flatpickr-months .flatpickr-prev-month.flatpickr-disabled { display:none } .flatpickr-months .flatpickr-next-month i, .flatpickr-months .flatpickr-prev-month i { position:relative } .flatpickr-months .flatpickr-next-month.flatpickr-prev-month, .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month { left:0 } .flatpickr-months .flatpickr-next-month.flatpickr-next-month, .flatpickr-months .flatpickr-prev-month.flatpickr-next-month { right:0 } .flatpickr-months .flatpickr-next-month:hover, .flatpickr-months .flatpickr-prev-month:hover { color:#959ea9 } .flatpickr-months .flatpickr-next-month:hover svg, .flatpickr-months .flatpickr-prev-month:hover svg { fill:#f64747 } .flatpickr-months .flatpickr-next-month svg, .flatpickr-months .flatpickr-prev-month svg { height:14px; width:14px } .flatpickr-months .flatpickr-next-month svg path, .flatpickr-months .flatpickr-prev-month svg path { fill:inherit; -webkit-transition:fill .1s; transition:fill .1s } .numInputWrapper { height:auto; position:relative } .numInputWrapper input, .numInputWrapper span { display:inline-block } .numInputWrapper input { width:100% } .numInputWrapper input::-ms-clear { display:none } .numInputWrapper input::-webkit-inner-spin-button, .numInputWrapper input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0 } .numInputWrapper span { border:1px solid rgba(57,57,57,.15); -webkit-box-sizing:border-box; box-sizing:border-box; cursor:pointer; height:50%; line-height:50%; opacity:0; padding:0 4px 0 2px; position:absolute; right:0; width:14px } .numInputWrapper span:hover { background:rgba(0,0,0,.1) } .numInputWrapper span:active { background:rgba(0,0,0,.2) } .numInputWrapper span:after { content:""; display:block; position:absolute } .numInputWrapper span.arrowUp { border-bottom:0; top:0 } .numInputWrapper span.arrowUp:after { border-bottom:4px solid rgba(57,57,57,.6); border-left:4px solid transparent; border-right:4px solid transparent; top:26% } .numInputWrapper span.arrowDown { top:50% } .numInputWrapper span.arrowDown:after { border-left:4px solid transparent; border-right:4px solid transparent; border-top:4px solid rgba(57,57,57,.6); top:40% } .numInputWrapper span svg { height:auto; width:inherit } .numInputWrapper span svg path { fill:rgba(0,0,0,.5) } .numInputWrapper:hover { background:rgba(0,0,0,.05) } .numInputWrapper:hover span { opacity:1 } .flatpickr-current-month { color:inherit; display:inline-block; font-size:135%; font-weight:300; height:34px; left:12.5%; line-height:inherit; line-height:1; padding:7.48px 0 0; position:absolute; text-align:center; -webkit-transform:translateZ(0); transform:translateZ(0); width:75% } .flatpickr-current-month span.cur-month { color:inherit; display:inline-block; font-family:inherit; font-weight:700; margin-left:.5ch; padding:0 } .flatpickr-current-month span.cur-month:hover { background:rgba(0,0,0,.05) } .flatpickr-current-month .numInputWrapper { display:inline-block; width:6ch; width:7ch\0 } .flatpickr-current-month .numInputWrapper span.arrowUp:after { border-bottom-color:rgba(0,0,0,.9) } .flatpickr-current-month .numInputWrapper span.arrowDown:after { border-top-color:rgba(0,0,0,.9) } .flatpickr-current-month input.cur-year { -webkit-appearance:textfield; -moz-appearance:textfield; appearance:textfield; background:transparent; border:0; border-radius:0; -webkit-box-sizing:border-box; box-sizing:border-box; color:inherit; cursor:text; display:inline-block; font-family:inherit; font-size:inherit; font-weight:300; height:auto; line-height:inherit; margin:0; padding:0 0 0 .5ch; vertical-align:initial } .flatpickr-current-month input.cur-year:focus { outline:0 } .flatpickr-current-month input.cur-year[disabled], .flatpickr-current-month input.cur-year[disabled]:hover { background:transparent; color:rgba(0,0,0,.5); font-size:100%; pointer-events:none } .flatpickr-current-month .flatpickr-monthDropdown-months { appearance:menulist; -webkit-appearance:menulist; -moz-appearance:menulist; background:transparent; border:none; border-radius:0; box-sizing:border-box; -webkit-box-sizing:border-box; color:inherit; cursor:pointer; font-family:inherit; font-size:inherit; font-weight:300; height:auto; line-height:inherit; margin:-1px 0 0; outline:none; padding:0 0 0 .5ch; position:relative; vertical-align:initial; width:auto } .flatpickr-current-month .flatpickr-monthDropdown-months:active, .flatpickr-current-month .flatpickr-monthDropdown-months:focus { outline:none } .flatpickr-current-month .flatpickr-monthDropdown-months:hover { background:rgba(0,0,0,.05) } .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { background-color:transparent; outline:none; padding:0 } .flatpickr-weekdays { -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:transparent; display:-webkit-box; display:-ms-flexbox; display:flex; height:28px; overflow:hidden; text-align:center; width:100% } .flatpickr-weekdays .flatpickr-weekdaycontainer { -webkit-box-flex:1; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex:1; flex:1 } span.flatpickr-weekday { -webkit-box-flex:1; background:transparent; color:rgba(0,0,0,.54); cursor:default; display:block; -ms-flex:1; flex:1; font-size:90%; font-weight:bolder; line-height:1; margin:0; text-align:center } .dayContainer, .flatpickr-weeks { padding:1px 0 0 } .flatpickr-days { -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; display:-webkit-box; display:-ms-flexbox; display:flex; overflow:hidden; position:relative; width:307.875px } .flatpickr-days:focus { outline:0 } .dayContainer { -ms-flex-pack:justify; -webkit-box-sizing:border-box; box-sizing:border-box; display:inline-block; display:-ms-flexbox; display:-webkit-box; display:flex; flex-wrap:wrap; -ms-flex-wrap:wrap; justify-content:space-around; max-width:307.875px; min-width:307.875px; opacity:1; outline:0; padding:0; text-align:left; -webkit-transform:translateZ(0); transform:translateZ(0); width:307.875px } .dayContainer+.dayContainer { -webkit-box-shadow:-1px 0 0 #e6e6e6; box-shadow:-1px 0 0 #e6e6e6 } .flatpickr-day { -ms-flex-preferred-size:14.2857143%; -webkit-box-pack:center; -ms-flex-pack:center; background:none; border:1px solid transparent; border-radius:150px; -webkit-box-sizing:border-box; box-sizing:border-box; color:#393939; cursor:pointer; display:inline-block; flex-basis:14.2857143%; font-weight:400; height:39px; justify-content:center; line-height:39px; margin:0; max-width:39px; position:relative; text-align:center; width:14.2857143% } .flatpickr-day.inRange, .flatpickr-day.nextMonthDay.inRange, .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-day.nextMonthDay:focus, .flatpickr-day.nextMonthDay:hover, .flatpickr-day.prevMonthDay.inRange, .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-day.prevMonthDay:focus, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.today.inRange, .flatpickr-day:focus, .flatpickr-day:hover { background:#e6e6e6; border-color:#e6e6e6; cursor:pointer; outline:0 } .flatpickr-day.today { border-color:#959ea9 } .flatpickr-day.today:focus, .flatpickr-day.today:hover { background:#959ea9; border-color:#959ea9; color:#fff } .flatpickr-day.endRange, .flatpickr-day.endRange.inRange, .flatpickr-day.endRange.nextMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.endRange:focus, .flatpickr-day.endRange:hover, .flatpickr-day.selected, .flatpickr-day.selected.inRange, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.selected:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange, .flatpickr-day.startRange.inRange, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.startRange:focus, .flatpickr-day.startRange:hover { background:#569ff7; border-color:#569ff7; -webkit-box-shadow:none; box-shadow:none; color:#fff } .flatpickr-day.endRange.startRange, .flatpickr-day.selected.startRange, .flatpickr-day.startRange.startRange { border-radius:50px 0 0 50px } .flatpickr-day.endRange.endRange, .flatpickr-day.selected.endRange, .flatpickr-day.startRange.endRange { border-radius:0 50px 50px 0 } .flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)), .flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)), .flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)) { -webkit-box-shadow:-10px 0 0 #569ff7; box-shadow:-10px 0 0 #569ff7 } .flatpickr-day.endRange.startRange.endRange, .flatpickr-day.selected.startRange.endRange, .flatpickr-day.startRange.startRange.endRange { border-radius:50px } .flatpickr-day.inRange { border-radius:0; -webkit-box-shadow:-5px 0 0 #e6e6e6,5px 0 0 #e6e6e6; box-shadow:-5px 0 0 #e6e6e6,5px 0 0 #e6e6e6 } .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover, .flatpickr-day.nextMonthDay, .flatpickr-day.notAllowed, .flatpickr-day.notAllowed.nextMonthDay, .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-day.prevMonthDay { background:transparent; border-color:transparent; color:rgba(57,57,57,.3); cursor:default } .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover { color:rgba(57,57,57,.1); cursor:not-allowed } .flatpickr-day.week.selected { border-radius:0; -webkit-box-shadow:-5px 0 0 #569ff7,5px 0 0 #569ff7; box-shadow:-5px 0 0 #569ff7,5px 0 0 #569ff7 } .flatpickr-day.hidden { visibility:hidden } .rangeMode .flatpickr-day { margin-top:1px } .flatpickr-weekwrapper { float:left
} .flatpickr-weekwrapper .flatpickr-weeks { -webkit-box-shadow:1px 0 0 #e6e6e6; box-shadow:1px 0 0 #e6e6e6; padding:0 12px } .flatpickr-weekwrapper .flatpickr-weekday { float:none; line-height:28px; width:100% } .flatpickr-weekwrapper span.flatpickr-day, .flatpickr-weekwrapper span.flatpickr-day:hover { background:transparent; border:none; color:rgba(57,57,57,.3); cursor:default; display:block; max-width:none; width:100% } .flatpickr-innerContainer { display:block; display:-webkit-box; display:-ms-flexbox; display:flex; overflow:hidden } .flatpickr-innerContainer, .flatpickr-rContainer { -webkit-box-sizing:border-box; box-sizing:border-box } .flatpickr-rContainer { display:inline-block; padding:0 } .flatpickr-time { -webkit-box-sizing:border-box; box-sizing:border-box; display:block; display:-webkit-box; display:-ms-flexbox; display:flex; height:0; line-height:40px; max-height:40px; outline:0; overflow:hidden; text-align:center } .flatpickr-time:after { clear:both; content:""; display:table } .flatpickr-time .numInputWrapper { -webkit-box-flex:1; -ms-flex:1; flex:1; float:left; height:40px; width:40% } .flatpickr-time .numInputWrapper span.arrowUp:after { border-bottom-color:#393939 } .flatpickr-time .numInputWrapper span.arrowDown:after { border-top-color:#393939 } .flatpickr-time.hasSeconds .numInputWrapper { width:26% } .flatpickr-time.time24hr .numInputWrapper { width:49% } .flatpickr-time input { -webkit-appearance:textfield; -moz-appearance:textfield; appearance:textfield; background:transparent; border:0; border-radius:0; -webkit-box-shadow:none; box-shadow:none; -webkit-box-sizing:border-box; box-sizing:border-box; color:#393939; font-size:14px; height:inherit; line-height:inherit; margin:0; padding:0; position:relative; text-align:center } .flatpickr-time input.flatpickr-hour { font-weight:700 } .flatpickr-time input.flatpickr-minute, .flatpickr-time input.flatpickr-second { font-weight:400 } .flatpickr-time input:focus { border:0; outline:0 } .flatpickr-time .flatpickr-am-pm, .flatpickr-time .flatpickr-time-separator { -ms-flex-item-align:center; -ms-grid-row-align:center; -webkit-align-self:center; align-self:center; color:#393939; float:left; font-weight:700; height:inherit; line-height:inherit; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; width:2% } .flatpickr-time .flatpickr-am-pm { cursor:pointer; font-weight:400; outline:0; text-align:center; width:18% } .flatpickr-time .flatpickr-am-pm:focus, .flatpickr-time .flatpickr-am-pm:hover, .flatpickr-time input:focus, .flatpickr-time input:hover { background:#eee } .flatpickr-input[readonly] { cursor:pointer } @-webkit-keyframes fpFadeInDown { 0% { opacity:0; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0) } to { opacity:1; -webkit-transform:translateZ(0); transform:translateZ(0) } } @keyframes fpFadeInDown { 0% { opacity:0; -webkit-transform:translate3d(0,-20px,0); transform:translate3d(0,-20px,0) } to { opacity:1; -webkit-transform:translateZ(0); transform:translateZ(0) } } html { -ms-overflow-style:none; -webkit-box-sizing:border-box; box-sizing:border-box; font-size:62.5% } body, html { -webkit-font-smoothing:antialiased; height:100% } body { -moz-osx-font-smoothing:grayscale; background-color:#fff; color:#1a1a1a; font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; font-size:1.4rem; line-height:175%; margin:0; padding:0; word-break:break-all } @media screen and (min-width:768px) { body { font-size:1.6rem; line-height:150% } } article, dd, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, header, input, label, legend, li, main, nav, ol, p, section, select, text-box, ul { -webkit-box-sizing:border-box; box-sizing:border-box; margin:0; padding:0 } article, footer, header, main, nav, section { display:block } table { border-spacing:0 } button { border:1px solid transparent } ::marker { color:transparent } button, fieldset, input, legend, select, textarea { -webkit-appearance:none; -moz-appearance:none; appearance:none; background:transparent; border:transparent; -webkit-box-sizing:border-box; box-sizing:border-box; font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; outline:none } fieldset { -webkit-box-sizing:border-box; box-sizing:border-box; display:block } legend { float:left } select { border:1px solid transparent } select::-ms-expand { display:none } .fill { fill:currentColor } .stroke { stroke:currentColor } .remove-padding { padding:0!important } .remove-padding-top { padding-top:0!important } .remove-padding-left { padding-left:0!important } .remove-padding-right { padding-right:0!important } .remove-padding-bottom { padding-bottom:0!important } .remove-margin { margin:0!important } .remove-margin-top { margin-top:0!important } .remove-margin-right { margin-right:0!important } .remove-margin-bottom { margin:0!important } .remove-margin-left { margin-left:0!important } .background-white { background-color:#fff!important } #pagetop { height:100%; position:relative } @media screen and (min-width:1024px) { .contents__wrap { -webkit-box-orient:horizontal; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:row; flex-direction:row } } @media screen and (min-width:1500px) { .contents__wrap { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } } .contents__side-nav { font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; padding:28px 28px 20px } @media screen and (min-width:768px) { .contents__side-nav { padding:100px 60px 32px } } @media screen and (min-width:1024px) { .contents__side-nav { -ms-overflow-style:none; height:100vh; overflow-y:scroll; padding:40px; position:sticky; scrollbar-width:none; top:0; width:223px; z-index:1 } } .contents__side-nav::-webkit-scrollbar { display:none } .contents__side-nav-sm { padding:0 } @media screen and (min-width:1024px) { .contents__side-nav-sm { -ms-overflow-style:none; height:100vh; overflow-y:scroll; padding:40px; position:sticky; scrollbar-width:none; top:0; width:223px; z-index:1 } } .contents__side-nav-sm::-webkit-scrollbar { display:none } .contents__side-nav-copy { font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; margin-top:40px } @media screen and (min-width:1024px) { .contents__side-nav-copy { margin-top:32px } } .contents__inner-wrap { -webkit-box-sizing:border-box; box-sizing:border-box } @media screen and (min-width:1024px) { .contents__inner-wrap { padding:40px 0 140px; width:calc(100% - 223px) } } @media screen and (min-width:1279px) { .contents__inner-wrap { margin:0 auto; max-width:1516px } } .contents__main-wrap { padding:0 28px 104px } @media screen and (min-width:768px) { .contents__main-wrap { padding:0 60px 140px } } @media screen and (min-width:1024px) { .contents__main-wrap { padding:0 60px 0 0 } } @media screen and (min-width:1279px) { .contents__main-wrap { padding:0 80px } } .contents__main-switch-md { padding:0 0 104px } @media screen and (min-width:768px) { .contents__main-switch-md { padding:0 60px 140px } } @media screen and (min-width:1024px) { .contents__main-switch-md { margin:0 auto; padding:0 60px 0 0 } } .contents__bubble { padding-bottom:70px } @media screen and (min-width:1024px) { .contents__bubble { padding-bottom:0 } } .contents__size-wide { margin:0 auto; max-width:1016px } .contents__size-lg { margin:0 auto; max-width:880px } @media screen and (min-width:1024px) { .contents__size-md { margin:0 auto; max-width:780px } } .contents__size-sm { margin:0 auto; max-width:680px } .contents__size-min { margin:0 auto; max-width:580px } .contents__size-mini { margin:0 auto; max-width:320px } .contents__search { position:relative; z-index:2 } @media screen and (min-width:1024px) { .contents__search { -webkit-box-pack:end; -ms-flex-pack:end; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:flex-end } } @media screen and (min-width:768px) { .contents__search+.contents__head-detail { margin-top:27px } } .contents__search>.search input { caret-color:transparent } @media screen and (min-width:768px) { .contents__search>.search input { caret-color:auto } } @media screen and (min-width:1024px) { .contents__head-detail, .contents__head-detail-switch-md { padding-top:80px } .contents__head-title { margin-top:32px } } .contents__head-lead { font-size:1.4rem; font-weight:400; margin-top:16px } @media screen and (min-width:768px) { .contents__head-lead { font-size:1.6rem } } @media screen and (min-width:1024px) { .contents__head-lead { margin-top:15px } } @media screen and (max-width:767px) { .contents__head-operation { padding-top:32px } } .contents__head-operation-title { text-align:center } @media screen and (min-width:768px) { .contents__head-operation-title { text-align:left } } .contents__head-operation-text { margin-top:30px } @media screen and (min-width:768px) { .contents__head-operation-text { margin-top:20px } } .contents__head-operation-text *+*, .contents__head-operation-text--error>*+* { margin-top:10px } @media screen and (min-width:768px) { .contents__head-operation+.form__nav { margin-top:40px } } .contents__foot { margin-top:80px } .contents__foot .breadcrumb+.browsing { margin-top:46px } @media screen and (min-width:1024px) { .contents__foot .breadcrumb+.browsing { margin-top:40px } } @media screen and (max-width:767px) { .contents__operation--sm { margin:0 -28px } } .contents__separation { padding-top:24px; position:relative } .contents__separation:before { border-top:2px solid #1a1a1a; content:""; display:inline-block; height:2px; left:0; position:absolute; top:0; width:24px } .overlay { background:transparent; height:100vw; left:0; position:absolute; top:0; width:100vw; z-index:1 } .pc { display:none } @media screen and (min-width:1024px) { .pc { display:block } } .md { display:block } @media screen and (min-width:1024px) { .md { display:none } } .md-above { display:none } @media screen and (min-width:768px) { .md-above { display:block } .sp { display:none } } .pc-inline { display:none } @media screen and (min-width:768px) { .pc-inline { display:inline-block } } .sp-inline { display:inline-block } @media screen and (min-width:768px) { .sp-inline { display:none } } @media screen and (max-width:767px) { .bg__operation { background:#f2f2f2; min-height:100vh } } .typo__hello { font-size:1.6rem; font-weight:700; line-height:135% } @media screen and (min-width:768px) { .typo__hello { font-size:2rem; line-height:100% } } .typo__shop-menu { font-size:1.6rem; line-height:100% } @media screen and (min-width:768px) { .typo__shop-menu { font-size:1.4rem; line-height:100% } } .typo__shop-menu--small { font-size:1.4rem; line-height:100% } @media screen and (min-width:768px) { .typo__shop-menu--small { font-size:1.6rem; line-height:100% } } .typo__lead { font-size:1.2rem; line-height:150% } .typo__text { font-size:1.6rem; line-height:175% } .typo__information { font-size:1.2rem; font-weight:400; line-height:135% } @media screen and (min-width:768px) { .typo__information { font-size:1.6rem } } .typo__information-sm { font-size:1.4rem; line-height:160% } @media screen and (min-width:768px) { .typo__information-sm { font-size:1.4rem; line-height:185% } } .typo__information-day { font-size:1.2rem; line-height:135% } @media screen and (min-width:768px) { .typo__information-day { font-size:1.6rem } } .typo__information-day--md { font-size:1.3rem } @media screen and (min-width:768px) { .typo__information-day--md { font-size:1.6rem } } .typo__information-title { font-size:1.6rem; line-height:160% } @media screen and (min-width:768px) { .typo__information-title { font-size:1.8rem; line-height:135% } } .typo__information-body { font-size:1.4rem; line-height:160% } @media screen and (min-width:768px) { .typo__information-body { font-size:1.6rem; line-height:175% } } .typo__link { font-size:1.4rem; line-height:150% } .typo__link-min { font-size:1.2rem; line-height:185% } @media screen and (min-width:768px) { .typo__link-min { font-size:1.4rem } } .typo__category-label { font-size:1.4rem; line-height:135% } .typo__summery { font-size:1.2rem; line-height:150% } @media screen and (min-width:768px) { .typo__summery { font-size:1.4rem } } .typo__note { font-size:1.2rem; line-height:150% } .typo__result-num { font-size:2.4rem; line-height:175% } .typo__point { font-size:1.2rem; line-height:100% } @media screen and (min-width:768px) { .typo__point { font-size:1.1rem } } .typo__top-heading { font-size:2.8rem; line-height:150% } @media screen and (min-width:768px) { .typo__top-heading { font-size:3.6rem; line-height:135% } } .typo__top-crosshead { font-size:1.4rem; line-height:135% } @media screen and (min-width:768px) { .typo__top-crosshead { font-size:1.6rem; line-height:150% } } .typo__top-body { font-size:1.4rem; line-height:185% } @media screen and (min-width:768px) { .typo__top-body { font-size:1.6rem } } .typo__top-min { font-size:1.2rem; line-height:185% } @media screen and (min-width:768px) { .typo__top-min { font-size:1.6rem } } .typo__contents-heading { font-size:2.4rem; font-weight:400; line-height:135% } .typo__contents-heading-switch { font-size:1.8rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-heading-switch { font-size:2.4rem } } .typo__contents-crosshead, .typo__contents-subhead { font-size:1.8rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-subhead { font-size:2rem } } .typo__contents-subhead-switch { font-size:2rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-subhead-switch { font-size:1.8rem } } .typo__contents-minhead { font-size:1.6rem; line-height:135% } .typo__contents-minhead-switch { font-size:1.4rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-minhead-switch { font-size:1.6rem } } .typo__contents-minimalhead { font-size:1.4rem; line-height:135% } .typo__contents-body { font-size:1.4rem; line-height:175% } @media screen and (min-width:768px) { .typo__contents-body { font-size:1.6rem } } .typo__contents-detail { font-size:1.6rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-detail { font-size:1.6rem; line-height:150% } } .typo__contents-detail-sb { font-size:1.4rem; line-height:135% } @media screen and (min-width:768px) { .typo__contents-detail-sb { font-size:1.6rem; line-height:185% } } .typo__contents-detail-body { font-size:1.4rem; line-height:150% } @media screen and (min-width:768px) { .typo__contents-detail-body { font-size:1.6rem; line-height:185% } } .typo__contents-toaster { font-size:1.2rem; line-height:100% } @media screen and (min-width:768px) { .typo__contents-toaster { font-size:1.4rem } } .typo__contents-alert { font-size:1.6rem; line-height:175% } @media screen and (min-width:768px) { .typo__contents-alert { font-size:1.4rem; line-height:150% } } .typo__item-body { font-size:1.4rem; font-weight:400; line-height:150% } .typo__item-md { font-size:1.6rem } .typo__item-md--switch { font-size:1.4rem; font-weight:400; line-height:150% } @media screen and (min-width:768px) { .typo__item-md--switch { font-size:1.6rem; line-height:175% } } .typo__item-sm { font-size:1.2rem; font-weight:400; line-height:150% } .typo__item-min { font-size:1rem; line-height:normal } .typo__item-maker { font-size:1.2rem; line-height:150% } .typo__procedure-heading { font-size:1.6rem; line-height:135% } @media screen and (min-width:768px) { .typo__procedure-heading { font-size:2.4rem } } .typo__procedure-heading.required { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .typo__procedure-heading.required:after { background-color:#1a1a1a; border-radius:2px; color:#fff; content:"必須"; display:block; font-size:.8rem; font-weight:700; line-height:100%; margin-left:8px; padding:5px } .typo__procedure-body { font-size:1.2rem; line-height:150% } @media screen and (min-width:768px) { .typo__procedure-body { font-size:1.4rem } } .typo__tag { font-size:1.4rem } @media screen and (min-width:768px) { .typo__tag { font-size:1.6rem } } .typo__copy { font-size:1rem; line-height:120% } .typo__price-ex { font-size:4rem; line-height:100% } .typo__price-splg { font-size:2rem; line-height:100% } .typo__lb { font-size:2.4rem } .typo__max { font-size:2.2rem } .typo__splg { font-size:2rem; line-height:100% } .typo__lg { font-size:1.8rem } .typo__md { font-size:1.6rem } .typo__sm { font-size:1.4rem } .typo__min { font-size:1.2rem } .typo__mini { font-size:1.1rem } .typo__minimal { font-size:1rem; line-height:normal } .typo__regular { font-weight:400 } .typo__emphasis { font-weight:700 } .typo__justified-right { text-align:right } .typo__center, .typo__justified-center { text-align:center } .text-ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap } .breadcrumb { font-size:1.2rem; line-height:135%; margin-top:5px } @media screen and (min-width:768px) { .breadcrumb { font-size:1.4rem } } .breadcrumb-item { display:inline; margin-right:2px } @media screen and (min-width:768px) { .breadcrumb-item { margin-right:10px } } .breadcrumb-item a { color:#1a1a1a; text-decoration:none } @media screen and (min-width:768px) { .breadcrumb-item a { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .breadcrumb-item a:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .breadcrumb-item+.breadcrumb-item:before { content:"/"; display:inline-block; margin-right:2px } @media screen and (min-width:768px) { .breadcrumb-item+.breadcrumb-item:before { margin-right:10px } } .header__wrap { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; justify-content:space-between } @media screen and (min-width:1024px) { .header__wrap { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; -ms-flex-direction:column; flex-direction:column; padding:0 } } .header__top { display:block } .header__logo { color:#1a1a1a; height:44px; width:168px } @media screen and (min-width:768px) { .header__logo { height:58px; width:222px } } @media screen and (min-width:1024px) { .header__logo { height:35px; width:132px } } .header__logo svg { width:100% } @media screen and (min-width:768px) { .header__logo { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .header__logo:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .header__menu { background:#e5e5e5; border-radius:50px; color:#1a1a1a; cursor:pointer; padding:0 } @media screen and (min-width:768px) { .header__menu { height:40px; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease; width:40px } } .header__menu svg { vertical-align:middle } @media screen and (min-width:768px) { .header__menu svg { height:40px; width:40px } } @media screen and (min-width:1024px) { .header__menu { display:none } } @media screen and (min-width:768px) { .header__menu:hover { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } .header__menu:focus { color:#1a1a1a } .header__nav { background:#1f1f1f; bottom:0; -webkit-box-shadow:0 2px 6px rgba(0,0,0,.15); box-shadow:0 2px 6px rgba(0,0,0,.15); font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; left:0; position:fixed; width:100%; z-index:2 } @media screen and (min-width:1024px) { .header__nav { background:none; -webkit-box-shadow:none; box-shadow:none; margin-top:34px; position:static } } .header__nav-list { -webkit-box-pack:center; -ms-flex-pack:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; justify-content:center; list-style:none; text-align:center } @media screen and (min-width:1024px) { .header__nav-list { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; text-align:left } } .header__nav-list li { font-size:.8rem; font-weight:700; line-height:100%; white-space:nowrap } @media screen and (min-width:1024px) { .header__nav-list li { font-size:1.4rem; font-weight:400; margin-top:24px; position:relative } } .header__nav a { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-orient:vertical; -webkit-box-direction:normal; align-items:center; color:#999; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; padding:21px 26px 25px; text-decoration:none } @media screen and (min-width:768px) { .header__nav a { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } @media screen and (min-width:1024px) { .header__nav a { -webkit-box-orient:horizontal; -webkit-box-direction:normal; color:#1a1a1a; -ms-flex-direction:row; flex-direction:row; padding:0 } } @media screen and (min-width:768px) { .header__nav a:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .header__nav-contact { cursor:pointer; display:none } @media screen and (min-width:1024px) { .header__nav-contact { display:block } } .header__nav-icon-wrap { display:inline-block } .header__nav .icon { height:20px; margin-bottom:8px; vertical-align:middle; width:20px } @media screen and (min-width:1024px) { .header__nav .icon { height:18px; margin-bottom:0; margin-right:8px; width:18px } } .header__nav--current a { color:#fff } @media screen and (min-width:1024px) { .header__nav--current a { color:#1a1a1a } .header__nav--current:before { border-bottom:2px solid #1a1a1a; content:""; display:block; left:-40px; position:absolute; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:24px } } .header__information { font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; padding-top:21px } @media screen and (min-width:1024px) { .header__information { font-size:1.1rem; font-weight:400; line-height:100%; padding-top:60px; width:100% } } .header__information .nav__sns { padding-top:16px } @media screen and (max-width:1023px) { .header__nav { -webkit-transition:-webkit-transform .2s ease-out; transition:-webkit-transform .2s ease-out; transition:transform .2s ease-out; transition:transform .2s ease-out,-webkit-transform .2s ease-out } .hide-menu .header__nav { -webkit-transform:translateY(100%); transform:translateY(100%) } } .footer { color:#1a1a1a; font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; font-size:1.6rem; line-height:135% } @media screen and (min-width:1024px) { .footer { font-size:1.4rem; line-height:135%; margin-top:160px } } .footer a { color:#1a1a1a; text-decoration:none } @media screen and (min-width:768px) { .footer a { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .footer a:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } @media screen and (min-width:1024px) { .footer__wrap .nav__information { -webkit-column-gap:24px; -moz-column-gap:24px; column-gap:24px; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap } } .footer__nav-item { margin-top:16px } @media screen and (min-width:1024px) { .footer__logo { -ms-flex-item-align:end; align-self:flex-end; height:25px; text-align:right } } .footer__logo svg { height:25px; width:93px } .footer__copy { margin-top:50px } @media screen and (min-width:1024px) { .footer__copy { margin-top:12px; text-align:left } } .footer__copy .contents__copy { margin-top:15px; text-align:center } @media screen and (min-width:1024px) { .footer__copy .contents__copy { text-align:right } } .nav__information { list-style:none } .nav__information-item { margin-top:16px } .nav__information-item a { color:#1a1a1a; text-decoration:none } @media screen and (min-width:768px) { .nav__information-item a { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .nav__information-item a:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .nav__information .icon { height:6px; margin-left:4px; vertical-align:middle; width:6px } @media screen and (min-width:768px) { .nav__information .icon { height:6px; width:6px } } .nav__sns { line-height:100%; list-style:none } .nav__sns-item { margin-top:16px } .nav__sns-item a { -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#1a1a1a; display:-webkit-box; display:-ms-flexbox; display:flex; display:inline-block; -ms-flex-wrap:nowrap; flex-wrap:nowrap; text-decoration:none } @media screen and (min-width:768px) { .nav__sns-item a { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .nav__sns-item a:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .nav__sns .icon { height:24px; margin-right:6px; vertical-align:middle; width:24px } @media screen and (min-width:768px) { .nav__sns .icon { height:15px; width:15px } } .page-head { background:#fff; color:#1a1a1a; left:0; margin:0 -28px; position:sticky; top:0; z-index:2 } @media screen and (min-width:768px) { .page-head { margin:0 -60px } } .page-head__controls { margin-top:20px } .page-head__controls__list { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap } .page-head__controls__list-item+.page-head__controls__list-item { margin-left:20px } .page-head__wrap { -webkit-box-sizing:border-box; box-sizing:border-box; padding:17px 28px; position:relative; text-align:center } .page-head__wrap .icon__arrow { color:currentColor; left:0; padding:22px } .page-head__wrap .button__primary, .page-head__wrap .icon__arrow { position:absolute; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%) } .page-head__wrap .button__primary { right:14px } .page-head__text { line-height:normal; overflow:hidden; padding:0 40px; text-overflow:ellipsis; white-space:nowrap } .page-head__breadcrumb, .page-head__menu { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; justify-content:space-between } @media screen and (min-width:1024px) { .page-head__breadcrumb, .page-head__menu { display:none } } .page-head__breadcrumb { gap:15px; padding:28px 0 20px } .page-head__breadcrumb .breadcrumb { -webkit-box-orient:vertical; -webkit-line-clamp:2; display:-webkit-box; font-weight:700; margin-top:0; overflow:hidden } .page-head__shadow { -webkit-box-shadow:0 2px 2px rgba(0,0,0,.15); box-shadow:0 2px 2px rgba(0,0,0,.15) } .page-head__order { background:#fff; left:0; margin:0; position:sticky; top:0; z-index:2 } @media screen and (min-width:768px) { .page-head__order { margin:0 -60px } } .page-head__order .page-head__total { margin:0; padding:0 28px 28px } .page-head__operation { background:#f2f2f2; -webkit-box-sizing:border-box; box-sizing:border-box; margin:0; padding:30px 28px 16px; position:relative } .page-head__operation .header__menu { position:absolute; right:28px; top:30px } @media screen and (min-width:1024px) { .page-head__operation .header__menu { display:none } } .page-head__operation .badge__link__icon { background:#ccc } @media screen and (min-width:1024px) { .page-head__operation .badge__link__icon { background:#e5e5e5 } } @media screen and (min-width:768px) { .page-head__operation { margin:0 -60px } } @media screen and (min-width:1024px) { .page-head__operation { background:none; margin:0; padding:0 } } .page-head__operation-text { -webkit-box-align:center; -ms-flex-wrap:nowrap; flex-wrap:nowrap } .page-head__operation-text, .page-head__operation-title { -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .page-head__operation-title { -webkit-box-ordinal-group:3; -ms-flex-order:2; -webkit-box-align:center; order:2 } .page-head__operation-title>*+* { margin-left:4px } .page-head__operation-title.title_large { font-size:2.8rem; line-height:1 } @media screen and (min-width:1024px) { .page-head__operation-title.title_large { font-size:3.6rem } .page-head__operation-icon-sm { display:none } } .page-head__operation-icon-lg { display:none } @media screen and (min-width:1024px) { .page-head__operation-icon-lg { display:block } } .page-head__operation-back { -webkit-box-ordinal-group:2; -ms-flex-order:1; margin-right:20px; order:1 } @media screen and (min-width:1024px) { .page-head__operation-back { margin-right:12px; padding:10px } } @media screen and (min-width:768px) { .page-head__operation-back { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .page-head__operation-back:hover { opacity:.4; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .page-head__operation-back>p { height:16px; width:16px } @media screen and (min-width:768px) { .page-head__operation-back>p { height:24px; width:24px } } .page-head__operation-back .icon { color:currentColor; height:16px; vertical-align:top; width:16px } @media screen and (min-width:768px) { .page-head__operation-back .icon { height:24px; width:24px } } .page-head__operation-lead { margin-top:20px } @media screen and (min-width:768px) { .page-head__operation-lead { margin-top:12px } } .page-head__operation--error { margin-top:21px } @media screen and (min-width:768px) { .page-head__operation--error { margin-top:32px } } .page-head__operation--error>*+* { margin-top:8px } .page-head__total { -webkit-box-pack:justify; -ms-flex-pack:justify; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; justify-content:space-between; margin-top:10px } @media screen and (min-width:1024px) { .page-head__total { display:none } } .page-head__badge { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; background:#1a1a1a; border-radius:1.8rem; color:#fff; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; font-size:1.6rem; font-weight:500; height:3.6rem; justify-content:center; margin-left:4px; width:3.6rem } .page-head__info { margin-top:20px } @media screen and (min-width:1024px) { .page-head__info { margin-top:28px } } .page-head__info__item+.page-head__info__item { margin-top:8px } .page-head__info__item { -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; color:#f22c5a; display:-webkit-box; display:-ms-flexbox; display:flex; font-size:1.4rem; font-weight:700; line-height:2.1rem } .page-head__info__item:before { content:url(/assets/images/page-head__info__icon.svg); display:inline-block; margin-right:4px; margin-top:1px } .page-head__info__item a { color:currentColor; display:inline-block; margin-left:8px; -webkit-text-decoration-line:underline; text-decoration-line:underline } .page-head__info__item a:hover { text-decoration:none } .logout-head { background:#1a1a1a; -webkit-box-sizing:border-box; box-sizing:border-box; color:#fff; padding:0 28px } @media screen and (min-width:1024px) { .logout-head { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between; padding:16px 40px 15px } } .logout-head__logo { -webkit-box-flex:1; color:#fff; -ms-flex:1; flex:1; height:24px } @media screen and (min-width:1024px) { .logout-head__logo { display:none } } .logout-head__logo svg { height:100% } .logout-head__copy { font-size:1.2rem; font-weight:700; padding-top:10px; text-align:center } @media screen and (min-width:1024px) { .logout-head__copy { font-size:1.4rem; padding-top:0 } } .logout-head__info { -webkit-box-pack:end; -ms-flex-pack:end; -webkit-box-align:center; -ms-flex-align:center;
align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:flex-end; padding:13px 0 } @media screen and (min-width:1024px) { .logout-head__info { padding:0 } } .logout-head__register { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end; -webkit-column-gap:10px; -moz-column-gap:10px; column-gap:10px; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between } .logout-head__register-login { color:#fff } .logout-head__register-login:hover { text-decoration:none } .browsing { margin-top:100px } @media screen and (min-width:768px) { .browsing { margin-top:120px } } .browsing__details { margin:16px 0 0 -28px } @media screen and (min-width:768px) { .browsing__details { margin:24px 0 0 } } @media screen and (min-width:1024px) { .browsing__details { margin:24px 0 0 } } @media screen and (min-width:1279px) { .browsing__details { margin:24px 0 0 } } .browsing__list { -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; gap:26px } .browsing .product__item { -webkit-box-flex:0; -webkit-box-sizing:content-box; box-sizing:content-box; -ms-flex:0 0 200px; flex:0 0 200px } @media screen and (max-width:767px) { .browsing .product__item:first-child { padding-left:28px } } @media screen and (min-width:768px) { .browsing .product__item:first-child { padding-left:60px } } @media screen and (min-width:1024px) { .browsing .product__item:first-child { padding-left:0 } } .browsing .product__item:last-child { padding-right:28px } .browsing .product__item-text { margin-top:8px } .browsing__more { -webkit-box-flex:0; -ms-flex:0 0 200px; flex:0 0 200px; padding-right:28px } .browsing__more a { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#1a1a1a; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; justify-content:center } .browsing__more a:hover { text-decoration:none } .breakdown__list { width:100% } .breakdown__list-item+.breakdown__list-item { margin-top:20px } .button { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; -webkit-box-sizing:border-box; box-sizing:border-box; cursor:pointer; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; justify-content:center; padding:0; position:relative; text-align:center } @media screen and (min-width:768px) { .button { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } .button .icon { color:currentColor; display:inline-block; height:16px; vertical-align:middle; width:16px } @media screen and (min-width:768px) { .button:hover { opacity:.4; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .button:active .icon, .button:focus .icon, .button:hover .icon { color:currentColor } .button__positon-switch-md { bottom:-2px; left:0; position:fixed } @media screen and (min-width:1024px) { .button__positon-switch-md { display:none; position:static } } .button.link__text { -webkit-transition:none; transition:none } @media screen and (min-width:768px) { .button.link__text:hover { opacity:1; -webkit-transition:none; transition:none } } .button__primary { background:#1a1a1a; border-radius:4px; color:#fff; display:inline-block; text-align:center; text-decoration:none } @media screen and (min-width:768px) { .button__primary { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } .button__primary--current { background:#fff; border-radius:4px; -webkit-box-shadow:inset 0 0 0 3px #1a1a1a; box-shadow:inset 0 0 0 3px #1a1a1a; color:#1a1a1a; display:inline-block } .button__primary-switch-md { background:#1a1a1a; color:#fff; display:inline-block; text-align:center; text-decoration:none } @media screen and (min-width:1024px) { .button__primary-switch-md { border-radius:4px } } .button__primary-border { -webkit-box-shadow:inset 0 0 0 2px #1a1a1a; box-shadow:inset 0 0 0 2px #1a1a1a } .button__primary-border, .button__secondary { border-radius:4px; color:#1a1a1a; display:inline-block; text-align:center; text-decoration:none } .button__secondary { -webkit-box-shadow:inset 0 0 0 1px #e5e5e5; box-shadow:inset 0 0 0 1px #e5e5e5 } .button__secondary--current { background:#ccc; border-radius:4px; color:#fff; display:inline-block; text-decoration:none } @media screen and (min-width:768px) { .button__secondary--current { background:#ccc } } .button__secondary--switch { color:#000; text-decoration:underline } @media screen and (min-width:768px) { .button__secondary--switch { border-radius:4px; -webkit-box-shadow:inset 0 0 0 1px #ccc; box-shadow:inset 0 0 0 1px #ccc; color:#1a1a1a; display:inline-block; text-align:center; text-decoration:none } } @media screen and (max-width:767px) { .button__secondary--switch:hover { text-decoration:none } } .button__tertiary { text-align:center } .button__tertiary, .button__tertiary--current { background:#f2f2f2; border-radius:4px; color:#1a1a1a; display:inline-block; text-decoration:none } .button__tertiary--current { -webkit-box-shadow:inset 0 0 0 2px #1a1a1a; box-shadow:inset 0 0 0 2px #1a1a1a } .button__quaternary { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; background:#e5e5e5; border-radius:30px; color:#1a1a1a; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; justify-content:center; line-height:1; text-align:center; text-decoration:none } .button__quaternary.button__size--md, .button__quaternary.button__size--sm { padding:14px 20px } .button__quaternary>*+* { margin-left:8px } .button__quaternary--current { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; background:#e5e5e5; border-radius:30px; -webkit-box-shadow:inset 0 0 0 3px #1a1a1a; box-shadow:inset 0 0 0 3px #1a1a1a; color:#1a1a1a; display:inline-block; justify-content:center; text-decoration:none } .button__quaternary-switch-lg { color:#1a1a1a } @media screen and (min-width:1024px) { .button__quaternary-switch-lg { background:#e5e5e5; border-radius:30px; display:inline-block; text-align:center; text-decoration:none } } .button__icon { background:#e5e5e5; color:#1a1a1a } .button__icon--circle { background:#f2f2f2; border-radius:30px; -webkit-box-shadow:inset 0 0 0 2px #dfdfdf; box-shadow:inset 0 0 0 2px #dfdfdf; color:#1a1a1a; height:60px; width:60px } .button__clear { background:#e5e5e5; border-radius:12px; color:#1a1a1a; cursor:pointer; height:24px; margin:0; padding:0; width:24px } .button__clear .icon { color:currentColor; display:inline-block; height:16px; margin:0; padding:0; vertical-align:middle; width:16px } .button__logout { color:#666; font-size:1.2rem } @media screen and (min-width:768px) { .button__logout { font-size:1.4rem } } .button__logout .icon { height:20px; margin-right:5px; width:20px } @media screen and (min-width:768px) { .button__logout .icon { height:30px; width:30px } } .button__tab { color:#999; padding:0 0 5px; position:relative } .button__tab--current:after { border-bottom:2px solid #999; bottom:0; content:""; display:block; left:0; position:absolute; width:100% } .button:disabled { background:#ccc; color:#fff; cursor:auto; outline:none } @media screen and (min-width:768px) { .button:disabled:hover { opacity:1; -webkit-transition:none; transition:none } } .button__register { background:#fff } .button__size--splg { padding:20px 10px } @media screen and (min-width:768px) { .button__size--splg { padding:30px 10px } } .button__size--lg { padding:20px } .button__size--lg .icon { height:20px; width:20px } @media screen and (min-width:768px) { .button__size--lg .icon { height:24px; width:24px } } .button__size--lg-iconwide { padding:20px 60px } .button__size--lg-iconwide .icon { height:20px; width:20px } @media screen and (min-width:768px) { .button__size--lg-iconwide .icon { height:24px; width:24px } } .button__size--lg-exwide { padding:20px 60px } @media screen and (min-width:300px) and (max-width:374px) { .button__size--lg-exwide { padding:20px } } @media screen and (min-width:768px) { .button__size--lg-exwide { padding:20px 6.4vw 20px 8.6vw } } @media screen and (min-width:1024px) { .button__size--lg-exwide { padding:20px 4.8vw 20px 6.8vw } } @media screen and (min-width:1500px) { .button__size--lg-exwide { padding:20px } } .button__size--lg-exwide .icon { height:20px; width:20px } @media screen and (min-width:768px) { .button__size--lg-exwide .icon { height:24px; width:24px } } .button__size--lg-switch-md { padding:20px } @media screen and (min-width:768px) { .button__size--lg-switch-md { padding:14px } } .button__size--md { padding:14px } .button__size--md-wide { padding:14px 30px } .button__size--sm { padding:10px } .button__size--sm-wide { padding:8px 16px } .button__size--fit { -webkit-box-sizing:border-box; box-sizing:border-box; width:100% } .button__icon--right .icon { margin-right:17px } .button__icon--position-stocking .icon, .button__icon--position .icon { left:30px; position:absolute; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%) } @media screen and (min-width:300px) and (max-width:374px) { .button__icon--position-stocking .icon { left:10px } } @media screen and (min-width:768px) { .button__icon--position-stocking .icon { left:4vw } } @media screen and (min-width:1024px) { .button__icon--position-stocking .icon { left:4vw } } @media screen and (min-width:1500px) { .button__icon--position-stocking .icon { left:61px } } .button__icon--row { -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row } .button__icon--column, .button__icon--row { -webkit-box-direction:normal; -webkit-box-pack:start; -ms-flex-pack:start; display:-webkit-box; display:-ms-flexbox; display:flex; gap:10px; justify-content:flex-start; line-height:135% } .button__icon--column { -webkit-box-orient:vertical; -ms-flex-direction:column; flex-direction:column } .button__icon-read { text-align:left } .button__icon-read .icon { -webkit-box-flex:0; -ms-flex:0 0 37px; flex:0 0 37px; height:37px; width:37px } .button__icon-top { gap:18px } .button__icon-top .icon { -webkit-box-flex:0; -ms-flex:0 0 30px; flex:0 0 30px; height:30px; width:30px } .pagination .button__icon { background:#fff; border-radius:4px; -webkit-box-shadow:inset 0 0 0 1px #e5e5e5; box-shadow:inset 0 0 0 1px #e5e5e5; color:#1a1a1a } .badge__link { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#1a1a1a; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; justify-content:center; text-decoration:none } @media screen and (min-width:768px) { .badge__link { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .badge__link:hover { opacity:.4; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .badge__link__icon { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; background:#ccc; border-radius:2rem; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; height:2.7rem; justify-content:center; margin-right:6px; position:relative; width:2.7rem } @media screen and (min-width:768px) { .badge__link__icon { margin-right:3px } } .badge__link__icon .icon { height:1em; left:49.9%; top:49.9%; width:13px } .badge__link__icon .icon, .badge__link__icon .icon__time { position:absolute; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%) } .badge__link__icon .icon__time { left:47% } .cart__item { border-bottom:2px solid #f2f2f2 } @media screen and (max-width:767px) { .cart__item { padding:28px } } @media screen and (min-width:768px) { .cart__item { margin-top:60px; padding-bottom:16px } .cart__item+.cart__item { margin-top:40px } } .cart__item .link__text { color:#666 } .cart__item-wrap { -ms-grid-columns:1fr 18px 100px; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:18px; grid-template-columns:1fr 100px; grid-template-rows:auto } .cart__item-wrap>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .cart__item-wrap>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } @media screen and (min-width:1279px) { .cart__item-wrap { gap:60px } } @media screen and (min-width:768px) { .cart__item-detail { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; gap:18px; justify-content:space-between } } @media screen and (min-width:1024px) { .cart__item-detail { display:block } } @media screen and (min-width:1279px) { .cart__item-detail { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between } } @media screen and (max-width:767px) { .cart__item-detail .product__item-list { margin-top:12px } } .cart__item-text { -webkit-box-flex:1; -ms-flex:1; flex:1 } .cart__item-quantity { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } @media screen and (max-width:767px) { .cart__item-quantity { margin-top:12px } } @media screen and (min-width:768px) { .cart__item-quantity { margin-top:0 } } @media screen and (min-width:1024px) { .cart__item-quantity { margin-top:12px } } @media screen and (min-width:1279px) { .cart__item-quantity { -webkit-box-pack:end; -ms-flex-pack:end; justify-content:flex-end; margin-top:0 } } .cart__item-quantity-number { margin-right:8px; word-break:break-word } .cart__item-delete { color:#b2b2b2; font-size:1.4rem; margin-top:13px } @media screen and (min-width:768px) { .cart__item-delete { margin-top:16px } } .category { margin:40px 0 0 } @media screen and (min-width:768px) { .category { margin:24px 0 0 } } .category__menu-list { -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; gap:12px; list-style:none } @media screen and (min-width:768px) { .category__menu-list { gap:16px } } .category__menu-item { -webkit-box-flex:0; -webkit-box-sizing:content-box; box-sizing:content-box; -ms-flex:0 0 100px; flex:0 0 100px } @media screen and (max-width:767px) { .category__menu-item:first-child { padding-left:28px } } @media screen and (min-width:768px) { .category__menu-item:first-child { padding-left:60px } } @media screen and (min-width:1024px) { .category__menu-item:first-child { padding-left:0 } } .category__menu-item:last-child { padding-right:28px } .category__menu-link { -webkit-box-sizing:border-box; box-sizing:border-box; color:#1a1a1a; display:block; text-decoration:none } @media screen and (min-width:768px) { .category__menu-link { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .category__menu-link:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .category__menu-link img { border-radius:4px; display:block } .category__menu-link-text { display:inline-block; font-size:1.4rem; font-weight:400; margin-top:8px } @media screen and (min-width:768px) { .category__menu-link-text { margin-top:12px } } .category__all { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:center; min-height:158px; text-align:center } .contents__category { margin-top:64px } @media screen and (min-width:768px) { .contents__category { margin-top:120px } } .contents__category .category { margin-top:16px } @media screen and (min-width:768px) { .contents__category .category { margin-top:20px } } .columns__justify--between { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } .columns__items--center { -webkit-box-align:center; -ms-flex-align:center; align-items:center } @media screen and (max-width:767px) { .columns__items--center-sm { -webkit-box-align:center; -ms-flex-align:center; align-items:center } } .columns__horizontal-uniformity { -ms-grid-columns:1fr 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:auto } .columns__horizontal-uniformity>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .columns__horizontal-uniformity>:nth-child(2) { -ms-grid-column:2; -ms-grid-row:1 } .columns__horizontal-uniformity-elements { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .columns__horizontal-switch--reverse { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:start; -ms-flex-align:start; -webkit-box-orient:horizontal; -webkit-box-direction:reverse; align-items:flex-start; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:row-reverse; flex-direction:row-reverse; justify-content:space-between } @media screen and (min-width:768px) { .columns__horizontal-switch--reverse { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row } } .columns__horizontal-switch--reverse-left { -webkit-box-flex:1; -ms-flex:1; flex:1 } .columns__horizontal-switch--reverse-right { -ms-flex-preferred-size:112px; flex-basis:112px; margin:0 16px 0 0 } @media screen and (min-width:768px) { .columns__horizontal-switch--reverse-right { -ms-flex-preferred-size:220px; flex-basis:220px; margin:0 0 0 40px } } @media screen and (min-width:1024px) { .columns__horizontal-cart { -ms-grid-columns:1fr 50px auto; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:50px; grid-template-columns:1fr auto; grid-template-rows:auto; position:relative } .columns__horizontal-cart>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .columns__horizontal-cart>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } .columns__horizontal-cart { -ms-grid-columns:1fr 366px; grid-template-columns:1fr 366px } } @media screen and (min-width:768px) { .columns__horizontal-order { -ms-grid-columns:(240px 1fr)[1]; -ms-grid-rows:auto; display:-ms-grid; display:grid; grid-template-columns:repeat(1,240px 1fr); grid-template-rows:auto } .columns__horizontal-order>:first-child { -ms-grid-column:1; -ms-grid-row:1 } } .columns__horizontal-date { -ms-grid-columns:(auto 1fr)[1]; -ms-grid-rows:auto; display:-ms-grid; display:grid; grid-template-columns:repeat(1,auto 1fr); grid-template-rows:auto } .columns__horizontal-date>:first-child { -ms-grid-column:1; -ms-grid-row:1 } @media screen and (min-width:768px) { .columns__horizontal-date { -ms-grid-columns:(240px 1fr)[1]; grid-template-columns:repeat(1,240px 1fr) } } .columns__horizontal-date>:nth-child(2) { text-align:right } @media screen and (min-width:768px) { .columns__horizontal-date>:nth-child(2) { text-align:left } } .columns__horizontal-edit { display:-webkit-box; display:-ms-flexbox; display:flex } @media screen and (min-width:768px) { .remarks { -ms-grid-columns:auto 12px 1fr; -ms-grid-rows:auto; -webkit-column-gap:12px; -moz-column-gap:12px; column-gap:12px; display:-ms-grid; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto; row-gap:20px } .remarks>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .remarks>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } @media screen and (max-width:767px) { .remarks__word { margin-top:20px } .remarks__text { margin-top:4px } } .flow__status { -webkit-box-align:stretch; -ms-flex-align:stretch; align-items:stretch; display:-ms-grid; display:grid } @media screen and (max-width:767px) { .flow__status { gap:8px } } @media screen and (min-width:768px) { .flow__status { gap:12px } } .flow__status-detail { color:#a6a6a6; font-size:1rem; font-weight:700; line-height:120% } @media screen and (min-width:768px) { .flow__status-detail { font-size:1.2rem } } .flow__status-next, .flow__status-next span { display:-webkit-box; display:-ms-flexbox; display:flex } .flow__status-next span { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-box-flex:1; align-items:center; background:#fff; border-radius:4px 0 0 4px; -ms-flex:1; flex:1; justify-content:center; padding:0 0 0 8px; text-align:center } @media screen and (min-width:768px) { .flow__status-next span { background:#f2f2f2; padding:13px 8px } } .flow__status-next:after { background:url(../images/flow.svg) 100% no-repeat; background-size:auto 100%; content:""; height:100%; width:12px } @media screen and (min-width:768px) { .flow__status-next:after { background:url(../images/flow-pc.svg) 100% no-repeat } } .flow__status-next--current span { background:#a6a6a6; color:#fff } .flow__status-next--current:after { background:url(../images/flow-current.svg) 100% no-repeat; background-size:auto 100%; content:""; height:100%; width:12px } .flow__status-last { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:#fff; border-radius:4px; -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; justify-content:center; padding:8px; text-align:center; width:100% } @media screen and (min-width:768px) { .flow__status-last { background:#f2f2f2 } } .flow__status-last--current { background:#a6a6a6; color:#fff } .flow__order { -ms-grid-columns:(1fr)[2]; grid-template-columns:repeat(2,1fr) } .flow__account-member { -ms-grid-columns:(1fr)[3]; grid-template-columns:repeat(3,1fr) } .form-notice { color:#f22c5a; margin-top:12px } @media screen and (max-width:767px) { .form__size--sm { width:28.1437125749% } } @media screen and (min-width:768px) { .form__size--sm { width:95px } } @media screen and (max-width:767px) { .form__size--md { width:47.3053892216% } } @media screen and (min-width:768px) { .form__size--md { width:220px } } @media screen and (max-width:767px) { .form__size--lg { width:47.3053892216% } } @media screen and (min-width:768px) { .form__size--lg { width:345px } } .form__size--fit, .form__size--fit>* { width:100% } .form__input-filled { font-size:16px; height:60px; line-height:60px; width:100% } @media screen and (max-width:767px) { .form__ul { background-color:#fff; margin:30px -28px 0 } } @media screen and (min-width:768px) { .form__ul { border-bottom:1px solid #f2f2f2; border-top:1px solid #f2f2f2; margin-top:40px } } @media screen and (max-width:767px) { .form__ul__li { padding:28px } } @media screen and (min-width:768px) { .form__ul__li { padding:30px } } .form__ul__li:not(:first-child) { border-top:1px solid #f2f2f2 } @media screen and (max-width:767px) { .form__ul__li>*+* { margin-top:28px } } @media screen and (min-width:768px) { .form__ul__li>*+* { margin-top:30px } } .form__label { display:block; padding-bottom:10px } .form__label label, .form__label legend, .form__label p:not(.form__attention) { display:inline-block; font-size:1.2rem; font-weight:700; line-height:100% } .form__label--require { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .form__label--require label, .form__label--require legend, .form__label--require p:not(.form__attention) { padding-right:5px } .form__label--require:after { background-color:#1a1a1a; border-radius:2px; color:#fff; content:"必須"; display:block; font-size:.8rem; font-weight:700; line-height:100%; padding:5px } .form__note { color:#666; display:inline-block; font-size:1rem; line-height:150%; margin-top:10px } .form__note .link__text { color:inherit } .form__attention { display:block; font-weight:400; line-height:150%; margin-bottom:10px } .form__name { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } @media screen and (max-width:767px) { .form__name .form__input:last-of-type { margin-left:18px } } @media screen and (min-width:768px) { .form__name .form__input:last-of-type { margin-left:30px } } .form__postalcode, .form__tel { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; position:relative } @media screen and (max-width:767px) { .form__postalcode button, .form__tel button { margin-left:7.7844311377% } } @media screen and (min-width:768px) { .form__postalcode button, .form__tel button { margin-left:30px } } .form__postalcode span, .form__tel span { font-size:1.6rem; line-height:100%; text-align:center } @media screen and (max-width:767px) { .form__postalcode span, .form__tel span { width:7.7844311377% } } @media screen and (min-width:768px) { .form__postalcode span, .form__tel span { width:30px } } .form__limit { -webkit-column-gap:18px; -moz-column-gap:18px; column-gap:18px } @media screen and (min-width:768px) { .form__limit { -webkit-column-gap:15px; -moz-column-gap:15px; column-gap:15px } } .form__month, .form__year { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .form__month>:not(label), .form__year>:not(label) { margin-right:10px } @media screen and (max-width:767px) { .form__month>:not(label), .form__year>:not(label) { -webkit-box-flex:1; -ms-flex:1; flex:1 } .form__button__size--sm { width:100% } } @media screen and (min-width:768px) { .form__button__size--sm { width:240px } } .form__nav { display:-webkit-box; display:-ms-flexbox; display:flex } .form__nav-info { margin-top:32px } @media screen and (min-width:768px) { .form__nav-info { margin-top:40px } } .form__nav-info>*+* { margin-top:20px } @media screen and (max-width:767px) { .form__nav { -webkit-box-orient:vertical; -webkit-box-direction:reverse; -ms-flex-direction:column-reverse; flex-direction:column-reverse } } @media screen and (min-width:768px) { .form__nav { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; justify-content:space-between; margin-top:30px } } @media screen and (min-width:1024px) { .form__nav { margin-top:80px } } .form__nav-item { width:100% } .form__nav-item.centering { margin-left:auto; margin-right:auto } @media screen and (max-width:767px) { .form__nav-item { margin-top:30px } } @media screen and (min-width:768px) { .form__nav-item { max-width:240px } } .form__nav-sm { display:none } @media screen and (min-width:1024px) { .form__nav-sm { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between; margin-top:80px } } .form__operation { margin-top:50px } @media screen and (min-width:768px) { .form__operation { margin-top:40px } *+.form__operation { margin-top:80px } } @media screen and (max-width:767px) { .pc+.form__operation { margin-top:0 } } @media screen and (min-width:768px) { .pc+.form__operation { margin-top:40px } } .form__operation-head { padding:0 28px } @media screen and (min-width:768px) { .form__operation-head { padding:0 } } .form__operation-head+.form__operation-text { margin-top:30px } @media screen and (min-width:768px) { .form__operation-head+.form__operation-text { margin-top:40px } } .form__operation-head-detail { margin-top:32px } @media screen and (min-width:768px) { .form__operation-head-detail { margin-top:40px } } .form__operation-head-detail>*+* { margin-top:10px } .form__operation-attribute>*+*, .form__operation-property>*+* { margin-top:28px } @media screen and (min-width:768px) { .form__operation-attribute>*+*, .form__operation-property>*+* { margin-top:30px } } .form__operation-attribute .form__text--error, .form__operation-property .form__text--error { margin-top:10px } .form__operation-property { border-bottom:1px solid #f2f2f2; border-top:1px solid #f2f2f2; padding:28px } @media screen and (max-width:767px) { .form__operation-property { background:#fff } } @media screen and (min-width:768px) { .form__operation-property { padding:30px } } @media screen and (max-width:767px) { .form__operation-text { background:#fff } } @media screen and (min-width:768px) { .form__operation-text { margin-top:40px } } .form__operation-text-item { display:block } .form__operation-text-item>*+* { display:inline-block; margin-top:10px } .form__operation-text-credit { margin:15px 0 0 4rem } .form__operation-text-credit .icon { height:10px; -webkit-transform:rotate(-180deg); transform:rotate(-180deg); width:10px } .form__operation-text .form__text--error { margin-top:10px } .form__operation--clear .form-decision { text-decoration:line-through } @media screen and (min-width:768px) { .form__operation .form__nav { margin-top:30px } } @media screen and (max-width:767px) { .form__submit { margin:30px 28px 0 } } @media screen and (min-width:768px) { .form__submit { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-orient:horizontal; -webkit-box-direction:reverse; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:row-reverse; flex-direction:row-reverse; justify-content:space-between; margin-top:40px } } @media screen and (max-width:767px) { .form__submit .button:last-child { margin-top:30px } } .form__dropdown { display:block; margin-top:0 } .form__dropdown>* { margin-top:30px } .form__dropdown>.form__input, .form__dropdown>.form__text--error { margin-top:10px } .form__disabled { pointer-events:none } .form__disabled .link__text { pointer-events:auto } .form__label+.checkbox { margin-top:0 } .form__input { -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:#f6f6f6; border:1px solid #e5e5e5; border-radius:2px; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; gap:10px } .form__input>svg:first-child { margin-left:12px } .form__input input, .form__input select { color:#1a1a1a; font-size:1.6rem; padding:14px 12px; width:100% } @media screen and (min-width:768px) { .form__input input, .form__input select { padding:18px 14px } } .form__input select { background:url(/assets/images/arrow_select.svg) no-repeat center right 14px/10px 6px } .form__input input::-webkit-input-placeholder { color:#a6a6a6 } .form__input input::-moz-placeholder { color:#a6a6a6 } .form__input input:-ms-input-placeholder { color:#a6a6a6 } .form__input input::-ms-input-placeholder { color:#a6a6a6 } .form__input input::placeholder { color:#a6a6a6 } .form__input .icon+input { padding-left:10px } @media screen and (min-width:768px) { .form__input .icon+input { padding-left:12px } } .form__input:focus-within { background:rgba(3,169,244,.1); border:1px solid #03a9f4 } .form__input--error { background:#f2f2f2; outline:1px solid #e5e5e5 } .form__input--disabled { background:#fafafa; border:transparent } .form__input--disabled input { color:rgba(26,26,26,.3) } .search { -webkit-box-sizing:border-box; box-sizing:border-box; padding:0 12px } @media screen and (min-width:768px) { .search { min-width:334px; padding:0 14px } } .search input { font-size:1.6rem } @media screen and (min-width:768px) { .search input { font-size:1.4rem } } .textarea textarea { background:#f6f6f6; border-radius:2px; font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; font-size:1.4rem; min-height:102px; outline:1px solid #e5e5e5; padding:15px } .textarea textarea:focus { background:rgba(3,169,244,.1); outline:1px solid #03a9f4 } .textarea__size--lg textarea { min-height:270px } .select select { color:#1a1a1a; display:block; font-size:1.6rem; padding:10px 0; position:relative; width:100%; z-index:1 } @media screen and (max-width:767px) { .select select { -webkit-transform:scale(.75); transform:scale(.75); -webkit-transform-origin:center left; transform-origin:center left } } .select__search-box { color:#1a1a1a; display:inline-block; margin-top:10px; min-width:135px; position:relative } @media screen and (min-width:768px) { .select__search-box { margin-top:60px } } .select__search-box select { color:#1a1a1a; font-size:1.6rem; width:100% } @media screen and (max-width:767px) { .select__search-box select { -webkit-transform:scale(.75); transform:scale(.75); -webkit-transform-origin:center left;
transform-origin:center left; width:132% } } .select__search-box .icon { display:inline-block; height:19px; position:absolute; right:0; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); vertical-align:middle; width:19px; z-index:-1 } .checkbox { -webkit-box-align:center; -ms-flex-align:center; align-items:center; cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex } .checkbox__checkbox, .checkbox input[type=checkbox] { -ms-flex-negative:0; -webkit-box-sizing:border-box; box-sizing:border-box; display:inline-block; flex-shrink:0; height:2rem; position:relative; width:2rem } .checkbox__checkbox:before, .checkbox input[type=checkbox]:before { border:2px solid #666; border-radius:4px; -webkit-box-sizing:border-box; box-sizing:border-box; content:""; display:block; height:100%; position:absolute; -webkit-transition:background-color .2s ease; transition:background-color .2s ease; width:100% } .checkbox__checkbox:after, .checkbox input[type=checkbox]:after { background-image:url(../images/check.svg); background-position:50%; background-repeat:no-repeat; background-size:contain; -webkit-box-sizing:border-box; box-sizing:border-box; content:""; display:inline-block; height:10px; left:2px; position:absolute; top:5px; -webkit-transform:scale(0); transform:scale(0); -webkit-transition:-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); transition:-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); transition:transform .2s cubic-bezier(.34,1.56,.64,1); transition:transform .2s cubic-bezier(.34,1.56,.64,1),-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); width:15px } .checkbox__checkbox:checked:before, .checkbox input[type=checkbox]:checked:before { background:#666 } .checkbox__checkbox:checked:after, .checkbox input[type=checkbox]:checked:after { -webkit-transform:scale(1); transform:scale(1) } .checkbox__inline-switch-sm { cursor:auto } @media screen and (max-width:767px) { .checkbox__inline-switch-sm label { width:100% } } .checkbox__label, .checkbox label { font-size:1.4rem } .checkbox__checkbox+.checkbox__label { margin-left:2rem } .checkbox input[type=checkbox]+label { cursor:pointer; margin-left:1rem } .radio { -webkit-box-align:center; -ms-flex-align:center; align-items:center; cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex } .radio__radio, .radio input[type=radio] { -ms-flex-negative:0; -webkit-box-sizing:border-box; box-sizing:border-box; display:inline-block; flex-shrink:0; height:2rem; position:relative; width:2rem } .radio__radio:before, .radio input[type=radio]:before { border:2px solid #666; border-radius:2rem; -webkit-box-sizing:border-box; box-sizing:border-box; content:""; display:block; height:100%; position:absolute; -webkit-transition:background-color .2s ease; transition:background-color .2s ease; width:100% } .radio__radio:after, .radio input[type=radio]:after { background-image:url(../images/check.svg); background-position:50%; background-repeat:no-repeat; background-size:contain; -webkit-box-sizing:border-box; box-sizing:border-box; content:""; display:inline-block; height:10px; left:2px; position:absolute; top:5px; -webkit-transform:scale(0); transform:scale(0); -webkit-transition:-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); transition:-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); transition:transform .2s cubic-bezier(.34,1.56,.64,1); transition:transform .2s cubic-bezier(.34,1.56,.64,1),-webkit-transform .2s cubic-bezier(.34,1.56,.64,1); width:15px } .radio__radio:checked:before, .radio input[type=radio]:checked:before { background:#666 } .radio__radio:checked:after, .radio input[type=radio]:checked:after { -webkit-transform:scale(1); transform:scale(1) } .radio__radio:disabled:before, .radio input[type=radio]:disabled:before { border:2px solid hsla(0,0%,40%,.3) } .radio__inline-switch-sm { cursor:auto } @media screen and (max-width:767px) { .radio__inline-switch-sm label { width:100% } } .radio__label, .radio label { font-size:1.4rem } .radio__radio+.radio__label { margin-left:2rem } .radio input[type=radio]+label { cursor:pointer; margin-left:1rem } .radio__radio:disabled+.radio__label, .radio input[type=radio]:disabled+label { color:rgba(26,26,26,.3); cursor:auto } .radio__emphasis label:first-line { font-weight:700 } .switch { cursor:pointer; display:inline-block; height:calc(1.8rem + 4px); position:relative; width:4.6rem } .switch__checkbox { left:0; pointer-events:none; position:absolute; top:0 } .switch__checkbox:checked~.switch__knob { left:2.6rem } .switch__checkbox:checked~.switch__background { background-color:#666 } .switch__knob { background:#999; border-radius:1.8rem; display:inline-block; height:1.8rem; left:2px; position:absolute; top:2px; -webkit-transition:left .2s ease,background-color .2s ease; transition:left .2s ease,background-color .2s ease; width:1.8rem; z-index:5 } .switch__background { background:#f2f2f2; border-radius:2rem; content:""; display:block; height:100%; -webkit-transition:background-color .2s ease; transition:background-color .2s ease; width:100% } .combo-box__input { position:relative } .combo-box__input input { caret-color:transparent; cursor:pointer; padding:14px 28px 14px 12px } .combo-box__input .icon { position:absolute; right:10px; top:50%; -webkit-transform:translateY(-50%) rotate(-90deg); transform:translateY(-50%) rotate(-90deg); width:6px } .combo-box__input.active .icon { -webkit-transform:translateY(-50%) rotate(90deg); transform:translateY(-50%) rotate(90deg) } .combo-box__list { overflow:hidden; -webkit-transition:max-height .4s ease-in-out; transition:max-height .4s ease-in-out } .combo-box__list-text { border:1px solid #e5e5e5; border-radius:2px 2px 0 0; padding:15px } .combo-box__list-item { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; border:1px solid #e5e5e5; border-top-color:transparent; cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between; padding:15px } @media screen and (max-width:767px) { .combo-box__list-item { gap:10px } } @media screen and (min-width:768px) { .combo-box__list-item { padding:22px 15px } } .combo-box__list-item:hover { background:rgba(3,169,244,.1); border:1px solid #03a9f4 } .combo-box__list-item:last-child { border-radius:0 0 2px 2px } @media screen and (min-width:768px) { .combo-box__list-item-details { display:-webkit-box; display:-ms-flexbox; display:flex; gap:20px } } .combo-box__list-code { font-size:1.2rem; line-height:normal } @media screen and (min-width:768px) { .combo-box__list-code { font-size:1.6rem } } .combo-box__list-rimit { font-size:1rem; line-height:normal } @media screen and (min-width:768px) { .combo-box__list-rimit { font-size:1.2rem } } .combo-box__list-num { font-size:1.4rem; font-weight:700; line-height:normal } @media screen and (min-width:768px) { .combo-box__list-num { font-size:1.6rem } } .form__text--error { color:#f22c5a } .form__text--error .icon { height:18px; margin-right:5px; vertical-align:text-bottom; width:18px } @media screen and (min-width:768px) { .form__text--error .icon { height:20px; width:20px } } .form__text--error-column { display:-webkit-box; display:-ms-flexbox; display:flex; font-size:1.2rem; line-height:150% } @media screen and (min-width:768px) { .form__text--error-column { font-size:1.4rem } } .form__text--error-column-details { -webkit-box-flex:1; -ms-flex:1; flex:1 } .form__operation--error { background:rgba(242,44,90,.1); -webkit-transition:background .4s ease-in-out; transition:background .4s ease-in-out; -webkit-transition-delay:1s; transition-delay:1s } .form__operation--error-text input, .form__operation--error .form-decision+.form__text--error { color:#f22c5a } .form__operation--error-return { background:transparent } .error_text { color:#f22c5a; font-size:1.2rem } .mark-circle { background:#e5e5e5; border-radius:50px } .mark-circle .icon { vertical-align:middle } .icon { width:auto } .icon__clear { width:24px } .point-circle { border:2px solid #1a1a1a; border-radius:50px; height:45px; margin:0 auto; width:45px } .point-circle__icon { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; justify-content:center } .point-circle__icon.check .icon { height:15.25px; width:20px } @media screen and (min-width:768px) { .point-circle__icon.check .icon { height:13px; width:17px } } .point-circle .icon, .point-circle svg { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; height:20px; justify-content:center; width:auto } .icon__position .icon { height:13px; width:9.1px } .keywords__head-sm { position:relative } @media screen and (max-width:767px) { .keywords__head-sm { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; margin:40px 0 0 } } .keywords__head-sm .icon__arrow { color:currentColor; left:11px; position:absolute; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%) } .keywords__wrap { position:fixed; right:0; top:0; z-index:2 } @media screen and (max-width:767px) { .keywords__wrap { height:100vh; width:100vw } } @media screen and (min-width:768px) { .keywords__wrap { -ms-overflow-style:none; height:340px; overflow-y:scroll; position:absolute; right:0; scrollbar-width:none; top:55px; width:100% } } @media screen and (min-width:1024px) { .keywords__wrap { height:340px; right:0; width:334px } } .keywords__wrap::-webkit-scrollbar { display:none } .keywords__inner-wrap { background:#fff; border:1px solid #e5e5e5 } @media screen and (max-width:767px) { .keywords__inner-wrap { height:100vh } .keywords__inner-wrap .search { margin:0 52px } } .keywords__text { color:#b2b2b2; padding:10px 49px } @media screen and (max-width:767px) { .keywords__text { margin-top:40px } } @media screen and (min-width:768px) { .keywords__text { border-bottom:1px solid #e5e5e5; padding:24px 20px } } @media screen and (max-width:767px) { .keywords__list { -ms-overflow-style:none; height:calc(100vh - 188px); overflow-y:scroll; scrollbar-width:none } } .keywords__list-item { border-bottom:1px solid #e5e5e5; cursor:pointer; padding:16px 64px } @media screen and (min-width:768px) { .keywords__list-item { padding:16px 40px; -webkit-transition:background .4s ease-in-out; transition:background .4s ease-in-out } .keywords__list-item:last-child { border-bottom:none } .keywords__list-item:hover { background:#f2f2f2 } } .link__article { color:#b2b2b2; text-decoration:none } @media screen and (min-width:768px) { .link__article { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .link__article:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .link__details { color:#a6a6a6; font-size:1.2rem; text-decoration:underline } .link__details:hover { text-decoration:none } .link__text { color:#1a1a1a; text-decoration:underline } .link__text:hover { text-decoration:none } .link__text--no-deco { color:#1a1a1a; text-decoration:none } @media screen and (min-width:768px) { .link__text--no-deco { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .link__text--no-deco:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .link__text--no-deco:hover .text__underline--dark { text-decoration:none } .link__to-next { margin-top:12px } @media screen and (min-width:768px) { .link__to-next { margin-top:16px } } .link__gray { color:#b2b2b2; cursor:pointer } @media screen and (min-width:768px) { .link__gray { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .link__gray:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .link__arrow { -webkit-box-flex:1; -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#1a1a1a; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex:1 6px; flex:1 6px; justify-content:space-between; text-decoration:none } @media screen and (min-width:768px) { .link__arrow { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } .link__arrow .icon { height:10px; -webkit-transform:rotate(-180deg); transform:rotate(-180deg); width:10px } @media screen and (min-width:768px) { .link__arrow:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } @media screen and (max-width:767px) { .link__arrow-switch-sm .icon { display:none } } .link__icon { color:#1a1a1a; height:16px; text-decoration:underline; width:16px } @media screen and (min-width:768px) { .link__icon { opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } } .link__icon .icon { height:16px; width:16px } @media screen and (min-width:768px) { .link__icon:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .link__thin, .link__withdrawal { color:#999; font-size:1.2rem; text-decoration:underline } .link__thin:hover, .link__withdrawal:hover { text-decoration:none } .text__underline--dark { color:#fff; text-decoration:underline } .list { margin:0 0 0 20px } .list li { margin-top:4px } .list li::marker { color:currentColor } .list__disc { list-style:disc } .list__decimal { list-style:decimal } .list__note li { -ms-grid-columns:auto 1fr; -ms-grid-rows:auto; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-ms-grid; display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto; margin-top:4px } .list__note li>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .list__note li>:nth-child(2) { -ms-grid-column:2; -ms-grid-row:1 } .list__note li:before { -ms-flex-item-align:start; -ms-grid-row-align:start; align-self:start; content:"※"; font-size:inherit } .list__tag { -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:nowrap; flex-wrap:nowrap; gap:12px; margin:32px -28px 10px } @media screen and (min-width:768px) { .list__tag { margin:40px -60px 8px } } @media screen and (min-width:1024px) { .list__tag { margin:40px 0 8px } } .list__tag-item { -webkit-box-flex:0; -ms-flex:0 0 auto; flex:0 0 auto } .list__tag-item:first-child { padding-left:28px } @media screen and (min-width:768px) { .list__tag-item:first-child { padding-left:60px } } @media screen and (min-width:1024px) { .list__tag-item:first-child { padding-left:0 } } .list__tag-item:last-child { padding-right:28px } @media screen and (min-width:768px) { .list__tag-item:last-child { padding-right:60px } } @media screen and (min-width:1024px) { .list__tag-item:last-child { padding-right:0 } } .list__separation-diagonal { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; line-height:normal; margin-top:4px } .list__separation-diagonal-element { margin-right:5px } .list__separation-diagonal li+li:before { content:"/"; margin-right:5px; padding-left:5px } .list__product-tag { -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; gap:12px; margin-top:32px } @media screen and (min-width:768px) { .list__product-tag { margin-top:0 } } .list__reading-link>*+* { margin-top:10px } @media screen and (min-width:768px) { .list__reading-link>*+* { margin-top:16px } } .list__introduction-link>*+* { margin-top:16px } @media screen and (min-width:768px) { .list__introduction-link>*+* { margin-top:18px } } .index-list { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; height:100%; position:relative } .index-list__navigation { -ms-grid-columns:1fr 4px 1fr 4px 1fr 4px 1fr 4px 1fr 4px 1fr; display:-ms-grid; display:grid; gap:4px; grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr; padding:14px 28px 28px } .index-list__navigation .last { -ms-grid-column-span:2; -ms-grid-column:5; grid-column-end:7; grid-column-start:5 } .index-list__navigation .button { font-weight:700; line-height:2.1rem; padding:10px } .index-list__navigation .button:active, .index-list__navigation .button:focus { background:#ccc } .index-list__header { -ms-flex-negative:0; flex-shrink:0 } .index-list__list { height:100%; overflow:auto; position:relative; scroll-behavior:smooth } .index-list__index { background:#f2f2f2; font-size:1.4rem; font-weight:700; line-height:1; margin-bottom:-44px; padding:10px 28px; position:sticky; top:0; z-index:10 } .index-list__index+.border-list { padding-top:44px } .suggest-list { font-size:1.4rem } .suggest-list__title { color:#a6a6a6; line-height:1.89rem; padding:10px 28px 10px 40px } .suggest-list__item { cursor:pointer; line-height:1.89rem; padding-left:64px!important } .suggest-list.hide { display:none } .new-stamp { position:relative } .new-stamp:after { background:#f22c5a; border-radius:4px; content:""; display:block; height:8px; left:16px; position:absolute; top:-2px; width:8px } @media screen and (min-width:768px) { .new-stamp:after { left:14px; top:-2px } } .unread { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; background:#f22c5a; border-radius:15px; -webkit-box-sizing:border-box; box-sizing:border-box; color:#fff; height:30px; justify-content:center; text-align:center; width:30px } .modal, .unread { display:-webkit-box; display:-ms-flexbox; display:flex } .modal { -webkit-box-align:end; -ms-flex-align:end; -webkit-box-orient:vertical; -webkit-box-direction:normal; align-items:flex-end; bottom:0; -ms-flex-direction:column; flex-direction:column; left:0; position:fixed; right:0; top:0; visibility:hidden; width:100vw; z-index:100 } .modal__header { -ms-flex-negative:0; flex-shrink:0; padding:24px 56px } .modal__header-text { color:#1a1a1a; font-size:1.8rem; font-weight:700; text-align:center } .modal__body { padding:28px } .modal__body>*+* { margin-top:40px } .modal__block>*+* { margin-top:12px } @media screen and (max-width:767px) { .modal { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row } } .modal-show { visibility:visible } .modal-show .modal__container { -webkit-transform:translateX(0); transform:translateX(0); -webkit-transition:-webkit-transform .4s ease; transition:-webkit-transform .4s ease; transition:transform .4s ease; transition:transform .4s ease,-webkit-transform .4s ease } @media screen and (max-width:767px) { .modal-show .modal__container { -webkit-transform:translateY(0); transform:translateY(0) } } .modal-show .modal__backdrop { opacity:1 } .modal-hide { visibility:visible } .modal-hide .modal__container { -webkit-transform:translateX(100%); transform:translateX(100%); -webkit-transition:-webkit-transform .4s ease; transition:-webkit-transform .4s ease; transition:transform .4s ease; transition:transform .4s ease,-webkit-transform .4s ease } @media screen and (max-width:767px) { .modal-hide .modal__container { -webkit-transform:translateY(100%); transform:translateY(100%) } } .modal-hide .modal__backdrop { opacity:0 } .modal__backdrop { background:rgba(0,0,0,.25); height:100%; left:0; opacity:0; position:fixed; top:0; -webkit-transition:opacity .4s ease; transition:opacity .4s ease; width:100%; z-index:5 } .modal__container { -ms-scroll-chaining:none; background:#fff; -webkit-box-shadow:-2px -3px 3px rgba(0,0,0,.15); box-shadow:-2px -3px 3px rgba(0,0,0,.15); -webkit-box-sizing:border-box; box-sizing:border-box; height:100%; overflow:auto; overscroll-behavior:none; position:relative; -webkit-transform:translateX(100%); transform:translateX(100%); width:390px; z-index:10 } @media screen and (max-width:767px) { .modal__container { border-radius:20px 20px 0 0; max-height:calc(100% - 72px); max-width:inherit; -webkit-transform:translateY(100%); transform:translateY(100%); width:100% } } .modal__content { position:relative } .modal__button { color:#666; cursor:pointer; line-height:1; padding:0; position:absolute; top:20px; z-index:10 } .modal__button-right { right:20px } .modal__button-right-text { color:#1a1a1a; font-size:1.4rem; font-weight:700; right:32px; top:28px } .modal__button-left { left:20px } .modal__button svg { height:3rem; width:3rem } .modal-alert { -ms-flex-item-align:center; -ms-grid-row-align:center; align-self:center; background:#fff; -webkit-box-sizing:border-box; box-sizing:border-box; min-height:315px; position:relative; text-align:center; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:650px; z-index:10 } @media screen and (max-width:767px) { .modal-alert { height:85vw; left:50%; min-height:334px; min-width:334px; padding:40px 28px; top:0; -webkit-transform:translateX(-50%); transform:translateX(-50%); width:85vw } } @media screen and (min-width:768px) { .modal-alert { padding:80px 75px } } .modal-alert>*+* { margin-top:28px } @media screen and (min-width:768px) { .modal-alert>*+* { margin-top:20px } } .modal-alert__text { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content:center; min-height:137px } @media screen and (min-width:768px) { .modal-alert__text { min-height:94px } } .modal-alert__text-item { height:100% } .modal-alert__operation { margin:0 auto; max-width:172px } @media screen and (min-width:768px) { .modal-alert__operation { max-width:140px } .modal-alert__operation-item { margin-top:20px } } .modal-alert__operation-item+.modal-alert__operation-item { margin-top:28px } @media screen and (min-width:768px) { .modal-alert__operation-item+.modal-alert__operation-item { margin-top:20px } } .modal-alert__close { margin-top:0; position:absolute; right:26px; top:26px } @media screen and (min-width:768px) { .modal-alert__close { right:30px; top:30px } } .modal-alert__close .icon { height:24px; width:24px } .modal-alert__change { font-size:1.4rem; margin-bottom:40px; padding-top:30px; text-align:left } @media screen and (min-width:768px) { .modal-alert__change { font-size:1.6rem; margin-bottom:20px; padding-top:0 } } .modal-alert__change>*+* { margin-top:10px } @media screen and (min-width:768px) { .modal-alert__change>*+* { margin-top:12px } } .modal-alert__change-text { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; gap:10px } @media screen and (min-width:768px) { .modal-alert__change-text { -webkit-box-orient:horizontal; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:row; flex-direction:row; gap:0 } } .modal-alert__change-text-flap { display:inline-block } .modal-alert__change-column { -webkit-box-align:baseline; -ms-flex-align:baseline; align-items:baseline; display:-webkit-box; display:-ms-flexbox; display:flex; gap:12px } .modal-alert__change-logo { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; gap:4px; width:105px } @media screen and (min-width:768px) { .modal-alert__change-logo { width:150px } } .modal-alert__change-logo-svg { height:auto; width:105px } @media screen and (min-width:768px) { .modal-alert__change-logo-svg { height:auto; width:150px } } .modal-alert__change-logo-caption { text-align:center } .pagination { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content:center; list-style:none; margin-top:60px } @media screen and (min-width:768px) { .pagination { margin-top:80px } } .pagination>*+* { margin-left:6px; margin-right:6px } @media screen and (min-width:768px) { .pagination>*+* { margin-left:10px; margin-right:10px } } @media screen and (max-width:767px) { .pagination .pagination__num:nth-child(2) { margin-left:0 } .pagination .pagination__num:nth-child(8) { margin-right:0 } } .pagination__lead .button { color:#1a1a1a } .pagination__num .button__secondary { background:#fff } .pagination__next { margin-left:46px } .pagination__next .icon { -webkit-transform:rotate(180deg); transform:rotate(180deg) } @media screen and (max-width:767px) { .pagination__next { display:none } } .pagination__prev { margin-right:46px } @media screen and (max-width:767px) { .pagination__prev { display:none } } @media screen and (min-width:768px) { *+.procedure, .procedure+.procedure { margin-top:80px } } .procedure__wrap { margin-top:50px } @media screen and (max-width:767px) { .procedure__wrap { background:#fff } } @media screen and (min-width:1024px) { .procedure__wrap { margin-top:40px } } .procedure>p:not(.procedure__text-result) { margin-top:22px } @media screen and (max-width:767px) { .procedure>p:not(.procedure__text-result) { padding:0 28px } } @media screen and (min-width:768px) { .procedure>p:not(.procedure__text-result) { margin-top:20px } } .procedure__head { -webkit-box-orient:vertical; -webkit-box-direction:reverse; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column-reverse; flex-direction:column-reverse } @media screen and (max-width:767px) { .procedure__head { padding:0 28px } } .procedure__head--row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-direction:row; flex-direction:row } @media screen and (max-width:767px) { .procedure__head--row { padding:0 28px } } .procedure__head--row>*+* { margin-top:30px } @media screen and (min-width:768px) { .procedure__head--row>*+* { margin-top:40px } } .procedure__head--row+.procedure__wrap { margin-top:30px } @media screen and (min-width:768px) { .procedure__head--row+.procedure__wrap { margin-top:40px } } .procedure__head .procedure__text--error { margin:30px 0 0 } @media screen and (min-width:768px) { .procedure__head .procedure__text--error { margin:30px 0 0 } } @media screen and (min-width:1024px) { .procedure__head .procedure__text--error { margin:0 0 40px } } .procedure__head .title__procedure { margin-top:50px } @media screen and (min-width:1024px) { .procedure__head .title__procedure { margin-top:0 } } .procedure__head+.procedure__wrap { margin-top:30px } @media screen and (min-width:768px) { .procedure__head+.procedure__wrap { margin-top:40px } } .procedure__title-sb { padding:28px } @media screen and (min-width:768px) { .procedure__title-sb { padding:30px } } .procedure__text-result { margin-top:30px } @media screen and (min-width:768px) { .procedure__text-result { margin-top:20px } } .procedure__text--error .form__text--error+.form__text--error { margin-top:20px } .procedure__detail-text { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:justify; -ms-flex-pack:justify; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between } .procedure__detail-text>.form-decision { -webkit-box-flex:1; -ms-flex:1; flex:1 } .procedure__detail-text .title__procedure-sb { width:100% } .procedure__detail-text .icon { -webkit-box-flex:0; -ms-flex:0 0 10px; flex:0 0 10px; height:10px; margin-left:10px; -webkit-transform:rotate(-180deg); transform:rotate(-180deg); width:10px } .procedure__detail-text .order__item { width:calc(100% + 54px) } @media screen and (min-width:768px) { .procedure__detail-text .order__item { width:calc(100% + 60px) } } .procedure__detail-text .order__item:first-child { margin-top:-28px } @media screen and (min-width:768px) { .procedure__detail-text .order__item:first-child { margin-top:-30px } } .procedure__detail-text .order__item:last-child { margin-bottom:-28px } @media screen and (min-width:768px) { .procedure__detail-text .order__item:last-child { margin-bottom:-30px } .procedure__detail-text .procedure__data-item+.procedure__data-item { border-top:1px solid #f2f2f2 } } @media screen and (max-width:767px) { .procedure__detail-text .title__procedure-sb+.form-decision { margin-top:20px } } .procedure__data { background:#fff; border-top:1px solid #f2f2f2; padding:28px } @media screen and (min-width:768px) { .procedure__data { padding:0 } } @media screen and (max-width:767px) { .procedure__data>*+* { margin-top:20px } } .procedure__data-item { width:100% } @media screen and (min-width:768px) { .procedure__data-item { padding:30px } } @media screen and (max-width:767px) { .procedure__data-item+.procedure__data-item { margin-top:20px } } .procedure__data-vertical--center { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .procedure__note { margin-top:20px } .procedure>.procedure__data { margin-top:50px } @media screen and (min-width:768px) { .procedure>.procedure__data { border-bottom:1px solid #f2f2f2; margin-top:40px } } .procedure>.form__text--error { padding:10px 28px 0 } .product__maker { -ms-grid-columns:20px 2px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:2px; grid-template-columns:20px 1fr; grid-template-rows:auto; margin-top:8px } .product__maker>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__maker>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } @media screen and (min-width:768px) { .product__maker { margin-top:12px } } .product__maker .icon { -ms-flex-item-align:center; -ms-grid-row-align:center; align-self:center; height:20px; width:20px } .product__head { margin-top:32px } @media screen and (min-width:768px) { .product__head { margin-top:30px } } @media screen and (max-width:767px) { .product__head-maker:after { border-right:1px solid #1a1a1a; content:""; display:inline-block; height:1.4rem; margin-right:8px; padding-right:8px; -webkit-transform:translateY(1px); transform:translateY(1px) } .product__head-maker .icon { display:none } .product__head-maker, .product__head-title { display:inline } } @media screen and (min-width:768px) { .product__head-title { margin-top:4px } } .product__thumbnail { border-radius:4px } .product__item-link { color:#1a1a1a; display:block; text-decoration:none } @media screen and (min-width:768px) { .product__item-link { color:#1a1a1a; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .product__item-link:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } .product__item-switch-horizontal { -ms-grid-columns:120px 20px 1fr; -ms-grid-rows:auto; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; display:-ms-grid; display:grid; gap:20px; grid-template-columns:120px 1fr; grid-template-rows:auto } .product__item-switch-horizontal>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__item-switch-horizontal>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } .product__item-switch-horizontal .product__item-text>:first-child { margin-top:0 } .product__item-switch-horizontal .product__item-text>*+* { margin-top:4px } } .product__item-switch-horizontal .product__item-text .product__item-name { margin-top:8px } .product__item-switch-horizontal .product__item-text .product__item-price { margin-top:4px } .product__item-name { margin-top:8px } @media screen and (max-width:767px) { .product__item-text { margin-top:8px } } .product__item-text+.product__item-maker { margin-top:4px } @media screen and (min-width:768px) { .product__item-text .product__item-price+.product__item-list { margin-top:20px } } .product__item-maker { -ms-grid-columns:20px 2px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:2px; grid-template-columns:20px 1fr; grid-template-rows:auto; margin-top:8px } .product__item-maker>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__item-maker>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } @media screen and (min-width:768px) { .product__item-maker { margin-top:12px } } .product__item-maker .icon { height:20px; vertical-align:middle; width:20px } .product__item-maker+.product__item-text { margin-top:8px } @media screen and (min-width:768px) { .product__item-maker+.product__item-text { margin-top:20px } } .product__item-price { margin-top:8px } .product__item-list { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; margin-top:8px } .product__item-list-element { margin-right:5px } .product__item-list-element .typo__item-body
{ line-height:150% } .product__item-list li+li { margin-top:0 } .product__item-list li+li:before { border-left:1px solid #1a1a1a; content:""; padding-left:5px } .category__head { -webkit-box-flex:60px; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex:60px 1; flex:60px 1; gap:16px } @media screen and (min-width:768px) { .category__head { -webkit-box-flex:120px; -ms-flex:120px 1; flex:120px 1; gap:20px } } .category__head-text .breadcrumb { font-weight:700 } .category__head-img img { border-radius:4px } @media screen and (max-width:767px) { .category__head-img img { height:60px; width:60px } } .product__list { -ms-grid-columns:1fr 20px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:40px 20px; grid-template-columns:repeat(2,1fr); grid-template-rows:auto; margin-top:22px } .product__list>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__list>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } @media screen and (min-width:768px) { .product__list { gap:100px 40px; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)) } } .product__list .product__thumbnail, .product__list .product__thumbnail img { height:auto; width:100% } @media screen and (max-width:767px) { .product__list .product__item-list, .product__list .product__item-price { margin-top:8px } } .product__category-separation { border-bottom:1px solid #f2f2f2 } @media screen and (max-width:767px) { .product__category-list { margin:0 -28px } } @media screen and (min-width:768px) { .product__category-list { -ms-grid-columns:1fr 45px 1fr 45px 1fr; -ms-grid-rows:auto; -webkit-column-gap:45px; -moz-column-gap:45px; column-gap:45px; display:-ms-grid; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:auto } .product__category-list>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__category-list>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } .product__category-list>:nth-child(3) { -ms-grid-column:5; -ms-grid-row:1 } .product__category-list-item { -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-bottom:1px solid #f2f2f2; display:-webkit-box; display:-ms-flexbox; display:flex } .product__category-list-item>* { width:100% } } .product__category-list-sb { -ms-grid-columns:56px 1fr; -ms-grid-rows:auto; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-ms-grid; display:grid; grid-template-columns:56px 1fr; grid-template-rows:auto } .product__category-list-sb>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__category-list-sb>:nth-child(2) { -ms-grid-column:2; -ms-grid-row:1 } @media screen and (max-width:767px) { .product__category-list-sb { border-bottom:2px solid #f2f2f2; gap:16px; min-height:80px; padding:8px 68px 8px 12px } } @media screen and (min-width:768px) { .product__category-list-sb { -ms-grid-columns:64px 12px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:12px; grid-template-columns:64px 1fr; grid-template-rows:auto; padding:12px 0 } .product__category-list-sb>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .product__category-list-sb>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } .product__category-list-md { list-style:none } @media screen and (min-width:768px) { .product__category-list-md { display:none } } @media screen and (max-width:767px) { .product__category-list-md .link__text--no-deco { -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-bottom:1px solid #f2f2f2; display:-webkit-box; display:-ms-flexbox; display:flex; min-height:80px; padding:4px 68px 4px 82px } } .product__category-list-sm { list-style:none } @media screen and (min-width:768px) { .product__category-list-sm { display:none } } @media screen and (max-width:767px) { .product__category-list-sm .link__text--no-deco { padding:4px 68px 4px 114px } } .thumbnail__fit { height:auto; width:100% } .thumbnail__fit-cover { -o-object-fit:cover; object-fit:cover; vertical-align:top } .thumbnail__fit.sp { height:112px; -o-object-fit:cover; object-fit:cover; width:112px } .thumbnail__square { -webkit-padding-before:100%; display:inherit; overflow:hidden; padding-block-start:100%; position:relative; width:100% } .thumbnail__square img { left:50%; max-height:100%; max-width:100%; -o-object-fit:contain; object-fit:contain; position:absolute; top:50%; -webkit-transform:translate(-50%,-50%); transform:translate(-50%,-50%); vertical-align:top } .thumbnail__square-cover img { -o-object-fit:cover; object-fit:cover } .thumbnail__logo { border-radius:24px; margin-right:2px; vertical-align:middle } .order__item { margin:0 -28px } @media screen and (min-width:768px) { .order__item { margin:0 -30px } } .order__item-wrap { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-column-gap:12px; -moz-column-gap:12px; column-gap:12px; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; justify-content:space-between; padding:28px } @media screen and (min-width:1279px) { .order__item-wrap { -webkit-column-gap:16px; -moz-column-gap:16px; column-gap:16px; padding:30px } } .order__item-quantity { margin-top:20px } @media screen and (min-width:768px) { .order__item-quantity { margin-top:12px } } .order__item-detail { -webkit-box-flex:1; -ms-flex:1; flex:1 } .order__item-thumbnail { width:100px } .order__item-text>*+* { margin-top:12px } .order__item+.order__item { border-top:1px solid #f2f2f2 } .order__item .form__text--error { -ms-flex-preferred-size:100%; flex-basis:100%; margin-top:10px } .order__item .form__text--error a { color:currentColor } .scroll__horizontal { margin-left:-28px; overflow-x:auto; padding-bottom:20px } @media screen and (min-width:768px) { .scroll__horizontal { margin-left:-60px; padding-bottom:24px } } @media screen and (min-width:1024px) { .scroll__horizontal { margin-left:0 } } .scroll__horizontal::-webkit-scrollbar { background:#fff } .scroll__horizontal::-webkit-scrollbar-thumb { background-color:#fff; border-radius:10px; overflow:hidden; -webkit-transition:background-color .2s ease; transition:background-color .2s ease } .scroll__horizontal::-webkit-scrollbar-button { display:none } .scroll__horizontal:hover::-webkit-scrollbar-thumb { background-color:#e5e5e5 } @media screen and (max-width:767px) { .scroll__horizontal-sm { margin-left:-28px; overflow-x:auto; padding-bottom:20px } .scroll__horizontal-sm::-webkit-scrollbar { background:#fff } .scroll__horizontal-sm::-webkit-scrollbar-thumb { background-color:#fff; border-radius:10px; overflow:hidden; -webkit-transition:background-color .2s ease; transition:background-color .2s ease } .scroll__horizontal-sm::-webkit-scrollbar-button { display:none } .scroll__horizontal-sm:hover::-webkit-scrollbar-thumb { background-color:#e5e5e5 } } .result__head { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between; margin-top:32px } @media screen and (min-width:768px) { .result__head { margin-top:60px } .result__head-category { margin-top:40px } } .result__text { color:#999; margin-top:68px } @media screen and (min-width:768px) { .result__text { margin-top:124px } } .shop-menu { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; list-style:none; margin-top:8px } @media screen and (min-width:768px) { .shop-menu { margin-top:16px } } .shop-menu li { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; padding-right:20px } .shop-menu__mark { margin-right:6px } @media screen and (min-width:768px) { .shop-menu__mark { margin-right:3px } } .shop-menu__mark .icon { height:27px; width:27px } .tag__item { background:#f2f2f2; border-radius:30px; color:#1a1a1a } .tag__item, .tag__status { display:inline-block; text-align:center; text-decoration:none } .tag__status { border-radius:2px; color:#fff; min-width:80px; padding:10px } .tag__status--reserve { background:#1a1a1a } .tag__status--sending { background:#ccc; color:#1a1a1a } .tag__status--cancel { background:#fff; border:1px solid #1a1a1a; color:#1a1a1a } .title__separation { padding-top:24px; position:relative } .title__separation:before { border-top:2px solid #1a1a1a; content:""; display:inline-block; height:2px; left:0; position:absolute; top:0; width:24px } .title__ruledline { border-bottom:1px solid #f2f2f2; padding-bottom:20px } .title__category { padding-bottom:40px } .title__category-sb img { border-radius:4px; height:68.32px; vertical-align:middle; width:56px } @media screen and (min-width:768px) { .title__category-sb img { height:77.6px; width:64px } } .title__category-min { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; min-height:80px; padding:4px 68px 4px 82px } .title__procedure+p { margin-top:10px } @media screen and (min-width:768px) { .title__procedure+p { margin-top:20px } } @media screen and (max-width:767px) { .title__account { text-align:center } } .title__topic { margin-top:10px } @media screen and (min-width:768px) { .title__topic { margin-top:16px } } .title__product-detail-sb { font-weight:400 } .information { margin-top:22px } @media screen and (min-width:768px) { .information { margin-top:0 } } .information__list-link { color:#1a1a1a; display:block; text-decoration:none } @media screen and (min-width:768px) { .information__list-link { color:#1a1a1a; display:-webkit-box; display:-ms-flexbox; display:flex; opacity:1; -webkit-transition:opacity .4s ease; transition:opacity .4s ease } .information__list-link:hover { opacity:.5; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .information__list-item+.information__list-item { margin-top:20px } @media screen and (min-width:768px) { .information__list-item+.information__list-item { margin-top:12px } } .information__list-day { -webkit-box-flex:0; -ms-flex:0 0 100px; flex:0 0 100px } .information__list-title { -ms-flex-item-align:center; -ms-grid-row-align:center; align-self:center } .information__list-text { margin-top:4px } @media screen and (min-width:768px) { .information__list-text { margin-top:0 } } .information__link { margin-top:16px; text-align:right } @media screen and (min-width:768px) { .information__link { -ms-flex-item-align:end; -ms-grid-row-align:end; align-self:end } } .toaster__text+.toaster__text { border-top:1px solid #666 } .toaster__link { background:#1a1a1a; color:#fff; display:block; padding:10px; text-align:center } @media screen and (min-width:1024px) { .toaster__link { padding:22px } } .toaster__positon-switch { bottom:80px; left:0; position:fixed; width:100%; z-index:2 } @media screen and (min-width:1024px) { .toaster__positon-switch { bottom:auto; left:auto; max-width:440px; right:20px; top:20px; width:calc(50% - 100px) } } .toaster__positon-switch .toaster__link { background:rgba(26,26,26,.9); position:relative; text-align:left } @media screen and (min-width:768px) { .toaster__positon-switch .toaster__link { padding:18px 16px } } .toaster__positon-switch .toaster__link p+p { margin-top:10px } .toaster__positon-switch .toaster__link:after { border-left:11px solid transparent; border-right:11px solid transparent; border-top:13px solid #1a1a1a; bottom:-10px; content:""; display:block; left:50%; position:absolute; -webkit-transform:translateX(-50%); transform:translateX(-50%) } @media screen and (min-width:1024px) { .toaster__positon-switch .toaster__link:after { display:none } } a.toast { color:#fff; text-decoration:none; -webkit-transition:background-color .2s ease; transition:background-color .2s ease } a.toast .toast__cart--button { color:#fff; text-decoration:underline } a.toast:hover { background:#323232 } a.toast:hover .toast__cart--button { text-decoration:none } .toast { background:#1a1a1a; bottom:84px; -webkit-box-sizing:border-box; box-sizing:border-box; color:#fff; display:block; -webkit-filter:drop-shadow(0 1px 0 #a6a6a6); filter:drop-shadow(0 1px 0 #A6A6A6); left:0; opacity:0; padding:16px; position:fixed; -webkit-transform:translateY(20%); transform:translateY(20%); -webkit-transition:opacity .4s ease,bottom .2s ease-out,-webkit-transform .4s ease; transition:opacity .4s ease,bottom .2s ease-out,-webkit-transform .4s ease; transition:transform .4s ease,opacity .4s ease,bottom .2s ease-out; transition:transform .4s ease,opacity .4s ease,bottom .2s ease-out,-webkit-transform .4s ease; visibility:hidden; width:100%; z-index:50 } .toast-show { opacity:1; -webkit-transform:translateY(0); transform:translateY(0); visibility:visible } .toast-hide { opacity:0; -webkit-transform:translateY(20%); transform:translateY(20%); visibility:visible } .toast a { color:#fff; text-decoration:underline } .toast a:hover { text-decoration:none } @media screen and (min-width:1024px) { .toast { bottom:auto; -webkit-filter:none; filter:none; left:auto; max-width:510px; padding:20px; right:20px; top:20px; -webkit-transform:translateX(20%); transform:translateX(20%); width:auto } .toast-show { -webkit-transform:translateX(0); transform:translateX(0) } .toast-hide { -webkit-transform:translateX(20%); transform:translateX(20%) } } @media screen and (max-width:900px) { .toast { top:auto!important } } @media screen and (min-width:1024px) { .toast__cart { width:510px } } .toast__cart--amount { display:-webkit-box; display:-ms-flexbox; display:flex } .toast__cart--amount>*+* { margin-left:20px } .toast__cart--added-info { display:block; margin-bottom:0!important; max-height:0; opacity:0; overflow:hidden; -webkit-transition:max-height .4s ease,opacity .4s ease,margin .4s ease; transition:max-height .4s ease,opacity .4s ease,margin .4s ease } .toast__cart--added-info.show { margin-bottom:5px!important; max-height:120px; opacity:1 } .toast__cart--button { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; font-size:1.4rem; font-weight:700; text-decoration:none; white-space:nowrap } .toast__cart--button>*+* { margin-left:5px } .toast__cart--button svg { height:1.8rem; width:1.8rem } .toast__cart--body>* { margin-bottom:5px } .toast__cart--body>:last-child { margin-bottom:0 } .toast__cart .toast__body { -webkit-box-pack:justify; -ms-flex-pack:justify; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between } .toast__cart .toast__body .toast__cart--button { -ms-flex-negative:1; flex-shrink:1; margin-left:20px } .toast__stock:after { background:#1a1a1a; content:""; display:block; height:10px; left:50%; position:absolute; top:100%; -webkit-transform:translate(-50%,-50%) rotate(45deg); transform:translate(-50%,-50%) rotate(45deg); width:10px } @media screen and (min-width:1024px) { .toast__stock { bottom:auto; left:177px; max-width:510px; right:auto; top:137px; -webkit-transform:translateX(-5%); transform:translateX(-5%); width:auto } .toast__stock.toast-show { -webkit-transform:translateX(0); transform:translateX(0) } .toast__stock.toast-hide { -webkit-transform:translateX(-5%); transform:translateX(-5%) } .toast__stock:after { background:#1a1a1a; content:""; display:block; height:10px; left:0; position:absolute; top:50%; -webkit-transform:translate(-50%,-50%) rotate(45deg); transform:translate(-50%,-50%) rotate(45deg); width:10px } } @media screen and (max-width:1023px) { .hide-menu .toast { bottom:0 } } .drilldown__container { height:100%; overflow:hidden; position:relative } .drilldown__section { -webkit-box-orient:vertical; -webkit-box-direction:normal; background:#fff; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; height:100%; left:0; position:absolute; top:0; visibility:hidden; width:100% } .drilldown__section-active { visibility:visible } .drilldown__section-forward-to-center { -webkit-animation-duration:.4s; animation-duration:.4s; -webkit-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-name:forwardToCenter; animation-name:forwardToCenter; -webkit-animation-timing-function:ease; animation-timing-function:ease; visibility:visible } .drilldown__section-center-to-forward { -webkit-animation-duration:.4s; animation-duration:.4s; -webkit-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-name:centerToForward; animation-name:centerToForward; -webkit-animation-timing-function:ease; animation-timing-function:ease; visibility:visible } .drilldown__section-back-to-center { -webkit-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-name:backToCenter; animation-name:backToCenter; -webkit-animation-timing-function:ease; animation-timing-function:ease } .drilldown__section-back-to-center, .drilldown__section-center-to-back { -webkit-animation-duration:.4s; animation-duration:.4s; visibility:visible } .drilldown__section-center-to-back { -webkit-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-name:centerToBack; animation-name:centerToBack; -webkit-animation-timing-function:ease; animation-timing-function:ease } .drilldown__header { -ms-flex-negative:0; flex-shrink:0; padding:24px 56px } .drilldown__header-text { color:#1a1a1a; font-size:1.8rem; font-weight:700; text-align:center } .drilldown__body { height:100%; overflow:auto } .drilldown__body-container { padding:28px } .drilldown__back-button { color:#666; cursor:pointer; left:20px; line-height:1; padding:0; position:absolute; top:20px } .drilldown__back-button svg { height:3rem; width:3rem } @-webkit-keyframes forwardToCenter { 0% { -webkit-transform:translateX(100%); transform:translateX(100%) } to { -webkit-transform:translateX(0); transform:translateX(0) } } @keyframes forwardToCenter { 0% { -webkit-transform:translateX(100%); transform:translateX(100%) } to { -webkit-transform:translateX(0); transform:translateX(0) } } @-webkit-keyframes backToCenter { 0% { -webkit-transform:translateX(-100%); transform:translateX(-100%) } to { -webkit-transform:translateX(0); transform:translateX(0) } } @keyframes backToCenter { 0% { -webkit-transform:translateX(-100%); transform:translateX(-100%) } to { -webkit-transform:translateX(0); transform:translateX(0) } } @-webkit-keyframes centerToForward { 0% { -webkit-transform:translateX(0); transform:translateX(0) } to { -webkit-transform:translateX(100%); transform:translateX(100%) } } @keyframes centerToForward { 0% { -webkit-transform:translateX(0); transform:translateX(0) } to { -webkit-transform:translateX(100%); transform:translateX(100%) } } @-webkit-keyframes centerToBack { 0% { -webkit-transform:translateX(0); transform:translateX(0) } to { -webkit-transform:translateX(-100%); transform:translateX(-100%) } } @keyframes centerToBack { 0% { -webkit-transform:translateX(0); transform:translateX(0) } to { -webkit-transform:translateX(-100%); transform:translateX(-100%) } } .border-list .remove-padding { padding:0!important } .border-list__item { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; min-height:54px; padding:10px 28px } .border-list__item>* { width:100% } .border-list__item+.border-list__item { border-top:1px solid #f2f2f2 } .border-list__item-between { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } .border-list__item-label { font-size:1.4rem; font-weight:700; white-space:nowrap; width:inherit } .border-list__item-body { font-size:1.4rem; line-height:1.5; overflow-wrap:anywhere; text-align:right; width:100% } .border-list__item-label+.border-list__item-body { padding-left:20px } .border-list__item[role=navigation] { cursor:pointer } .border-list__vertical { border-bottom:1px solid #f2f2f2 } .border-list__vertical-item { border-top:1px solid #f2f2f2; padding:28px } @media screen and (min-width:768px) { .border-list__vertical-item { padding:30px } } .border-list__vertical-edit { border-top:1px solid #f2f2f2; padding:20px 28px } @media screen and (min-width:768px) { .border-list__vertical-edit { padding:30px } } .border-list__vertical-property { border-top:1px solid #f2f2f2; padding:20px 0 0 } @media screen and (min-width:768px) { .border-list__vertical-property { padding:30px } } .border-list__vertical-property:first-child { border:none; padding:0 } @media screen and (min-width:768px) { .border-list__vertical-property:first-child { padding:30px } } .text-align__right { text-align:right } .text-align__left { text-align:left } .text-align__center { text-align:center } .filter__footer { padding:28px 28px 60px } .filter-select { cursor:pointer; display:inline-block; font-size:1.6rem; line-height:1.6; position:relative } .filter-select select { color:#1a1a1a; cursor:pointer; font-size:1.6rem; padding-right:7px } @media screen and (max-width:767px) { .filter-select select { -webkit-transform:scale(.875); transform:scale(.875); -webkit-transform-origin:center left; transform-origin:center left } } @media screen and (min-width:1024px) { .filter-select select { font-size:1.6rem; line-height:1.6; padding-right:20px } } .filter-select:after { background-image:url(/assets/images/select-caret.svg); background-position:50%; background-size:contain; content:""; display:inline-block; height:18px; pointer-events:none; position:absolute; right:0; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%); width:18px } .drawer .icon__plus { display:inherit } .drawer .icon__minus, .drawer .icon__plus { -ms-flex-negative:0; color:#ccc; flex-shrink:0; padding-left:22px } .drawer .icon__minus { display:none } .drawer .drawer .border-list__item, .drawer .drawer>.drawer__header { padding-left:68px } .drawer-active>.drawer__body { display:block } .drawer-active .icon__plus { display:none } .drawer-active .icon__minus { display:inherit } .drawer__header { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:justify; -ms-flex-pack:justify; align-items:center; cursor:pointer; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between; padding:16px 28px } .drawer__header+.drawer__body { border-top:1px solid #f2f2f2 } .drawer__body { display:none } .drawer__label { font-size:1.4rem; overflow-wrap:anywhere } .stock { padding-bottom:190px } @media screen and (max-width:767px) { .stock .page-head__operation, .stock .stock-list { margin:0 -28px } } @media screen and (min-width:1024px) { .stock { padding-bottom:0 } } .stock-list__header { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; padding:20px 28px } .stock-list__header>:last-child { margin-left:auto } @media screen and (min-width:1024px) { .stock-list__header { padding:20px 0 } .stock-list__header>*+*, .stock-list__header>:last-child { margin-left:40px } } .stock-list__list { -ms-grid-columns:1fr; display:-ms-grid; display:grid; grid-template-columns:1fr; padding:0 28px } @media screen and (min-width:1024px) { .stock-list__list { -ms-grid-columns:1fr 80px 1fr 80px 1fr; gap:0 80px; grid-template-columns:1fr 1fr 1fr; padding:0 } } .stock-list__list--item { border-bottom:1px solid #e5e5e5; padding:16px 0; position:relative; -webkit-transition:border-color .2s ease; transition:border-color .2s ease } .stock-list__list--item.active, .stock-list__list--item:active, .stock-list__list--item:focus, .stock-list__list--item:hover { border-bottom-color:#1a1a1a } @media screen and (min-width:1024px) { .stock-list__list--item { padding:36px 0 20px } } .stock-list__list--item .item-card { -webkit-box-align:stretch; -ms-flex-align:stretch; -webkit-box-orient:vertical; -webkit-box-direction:normal; align-items:stretch; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; -ms-flex-wrap:wrap; flex-wrap:wrap; height:100%; position:relative } .stock-list__list--item .item-card__sub { margin-top:auto } .stock-list__list--item.checked .item-card:after { background-image:url(/assets/images/stock-check.svg); background-size:contain; content:""; display:inline-block; height:24px; position:absolute; right:6px; top:6px; width:24px } @media screen and (min-width:1024px) { .stock-list__list--item.checked .item-card:after { height:16px; right:4px; top:4px; width:16px } } .stock-list__list--item.checked .item-card .item-card__body, .stock-list__list--item.checked .item-card .item-card__sub { opacity:.5 } .stock-list__list--item.checked .item-card .item-card__image { opacity:.3 } .stock-notice { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; font-size:12px; font-weight:700; line-height:135%; margin:20px 28px } .stock-notice svg { height:14px; width:auto } .stock-notice>*+* { margin-left:8px } .stock-notice .pc { display:none } .stock-notice .sp { display:block } @media screen and (min-width:1024px) { .stock-notice { font-size:14px; font-weight:700; line-height:135%; margin:40px 0 4px } .stock-notice .pc { display:block } .stock-notice .sp { display:none } } .stock-list-notice { font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; font-size:12px; line-height:135%; margin:20px 28px 0 } @media screen and (min-width:1024px) { .stock-list-notice { margin:20px 0 0 } } .stock-border { background-color:#f2f2f2; border:0; height:1px; margin:0 28px } @media screen and (min-width:1024px) { .stock-border { margin:0 } } .item-card { cursor:pointer } .item-card__main { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between; margin-bottom:16px; width:100% } .item-card__main, .item-card__maker { display:-webkit-box; display:-ms-flexbox; display:flex } .item-card__maker { -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; font-size:1.2rem; line-height:1.5 } .item-card__maker svg { -ms-flex-negative:0; flex-shrink:0; height:1.6rem; margin-right:4px; width:auto } .item-card__body>*+* { margin-top:8px } .item-card__name { font-size:1.6rem; line-height:130% } @media screen and (min-width:768px) { .item-card__name { font-size:1.4rem } } .item-card__sub { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:end; -ms-flex-align:end; align-items:flex-end; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between } .item-card__notice { -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#666; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; font-size:1.2rem; word-break:keep-all } .item-card__notice svg { height:1.3rem; margin-left:4px; width:auto } .item-card__image { -ms-flex-negative:0; border-radius:2px; flex-shrink:0; height:80px; margin-left:16px; overflow:hidden; width:80px } .item-card__image img { height:100%; -o-object-fit:cover; object-fit:cover; width:100% } @media screen and (min-width:1024px) { .item-card__image { height:60px; width:60px } } .item-card__amount :first-child { margin-top:0 } .item-card__amount>*+* { margin-top:8px } .add-cart { display:block } .add-cart__notice { background:#e5e5e5; padding:20px } .add-cart__notice>*+* { margin-top:6px } .add-cart__notice--close { cursor:pointer; font-size:1.2rem; text-decoration:underline } .add-cart__notice--close:hover { text-decoration:none } .add-cart__body { padding:28px } .add-cart__item--header { -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; display:-webkit-box; display:-ms-flexbox; display:flex } .add-cart__item--header--body { margin-right:20px } .add-cart__item--header--body>*+* { margin-top:8px } @media screen and (min-width:768px) { .add-cart__item--header--body>*+* { margin-top:16px } } .add-cart__item-image { -ms-flex-negative:0; border-radius:2px; flex-shrink:0; height:72px; margin-left:auto; overflow:hidden; width:72px } .add-cart__item-image img { height:100%; -o-object-fit:cover; object-fit:cover; width:100% } .add-cart__item-name-container a { color:#666 } .add-cart__item-name-container a:hover { text-decoration:none } .add-cart__item-category { font-size:1.4rem; line-height:1.5 } .add-cart__item-name { font-size:2rem; line-height:1.35; margin-top:4px } @media screen and (min-width:768px) { .add-cart__item-name { margin-top:6px } } .add-cart__item-maker { display:-webkit-box; display:-ms-flexbox; display:flex; font-size:1.4rem; line-height:1.5 } .add-cart__item-maker svg { height:2rem; margin-right:4px } .add-cart__item-delivery { font-size:1.4rem; line-height:150%; margin-top:20px } @media screen and (min-width:768px) { .add-cart__item-delivery { margin-top:54px } } .add-cart__item-item-id { font-size:1.4rem; line-height:1.5; margin-top:10px } @media screen and (min-width:768px) { .add-cart__item-item-id { margin-top:16px } } .add-cart__item-price-amount { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; margin-top:10px } @media screen and (min-width:768px) { .add-cart__item-price-amount { margin-top:16px } } .add-cart__item-price-amount>*+* { margin-left:8px } .add-cart__item-price { font-size:3.2rem } .add-cart__item-amount { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; -webkit-box-orient:vertical; -webkit-box-direction:normal; align-items:center; background:#e5e5e5; border-radius:2px; -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; -ms-flex-direction:column; flex-direction:column; height:40px; justify-content:center; line-height:1; min-width:40px; padding:0 8px } .add-cart__item-amount-number { font-size:1.4rem } .add-cart__item-amount-unit { color:#a6a6a6; font-size:1rem; margin-top:2px } @media screen and (min-width:768px) { .add-cart__item-column { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } .add-cart__item-column .add-cart__item-image { -webkit-box-ordinal-group:1; -ms-flex-order:0; margin-left:0; order:0 } .add-cart__item-column .add-cart__item--header--body { -webkit-box-ordinal-group:2; -ms-flex-order:1; margin-top:22px; order:1 } .add-cart__item-column .add-cart__item--header--body>*+* { margin-top:22px } } .add-cart-delete { font-size:1.4rem; text-align:center } .add-cart-delete>* { color:#666; cursor:pointer; text-decoration:underline } .add-cart-delete>:hover { text-decoration:none } .add-cart__count-control { margin-top:32px } @media screen and (min-width:768px) { .add-cart__count-control { margin-top:54px } } .add-cart__count-control>*+* { margin-top:24px } .add-cart__count-control--block>*+* { margin-top:16px } .add-cart-alert { color:#f22c5a; font-size:1.4rem; margin-top:16px; text-align:center } .short-border { background:#1a1a1a; border:0; display:inline-block; height:2px; width:28px } .input-count { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:center } .input-count>*+* { margin-left:12px } .input-count input { -webkit-appearance:textfield; -moz-appearance:textfield; appearance:textfield; border:1px solid #ebebeb; border-radius:2px; -webkit-box-sizing:border-box; box-sizing:border-box; font-size:3.2rem; height:60px; line-height:1; text-align:center; width:120px } .input-count input[type=number]::-webkit-inner-spin-button, .input-count input[type=number]::-webkit-outer-spin-button { -webkit-appearance:none; margin:0 } .flatpickr-calendar { -webkit-box-shadow:none; box-shadow:none; margin-bottom:30px } .flatpickr-calendar.inline, .flatpickr-calendar.open, .flatpickr-rContainer { width:100% } .flatpickr-months { -webkit-box-align:center; -ms-flex-align:center; align-items:center; border-top:1px solid #f2f2f2; height:72px; position:relative } @media screen and (min-width:768px) { .flatpickr-months { height:76px } } .flatpickr-months .flatpickr-month { -ms-flex-pack:center; -ms-flex-item-align:center; -ms-grid-row-align:center; align-self:center; overflow:visible } .flatpickr-current-month, .flatpickr-months .flatpickr-month { -webkit-box-pack:center; display:-webkit-box; display:-ms-flexbox; display:flex; height:auto; justify-content:center } .flatpickr-current-month { -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; margin:0; padding:0; position:static; width:auto } .flatpickr-current-month .flatpickr-monthDropdown-months
{ -webkit-box-ordinal-group:3; -ms-flex-order:2; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:auto; font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; font-size:1.6rem; font-weight:700; margin-top:1px; order:2; pointer-events:none } .flatpickr-current-month .flatpickr-monthDropdown-months:hover { background:none } .flatpickr-current-month .numInputWrapper { -webkit-box-ordinal-group:2; -ms-flex-order:1; font-family:Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,游ゴシック体,YuGothic,游ゴシック Medium,Yu Gothic Medium,游ゴシック,Yu Gothic,Meiryo,メイリオ,sans-serif; order:1; padding:0; position:relative; width:70px } .flatpickr-current-month .numInputWrapper:after { content:"年"; font-size:1.6rem; font-weight:700; position:absolute; right:0; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%) } .flatpickr-current-month input.cur-year { font-size:1.6rem; font-weight:700; padding:0 } .flatpickr-current-month .numInputWrapper:hover { background:none } .flatpickr-current-month input.cur-year[disabled], .flatpickr-current-month input.cur-year[disabled]:hover { color:#1a1a1a } .numInputWrapper span.arrowDown, .numInputWrapper span.arrowUp { display:none } .flatpickr-months .flatpickr-next-month.flatpickr-next-month, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month, .flatpickr-months .flatpickr-prev-month.flatpickr-next-month, .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month { -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-box-sizing:border-box; box-sizing:border-box; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; margin:0; position:static } .flatpickr-months .flatpickr-next-month.flatpickr-next-month svg, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month svg, .flatpickr-months .flatpickr-prev-month.flatpickr-next-month svg, .flatpickr-months .flatpickr-prev-month.flatpickr-prev-month svg { display:block } .flatpickr-innerContainer { border-top:1px solid #f2f2f2; padding-top:28px } @media screen and (min-width:768px) { .flatpickr-innerContainer { padding-top:30px } } .flatpickr-rContainer { padding:0 28px } @media screen and (min-width:768px) { .flatpickr-rContainer { margin:0 auto; max-width:510px; min-width:510px; padding:0; width:510px } } .dayContainer, .flatpickr-days { max-width:100%; min-width:100%; width:100% } .flatpickr-weekdays .flatpickr-weekdaycontainer { -webkit-column-gap:calc(16.66667% - 35px); -moz-column-gap:calc(16.66667% - 35px); column-gap:calc(16.66667% - 35px) } .flatpickr-days { font-size:1.4rem } span.flatpickr-weekday { color:#1a1a1a; font-size:1.4rem; width:30px } .dayContainer { -webkit-column-gap:calc(16.66667% - 35px); -moz-column-gap:calc(16.66667% - 35px); column-gap:calc(16.66667% - 35px); margin:10px auto 0; row-gap:10px } .flatpickr-day, .flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover, .flatpickr-day.nextMonthDay, .flatpickr-day.notAllowed, .flatpickr-day.notAllowed.nextMonthDay, .flatpickr-day.notAllowed.prevMonthDay, .flatpickr-day.prevMonthDay { font-size:1.4rem; height:30px; line-height:30px; max-height:30px; max-width:30px; width:30px } .flatpickr-day.nextMonthDay { color:rgba(26,26,26,.3) } .flatpickr-day.flatpickr-disabled { color:rgba(26,26,26,.1) } .flatpickr-day.endRange, .flatpickr-day.endRange.inRange, .flatpickr-day.endRange.nextMonthDay, .flatpickr-day.endRange.prevMonthDay, .flatpickr-day.endRange:focus, .flatpickr-day.endRange:hover, .flatpickr-day.selected, .flatpickr-day.selected.inRange, .flatpickr-day.selected.nextMonthDay, .flatpickr-day.selected.prevMonthDay, .flatpickr-day.selected:focus, .flatpickr-day.selected:hover, .flatpickr-day.startRange, .flatpickr-day.startRange.inRange, .flatpickr-day.startRange.nextMonthDay, .flatpickr-day.startRange.prevMonthDay, .flatpickr-day.startRange:focus, .flatpickr-day.startRange:hover { background:#1a1a1a; border:none; font-size:1.4rem } .flatpickr-day.selected { font-weight:700 } .flatpickr-day.today { border:none } .flatpickr-months .flatpickr-next-month, .flatpickr-months .flatpickr-prev-month { padding:0 28px; z-index:1 } @media screen and (min-width:768px) { .flatpickr-months .flatpickr-next-month, .flatpickr-months .flatpickr-prev-month { padding:0 30px } } .flatpickr-months .flatpickr-next-month:hover svg, .flatpickr-months .flatpickr-next-month svg, .flatpickr-months .flatpickr-prev-month:hover svg, .flatpickr-months .flatpickr-prev-month svg { fill:#1a1a1a } .flatpickr-months .flatpickr-next-month.flatpickr-disabled, .flatpickr-months .flatpickr-prev-month.flatpickr-disabled { cursor:auto } .flatpickr-months .flatpickr-next-month.flatpickr-disabled svg, .flatpickr-months .flatpickr-prev-month.flatpickr-disabled svg { fill:rgba(26,26,26,.3) } .flatpickr-calendar:after, .flatpickr-calendar:before { display:none } .calendar__error { color:#f22c5a; display:none; padding:32px; text-align:center } .calendar__error.show { display:block } .tab { -webkit-box-pack:center; -ms-flex-pack:center; display:-webkit-box; display:-ms-flexbox; display:flex; gap:30px; justify-content:center } @media screen and (max-width:767px) { .tab { padding:32px 0 0 } } .tab__item { padding:0 6px } @media screen and (min-width:768px) { .tab__item { padding:0 28px } } .rules { background:#fff; font-size:1.2rem; margin-top:30px; padding:28px } @media screen and (min-width:768px) { .rules { border:2px solid #f2f2f2; margin-top:40px; padding:30px } } .rules__details { overflow:hidden; position:relative; text-align:left } .rules__deco:after { background:-webkit-gradient(linear,left top,left bottom,from(hsla(0,0%,100%,0)),to(#fff)); background:linear-gradient(180deg,hsla(0,0%,100%,0),#fff); content:""; display:block; height:100%; left:0; position:absolute; top:0; width:100% } .rules__section { margin-top:18px } .rules__more { color:#999; cursor:pointer; margin-top:20px; text-decoration:underline } .rules__more:hover { text-decoration:none } .service { margin-top:-40px; position:relative } @media screen and (min-width:768px) { .service { -webkit-box-align:start; -ms-flex-align:start; -webkit-box-pack:center; -ms-flex-pack:center; align-items:flex-start; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:center; width:100% } .service__video { height:100%; left:0; -o-object-fit:contain; object-fit:contain; -o-object-position:center; object-position:center; opacity:0; position:absolute; top:0; -webkit-transition:opacity .2s ease; transition:opacity .2s ease; width:100% } .service__video.active { opacity:1; -webkit-transition:opacity 0s ease; transition:opacity 0s ease; -webkit-transition-delay:.2s; transition-delay:.2s } .service__video.video-intro { height:auto; -o-object-fit:contain; object-fit:contain; -o-object-fit:left top; object-fit:left top; width:957px } .service__video_container { -ms-flex-preferred-size:957px; -ms-flex-negative:1; flex-basis:957px; flex-shrink:1; height:100vh; overflow:hidden; position:sticky; right:0; top:0 } .service__intro-logo { height:auto; max-width:500px; width:100% } .service__body { -ms-flex-preferred-size:630px; -ms-flex-negative:1; flex-basis:630px; flex-shrink:1; max-width:560px; min-width:380px; padding:0 60px } .service__body-block { margin-top:180px; min-height:80vh } .service__body-block-title { font-size:42px; font-weight:700; line-height:56px } .service__body-block-title span { display:block } .service__body-block-lead { font-size:22px; font-weight:700; letter-spacing:.03em; line-height:200%; margin-top:20px } .service__body-block-lead span { display:block } .service__body-block-description { font-size:12px; font-weight:700; letter-spacing:.03em; line-height:180%; margin-top:64px; max-width:282px } .service__body-block-description p+p { margin-top:10px } .service__body-video { display:none } } @media screen and (max-width:1023px) { .service { margin-top:0 } .service .service__video.video-intro { height:100% } } @media screen and (min-height:1200px) { .service .service__video.video-intro { height:100% } } @media screen and (max-width:767px) { .service__video_container { display:none } .service__body { position:relative } .service__body>*+* { margin-top:130px } .service__body-block.service__intro { padding-top:0 } .service__body-block-title { font-size:36px; font-weight:700; line-height:135%; padding-left:28px; padding-right:28px } .service__body-block-title span { display:block } .service__body-block-lead { font-size:18px; font-weight:700; letter-spacing:.03em; line-height:180%; margin-top:24px; padding-left:28px; padding-right:28px } .service__body-block-lead span { display:block } .service__body-block-description { font-size:14px; font-weight:700; letter-spacing:.03em; line-height:150%; padding-left:80px; padding-right:28px } .service__body-block-description p { display:block; margin-top:10px } .service__body-video { margin-bottom:40px; margin-top:40px } .service__intro { position:relative } .service__intro-logo { height:auto; max-width:100% } .service__intro-body { background:#fff; max-width:calc(100% - 80px); padding:40px 20px 40px 28px; position:absolute; top:50%; -webkit-transform:translateY(-50%); transform:translateY(-50%) } .service__body-video { height:auto; width:100% } .service__body-video.video-intro { height:calc(100vh - 172px); margin:0; -o-object-fit:cover; object-fit:cover } } .service-intro__header-h1 { margin-top:60px } .service-intro__header-h1 span { display:block } .service-intro__header-lead { font-size:16px; font-weight:700; line-height:180% } @media screen and (min-width:768px) { .service-intro__header-lead { margin-top:40px } } @media screen and (max-width:767px) { .service-intro__header-h1 span { display:block } .service-intro__header-lead { margin-top:24px } .service-intro__header-lead span { display:block } .service-intro__header-lead br { display:none } } .closing { margin-top:130px } .closing__header-title { font-size:40px } .closing__header-lead, .closing__header-title { font-weight:700; line-height:135%; text-align:center } .closing__header-lead { font-size:16px; margin-top:16px } .closing__image { margin-top:50px } .closing__image img { height:auto; width:100% } .closing__body { margin-top:50px } .closing__body>*+* { margin-top:32px } .closing__body-spec { font-size:16px; line-height:135%; text-align:center } .closing__body-spec>*+* { margin-top:8px } .closing__body-rest { font-size:16px; line-height:135%; text-align:center } @media screen and (min-width:768px) { .closing__body-rest { font-size:12px } } .closing__body-rest-text { background:#f2f2f2; display:inline-block; padding:20px } .closing__body-note { font-size:12px; line-height:135% } @media screen and (min-width:768px) { .closing { padding:28px } .closing__body, .closing__image { margin-left:auto; margin-right:auto; max-width:440px } .closing__body>*+* { margin-top:20px } } @media screen and (max-width:767px) { .closing { padding:28px } .closing__header-title span { display:block; text-align:center } } .related-content { background:#f2f2f2; margin-left:auto; margin-right:auto; margin-top:130px; max-width:780px; overflow:hidden } .related-content .button { margin-top:40px } .related-content__header { position:relative } .related-content__header-lead { font-size:14px; font-weight:700; line-height:135%; position:relative } .related-content__header-title { font-size:28px; font-weight:700; line-height:135% } .related-content__header-title span { display:block } .related-content__header-image { position:absolute } .related-content__header-image img { height:auto; width:100% } .related-content__header-body>*+* { margin-top:8px } @media screen and (min-width:768px) { .related-content { padding:38px } .related-content__body { margin:0 auto; max-width:440px } .related-content__header-image { height:116px; right:16px; top:0; width:163px } } @media screen and (max-width:767px) { .related-content { padding:36px 28px } .related-content__header-image { height:98px; right:-28px; top:-18px; width:138px } } .service-container { padding-bottom:130px } .product__status { background:hsla(0,0%,95%,.95); padding:20px } .product__status-update { font-size:1.6rem } @media screen and (min-width:768px) { .product__status-update { font-size:1.4rem } } .product__status-text { font-size:1.4rem } @media screen and (min-width:768px) { .product__status-text { font-size:1.4rem; line-height:150% } } .product__status-text>* { margin-top:6px } @media screen and (min-width:768px) { .product__status-text>* { margin-top:8px } } .clipboard-copy { position:relative } .clipboard-copy__item { display:none; left:50%; opacity:0; position:absolute; top:-41px; -webkit-transform:translate(-50%,20px); transform:translate(-50%,20px); -webkit-transition:opacity .5s ease,-webkit-transform .5s ease; transition:opacity .5s ease,-webkit-transform .5s ease; transition:opacity .5s ease,transform .5s ease; transition:opacity .5s ease,transform .5s ease,-webkit-transform .5s ease; z-index:1 } @media screen and (min-width:768px) { .clipboard-copy__item { top:111px; -webkit-transform:translate(-50%,-40px); transform:translate(-50%,-40px) } } .clipboard-copy__item--right { display:none; opacity:0; position:absolute; right:0; top:24px; -webkit-transform:translateY(20px); transform:translateY(20px); -webkit-transition:opacity .5s ease,-webkit-transform .5s ease; transition:opacity .5s ease,-webkit-transform .5s ease; transition:opacity .5s ease,transform .5s ease; transition:opacity .5s ease,transform .5s ease,-webkit-transform .5s ease; z-index:1 } @media screen and (min-width:768px) { .clipboard-copy__item--right { top:85px; -webkit-transform:translateY(-40px); transform:translateY(-40px) } } .clipboard-copy__text { background:#1a1a1a; border-radius:4px; color:#fff; display:inline-block; min-width:248px; padding:13px 20px; text-align:center } .clipboard-copy__text:after { border-left:11px solid transparent; border-right:11px solid transparent; border-top:14px solid #1a1a1a; bottom:-10px; content:""; display:block; left:50%; position:absolute; -webkit-transform:translateX(-50%) rotate(0deg); transform:translateX(-50%) rotate(0deg) } @media screen and (min-width:768px) { .clipboard-copy__text:after { bottom:auto; left:50%; top:-10px; -webkit-transform:translateX(-50%) rotate(-180deg); transform:translateX(-50%) rotate(-180deg) } } .clipboard-copy__text--right:after { bottom:auto; left:auto; right:-11px; top:-11px; -webkit-transform:translateX(-50%) rotate(-180deg); transform:translateX(-50%) rotate(-180deg) } @media screen and (min-width:768px) { .clipboard-copy__text--right:after { bottom:auto; right:-11px } } .card__list { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; gap:10px } .card__list-item { display:inherit } .member { text-align:center } @media screen and (min-width:768px) { .member { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } } .member__wrap { width:100% } @media screen and (max-width:767px) { .member__details { margin-top:56px; padding:0 50px } } .member__details-signal { height:78px; width:78px } @media screen and (min-width:768px) { .member__details-signal { height:60px; width:60px } } .member__details-remarks { font-size:.9rem } @media screen and (min-width:768px) { .member__details-remarks { font-size:1.1rem } } .member__details-shop { margin-top:48px } @media screen and (min-width:768px) { .member__details-shop { margin-top:40px } } .member__details-shop>*+* { margin-top:12px } .member__details-shop-name>*+* { margin-top:4px } .member__details-shop-name-text { font-size:2.4rem; line-height:135% } @media screen and (min-width:768px) { .member__details-shop-name-text { font-size:2.8rem } } .member__details-shop-name-owner { font-size:1.6rem } @media screen and (min-width:768px) { .member__details-shop-name-owner { font-size:2rem } } .member__details-payment { font-size:1.2rem; margin-top:56px } @media screen and (min-width:768px) { .member__details-payment { font-size:1.4rem } } .member__details-payment>*+* { margin-top:8px } .line { border:none; height:0; margin:0; padding:0 } .border-line__size--md { border-top:2px solid } .border-line__color--gray95 { border-color:#f2f2f2 } .border-line__break { margin:0 -28px } @media screen and (min-width:768px) { .border-line__break { margin:0 } } .settlement-information { background:#4d4d4d; color:#fff; padding:20px } .information-head { background:#ccc; padding:20px } .another-page>*+* { margin-top:40px } .top__head { -webkit-box-orient:vertical; -webkit-box-direction:reverse; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column-reverse; flex-direction:column-reverse; -ms-flex-wrap:wrap; flex-wrap:wrap } @media screen and (min-width:768px) { .top__head { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column } } .top__head-title { -ms-grid-columns:29px 1fr; display:-ms-grid; display:grid; grid-template-columns:29px 1fr } .top__head-title .icon { display:inline-block; height:20px; position:relative; top:-1px; vertical-align:text-bottom; width:20px } @media screen and (min-width:768px) { .top__head-title .icon { vertical-align:top } } @media screen and (max-width:767px) { .top__head>*+* { margin-bottom:20px } } @media screen and (min-width:768px) { .top__head .contents__head { margin-top:30px } } .top__main-contents { margin-top:76px } @media screen and (min-width:768px) { .top__main-contents { margin-top:60px } } .top__main-contents-point { background:#1a1a1a; border-radius:2px; color:#fff; display:inline-block; padding:12px 20px } .top__main-contents-title { padding-top:12px } @media screen and (min-width:768px) { .top__main-contents-title { padding-top:20px } } .top__main-contents-body { margin-top:24px } @media screen and (min-width:768px) { .top__main-contents-body { margin-top:8px } } .top__main-contents+.top__main-contents { margin-top:80px } .top__product { margin-top:32px } .top__product .article-link { color:currentColor; display:block; text-decoration:none; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } .top__product .article-link:hover { opacity:.5 } @media screen and (max-width:767px) { .top__product .article-link { -ms-grid-columns:112px 16px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:16px; grid-template-columns:112px 1fr; grid-template-rows:auto } .top__product .article-link>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .top__product .article-link>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } @media screen and (min-width:768px) { .top__product-horizontal { -ms-grid-columns:1fr 40px 1fr; -ms-grid-rows:auto; display:-ms-grid; display:grid; gap:40px; grid-template-columns:1fr 1fr; grid-template-rows:auto } .top__product-horizontal>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .top__product-horizontal>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } @media screen and (max-width:767px) { .top__product-article .product__head { margin-top:0 } } .top__product-article-horizontal { -ms-grid-columns:112px 16px 1fr; -ms-grid-rows:auto; -webkit-box-align:start; -ms-flex-align:start; align-items:flex-start; display:-ms-grid!important; display:grid!important; gap:16px; grid-template-columns:112px 1fr; grid-template-rows:auto } .top__product-article-horizontal>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .top__product-article-horizontal>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } @media screen and (min-width:768px) { .top__product-article-horizontal { -ms-grid-columns:400px 32px 1fr; gap:32px; grid-template-columns:400px 1fr } .top__product-article-horizontal .top__product-detail { width:100% } } .top__product-article-horizontal .product__head, .top__product-article-horizontal .product__maker { margin-top:0 } @media screen and (min-width:768px) { .top__product-detail { width:80% } } .top__product-detail>*+* { margin-top:8px } @media screen and (min-width:768px) { .top__product-detail>*+* { margin-top:24px } } .top__product-thumbnail img { border-radius:4px } @media screen and (max-width:767px) { .top__product-list { display:-webkit-box; display:-ms-flexbox; display:flex; gap:20px; margin:36px -28px 0 } } @media screen and (min-width:768px) { .top__product-list { margin:0 } } .top__product-list>* { -webkit-box-flex:0; -webkit-box-sizing:content-box; box-sizing:content-box; -ms-flex:0 0 200px; flex:0 0 200px } @media screen and (max-width:767px) { .top__product-list>:first-child { padding-left:28px } .top__product-list>:last-child { padding-right:28px } } @media screen and (min-width:768px) { .top__product-list>*+* { margin-top:24px } } .top__product-list-more { -webkit-box-pack:center; -ms-flex-pack:center; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; height:100%; justify-content:center; text-align:center } @media screen and (max-width:767px) { .top__product-list-horizontal { display:-webkit-box; display:-ms-flexbox; display:flex; gap:20px; margin:36px -28px 0 } } @media screen and (min-width:768px) { .top__product-list-horizontal { -ms-grid-columns:1fr 32px 1fr; -ms-grid-rows:auto; -webkit-column-gap:32px; -moz-column-gap:32px; column-gap:32px; display:-ms-grid; display:grid; grid-template-columns:repeat(2,1fr); grid-template-rows:auto; row-gap:24px } .top__product-list-horizontal>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .top__product-list-horizontal>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } .top__product-list-horizontal>* { -webkit-box-flex:0; -webkit-box-sizing:content-box; box-sizing:content-box; -ms-flex:0 0 200px; flex:0 0 200px } @media screen and (max-width:767px) { .top__product-list-horizontal>:first-child { padding-left:28px } .top__product-list-horizontal>:last-child { padding-right:28px } } .product__introduction { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; -ms-flex-wrap:nowrap; flex-wrap:nowrap } @media screen and (min-width:768px) { .product__introduction { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-box-pack:center; -ms-flex-pack:center; -ms-flex-direction:row; flex-direction:row; gap:60px; justify-content:center; margin-top:60px } } @media screen and (min-width:1024px) { .product__introduction { margin-left:0; margin-right:0; margin-top:80px } } @media screen and (min-width:768px) { .product__introduction-views { -ms-flex-preferred-size:500px; flex-basis:500px; max-width:500px; overflow:hidden } .product__introduction-detail { -ms-flex-preferred-size:440px; flex-basis:440px; min-width:340px; width:calc(100% - 560px) } } .product__introduction-detail>*+* { margin-top:40px } .product__introduction-detail .list__note { margin-top:33px } .product__introduction-status { margin-left:-28px; margin-right:-28px } @media screen and (min-width:768px) { .product__introduction-status { margin-left:0; margin-right:0 } } .product__introduction .product__item-list { margin-top:8px } @media screen and (min-width:1024px) { .product__introduction .product__item-list { margin-top:12px } } .product__introduction-head { margin-top:28px } .product__introduction-head>*+* { margin-top:4px } @media screen and (min-width:768px) { .product__introduction-head>*+* { margin-top:8px } } .product__introduction-head .breadcrumb { color:#666; margin-top:0 } .product__introduction-head .breadcrumb-item a { color:#666 } .product__introduction-listadd { margin-top:40px } .product__introduction-foot { margin:24px auto 0; text-align:center } @media screen and (min-width:768px) { .product__introduction-foot { margin:40px auto 0; width:91% } } .product__introduction-copy-button { margin-top:24px } @media screen and (min-width:768px) { .product__introduction-copy-button { margin-top:20px; width:100% } } .product__id { margin-top:20px } .product__price { margin-top:8px } @media screen and (min-width:768px) { .product__price { margin-top:12px } } .product__select { display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; gap:6px; margin-top:20px } .product__select li { -ms-flex-preferred-size:62px; flex-basis:62px; height:62px } .product__select li span { display:block } .product__select li .button__size--fit { height:100% } .product__detail { margin-top:120px } .product__detail-thumbnail { position:relative } @media screen and (max-width:767px) { .product__detail-thumbnail { margin:0 -28px } } @media screen and (min-width:768px) { .product__detail-thumbnail { margin:0 } } @media screen and (min-width:1024px) { .product__detail-thumbnail>.swiper { overflow:hidden; width:100% } } .product__detail-thumbnail-view { background:#f2f2f2 } @media screen and (min-width:768px) { .product__detail-thumbnail-view { border-radius:4px } } .product__detail-thumbnail-view>.swiper-wrapper>.swiper-slide { -webkit-box-pack:center; -ms-flex-pack:center; -ms-flex-item-align:center; -ms-grid-row-align:center; align-self:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:center } .product__detail-thumbnail-view .thumbnail__square img { min-height:100%; min-width:100% } .product__detail-thumbnail .swiper-pagination-bullet { background:#1a1a1a; opacity:.3 } .product__detail-thumbnail .swiper-pagination-bullet-active { background:#1a1a1a; opacity:1 } .product__detail-thumbnail .swiper-container { width:100% } .product__detail-thumbnail .swiper-slide-thumb-active { position:relative } .product__detail-thumbnail .swiper-slide-thumb-active:after { border-radius:4px; -webkit-box-shadow:inset 0 0 0 3px #e5e5e5; box-shadow:inset 0 0 0 3px #e5e5e5; content:""; height:100%; left:0; position:absolute; top:0; width:100% } .product__detail-thumbnail-list { overflow:visible; padding-top:4px } .product__detail-thumbnail-list .swiper-wrapper { -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-transform:none!important; transform:none!important } .product__detail-thumbnail-list .swiper-slide { margin-top:16px } @media screen and (min-width:768px) { .product__detail-thumbnail-list .swiper-slide { width:calc(25% - 12px)!important } } @media screen and (min-width:1024px) { .product__detail-thumbnail-list .swiper-slide { width:calc(20% - 12.8px)!important } } @media screen and (min-width:1279px) { .product__detail-thumbnail-list .swiper-slide { width:calc(16.66667% - 13.33333px)!important } } @media screen and (min-width:768px) { .product__detail-thumbnail-list .swiper-slide:not(:nth-child(4n+1)) { margin-left:16px } } @media screen and (min-width:1024px) { .product__detail-thumbnail-list .swiper-slide:not(:nth-child(4n+1)) { margin-left:0 } .product__detail-thumbnail-list .swiper-slide:not(:nth-child(5n+1)) { margin-left:16px } } @media screen and (min-width:1279px) { .product__detail-thumbnail-list .swiper-slide:not(:nth-child(5n+1)) { margin-left:0 } .product__detail-thumbnail-list .swiper-slide:not(:nth-child(6n+1)) { margin-left:16px } } .product__detail-thumbnail-list .thumbnail__square { border-radius:4px; cursor:pointer } @media screen and (min-width:768px) { .product__detail-thumbnail-list .thumbnail__square:hover { opacity:.4; -webkit-transition:opacity .2s ease; transition:opacity .2s ease } } .product__detail+.product__detail { margin-top:60px } .product__detail-items, .product__detail-items>*+* { margin-top:20px } @media screen and (min-width:1024px) { .product__detail-items>*+* { margin-top:40px } } .product__detail-items-thumbnail img { border-radius:4px; -o-object-fit:cover; object-fit:cover } @media screen and (min-width:768px) { .product__detail-items-thumbnail img { height:100%; width:100% } } .product__detail-text>*+* { margin-top:8px } .product__detail-text .product__head { margin-top:0 } .delivery_note a { color:currentColor } .delivery_note a:hover { text-decoration:none } @media screen and (max-width:767px) { .mypage { padding:32px 0 30px } } @media screen and (min-width:768px) { .mypage { padding-top:80px } } @media screen and (max-width:767px) { .mypage__h2 { padding:0 28px; text-align:center } .mypage__h2+.form__text--error { margin-top:30px!important } } @media screen and (min-width:768px) { .mypage__h2+.form__text--error { margin-top:40px!important } } @media screen and (max-width:767px) { .mypage .typo__summery+.form__text--error { margin-top:30px!important } } @media screen and (min-width:768px) { .mypage .typo__summery+.form__text--error { margin-top:40px!important } } @media screen and (max-width:767px) { .mypage__contents { margin-top:30px } } @media screen and (min-width:768px) { .mypage__contents { margin-top:40px } } .mypage__form__label:first-line { font-weight:700 } @media screen and (max-width:767px) { .mypage__form__label+.mypage__form__horizontal { margin-top:28px } } @media screen and (min-width:768px) { .mypage__form__label+.mypage__form__horizontal { margin-top:30px } } .mypage__form__horizontal { -webkit-box-pack:justify; -ms-flex-pack:justify; justify-content:space-between } .mypage__form__edit-delete, .mypage__form__horizontal { -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex } .mypage__form__edit-delete { -webkit-box-pack:end; -ms-flex-pack:end; -webkit-box-flex:1; -ms-flex:1; flex:1; justify-content:flex-end; width:100% } .mypage__form__edit-delete__li:last-child { margin-left:20px } .mypage__form__edit-delete__li a { -webkit-box-align:center; -ms-flex-align:center; align-items:center; color:#999; display:-webkit-box; display:-ms-flexbox; display:flex } .mypage__form__edit-delete__li a:hover { text-decoration:none } .mypage__form__edit-delete__li a .icon { height:16px; margin-right:3px; vertical-align:text-bottom; width:16px } .mypage__form__edit-delete__li a p { font-size:1.4rem } @media screen and (max-width:767px) { .mypage__form__fieldset:not(:first-child) { margin-top:28px } } @media screen and (min-width:768px) { .mypage__form__fieldset:not(:first-child) { margin-top:30px } } .mypage__form__fieldset .form__text--error { margin-top:10px } .mypage__form__fieldset .checkbox:first-of-type, .mypage__form__fieldset .radio:first-of-type { margin-top:30px } .mypage__form__fieldset .checkbox:not(:first-of-type), .mypage__form__fieldset .radio:not(:first-of-type) { margin-top:20px } .mypage__form__checkbox { margin-top:30px } @media screen and (max-width:767px) { .mypage .form__operation { margin-top:30px } .mypage .form__operation-head, .mypage .form__operation-head h2.mypage__h2, .mypage .procedure__head, .mypage .procedure__head h2.mypage__h2 { padding:0 } .mypage .form__operation-head h3.mypage__h3, .mypage .procedure__head h3.mypage__h3 { margin-top:30px } } @media screen and (min-width:768px) { .mypage .form__operation-head h3.mypage__h3, .mypage .procedure__head h3.mypage__h3 { margin-top:40px } } .mypage .form__operation-head>p, .mypage .procedure__head>p { margin-top:10px } .mypage .form__operation-head .tag__status, .mypage .procedure__head .tag__status { margin-top:0 } @media screen and (max-width:767px) { .mypage .procedure__data-item+.procedure__data-item { margin-top:10px } } .mypage>*+.procedure { margin-top:50px } @media screen and (min-width:768px) { .mypage>*+.procedure { margin-top:80px } } .mypage .pagination { margin-top:30px; position:relative } @media screen and (min-width:768px) { .mypage .pagination { margin-top:40px } } .mypage .pagination__prev { left:0; position:absolute } .mypage .pagination__next { position:absolute; right:0 } @media screen and (max-width:767px) { .payment__form__edit-delete { margin-top:28px } } @media screen and (min-width:768px) { .payment__form__edit-delete { margin-top:30px } } .mypage__top { padding-bottom:30px } @media screen and (max-width:767px) { .mypage__information { background:#fff; border-top:2px solid #f2f2f2 } } @media screen and (min-width:768px) { .mypage__information { -ms-grid-columns:1fr 93px 1fr; -webkit-column-gap:93px; -moz-column-gap:93px; column-gap:93px; display:-ms-grid; display:grid; grid-template-columns:repeat(2,1fr) } } .mypage__nav { border-top:2px solid #f2f2f2 } .mypage__nav-item { border-bottom:2px solid #f2f2f2 } .mypage__nav-item a { padding:28px } @media screen and (min-width:768px) { .mypage__nav-item a { padding:30px 20px } } .mypage__nav-detail { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; gap:20px; justify-content:space-between; padding-right:15px; width:100% } @media screen and (min-width:768px) { .mypage__nav-detail { padding-right:22px
} } .mypage__nav-detail-text { -webkit-box-flex:1; -ms-flex:1; flex:1 } .mypage__nav-detail-state { max-width:50% } @media screen and (max-width:767px) { .mypage__registration { margin-top:80px } } .mypage__guest { background:#b2b2b2; font-size:1.1rem; line-height:100%; padding:10px } @media screen and (min-width:768px) { .mypage__guest { background:#ccc; display:inline-block; font-size:1.2rem; margin-top:56px; padding:10px 16px } } .mypage__logout { margin-top:40px } @media screen and (min-width:768px) { .mypage__logout { margin-top:90px } } .mypage__withdrawal { margin-top:32px } @media screen and (min-width:768px) { .mypage__withdrawal { margin-top:40px } } .mypage__note { color:#999; margin-top:10px } .mypage__history-list .link__text--no-deco { display:block } .mypage__history-status { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; justify-content:space-between } .mypage__history-text { margin-top:20px } .mypage__history-text>*+* { margin-top:10px } .mypage__history-detail>*+* { margin-top:20px } .mypage__history-detail .tag__status { min-width:70px } @media screen and (max-width:767px) { .mypage__payment-info { margin-top:30px!important } } @media screen and (min-width:768px) { .mypage__payment-info { margin-top:40px } } .mypage__payment-info__h4-p { margin-top:20px; width:100% } .mypage__payment-info-error { border-top:1px solid #f2f2f2 } .mypage__payment-info-error .form__text--error { padding:28px 28px 0 } .mypage__payment-info-error a { padding:20px 28px 28px } .mypage__payment-info-details { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; align-items:center; display:-webkit-box; display:-ms-flexbox; display:flex; gap:20px; justify-content:space-between; padding-right:23px; width:100% } @media screen and (min-width:768px) { .mypage__payment-info-details { padding-right:15px } } .mypage__payment-info-details>*+* { width:calc(50% - 10px) } .mypage__payment-info-details-text { -webkit-box-flex:1; -ms-flex:1; flex:1 } .mypage__payment-info-details-text>*+* { margin-top:8px } @media screen and (min-width:768px) { .mypage__payment-info-details-text>*+* { margin-top:12px } } @media screen and (max-width:767px) { .mypage__payment__separation { margin-top:50px!important } } @media screen and (min-width:768px) { .mypage__payment__separation { margin-top:80px } } .mypage__payment__registerd-card { display:block; margin-top:28px; opacity:1; -webkit-transition:opacity .6s ease,display 1s ease; transition:opacity .6s ease,display 1s ease } @media screen and (min-width:768px) { .mypage__payment__registerd-card { margin-top:30px } } @media screen and (max-width:767px) { .mypage__payment__registerd-card .form__operation-text-item { margin-top:28px!important } } @media screen and (min-width:768px) { .mypage__payment__registerd-card .form__operation-text-item { margin-top:30px } } .mypage__payment__registerd-card .form__input-filled { margin-top:0 } .mypage__payment__js__dropdown--hidden { max-height:0; opacity:0; overflow:hidden; -webkit-transition:opacity .4s ease-in-out; transition:opacity .4s ease-in-out } .mypage__payment__js__dropdown--visible { opacity:1; -webkit-transition:opacity .4s ease-in-out; transition:opacity .4s ease-in-out } .mypage__payment__js__dropdown--checked-height { max-height:800px } .mypage__payment-status>*+* { margin-top:20px } .mypage__coupon-list-item { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; gap:28px } @media screen and (min-width:768px) { .mypage__coupon-list-item { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; -webkit-box-orient:horizontal; -webkit-box-direction:normal; align-items:center; -ms-flex-direction:row; flex-direction:row; justify-content:space-between } } .mypage__coupon-status { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; gap:12px } @media screen and (min-width:768px) { .mypage__coupon-status { -webkit-box-pack:justify; -ms-flex-pack:justify; -webkit-box-align:center; -ms-flex-align:center; -webkit-box-orient:horizontal; -webkit-box-direction:normal; align-items:center; -ms-flex-direction:row; flex-direction:row; justify-content:space-between; width:55% } } .mypage__coupon-status-detail { -webkit-box-orient:vertical; -ms-flex-direction:column; flex-direction:column; gap:12px } .mypage__coupon-status-detail, .mypage__coupon-status-term { -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; line-height:100% } .mypage__coupon-status-term { -webkit-box-orient:horizontal; -ms-flex-direction:row; flex-direction:row; gap:8px } @media screen and (max-width:767px) { .mypage__coupon-status-term>:not(:last-child):after { content:"/"; margin-left:8px } } @media screen and (min-width:768px) { .mypage__coupon-status-term { -webkit-box-orient:vertical; -webkit-box-direction:normal; -ms-flex-direction:column; flex-direction:column; gap:0; max-width:130px } } .mypage__coupon-code { -webkit-box-orient:vertical; -ms-flex-direction:column; flex-direction:column; line-height:100% } .mypage__coupon-code, .mypage__coupon-code-num { -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; gap:12px } .mypage__coupon-code-num { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-orient:horizontal; align-items:center; -ms-flex-direction:row; flex-direction:row } .mypage__coupon-code-num .icon { height:22px; width:19px } @media screen and (max-width:767px) { .mypage__coupon-code-num .button { display:none } } @media screen and (min-width:768px) { .account__contents { margin-top:40px } } .account__note { color:#666 } @media screen and (max-width:767px) { .account__note { margin-top:30px } } @media screen and (min-width:768px) { .account__note { margin-top:20px } } .account>.contents__head-detail-switch-md, .account>.contents__head-operation { margin:0 } @media screen and (max-width:767px) { .account>.contents__head-detail-switch-md, .account>.contents__head-operation { padding-top:32px } } @media screen and (min-width:768px) { .account>.contents__head-detail-switch-md .form__text--error, .account>.contents__head-operation .form__text--error { padding-top:20px } } .account .contents__head .contents__head-title { margin:0 } .account *+.form__operation { margin-top:30px } @media screen and (min-width:768px) { .account *+.form__operation { margin-top:40px } } .account *+.form__operation .account__note { margin-top:30px } @media screen and (min-width:768px) { .account *+.form__operation .account__note { margin-top:20px } } .account .procedure__head, .account .procedure__head--row { margin:0 -28px; padding-top:30px } @media screen and (min-width:768px) { .account .procedure__head, .account .procedure__head--row { padding-top:0 } .account .form__nav { margin-top:40px } } @media screen and (max-width:767px) { .account .procedure__wrap { margin-top:30px } } @media screen and (min-width:768px) { .account .procedure__wrap { margin-top:0 } .account .procedure__wrap:first-child { margin-top:40px } } .account .procedure__data-item>*+* { margin-top:10px } .account .procedure__data-item .procedure__note { margin-top:20px } @media screen and (max-width:767px) { .account__information { background:#fff; border-top:2px solid #f2f2f2; padding:0 28px 52px } .account__forget, .account__start { text-align:center } } .account__forget { margin-top:20px } .account__start { margin-top:30px } @media screen and (min-width:768px) { .account__start { margin-top:53px } } .account__order { -webkit-box-orient:vertical; -webkit-box-direction:normal; display:-webkit-box; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column } .account__address-name { -webkit-box-ordinal-group:1; -ms-flex-order:0; order:0 } .account__address-distinction { -webkit-box-ordinal-group:2; -ms-flex-order:1; order:1 } .account .js__dropdown--checked-height { max-height:2000px } .account__add { padding-top:28px } @media screen and (min-width:768px) { .account__add { padding-top:63px } .account__add .contents__head-operation { padding-top:80px } } .account__add-title { font-size:3.2rem; line-height:1; text-align:left } @media screen and (min-width:768px) { .account__add-title { font-size:4rem } } .account__login { margin-top:30px; text-align:center } @media screen and (min-width:768px) { .account__login { margin-top:40px } } .account__appeal-main-title { font-size:3.2rem; line-height:135% } @media screen and (max-width:767px) { .account__appeal-main-title { padding-top:28px } } @media screen and (min-width:768px) { .account__appeal-main-title { font-size:4rem; line-height:150% } } .account__appeal-note { display:block; font-size:1.1rem; line-height:100%; margin-top:8px } @media screen and (min-width:768px) { .account__appeal-note { margin-top:12px } } .account__appeal-detail { margin-top:20px; text-align:center } @media screen and (min-width:768px) { .account__appeal-detail { display:-webkit-box; display:-ms-flexbox; display:flex; gap:64px; margin-top:40px; text-align:left } } .account__appeal-detail-title { font-size:2rem; line-height:150% } @media screen and (min-width:768px) { .account__appeal-detail-title { font-size:1.6rem } } .account__appeal-detail-title span { display:inline-block } .account__appeal-detail-text { margin-top:20px } @media screen and (min-width:768px) { .account__appeal-detail-text { margin-top:0 } } .account__appeal-detail-point { display:-ms-grid; display:grid; gap:20px } @media screen and (max-width:767px) { .account__appeal-detail-point { -ms-grid-columns:1fr 1fr; grid-template-columns:1fr 1fr; margin:24px auto 0; width:220px } } @media screen and (min-width:768px) { .account__appeal-detail-point { gap:15px; margin-top:20px } } .account__appeal-detail-point-item { font-size:1.2rem; line-height:150% } @media screen and (min-width:768px) { .account__appeal-detail-point-item { -ms-grid-columns:45px 12px 1fr; -webkit-box-align:center; -ms-flex-align:center; align-items:center; -webkit-column-gap:12px; -moz-column-gap:12px; column-gap:12px; display:-ms-grid; display:grid; font-size:1.6rem; grid-template-columns:45px 1fr; row-gap:0 } } @media screen and (max-width:767px) { .account__appeal-detail-point-item>*+* { margin-top:12px } } .account__appeal-detail-image img { height:auto; width:259px } @media screen and (min-width:768px) { .account__appeal-detail-image img { width:405px } } .account__appeal-use { margin-top:40px; text-align:center } .account__appeal-use>*+* { margin-top:40px } .account__appeal-use-text { font-size:2rem; line-height:143% } .account__appeal-use-text span { display:inline-block } @media screen and (min-width:768px) { .account__appeal-use-text { font-size:2.4rem } } .account__appeal-use-rest { background:#fff; font-size:1.6rem; line-height:170%; padding:26px 20px } @media screen and (min-width:768px) { .account__appeal-use-rest { background:#f2f2f2; display:inline-block; font-size:1.8rem; padding:24px 20px } .account__appeal-use-service { margin-top:60px } } .account__appeal-use-button { -webkit-box-align:center; -ms-flex-align:center; -webkit-box-pack:center; -ms-flex-pack:center; align-items:center; display:-webkit-inline-box; display:-ms-inline-flexbox; display:inline-flex; font-size:1.6rem; font-weight:700; justify-content:center; width:100% } @media screen and (min-width:768px) { .account__appeal-use-button { font-size:2.4rem; max-width:320px; min-height:80px } } .account__appeal-link { margin-top:40px } @media screen and (min-width:1024px) { .cart__calculation-wrap { background:#f2f2f2; height:auto; padding:60px 28px; position:sticky; top:120px } } @media screen and (max-width:767px) { .cart__calculation-subtotal { -ms-grid-columns:(1fr)[2]; -ms-grid-rows:auto; display:-ms-grid; display:grid; grid-template-columns:repeat(2,1fr); grid-template-rows:auto; padding:28px 28px 0 } .cart__calculation-subtotal>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .cart__calculation-subtotal>:nth-child(2) { -ms-grid-column:2; -ms-grid-row:1 } } @media screen and (min-width:768px) { .cart__calculation-subtotal { margin-top:40px } .cart__calculation-subtotal-price { border-left:1px solid #1a1a1a; margin-left:5px; padding-left:5px } } .cart__calculation-breakdown-item, .cart__calculation-total { -ms-grid-columns:1fr auto; -ms-grid-rows:auto; display:-ms-grid; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto } .cart__calculation-breakdown-item>:first-child, .cart__calculation-total>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .cart__calculation-breakdown-item>:nth-child(2), .cart__calculation-total>:nth-child(2) { -ms-grid-column:2; -ms-grid-row:1 } @media screen and (max-width:767px) { .cart__calculation-breakdown { padding:0 28px 28px } } @media screen and (min-width:768px) { .cart__calculation-breakdown { padding-top:10px } } @media screen and (max-width:767px) { .cart__calculation-breakdown-item { margin-top:24px } } @media screen and (min-width:768px) { .cart__calculation-breakdown-item { margin-top:18px } } @media screen and (max-width:767px) { .cart__calculation-total { border-top:2px solid #f2f2f2; padding:28px } } @media screen and (min-width:768px) { .cart__calculation-total { border-top:2px solid #f2f2f2; margin-top:43px; padding-top:43px } .cart__process { margin-top:43px; padding:32.5px } } @media screen and (min-width:1024px) { .cart__process { margin-top:43px; padding:20px } } .cart__result { border-bottom:2px solid #f2f2f2; color:#ccc; font-size:2rem; line-height:150%; padding:132px 28px 104px } @media screen and (min-width:768px) { .cart__result { border:none; margin:113px auto 104px; max-width:334px; padding:0 } } .cart__result>*+* { margin-top:120px } @media screen and (min-width:768px) { .cart__result>*+* { margin-top:60px } } .cart__result .button { font-size:1.6rem; min-height:60px } @media screen and (min-width:768px) { .cart__result .button { font-size:1.8rem } } .topic__list { margin-top:32px } @media screen and (min-width:768px) { .topic__list { margin-top:40px } } .topic__list-item { border-top:1px solid #f2f2f2 } .topic__list-title { font-weight:400 } .topic__list-detail { display:-ms-grid; display:grid; gap:8px; padding:16px 0 } @media screen and (min-width:768px) { .topic__list-detail { -ms-grid-columns:100px 40px 1fr; -ms-grid-rows:auto; gap:40px; grid-template-columns:100px 1fr; grid-template-rows:auto; padding:20px 0 } .topic__list-detail>:first-child { -ms-grid-column:1; -ms-grid-row:1 } .topic__list-detail>:nth-child(2) { -ms-grid-column:3; -ms-grid-row:1 } } .topic-day { color:#a6a6a6 } .topic__back { color:#4d4d4d } @media screen and (max-width:767px) { .topic .contents__head-detail { margin-top:10px } } .topic .breadcrumb { font-size:1.2rem; margin-top:0 } @media screen and (max-width:767px) { .topic .breadcrumb { overflow:hidden; text-overflow:ellipsis; white-space:nowrap } } .topic .contents__head-text { margin-top:42px } @media screen and (min-width:768px) { .topic .contents__head-text { margin-top:20px } } .topic .contents__head-title { margin-top:0 } .topic__head-text { margin-top:42px } @media screen and (min-width:768px) { .topic__head-text { margin-top:40px } } .topic__body { margin-top:32px } @media screen and (min-width:768px) { .topic__body { margin-top:40px } } .topic__body>*+* { margin-top:12px } .topic__foot { margin-top:60px } @media screen and (min-width:768px) { .topic__foot { margin-top:120px } } .contact .contents__head-detail-switch-md, .contact .contents__head-operation { margin:0; padding-top:32px } @media screen and (min-width:768px) { .contact .contents__head-detail-switch-md, .contact .contents__head-operation { padding-top:0 } .contact .contents__head-detail-switch-md .form__text--error, .contact .contents__head-operation .form__text--error { padding-top:20px } } .contact .contents__head-operation-text>*+* { margin-top:30px } @media screen and (min-width:768px) { .contact .contents__head-operation-text>*+* { margin-top:20px } } .contact *+.form__operation { margin-top:30px } @media screen and (min-width:768px) { .contact *+.form__operation { margin-top:40px } } .contact *+.form__operation .account__note { margin-top:30px } @media screen and (min-width:768px) { .contact *+.form__operation .account__note { margin-top:20px } .contact .form__nav { margin-top:40px } } @media screen and (max-width:767px) { .contact .procedure__wrap { margin-top:30px } } @media screen and (min-width:768px) { .contact .procedure__wrap:first-child { margin-top:40px } } .contact .procedure__data-item>*+* { margin-top:10px } .contact__detail .contents__head-detail-switch-md, .contact__detail .contents__head-operation { padding-top:32px } @media screen and (min-width:768px) { .contact__detail .contents__head-detail-switch-md, .contact__detail .contents__head-operation { padding-top:40px } } .contact__information { background:#fff; margin-top:30px; padding:28px } @media screen and (min-width:768px) { .contact__information { background:#f2f2f2; margin-top:40px; padding:30px } } .contact__information-telnum { font-size:2rem; line-height:1em } @media screen and (min-width:768px) { .contact__information-telnum { font-size:3.6rem } } .contact__information-limit { margin-top:4px } @media screen and (min-width:768px) { .contact__information-limit { margin-top:10px } } .contact__information-tel { margin-top:12px } .contact__information-tel .icon { height:24px; width:24px } .about__title { color:grey } .about__sb-title { color:#000; font-size:2.8rem; line-height:135% } @media screen and (min-width:768px) { .about__sb-title { font-size:4.8rem } } .about-item { margin-top:70px } @media screen and (min-width:768px) { .about-item { margin-top:28px } } .about-item+.about-item { margin-top:80px } @media screen and (min-width:768px) { .about-item+.about-item { margin-top:200px } } @media screen and (max-width:767px) { .about-image { margin:0 -28px } } .about-image img { height:auto; width:100% } .about-text { color:#000; font-size:1.6rem; line-height:170%; margin-top:20px } @media screen and (min-width:768px) { .about-text { font-size:1.8rem; line-height:200%; margin:60px auto 0; max-width:580px } } .about-text *+* { margin-top:24px } @media screen and (min-width:768px) { .about-text *+* { margin-top:40px } .about-orderie__image { height:599px; overflow:hidden } .about-orderie__image img { width:auto } } .about-logo { margin:200px auto 41px; width:161px } @media screen and (min-width:768px) { .about-logo { margin-top:257px; padding-bottom:216px; width:315px } } .stock-introduction { margin-top:60px; padding:0 28px } @media screen and (min-width:768px) { .stock-introduction { margin:60px auto 0; padding:0 } } .stock-introduction .button { font-size:1.6rem; width:100% } @media screen and (min-width:768px) { .stock-introduction .button { font-size:1.8rem; width:440px } } .stock-introduction__main { color:#ccc } .stock-introduction__main-image { height:auto; width:121px } @media screen and (min-width:768px) { .stock-introduction__main-image { width:135px } } .stock-introduction__main-lead { font-size:2.4rem; line-height:140%; margin-top:31px } @media screen and (min-width:768px) { .stock-introduction__main-lead { font-size:2.8rem; margin-top:32px } } .stock-introduction__main-body { line-height:180%; margin-top:39px } @media screen and (min-width:768px) { .stock-introduction__main-body { margin-top:32px } } .stock-introduction__main-button { margin-top:51px } @media screen and (min-width:768px) { .stock-introduction__main-button { margin-top:40px } } .stock-introduction__main-button .icon { height:20px; width:20px } .stock-introduction__sb { margin-top:60px } @media screen and (min-width:768px) { .stock-introduction__sb { margin:80px auto 0; max-width:440px } } .stock-introduction__sb-lead { font-size:1.6rem; line-height:150% } @media screen and (min-width:768px) { .stock-introduction__sb-lead { font-size:2.8rem } } .stock-introduction__sb>*+* { margin-top:16px } @media screen and (min-width:768px) { .stock-introduction__sb>*+* { margin-top:32px } } .page__error { height:100%; margin-top:100px; text-align:center } @media screen and (min-width:768px) { .page__error { height:auto; margin-top:150px } } .page__error>*+* { margin-top:112px } @media screen and (min-width:768px) { .page__error>*+* { margin-top:80px } } .page__error-detail>*+* { margin-top:40px } @media screen and (min-width:768px) { .page__error-detail>*+* { margin-top:60px } } .page__error-detail-text { font-size:1.8rem; line-height:135% } @media screen and (min-width:768px) { .page__error-detail-text { font-size:2rem; line-height:150% } .page__error-button { margin-left:auto; margin-right:auto; max-width:334px } } .js__element--hidden { display:none } .js__element--visible { display:block } .js__opacity { -webkit-transition:opacity 1s ease-out; transition:opacity 1s ease-out } .js__opacity--hidden { opacity:0 } .js__opacity--visible { opacity:1 } .js__height--hidden { max-height:0 } @media screen and (max-width:767px) { .js__height-switch { display:none } } @media screen and (min-width:768px) { .js__height-switch { max-height:0; -webkit-transition:max-height .4s ease-in-out; transition:max-height .4s ease-in-out } } @media screen and (max-width:767px) { .js__height-switch--visible { display:block } } @media screen and (min-width:768px) { .js__height-switch--visible { max-height:10000px } } .js__height-more { max-height:10000px; -webkit-transition:max-height .4s ease-in-out; transition:max-height .4s ease-in-out } .js__height-more--initial { max-height:180px } .js__dropdown--hidden { max-height:0; overflow:hidden } .js__dropdown--hidden, .js__dropdown--visible { -webkit-transition:max-height 1s ease-in; transition:max-height 1s ease-in } .js__dropdown--checked-height { max-height:1500px } @media screen and (max-width:767px) { .js__dropdown-sm a { pointer-events:none } .js__dropdown-sm--hidden { overflow:hidden } .js__dropdown-sm--initial-height { max-height:0 } .js__dropdown-sm--initial-height, .js__dropdown-sm--visible { -webkit-transition:max-height .8s ease; transition:max-height .8s ease } .js__icon-sm--open { background:url(/assets/images/plus@2.png) center right 30px no-repeat; background-size:16px auto } .js__icon-sm--close { background:url(/assets/images/minus@2.png) center right 30px no-repeat; background-size:16px auto } } .js__clipboard--active { opacity:1; -webkit-transform:translate(0); transform:translate(0) } @media screen and (min-width:768px) { .js__clipboard--active { -webkit-transform:translateY(-20px); transform:translateY(-20px) } } .js__dropdown--visible+.mypage__payment__registerd-card { display:none; opacity:0; -webkit-transition:opacity .6s ease 5s,display 1s ease 6s; transition:opacity .6s ease 5s,display 1s ease 6s } .product__introduction-copy .js__clipboard--active { opacity:1; -webkit-transform:translate(-50%); transform:translate(-50%) } @media screen and (min-width:768px) { .product__introduction-copy .js__clipboard--active { -webkit-transform:translate(-50%,-20px); transform:translate(-50%,-20px) } }