@charset "UTF-8"; /*! Theme Name: 鯵坂税理士事務所 Theme URI: https://antway.co.jp/ Author: shogo yonetani Author URI: https://panarea.co.jp Description: 鯵坂税理士事務所 */ /*Color Management*/ :root { --s-font-noto: 'Noto Sans JP'; --s-font-inter: Inter; --fontweight-5: 500; --fontweight-6: 600; --fontweight-7: 700; --fontweight-8: 800; --text: #0a0000; --color-text: #151515; --color-key1: #469ad3; --color-key2: #3c86b7; --color-key3: #33719a; --color-key4: #1f455e; --color-key5: #282828; --color-white: #fff; --white: #fff; --color-gray: #757575; --color-lightgray: #ecedf0; --color-black: #171617; --border-light-black: rgba(31,69,94,.205); --border-light-white: rgba(255,255,255,.1025); --key1: #008cd6; --key2: #acd8f8; --key3: #0079bc; --key4: #083855; --key5: #0036e4; --red: #e04f5a; --line: #00b900; --base1: #0092e0; --base2: #00408e; --background1: #f4fafe; --background2: #d8d2c6; --background3: #eff1f3; } /*Basic Color*/ /*Couplate Color*/ /*Footer*/ /*ASIDE*/ /*!color*/ /*!レスポンシブ*/ /*mouse-follower-dev*/ .mf-cursor { color: #555555; position: fixed; top: 0; left: 0; z-index: 10001 !important; direction: ltr; contain: layout style size; pointer-events: none; transition: opacity 0.3s, color 0.4s; } @media screen and (max-width: 768px) { .mf-cursor { display: none; } } .mf-cursor:before { content: ""; position: absolute; top: -24px; left: -24px; display: block; width: 48px; height: 48px; transform: scale(0.2); background: currentColor; border-radius: 50%; transition: transform 0.25s ease-in-out, opacity 0.1s; } .mf-cursor.-inverse { color: #aaaaaa; } @supports (mix-blend-mode: exclusion) { .mf-cursor.-exclusion { mix-blend-mode: exclusion; } .mf-cursor.-exclusion:before { background: #aaaaaa; } } .mf-cursor.-pointer:before { transform: scale(0.15); } .mf-cursor.-text { white-space: nowrap; } .mf-cursor.-text:before { opacity: 0.85; transform: scale(1.7); } .mf-cursor.-text.-active:before { transform: scale(1.6); transition-duration: 0.2s; } .mf-cursor.-icon:before { transform: scale(1.5); } .mf-cursor.-icon.-active:before { transform: scale(1.4); } .mf-cursor.-hidden:before { transform: scale(0); } .mf-cursor-text { position: absolute; top: -18px; left: -18px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; transform: scale(0) rotate(10deg); opacity: 0; color: #fff; font-size: 16px; line-height: 20px; text-align: center; transition: opacity 0.4s, transform 0.3s; } .mf-cursor.-text .mf-cursor-text, .mf-cursor.-icon .mf-cursor-text { opacity: 1; transform: scale(1); } .mf-cursor-media { position: absolute; width: 150px !important; height: 150px !important; margin: -75px 0 0 -75px !important; } @media screen and (max-width: 768px) { .mf-cursor-media { width: 108px !important; height: 108px !important; margin: -54px 0 0 -54px !important; } } .mf-cursor-media img, .mf-cursor-media video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 50%; } @supports (object-fit: cover) { .mf-cursor-media img, .mf-cursor-media video { position: static; width: 100%; height: 100%; object-fit: cover; transform: translateZ(0); } } .mf-cursor-media-box { position: relative; width: 100%; height: 100%; overflow: hidden; transform: scale(0) translateZ(0); padding: 1px; opacity: 0; border-radius: 50%; transition: transform 0.35s, opacity 0.2s 0.2s; } .mf-cursor.-media .mf-cursor-media-box { opacity: 1; transform: scale(0.696); transition-duration: 0.4s, 0.4s; transition-delay: 0s, 0s; } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background: transparent; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: 700; } dfn { font-style: italic; } h1 { font-size: 2em; margin: .67em 0; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -.5em; } sub { bottom: -.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace; font-size: 1em; } input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type=reset], input[type=submit] { -webkit-appearance: button; /*cursor:pointer*/ } button[disabled], html input[disabled] { /*cursor:default*/ } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid silver; margin: 0 2px; padding: .35em .625em .75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: 700; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /*!//normalize.css*/ /*! locomotive-scroll v4.1.3 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */ html.has-scroll-smooth { overflow: hidden; } html.has-scroll-dragging { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .has-scroll-smooth body { overflow: hidden; } .has-scroll-smooth [data-scroll-container] { min-height: 100vh; } [data-scroll-direction=horizontal] [data-scroll-container] { display: inline-block; height: 100vh; white-space: nowrap; } [data-scroll-direction=horizontal] [data-scroll-section] { display: inline-block; height: 100%; vertical-align: top; white-space: nowrap; } .c-scrollbar { height: 100%; opacity: 0; position: absolute; right: 0; top: 0; transform-origin: center right; transition: transform .3s,opacity .3s; width: 11px; } .c-scrollbar:hover { transform: scaleX(1.45); } .c-scrollbar:hover, .has-scroll-dragging .c-scrollbar, .has-scroll-scrolling .c-scrollbar { opacity: 1; } [data-scroll-direction=horizontal] .c-scrollbar { bottom: 0; height: 10px; top: auto; transform: scaleY(1); width: 100%; } [data-scroll-direction=horizontal] .c-scrollbar:hover { transform: scaleY(1.3); } .c-scrollbar_thumb { background-color: #000; border-radius: 10px; cursor: -webkit-grab; cursor: grab; margin: 2px; opacity: .5; position: absolute; right: 0; top: 0; width: 7px; } .has-scroll-dragging .c-scrollbar_thumb { cursor: -webkit-grabbing; cursor: grabbing; } [data-scroll-direction=horizontal] .c-scrollbar_thumb { bottom: 0; right: auto; } /*!basic css*/ html { height: 100%; font-size: 1.2vw; } @media screen and (max-width: 768px) { html { font-size: 3.5vw; } } body { margin: 0; position: relative; margin-left: auto; margin-right: auto; width: auto; height: auto; font-family: YakuHanJP_Narrow, var(--s-font-inter), sans-serif; font-weight: 400; letter-spacing: 0; -webkit-text-size-adjust: 100%; overflow-x: hidden; overflow-y: auto; padding-bottom: 1px; background-color: var(--key4); background-image: linear-gradient(to right, var(--key3), var(--key4)); overflow: hidden; color: var(--white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body::before { content: ''; position: absolute; top: 0; left: 0; z-index: -1; display: block; width: 100%; height: 100%; background-image: linear-gradient(0deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)), linear-gradient(90deg, transparent calc(100% - 1px), #f0f0f0 calc(100% - 1px)); background-size: 16px 16px; background-repeat: repeat; background-position: center center; opacity: .0328; } body::after { content: ''; position: absolute; top: 0; left: 0; z-index: 15; display: block; width: 100%; height: 100%; background: url("images/noise.png"); background-repeat: repeat; background-size: 100px; pointer-events: none; opacity: 1; } .no-scroll { overflow: hidden; } * { color: var(--color-text); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-feature-settings: "palt"; -ms-overflow-style: none; } *::-webkit-scrollbar { display: none; } ::selection { background-color: rgba(0, 0, 0, 0.15); color: #252525; } /*!TEXT*/ p, h1, h2, h3, h4, h5 { display: block; -webkit-margin-before: 0em; -webkit-margin-after: 0em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; margin: 0; font-size: 1em; } h1, h2, h3, h4, h5 { position: relative; z-index: 15; } p { letter-spacing: 0; font-weight: 400; line-height: 1.64; } .sans { font-family: 'Inter', Avenir Next,Verdana,'M PLUS 1p', 游ゴシック,Yu Gothic,YuGothic,ヒラギノ角ゴ Pro W3,Hiragino Kaku Gothic Pro,メイリオ,Meiryo,Osaka,sans-serif; } .serif { font-family: "Hiragino Mincho ProN", "ヒラギノ明朝 Pro W3", "HGS明朝B", "ＭＳ Ｐ明朝", serif, "Meiryo", "Sawarabi Mincho", "メイリオ", "ＭＳ Ｐゴシック", sans-serif; } i { font-style: normal; } .emphasis { padding: 0 5px; background: linear-gradient(var(--key4), var(--key4)) no-repeat; background-size: 100%; background-position: 0; } .posCenter { position: absolute; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } img { max-width: 100%; height: auto; } img.objf, svg.objf, video.objf, iframe.objf { width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover;'; } /*!LINK*/ a { text-decoration: none; } a.not { cursor: not-allowed; } a[target='_blank'] { /* p { &::after { content: ''; display: inline-block; vertical-align: sub; width: 1em; height: 1em; background: url(images/iconLinkout.svg); background-size: cover; margin-left: 1em; } } */ } a.arrow { display: flex; align-items: center; } a.arrow > ._arrow { position: relative; z-index: 15; display: flex; align-items: center; justify-content: space-between; width: 3.28em; height: 3.28em; margin-left: 18px; border-radius: 3.28em; overflow: hidden; } a.arrow > ._arrow::before { content: ''; position: absolute; top: 0; left: 0; right: 0; z-index: -1; display: block; width: 100%; height: 100%; background: #ee781f; } a.arrow > ._arrow img { width: 1em; height: 1em; } a.positionLink { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } p.btn { position: relative; z-index: 15; display: block; } p.btn._liner { display: table; margin: 0 auto; line-height: 3; } p.btn._liner::before { content: ''; display: block; width: 0; height: 1px; background: #150606; position: absolute; bottom: 0; left: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } p.btn._liner::after { content: ''; display: block; width: 100%; height: 1px; background: #150606; position: absolute; bottom: 0; right: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: .246s; } p.btn._liner:hover::before { width: 100%; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: .246s; } p.btn._liner:hover::after { width: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .noallow { cursor: not-allowed !important; pointer-events: none !important; } /*!ul/dl*/ ul, dl { -webkit-margin-before: 0; -webkit-margin-after: 0; -webkit-margin-start: 0; -webkit-margin-end: 0; -webkit-padding-start: 0; -moz-margin-before: 0; -moz-margin-after: 0; -moz-margin-start: 0; -moz-margin-end: 0; -moz-padding-start: 0; -ms-margin-before: 0; -ms-margin-after: 0; -ms-margin-start: 0; -ms-margin-end: 0; -ms-padding-start: 0; -o-margin-before: 0; -o-margin-after: 0; -o-margin-start: 0; -o-margin-end: 0; -o-padding-start: 0; margin-before: 0; margin-after: 0; margin-start: 0; margin-end: 0; padding-start: 0; -webkit-padding-left: 0; -moz-padding-left: 0; -ms-padding-left: 0; -o-padding-left: 0; padding-left: 0; margin-top: 0; margin-bottom: 0; } ul li { list-style-type: none; } dl dd { margin-left: 0; } .clear::after { content: ''; display: block; clear: both; } /*!ASPECT*/ .aspect { width: 100%; height: auto; position: relative; overflow: hidden; } .aspect.aspect35 { padding-top: 35%; } .aspect.aspect41 { padding-top: 41.4%; } .aspect.aspect50 { padding-top: 50%; } .aspect.aspect56 { padding-top: 56.25%; } .aspect.aspect61 { padding-top: 61.8%; } .aspect.aspect75 { padding-top: 75%; } .aspect.aspect100 { padding-top: 100%; } .aspect.aspect120 { padding-top: 120%; } .aspect.aspect141 { padding-top: 141.4%; } .aspect.aspect178 { padding-top: 178%; } .aspect.aspect200 { padding-top: 200%; } .aspect.aspect282 { padding-top: 282.8%; } .aspect .aspectBlock { position: absolute; top: 0; width: 100%; height: 100%; } .aspect .aspectBlock .aspectInner { height: calc(100% + 10rem); transform: translateY(-5rem); } .aspect .aspectBlock img { width: 100%; height: auto; } .aspect .aspectBlock img.objf { width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover;'; } .aspect .aspectBlock blockquote { width: 100% !important; height: 100% !important; } .aspect .aspectBlock blockquote iframe { width: 100% !important; height: 100% !important; } .aspect .aspectBlock iframe { width: 100%; height: 100%; } .aspect .aspectBlock video { width: 100%; height: auto; } .showImg { transform: scale(1.23); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-duration: .82s; } .showImg:hover { transform: scale(1.1); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /*!fugure*/ figure { margin: 0; } figure figurecaption { font-size: .85em; margin-top: .41em; display: block; } /*!shadow*/ .sdw { box-shadfigureow: 0 1rem 3rem rgba(0, 0, 0, 0.05); } .shadow { box-shadow: 0 2.5rem 2rem -2rem #193b4d66; } /*!Resposive*/ .hidden-xs { display: block !important; } @media screen and (max-width: 768px) { .hidden-xs { display: none !important; } } .visible-xs { display: none !important; } @media screen and (max-width: 768px) { .visible-xs { display: block !important; } } /*!.sticky*/ .sticky { position: -webkit-sticky; position: sticky; top: 0; z-index: 8999; } /*!page loading*/ /* #loading { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #4daeef; background-image: radial-gradient(circle at 94% 95%, #1f445c 3%, transparent 76%), radial-gradient(circle at 13% 90%, #4a6db0 22.6048011414%, transparent 106.2351464535%), radial-gradient(circle at 86% 50%, rgba(237, 94, 194, 0) 7%, transparent 76%), radial-gradient(circle at 89% 79%, rgba(68, 44, 226, 0) 7%, transparent 87%), radial-gradient(circle at 15% 44%, rgba(242, 171, 166, 0) 15%, transparent 81%), radial-gradient(circle at 99% 20%, rgba(244, 253, 217, 0) 1%, transparent 68%); background-blend-mode: normal, normal, normal, normal, normal, normal; overflow: hidden; z-index: 10000; display: flex; justify-content: center; align-items: center; transition: opacity 0.82s ease, visibility 0.82s ease; opacity: 1; visibility: visible; color: var(--color-white); &.hidden { opacity: 0; visibility: hidden; } } */ /* 初期状態: loadingを表示 */ #loading { position: fixed; top: 0; left: 0; z-index: 9999; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; background-color: #1e1a1a; background-image: radial-gradient(circle at 91% 11%, black 4.0387722132%, transparent 37.2265767974%), radial-gradient(circle at 66% 37%, black 0%, transparent 63.3364095611%), radial-gradient(circle at 36% 87%, black 12.1075360571%, transparent 63.3364095611%); background-blend-mode: normal,normal,normal; opacity: 1; transition: opacity 1s ease, visibility 1s ease; } #loading::before { content: ''; position: absolute; top: 0; left: 0; z-index: -5; display: block; width: 100%; height: 100%; background: url(images/noise.png); background-size: 100px; background-repeat: repeat; } #loading.hidden { opacity: 0; visibility: hidden; } #loading #lottie-container { width: 100%; height: 100%; max-width: 100vw; max-height: 100vh; aspect-ratio: 1 / 1; } #main { position: fixed; top: 0; left: 0; right: 0; z-index: 999999; width: 100%; height: 100vh; height: calc(var(--vh, 1vh) * 100); background: #ee781f; display: flex; justify-content: center; align-items: center; flex-direction: column; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #main .img { overflow: hidden; height: 2.05em; } #main .img img { width: auto; height: 2.05em; transform: translateY(2.05em); } @media screen and (max-width: 768px) { #main .img img { height: 2.05em; } } #main .img img.gone { transform: translateY(0); transition: cubic-bezier(0.43, 0.05, 0.17, 1) 0.82s 0.82s; -o-transition: cubic-bezier(0.43, 0.05, 0.17, 1) 0.82s 0.82s; -moz-transition: cubic-bezier(0.43, 0.05, 0.17, 1) 0.82s 0.82s; -webkit-transition: cubic-bezier(0.43, 0.05, 0.17, 1) 0.82s 0.82s; } #main .tagline p { font-size: 1.46em; font-weight: 600; color: var(--color-white); } #main .tagline p strong { color: #ee781f; } #main .tagline img { width: auto; height: 2.87em; } @media screen and (max-width: 768px) { #main .tagline img { display: block; margin: 0 auto; width: 70%; height: auto; } } @keyframes headingAnimation { 0% { background-position: 0 0; } 100% { background-position: -200% -200%; } } /*ロード終了*/ [data-loading="true"] #main.hide { top: -100%; /* opacity: 0; visibility: hidden; */ pointer-events: none; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /*ページ遷移時*/ #remover { position: fixed; top: 100%; left: 0; right: 0; z-index: 999999; width: 100%; height: 100vh; height: calc(var(--vh, 1vh) * 100); background: #ee781f; display: flex; justify-content: center; align-items: center; flex-direction: column; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #remover::after { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; z-index: 1; } #remover.remove { top: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /*!.inview*/ .inview { opacity: 0; } .inview.action { opacity: 1; transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -o-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -moz-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -webkit-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; } .inview.action[data-delay="1"] { transition-delay: 0.05s; } .inview.action[data-delay="2"] { transition-delay: 0.1s; } .inview.action[data-delay="3"] { transition-delay: 0.15s; } .inview.action[data-delay="4"] { transition-delay: 0.2s; } .inview.action[data-delay="5"] { transition-delay: 0.25s; } .inview.action[data-delay="6"] { transition-delay: 0.3s; } .inview.action[data-delay="7"] { transition-delay: 0.35s; } .inview.action[data-delay="8"] { transition-delay: 0.4s; } .inview.action[data-delay="9"] { transition-delay: 0.45s; } .inview.action[data-delay="10"] { transition-delay: 0.5s; } .animated { transform: translateY(24.6px); } .animated.move { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: .205s; } .animate { transform: translateY(-2rem); } .animate.move { transform: translateY(0); transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } .blur { filter: blur(10px); transform: translate3d(0, 0, 0) perspective(0); backface-visibility: hidden; will-change: contents; } .blur.action { filter: blur(0); transition: ease .5s; } .animeBox { width: 100%; height: 100%; position: relative; z-index: 15; overflow: hidden; } .animeBox::after { content: ''; display: block; position: absolute; top: 0; left: 0; z-index: 100; width: 0; height: 100%; background: #ee781f; } .animeBox img { opacity: 0; } .animeBox.gone::after { animation: animeCover 1.25s forwards; animation-delay: .5s; } .animeBox.gone img { animation: animeImg 1.25s forwards; animation-delay: .5s; } @keyframes animeCover { 0% { width: 0; left: 0; } 50% { width: 100%; left: 0; } 51% { width: 100%; left: initial; right: 0; } 100% { width: 0; left: initial; right: 0; } } @keyframes animeImg { 0% { opacity: 0; } 50% { opacity: 0; } 51% { opacity: 1; } 100% { opacity: 1; } } /*ベンダープレフィックス登録*/ .animation { animation: humbNav 1.5s linear 0s infinite; -o-animation: humbNav 1.5s linear 0s infinite; -moz-animation: humbNav 1.5s linear 0s infinite; -webkit-animation: humbNav 1.5s linear 0s infinite; } @keyframes humbNav { 0% { width: 30%; } 50% { width: 15%; } 100% { width: 30%; } } @-webkit-keyframes humbNav { 0% { width: 30%; } 50% { width: 15%; } 100% { width: 30%; } } @-o-keyframes humbNav { 0% { width: 30%; } 50% { width: 15%; } 100% { width: 30%; } } .anime_fade { display: flex; } .anime_fade:hover span { animation: anime_fade 1s linear 0s 1; -o-animation: anime_fade 1s linear 0s 1; -moz-animation: anime_fade 1s linear 0s 1; -webkit-animation: anime_fade 1s linear 0s 1; } @keyframes anime_fade { 0% { opacity: 1; } 5% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 1; } } @-webkit-keyframes anime_fade { 0% { opacity: 1; } 5% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 1; } } @-o-keyframes anime_fade { 0% { opacity: 1; } 5% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 1; } } .transition { transition: ease 0.3s; transition: -o-ease 0.3s; transition: -moz-ease 0.3s; transition: -webkit-ease 0.3s; } /*!input*/ select { outline: none; text-indent: 0.01px; text-overflow: ''; background: #f8f8f8; vertical-align: middle; font-size: inherit; color: inherit; -webkit-appearance: button; -moz-appearance: button; appearance: button; border: none; width: 100%; height: 60px; font-size: 1.5rem; } select option { background-color: #fff; color: #333; } /*!------------------------------------ css_assets(パーツ) -------------------------------------*/ /*!button*/ .humbBtn { position: relative; z-index: 15; width: 3.28em; height: 3.28em; border-radius: 4.1em; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } @media screen and (max-width: 768px) { .humbBtn { display: block; } } .humbBtn::before { content: ''; position: absolute; top: 0; left: 0; right: 0; display: block; width: 100%; height: 100%; border-radius: 50%; background: var(--color-white); transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } .humbBtn span.dots { display: block; width: 4px; height: 4px; border-radius: 4px; background: #231814; position: absolute; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn span.dots:nth-child(1) { top: calc(50% - 8px); left: calc(50% - 8px); transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(2) { top: calc(50% - 8px); left: 50%; transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(3) { top: calc(50% - 8px); left: calc(50% + 8px); transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(4) { top: 50%; left: calc(50% - 8px); transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(5) { top: 50%; left: 50%; transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(6) { top: 50%; left: calc(50% + 8px); transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(7) { top: calc(50% + 8px); left: calc(50% - 8px); transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(8) { top: calc(50% + 8px); left: 50%; transform: translate(-50%, -50%); } .humbBtn span.dots:nth-child(9) { top: calc(50% + 8px); left: calc(50% + 8px); transform: translate(-50%, -50%); } .humbBtn span.border { display: block; width: 30%; height: 1px; border-radius: 2px; background: #231814; position: absolute; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn span.border:nth-child(1) { top: 40%; left: 55%; transform: translate(-50%, -50%); } .humbBtn span.border:nth-child(2) { top: 50%; left: 45%; transform: translate(-50%, -50%); } .humbBtn span.border:nth-child(3) { top: 60%; left: 50%; transform: translate(-50%, -50%); } .humbBtn span.borders { display: block; width: 30%; height: 1px; border-radius: 2px; background: #231814; position: absolute; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn span.borders:nth-child(1) { top: 37.5%; left: 50%; transform: translate(-50%, -50%); } .humbBtn span.borders:nth-child(2) { top: 50%; left: 50%; transform: translate(-50%, -50%); } .humbBtn span.borders:nth-child(3) { top: 62.5%; left: 50%; transform: translate(-50%, -50%); } .humbBtn span.txt { position: absolute; bottom: 0; width: 100%; text-align: center; font-size: .7em; color: var(--color-white); letter-spacing: 3px; } .humbBtn:hover { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn:hover::before { border-radius: 6px; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } .humbBtn:hover span.dots { background: #231814; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn:hover span.dots:nth-child(1) { top: calc(50% - 6px); left: calc(50% - 6px); } .humbBtn:hover span.dots:nth-child(2) { top: calc(50% - 6px); left: 50%; } .humbBtn:hover span.dots:nth-child(3) { top: calc(50% - 6px); left: calc(50% + 6px); } .humbBtn:hover span.dots:nth-child(4) { top: 50%; left: calc(50% - 6px); } .humbBtn:hover span.dots:nth-child(5) { top: 50%; left: 50%; } .humbBtn:hover span.dots:nth-child(6) { top: 50%; left: calc(50% + 6px); } .humbBtn:hover span.dots:nth-child(7) { top: calc(50% + 6px); left: calc(50% - 6px); } .humbBtn:hover span.dots:nth-child(8) { top: calc(50% + 6px); left: 50%; } .humbBtn:hover span.dots:nth-child(9) { top: calc(50% + 6px); left: calc(50% + 6px); } .humbBtn:hover span.borders { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn:hover span.borders:nth-child(1) { top: 50%; } .humbBtn:hover span.borders:nth-child(3) { top: 50%; } .humbBtn.active { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn.active::before { transform: scale(1); pointer-events: none; opacity: 0; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } .humbBtn.active span.dots { background: #f5f5f5; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn.active span.dots:nth-child(1) { top: 50%; left: calc(50% - 5px); } .humbBtn.active span.dots:nth-child(2) { top: 50%; left: 50%; } .humbBtn.active span.dots:nth-child(3) { top: 50%; left: calc(50% + 5px); } .humbBtn.active span.dots:nth-child(4) { top: 50%; left: calc(50% - 5px); } .humbBtn.active span.dots:nth-child(5) { top: 50%; left: 50%; } .humbBtn.active span.dots:nth-child(6) { top: 50%; left: calc(50% + 5px); } .humbBtn.active span.dots:nth-child(7) { top: 50%; left: calc(50% - 5px); } .humbBtn.active span.dots:nth-child(8) { top: 50%; left: 50%; } .humbBtn.active span.dots:nth-child(9) { top: 50%; left: calc(50% + 5px); } .humbBtn.active span.border { background: #999 !important; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn.active span.border:nth-child(1) { top: 50%; } .humbBtn.active span.border:nth-child(3) { top: 50%; } .humbBtn.active span.borders { background: var(--color-white) !important; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .humbBtn.active span.borders:nth-child(1) { top: 50%; transform: translate(-50%, -50%) rotate(45deg); } .humbBtn.active span.borders:nth-child(2) { opacity: 0; } .humbBtn.active span.borders:nth-child(3) { top: 50%; transform: translate(-50%, -50%) rotate(-45deg); } .humbBtn.active span.txt { color: var(--color-white) !important; } .humbBtn.scroll span { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /*!------------------------------------ css_sections(ブロック) -------------------------------------*/ /*!#siteHeader------------------------------------------------------------------------------------------------*/ /*公式*/ #siteHead { position: fixed; top: 0; left: 0; z-index: 8000; width: 100%; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead .wrapper { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; width: calc(100% / 16 * 15); min-height: calc(8.5em / 8 * 5); margin: 0 auto; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } @media screen and (max-width: 768px) { #siteHead .wrapper { min-height: calc(8.5em / 8 * 4); } } #siteHead .wrapper > ._head { display: flex; } #siteHead .wrapper > ._head a { display: flex; align-items: center; gap: calc(8.5em / 16); } @media screen and (max-width: 768px) { #siteHead .wrapper > ._head a { padding: 0 calc(8em / 16); } } #siteHead .wrapper > ._head a h1 { display: flex; align-items: center; column-gap: calc(8.5em / 8); font-weight: normal; line-height: 1.23; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._head a h1 { column-gap: 0; } } #siteHead .wrapper > ._head a h1 img { display: block; width: auto; height: calc(8em / 64 * 14); line-height: 1.23; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._head a h1 img { height: calc(8.5em / 32 * 6); } } #siteHead .wrapper > ._head a p { font-size: .8em; line-height: 1.23; } #siteHead .wrapper > ._body { flex: 1; display: flex; justify-content: flex-end; } #siteHead .wrapper > ._body nav * { color: var(--color-white); } #siteHead .wrapper > ._body nav > ul { display: flex; align-items: center; column-gap: calc(8em / 16); } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul { column-gap: 0; } } #siteHead .wrapper > ._body nav > ul > li > * { display: flex; align-items: center; justify-content: center; gap: calc(8em / 16); min-height: 2.46em; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li > * { min-height: 2.46em; } } #siteHead .wrapper > ._body nav > ul > li:not([data-type="button"]) { padding: 0 calc(8em / 16); } #siteHead .wrapper > ._body nav > ul > li:not([data-type="button"]) > a > .icon, #siteHead .wrapper > ._body nav > ul > li:not([data-type="button"]) > div > .icon { display: block; width: 1.23em; height: 1.23em; border: solid 0.5px var(--white); border-radius: calc(8em / 32); overflow: hidden; transform: rotate(90deg); } #siteHead .wrapper > ._body nav > ul > li:not([data-type="button"]) > a > .icon svg, #siteHead .wrapper > ._body nav > ul > li:not([data-type="button"]) > div > .icon svg { fill: var(--white); } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li:not([data-type="navigation"]) { display: none; } } #siteHead .wrapper > ._body nav > ul > li[data-type="button"] { min-width: 8em; border-radius: calc(8em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li[data-type="button"] { border-radius: 3px; } } #siteHead .wrapper > ._body nav > ul > li[data-type="button"][data-action="recruit"] { margin-left: calc(8em / 16 * 2); background: var(--color-black); } #siteHead .wrapper > ._body nav > ul > li[data-type="button"][data-action="entry"] { background: var(--key1); } #siteHead .wrapper > ._body nav > ul > li[data-type="button"][data-action="navigation"] { display: none; background: var(--color-black); } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li[data-type="button"][data-action="navigation"] { display: flex; } } #siteHead .wrapper > ._body nav > ul > li[data-type="button"] a { display: flex; align-items: center; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li[data-type="button"] a { justify-content: center; } } #siteHead .wrapper > ._body nav > ul > li[data-type="button"] a span { padding: 0 calc(8em / 8); font-size: .95em; } @media screen and (max-width: 768px) { #siteHead .wrapper > ._body nav > ul > li[data-type="button"] a span { padding: 0; } } #siteHead .wrapper > ._body nav > ul > li[data-type="button"]:hover { filter: brightness(0.9); transform: scale(0.985); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) { position: relative; z-index: 15; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower { position: absolute; top: 2.46em; left: 50%; transform: translateX(-50%); padding: calc(8em / 16 * 2); background: var(--border-light-black); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); opacity: 0; visibility: hidden; pointer-events: none; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower ul.children { display: flex; flex-direction: column; gap: calc(8em / 32 * 2); } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower ul.children > li a { display: flex; align-items: center; gap: calc(8em / 32 * 3); white-space: nowrap; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower ul.children > li a span.icon { width: calc(8em / 8 * 2); min-width: calc(8em / 8 * 2); height: calc(8em / 8 * 2); border-radius: calc(8em / 32 * 1); overflow: hidden; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower ul.children > li a span.text { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead .wrapper > ._body nav > ul > li:has(.lower) .lower ul.children > li a:hover span.text { opacity: .8; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead .wrapper > ._body nav > ul > li:has(.lower):hover .lower { opacity: 1; visibility: visible; pointer-events: auto; } #siteHead ._menu { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; } #siteHead ._menu p.humbNav { display: flex; align-items: center; column-gap: calc(85px / 6); text-transform: uppercase; font-size: .9em; } #siteHead ._menu p.humbNav > span { order: 1; position: relative; display: flex; align-content: space-between; flex-wrap: wrap; width: 1.435em; height: .8em; margin: 0 auto; } #siteHead ._menu p.humbNav > span > i { display: block; width: 1.435em; height: 1px; background: var(--color-white); border-radius: 1px; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead ._menu p.humbNav > span > i:first-child, #siteHead ._menu p.humbNav > span > i:last-child { width: 1.075em; } #siteHead ._menu p.humbNav > span > i:first-child { margin-left: auto; } #siteHead ._menu p.humbNav > span > i:last-child { margin-right: auto; } #siteHead ._menu p.humbNav.active > span { align-content: center; } #siteHead ._menu p.humbNav.active > span > i { width: 1.435em !important; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteHead ._menu p.humbNav.active > span > i:first-child { transform: rotate(18deg) translateY(0.5px); } #siteHead ._menu p.humbNav.active > span > i:nth-child(2) { width: 0; height: 0; } #siteHead ._menu p.humbNav.active > span > i:last-child { transform: rotate(-18deg) translateY(-0.5px); } #siteHead:hover::before { height: 100%; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } #siteHead.lower { /* a.title { opacity: 1; visibility: visible; pointer-events: auto; @include move; } ._menu { filter: invert(0); } .wrapper { nav._nav { filter: invert(1); @include move; } } */ } #siteHead.move { opacity: 0; pointer-events: none; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll #siteHead { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll #siteHead .wrapper ._head { opacity: 0; pointer-events: none; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll #cside { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll.scrollUp #siteHead { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll.scrollUp #siteHead .wrapper ._head { opacity: 1; pointer-events: auto; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } body.scroll.scrollUp #siteHead.move { background: none; } body.scroll.scrollUp #siteHead.move a.title { opacity: 0; visibility: hidden; pointer-events: none; } body.scroll.scrollUp #cside { transform: translateY(170px); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /*!#aside*/ aside#aside { position: fixed; top: 0; left: 0; right: 0; z-index: 7999; display: none; height: 100vh; height: calc(var(--vh, 1vh) * 100); overflow: scroll; backdrop-filter: blur(10px); } @media screen and (max-width: 768px) { aside#aside { padding-bottom: 4.1em; background: var(--border-light-black); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } } aside#aside .navigation_wrapper { display: flex; align-items: flex-end; flex-direction: column; width: calc(100% / 16* 15); margin: 0 auto; height: 100%; margin: 0 auto; padding-top: calc(8.5em / 8 * 5); overflow: scroll; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper { justify-content: flex-start; padding-top: calc(8.5em / 8 * 4); padding-bottom: calc(8.5em / 12 * 1); } } aside#aside .navigation_wrapper .navigation_body { position: relative; z-index: 15; min-width: calc(8.5em / 8 * 21); max-width: 100%; padding: calc(8.5em / 16 * 3); border: solid 1px var(--border-light-black); border-radius: calc(8.5em / 16 * 1); overflow: hidden; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper .navigation_body { min-width: 100%; } } aside#aside .navigation_wrapper .navigation_body::before { content: ''; position: absolute; top: 0; left: 0; z-index: -1; display: block; width: 100%; height: 100%; background: linear-gradient(135deg, var(--text) 95%, var(--key4)); opacity: .95; pointer-events: none; } aside#aside .navigation_wrapper ul.list { border-top: solid 1px var(--border-light-black); } aside#aside .navigation_wrapper ul.list * { color: var(--color-white); } aside#aside .navigation_wrapper ul.list > li { border-bottom: solid 1px var(--border-light-black); } aside#aside .navigation_wrapper ul.list > li:hover dl > dt::before { background: var(--color-white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#aside .navigation_wrapper ul.list > li.current dl > dt::before { background: var(--color-white) !important; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#aside .navigation_wrapper ul.list > li dl { display: flex; align-items: center; gap: 0 calc(8.5em / 3); } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper ul.list > li dl { flex-direction: column; align-items: flex-start; } } aside#aside .navigation_wrapper ul.list > li dl > dt { display: flex; align-items: center; column-gap: calc(8.5em / 12); } aside#aside .navigation_wrapper ul.list > li dl > dt::before { content: ''; display: block; width: .9em; min-width: .9em; height: .9em; border-radius: calc(8.5em / 48); background: rgba(255, 255, 255, 0.328); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#aside .navigation_wrapper ul.list > li dl > dt a, aside#aside .navigation_wrapper ul.list > li dl > dt div { display: flex; align-items: center; justify-content: space-between; column-gap: .615em; padding: calc(8.5em / 32 * 3) 0; font-size: 1.1275em; letter-spacing: -.01025em; line-height: 1; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper ul.list > li dl > dt a, aside#aside .navigation_wrapper ul.list > li dl > dt div { padding: calc(85px / 6) 0; } } aside#aside .navigation_wrapper ul.list > li dl > dt a > span, aside#aside .navigation_wrapper ul.list > li dl > dt div > span { position: relative; z-index: 15; display: flex; align-items: center; justify-content: center; width: 2em; height: 1em; border: solid 1px var(--color-white); border-radius: 50%; } aside#aside .navigation_wrapper ul.list > li dl > dt a > span i, aside#aside .navigation_wrapper ul.list > li dl > dt div > span i { position: absolute; top: calc(50% - (1px / 2)); left: calc(50% - (1em / 2)); display: block; width: 1em; height: 1px; background: var(--color-white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#aside .navigation_wrapper ul.list > li dl > dt a > span i:nth-child(2), aside#aside .navigation_wrapper ul.list > li dl > dt div > span i:nth-child(2) { left: calc(50% - (.5em / 2)); width: .5em; transform: rotate(90deg); } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper ul.list > li dl > dd { padding-bottom: calc(85px / 6); } } aside#aside .navigation_wrapper ul.list > li dl > dd ul.children { display: flex; align-items: center; flex-wrap: wrap; gap: calc(8em / 16); } aside#aside .navigation_wrapper ul.list > li dl > dd ul.children > li { width: 100%; } aside#aside .navigation_wrapper ul.list > li dl > dd a, aside#aside .navigation_wrapper ul.list > li dl > dd div { display: flex; align-items: center; column-gap: calc(8em / 32 * 3); border-radius: calc(85px / 24); font-size: 1em; font-weight: 600; line-height: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#aside .navigation_wrapper ul.list > li dl > dd a > .icon, aside#aside .navigation_wrapper ul.list > li dl > dd div > .icon { width: calc(8em / 16 * 7); min-width: calc(8em / 16 * 7); height: calc(8em / 16 * 7); border-radius: calc(8em / 32); overflow: hidden; } aside#aside .navigation_wrapper ul.list > li.other { padding: calc(8.5em / 8) 0; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper ul.list > li.other { padding: calc(8.5em / 8) 0; } } aside#aside .navigation_wrapper ul.list > li.other a { display: flex; align-items: center; column-gap: .615em; padding: 0; font-size: 1.3325em; letter-spacing: -.01025em; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper ul.list > li.other a { padding: 5px 0; font-size: 1.3325em; line-height: 1; } } aside#aside .navigation_wrapper ul.list > li.other a > i { display: block; width: 1em; height: 1em; } aside#aside .navigation_wrapper ul.list.inview > li { opacity: 0; } aside#aside .navigation_wrapper ul.list.action > li { opacity: 1; } aside#aside .navigation_wrapper ul.list.action > li:nth-child(0) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(1) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(2) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(3) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(4) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(5) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(6) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(7) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((7 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(8) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((8 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(9) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((9 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(10) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((10 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(11) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((11 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(12) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((12 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(13) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((13 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(14) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((14 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(15) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((15 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(16) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((16 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(17) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((17 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(18) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((18 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(19) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((19 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.list.action > li:nth-child(20) { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((20 * 0.0615s) + 0.1025s); } aside#aside .navigation_wrapper ul.social { display: flex; align-items: center; justify-content: center; column-gap: calc(8.5em / 8); filter: brightness(0) invert(1); } aside#aside .navigation_wrapper .foot { display: flex; align-items: center; flex-wrap: wrap; gap: calc(85px / 4); margin-top: calc(8.5em / 8 * 3); } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper .foot { margin-top: calc(8.5em / 8 * 2); } } aside#aside .navigation_wrapper .foot * { color: var(--color-white); } aside#aside .navigation_wrapper .foot ul.basic { display: flex; align-items: center; gap: calc(8.5em / 8); font-size: .85em; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper .foot ul.basic { width: 100%; justify-content: center; text-align: center; } } aside#aside .navigation_wrapper .foot ul.basic > li { display: flex; align-items: center; } @media screen and (max-width: 768px) { aside#aside .navigation_wrapper .foot ul.basic > li:last-child { display: none; } } aside#fixNav { position: fixed; top: 0; right: 0; z-index: 10001; display: flex; justify-content: center; align-items: center; width: calc(85px * 2); height: calc(85px * 1); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } @media screen and (max-width: 768px) { aside#fixNav { width: calc(60px * 2); height: calc(60px * 1); transform: translateY(0); } } aside#fixNav ._menu { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: var(--color-white); } aside#fixNav ._menu p.humbNav { display: flex; align-items: center; column-gap: calc(85px / 6); text-transform: uppercase; font-size: .9em; } aside#fixNav ._menu p.humbNav > span { order: 1; position: relative; display: flex; align-content: space-between; flex-wrap: wrap; width: 4.1em; height: .8em; margin: 0 auto; } aside#fixNav ._menu p.humbNav > span > i { display: block; width: 4.1em; height: 1px; background: var(--color-white); border-radius: 1px; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#fixNav ._menu p.humbNav.active > span { align-content: center; } aside#fixNav ._menu p.humbNav.active > span > i { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } aside#fixNav ._menu p.humbNav.active > span > i:nth-child(1) { transform: rotate(8deg) translateY(0.5px); } aside#fixNav ._menu p.humbNav.active > span > i:nth-child(2) { transform: rotate(-8deg) translateY(-0.5px); } nav.bside * { color: #e4e4e4; } nav.bside ul { display: flex; flex-wrap: wrap; } nav.bside ul li { width: 100%; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } nav.bside ul li:nth-child(0) { transition-delay: calc((0 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(1) { transition-delay: calc((1 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(2) { transition-delay: calc((2 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(3) { transition-delay: calc((3 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(4) { transition-delay: calc((4 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(5) { transition-delay: calc((5 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(6) { transition-delay: calc((6 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(7) { transition-delay: calc((7 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(8) { transition-delay: calc((8 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(9) { transition-delay: calc((9 * 0.041s) + 0.205s); } nav.bside ul li:nth-child(10) { transition-delay: calc((10 * 0.041s) + 0.205s); } nav.bside ul li ~ li { margin-top: 12px; } @media screen and (max-width: 768px) { nav.bside ul li ~ li { margin-top: 10px; } } nav.bside ul li.txt { margin-bottom: 15px; } @media screen and (max-width: 768px) { nav.bside ul li.txt { margin-bottom: 10px; } } nav.bside ul li.banar { position: relative; z-index: 15; border: solid 3px transparent; border-radius: 6px; overflow: hidden; margin-top: 3px; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } nav.bside ul li.banar:first-child { margin-top: 1.64em; } nav.bside ul li.banar > .bg { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; background: #ee781f; } nav.bside ul li.banar > .bg img { filter: brightness(0.7175); } nav.bside ul li.banar > a { padding: 1.435em; } nav.bside ul li.banar:hover { border-color: #2e6eb8; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } nav.bside dl { display: flex; flex-wrap: wrap; margin-bottom: -1.025em; } @media screen and (max-width: 768px) { nav.bside dl { margin-bottom: -10px; } } nav.bside dl > dt { display: block; width: 100%; height: 1.23em; margin-bottom: 12px; overflow: hidden; font-size: 2.05em; font-weight: 600; } @media screen and (max-width: 768px) { nav.bside dl > dt { font-size: 1.845em; margin-bottom: 10px; } } nav.bside dl > dt a { position: relative; position: relative; display: table; transform: translateY(1.23em); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } nav.bside dl > dd { margin-right: 2.05em; margin-bottom: 1.025em; } @media screen and (max-width: 768px) { nav.bside dl > dd { margin-bottom: 10px; } } nav.bside dl > dd a { opacity: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } nav.bside dl > dd:last-child { margin-right: 0; } #bside.move nav.bside ul li:nth-child(0) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(0) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(1) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(2) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(3) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(4) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(5) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(6) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((7 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(7) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((8 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(8) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((9 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(9) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dt a { transform: translateY(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((10 * 0.0615s) + 0.205s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(0) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((0 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(1) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((1 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(2) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((2 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(3) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((3 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(4) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((4 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(5) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((5 * 0.082s) + 0.615s); } #bside.move nav.bside ul li:nth-child(10) dl > dd:nth-child(6) a { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: calc((6 * 0.082s) + 0.615s); } /*!//#siteHeader------------------------------------------------------------------------------------------------*/ /*!#siteFooter------------------------------------------------------------------------------------------------*/ #siteFoot { position: relative; z-index: 15; width: 100%; overflow: hidden; } #siteFoot .wrapper { display: flex; flex-direction: column; flex-wrap: wrap; width: calc(100% / 32 * 30); margin: 0 auto; } @media screen and (max-width: 768px) { #siteFoot .wrapper { width: calc(100% / 32 * 32); } } #siteFoot .wrapper > ._primary { display: flex; gap: calc(8em / 8 * 2) calc(8em / 8 * 6); width: 100%; padding: calc(8em / 8 * 4); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._primary { padding: calc(8em / 16 * 5) calc(8em / 8 * 2); flex-direction: column-reverse; } } #siteFoot .wrapper > ._primary > .left { flex: 1; display: flex; flex-direction: column; gap: calc(8em / 16 * 4); } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._primary > .left { flex: initial; width: 100%; } } #siteFoot .wrapper > ._primary > .left .left_block hgroup + * { margin-top: calc(8em / 32 * 3); } #siteFoot .wrapper > ._primary > .right { flex: 2; display: flex; flex-direction: column; gap: calc(8em / 8 * 2); } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._primary > .right { flex: initial; gap: calc(8em / 16 * 3); width: 100%; } } #siteFoot .wrapper > ._secondary { display: flex; justify-content: space-between; width: 100%; padding: calc(8em / 8 * 2) 0; } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._secondary { align-items: center; flex-direction: column; } } #siteFoot .wrapper > ._secondary * { color: var(--white); } #siteFoot .wrapper > ._secondary > .left { font-size: .85em; } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._secondary > .left { order: 2; } } #siteFoot .wrapper > ._secondary > .right { font-size: .85em; } @media screen and (max-width: 768px) { #siteFoot .wrapper > ._secondary > .right { order: 1; display: none; } } #siteFoot .corp dl { display: flex; flex-direction: column; gap: calc(8em / 32); } #siteFoot .corp dl > dt { font-size: 1.025em; font-weight: 600; } #siteFoot .corp dl + * { margin-top: calc(8em / 16); } #siteFoot .recruit .banar { position: relative; z-index: 15; display: flex; align-items: flex-end; aspect-ratio: 2/1; border-radius: calc(8em / 32); overflow: hidden; } #siteFoot .recruit .banar > .background { position: absolute; top: 0; left: 0; z-index: -5; width: 100%; height: 100%; } #siteFoot .recruit .banar > .background::after { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent, var(--border-light-black)); } #siteFoot .recruit .banar > .background img { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot .recruit .banar > .text { display: flex; align-items: center; justify-content: space-between; column-gap: calc(8em / 32 * 3); width: 100%; padding: calc(8em / 32 * 4); } #siteFoot .recruit .banar > .text .text { font-weight: 600; color: var(--white); } #siteFoot .recruit .banar > .text .icon { display: flex; align-items: center; justify-content: center; width: 1.23em; height: 1.23em; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; line-height: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot .recruit .banar > .text .icon svg { fill: var(--white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot .recruit .banar:hover > .background img { transform: scale(1.05); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot .recruit .banar:hover > .text .icon { background: var(--color-black); } #siteFoot .social ul { display: flex; flex-direction: column; gap: calc(8em / 32 * 2); padding: calc(8em / 32 * 1) 0; } #siteFoot .social ul > li a { display: flex; align-items: center; gap: calc(8em / 32 * 3); } #siteFoot .social ul > li a .icon { display: block; width: 1.23em; height: 1.23em; } #siteFoot .footer_contact > .footer_contact-head { font-weight: 600; font-size: 2.46em; letter-spacing: -.0328em; } @media screen and (max-width: 768px) { #siteFoot .footer_contact > .footer_contact-head { font-size: 2.05em; } } #siteFoot .footer_contact > .footer_contact-body .comment_block { display: flex; gap: calc(8em / 32 * 3); } #siteFoot .footer_contact > .footer_contact-body .comment_block::before { content: ''; display: block; width: 1.3325em; min-width: 1.3325em; height: 1.3325em; margin: .41em 0; background: url("images/icon/comment.svg"); background-size: cover; } #siteFoot .footer_contact > .footer_contact-body .comment_block ~ .comment_block { margin-top: calc(8em / 32 * 6); } #siteFoot .footer_contact > .footer_contact-body .comment_block dl { display: flex; flex-direction: column; gap: calc(8em / 32); } #siteFoot .footer_contact > .footer_contact-body .comment_block dl > dt { font-size: 1.3325em; font-weight: 600; } @media screen and (max-width: 768px) { #siteFoot .footer_contact > .footer_contact-body .comment_block dl > dt { font-size: 1.23em; } } #siteFoot .footer_contact > .footer_contact-body .comment_block dl + * { margin-top: calc(8em / 16); } #siteFoot .footer_contact > .footer_contact-body .comment_block .answer { padding: calc(8em / 32 * 3) calc(8em / 32 * 4); background: var(--background1); border-radius: calc(8em / 32); overflow: hidden; color: var(--key1); } #siteFoot .footer_contact > .footer_contact-foot .callus { display: flex; flex-direction: column; align-items: center; padding: calc(8em / 16 * 3) calc(8em / 16 * 2); background: var(--background1); border-radius: calc(8em / 32); overflow: hidden; } #siteFoot .footer_contact > .footer_contact-foot .callus .number { font-size: 2.05em; font-weight: 600; letter-spacing: -.0328em; } #siteFoot .footer_contact > .footer_contact-foot .callus dl { display: flex; flex-direction: column; align-items: center; } #siteFoot .footer_contact > .footer_contact-foot .callus dl > dd { font-size: .75em; } #siteFoot .footer_contact > .footer_contact-foot .callus + * { margin-top: 1em; } #siteFoot .footer_contact > .footer_contact-foot ul { display: flex; gap: 1em; } #siteFoot .footer_contact > .footer_contact-foot ul > li { flex: 1; border-radius: calc(8em / 32); overflow: hidden; } #siteFoot .footer_contact > .footer_contact-foot ul > li:has(.mail) { background: var(--key1); } #siteFoot .footer_contact > .footer_contact-foot ul > li:has(.line) { background: var(--line); } #siteFoot .footer_contact > .footer_contact-foot ul > li a { display: flex; align-items: center; justify-content: center; gap: calc(8em / 32 * 3); min-height: 3.28em; } #siteFoot .footer_contact > .footer_contact-foot ul > li a .icon { display: block; width: 1.23em; height: 1.23em; } #siteFoot .footer_contact > .footer_contact-foot ul > li a * { color: var(--white); } #siteFoot nav.footer_navigation ul { display: flex; gap: calc(8em / 8); } #siteFoot nav.footer_navigation ul > li a { position: relative; z-index: 15; display: inline-flex; padding-bottom: calc(8.5em / 32); } @media screen and (max-width: 768px) { #siteFoot nav.footer_navigation ul > li a { display: flex; padding: calc(8.5em / 12) 0; } } #siteFoot nav.footer_navigation ul > li a::before, #siteFoot nav.footer_navigation ul > li a::after { content: ''; position: absolute; right: 0; bottom: 0; display: block; height: 1px; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot nav.footer_navigation ul > li a::before { width: 100%; background: var(--border-light-white); } #siteFoot nav.footer_navigation ul > li a::after { width: 0; background: var(--color-white); } #siteFoot nav.footer_navigation ul > li a:hover::after { width: 100%; left: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } #siteFoot nav.footer_navigation dl > dt { font-size: 1.1275em; } #siteFoot nav.footer_navigation dl > dt + dd { margin-top: calc(8.5em / 32 * 3); } #siteFoot nav.footer_navigation dl > dd { font-size: .85em; } @media screen and (max-width: 768px) { #siteFoot nav.footer_navigation dl > dd { display: none; } } #siteFoot nav.footer_navigation dl > dd ~ dd { margin-top: calc(8.5em / 32 * 2); } #siteFoot ul.social { display: flex; align-items: center; gap: calc(8.5em / 16 * 3); } #siteFoot ul.social > li a { display: block; } #siteFoot ul.social > li a i { display: block; width: calc(8.5em / 32 * 5); height: calc(8.5em / 32 * 5); } #siteFoot ul.social > li a i img { filter: brightness(0) invert(1); } #siteFoot ul.footer_basic { display: flex; align-items: center; gap: calc(8.5em / 16 * 2) calc(8.5em / 16 * 3); font-size: .9em; } @media screen and (max-width: 768px) { #siteFoot ul.footer_basic { flex-direction: column-reverse; } } #siteFoot ul.footer_basic > li a { position: relative; z-index: 15; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } #siteFoot ul.footer_basic > li a::before { content: ''; position: absolute; top: 100%; right: 0; display: block; width: 0; height: 1px; background: #231814; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } #siteFoot ul.footer_basic > li a:hover { opacity: .615; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } #siteFoot ul.footer_basic > li a:hover::before { left: 0; width: 100%; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -o-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -moz-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; -webkit-transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } #siteFoot ul.footer_basic > li p { color: var(--color-gray) !important; } #siteFoot ul.footer_basic img + li { color: #999; } @keyframes arrow { 0% { transform: translateX(-15px); } to { transform: translateX(0); } } /*//!#siteFooter----------------------------------------------------------------------------------------------*/ /*!#index----------------------------------------------------------------------------------------------*/ /*!#siteContent*/ #siteContent { position: relative; z-index: 15; width: 100%; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; transition-delay: .246s; } @media screen and (max-width: 768px) { #siteContent { width: 100%; overflow: hidden; margin-bottom: 0 !important; } } .slider { display: flex; align-items: center; } .slider .slider__inner { display: flex; align-items: center; } .slider .slider__inner:first-child { animation: loop 180s linear infinite; } .slider .slider__inner:nth-child(2) { animation: loop2 180s -120s linear infinite; } .slider .slider__inner:last-child { animation: loop3 180s -60s linear infinite; } @keyframes loop { 0% { transform: translateX(200%); } to { transform: translateX(-100%); } } @keyframes loop2 { 0% { transform: translateX(100%); } to { transform: translateX(-200%); } } @keyframes loop3 { 0% { transform: translateX(0%); } to { transform: translateX(-300%); } } .verticalslider { display: block; } .verticalslider .verticalslider__inner { display: block; } .verticalslider .verticalslider__inner:first-child { animation: loopV 180s linear infinite; } .verticalslider .verticalslider__inner:nth-child(2) { animation: loopV2 180s -120s linear infinite; } .verticalslider .verticalslider__inner:last-child { animation: loopV3 180s -60s linear infinite; } .verticalslider .verticalslider__inner .slider__item { width: 100%; padding: 5px 0; } .verticalslider .verticalslider__inner .slider__item .aspect { border-radius: 18px; overflow: hidden; } @media screen and (max-width: 768px) { .verticalslider .verticalslider__inner .slider__item .aspect { border-radius: 10px; } } @keyframes loopV { 0% { transform: translateY(200%); } to { transform: translateY(-100%); } } @keyframes loopV2 { 0% { transform: translateY(100%); } to { transform: translateY(-200%); } } @keyframes loopV3 { 0% { transform: translateY(0%); } to { transform: translateY(-300%); } } .hide_title { position: relative; z-index: 15; display: inline-flex; padding-bottom: calc(8.5em / 32); overflow: hidden; } .hide_title::before, .hide_title::after { content: ''; position: absolute; bottom: 0; left: 0; display: block; height: 1px; background: var(--color-text); } .hide_title::before { width: 100%; opacity: .205; } .hide_title::after { width: 0; } .hide_title span { display: block; transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -o-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -moz-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -webkit-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; transition-delay: .205s; } .hide_title.done span { transform: translateY(150%); } .hide_title.gone::after { width: 100%; transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -o-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -moz-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; -webkit-transition: all cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.615s; } .hide_title.gone span { transform: translateY(0); transition-delay: .5175s; } .button { display: flex; align-items: center; column-gap: calc(8em / 32 * 3); } .button .text { font-weight: 600; } .button .icon { display: flex; align-items: center; justify-content: center; width: 1.23em; height: 1.23em; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; line-height: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .button .icon svg { fill: var(--white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .button:hover .icon { background: var(--color-black); } .button.left { justify-content: flex-start; margin-left: 0; margin-right: auto; } .button.center { justify-content: center; margin-left: auto; margin-right: auto; } .button.right { justify-content: flex-end; margin-left: auto; margin-right: 0; } @keyframes arrowAnimation { 0% { transform: translateX(0); opacity: 1; } 25% { transform: translateX(30px); opacity: 0; } 55% { transform: translateX(-30px); opacity: 0; } 80% { transform: translateX(0); opacity: 1; } 100% { transform: translateX(0); opacity: 1; } } .noentry { filter: opacity(0.41) !important; pointer-events: none !important; cursor: not-allowed; } .comingsoon { display: flex; align-items: center; justify-content: center; width: 100%; height: 180px; background: #f7f7f7; filter: opacity(0.5); } hgroup:has(.underline) { display: flex; align-items: center; gap: calc(8em / 32 * 3); padding: calc(8em / 32 * 2) 0; border-bottom: dashed 1px; } hgroup:has(.underline)::before { content: ''; display: block; width: calc(8em / 64 * 3); height: calc(8em / 64 * 3); border-radius: calc(8em / 32 * 2); } hgroup:has(.white) { border-color: var(--white); } hgroup:has(.white)::before { background: var(--white); } hgroup:has(.blue) { border-color: var(--key1); } hgroup:has(.blue)::before { background: var(--key1); } .idx { position: relative; z-index: 15; } .idx.idx_mainvisual { z-index: 10; width: 100vw; padding: calc(8.5em / 8 * 5) 0 0; } @media screen and (max-width: 768px) { .idx.idx_mainvisual { padding: calc(8.5em / 8 * 4) 0 0; } } .idx.idx_mainvisual * { color: var(--white); } .idx.idx_mainvisual .idx_mainvisual-head { width: calc(100% / 32 * 28); margin-left: auto; } @media screen and (max-width: 768px) { .idx.idx_mainvisual .idx_mainvisual-head { width: 100%; aspect-ratio: 4/3; } } .idx.idx_mainvisual .idx_mainvisual-head .video { position: relative; z-index: 15; width: 100%; height: auto; } @media screen and (max-width: 768px) { .idx.idx_mainvisual .idx_mainvisual-head .video { height: 100%; } } .idx.idx_mainvisual .idx_mainvisual-head .video .play { position: absolute; bottom: calc(8em / -2); right: calc(100% / 32); z-index: 25; width: 8em; height: 8em; transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; cursor: pointer; } @media screen and (max-width: 768px) { .idx.idx_mainvisual .idx_mainvisual-head .video .play { bottom: calc(8em / 8); width: 6em; height: 6em; } } .idx.idx_mainvisual .idx_mainvisual-head .video .play img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; will-change: transform; transform-origin: 50% 50%; } .idx.idx_mainvisual .idx_mainvisual-head .video .play:hover { transform: scale(0.985); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .idx.idx_mainvisual .idx_mainvisual-head .video::after { content: ''; display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background: linear-gradient(to bottom, transparent, var(--border-light-black)); } .idx.idx_mainvisual .idx_mainvisual-body { position: relative; z-index: 15; width: calc(100% / 32 * 28); margin-top: -10.25em; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .idx.idx_mainvisual .idx_mainvisual-body { margin-top: -1.25em; } } .idx.idx_mainvisual .idx_mainvisual-body .copy { width: 65%; height: auto; } .idx.idx_mainvisual .idx_mainvisual-body p { margin-top: 1em; font-size: 1.23em; } .idx.idx_mainvisual + * { margin-top: calc(8em / 16 * 8); } @media screen and (max-width: 768px) { .idx.idx_mainvisual + * { margin-top: calc(8em / 16 * 6); } } .idx.index_information .wrapper { width: calc(100% / 32 * 28); margin-left: auto; margin-right: auto; } .idx.index_information .index_information-head { padding: calc(8em / 32 * 2) 0; border-top: solid 2px var(--white); font-size: 1.435em; font-weight: 600; letter-spacing: -.041em; color: var(--white); } .idx.index_information .index_information-body * { color: var(--white); } .idx.index_information .index_information-body ul { border-top: dashed 1px var(--white); } .idx.index_information .index_information-body ul > li { border-bottom: dashed 1px var(--white); } .idx.index_information .index_information-body ul > li a { display: flex; align-items: center; gap: calc(8em / 32 * 1) calc(8em / 32 * 4); padding: calc(8em / 32 * 3) 0; } @media screen and (max-width: 768px) { .idx.index_information .index_information-body ul > li a { flex-wrap: wrap; } } .idx.index_information .index_information-body ul > li a > time { font-size: .9em; } .idx.index_information .index_information-body ul > li a > .category { display: flex; align-items: center; justify-content: center; width: 8em; min-height: 2em; padding: 0 calc(8em / 32 * 3); border: solid 1px var(--white); border-radius: calc(8em / 32); overflow: hidden; font-size: .75em; } @media screen and (max-width: 768px) { .idx.index_information .index_information-body ul > li a > .title { width: 100%; } } .idx.index_outline { padding: 6em 0; } @media screen and (max-width: 768px) { .idx.index_outline { padding: 4em 0; } } .idx.index_outline * { color: var(--white); } .idx.index_outline .wrapper { width: calc(100% / 32 * 30); margin-left: auto; margin-right: auto; } .idx.index_outline .index_outline-head .kagoshima { display: flex; justify-content: center; } .idx.index_outline .index_outline-head dl { display: flex; align-items: center; flex-direction: column; } .idx.index_outline .index_outline-head dl > dt { font-size: 1.845em; letter-spacing: .1025em; text-align: center; } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-head dl > dt { font-size: 1.64em; } } .idx.index_outline .index_outline-head dl > dt i { position: relative; z-index: 15; } .idx.index_outline .index_outline-head dl > dt i svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -40%); width: 110%; } .idx.index_outline .index_outline-head dl > dd { font-size: .9em; color: var(--key2); } .idx.index_outline .index_outline-head + * { margin-top: calc(8em / 16 * 5); } .idx.index_outline .index_outline-body .outline-container { position: relative; z-index: 15; padding-bottom: calc(8em / 8 * 2); --swiper-scrollbar-drag-bg-color: var(--white); } .idx.index_outline .index_outline-body .outline-container ul { counter-reset: num; } .idx.index_outline .index_outline-body .outline-container ul > li { height: auto; padding: calc(8em / 16 * 4); background: var(--border-light-white); border: solid 1px var(--white); border-radius: calc(8em / 32); overflow: hidden; } .idx.index_outline .index_outline-body .outline-container ul > li::before { counter-increment: num; content: "( Fact 0" counter(num) " )"; display: block; margin-bottom: calc(8em / 32); font-size: .9em; text-align: center; } .idx.index_outline .index_outline-body .outline-container ul > li .title { font-weight: 600; font-size: 1.3325em; letter-spacing: .041em; text-align: center; } .idx.index_outline .index_outline-body .outline-container ul > li .image { width: 100%; max-width: 150px; margin: calc(8em / 16 * 5) auto; } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-body .outline-container ul > li .image { max-width: 120px; margin: calc(8em / 16 * 3) auto; } } .idx.index_outline .index_outline-body + * { margin-top: calc(8em / 16 * 6); } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-body + * { margin-top: calc(8em / 16 * 4); } } .idx.index_outline .index_outline-foot { display: flex; align-items: center; flex-direction: column; } .idx.index_outline .index_outline-foot ul { display: flex; align-items: center; justify-content: center; gap: calc(8em / 64 * 6) calc(8em / 64 * 3); } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-foot ul { flex-wrap: wrap; } } .idx.index_outline .index_outline-foot ul > li { display: flex; align-items: center; justify-content: space-between; gap: calc(8em / 64 * 3); min-width: 12em; } .idx.index_outline .index_outline-foot ul > li::before, .idx.index_outline .index_outline-foot ul > li::after { content: ''; display: block; width: 1.3325em; height: auto; aspect-ratio: 53 / 150; background: url(images/icon/crown.svg); filter: brightness(0) invert(1); } .idx.index_outline .index_outline-foot ul > li::after { transform: rotateY(180deg); } .idx.index_outline .index_outline-foot ul > li .text { display: flex; align-items: center; flex-direction: column; gap: calc(8em / 64 * 2); } .idx.index_outline .index_outline-foot ul > li .text .title { font-weight: 600; font-size: .75em; } .idx.index_outline .index_outline-foot ul > li .text .count { display: flex; align-items: end; } .idx.index_outline .index_outline-foot ul > li .text .count .attr { font-weight: 600; font-size: .8em; line-height: 1; } .idx.index_outline .index_outline-foot ul > li .text .count .num { font-weight: 600; font-size: 2.255em; line-height: .85; } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-foot ul > li .text .count .num { font-size: 2.05em; } } .idx.index_outline .index_outline-foot ul + * { margin-top: calc(8em / 16 * 3); } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-foot ul + * { margin-top: calc(8em / 16 * 2); } } .idx.index_outline .index_outline-foot .endtitle { display: flex; align-items: center; justify-content: center; gap: calc(8em / 16 * 3); font-size: 1.3325em; letter-spacing: .1025em; } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-foot .endtitle { gap: calc(8em / 16 * 2); font-size: 1.23em; text-align: center; } } .idx.index_outline .index_outline-foot .endtitle::before, .idx.index_outline .index_outline-foot .endtitle::after { content: ''; display: block; width: 8em; height: 2px; background: linear-gradient(to left, var(--white), transparent); } @media screen and (max-width: 768px) { .idx.index_outline .index_outline-foot .endtitle::before, .idx.index_outline .index_outline-foot .endtitle::after { width: 3em; } } .idx.index_outline .index_outline-foot .endtitle::after { transform: rotateY(180deg); } .idx.index_service * { color: var(--color-black); } .idx.index_service .index_service-head { padding: calc(8em / 16 * 3) 0; background: var(--white); } .idx.index_service .index_service-head .wrapper { width: calc(100% / 32 * 28); margin-left: auto; margin-right: auto; } .idx.index_service .index_service-head dl > dt + dd { margin-top: calc(8rem / 16); } @media screen and (max-width: 768px) { .idx.index_service .index_service-head dl > dt + dd { margin-top: calc(8rem / 32 * 3); } } .idx.index_service .index_service-head dl > dd { font-size: 1.845em; font-weight: 600; } @media screen and (max-width: 768px) { .idx.index_service .index_service-head dl > dd { font-size: 1.64em; } } .idx.index_service .index_service-head dl > dd b { color: var(--key1); } .idx.index_service .index_service-body { padding: calc(8em / 16 * 6) 0; background: var(--background1); } @media screen and (max-width: 768px) { .idx.index_service .index_service-body { padding: calc(8em / 16 * 5) 0; } } .idx.index_service .index_service-body .wrapper { width: calc(100% / 32 * 28); margin-left: auto; margin-right: auto; } .idx.index_service .index_service-body ul { display: flex; flex-direction: column; gap: 1em; } @media screen and (max-width: 768px) { .idx.index_service .index_service-body ul { gap: 1.5em; } } @media screen and (max-width: 768px) { .idx.index_service .index_service-body ul > li { padding-bottom: calc(8em / 32 * 5); border-bottom: dashed 1px var(--key1); } } .idx.index_service .index_service-body ul > li a { display: flex; align-items: center; gap: calc(8em / 16 * 3) calc(8em / 16 * 6); } @media screen and (max-width: 768px) { .idx.index_service .index_service-body ul > li a { flex-direction: column; } } .idx.index_service .index_service-body ul > li a .head { display: flex; align-items: center; gap: calc(8em / 16 * 4); } @media screen and (max-width: 768px) { .idx.index_service .index_service-body ul > li a .head { width: 100%; gap: calc(8em / 16 * 3); } } .idx.index_service .index_service-body ul > li a .head .image { display: block; width: calc(8em / 16 * 16); min-width: calc(8em / 16 * 16); height: calc(8em / 16 * 16); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .idx.index_service .index_service-body ul > li a .head .image { width: calc(8em / 16 * 12); min-width: calc(8em / 16 * 12); height: calc(8em / 16 * 12); } } .idx.index_service .index_service-body ul > li a .head .image img { transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .idx.index_service .index_service-body ul > li a .head .title .jp { font-size: 1.3325em; font-weight: 600; } .idx.index_service .index_service-body ul > li a .head .title .en { font-size: .8em; color: var(--key1); letter-spacing: -.0205em; } .idx.index_service .index_service-body ul > li a .body { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: calc(8em / 16 * 2); } .idx.index_service .index_service-body ul > li a .body .icon { display: flex; align-items: center; justify-content: center; width: 2em; min-width: 2em; height: 2em; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .idx.index_service .index_service-body ul > li a .body .icon svg { fill: var(--white); } .idx.index_service .index_service-body ul > li a:hover .head .image img { transform: scale(1.05); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .idx.index_service .index_service-body ul > li a:hover .body .icon { background: var(--color-black); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .idx.index_service .backstep2 { position: relative; z-index: 15; width: 100%; clip-path: inset(0% 2.7778% round calc(8em / 16)); overflow: hidden; } @media screen and (max-width: 768px) { .idx.index_service .backstep2 { clip-path: inset(0% 2.7778% round calc(8em / 16)); } } .idx.index_comment { padding: 6em 0 8em; } @media screen and (max-width: 768px) { .idx.index_comment { padding: 4em 0; } } .idx.index_comment * { color: var(--white); } .idx.index_comment .wrapper { width: calc(100% / 32 * 28); margin-left: auto; margin-right: auto; } .idx.index_comment .wrapper .index_comment-head + * { margin-top: 3em; } .idx.index_comment .wrapper .index_comment-body ul { display: flex; } @media screen and (max-width: 768px) { .idx.index_comment .wrapper .index_comment-body ul { flex-direction: column; } } .idx.index_comment .wrapper .index_comment-body ul > li { width: calc(100% / 3); position: relative; z-index: 15; display: flex; flex-direction: column; gap: calc(8em / 32 * 3); } @media screen and (max-width: 768px) { .idx.index_comment .wrapper .index_comment-body ul > li { width: 100%; } } .idx.index_comment .wrapper .index_comment-body ul > li::before, .idx.index_comment .wrapper .index_comment-body ul > li::after { content: ''; position: absolute; display: block; width: calc(8em / 32 * 4); height: calc(8em / 32 * 4); } .idx.index_comment .wrapper .index_comment-body ul > li::before { top: 0; left: 0; border-top: solid 1px var(--white); border-left: solid 1px var(--white); border-top-left-radius: calc(8em / 32 * 2); } .idx.index_comment .wrapper .index_comment-body ul > li::after { right: 0; bottom: 0; border-right: solid 1px var(--white); border-bottom: solid 1px var(--white); border-bottom-right-radius: calc(8em / 32 * 2); } .idx.index_comment .wrapper .index_comment-body ul > li a { display: flex; flex-direction: column; gap: calc(8em / 32 * 3); padding: calc(8em / 16 * 5); } @media screen and (max-width: 768px) { .idx.index_comment .wrapper .index_comment-body ul > li a { width: 100%; padding: calc(8em / 16 * 3); } } .idx.index_comment .wrapper .index_comment-body ul > li .image { display: flex; align-items: center; justify-content: center; padding: 2em 0; aspect-ratio: 3/2; background: var(--white); border-radius: calc(8em / 32); overflow: hidden; } .idx.index_comment .wrapper .index_comment-body ul > li .image img { width: auto; max-width: 100%; height: auto; max-height: 100%; } .idx.index_comment .wrapper .index_comment-body ul > li .wrote { color: var(--key1); } header#pageHeader { position: relative; z-index: 15; padding: 0 32px; padding-top: calc((8.5em / 8) * 5); } @media screen and (max-width: 768px) { header#pageHeader { padding: 0 16px; padding-top: calc(8.5em / 8 * 4); } } header#pageHeader:has(.calusel) { overflow: hidden; } header#pageHeader .calusel .slider .slider__inner { align-items: initial; } header#pageHeader .calusel .slider .slider__inner .slider__item { width: calc(8em / 8 * 18); padding: calc(8em / 16); } @media screen and (max-width: 768px) { header#pageHeader .calusel .slider .slider__inner .slider__item { width: calc(8em / 8 * 12); padding: calc(8em / 32); } } header#pageHeader .calusel .slider:hover .slider__inner { animation-play-state: paused; } header#pageHeader .calusel .slider + .slider .slider__inner { animation-direction: reverse; } header#pageHeader .calusel + .wrapper { padding-top: 0; margin-top: calc(8em / 8 * -2); } header#pageHeader .background { position: absolute; top: 0; right: 0; z-index: -5; aspect-ratio: 2.35/1; opacity: .205; } header#pageHeader .background .inner { width: 100%; max-width: 860px; margin-left: auto; transform: translateY(-25%); } header#pageHeader .wrapper { display: flex; align-items: center; gap: calc(8em / 8 * 2) calc(8em / 8 * 4); width: calc(100% / 16 * 15); margin: 0 auto; padding: calc(8em / 8 * 4) 0; } @media screen and (max-width: 768px) { header#pageHeader .wrapper { flex-direction: column; width: 100%; padding: calc(8em / 8 * 3) 0; } } header#pageHeader .wrapper > .image { flex: 1; line-height: 0; border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { header#pageHeader .wrapper > .image { aspect-ratio: 16/9; } } header#pageHeader .wrapper > .text { flex: 3; display: flex; flex-direction: column; gap: calc(8em / 8 * 3); } @media screen and (max-width: 768px) { header#pageHeader .wrapper > .text { gap: calc(8em / 16 * 3); width: calc(100% / 16 * 15); margin-left: auto; margin-right: auto; } } header#pageHeader .wrapper hgroup { position: relative; z-index: 15; display: flex; flex-direction: column; align-items: baseline; } header#pageHeader .wrapper hgroup h1 { display: flex; align-items: center; gap: calc(8.5em / 64 * 3); color: var(--white); font-size: 2.87em; font-weight: 600; } @media screen and (max-width: 768px) { header#pageHeader .wrapper hgroup h1 { font-size: 2.255em; } } header#pageHeader .wrapper hgroup span { position: relative; z-index: 15; font-size: 1.1275em; font-weight: 400; letter-spacing: -.041em; line-height: 1.23; color: var(--key2); text-transform: capitalize; } @media screen and (max-width: 768px) { header#pageHeader .wrapper hgroup span { font-size: 1em; } } .anker_navigation { font-size: .9em; } .anker_navigation * { color: var(--white); } .anker_navigation ul { display: flex; align-items: center; gap: calc(1em / 2) calc(1em * 2); } @media screen and (max-width: 768px) { .anker_navigation ul { flex-wrap: wrap; gap: calc(1em / 2) calc(1em / 2 * 3); } } .anker_navigation ul > li a { display: flex; align-items: center; flex-direction: row-reverse; gap: calc(1em / 4 * 3); } .anker_navigation ul > li a span { display: block; } .anker_navigation ul > li a span.icon { display: flex; align-items: center; justify-content: center; width: 1.23em; min-width: 1.23em; height: 1.23em; background: var(--key1); border-radius: calc(1em / 8); } .anker_navigation ul > li a span.icon svg { fill: var(--white); transform: rotate(90deg); } .anker_navigation ul > li a span.text { font-weight: 600; } .rollIn h1, .rollIn span { transform: translateY(100%); opacity: 0; transition: transform 0.6s ease, opacity 0.6s ease; } .rollIn.is-visible h1, .rollIn.is-visible span { transform: translateY(0); opacity: 1; } .rollIn.is-visible h1 { transition-delay: 0.2s; } .rollIn.is-visible span { transition-delay: 0.4s; } .-page { position: relative; z-index: 25; } .-page > .wrapper { display: block; width: calc(100% / 16 * 15); margin: 0 auto; padding: calc(8.5em / 8 * 4) 0 calc(8.5em / 8 * 8); } @media screen and (max-width: 768px) { .-page > .wrapper { padding: calc(8.5em / 16 * 4) 0 calc(8.5em / 16 * 6); } } .-page > .wrapper.flex_wrapper { display: flex; flex-wrap: wrap; gap: calc(8.5em / 8 * 2) calc(8.5em / 8 * 2); } @media screen and (max-width: 768px) { .-page > .wrapper.flex_wrapper { flex-direction: column; } } .-page > .wrapper.flex_wrapper > .left_side { width: calc(8.5em / 8 * 14); } @media screen and (max-width: 768px) { .-page > .wrapper.flex_wrapper > .left_side { display: none; } } .-page > .wrapper.flex_wrapper > .left_side .sticky { top: calc(8.5em / 1); } .-page > .wrapper.flex_wrapper > .left_side .sticky h5 { display: flex; align-items: center; column-gap: calc(8.5em / 24); font-size: 1em; font-weight: 500; text-transform: uppercase; } .-page > .wrapper.flex_wrapper > .left_side .sticky h5::before { content: ''; display: block; width: 1em; height: 1em; background: url(images/icon/menu.svg); } .-page > .wrapper.flex_wrapper > .left_side .sticky h5 + * { margin-top: calc(8.5em / 8); } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul { counter-reset: num; display: flex; flex-direction: column; gap: calc(8.5em / 12); } @media screen and (max-width: 768px) { .-page > .wrapper.flex_wrapper > .left_side .sticky > ul { padding: calc(8.5em / 16 * 3); background: #f7f7f7; border-radius: calc(8.5em / 16 * 1); } } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul > li { display: flex; align-items: center; opacity: .5; } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul > li a { display: flex; align-items: center; gap: calc(8.5em / 16); font-weight: 600; font-size: .9em; } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul > li a::before { counter-increment: num; content: "0" counter(num); display: flex; align-items: center; justify-content: center; width: 2.05em; min-width: 2.05em; height: 2.05em; background: linear-gradient(135deg, var(--color-black) 75%, var(--color-key4)); border-radius: calc(8.5em / 32); overflow: hidden; font-weight: 500; color: var(--color-white); } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul > li.active, .-page > .wrapper.flex_wrapper > .left_side .sticky > ul > li:hover { opacity: 1; } .-page > .wrapper.flex_wrapper > .left_side .sticky > ul.anker > li a::before { content: ''; width: .41em; min-width: .41em; height: .615em; clip-path: polygon(0 0, 100% 50%, 0 100%); } .-page > .wrapper.flex_wrapper > .right_side { width: calc(100% - ((8.5em / 8 * 14) + (8.5em / 8 * 2))); min-width: 767px; } @media screen and (max-width: 768px) { .-page > .wrapper.flex_wrapper > .right_side { width: 100%; min-width: 100%; } } .-page > .wrapper.document_wrapper { width: calc(100% / 16 * 12); } @media screen and (max-width: 768px) { .-page > .wrapper.document_wrapper { width: calc(100% / 16 * 14); } } .-page .page_main .page_body .page_block { padding: calc(8em / 8 * 6) 0; } @media screen and (max-width: 768px) { .-page .page_main .page_body .page_block { padding: calc(8em / 8 * 3) 0; } } .-page .page_main .page_body .page_block hgroup + .page_cell { margin-top: calc(8em / 8 * 4); } @media screen and (max-width: 768px) { .-page .page_main .page_body .page_block hgroup + .page_cell { margin-top: calc(8em / 8 * 2); } } .-page .page_main .page_body .page_block hgroup ~ hgroup { margin-top: calc(8em / 8 * 6); } @media screen and (max-width: 768px) { .-page .page_main .page_body .page_block hgroup ~ hgroup { margin-top: calc(8em / 8 * 3); } } .-page .page_main .page_body .page_block .page_cell ~ .page_cell { margin-top: calc(8em / 8 * 4); } @media screen and (max-width: 768px) { .-page .page_main .page_body .page_block .page_cell ~ .page_cell { margin-top: calc(8em / 8 * 2); } } .-page .page_main .page_body .seplate { width: calc(100% / 30 * 32); margin-left: calc(100% / 30 * -1); margin-right: calc(100% / 30 * -1); } .-page .page_main .page_body .seplate.medium { aspect-ratio: 2.35/1; overflow: hidden; } @media screen and (max-width: 768px) { .-page .page_main .page_body .seplate.medium { aspect-ratio: 16/9; } } .-page .page_main .page_body .seplate.medium .inner { height: calc(100% + 80px); } header#singleHeader { position: relative; z-index: 15; margin-top: calc(30px + (8.5em / 32 * 22)); } @media screen and (max-width: 768px) { header#singleHeader { margin-top: calc(25px + (8.5em / 32 * 14)); } } header#singleHeader .wrapper { display: flex; align-items: flex-start; flex-direction: column; gap: calc(8.5em / 8 * 1); width: calc(100% / 32 * 27); margin: 0 auto; padding-top: calc(8.5em / 2); } @media screen and (max-width: 768px) { header#singleHeader .wrapper { width: calc(100% / 32 * 28); padding-top: calc(8.5em / 8 * 2); } } header#singleHeader .wrapper hgroup { position: relative; z-index: 15; } header#singleHeader .wrapper hgroup h1 { font-size: 2.46em; font-weight: normal; line-height: 1.435; } @media screen and (max-width: 768px) { header#singleHeader .wrapper hgroup h1 { font-size: 1.64em; } } header#singleHeader .wrapper .publish { display: flex; align-items: center; column-gap: calc(8.5em / 12); } header#singleHeader .wrapper .publish p { display: flex; align-items: center; justify-content: center; padding: calc(8.5em / 64 * 1) calc(8.5em / 64 * 5); background: var(--color-lightgray); border-radius: 8.5em; overflew: hidden; } header#singleHeader .wrapper .publish time { color: var(--color-gray); } article.-single { position: relative; z-index: 25; } article.-single > .wrapper { display: block; width: calc(100% / 16 * 14); margin: 0 auto; padding: calc(8.5em / 8 * 4) 0 calc(8.5em / 8 * 8); } article.-single > .wrapper.flex_wrapper { display: flex; flex-wrap: wrap; gap: calc(8.5em / 8 * 2) calc(8.5em / 8 * 4); } @media screen and (max-width: 768px) { article.-single > .wrapper.flex_wrapper { flex-direction: column; } } article.-single > .wrapper.flex_wrapper > .left_side { flex: 2; min-width: calc(8.5em / 8 * 8); } @media screen and (max-width: 768px) { article.-single > .wrapper.flex_wrapper > .left_side { display: none; } } article.-single > .wrapper.flex_wrapper > .left_side .sticky { top: calc(8.5em / 1); } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation { display: flex; flex-direction: column; gap: calc(8.5em / 12); } @media screen and (max-width: 768px) { article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation { padding: calc(8.5em / 16 * 3); background: #f7f7f7; border-radius: calc(8.5em / 16 * 1); } } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li { display: flex; align-items: center; column-gap: calc(8.5em / 16); opacity: .5; } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li::after { content: ''; display: block; width: 1.23em; height: 1.23em; background: url(images/icon/arrow.svg); opacity: 0; transform: translateX(calc(8.5em / -16)); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li a { font-weight: 700; font-size: 1.435em; } @media screen and (max-width: 768px) { article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li a { font-size: 1.23em; } } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li.current, article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li:hover { opacity: 1; } article.-single > .wrapper.flex_wrapper > .left_side .sticky > ul.navigation > li:hover::after { opacity: 1; transform: translateX(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } article.-single > .wrapper.flex_wrapper > .left_side .sticky .title { display: flex; align-items: center; gap: calc(8.5em / 16); margin-top: calc(8.5em / 16 * 4); } article.-single > .wrapper.flex_wrapper > .left_side .sticky .title::before { content: ''; display: block; width: calc(8.5em / 32); height: 1em; background: linear-gradient(to bottom, var(--color-key1) 50%, var(--color-key3) 50%); } article.-single > .wrapper.flex_wrapper > .left_side .sticky .title + * { margin-top: calc(8.5em / 8); } article.-single > .wrapper.flex_wrapper > .right_side { flex: 7; } article.-single > .wrapper.flex_wrapper::after { content: ''; flex: 2; display: block; } @media screen and (max-width: 768px) { article.-single > .wrapper.flex_wrapper::after { display: none; } } article.-single .single_main .thumbnail + * { margin-top: calc(8.5em / 16 * 3); } article.-single .single_main .single_body { display: flex; flex-direction: column; gap: calc(8.5em / 16 * 1); } article.-single .single_main .single_body + * { margin-top: calc(8.5em / 16 * 3); } article.-single .single_main a { color: var(--color-key1); text-decoration: underline; } article.-single .single_main a * { color: var(--color-key1); } .page_ .wrapper { width: calc(100% / 16 * 12); margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .page_ .wrapper { width: calc(100% / 16 * 14); } } .page_ .column { display: flex; } @media screen and (max-width: 768px) { .page_ .column { flex-direction: column; } } .page_ .column > .column-left { flex: 1; } .page_ .column > .column-left .column-title { font-size: 2em; letter-spacing: -.0205em; } @media screen and (max-width: 768px) { .page_ .column > .column-left .column-title { display: none; } } .page_ .column > .column-left .column-subtitle { font-size: .9em; letter-spacing: .0205em; font-weight: 600; } @media screen and (max-width: 768px) { .page_ .column > .column-left .column-subtitle { font-size: 1.23em; margin-bottom: 1em; } } .page_ .column > .column-right { flex: 4; } .page_company-core { background: var(--white); } .page_company-core .page_company-core-body .core_title { font-size: .9em; text-align: center; letter-spacing: -.0205em; } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .core_title { display: flex; align-items: center; justify-content: center; height: 2em; margin-bottom: 1em; background: var(--background3); } } .page_company-core .page_company-core-body .page_company-core_mission { font-size: 1.64em; font-weight: 600; line-height: 1.64; } .page_company-core .page_company-core-body .page_company-core_mission b { color: var(--key1); } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_mission b { display: block; } } .page_company-core .page_company-core-body .page_company-core_vision { display: flex; gap: 1em calc(1em * 2); } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_vision { flex-direction: column; } } .page_company-core .page_company-core-body .page_company-core_vision .card { flex: 1; } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_vision .card { flex: initial; width: 100%; } } .page_company-core .page_company-core-body .page_company-core_vision .card .title { display: flex; align-items: center; gap: calc(1em / 2); } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_vision .card .title { justify-content: center; } } .page_company-core .page_company-core-body .page_company-core_vision .card .title .icon { display: block; width: 1.23em; height: 1.23em; } .page_company-core .page_company-core-body .page_company-core_vision .card .title .text { font-size: .9em; font-weight: 600; } .page_company-core .page_company-core-body .page_company-core_vision .card .title + * { margin-top: calc(1em / 4 * 3); } .page_company-core .page_company-core-body .page_company-core_vision .card .content { display: flex; align-items: center; justify-content: center; flex-direction: column; padding: calc(1em / 4 * 6); background: var(--background1); border-radius: calc(1em / 4); overflow: hidden; font-weight: 600; text-align: center; } .page_company-core .page_company-core-body .page_company-core_vision .card .content b { font-size: 1.3325em; } .page_company-core .page_company-core-body .page_company-core_value { display: flex; flex-direction: column; gap: calc(1em / 2 * 3); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-head { text-align: justify; line-height: 1.5; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-body ul { display: flex; flex-wrap: wrap; gap: calc(1em / 4 * 3); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-body ul > li { display: flex; align-items: center; justify-content: center; width: calc((100% / 4) - ((1em / 4 * 3) * 3 / 4)); min-height: 2.46em; border: dashed 1px var(--key1); border-radius: calc(1em / 4 * 1); } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-body ul > li { width: calc((100% / 2) - ((1em / 4 * 3) * 1 / 2)); min-height: 2.255em; } } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-body ul > li.current { border-style: solid; background: var(--key1); color: var(--white); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot { position: relative; z-index: 15; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody { position: absolute; top: 0; left: 0; display: flex; gap: 1em 2em; width: 100%; padding: 2em 3em; background: var(--background1); border-radius: calc(1em / 4 * 1); overflow: hidden; opacity: 0; visibility: hidden; pointer-events: none; } @media screen and (max-width: 768px) { .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody { flex-direction: column; padding: 1.5em 2em; } } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody.current { position: relative; opacity: 1; visibility: visible; pointer-events: auto; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .title { flex: 1; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .title .jp { font-size: 1.23em; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .title .en { font-size: .8em; color: var(--key2); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .content { flex: 3; } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .content ul { display: flex; flex-direction: column; gap: calc(1em / 4 * 1); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .content ul > li { display: flex; align-items: baseline; gap: calc(1em / 4 * 3); } .page_company-core .page_company-core-body .page_company-core_value .page_company-core_value-foot .switchBody > .content ul > li::before { content: ''; display: block; width: .8em; min-width: .8em; height: .8em; background: var(--key2); border-radius: 1em; } .page_company-message { padding-top: 0 !important; } .page_company-message * { color: var(--white); } .page_company-message .page_company-message_thumbnail { display: block; width: 100%; padding: calc(8em / 8); } @media screen and (max-width: 768px) { .page_company-message .page_company-message_thumbnail { padding: calc(8em / 16); } } .page_company-message .page_company-message_thumbnail .image { aspect-ratio: 2.35/1; border-radius: calc(8em / 16); overflow: hidden; } .page_company-message .page_company-message_thumbnail + * { margin-top: calc(8em / 8 * 4); } @media screen and (max-width: 768px) { .page_company-message .page_company-message_thumbnail + * { margin-top: calc(8em / 8 * 2); } } .page_company-message .page_company-message-body dl > dt { font-weight: 600; font-size: 1.845em; line-height: 1.64; } @media screen and (max-width: 768px) { .page_company-message .page_company-message-body dl > dt { font-size: 1.5525em; } } .page_company-message .page_company-message-body dl > dt + * { margin-top: calc(8em / 8 * 1); } .page_company-message .page_company-message-body dl > dd { line-height: 2; text-align: justify; } @media screen and (max-width: 768px) { .page_company-message .page_company-message-body dl > dd { line-height: 1.8; } } .page_company-message .page_company-message-body + * { margin-top: calc(1em * 2); } @media screen and (max-width: 768px) { .page_company-message .page_company-message-body + * { margin-top: calc(1em * 1.5); } } .page_company-message .page_company-message-foot { display: flex; align-items: center; gap: calc(1em / 2 * 3); } .page_company-message .page_company-message-foot .icon { width: calc(1em * 5); height: calc(1em * 5); border: solid calc(1em / 8 * 3) var(--border-light-white); border-radius: 50%; overflow: hidden; } .page_company-outline { background: var(--white); } .page_company-outline .page_company-outline_outline ul.table { display: flex; flex-direction: column; gap: calc(1em /2 * 3); } @media screen and (max-width: 768px) { .page_company-outline .page_company-outline_outline ul.table { gap: calc(1em /2 * 2); } } .page_company-outline .page_company-outline_outline ul.table > li { display: flex; } @media screen and (max-width: 768px) { .page_company-outline .page_company-outline_outline ul.table > li { flex-direction: column; } } .page_company-outline .page_company-outline_outline ul.table > li > .title { flex: 1; } @media screen and (max-width: 768px) { .page_company-outline .page_company-outline_outline ul.table > li > .title { font-weight: 600; } } .page_company-outline .page_company-outline_outline ul.table > li > .content { flex: 4; } .page_company-outline .page_company-outline_outline ul.disc > li { display: flex; align-items: center; gap: calc(1em / 4 * 3); } .page_company-outline .page_company-outline_outline ul.disc > li::before { content: ''; display: block; width: .8em; min-width: .8em; height: .8em; background: var(--key2); border-radius: 1em; } .page_company-outline .page_company-outline_access .page_company-outline_access-head { width: 100%; aspect-ratio: 2.35/1; overflow: hidden; } .page_company-outline .page_company-outline_access .page_company-outline_access-head + * { margin-top: 1em; } .page_company-outline .page_company-outline_access .page_company-outline_access-body { width: 100%; display: flex; align-items: center; flex-direction: column; gap: 1em; } .page_company-outline .page_company-outline_scope { display: flex; align-items: center; justify-content: center; gap: calc(1em * 2); } @media screen and (max-width: 768px) { .page_company-outline .page_company-outline_scope { flex-direction: column; gap: calc(1em * 1); } } .page_company-outline .page_company-outline_scope .card { display: flex; align-items: center; flex-direction: column; gap: calc(1em / 2 * 2); min-width: 400px; padding: calc(1em / 2 * 5); background: var(--background1); border-radius: calc(1em / 4); } @media screen and (max-width: 768px) { .page_company-outline .page_company-outline_scope .card { min-width: initial; width: 100%; padding: calc(1em / 2 * 4); } } .page_company-outline .page_company-outline_scope .card .title { display: flex; align-items: center; flex-direction: column; } .page_company-outline .page_company-outline_scope .card .title .jp { font-weight: 600; } .page_company-outline .page_company-outline_scope .card .title .en { color: var(--key1); } .page_company-outline .page_company-outline_scope .card .content { display: flex; align-items: center; justify-content: center; flex-direction: column; min-height: 3em; font-weight: 600; font-size: 1.3325em; } .page_company-history * { color: var(--white); } .page_company-history ul.timeline { display: flex; flex-direction: column; gap: calc(1em /2 * 3); } .page_company-history ul.timeline > li { display: flex; } .page_company-history ul.timeline > li > .time { flex: 1; } .page_company-history ul.timeline > li > .text { flex: 4; } .page_service-core { background: var(--white); } .page_service-core .page_service-core-body { display: flex; flex-direction: column; gap: calc(8em / 8 * 1); } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body { gap: calc(8em / 16 * 1); } } .page_service-core .page_service-core-body .top { padding: calc(8em / 16 * 5) calc(8em / 16 * 7); } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .top { padding: calc(8em / 16 * 3) 0; } } .page_service-core .page_service-core-body .top p { display: table; margin-left: auto; margin-right: auto; font-size: 1.845em; font-weight: 600; letter-spacing: .041em; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .top p { font-size: 1.64em; } } .page_service-core .page_service-core-body .top p b { color: var(--key1); } .page_service-core .page_service-core-body .middle { position: relative; z-index: 20; padding: calc(8em / 16 * 5) calc(8em / 16 * 7); background: var(--background1); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .middle { padding: calc(8em / 16 * 3); } } .page_service-core .page_service-core-body .middle::before { content: ''; position: absolute; top: calc(100% - 1px); left: calc(50%); z-index: 1; display: block; width: 16em; height: 2em; background: var(--background1); clip-path: polygon(0 0, 100% 0, 50% 100%); transform: translateX(-50%); } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .middle::before { width: 8em; height: 1em; } } .page_service-core .page_service-core-body .middle .title { display: table; padding: calc(8em / 32) calc(8em / 32 * 3); background: var(--key1); border-radius: calc(8em / 32); font-weight: 600; letter-spacing: .041em; color: var(--white); } .page_service-core .page_service-core-body .middle .title + * { margin-top: calc(8em / 32 * 4); } .page_service-core .page_service-core-body .middle ul { display: flex; align-items: center; flex-wrap: wrap; gap: calc(8em / 32 * 3) calc(8em / 8); } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .middle ul { flex-direction: column; gap: calc(8em / 32 * 2) calc(8em / 8); } } .page_service-core .page_service-core-body .middle ul > li { display: flex; align-items: center; gap: calc(8em / 16); width: calc(50% - ((8em / 8) / 2)); font-weight: 600; letter-spacing: .0205em; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .middle ul > li { width: 100%; } } .page_service-core .page_service-core-body .middle ul > li::before { content: ''; display: block; width: 1.1275em; min-width: 1.1275em; height: 1.1275em; background: url(images/check.svg); background-size: cover; } .page_service-core .page_service-core-body .bottom { display: flex; align-items: center; gap: calc(8em / 16 * 1) calc(8em / 8 * 3); padding: calc(8em / 16); background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .bottom { flex-direction: column-reverse; } } .page_service-core .page_service-core-body .bottom * { color: var(--white); } .page_service-core .page_service-core-body .bottom > .text { flex: 3; } .page_service-core .page_service-core-body .bottom > .text p { padding: calc(8em / 16 * 4) calc(8em / 16 * 6); font-size: 1.23em; font-weight: 600; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .bottom > .text p { padding: calc(8em / 16 * 2); font-size: 1em; } } .page_service-core .page_service-core-body .bottom > .result { flex: 1; display: flex; align-items: center; justify-content: center; gap: calc(8em / 64 * 3); aspect-ratio: 4/3; background: var(--border-light-white); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .bottom > .result { width: 100%; padding: calc(8em / 8 * 2) 0; aspect-ratio: initial; font-size: 1.3325em; } } .page_service-core .page_service-core-body .bottom > .result::before, .page_service-core .page_service-core-body .bottom > .result::after { content: ''; display: block; width: 1.3325em; height: auto; aspect-ratio: 53 / 150; background: url(images/icon/crown.svg); filter: brightness(0) invert(1); } .page_service-core .page_service-core-body .bottom > .result::after { transform: rotateY(180deg); } .page_service-core .page_service-core-body .bottom > .result .text { display: flex; align-items: center; flex-direction: column; gap: calc(8em / 64 * 2); } .page_service-core .page_service-core-body .bottom > .result .text .title { font-weight: 600; font-size: .75em; } .page_service-core .page_service-core-body .bottom > .result .text .count { display: flex; align-items: end; } .page_service-core .page_service-core-body .bottom > .result .text .count .attr { font-weight: 600; font-size: .8em; line-height: 1; } .page_service-core .page_service-core-body .bottom > .result .text .count .num { font-weight: 600; font-size: 2.255em; line-height: .85; } @media screen and (max-width: 768px) { .page_service-core .page_service-core-body .bottom > .result .text .count .num { font-size: 2.05em; } } .page_service-content { position: relative; z-index: 15; background: var(--background1); } .page_service-content::before { content: ''; position: absolute; top: 0; left: 0; z-index: -1; display: block; width: 100%; height: 100%; background-image: linear-gradient(0deg, transparent calc(100% - 1px), var(--key1) calc(100% - 1px)), linear-gradient(90deg, transparent calc(100% - 1px), var(--key1) calc(100% - 1px)); background-size: 16px 16px; background-repeat: repeat; background-position: center center; opacity: .041; } .page_service-content .page_cell ~ .page_cell { padding-top: calc(8em / 8 * 4); border-top: dashed 1px var(--key2); } @media screen and (max-width: 768px) { .page_service-content .page_cell ~ .page_cell { padding-top: calc(8em / 16 * 5); } } .page_service-content .page_service-content_feature ul { display: flex; flex-direction: column; gap: calc(8em / 16 * 3); counter-reset: num; } .page_service-content .page_service-content_feature ul > li { display: flex; align-items: baseline; gap: calc(8em / 16 * 2); } .page_service-content .page_service-content_feature ul > li::before { counter-increment: num; content: "0" counter(num); display: flex; align-items: center; justify-content: center; width: 2.05em; min-width: 2.05em; height: 2.05em; background: var(--key1); border-radius: calc(8em / 64 * 3); color: var(--white); } .page_service-content .page_service-content_feature ul > li dl { flex: 1; display: flex; flex-direction: column; gap: calc(8em / 32); } .page_service-content .page_service-content_feature ul > li dl > dt { font-weight: 600; font-size: 1.23em; } .page_service-content .page_service-content_service ul { display: flex; flex-direction: column; gap: calc(8em / 16 * 2); } .page_service-content .page_service-content_service ul > li.card { display: flex; align-items: center; gap: 0 calc(8em / 16 * 8); padding: calc(8em / 16 * 4); background: var(--white); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_service ul > li.card { flex-direction: column-reverse; padding: 0; } } .page_service-content .page_service-content_service ul > li.card > .text { flex: 2; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_service ul > li.card > .text { min-width: 100%; padding: calc(8em / 16 * 4) calc(8em / 16 * 3); } } .page_service-content .page_service-content_service ul > li.card > .image { flex: 1; aspect-ratio: 1/1; border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_service ul > li.card > .image { min-width: 100%; aspect-ratio: 16/9; } } .page_service-content .page_service-content_service ul > li dl { flex: 1; display: flex; flex-direction: column; gap: calc(8em / 32); } .page_service-content .page_service-content_service ul > li dl > dt { font-weight: 600; font-size: 1.23em; color: var(--key1); } .page_service-content .page_service-content_price .table { display: flex; flex-wrap: wrap; gap: calc(8em / 16 * 3); } .page_service-content .page_service-content_price .table .col { display: flex; flex-direction: column; gap: calc(8em / 8); } .page_service-content .page_service-content_price .table .col.col1 { width: 100%; } .page_service-content .page_service-content_price .table .col.col2 { width: calc((100% / 2) - ((8em / 16 * 3) * 1 / 2)); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .table .col.col2 { width: 100%; } } .page_service-content .page_service-content_price .table .col .title { display: flex; align-items: center; gap: calc(8em / 16 * 1); } .page_service-content .page_service-content_price .table .col .title > .icon { display: flex; align-items: center; justify-content: center; width: 1.435em; min-width: 1.435em; height: 1.435em; } .page_service-content .page_service-content_price .table .col .title > .text { font-weight: 600; font-size: 1.1275em; } .page_service-content .page_service-content_price .table .col .content { display: flex; gap: calc(8em / 8); } .page_service-content .page_service-content_price .table .col .content .content-cell { flex: 1; border-radius: calc(8em / 32); overflow: hidden; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-head { display: flex; justify-content: center; padding: calc(8em / 32); background: var(--key1); color: var(--white); font-weight: 600; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body { display: flex; align-items: baseline; justify-content: center; padding: calc(8em / 16 * 4); background: var(--white); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .table .col .content .content-cell .content-body { align-items: center; justify-content: center; flex-direction: column; } } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body span { display: flex; align-items: baseline; white-space: nowrap; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body span.num { font-size: 2.255em; font-weight: 600; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body span.price { font-size: 1.3325em; font-weight: 600; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body span.attr { font-size: 1em; } .page_service-content .page_service-content_price .table .col .content .content-cell .content-body span.blue { color: var(--key1); } .page_service-content .page_service-content_price .table + * { margin-top: calc(8em / 8); } .page_service-content .page_service-content_price .caption { display: flex; justify-content: flex-end; opacity: .6; } .page_service-content .page_service-content_price .banar a { display: flex; align-items: center; gap: calc(8em / 16 * 3) calc(8em / 8 * 2); padding: calc(8em / 16 * 5); background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .banar a { flex-direction: column; padding: calc(8em / 16 * 4); } } .page_service-content .page_service-content_price .banar a > .image { flex: 1; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .banar a > .image { max-width: 10em; } } .page_service-content .page_service-content_price .banar a > .title { flex: 2; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .banar a > .title { min-width: 100%; } } .page_service-content .page_service-content_price .banar a > .title dl { display: flex; flex-direction: column; gap: calc(8em / 16); } .page_service-content .page_service-content_price .banar a > .title dl > dt { font-weight: 600; color: var(--white); } .page_service-content .page_service-content_price .banar a > .title dl > dd { font-size: 2.05em; font-weight: 600; line-height: 1.3325; color: var(--white); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_price .banar a > .title dl > dd { font-size: 1.64em; } } .page_service-content .page_service-content_price .banar + * { display: table; margin-top: calc(8em / 8); margin-left: auto; margin-right: auto; } .page_service-content .page_service-content_price p a { color: var(--key1); text-decoration: underline; } .page_service-content .page_service-content_results .column-right > * + * { margin-top: calc(8em / 8); } .page_service-content .page_service-content_results p::before { content: ''; display: block; width: 1.3325em; min-width: 1.3325em; height: 1.3325em; margin: .41em 0; background: url(//ourspace.jp/demo/ajisaka/wp-content/themes/ajisaka/images/icon/comment.svg); background-size: cover; } .page_service-content .page_service-content_results .cases ul.list { display: flex; flex-direction: column; gap: calc(8em / 16 * 2); counter-reset: num; } .page_service-content .page_service-content_results .cases ul.list > li { padding: calc(8em / 16 * 3); background: var(--white); border-radius: calc(8em / 32); } .page_service-content .page_service-content_results .cases ul.list > li .title { display: flex; align-items: center; gap: calc(8em / 8); padding-bottom: calc(8em / 16); margin-bottom: calc(8em / 32 * 3); border-bottom: dashed 1px var(--key2); font-size: 1.1275em; font-weight: 600; } @media screen and (max-width: 768px) { .page_service-content .page_service-content_results .cases ul.list > li .title { margin-bottom: calc(8em / 32 * 4); } } .page_service-content .page_service-content_results .cases ul.list > li .title::before { counter-increment: num; content: "Case 0" counter(num); display: flex; align-items: center; justify-content: center; min-height: 2.05em; padding: 0 calc(8.5em / 16 * 2); background: var(--key1); border-radius: calc(8em / 32); color: var(--white); font-size: .8em; font-weight: 600; letter-spacing: -.0205em; white-space: nowrap; } .page_service-content .page_service-content_results .cases ul.list > li .pass { display: flex; flex-direction: column; gap: calc(8em / 16 * 2); } .page_service-content .page_service-content_results .cases ul.list > li .pass > .before { display: flex; align-items: baseline; gap: calc(8em / 32 * 1) calc(8em / 16 * 3); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_results .cases ul.list > li .pass > .before { flex-direction: column; } } .page_service-content .page_service-content_results .cases ul.list > li .pass > .before::before { content: 'Before'; display: block; min-width: 5em; font-weight: 600; } .page_service-content .page_service-content_results .cases ul.list > li .pass > .before ul.disc > li::before { filter: grayscale(1); } .page_service-content .page_service-content_results .cases ul.list > li .pass > .after { display: flex; align-items: baseline; gap: calc(8em / 32 * 1) calc(8em / 16 * 3); } @media screen and (max-width: 768px) { .page_service-content .page_service-content_results .cases ul.list > li .pass > .after { flex-direction: column; } } .page_service-content .page_service-content_results .cases ul.list > li .pass > .after::before { content: 'After'; display: block; min-width: 5em; font-weight: 600; color: var(--key1); } .page_service-content .page_service-content_results .cases ul.list > li .pass > .after .pass_title { color: var(--key1); } .page_service-content .page_service-content_results .cases ul.list > li .pass .pass_title { font-size: 1.1275em; font-weight: 600; } .page_service-content .page_service-content_results .cases ul.list > li .pass .pass_title + * { margin-top: calc(8em / 16); } .page_service-content .page_service-content_results .cases ul.disc { display: flex; flex-direction: column; gap: calc(8em / 64); } .page_service-content .page_service-content_results .cases ul.disc > li { display: flex; align-items: baseline; gap: calc(8em / 16 * 1); } .page_service-content .page_service-content_results .cases ul.disc > li::before { content: ''; display: block; width: 1.1275em; min-width: 1.1275em; height: 1.1275em; background: url(images/check.svg); background-size: cover; } .page_service-foot { padding-bottom: calc(8em / 8 * 10) !important; background: var(--white); } @media screen and (max-width: 768px) { .page_service-foot { padding-bottom: calc(8em / 8 * 5) !important; } } .page_service-foot .service_navigation ul { display: flex; flex-wrap: wrap; gap: 1.5em; } @media screen and (max-width: 768px) { .page_service-foot .service_navigation ul { gap: 0.75em; } } .page_service-foot .service_navigation ul > li { width: calc((100% / 3) - ((8em / 16 * 3) * 2 / 3)); } @media screen and (max-width: 768px) { .page_service-foot .service_navigation ul > li { width: 100%; } } .page_service-foot .service_navigation ul > li a { display: flex; align-items: center; gap: 1.5em; } .page_service-foot .service_navigation ul > li a > .icon { flex: 3; border-radius: 0.25em; overflow: hidden; line-height: 0; } @media screen and (max-width: 768px) { .page_service-foot .service_navigation ul > li a > .icon { flex: 2; } } .page_service-foot .service_navigation ul > li a > .text { flex: 5; display: flex; flex-direction: column; } .page_service-foot .service_navigation ul > li a > .text .jp { font-weight: 600; font-size: 1.23em; } .page_service-foot .service_navigation ul > li a > .text .en { color: var(--key1); font-size: .8em; } .archive_news { background: var(--white); border-radius: .5em; overflow: hidden; } .archive_news .archive_news_body { display: flex; flex-wrap: wrap; gap: 1em 2em; } .archive_news .archive_news_body > .archive_news_body-navigation { flex: 1; } @media screen and (max-width: 768px) { .archive_news .archive_news_body > .archive_news_body-navigation { order: 1; flex: initial; min-width: 100%; } } .archive_news .archive_news_body > .archive_news_body-navigation ul.category { display: flex; flex-direction: column; gap: calc(1em / 4 * 1) calc(1em / 4 * 3); } @media screen and (max-width: 768px) { .archive_news .archive_news_body > .archive_news_body-navigation ul.category > li a { display: flex; align-items: center; justify-content: center; min-height: 2.87em; background: var(--color-lightgray); border-radius: calc(8em / 16); } } .archive_news .archive_news_body > .archive_news_body-navigation ul.category > li a span { display: block; font-weight: 600; } @media screen and (max-width: 768px) { .archive_news .archive_news_body > .archive_news_body-navigation ul.category > li.current a { background: var(--key1); } } .archive_news .archive_news_body > .archive_news_body-navigation ul.category > li.current * { color: var(--key1); } @media screen and (max-width: 768px) { .archive_news .archive_news_body > .archive_news_body-navigation ul.category > li.current * { color: var(--white); } } .archive_news .archive_news_body > .archive_news_body-content { flex: 4; } @media screen and (max-width: 768px) { .archive_news .archive_news_body > .archive_news_body-content { flex: initial; min-width: 100%; } } .archive_news .archive_news_body ul.list > li { position: relative; z-index: 15; } .archive_news .archive_news_body ul.list > li::before { content: ''; position: absolute; top: 0; left: calc(8.5em / 16 * -3); display: block; width: calc(100% + (8.5em / 16 * 6)); height: 100%; background: transparent; border-radius: calc(8.5em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .archive_news .archive_news_body ul.list > li .card { position: relative; z-index: 15; display: flex; align-items: center; gap: calc(8em / 8 * 1) calc(8em / 8 * 2); padding: calc(8.5em / 32 * 8) 0; border-bottom: solid 1px var(--border-light-black); } @media screen and (max-width: 768px) { .archive_news .archive_news_body ul.list > li .card { flex-direction: column; } } .archive_news .archive_news_body ul.list > li .card > .image { flex: 1; aspect-ratio: 4/3; border-radius: calc(1em / 4); overflow: hidden; } @media screen and (max-width: 768px) { .archive_news .archive_news_body ul.list > li .card > .image { aspect-ratio: initial; } } .archive_news .archive_news_body ul.list > li .card > .text { flex: 3; display: flex; align-items: center; gap: calc(8em / 32 * 1) calc(8em / 8 * 1); } @media screen and (max-width: 768px) { .archive_news .archive_news_body ul.list > li .card > .text { align-items: flex-start; flex-direction: column-reverse; width: 100%; } } .archive_news .archive_news_body ul.list > li .card > .text .article { flex: 3; display: flex; flex-direction: column; gap: calc(1em / 4 * 1); } .archive_news .archive_news_body ul.list > li .card > .text .article .title { font-size: 1.23em; } .archive_news .archive_news_body ul.list > li .card > .text .attr { flex: 1; display: flex; flex-direction: column; gap: calc(1em / 4 * 1); } @media screen and (max-width: 768px) { .archive_news .archive_news_body ul.list > li .card > .text .attr { flex-direction: row; } } .archive_news .archive_news_body ul.list > li .card > .text .attr .category { display: flex; align-items: center; justify-content: center; min-width: 6.15em; min-height: 2.05em; padding: 0 calc(8.5em / 32 * 3); background: #E8EEEE; background: url(images/noise.png), #E8EEEE; background-size: 100px, cover; background-repeat: repeat; background-blend-mode: normal; border-radius: calc(8.5em / 64); font-size: .8em; } .archive_news .archive_news_body ul.list > li .card > .text .attr time { min-width: 8.2em; text-align: center; font-size: .85em; opacity: .5; } .archive_news .archive_news_body ul.list > li .card > .button { width: 1.64em; min-height: 1.64em; padding: 0; } .archive_news .archive_news_body ul.list > li .card > .button i { display: block; width: 1.64em; height: 1.64em; padding: calc(8.5em / 32); } .archive_news .archive_news_body ul.list > li .card > .button i img { filter: brightness(0) invert(1); } .archive_news .archive_news_body ul.list > li:hover::before { background: var(--color-white); box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .archive_news .archive_news_body ul.list > li:hover .card > .button i { background: var(--color-key1); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .single_post .wrapper { display: flex; flex-direction: column; flex-wrap: wrap; width: calc(100% / 32 * 30); margin: 0 auto; padding: 0; } .single_post .wrapper .single_post-voice { display: flex; flex-wrap: wrap; gap: calc(8em / 8 * 2) calc(8em / 8 * 4); width: 100%; padding: calc(8em / 8 * 4); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .single_post .wrapper .single_post-voice { padding: calc(8em / 8 * 2) calc(8em / 8 * 1.5); } } .single_post .wrapper .single_post-voice > .single_post-voice_head { flex: 1; display: flex; flex-direction: column; gap: calc(8em / 16 * 2); min-width: 300px; } .single_post .wrapper .single_post-voice > .single_post-voice_head .image { display: flex; align-items: center; justify-content: center; padding: 2em 0; background: var(--white); border-radius: calc(8em / 32); overflow: hidden; } .single_post .wrapper .single_post-voice > .single_post-voice_head .text dl { display: flex; align-items: center; flex-direction: column; } .single_post .wrapper .single_post-voice > .single_post-voice_head .text dl dt { font-size: 1.23em; font-weight: 600; } .single_post .wrapper .single_post-voice > .single_post-voice_body { flex: 3; } .single_post .wrapper .single_post-voice > .single_post-voice_body .title { font-size: 1.64em; font-weight: 600; } @media screen and (max-width: 768px) { .single_post .wrapper .single_post-voice > .single_post-voice_body .title { font-size: 1.5575em; } } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li { padding: 1.75em 0; border-bottom: dashed 1px var(--border-light-black); } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li dl { display: flex; flex-direction: column; gap: calc(8em / 16); } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li dl > dt { display: flex; align-items: baseline; gap: calc(8em / 16 * 2); font-size: 1.1275em; font-weight: 600; } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li dl > dt::before { content: 'Q'; display: flex; align-items: center; justify-content: center; width: 2.05rem; min-width: 2.05rem; height: 2.05rem; background: var(--key1); border-radius: calc(8em / 32); color: var(--white); } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li dl > dd { display: flex; align-items: baseline; gap: calc(8em / 16 * 2); } .single_post .wrapper .single_post-voice > .single_post-voice_body ul.qa > li dl > dd::before { content: 'A'; display: flex; align-items: center; justify-content: center; width: 2.05rem; min-width: 2.05rem; height: 2.05rem; background: var(--key2); border-radius: calc(8em / 32); color: var(--key1); } .single_post .wrapper .single_post-blog { width: 100%; padding: calc(8em / 8 * 4); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .single_post .wrapper .single_post-blog { padding: calc(8em / 8 * 2) calc(8em / 8 * 1.5); } } .single_post .wrapper .single_post-blog .single_post-blog-head .title { font-size: 1.64em; font-weight: 600; } @media screen and (max-width: 768px) { .single_post .wrapper .single_post-blog .single_post-blog-head .title { font-size: 1.5575em; } } .single_post .wrapper .single_post-blog .single_post-blog-head time { color: var(--color-key5); } .single_post .wrapper .single_post-blog .single_post-blog-head + * { margin-top: calc(8em / 8 * 2); } @media screen and (max-width: 768px) { .single_post .wrapper .single_post-blog .single_post-blog-head + * { margin-top: calc(8em / 16 * 2); } } .recruit_message * { color: var(--white); } .recruit_message .recruit_message-body { display: flex; flex-direction: column; gap: calc(1em * 3); } .recruit_message .recruit_message-body .image { width: 100%; aspect-ratio: 2.35/1; border-radius: calc(1em / 4); overflow: hidden; } .recruit_message .recruit_message-body dl.text { display: flex; flex-direction: column; gap: calc(1em * 2); } .recruit_message .recruit_message-body dl.text > dt { font-size: 2.05em; font-weight: 600; line-height: 1.435; } @media screen and (max-width: 768px) { .recruit_message .recruit_message-body dl.text > dt { font-size: 1.64em; line-height: 1.64; } } .recruit_message .recruit_message-body dl.text > dd { text-align: justify; line-height: 1.8; font-weight: 600; } @media screen and (max-width: 768px) { .recruit_message .recruit_message-body dl.text > dd { line-height: 1.64; } } .recruit_wanted { background: var(--background1); border-radius: .5em; overflow: hidden; } .recruit_wanted .calusel .slider .slider__inner { align-items: initial; column-gap: calc(8em / 16 * 3); } .recruit_wanted .calusel .slider:hover .slider__inner { animation-play-state: paused; } .recruit_wanted .calusel + .calusel { margin-top: calc(8em / 16 * 3); } .recruit_wanted .calusel + .calusel .slider .slider__inner { animation-direction: reverse; } .recruit_wanted .card { position: relative; z-index: 15; display: flex; justify-content: space-between; flex-direction: column; gap: 2em; width: 400px; max-width: 100%; padding: calc(8em / 16 * 3); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .recruit_wanted .card { width: 320px; } } .recruit_wanted .card dl { display: flex; flex-direction: column; gap: calc(8em / 16); } .recruit_wanted .card dl > dt { font-size: 1.23em; font-weight: 600; } .recruit_wanted .card .icon { display: flex; align-items: center; justify-content: center; width: 2em; min-width: 2em; height: 2em; margin-left: auto; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_wanted .card .icon svg { fill: var(--white); } .recruit_wanted .card:hover .icon { background: var(--text); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_strength { position: relative; z-index: 15; } .recruit_strength hgroup * { color: var(--white); } .recruit_strength .recruit_strength-body ul { display: flex; flex-direction: column; gap: calc(8em / 8 * 1); counter-reset: num; } .recruit_strength .recruit_strength-body ul > li { position: relative; z-index: 15; padding: calc(8em / 16 * 5) calc(8em / 16 * 7); background: var(--white); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-body ul > li { padding: calc(8em / 16 * 4) calc(8em / 16 * 3) calc(8em / 16 * 3); } } .recruit_strength .recruit_strength-body ul > li::before { counter-increment: num; content: "0" counter(num); position: absolute; top: 0; left: calc(8rem / 16 * 4); display: flex; align-items: center; justify-content: center; width: 3em; height: 3.5em; background: var(--key1); font-size: 1.23em; font-weight: var(--fontweight-6); letter-spacing: .041em; color: var(--white); clip-path: polygon(0 0, 100% 0, 100% 90%, 50% 100%, 0 90%); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-body ul > li::before { left: 0; margin: 0 calc(8.5em / 32 * 3) 0 calc(8.5em / 32 * 2); } } .recruit_strength .recruit_strength-body ul > li dl { display: flex; flex-direction: column; gap: calc(8em / 8); } .recruit_strength .recruit_strength-body ul > li dl > dt { padding-left: 3.5rem; font-size: 1.23em; color: var(--key1); font-weight: 600; letter-spacing: .041em; } .recruit_strength .recruit_strength-body ul > li dl > dd { font-weight: 600; letter-spacing: .041em; line-height: 1.64; } .recruit_strength .recruit_strength-body + * { margin-top: calc(8em / 8 * 7); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-body + * { margin-top: calc(8em / 8 * 4); } } .recruit_strength .recruit_strength-foot { display: flex; flex-direction: column; gap: calc(8em / 8 * 1); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot { gap: calc(8em / 16 * 1); } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top { position: relative; z-index: 20; padding: calc(8em / 16 * 5) calc(8em / 16 * 7); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_top { padding: calc(8em / 16 * 3); } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top::before { content: ''; position: absolute; top: calc(100% - 1px); left: calc(50%); z-index: 1; display: block; width: 16em; height: 2em; background: var(--white); clip-path: polygon(0 0, 100% 0, 50% 100%); transform: translateX(-50%); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_top::before { width: 8em; height: 1em; } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top .title { display: table; padding: calc(8em / 32) calc(8em / 32 * 3); background: var(--key1); border-radius: calc(8em / 32); font-weight: 600; letter-spacing: .041em; color: var(--white); } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top .title + * { margin-top: calc(8em / 32 * 4); } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top ul { display: flex; align-items: center; flex-wrap: wrap; gap: calc(8em / 32 * 3) calc(8em / 8); } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_top ul { flex-direction: column; gap: calc(8em / 32 * 2) calc(8em / 8); } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top ul > li { display: flex; align-items: center; gap: calc(8em / 16); width: calc(50% - ((8em / 8) / 2)); font-weight: 600; letter-spacing: .0205em; } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_top ul > li { width: 100%; } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_top ul > li::before { content: ''; display: block; width: 1.1275em; min-width: 1.1275em; height: 1.1275em; background: url(images/check.svg); background-size: cover; } .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom { display: flex; align-items: center; gap: 0 calc(8em / 8 * 3); padding: calc(8em / 16); background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom { flex-direction: column-reverse; } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom * { color: var(--white); } .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom > .text { flex: 3; } .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom > .text p { padding: 2em 3em; font-size: 1.1275em; font-weight: 500; } @media screen and (max-width: 768px) { .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom > .text p { padding: calc(8em / 16 * 2); font-size: 1em; font-weight: 600; } } .recruit_strength .recruit_strength-foot .recruit_strength-foot_bottom > .image { flex: 1; aspect-ratio: 4/3; border-radius: calc(8em / 32); overflow: hidden; line-height: 0; } .recruit_strength .recruit_strength-background { position: absolute; left: 0; bottom: 0; z-index: -5; width: 100%; height: var(--rs-bg-height, 760px); background: url(images/recruit/recruit_strength-background.png) center; background-size: auto; } .recruit_interview { background: var(--white); border-radius: .5em; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .recruit_interview ul { display: flex; flex-direction: column; gap: calc(8em / 8 * 4); } @media screen and (max-width: 768px) { .recruit_interview ul { gap: calc(8em / 8 * 1); } } .recruit_interview ul > li { filter: brightness(1); } .recruit_interview ul > li .card { display: flex; align-items: flex-start; gap: 0 calc(8em / 8 * 2); padding: calc(8em / 8 * 2); background: var(--background1); border-radius: calc(8em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .recruit_interview ul > li .card { flex-direction: column; padding: calc(8em / 16 * 1); } } .recruit_interview ul > li .card > .image { flex: 1; aspect-ratio: 3/4; overflow: hidden; line-height: 0; } @media screen and (max-width: 768px) { .recruit_interview ul > li .card > .image { width: 100%; aspect-ratio: 3/2; } } .recruit_interview ul > li .card > .text { flex: 2; } .recruit_interview ul > li .card > .text .inner { display: flex; flex-direction: column; gap: calc(8em / 16 * 3); padding: 2em 0; } @media screen and (max-width: 768px) { .recruit_interview ul > li .card > .text .inner { padding: calc(8em / 16 * 3) calc(8em / 16 * 2); } } .recruit_interview ul > li .card > .text .inner .top { display: flex; flex-direction: column; gap: calc(8em / 32); } .recruit_interview ul > li .card > .text .inner .top .title { font-size: 1.845em; font-weight: 600; line-height: 1.435; } @media screen and (max-width: 768px) { .recruit_interview ul > li .card > .text .inner .top .title { font-size: 1.64em; } } .recruit_interview ul > li .card > .text .inner .top .title b { color: var(--key1); } .recruit_interview ul > li .card > .text .inner .top .attr { font-weight: 600; } .recruit_interview ul > li .card > .text .inner .middle p { font-size: .95em; } .recruit_welfare .recruit_welfare-head + * { margin-top: calc(8em / 16 * 3); } .recruit_welfare .recruit_welfare-body ul { display: flex; flex-direction: column; gap: calc(8em / 16 * 3); } .recruit_welfare .recruit_welfare-body ul > li dl { display: flex; gap: calc(8em / 32 * 1) calc(8em / 16 * 3); } @media screen and (max-width: 768px) { .recruit_welfare .recruit_welfare-body ul > li dl { flex-direction: column; } } .recruit_welfare .recruit_welfare-body ul > li dl > dt { flex: 1; color: var(--key1); font-weight: 600; } @media screen and (max-width: 768px) { .recruit_welfare .recruit_welfare-body ul > li dl > dt br { display: none; } } .recruit_welfare .recruit_welfare-body ul > li dl > dd { flex: 3; font-size: .9em; } @media screen and (max-width: 768px) { .recruit_welfare .recruit_welfare-body ul > li dl > dd { font-size: 1em; } } .recruit_description { background: var(--background1); border-radius: .5em; border-top-left-radius: 0; border-top-right-radius: 0; overflow: hidden; } .recruit_description .recruit_description-head { display: flex; align-items: center; justify-content: center; } .recruit_description .recruit_description-head ul { display: flex; align-items: center; justify-content: center; gap: calc(8em / 32); padding: calc(8em / 32); border: dashed 1px var(--key1); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .recruit_description .recruit_description-head ul { width: 100%; } } .recruit_description .recruit_description-head ul > li { flex: 1; display: flex; align-items: center; justify-content: center; width: 12.3em; min-height: 2.87em; gap: calc(8em / 32); background: var(--white); border-radius: calc(8em / 32); } @media screen and (max-width: 768px) { .recruit_description .recruit_description-head ul > li { width: auto; } } .recruit_description .recruit_description-head ul > li.current { background: var(--key1); color: var(--white); } .recruit_description .recruit_description-head + * { margin-top: calc(8em / 16 * 4); } @media screen and (max-width: 768px) { .recruit_description .recruit_description-head + * { margin-top: calc(8em / 16 * 2); } } .recruit_description .recruit_description-body { background: var(--white); border-radius: calc(8em / 32); } .recruit_description .recruit_description-body .switchBody { position: absolute; top: 0; left: 0; width: 100%; height: auto; opacity: 0; visibility: hidden; pointer-events: none; } .recruit_description .recruit_description-body .switchBody.current { position: relative; opacity: 1; visibility: visible; pointer-events: auto; } .recruit_description .recruit_description-body .switchBody ul.table { display: flex; flex-direction: column; gap: calc(8em / 16 * 3); padding: calc(8em / 16 * 5) calc(8em / 16 * 7); } @media screen and (max-width: 768px) { .recruit_description .recruit_description-body .switchBody ul.table { padding: calc(8em / 16 * 4) calc(8em / 16 * 3); } } .recruit_description .recruit_description-body .switchBody ul.table > li { display: flex; flex-wrap: wrap; gap: calc(8em / 16 * 1) calc(8em / 16 * 3); } .recruit_description .recruit_description-body .switchBody ul.table > li .title { flex: 1; font-weight: 600; } .recruit_description .recruit_description-body .switchBody ul.table > li .content { flex: 3; } @media screen and (max-width: 768px) { .recruit_description .recruit_description-body .switchBody ul.table > li .content { min-width: 100%; } } .recruit_description .recruit_description-body .switchBody ul.table > li .content.description { min-width: 100%; } .recruit_description .recruit_description-body .switchBody .link { display: flex; align-items: center; justify-content: center; padding: calc(8em / 16 * 5) calc(8em / 16 * 7); border-top: dashed 1px var(--border-light-black); } @media screen and (max-width: 768px) { .recruit_description .recruit_description-body .switchBody .link { padding: calc(8em / 16 * 3); } } .recruit_description .recruit_description-body .switchBody .link a { display: flex; align-items: center; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_description .recruit_description-body .switchBody .link a span { display: block; background: var(--key1); } .recruit_description .recruit_description-body .switchBody .link a span.text { min-width: 12.3em; padding: 0 calc(8em / 16 * 3); color: var(--white); } .recruit_description .recruit_description-body .switchBody .link a span.icon { display: flex; align-items: center; justify-content: center; width: 3.28em; height: 3.28em; } .recruit_description .recruit_description-body .switchBody .link a span.icon svg { width: 1.435em; height: 1.435em; fill: var(--key1); background: var(--white); border-radius: calc(8em / 64); overflow: hidden; } .recruit_description .recruit_description-body .switchBody .link a:hover { filter: brightness(0.985); transform: scale(0.985); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_flow ul { counter-reset: num; display: flex; flex-direction: column; gap: calc(8em / 16 * 3); } @media screen and (max-width: 768px) { .recruit_flow ul { gap: calc(8em / 16 * 2); } } .recruit_flow ul li { display: flex; align-items: baseline; } .recruit_flow ul li::before { counter-increment: num; content: "0" counter(num); display: flex; align-items: center; justify-content: center; width: 2.255em; min-width: 2.255em; height: 2.255em; margin: 0 calc(8.5em / 16 * 2); background: var(--key1); border-radius: calc(8em / 32); color: var(--white); font-size: 1.075em; font-weight: 600; letter-spacing: -.0205em; } @media screen and (max-width: 768px) { .recruit_flow ul li::before { margin: 0 calc(8.5em / 32 * 3) 0 calc(8.5em / 32 * 2); } } .recruit_flow ul li dl > dt { font-size: 1.23em; font-weight: var(--fontweight-6); } .recruit_entry .link { display: flex; align-items: center; justify-content: center; padding: calc(8em / 16 * 5) 0; border-top: dashed 1px var(--border-light-black); } @media screen and (max-width: 768px) { .recruit_entry .link { padding: calc(8em / 16 * 3) 0; } } .recruit_entry .link a { display: flex; align-items: center; width: 100%; background: var(--key1); border-radius: calc(8em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_entry .link a span { display: block; background: var(--key1); } .recruit_entry .link a span.text { flex: 1; min-width: 12.3em; padding: 0 calc(8em / 16 * 3); color: var(--white); text-align: center; } .recruit_entry .link a span.icon { display: flex; align-items: center; justify-content: center; width: 5.125em; height: 5.125em; } @media screen and (max-width: 768px) { .recruit_entry .link a span.icon { width: 4.1em; height: 4.1em; } } .recruit_entry .link a span.icon svg { width: 1.435em; height: 1.435em; fill: var(--key1); background: var(--white); border-radius: calc(8em / 64); overflow: hidden; } .recruit_entry .link a:hover { filter: brightness(0.985); transform: scale(0.985); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } /* 画面共通のツールチップ */ .cursor-tooltip { position: fixed; /* カーソルに追随しやすいようfixed */ z-index: 9999; pointer-events: none; /* クリック操作を邪魔しない */ opacity: 0; transform: translateY(4px); transition: opacity .12s ease, transform .12s ease; background: rgba(20, 20, 23, 0.95); color: #fff; padding: .5em .6em; border-radius: .5rem; font-size: .875rem; line-height: 1.4; max-width: min(60ch, 320px); box-shadow: 0 6px 24px rgba(0, 0, 0, 0.18); will-change: transform, opacity; } .cursor-tooltip.is-visible { opacity: 1; transform: translateY(0); } @media (prefers-reduced-motion: reduce) { .cursor-tooltip { transition: none; } } .recruit_position .position_head ul { display: flex; align-items: center; gap: calc(8.5em / 16); margin-bottom: calc(8.5em / 8); padding-bottom: calc(8.5em / 16); line-height: 1; border-bottom: solid 1px var(--border-light-black); } .recruit_position .position_head ul > li { padding: calc(8.5em / 32 * 2) calc(8.5em / 32 * 3); border-radius: calc(8.5em / 32); overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_position .position_head ul > li:hover { background: var(--color-lightgray); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_position .position_head ul > li.current { background: var(--color-key5); color: var(--color-white); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .recruit_position .position_body { position: relative; z-index: 15; } .recruit_position .position_body .switchBody { position: absolute; top: 0; left: 0; width: 100%; height: auto; opacity: 0; visibility: hidden; pointer-events: none; } .recruit_position .position_body .switchBody.current { position: relative; display: block; opacity: 1; visibility: visible; pointer-events: auto; } .recruit_position .position_body .outline { background: var(--border-light-black); padding: calc(8.5em / 16 * 3); border-radius: calc(8.5em / 32); overflow: hidden; } .recruit_position .position_body .outline p { font-size: 1.1275em; } .recruit_position .position_body ul { display: flex; flex-direction: column; } .recruit_position .position_body ul li { padding: calc(8.5em / 16 * 3) calc(8.5em / 16 * 2); border-bottom: solid 1px var(--border-light-black); } @media screen and (max-width: 768px) { .recruit_position .position_body ul li { padding: calc(8.5em / 16 * 3) 0; } } .recruit_position .position_body ul li dl { display: flex; } @media screen and (max-width: 768px) { .recruit_position .position_body ul li dl { flex-direction: column; gap: calc(8.5em / 16); } } .recruit_position .position_body ul li dl dt { flex: 2; font-weight: var(--fontweight-6); } @media screen and (max-width: 768px) { .recruit_position .position_body ul li dl dt { display: flex; align-items: center; gap: calc(8.5em / 64 * 3); } .recruit_position .position_body ul li dl dt::before { content: ''; display: block; width: .8em; height: .8em; background: var(--color-key1); border-radius: calc(8.5em / 64); overflow: hidden; } } .recruit_position .position_body ul li dl dd { flex: 8; } .recruit_entry .card { display: block; padding: calc(8.5em / 8 * 5) calc(8.5em / 8 * 3); background: linear-gradient(135deg, var(--color-black) 75%, var(--color-key4)); border-radius: calc(8.5em / 32); overflow: hidden; transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } @media screen and (max-width: 768px) { .recruit_entry .card { padding: calc(8.5em / 8 * 4) calc(8.5em / 8 * 3); } } .recruit_entry .card hgroup * { color: var(--color-white) !important; } .recruit_entry .card:hover { background: linear-gradient(135deg, var(--color-black) 65%, var(--color-key4)); transform: scale(0.99); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .page_business .page_business_model { display: flex; flex-direction: column; gap: calc(8.5em / 8 * 5); } .page_business .page_business_model .page_business_model_block { display: flex; align-items: center; flex-wrap: wrap; gap: calc(8.5em / 8 * 2) calc(8.5em / 8 * 4); } .page_business .page_business_model .page_business_model_block > .image { flex: 1; min-width: calc(8.5em / 1 * 3); line-height: 1; } .page_business .page_business_model .page_business_model_block > .image div { aspect-ratio: 1/1; background: var(--color-lightgray); border-radius: calc(8.5em / 8); overflow: hidden; } @media screen and (max-width: 768px) { .page_business .page_business_model .page_business_model_block > .image div { aspect-ratio: 16/9; border-radius: calc(8.5em / 32 * 3); } } .page_business .page_business_model .page_business_model_block > .text { flex: 2; } .page_business .page_business_model .page_business_model_block > .text dl > dt { font-size: 1.5575em; } .page_business .page_business_model .page_business_model_block > .text dl > dt + dd { margin-top: calc(8.5em / 8); } @media screen and (max-width: 768px) { .page_business .page_business_model .page_business_model_block > .text dl > dt + dd { margin-top: calc(8.5em / 12); } } .page_business .page_business_model .page_business_model_block > .text dl > dd { font-size: 1.23em; } @media screen and (max-width: 768px) { .page_business .page_business_model .page_business_model_block > .text dl > dd { font-size: 1.075em; } } .page_business .page_business_model .page_business_model_block > .text dl > dd ul { display: flex; flex-direction: column; gap: calc(8.5em / 32); margin-bottom: calc(8.5em / 24); } .page_business .page_business_model .page_business_model_block > .text dl > dd ul > li { display: flex; align-items: center; column-gap: calc(8.5em / 24); } .page_business .page_business_model .page_business_model_block > .text dl > dd ul > li::before { content: ''; display: block; width: 1.23em; height: 1.23em; background: url(images/icon/icon_check.svg), var(--color-lightgray); background-position: center; background-size: 1em, cover; border-radius: 2px; } .page_business .page_business_domain { display: flex; flex-direction: column; gap: calc(8.5em / 8 * 3); } .page_business .page_business_domain .page_business_domain_head div { aspect-ratio: 2/1; border-radius: calc(8.5em / 8); overflow: hidden; } @media screen and (max-width: 768px) { .page_business .page_business_domain .page_business_domain_head div { display: none; border-radius: calc(8.5em / 32 * 3); } } .page_business .page_business_domain .page_business_domain_body ul { display: flex; flex-wrap: wrap; gap: calc(8.5em / 8 * 3) calc(8.5em / 8); counter-reset: num; } @media screen and (max-width: 768px) { .page_business .page_business_domain .page_business_domain_body ul { flex-direction: column; } } .page_business .page_business_domain .page_business_domain_body ul > li { display: flex; flex-wrap: wrap; gap: calc(8.5em / 16 * 4); width: calc((100% / 3) - ((8.5em / 8) * 2 / 3)); } @media screen and (max-width: 768px) { .page_business .page_business_domain .page_business_domain_body ul > li { width: 100%; gap: calc(8.5em / 16 * 3); } } .page_business .page_business_domain .page_business_domain_body ul > li > .image { flex: 1; line-height: 1; } .page_business .page_business_domain .page_business_domain_body ul > li > .image div { position: relative; z-index: 15; aspect-ratio: 4/3; background: var(--color-lightgray); border-radius: calc(8.5em / 8); } @media screen and (max-width: 768px) { .page_business .page_business_domain .page_business_domain_body ul > li > .image div { border-radius: calc(8.5em / 32*3); } } .page_business .page_business_domain .page_business_domain_body ul > li > .image div img { position: absolute; bottom: 0; width: 100%; height: auto; } .page_business .page_business_domain .page_business_domain_body ul > li > .text { display: flex; flex-direction: column; gap: calc(8.5em / 16 * 2); } @media screen and (max-width: 768px) { .page_business .page_business_domain .page_business_domain_body ul > li > .text { padding: 0 calc(8.5em / 32 * 2); } } .page_business .page_business_domain .page_business_domain_body ul > li > .text::before { counter-increment: num; content: "( 0" counter(num) " )"; display: block; } .page_business .page_business_domain .page_business_domain_body ul > li > .text dl { display: flex; flex-direction: column; gap: calc(8.5em / 32); } .page_business .page_business_domain .page_business_domain_body ul > li > .text dl dt { font-size: 1.3325em; } .page_business .page_business_strength { display: flex; gap: calc(8.5em / 8 * 2) calc(8.5em / 8 * 5); } @media screen and (max-width: 768px) { .page_business .page_business_strength { flex-direction: column; } } .page_business .page_business_strength > div { flex: 1; } .page_business .page_business_strength > .page_business_strength_head div { aspect-ratio: 5/6; background: var(--color-lightgray); border-radius: calc(8.5em / 8); overflow: hidden; } .page_business .page_business_strength > .page_business_strength_body ul { border-top: solid 1px var(--border-light-black); counter-reset: num; } .page_business .page_business_strength > .page_business_strength_body ul > li { display: flex; flex-direction: column; gap: calc(8.5em / 16 * 2); padding: calc(8.5em / 16 * 4) 0; border-bottom: solid 1px var(--border-light-black); } .page_business .page_business_strength > .page_business_strength_body ul > li::before { counter-increment: num; content: "( 0" counter(num) " )"; display: block; } .page_business .page_business_strength > .page_business_strength_body ul > li dl { display: flex; flex-direction: column; gap: calc(8.5em / 12); } .page_business .page_business_strength > .page_business_strength_body ul > li dl dt { font-size: 1.3325em; } .page_culture .page_culture_number ul.list { display: flex; flex-wrap: wrap; border-top: solid 1px var(--border-light-black); border-left: solid 1px var(--border-light-black); } .page_culture .page_culture_number ul.list > li { padding: calc(8.5em / 8 * 3); border-right: solid 1px var(--border-light-black); border-bottom: solid 1px var(--border-light-black); } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li { padding: calc(8.5em / 16 * 3); } } .page_culture .page_culture_number ul.list > li.col6 { width: 50%; } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li.col6 { width: 100%; } } .page_culture .page_culture_number ul.list > li.col12 { width: 100%; } .page_culture .page_culture_number ul.list > li p.title { font-size: 1.7425em; } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li p.title { font-size: 1.5575em; text-align: center; } } .page_culture .page_culture_number ul.list > li p.title + * { margin-top: calc(8.5em / 8); } .page_culture .page_culture_number ul.list > li p.number { display: flex; align-items: baseline; justify-content: center; } .page_culture .page_culture_number ul.list > li p.number span { display: block; line-height: 1.23; } .page_culture .page_culture_number ul.list > li p.number span.num { font-size: 10.25em; font-weight: 600; } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li p.number span.num { font-size: calc(8.5em / 8 * 6); } } .page_culture .page_culture_number ul.list > li p.number span.scale { font-size: 3.69em; font-weight: 900; } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li p.number span.scale { font-size: calc(8.5em / 8 * 3); } } .page_culture .page_culture_number ul.list > li p.caption { display: table; margin: 0 auto; } @media screen and (max-width: 768px) { .page_culture .page_culture_number ul.list > li p.caption { margin-top: calc(8.5em / 12); } } .page_culture .page_culture_number ul.list > li .award { display: flex; align-items: center; justify-content: center; } .page_culture .page_culture_number ul.list > li .award::before, .page_culture .page_culture_number ul.list > li .award::after { content: ''; display: block; width: 53px; height: 150px; } .page_culture .page_culture_number ul.list > li .award::before { background: url(images/award-01.svg); background-size: cover; } .page_culture .page_culture_number ul.list > li .award::after { background: url(images/award-02.svg); background-size: cover; } .page_culture .page_culture_number ul.list > li img { width: 100%; height: auto; } .page_culture .page_culture_event { overflow: hidden; } .page_culture .page_culture_event.page_flex > .page_flex_side { flex: 1; } .page_culture .page_culture_event.page_flex > .page_flex_main { flex: initial; width: 767px; max-width: 100%; overflow: hidden; } @media screen and (max-width: 768px) { .page_culture .page_culture_event.page_flex > .page_flex_main { width: calc(100vw / 16 * 14); } } .page_culture .page_culture_event .page_culture_event_body { display: flex; flex-direction: column; gap: calc(8.5em / 8 * 4); } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body { gap: calc(8.5em / 8 * 2); } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block { display: flex; flex-direction: column; gap: calc(8.5em / 16 * 2) calc(8.5em / 8 * 2); } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block { gap: calc(8.5em / 16) calc(8.5em / 8 * 1); } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event { position: relative; z-index: 15; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-wrapper .swiper-slide { line-height: 1; border-radius: calc(8.5em / 32 * 2); overflow: hidden; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-next { display: flex; align-items: center; justify-content: center; width: calc(8.5em / 16 * 7); height: calc(8.5em / 16 * 7); background: rgba(255, 255, 255, 0.85); border-radius: calc(8.5em / 16 * 7); overflow: hidden; opacity: 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-next { width: calc(8.5em / 16 * 6); height: calc(8.5em / 16 * 6); } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev.swiper-button-disabled, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-next.swiper-button-disabled { opacity: 0 !important; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev::before, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-next::before { content: ''; width: 1em; height: 1em; background: url(images/icon/arrow.svg); } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev::after, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-next::after { display: none; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event .swiper-button-prev::before { transform: rotate(180deg); } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event:hover .swiper-button-prev, .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block .culture_event:hover .swiper-button-next { opacity: 1; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image { display: flex; column-gap: calc(8.5em / 8); width: 100%; overflow: hidden; } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image { column-gap: calc(8.5em / 16); } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image .figure { border-radius: calc(8.5em / 16); overflow: hidden; } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image .figure { border-radius: calc(8.5em / 32); } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image .figure:nth-child(1) { flex: 3; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image .figure:nth-child(2) { flex: 2; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .image:nth-child(2n) .figure:nth-child(1) { order: 1; } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block > .text { margin-top: calc(8.5em / 16 * 1); } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block dl { display: flex; flex-direction: column; gap: calc(8.5em / 8); } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block dl > dt { font-size: 1.845em; } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block dl > dt { font-size: 1.5575em; } } .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block dl > dd { font-size: 1.23em; } @media screen and (max-width: 768px) { .page_culture .page_culture_event .page_culture_event_body .page_culture_event_body_block dl > dd { font-size: 1.075em; } } .page_culture .page_culture_gallery .page_culture_gallery_block { position: relative; z-index: 15; width: 100%; } .page_culture .page_culture_gallery .figureWrap { display: flex; gap: calc(8.5em / 8); } @media screen and (max-width: 768px) { .page_culture .page_culture_gallery .figureWrap { gap: calc(8.5em / 16); } } .page_culture .page_culture_gallery .figureWrap .figureInnerWrap { display: flex; flex-direction: column; gap: calc(8.5em / 8); flex: 1; } @media screen and (max-width: 768px) { .page_culture .page_culture_gallery .figureWrap .figureInnerWrap { gap: calc(8.5em / 16); } } .page_culture .page_culture_gallery .figureWrap .figureItem { line-height: 1; border-radius: calc(8.5em / 8); overflow: hidden; } @media screen and (max-width: 768px) { .page_culture .page_culture_gallery .figureWrap .figureItem { border-radius: calc(8.5em / 32 * 3); } } .page_faq .faq ul { background: var(--color-white); padding: calc(8.5em / 8 * 3); border-radius: calc(8.5em / 32); overflow: hidden; } @media screen and (max-width: 768px) { .page_faq .faq ul { padding: calc(8.5em / 8 * 2); } } .page_faq .faq ul > li { border-bottom: solid 1px var(--border-light-black); } .page_faq .faq ul > li dl { padding: calc(8.5em / 16 * 3) calc(8.5em / 16 * 4); } @media screen and (max-width: 768px) { .page_faq .faq ul > li dl { padding: calc(8.5em / 16 * 3) calc(8.5em / 32 * 1); } } .page_faq .faq ul > li dl dt { display: flex; align-items: baseline; column-gap: calc(8.5em / 32 * 3); font-weight: var(--fontweight-7); } .page_faq .faq ul > li dl dt::before { content: 'Q'; display: flex; align-items: center; justify-content: center; width: 2.05em; min-width: 2.05em; height: 2.05em; background: linear-gradient(135deg, var(--color-black) 75%, var(--color-key4)); border-radius: calc(8.5em / 32); overflow: hidden; font-weight: 500; color: var(--color-white); } .page_faq .faq ul > li dl dt + dd { margin-top: calc(8.5em / 16); } .page_faq .faq ul > li dl dd { display: flex; align-items: baseline; column-gap: calc(8.5em / 32 * 3); line-height: 1.8; } .page_faq .faq ul > li dl dd::before { content: 'A'; display: flex; align-items: center; justify-content: center; width: 2.05em; min-width: 2.05em; height: 2.05em; background: linear-gradient(135deg, var(--key2) 75%, var(--key1)); border-radius: calc(8.5em / 32); overflow: hidden; font-weight: 500; color: var(--color-white); } .page_faq .faq ul > li dl dd a { color: var(--color-key2); text-decoration: underline; } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list { border-top: solid 1px var(--border-light-black); counter-reset: num; } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li { padding: calc(8.5em / 16 * 4) 0; border-bottom: solid 1px var(--border-light-black); } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dt { display: flex; align-items: center; gap: calc(8.5em / 16); } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dt::before { counter-increment: num; content: "( 0" counter(num) " )"; display: block; } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dt p { font-weight: 600; font-size: 1.3325em; } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dt + dd { margin-top: calc(8.5em / 8); } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dd ul.desc { display: flex; flex-wrap: wrap; gap: calc(8.5em / 12); } @media screen and (max-width: 768px) { .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dd ul.desc { gap: calc(8.5em / 24); } } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dd ul.desc > li { display: flex; align-items: center; column-gap: calc(8.5em / 16); width: calc((100% / 2) - ((8.5em / 12) *1 / 2)); padding: calc(8.5em / 8); background: rgba(0, 0, 0, 0.041); border-radius: calc(8.5em / 32); } @media screen and (max-width: 768px) { .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dd ul.desc > li { min-width: 100%; padding: calc(8.5em / 16); } } .page_faq .page_benefits_welfare .page_benefits_welfare_body .page_benefits_welfare_body_block ul.list > li dl > dd ul.desc > li::before { content: ''; display: block; width: .85em; min-width: .85em; height: .85em; border-radius: 1em; background: var(--color-key1); } .page_faq .page_benefits_work .page_benefits_work_head p { font-size: 1.23em; } .page_faq .page_benefits_work .page_benefits_work_head + * { margin-top: calc(8.5em / 16 * 5); } .page_faq .page_benefits_work .page_benefits_work_body { display: flex; flex-direction: column; gap: calc(8.5em / 8 * 2); } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body { gap: calc(8.5em / 8 * 1); } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block { display: flex; align-items: flex-end; flex-wrap: wrap; gap: calc(8.5em / 16 * 3) calc(8.5em / 8 * 4); width: calc(100% + ((8.5em / 16 * 5) * 2)); margin: 0 calc((8.5em / 16 * -5)); padding: calc(8.5em / 16 * 7); background: var(--color-lightgray); border-radius: 1.0625em; overflow: hidden; } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block { width: calc(100% + ((8.5em / 16 * 1) * 2)); margin: 0 calc((8.5em / 16 * -1)); padding: calc(8.5em / 16 * 2); border-radius: 0.53125em; } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .image { flex: 1; max-width: calc(8.5em / 1 * 3); order: 1; } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .image { order: 0; } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .image div { aspect-ratio: 1/1; background: var(--color-white); border-radius: calc(8.5em / 8); } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .image div { aspect-ratio: 4/3; border-radius: calc(8.5em / 16); } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text { flex: 1; } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text { min-width: 100%; padding: 0 calc(8.5em / 16 * 2) calc(8.5em / 16 * 2); } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dt { font-size: 1.9475em; } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dt { font-size: 1.64em; } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dt + dd { margin-top: calc(8.5em / 16); } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dt + dd { margin-top: calc(8.5em / 12); } } .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dd { max-width: 24.6em; font-size: 1.1275em; } @media screen and (max-width: 768px) { .page_faq .page_benefits_work .page_benefits_work_body .page_benefits_work_body_block > .text dl > dd { font-size: 1.075em; } } .page_faq .page_benefits_career .page_benefits_career_block div { background: var(--color-lightgray); border-radius: calc(8.5em / 8); overflow: hidden; } .page_faq .page_benefits_career .page_benefits_career_block div img { width: 100%; height: auto; } ul.share { display: flex; align-items: center; gap: calc(8.5em / 8); } ul.share > li a i { display: block; width: 1.64em; height: 1.64em; } .page_form { background: var(--white); border-radius: .5em; overflow: hidden; } @media screen and (max-width: 768px) { .page_form .wrapper { width: calc(100% / 16 * 14); } } .page_contact .page_contact-head { max-width: 980px; margin-left: auto; margin-right: auto; } .page_contact .page_contact-head > .title { display: flex; align-items: center; justify-content: center; gap: calc(1em / 2); font-weight: 600; } .page_contact .page_contact-head > .title svg { display: block; width: 1.1275em; height: 1.1275em; fill: var(--key1); } .page_contact .page_contact-head > .content { margin: calc(1em * 1.5) 0; padding: calc(1em * 1.5) 0; border-top: dashed 1px var(--key1); border-bottom: dashed 1px var(--key1); } .page_contact .page_contact-head > .content .callus { display: flex; align-items: center; justify-content: column; flex-direction: column; max-width: 768px; margin-left: auto; margin-right: auto; padding: 1.5em 0; background: var(--background1); border-radius: calc(1em / 8); overflow: hidden; } .page_contact .page_contact-head > .content .callus .phone { font-size: 2.05em; font-weight: 600; } .page_contact .page_contact-head > .content .callus .time { font-weight: 600; } .page_contact .page_contact-head > .content .callus .attr { font-size: .8em; } .page_contact .page_contact-body .title { font-size: 1.435em; font-weight: 600; text-align: center; } .page_contact .page_contact-body .title + * { margin-top: calc(1em / 4 * 3); } .archive_joblist .searchandfilter { display: flex; flex-direction: column; align-items: flex-start; flex-wrap: wrap; } @media screen and (max-width: 768px) { .archive_joblist .searchandfilter { padding: calc(8.5em / 16 * 3); background: var(--border-light-black); border-radius: calc(8.5em / 16); } } .archive_joblist .searchandfilter ul { display: flex; flex-direction: column; gap: calc(8.5em / 16); width: 100%; } .archive_joblist .searchandfilter ul > li { display: flex; flex-direction: column; padding: 0; border-radius: 6px; overflow: hidden; } @media screen and (max-width: 768px) { .archive_joblist .searchandfilter ul > li label { flex: 1; } } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="radio"] { margin-top: calc(8.5em / 8); } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="radio"] ul { display: flex; flex-direction: row; flex-wrap: wrap; gap: calc(8.5em / 24); font-size: .9em; } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="radio"] ul > li { display: table; border-radius: 4px; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="radio"] ul > li:hover { opacity: .5; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .archive_joblist .searchandfilter ul > li[data-sf-field-type="tag"] ul > li:first-child { display: none; } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="link"] a { display: flex; align-items: center; justify-content: center; min-height: 2.87em; background: var(--color-text); border-radius: calc(8.5em / 32); overflow: hidden; color: var(--color-white); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .archive_joblist .searchandfilter ul > li[data-sf-field-input-type="link"] a:hover { filter: brightness(0.8); transform: scale(0.985); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .archive_joblist .searchandfilter h4 { min-width: 5.575em; padding: 0; margin-bottom: calc(8.5em / 16); } .archive_joblist .searchandfilter label { flex: 1; } @media screen and (max-width: 768px) { .archive_joblist .searchandfilter label { display: block; } } .archive_joblist .searchandfilter select { display: block; min-width: 184.5px; max-width: 100%; height: calc(8.5em / 8 * 3); background-color: var(--color-white); border: 1px solid rgba(0, 0, 0, 0.1025); border-radius: 6px; font-size: 16px; padding: 0 40px 0 20px; background-image: url(../images/common/icon-chevron-bottom.svg); background-position: calc(100% - 0.28rem) center; background-size: 0.08rem 0.14rem; } @media screen and (max-width: 768px) { .archive_joblist .searchandfilter select { height: 41px; } } .archive_joblist .searchandfilter input[type="radio"] { display: none; } .archive_joblist .searchandfilter input[type="radio"] + label { padding: calc(8.5em / 24) calc(8.5em / 12); background: var(--color-white); border: solid 1px var(--border-light-black); border-radius: 4px; } .archive_joblist .searchandfilter input[type="radio"]:checked + label { background: #ee781f; color: var(--color-white); } .archive_joblist .searchandfilter input[type="submit"] { display: block; min-width: 100%; height: calc(8.5em / 8 * 3); background-color: var(--color-white); border: 1px solid rgba(0, 0, 0, 0.1025); border-radius: 6px; font-size: 16px; padding: 0 20px; background: #1b1d22; background: url(images/noise.png), #1b1d22; background-repeat: repeat; background-size: 100px; color: var(--color-white); } @media screen and (max-width: 768px) { .archive_joblist .searchandfilter input[type="submit"] { width: 100%; height: 51.25px; } } .archive_joblist .searchandfilter + * { margin-top: calc(8.5em / 16 * 3); } @media screen and (max-width: 768px) { .joblist_archive { width: calc(100% / 30 * 28); margin: 0 auto; } } .joblist_archive ul.list { padding-bottom: calc(8.5em / 8 * 3); border-bottom: solid 1px rgba(0, 0, 0, 0.1025); } .joblist_archive ul.list > li ~ li { margin-top: calc(8.5em / 8 * 3); padding-top: calc(8.5em / 8 * 3); border-top: solid 1px rgba(0, 0, 0, 0.1025); } .joblist_archive ul.list > li .card > ._head h2 { font-size: 1.845em; line-height: 1.435; font-weight: 600; } @media screen and (max-width: 768px) { .joblist_archive ul.list > li .card > ._head h2 { font-size: 1.64em; } } .joblist_archive ul.list > li .card > ._head + * { margin-top: calc(8.5em / 8); } .joblist_archive ul.list > li .card > ._body { display: flex; align-items: flex-start; gap: calc(8.5em / 16) calc(8.5em / 8 * 3); } @media screen and (max-width: 768px) { .joblist_archive ul.list > li .card > ._body { gap: calc(8.5em / 16) calc(8.5em / 8 * 1); } } .joblist_archive ul.list > li .card > ._body > .text { flex: 3; } .joblist_archive ul.list > li .card > ._body > .text ul { border-top: solid 1px rgba(0, 0, 0, 0.1025); font-size: .9em; } .joblist_archive ul.list > li .card > ._body > .text ul li { display: flex; align-items: baseline; padding: calc(8.5em / 16 * 1) 0; border-bottom: solid 1px rgba(0, 0, 0, 0.1025); } .joblist_archive ul.list > li .card > ._body > .text ul li span { flex: 1; font-weight: 600; } .joblist_archive ul.list > li .card > ._body > .text ul li p { flex: 3; } .joblist_archive ul.list > li .card > ._body > .text ul + * { margin-top: calc(8.5em / 8); } .joblist_archive ul.list > li .card > ._body > .thumbnail { flex: 1; border-radius: calc(8.5em / 24); overflow: hidden; } .joblist_archive ul.list > li .card > ._body > .thumbnail img { transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .joblist_archive ul.list > li .card:hover > ._body > .thumbnail img { transform: scale(1.05); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .joblist_archive ul.list > li .linker { display: flex; align-items: center; gap: calc(8.5em / 8 * 1); width: 100%; margin-top: calc(8.5em / 16 * 3); } @media screen and (max-width: 768px) { .joblist_archive ul.list > li .linker { gap: calc(8.5em / 16 * 1); } } .joblist_archive ul.list > li .linker > li { flex: 1; } .joblist_archive ul.list > li .linker > li a { display: flex; align-items: center; justify-content: center; height: calc(8.5em / 8* 3); background: var(--color-black); border: 1px solid rgba(0, 0, 0, 0.1025); border-radius: 6px; font-size: 16px; padding: 0 20px; color: var(--color-white); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .joblist_archive ul.list > li .linker > li a:hover { transform: scale(0.985); filter: brightness(0.9); transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -o-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -moz-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; -webkit-transition: all cubic-bezier(0.28, 1.52, 0.73, 1.25) 0.41s; } .joblist_archive ul.list > li .linker > li[data-type="entry"] a { background: var(--color-key2); } .joblist_archive nav.pagination { margin-top: calc(8.5em / 8 * 3); } .joblist_archive nav.pagination .screen-reader-text { display: none; } .joblist_archive nav.pagination .nav-links { display: flex; align-items: center; justify-content: center; gap: calc(8.5em / 12); } .joblist_archive nav.pagination .nav-links .page-numbers { display: flex; align-items: center; justify-content: center; width: calc(8.5em / 3); height: calc(8.5em / 3); background: #f0f0f0; border-radius: 8.5em; overflow: hidden; } .joblist_archive nav.pagination .nav-links .page-numbers:hover { filter: brightness(0.9); } .joblist_archive nav.pagination .nav-links .page-numbers.current { filter: brightness(1); background: #1b1d22; background: url(images/noise.png), #1b1d22; background-repeat: repeat; background-size: 100px; color: var(--color-white); } .joblist_archive nav.pagination .nav-links .page-numbers.dots { background: none; } .single_joblist .wrapper { width: calc(100% / 30 * 24); margin: 0 auto; } @media screen and (max-width: 768px) { .single_joblist .wrapper { width: calc(100% / 30 * 28); } } .single_joblist .navigation ul { display: flex; align-items: center; gap: calc(8.5em / 16 * 3); } @media screen and (max-width: 768px) { .single_joblist .navigation ul { gap: calc(8.5em / 16 * 1); } } .single_joblist .navigation ul > li { flex: 1; background: linear-gradient(135deg, var(--text) 90%, var(--key4)); border-radius: 4px; overflow: hidden; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .single_joblist .navigation ul > li:last-child { background: linear-gradient(135deg, var(--key5) 90%, var(--key4)); } .single_joblist .navigation ul > li:hover { filter: brightness(0.95); transform: scale(0.985); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .single_joblist .navigation ul > li a { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 3.28em; color: var(--white); } @media screen and (max-width: 768px) { .single_joblist .navigation ul > li a { min-height: 2.46em; } } .single_joblist .navigation ul > li a::after { content: ''; display: block; width: 1em; height: 1em; background: url(images/icon/arrowb.svg), var(--white); background-size: .5em; background-repeat: no-repeat; background-position: center; border-radius: 2px; border: solid 1px var(--border-light-black); } .single_joblist .navigation + * { margin-top: calc(8.5em / 16 * 4); } .single_joblist .joblist_body .job_attr { display: flex; align-items: center; flex-direction: column; gap: calc(8.5em / 16); } .single_joblist .joblist_body .job_attr h1 { font-weight: 600; font-size: 1.64em; } .single_joblist .joblist_body .job_attr ul.category { display: flex; align-items: center; flex-wrap: wrap; gap: calc(8.5em / 16); } @media screen and (max-width: 768px) { .single_joblist .joblist_body .job_attr ul.category { gap: 6px; } } .single_joblist .joblist_body .job_attr ul.category > li { display: flex; align-items: center; justify-content: center; min-height: 2.255em; padding: 0 calc(8.5em / 32 * 3); background: var(--white); background: url(images/noise.png), var(--white); background-size: 100px, cover; background-repeat: repeat; background-blend-mode: normal; border-radius: calc(8.5em / 32); } @media screen and (max-width: 768px) { .single_joblist .joblist_body .job_attr ul.category > li { min-height: 1.435em; padding: 0 calc(8.5em / 32 * 2); } } .single_joblist .joblist_body .job_attr + * { margin-top: calc(8.5em / 16 * 3); } .single_joblist .joblist_body .thumbnail { aspect-ratio: 2.35 / 1; border-radius: calc(8.5em / 32); overflow: hidden; line-height: 0; } @media screen and (max-width: 768px) { .single_joblist .joblist_body .thumbnail { aspect-ratio: 16/9; } } .single_joblist .joblist_body .thumbnail + * { margin-top: calc(8.5em / 16 * 4); } .single_joblist .joblist_body .joblist_block hgroup h3 { font-size: 1.435em; } .single_joblist .joblist_body .joblist_block hgroup + * { margin-top: calc(8.5em / 8); } .single_joblist .joblist_body .joblist_block ~ .joblist_block { margin-top: calc(8.5em / 8 * 3); } .single_joblist .joblist_foot { margin-top: calc(8.5em / 8 * 6); padding: calc(8.5em / 16 * 6); background: var(--color-white); background: url(images/noise.png), var(--color-white); background-size: 100px, cover; background-repeat: repeat; background-blend-mode: normal; border-radius: calc(8.5em / 32); } @media screen and (max-width: 768px) { .single_joblist .joblist_foot { margin-top: calc(8.5em / 8 * 4); padding: calc(8.5em / 16 * 2); padding-top: calc(8.5em / 16 * 5); } } .single_joblist .joblist_foot .joblist_block hgroup h3 { text-align: center; } .single_joblist .requirements_wrapper { padding: 40px 32px; background: var(--white); border-radius: 8px; overflow: hidden; } @media screen and (max-width: 768px) { .single_joblist .requirements_wrapper { padding: 20px 16px; } } .single_joblist .requirements_wrapper ul.list { border-top: solid 1px var(--border-light-black); } .single_joblist .requirements_wrapper ul.list > li { padding: calc(8.5em / 16); border-bottom: solid 1px var(--border-light-black); } @media screen and (max-width: 768px) { .single_joblist .requirements_wrapper ul.list > li { padding: 0; } } .single_joblist .requirements_wrapper ul.list > li dl { display: flex; flex-wrap: wrap; column-gap: 18px; } @media screen and (max-width: 768px) { .single_joblist .requirements_wrapper ul.list > li dl { flex-direction: column; } } .single_joblist .requirements_wrapper ul.list > li dl > dt { flex: 1; padding: calc(85px / 8) calc(85px / 6); border-right: solid 1px var(--border-light-black); } @media screen and (max-width: 768px) { .single_joblist .requirements_wrapper ul.list > li dl > dt { padding-bottom: 0; border-right: 0; line-height: 1; font-size: .85em; } } .single_joblist .requirements_wrapper ul.list > li dl > dt span { letter-spacing: .041em; font-weight: 600; } .single_joblist .requirements_wrapper ul.list > li dl > dd { flex: 3; padding: calc(85px / 6); } .single_joblist .requirements_wrapper ul.list > li dl > dd span { display: block; } .single_joblist .requirements_wrapper ul.list > li dl > dd span ~ span { margin-top: 1em; } .post_social { position: relative; z-index: 15; margin-top: calc(8.5em / 16 * 3); } .post_social h6 { margin: 0; text-align: center; font-size: 1em; font-weight: 500; } .post_social h6 + * { margin-top: calc(8.5em / 16* 2); } .post_social ul { display: flex; align-items: center; justify-content: center; gap: calc(8.5em / 16* 3); } .post_social ul > li a { display: block; } .post_social ul > li a i { display: block; width: calc(8.5em / 16* 3); height: calc(8.5em / 16* 3); } .page_privacy { background: var(--white); border-radius: .5em; overflow: hidden; } .page_privacy .page_head p { font-size: 0.9em !important; } .page_privacy .page_head nav { margin: calc(8.5em / 16 * 3) calc(8.5em / 8 * 2); padding: calc(8.5em / 8 * 2); background: #f7f7f7; } @media screen and (max-width: 768px) { .page_privacy .page_head nav { margin: calc(8.5em / 16 * 3) 0; padding: calc(8.5em / 16 * 2); } } .page_privacy .page_head nav > span { display: block; color: var(--color-gray); margin-bottom: calc(8.5em / 16 * 1); } .page_privacy .page_head nav ul > li a { display: block; padding: calc(8.5em / 32 * 1) 0; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } @media screen and (max-width: 768px) { .page_privacy .page_head nav ul > li a { padding: calc(8.5em / 64 * 1) 0; } } .page_privacy .page_head nav ul > li a:hover { opacity: .5; transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .page_privacy ul.list { padding: calc(8.5em / 16 * 4) 0; border-top: solid 1px rgba(0, 0, 0, 0.1025); border-bottom: solid 1px rgba(0, 0, 0, 0.1025); } .page_privacy ul.list > li ~ li { margin-top: calc(8.5em / 16 * 3); } .page_privacy ul.list > li[data-number] { display: flex; align-items: flex-start; justify-content: center; } .page_privacy ul.list > li[data-number]::before { content: attr(data-number) ""; display: block; width: 3rem; font-weight: 600; font-size: 1.3325em; color: #ee781f; line-height: 1.64; } .page_privacy ul.list + p { margin-top: calc(85px / 8 * 3); } .page_privacy dl._list { margin: 0 calc(8.5em / 16 * 4); } @media screen and (max-width: 768px) { .page_privacy dl._list { margin: 0; } } .page_privacy dl._list > dt { font-size: 1.3325em; font-weight: 600; } .page_privacy dl._list > dt + dd { margin-top: 12px; } .page_privacy dl._list > dd { padding-left: 1em; font-size: .9em; } .page_privacy dl._list > dd > * + * { margin-top: calc(8.5em / 16); } .page_privacy ul.disc { display: flex; flex-direction: column; gap: calc(8.5em / 32); } .page_privacy ul.disc > li { display: flex; align-items: baseline; column-gap: calc(8.5em / 16); line-height: 1.5; } .page_privacy ul.disc > li::before { content: ''; width: 1em; min-width: 1em; height: 1em; background: var(--color-black); border-radius: 50%; transform: scale(0.41); } .page_privacy ul.number { display: flex; flex-direction: column; gap: calc(8.5em / 32); counter-reset: num; } .page_privacy ul.number > li { display: flex; align-items: baseline; column-gap: calc(8.5em / 16); line-height: 1.5; } .page_privacy ul.number > li::before { counter-increment: num; content: counter(num); width: 1em; min-width: 1em; height: 1em; } .page_privacy .contactus > ul { display: flex; flex-direction: column; padding: calc(8.5em / 16 * 2) 0; background: var(--color-lightgray); } .page_privacy .contactus > ul > li { padding: calc(8.5em / 16 * 2); border-bottom: solid 1px var(--border-light-black); } .page_privacy .contactus > ul > li > dl { display: flex; } @media screen and (max-width: 768px) { .page_privacy .contactus > ul > li > dl { flex-direction: column; row-gap: calc(8.5em / 32); } } .page_privacy .contactus > ul > li > dl > dt { flex: 1; font-weight: 600; } .page_privacy .contactus > ul > li > dl > dd { flex: 3; } .-page.entry header { background: #0100a7; background: url(images/noise.png), #0100a7; background-repeat: repeat; background-size: 100px; } .-page.entry header * { color: var(--color-white); } .-page.entry header + .thumbnail { margin-bottom: calc(100% / 32 * -3); } @media screen and (max-width: 768px) { .-page.entry header + .thumbnail { margin-bottom: calc(100% / 32 * -4); } } .-page.entry section { background: var(--color-white); } .-page.entry section.nul { background: initial; } .formWrap { position: relative; z-index: 15; } .formWrap .caption { display: table; margin-left: auto; margin-right: auto; margin-bottom: 2.05em; } @media screen and (max-width: 768px) { .formWrap .caption { margin-bottom: 1.23em; } } ul.listDocForm li { margin-bottom: 1em; } @media screen and (max-width: 768px) { ul.listDocForm li { margin-bottom: 1em; } } ul.listDocForm li.input { text-align: center; } @media screen and (max-width: 768px) { ul.listDocForm li.input { text-align: left; } } ul.listDocForm li.input a { color: var(--key1); } ul.listDocForm li.hidden { display: none; } ul.listDocForm li:last-child { margin-bottom: 0; } dl.listDocForm { display: flex; align-items: center; gap: .5em 1.5em; } @media screen and (max-width: 768px) { dl.listDocForm { flex-direction: column; } } dl.listDocForm dt { flex: 2; width: 100%; } dl.listDocForm dt p { display: flex; align-items: baseline; justify-content: flex-end; column-gap: calc(1em / 2); white-space: nowrap; font-weight: 600; } @media screen and (max-width: 768px) { dl.listDocForm dt p { justify-content: flex-start; } } dl.listDocForm dt p::after { content: ''; display: flex; align-items: center; justify-content: center; width: 3.28em; height: 1.64em; background: var(--white); border-radius: calc(1em / 4); color: var(--white); font-size: .85em; } dl.listDocForm dt p.must { position: relative; z-index: 15; } dl.listDocForm dt p.must::after { content: '必須'; background: var(--red); } dl.listDocForm dd { flex: 5; display: flex; align-items: baseline; flex-wrap: wrap; column-gap: calc(85px / 4); width: 100%; margin-top: 5px; } @media screen and (max-width: 768px) { dl.listDocForm dd { column-gap: calc(85px / 8); margin-top: 3px; } } dl.listDocForm dd > br { display: none; } dl.listDocForm dd span.caption { display: block; width: 100%; margin-top: .41em; font-size: .85em; } .mw_wp_form { max-width: 768px; margin: 0 auto; padding: calc(8em / 8 * 3) 0; } @media screen and (max-width: 768px) { .mw_wp_form { padding: calc(8em / 16 * 3) 0; } } .mw_wp_form .horizontal-item + .horizontal-item { margin: 0 !important; } .mw_wp_form span.mwform-checkbox-field { position: relative; z-index: 15; margin-right: 6px; } .mw_wp_form span.mwform-checkbox-field input { position: absolute; top: 0; left: 0; opacity: 0; pointer-events: none; } .mw_wp_form span.mwform-checkbox-field input:checked + span.mwform-checkbox-field-text::after { transform: scale(1); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .mw_wp_form span.mwform-checkbox-field span.mwform-checkbox-field-text { display: block; border: solid 1px #eeeeee; background: var(--background3); padding: 8px 18px 8px 44px; border-radius: 5px; } .mw_wp_form span.mwform-checkbox-field span.mwform-checkbox-field-text::before { content: ''; position: absolute; left: 12px; top: calc(50% - 10px); display: block; width: 20px; height: 20px; border-radius: 3px; background: var(--background3); border: solid 1px var(--border-light-black); } .mw_wp_form span.mwform-checkbox-field span.mwform-checkbox-field-text::after { content: ''; position: absolute; left: 16px; top: calc(50% - 6px); display: block; width: 14px; height: 14px; border-radius: 2px; background: var(--color-key1); transform: scale(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .mw_wp_form span.mwform-radio-field { position: relative; z-index: 15; } .mw_wp_form span.mwform-radio-field input { position: absolute; top: 0; left: 0; opacity: 0; pointer-events: none; } .mw_wp_form span.mwform-radio-field input:checked + span.mwform-radio-field-text::after { transform: scale(1); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .mw_wp_form span.mwform-radio-field span.mwform-radio-field-text { display: block; padding: 8px 18px 8px 44px; border-radius: 5px; } .mw_wp_form span.mwform-radio-field span.mwform-radio-field-text::before { content: ''; position: absolute; left: 12px; top: calc(50% - 10px); display: block; width: 20px; height: 20px; border-radius: 20px; background: var(--background3); border: solid 1px var(--border-light-black); } .mw_wp_form span.mwform-radio-field span.mwform-radio-field-text::after { content: ''; position: absolute; left: 16px; top: calc(50% - 6px); display: block; width: 14px; height: 14px; border-radius: 14px; background: var(--color-key1); transform: scale(0); transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -o-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -moz-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; -webkit-transition: cubic-bezier(0.55, 0.05, 0.22, 0.99) 0.328s; } .mw_wp_form form > p { display: none; } .mw_wp_form input::placeholder { color: #aaa; } .mw_wp_form input:focus::-webkit-input-placeholder { color: transparent; } .mw_wp_form input:focus::-moz-placeholder { color: transparent; } .mw_wp_form input:focus::-ms-input-placeholder { color: transparent; } .mw_wp_form input:focus::placeholder { color: transparent; } .mw_wp_form input[type="text"], .mw_wp_form textarea { width: 100%; height: auto; border: solid 1px var(--border-light-black); background: var(--background3); border-radius: 0; line-height: 1.5; color: #231814; font-size: 16px; border-radius: 6px; -webkit-appearance: none; appearance: none; } .mw_wp_form select { width: 100%; height: auto; border: solid 1px var(--border-light-black); background: var(--background3); border-radius: 0; line-height: 1.5; color: var(--color-text); font-size: 16px; border-radius: 6px; } .mw_wp_form input[type="text"], .mw_wp_form textarea { padding: .82em; } .mw_wp_form select { position: relative; z-index: 15; padding: 0 .82em; } .mw_wp_form select::after { content: ''; position: absolute; right: .82em; top: calc(50% - .5em); display: block; width: 1em; height: 1em; background: url(images/icn-arrow-p.svg); background-size: cover; } .mw_wp_form input[type="radio"] + span { color: #252525; } .mw_wp_form input[type="text"]#namehead, .mw_wp_form input[type="text"]#kanahead { flex: 1; } .mw_wp_form input[type="text"]#namebody, .mw_wp_form input[type="text"]#kanabody { flex: 1; } .mw_wp_form input[type="text"]#postcode { width: 10em; } .mw_wp_form input[type="text"]#address1, .mw_wp_form input[type="text"]#address2 { flex: 1; margin-right: 1em; } .mw_wp_form input[type="text"]#address3 { flex: 2; } .mw_wp_form input[type="text"]#old { width: 10em; margin-right: 1em; } .mw_wp_form input[type="text"]#date2, .mw_wp_form input[type="text"]#date3 { margin-top: 1em; } .mw_wp_form input[type="text"]#year, .mw_wp_form input[type="text"]#month, .mw_wp_form input[type="text"]#date { width: 8.2em; } .mw_wp_form input[type="text"]#year + span, .mw_wp_form input[type="text"]#month + span, .mw_wp_form input[type="text"]#date + span { margin: 0 .82em 0 .41em; } .mw_wp_form input[type="text"].address { margin-top: 7px; } .mw_wp_form select { height: 4em; } .mw_wp_form label { /*line-height: 4em;*/ } .mw_wp_form input[type="text"]:focus, .mw_wp_form textarea:focus, .mw_wp_form select:focus { outline: none; border: solid 1px #a0a0a0; } .mw_wp_form input[type="submit"] { width: 100%; max-width: 18rem; height: 3em; border: none; font-weight: bold; text-align: center; line-height: 3em; font-size: 1em; background: var(--key5); color: var(--color-white); position: relative; margin: 0 auto; border-radius: calc(1em / 4); overflow: hidden; display: block; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } @media screen and (max-width: 768px) { .mw_wp_form input[type="submit"] { height: 4em; line-height: 4em; } } .mw_wp_form input[type="submit"]:hover { background: #0b0f15; transition: cubic-bezier(0.22, 0.61, 0.36, 1) 0.3s; } .mw_wp_form.mw_wp_form_confirm ul.listDocForm li.entryBtnWrap { display: flex; } .mw_wp_form.mw_wp_form_confirm ul.listDocForm li.entryBtnWrap input[type="submit"].back { order: 1; background: #252525; } .mw_wp_form.mw_wp_form_confirm dl.listDocForm dd { background: #f7f7f7; padding: 1.23em 2.46em; border-radius: 4px; border: solid 1px #eee; color: #777; } .mw_wp_form.mw_wp_form_confirm dl.listDocForm dl.listComplete { font-weight: 500; } .mw_wp_form.mw_wp_form_complete .completeWrap > * ~ * { margin-top: .82em; } .mw_wp_form.mw_wp_form_complete .completeWrap dl.listComplete dt p { font-weight: 500; font-size: 1.41em; margin-top: .82em; } /*//!#index----------------------------------------------------------------------------------------------*/ /* ie hack */ @media all and (-ms-high-contrast: none) { .headerLogo img { width: 100%; height: 4.5vw; } a.btn > span.circle { border: solid 2px rgba(240, 95, 64, 0.2); } ul.listFooterNav > li span.circle { border: solid 2px rgba(240, 95, 64, 0.2); } .careerstepWrap .flexWrap > .flexCenter .inner { border: solid 2px rgba(240, 95, 64, 0.8); } .secIndex.sec1 .kv_leadcopy .kv_leadcopy_inner { width: 100%; } .secIndex.sec3 .indexService .swiper-button-prev { left: auto; bottom: auto; } dl.listFootnav dt a { display: inline-block; } .secPage.root .flexWrap > .flexItem { width: calc((100% / 3) - 0.01px); } ul.listPhilosophy { justify-content: space-around; } .member_wrapper .f_wrapper .__left { position: relative; } header.pageHeader { height: 31.5em; } ul.listLGBtn a.btn { width: 100%; } ul.listLogos li img { width: 8em; } ul.listLogos { justify-content: space-between; } } /*ヘッダー調整*/ nav.globalNav ul.listGlobal li span.en { white-space: nowrap; } /*page_csr*/ .card_text ._body > img { margin-bottom: 0.82em; } /*page_career*/ .careerImg { margin-bottom: 2.05em; } /*page_csr*/ dl.listSDGs dt > span { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; padding-left: 0; margin: 0 1.23em; } dl.listSDGs dt > span img { width: calc(50% - 2px); } dl.listSDGs dt > span img:nth-child(n+3) { margin-top: 4px; } /*page_business/~*/ p.writer { text-align: right; font-size: 1em; margin-top: 0.82em; } p.writer > span { display: block; font-size: .8em; margin-bottom: .205em; } /*page_movie*/ .secPage.lp.movie h2.pageTtl { background: #fff; } /*single-events*/ body.single-events .flexLower { margin-bottom: 6.15em; } .secPage.basic.eventForm .wrapper { padding-bottom: 0; } /*page_about 事業紹介 画像調整*/ @media screen and (max-width: 768px) { .type_wrapper ._stokerImg { position: absolute; right: 0; left: auto; } } /*crosstalk 調整*/ .interview_wrapper ._body p.box ~ p.box { margin-top: 1.125em; } .interview_wrapper ._body p.box span { font-size: 0.625em; font-weight: 600; }