@charset "UTF-8"; /*** The new CSS reset - version 1.8.4 (last updated 14.2.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; vertical-align: top; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } .c5-globalHeader { background-color: #000000; padding-left: 30px; padding-right: 30px; z-index: 300; } .c5-globalHeader--inner { max-width: 1200px; height: 64px; margin-left: auto; margin-right: auto; display: flex; justify-content: space-between; align-items: center; } @media screen and (max-width: 980px) { .c5-globalHeader--inner { height: 100%; } } .c5-globalHeader .c5-globalHeader--corporateLogo { height: auto; width: 100px; display: flex; align-items: center; } .c5-globalHeader .c5-brandLogo--braviaBiz { height: 100%; aspect-ratio: 540/296; } @media screen and (max-width: 980px) { .c5-globalHeader { height: clamp(50px, 30.192px + 5.28vw, 64px); padding-left: 20px; padding-right: 20px; } .c5-globalHeader .c5-globalHeader--corporateLogo { width: clamp(80px, 51.696px + 7.55vw, 100px); } } .c5-globalFooter { background-color: #000000; height: 46px; padding-left: 100px; padding-right: 100px; display: flex; justify-content: center; align-items: center; } .c5-globalFooter--copyright { color: #ffffff; font-size: 10px; } @media screen and (max-width: 640px) { .c5-globalFooter { padding-left: 20px; padding-right: 20px; margin-bottom: 50px; } } html { scroll-behavior: smooth; } body { background-color: #EDEDED; line-height: unset; } section { margin-bottom: unset; } a:focus-visible { outline: revert; } @media screen and (max-width: 640px) { .c5-pc { display: none; } } .c5-only-sp { display: none !important; } @media screen and (max-width: 768px) { .c5-only-sp { display: block !important; } } .c5-pc-only__inline { display: flex !important; } @media screen and (max-width: 768px) { .c5-pc-only__inline { display: none !important; } } .c5-sp-only__inline { display: none !important; } @media screen and (max-width: 768px) { .c5-sp-only__inline { display: flex !important; } } .c5-bgBlack { background-color: #000000; color: #ffffff; } .c5-bgGray { background-color: #212121; color: #ffffff; } .c5-bgWhite { background-color: #ffffff; color: #000000; } .c5-bgLightBlue { background-color: #ECFAFA; } .c5-bgBlue { background-color: #2D75C7; color: #ffffff; } .c5-inlineBlock { display: inline-block; } .c5-text__center { text-align: center; } .c5-flex__center { display: flex; justify-content: center; align-items: center; } .c5-pd--top__63 { padding-top: 63px; } .c5-pd--top__96 { padding-top: 96px; } @media screen and (max-width: 640px) { .c5-pd--top__63 { padding-top: clamp(40px, 7.456px + 8.68vw, 63px); } } .c5-br-sp { display: none; } @media screen and (max-width: 640px) { .c5-br-sp { display: unset; } } .c5-hr__gray { display: block; width: 100%; height: 1px; background-color: #3B3B3B; } .c5-section { padding-left: 40px; padding-right: 40px; } @media screen and (max-width: 980px) { .c5-section { padding-left: 30px; padding-right: 30px; } } @media screen and (max-width: 640px) { .c5-section { padding-left: 15px; padding-right: 15px; } } .c5-section--hero { padding-left: 0; padding-right: 0; } .c5-section--inner { max-width: 1200px; margin-left: auto; margin-right: auto; } .c5-outer__padding { padding-left: 40px; padding-right: 40px; } @media screen and (max-width: 980px) { .c5-outer__padding { padding-left: 30px; padding-right: 30px; } } @media screen and (max-width: 640px) { .c5-outer__padding { padding-left: clamp(15px, -6.224px + 5.66vw, 30px); padding-right: clamp(15px, -6.224px + 5.66vw, 30px); /* padding-left: clamp(15px, 4.69vw, 30px); padding-right: clamp(15px, 4.69vw, 30px); */ } .c5-outer__padding__narrow { padding-left: 8.976px; padding-right: 8.976px; } } .c5-sec--titleA { width: 100%; height: 156px; padding-top: 14px; display: flex; justify-content: center; align-items: center; } @media screen and (max-width: 640px) { .c5-sec--titleA { height: 104px; } } .c5-sec--titleB { width: 100%; height: 136px; display: flex; justify-content: center; align-items: center; text-align: center; font-size: 32px; font-weight: 700; } .c5-sec--titleB::before { content: ""; display: block; height: 1px; width: 98px; background: linear-gradient(to right, #ffffff, #383838); margin-right: 16px; } .c5-sec--titleB::after { content: ""; display: block; height: 1px; width: 98px; background: linear-gradient(to left, #ffffff, #383838); margin-left: 16px; } @media screen and (max-width: 640px) { .c5-sec--titleB { font-size: clamp(18px, 4px + 4.38vw, 32px); margin-top: clamp(32px, 20.672px + 3.02vw, 40px); height: clamp(100px, 49.056px + 13.58vw, 136px); } .c5-sec--titleB::before { width: clamp(50px, 2px + 15vw, 98px); margin-right: clamp(13px, 10px + 0.94vw, 16px); } .c5-sec--titleB::after { width: clamp(50px, 2px + 15vw, 98px); margin-left: clamp(13px, 10px + 0.94vw, 16px); } } .c5-onayami { display: flex; justify-content: center; flex-wrap: wrap; /* &--grid{ width: 550px; display: grid; grid-template-columns: 17.3% 82.7%; background-color: #ffffff; transition: all; h4{ padding-right: 13px; line-height: 1.6; text-decoration: underline rgba($color: #000000, $alpha: 0); transition: all 0.5s ease; } &:hover{ h4{ text-decoration: underline rgba($color: #000000, $alpha: 1); } .c5-onayami--body{ opacity: 0.8; } } @include pc-s{ width: 42vw; h4{ font-size: clamp(16px, -0.352px + 1.67vw, 21px); } } @include tablet-s{ width: 100%; max-width: 550px; grid-template-columns: 23.47% 1fr; h4{ font-size: 21px; //padding-top: 20px; } } @media screen and (max-width:590px) { h4{ font-size: clamp(19px, 15.504px + 0.93vw, 21px); } } @media screen and (max-width:374px) { h4{ font-size: 17px; } } } */ /* &--number{ display: flex; align-items: flex-start; justify-content: center; grid-row: 1 / 3; padding-top: 14px; img{ width: 50px; } @include pc-s{ img{ width: 3.9vw; } } @include tablet-s{ img{ width: unset; } } @media screen and (max-width:590px) { img{ width: 10.1vw; } } } */ /* &--h4{ position: relative; height: 56px; display: flex; justify-content: flex-start; align-items: center; font-size: 21px; font-weight: 700; line-height: 1; h4{ border-bottom: rgba(0,0,0,0) solid 1px; } span{ background: linear-gradient(to top, rgba(0,0,0,0) 5px, #F5FF00 5px); } } */ /* &--body{ grid-column-start: 2; position: relative; transition: opacity 0.5s; span{ display: flex; align-items: center; justify-content: space-around; position: absolute; font-size: 15px; font-weight: 700; color: #ffffff; background-color: #FF4E4E; height: 27px; width: 98px; bottom: 0; right: 12px; padding-left: 11px; &::after{ content: ""; width: 0; height: 0; border-style: solid; border-width: 27px 0 0 12px; border-color: transparent transparent transparent #ff4e4e; transform: translateX(12px); } } } */ /* @include tablet-s{ flex-direction: column; flex-wrap: nowrap; &--h4{ height: 19.2vw; } } */ /* @include sp{ &--body{ span{ width: 72px; height: 21px; right: 9px; padding-left: 3px; font-size: 12px; &::after{ border-width: 21px 0 0 9px; transform: translateX(9px); } } } } */ } .c5-onayami--item { margin-left: 24px; margin-right: 24px; margin-bottom: 48px; max-width: 550px; } @media screen and (max-width: 1280px) { .c5-onayami--item { margin-left: 1.75vw; margin-right: 1.75vw; margin-bottom: 3.6vw; width: 42vw; } } @media screen and (max-width: 980px) { .c5-onayami--item { margin-left: auto; margin-right: auto; margin-bottom: 3.47vw; width: 100%; max-width: 550px; } } .c5-onayami--outerFlex { display: flex; height: 100%; } .c5-onayami--outerFlex:hover h4 { -webkit-text-decoration: underline black; text-decoration: underline black; } .c5-onayami--outerFlex:hover .c5-onayami--body { opacity: 0.8; } .c5-onayami--number { width: 95px; display: flex; justify-content: center; padding-top: 14px; flex-shrink: 0; } .c5-onayami--number img { width: 50px; height: -moz-fit-content; height: fit-content; } @media screen and (max-width: 640px) { .c5-onayami--number { width: 21.3vw; padding-top: 4vw; justify-content: flex-start; padding-left: 4.26vw; } .c5-onayami--number img { width: 10vw; } } .c5-onayami--innerFlex { display: flex; flex-direction: column; justify-content: space-between; } .c5-onayami--h4 { padding: 13px 13px 7px 0; line-height: 1.6; -webkit-text-decoration: underline rgba(0, 0, 0, 0); text-decoration: underline rgba(0, 0, 0, 0); transition: all 0.5s ease; font-size: 22px; font-weight: 700; letter-spacing: 0.02em; display: flex; align-items: center; height: 100%; } .c5-onayami--h4 h4 { border-bottom: rgba(0, 0, 0, 0) solid 1px; } .c5-onayami--h4 span { background: linear-gradient(to top, rgba(0, 0, 0, 0) 5px, #F5FF00 5px); } @media screen and (max-width: 640px) { .c5-onayami--h4 { font-size: clamp(19px, 14.752px + 1.13vw, 22px); letter-spacing: -0.02em; padding-top: 2.13vw; padding-bottom: 1.2vw; } } @media screen and (max-width: 375px) { .c5-onayami--h4 { font-size: 17px; } } .c5-onayami--body { position: relative; transition: opacity 0.5s; } .c5-onayami--body span { display: flex; align-items: center; justify-content: space-around; position: absolute; font-size: 15px; font-weight: 700; color: #ffffff; background-color: #FF4E4E; height: 27px; width: 98px; bottom: 0; right: 12px; padding-left: 11px; } .c5-onayami--body span::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 27px 0 0 12px; border-color: transparent transparent transparent #ff4e4e; transform: translateX(12px); } @media screen and (max-width: 640px) { .c5-onayami--body span { width: 72px; height: 21px; right: 9px; padding-left: 3px; font-size: 12px; } .c5-onayami--body span::after { border-width: 21px 0 0 9px; transform: translateX(9px); } } .c5-onayami--body.c5-jirei--body span { color: #000000; background-color: #fff; bottom: 1em; right: 0; width: 134px; } .c5-onayami--body.c5-jirei--body span::after { position: relative; border: none; transform: translateX(0); display: block; width: 9px; height: 9px; border-top: 1px solid #000000; border-right: 1px solid #000000; transform: rotate(45deg); } @media screen and (max-width: 640px) { .c5-onayami--body.c5-jirei--body span { right: 0; width: 96px; } .c5-onayami--body.c5-jirei--body span::after { transform: scale(0.7) rotate(45deg); } } .c5-lineup { display: flex; flex-wrap: wrap; justify-content: center; } .c5-lineup--item { background-color: #ffffff; color: #000000; width: 524px; margin: 0 16px 32px; } .c5-lineup--item a { width: 100%; height: 100%; display: block; transition: all 0.5s ease; } .c5-lineup--item a:hover { opacity: 0.8; } .c5-lineup--item a dl { display: flex; flex-direction: column; justify-content: space-between; height: 100%; width: 100%; font-size: 20px; font-weight: 700; } .c5-lineup--item a dl dt { text-align: end; } @media screen and (max-width: 1280px) { .c5-lineup--item { width: 40.9vw; margin: 0 1.25vw 2.5vw; } } @media screen and (max-width: 768px) { .c5-lineup--item { width: 100%; max-width: 550px; margin-left: 0; margin-right: 0; margin-bottom: 32px; } } @media screen and (max-width: 640px) { .c5-lineup--item { margin-bottom: 4.26vw; } } .c5-link--link_A { position: relative; display: flex; justify-content: center; align-items: center; padding: 15px 0; transition: all 0.5s ease; font-size: 20px; -webkit-text-decoration: underline rgba(0, 0, 0, 0); text-decoration: underline rgba(0, 0, 0, 0); } .c5-link--link_A:hover { -webkit-text-decoration: underline black; text-decoration: underline black; opacity: 0.8; } .c5-link--link_A:hover::after { opacity: 0.8; } .c5-link--link_A::after { content: ""; display: block; width: 9px; height: 9px; border-top: 1px solid #000000; border-right: 1px solid #000000; transform: rotate(45deg); margin-left: 8px; } .c5-link--link_A__wh { -webkit-text-decoration: underline rgba(255, 255, 255, 0); text-decoration: underline rgba(255, 255, 255, 0); } .c5-link--link_A__wh:hover { -webkit-text-decoration: underline white; text-decoration: underline white; } .c5-link--link_A__wh::after { border-top-color: #ffffff; border-right-color: #ffffff; } .c5-link--link_A__exWindow::after { border: none; transform: unset; width: 14px; height: 12px; background-image: url(../img/common/link-bl@2x.png); background-size: cover; } .c5-link--link_A__exWindow__wh::after { background-image: url(../img/common/link-wh@2x.png); background-size: cover; border: none; } .c5-link--link_A__exWindow__arrow::before { content: ""; display: block; width: 9px; height: 9px; border-top: 1px solid #000000; border-right: 1px solid #000000; transform: rotate(45deg); position: absolute; right: -12px; } .c5-link--link_A__exWindow__arrow__wh::before { border-top-color: #ffffff; border-right-color: #ffffff; } @media screen and (max-width: 640px) { .c5-link--link_A { font-size: clamp(18px, 15.168px + 0.75vw, 20px); } } .c5-link--link_B { text-decoration: underline; } .c5-link--link_B:hover { color: #240082; } .c5-link--targetBlank::after { content: ""; display: inline-block; margin-left: 10px; border: none; transform: unset; width: 14px; height: 12px; background-image: url(../img/common/link-bl@2x.png); background-size: cover; } .c5-inquiry { margin-bottom: 60px; } .c5-inquiry--head { height: 90px; display: flex; justify-content: center; align-items: center; font-size: 30px; font-weight: 700; } .c5-inquiry--p { font-size: 18px; text-align: center; line-height: 2; } .c5-inquiry--links { padding: 18px 18px 41px; display: flex; justify-content: center; flex-wrap: wrap; } .c5-inquiry--linkItem { margin: 8px 18px; } .c5-inquiry--linkItem a { position: relative; width: 336px; height: 60px; display: flex; justify-content: center; align-items: center; background-color: #2D75C7; color: #ffffff; font-size: 16px; font-weight: 700; -webkit-text-decoration: underline rgba(255, 255, 255, 0); text-decoration: underline rgba(255, 255, 255, 0); transition: all 0.5s ease; } .c5-inquiry--linkItem a::after { position: absolute; top: 50%; right: 20px; transform-origin: center right; transform: translateY(-50%) scale(50%); content: url(../img/common/link-wh@2x.png); display: block; } .c5-inquiry--linkItem a:hover { -webkit-text-decoration: underline white; text-decoration: underline white; opacity: 0.8; } .c5-inquiry--linkItem--black a { background-color: #000000; } @media screen and (max-width: 1280px) { .c5-inquiry--head { height: auto; padding-top: 5.3vw; padding-bottom: 4vw; font-size: clamp(20px, 5.856px + 3.77vw, 30px); } .c5-inquiry--p { font-size: clamp(14px, 8.336px + 1.51vw, 18px); } .c5-inquiry--links { padding-top: 5.3vw; padding-bottom: 3.2vw; padding-left: 1.4vw; padding-right: 1.4vw; } .c5-inquiry--linkItem { margin-left: 1.4vw; margin-right: 1.4vw; margin-bottom: 4.26vw; } .c5-inquiry--linkItem a { width: 26.25vw; } } @media screen and (max-width: 640px) { .c5-inquiry { margin-bottom: clamp(30px, -40.752px + 18.87vw, 80px); padding-left: 4vw; padding-right: 4vw; } .c5-inquiry--links { padding-left: 0; padding-right: 0; flex-direction: column; } .c5-inquiry--linkItem { margin-top: 0; margin-left: 0; margin-right: 0; } .c5-inquiry--linkItem a { width: 100%; } } .c5-bnrArea-A { padding-bottom: 80px; } .c5-bnrArea-A--bnrList { display: flex; flex-direction: column; flex-wrap: wrap; align-items: center; width: 100%; } .c5-bnrArea-A--bnr { max-width: 960px; margin-bottom: 40px; } .c5-bnrArea-A--bnr:last-child { margin-bottom: 0; } .c5-bnrArea-A--bnr a { transition: all 0.5s ease; } .c5-bnrArea-A--bnr a:hover { opacity: 0.8; } @media screen and (max-width: 640px) { .c5-bnrArea-A { padding-bottom: 9.3vw; } .c5-bnrArea-A--bnr { margin-bottom: clamp(12px, -27.61px + 10.57vw, 40px); } } .c5-stickyNav { position: fixed; top: 200px; right: 0; } .c5-stickyNav ul { display: flex; align-items: center; justify-content: center; width: 44px; writing-mode: vertical-rl; font-size: 14px; font-weight: 700; } .c5-stickyNav li { width: 100%; } .c5-stickyNav li a { display: flex; align-items: center; justify-content: center; width: 100%; padding: 20px 0; transition: all 0.5s ease; } .c5-stickyNav li a:hover { opacity: 0.8; } .c5-stickyNav li a::after { content: ""; margin-top: 9px; } .c5-stickyNav--inquery a { color: #ffffff; background-color: #D24615; -webkit-text-decoration: overline rgba(255, 255, 255, 0); text-decoration: overline rgba(255, 255, 255, 0); } .c5-stickyNav--inquery a:hover { text-decoration-color: white; } .c5-stickyNav--inquery a::after { width: 15px; height: 15px; background-image: url(../img/common/arrow@2x.png); background-size: cover; } .c5-stickyNav--lineup a { color: #000000; background-color: #ffffff; -webkit-text-decoration: overline rgba(0, 0, 0, 0); text-decoration: overline rgba(0, 0, 0, 0); } .c5-stickyNav--lineup a:hover { text-decoration-color: black; } .c5-stickyNav--lineup a::after { width: 14px; height: 12px; background-image: url(../img/common/link-bl@2x.png); background-size: cover; } @media screen and (max-width: 640px) { .c5-stickyNav { top: auto; bottom: 0; width: 100%; } .c5-stickyNav ul { width: 100%; writing-mode: unset; flex-wrap: nowrap; font-size: clamp(14px, 8px + 1.88vw, 20px); } .c5-stickyNav ul li { width: 50vw; } .c5-stickyNav ul li a { padding: 0; height: 60px; text-decoration-line: underline !important; } .c5-stickyNav ul li a::after { margin-top: 0; margin-left: 9px; } } .c5-fadein { opacity: 0; transition: opacity 1s ease 0.3s; } .c5-fadein__active { opacity: 1; } .c5-c-consultation { background-color: #ffffff; color: #2f353d; border: 4px solid #cccccc; padding: 2.5% 2.91667%; box-sizing: border-box; max-width: 1000px; width: 83.33333%; margin: 0 auto 80px; line-height: 1.6; } @media screen and (max-width: 768px) { .c5-c-consultation { max-width: initial; width: 100%; } .c5-c-consultation--outer { padding-left: 30px; padding-right: 30px; } .c5-c-consultation__inner__txt { max-width: initial; width: 100%; display: block; } } @media screen and (max-width: 640px) { .c5-c-consultation { margin-bottom: 55px; } .c5-c-consultation--outer { padding-left: 15px; padding-right: 15px; } } .c5-c-consultation a { text-decoration: none; } .c5-c-consultation__inner__txt { display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; } .c5-c-consultation__inner__txt__item { padding: 1.25em 0; border-bottom: 1px solid #aaa; border: none; } .c5-c-consultation__inner__txt__item:first-child { position: relative; padding-top: 0; padding-right: 20px; padding-left: 20px; width: 50%; box-sizing: border-box; } .c5-c-consultation__inner__txt__item:first-child::after { content: ""; position: absolute; width: 1px; height: 90%; top: 0; right: 0; background: #aaa; } .c5-c-consultation__inner__txt__item:nth-child(2) { padding-top: 0; padding-right: 20px; padding-left: 20px; width: 50%; box-sizing: border-box; } .c5-c-consultation__inner__txt__item h4 { font-size: 18px; font-weight: 700; margin-bottom: 3.22581%; text-align: center; line-height: 1.5; } .c5-c-consultation__inner__txt__item h4 span { font-size: 16px; font-weight: 400; } .c5-c-consultation__inner__txt__item ul { display: flex; justify-content: center; align-items: center; align-items: center; margin-bottom: 3.22581%; } .c5-c-consultation__inner__txt__item li { display: inline-block; } .c5-c-consultation__inner__txt__item li:first-child { width: 8.33333%; margin-right: 10px; } .c5-c-consultation__inner__txt__item li:last-child { font-size: 34px; font-weight: 700; color: #000; } .c5-c-consultation__inner__txt__item p { font-size: 14px; line-height: 1.3; } .c5-c-consultation__inner__txt__item p:first-of-type { margin-bottom: 1.6129%; } @media screen and (max-width: 1000px) { .c5-c-consultation__inner__txt__item h4 { font-size: 1.8vw; } .c5-c-consultation__inner__txt__item h4 span { font-size: 1.6vw; } .c5-c-consultation__inner__txt__item li:last-child { font-size: 3.2vw; } .c5-c-consultation__inner__txt__item p { font-size: 1.4vw; } } @media screen and (max-width: 768px) { .c5-c-consultation__inner__txt { max-width: initial; width: 100%; display: block; } .c5-c-consultation__inner__txt__item { border-bottom: 1px solid #aaa; padding: 4.68019% 0; } .c5-c-consultation__inner__txt__item:first-child { padding-top: 0; padding-right: 0; padding-left: 0; width: 100%; } .c5-c-consultation__inner__txt__item h4 { text-align: center; font-size: 4vw; line-height: 1.3; margin-bottom: 3.12012%; } .c5-c-consultation__inner__txt__item h4 span { font-size: 3.46667vw; } .c5-c-consultation__inner__txt__item ul { text-align: center; margin-bottom: 4.68019%; } .c5-c-consultation__inner__txt__item li:last-child { font-size: 6.13333vw; } .c5-c-consultation__inner__txt__item p { font-size: 3.2vw; line-height: 1.3; text-align: center; } .c5-c-consultation__inner__txt__item p:first-of-type { text-align: center; margin-bottom: 3.12012%; } } .c5-c-consultation .c5-c-consultation__title__xl { font-size: clamp(20px, 2vw, 26px); color: #333; font-weight: 700; text-align: center; } @media screen and (max-width: 768px) { .c5-c-consultation .c5-c-consultation__title__xl { margin-bottom: 24px; } } .c5-c-consultation .c5-c-consultation__icon { max-width: 24px; width: 100%; } .c5-c-consultation .c5-c-consultation__icon_arrow { width: 16px; } .c5-c-consultation .c5-c-consultation__inner { margin-top: 30px; } .c5-c-consultation .c5-c-consultation__inner__btn { display: flex; justify-content: center; width: 100%; align-items: center; gap: 30px; } .c5-c-consultation .c5-c-consultation__inner__btn__item { width: 100%; } .c5-c-consultation .c5-c-consultation__inner__btn__item a { width: 100%; } .c5-c-consultation .c5-c-consultation__inner__txt__item:first-child::after { content: ""; position: absolute; width: 1px; height: 70%; right: 0; background: #aaa; top: 30%; } .c5-c-consultation .c5-c-consultation__inner__txt__item h4 { margin-top: 10%; margin-bottom: 1.22581%; } .c5-c-consultation .c5-c-consultation__inner__txt__item ul { margin-bottom: 1.22581%; } .c5-c-consultation .c5-c-consultation__inner__txt__item li:first-child { width: 6.33333%; margin-right: 10px; } .c5-c-consultation .c5-c-consultation__inner__txt__item p { font-size: 14px; line-height: 1.3; text-align: center; } .c5-c-consultation .c5-c-consultation__inner__txt__item p:first-of-type { margin-bottom: 1.6129%; text-align: center; } @media screen and (max-width: 768px) { .c5-c-consultation .c5-c-consultation__inner { display: block; } .c5-c-consultation .c5-c-consultation__inner__btn { flex-direction: column; border-bottom: 1px solid #aaa; padding-bottom: 4%; } .c5-c-consultation .c5-c-consultation__inner__txt__item:first-child::after { content: none; } .c5-c-consultation .c5-c-consultation__inner__txt__item:nth-child(2) { padding-top: 0; } .c5-c-consultation .c5-c-consultation__inner__txt__item:last-child { width: 100%; } .c5-c-consultation .c5-c-consultation__inner__txt__item h4 { margin-top: 24px; } .c5-c-consultation .c5-c-consultation__inner__txt__item h4 span { font-size: 16px; } .c5-c-consultation .c5-c-consultation__inner__txt__item ul { text-align: center; margin-bottom: 4.68019%; } .c5-c-consultation .c5-c-consultation__inner__txt__item p:first-of-type { text-align: center; margin-bottom: 3.12012%; } } .c5-c-consultation .c5-c-consultation__btn__inner { display: flex; align-items: center; justify-content: center; padding: 0 18px; } @media screen and (max-width: 500px) { .c5-c-consultation .c5-c-consultation__btn__inner { padding: 0 12px; } } .c5-c-consultation .c5-c-btn { font-weight: 700; font-size: clamp(14px, 2.3vw, 26px); display: flex; align-items: center; justify-content: center; width: 100%; max-width: 550px; color: #fff; margin: 24px auto; padding: 16px 0; border-radius: 8px; height: 60px; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.53); } .c5-c-consultation .c5-c-btn__ask { background: #f39800; } .c5-c-consultation .c5-c-btn__inquiry { background: #0ea587; margin-top: 0; } .c5-c-consultation .c5-c-btn__information { background: #0ea587; margin-top: 0; } .c5-c-consultation .c5-c-btn__inner { display: flex; align-items: center; justify-content: center; padding: 0 18px; } .c5-c-consultation .c5-c-btn span { margin-left: 12px; margin-right: 12px; } @media screen and (max-width: 768px) { .c5-c-consultation .c5-c-btn { font-size: 18px; margin: 0 auto; height: 40px; } } @media screen and (max-width: 500px) { .c5-c-consultation .c5-c-btn { max-width: 260px; } .c5-c-consultation .c5-c-btn__inner { padding: 0 12px; } .c5-c-consultation .c5-c-btn span { margin-left: 6px; margin-right: 6px; } } .c5-c-consultation .c5-c-telephone a { font-size: 16px; font-weight: 400; text-align: center; display: block; margin-top: 1%; } .c5-c-consultation em.c5-c-telephone a { display: block; font-style: normal; } @media screen and (max-width: 768px) { .c5-c-consultation em.c5-c-telephone a { font-size: 18px; } } .c5-c-consultation * { box-sizing: content-box; } .c5-floating-btn { color: #fff; position: fixed; top: 54%; right: 0; transition: transform 0.5s; z-index: 995; transform: translate(100%, 0%); } @media screen and (max-height: 900px) { .c5-floating-btn .c5-floating-btn { top: 30%; } } @media screen and (max-width: 768px) { .c5-floating-btn { top: auto; bottom: 0; width: 100%; transform: translate(0%, 0%); } .c5-floating-btn__group { display: flex; } } .c5-floating-btn a { text-align: center; border-right: none; display: block; padding: 28px 10px 15px 15px; transition: all 0.25s; } .c5-floating-btn a.c5-floating-txt:hover { opacity: 0.7; } @media screen and (max-width: 768px) { .c5-floating-btn a.c5-floating-txt:hover { opacity: 1; } } .c5-floating-btn a.c5-floating-txt:active { opacity: 0.7; } .c5-floating-btn .c5-floating-txt { position: relative; display: flex; justify-content: center; align-items: center; color: #fff; padding: 0 8px; text-decoration: none; width: 60px; height: 152px; margin-left: auto; font-size: 14px; letter-spacing: 0.2em; transition: all 0.3s; line-height: 1.125em; writing-mode: vertical-rl; box-shadow: 0 0 1px white; box-sizing: border-box; } .c5-floating-btn .c5-floating-txt figure { width: 22px; margin-bottom: 5px; } @media screen and (max-width: 768px) { .c5-floating-btn .c5-floating-txt { padding: 15px; width: 100%; height: auto; margin-left: 0; margin-right: auto; font-size: 14px; writing-mode: horizontal-tb; letter-spacing: 0; } .c5-floating-btn .c5-floating-txt figure { margin-bottom: 0; margin-right: 10px; width: 30px; } } .c5-floating-btn.c5-floating-btn__top-15 { top: 15%; } .c5-floating-btn.c5-floating-btn__top-15 .c5-floating-product { margin-bottom: 6px; } @media screen and (max-width: 768px) { .c5-floating-btn.c5-floating-btn__top-15 { top: auto; bottom: 0; width: 100%; } .c5-floating-btn.c5-floating-btn__top-15 .c5-floating-product { margin-bottom: 0; } } .c5-floating-btn .c5-floating-model { background-color: #444444; margin-bottom: 6px; } @media screen and (max-width: 768px) { .c5-floating-btn .c5-floating-model { margin-bottom: 0; } } .c5-floating-btn .c5-floating-tel { background-color: #f39800; } .c5-floating-btn .c5-floating-tel figure { width: 30px; } .c5-floating-btn .c5-floating-product { background-color: #0ea587; } @media screen and (max-width: 768px) { .c5-floating-btn .c5-floating-product { margin-bottom: 0; } } .c5-floating-btn .c5-floating-lineup { height: 185px; } .c5-slick--jirei { width: 100%; display: flex; margin: auto; } .c5-slick--jirei .slick-dots { left: 50%; bottom: -35px; transform: translateX(-50%); overflow: hidden; } .c5-slick--jirei .slick-dots li { width: 8px; } .c5-slick--jirei .slick-dots button { background-color: #CCCCCC; height: 4px; width: 4px; padding: 0; border-radius: 2px; text-indent: -9999px; transition: transform 0.5s ease; } .c5-slick--jirei .slick-dots button:hover { opacity: 0.8; transform: scale(1.3); } .c5-slick--jirei .slick-dots button.slick-active--prev, .c5-slick--jirei .slick-dots button.slick-active--next { transform: scale(1.5); } .c5-slick--jirei .slick-dots button.slick-active--prev:hover, .c5-slick--jirei .slick-dots button.slick-active--next:hover { transform: scale(1.8); } .c5-slick--jirei .slick-dots .slick-active button { background-color: #FF4E4E; transform: scale(2); } .c5-slick--jirei .slick-dots .slick-active button:hover { transform: scale(2.3); } .c5-slick--jirei li { height: auto; } .c5-slick--jirei img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .c5-slick-prev { display: flex; align-items: center; } .c5-slick-prev span { display: block; width: 25px; height: 25px; border-top: 1px solid #BFBFBF; border-left: 1px solid #BFBFBF; transform: rotate(-45deg); transition: all 0.5s ease; } .c5-slick-prev span:hover { cursor: pointer; border-color: #ffffff; transform: translateX(-5px) rotate(-45deg); } .c5-slick-next { display: flex; align-items: center; } .c5-slick-next span { display: block; width: 25px; height: 25px; border-top: 1px solid #BFBFBF; border-right: 1px solid #BFBFBF; transform: rotate(45deg); transition: all 0.5s ease; } .c5-slick-next span:hover { cursor: pointer; border-color: #ffffff; transform: translateX(5px) rotate(45deg); } .c5-jirei--item { margin-left: 24px; margin-right: 24px; max-width: 336px; } @media screen and (max-width: 640px) { .c5-jirei--item { max-width: calc(100vw - 80px); margin-left: 20px; margin-right: 20px; } } .c5-jirei--item a:hover { color: #fff; } .c5-jirei--item a:hover .c5-jirei--head, .c5-jirei--item a:hover .c5-jirei--desc { text-decoration-color: white; } .c5-jirei--item a:hover img { opacity: 0.7; } .c5-jirei--head { display: flex; align-items: center; justify-content: center; height: 48px; font-size: 16px; text-align: center; margin-bottom: 13px; -webkit-text-decoration: underline 1px rgba(255, 255, 255, 0); text-decoration: underline 1px rgba(255, 255, 255, 0); transition: all 0.5s ease; } .c5-jirei--imgWrap { width: 336px; height: 223px; overflow: hidden; position: relative; } @media screen and (max-width: 640px) { .c5-jirei--imgWrap { width: auto; height: auto; } } .c5-jirei--imgWrap img { aspect-ratio: 368/245; transition: all 0.5s ease; } .c5-jirei--imgWrap span { display: flex; align-items: center; justify-content: space-around; position: absolute; font-size: 15px; font-weight: 700; color: #ffffff; background-color: #FF4E4E; height: 27px; width: 98px; bottom: 0; right: 12px; padding-left: 11px; } .c5-jirei--imgWrap span::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 27px 0 0 12px; border-color: transparent transparent transparent #ff4e4e; transform: translateX(12px); } @media screen and (max-width: 640px) { .c5-jirei--imgWrap span { width: 72px; height: 21px; right: 9px; padding-left: 3px; font-size: 12px; } .c5-jirei--imgWrap span::after { border-width: 21px 0 0 9px; transform: translateX(9px); } } .c5-jirei--desc { margin-top: 18px; font-size: 16px; font-weight: 700; -webkit-text-decoration: underline 1px rgba(255, 255, 255, 0); text-decoration: underline 1px rgba(255, 255, 255, 0); transition: all 0.5s ease; } .c5-noSlide { justify-content: center; flex-wrap: wrap; gap: 30px 0; overflow-x: unset !important; } @media screen and (max-width: 640px) { .c5-noSlide { margin-top: 15px; } } .c5-noSlide .c5-jirei--item { max-width: 336px; } .c5-case .slick-dotted.slick-slider { margin-bottom: 0; } section .c5-section--inner__narrow { max-width: 1080px; margin-left: auto; margin-right: auto; } .c5-sec1--title { height: 76px; } .c5-case .c5-sec1--title { padding: 0; } .c5-case--5 .c5-sec1--title { height: 116px; } @media screen and (max-width: 640px) { .c5-sec1--title { height: 55px; padding-bottom: 14px; } .c5-sec1--title img { height: 35px; } .c5-case .c5-sec1--title img { height: 47px; } .c5-case--5 .c5-sec1--title { height: 95px; } .c5-case--5 .c5-sec1--title img { height: 76px; } } .c5-sec1--link-under-title { display: flex; justify-content: flex-end; padding-top: 22px; padding-bottom: 20PX; font-size: 14px; } .c5-sec1--link-under-title a { display: flex; align-items: center; transition: all ease 0.5s; } .c5-sec1--link-under-title a::after { content: ""; display: block; height: 7px; width: 7px; border-right: solid 1px #fff; border-bottom: solid 1px #fff; margin-left: 20px; transform: rotate(-45deg); } .c5-sec1--link-under-title a:hover { opacity: 0.7; } @media screen and (max-width: 1280px) { .c5-sec1--link-under-title { padding-right: 20px; } } @media screen and (max-width: 768px) { .c5-sec1--link-under-title { padding-right: 0; } } @media screen and (max-width: 640px) { .c5-sec1--link-under-title { font-size: clamp(0.625rem, 0.375rem + 1.25vw, 0.875rem); padding-top: clamp(0.75rem, 0.5rem + 1.25vw, 1rem); padding-bottom: clamp(0.125rem, -0.063rem + 0.94vw, 0.313rem); } } .c5-hero__bgGray { background-color: #141414; padding-bottom: 40px; } @media screen and (max-width: 980px) { .c5-hero__bgGray { padding-bottom: 3.73vw; } } .c5-hero--bgWrap { background-size: 555px 282px; background-position: top right; background-repeat: no-repeat; display: flex; flex-direction: column; justify-content: center; } .c5-interview--1 .c5-hero--bgWrap { background-image: url(../img/interview/1/top-img@2x.jpg); } .c5-interview--2 .c5-hero--bgWrap { background-image: url(../img/interview/2/top-img@2x.jpg); } .c5-interview--3 .c5-hero--bgWrap { background-image: url(../img/interview/3/top-img@2x.jpg); } .c5-interview--4 .c5-hero--bgWrap { background-size: 498px 307px; background-image: url(../img/interview/4/top-img@2x.jpg); } @media screen and (max-width: 1160px) { .c5-interview--4 .c5-hero--bgWrap { background-size: 50%; } } .c5-interview--5 .c5-hero--bgWrap { background-image: url(../img/interview/5/top-img@2x.jpg); } .c5-case--1 .c5-hero--bgWrap { background-image: url(../img/case/1/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--1 .c5-hero--bgWrap { background-size: 490px 307px; } } .c5-case--2 .c5-hero--bgWrap { background-image: url(../img/case/2/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--2 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-case--3 .c5-hero--bgWrap { background-image: url(../img/case/3/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--3 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-case--4 .c5-hero--bgWrap { background-image: url(../img/case/4/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--4 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-case--5 .c5-hero--bgWrap { background-image: url(../img/case/5/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--5 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-case--6 .c5-hero--bgWrap { background-image: url(../img/case/6/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--6 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-case--7 .c5-hero--bgWrap { background-image: url(../img/case/7/top-img@2x.jpg); } @media screen and (min-width: 1161px) { .c5-case--7 .c5-hero--bgWrap { background-size: 498px 307px; } } .c5-hero--bgWrap .c5-hero--spImg { display: none; } .c5-hero--bgWrap h2 { font-size: 30px; margin-top: 15px; line-height: 1.8; color: #000000; } @media screen and (min-width: 769px) { .c5-case--3 .c5-hero--bgWrap h2 { margin-top: -40px; } } .c5-case--4 .c5-hero--bgWrap h2 { font-size: 24px; margin-top: 0; } .c5-case--4 .c5-hero--bgWrap h2 strong { font-size: 30px; } @media screen and (max-width: 640px) { .c5-case--4 .c5-hero--bgWrap h2 { margin-top: clamp(8px, -5.712px + 1.79vw, 15px); } } .c5-case--5 .c5-hero--bgWrap h2 { margin-top: 0; } @media screen and (max-width: 640px) { .c5-case--5 .c5-hero--bgWrap h2 { margin-top: clamp(8px, -5.712px + 1.79vw, 15px); } } .c5-case--7 .c5-hero--bgWrap h2 { margin-top: 0; } @media screen and (min-width: 769px) { .c5-case--7 .c5-hero--bgWrap h2 { margin-top: -40px; } } @media screen and (min-width: 769px) { .c5-case--7 .c5-hero--bgWrap h2 strong { font-size: 30px; } } .c5-case--7 .c5-hero--bgWrap h2 span { margin-bottom: 5px; line-height: 1.5; } @media screen and (min-width: 769px) { .c5-case--7 .c5-hero--bgWrap h2 span { margin-bottom: 0; font-size: 22px; } } .c5-hero--bgWrap h2 span { display: inline-block; padding-left: 0.2em; background-color: #ffffff; line-height: 1.225; letter-spacing: 0.1em; margin-bottom: 23px; } .c5-hero--bgWrap h2 span br { display: none; } @media screen and (min-width: 769px) { .c5-case--3 .c5-hero--bgWrap h2 span { margin-bottom: 0; } } .c5-case--4 .c5-hero--bgWrap h2 span { margin-bottom: 12px; } .c5-case--6 .c5-hero--bgWrap h2 span { margin-bottom: 12px; } .c5-hero--bgWrap h2 strong { display: inline-block; padding-left: 0.2em; font-size: 38px; font-weight: 700; letter-spacing: 0.1em; background-color: #F5FF00; line-height: 1.275; } .c5-case--2 .c5-hero--bgWrap h2 strong { font-size: 34px; } @media screen and (min-width: 769px) { .c5-case--3 .c5-hero--bgWrap h2 strong { margin-bottom: 15px; } .c5-case--3 .c5-hero--bgWrap h2 strong:last-of-type { margin-bottom: 0; } } .c5-case--4 .c5-hero--bgWrap h2 strong { margin-top: 16px; } .c5-case--4 .c5-hero--bgWrap h2 strong:first-of-type { margin-top: 10px; } .c5-case--6 .c5-hero--bgWrap h2 strong { margin-top: 16px; } .c5-case--6 .c5-hero--bgWrap h2 strong:first-of-type { margin-top: 10px; } .c5-hero--bgWrap p { width: 47%; max-width: 510px; font-size: 15px; line-height: 1.73; margin-top: 16px; } @media screen and (max-width: 1160px) { .c5-hero--bgWrap { background-size: 50%; } .c5-hero--bgWrap h2 { margin-top: clamp(8px, -5.712px + 1.79vw, 15px); font-size: clamp(16px, -11.424px + 3.57vw, 30px); } .c5-hero--bgWrap h2 span { margin-bottom: clamp(17.74px, 7.44px + 1.34vw, 23px); } .c5-hero--bgWrap h2 strong { font-size: clamp(20.7px, -13.2px + 4.41vw, 38px); } .c5-case--2 .c5-hero--bgWrap h2 strong { font-size: clamp(1.313rem, -0.279rem + 3.32vw, 2.125rem); } .c5-case--4 .c5-hero--bgWrap h2 { font-size: clamp(15.8px, -0.0056rem + 2.08vw, 24px); } .c5-case--4 .c5-hero--bgWrap h2 strong { font-size: clamp(19.78px, -0.0031rem + 2.59vw, 30px); } } @media screen and (max-width: 768px) { .c5-hero--bgWrap { height: unset; background-image: none !important; } .c5-hero--bgWrap .c5-hero--spImg { display: block; } .c5-hero--bgWrap h2 { /* background-size: contain; background-repeat: no-repeat; background-position: bottom; */ display: flex; flex-direction: column; align-items: flex-start; font-size: 4.26vw; /* .c5-interview--1 & { background-image: url(../img/interview/1/top-img@2x.jpg); } .c5-interview--2 & { background-image: url(../img/interview/2/top-img@2x.jpg); } .c5-interview--3 & { background-image: url(../img/interview/3/top-img@2x.jpg); } .c5-interview--4 & { background-image: url(../img/interview/4/top-img@2x.jpg); } .c5-interview--5 & { background-image: url(../img/interview/5/top-img@4x.jpg); } */ } .c5-hero--bgWrap h2 span { font-size: 4.2vw; margin-bottom: 2.9vw; } .c5-case--4 .c5-hero--bgWrap h2 span { font-size: 3.4vw; } .c5-hero--bgWrap h2 span br { display: unset; } .c5-hero--bgWrap h2 strong { font-size: 5.86vw; } .c5-hero--bgWrap h2 strong:last-of-type { margin-bottom: 3.46vw; } .c5-case--3 .c5-hero--bgWrap h2 strong { font-size: 5vw; } .c5-case--4 .c5-hero--bgWrap h2 strong { font-size: 3.9vw; } .c5-hero--bgWrap h2 br { display: none; } .c5-hero--bgWrap p { width: 100%; max-width: unset; } } @media screen and (max-width: 640px) { .c5-hero--bgWrap p { font-size: clamp(12px, 7.76px + 1.13vw, 15px); } } .c5-hero--bgWrap .c5-fadeToRight--wrap span { opacity: 0; transform: translateX(-80px); transition: all 0.5s ease 0.3s; } .c5-hero--bgWrap .c5-fadeToRight--wrap strong { opacity: 0; transform: translateX(-80px); transition: all 0.5s ease 0.5s; } .c5-hero--bgWrap .c5-fadeToRight--wrap__active span { opacity: 1; transform: translateX(0); } .c5-hero--bgWrap .c5-fadeToRight--wrap__active strong { opacity: 1; transform: translateX(0); } .c5-respondent { position: relative; display: flex; justify-content: space-between; padding-top: 50px; margin-bottom: 50px; } .c5-respondent--label { position: relative; display: flex; height: 24px; flex-shrink: 0; color: #F5FF00; font-size: 14px; border-bottom: 1px #bfbfbf solid; } .c5-respondent--label::after { content: ""; display: block; height: 22px; border-left: 1px #bfbfbf solid; transform: rotate(26.57deg) translateX(1px) translateY(2px); transform-origin: bottom left; } .c5-respondent--list { display: flex; border-width: 1px 0; border-color: #3B3B3B; border-style: solid; flex-grow: 1; margin-left: 45px; } .c5-respondent--list--rule2 { display: grid; grid-template-columns: auto auto; } @media screen and (max-width: 768px) { .c5-respondent--list--rule2 { grid-template-columns: 1fr; } } .c5-respondent--item { padding: 15px 0; display: flex; align-items: flex-end; flex-grow: 1; width: 50%; } .c5-respondent--item img { width: 97px; height: 77px; padding-right: 20px; } .c5-respondent--item dl dt { font-size: 14px; } .c5-respondent--item dl dd { font-size: 12px; } .c5-respondent--item dl dd span { margin-right: 1em; } .c5-respondent--item--rule2 { min-width: 350px; } @media screen and (max-width: 768px) { .c5-respondent--item--rule2 { min-width: 100%; } } @media screen and (max-width: 980px) { .c5-respondent { flex-direction: column; } .c5-respondent--label { border: none; background-color: #000000; position: absolute; top: 39px; } .c5-respondent--label::after { display: none; } .c5-respondent--list { padding-left: 15px; padding-right: 15px; margin-left: 0; flex-wrap: wrap; } .c5-respondent--item { margin-left: 15px; margin-right: 15px; } } @media screen and (max-width: 640px) { .c5-respondent--item dl dt { font-size: clamp(11px, 6.752px + 1.13vw, 14px); } .c5-respondent--item dl dd { font-size: clamp(11px, 9.584px + 0.38vw, 12px); } } .c5-article { padding: 85px 30px 25px; } .c5-article--inner { width: 100%; max-width: 800px; margin: 0 auto; } .c5-article--inner h2 { font-size: 30px; font-weight: 700; margin-bottom: 30px; padding-left: 1em; text-indent: -1em; } .c5-article--inner h3 { font-size: 25px; font-weight: 700; margin-bottom: 30px; } .c5-article--inner h4 { font-size: 22px; font-weight: 700; margin-bottom: 30px; } .c5-article--inner h5 { font-size: 20px; font-weight: 700; margin-bottom: 30px; } .c5-article--inner h6 { font-size: 16px; font-weight: 700; margin-top: 50px; margin-bottom: 14px; } .c5-article--inner p { font-size: 16px; margin-bottom: 30px; line-height: 2; } .c5-article--inner small { font-size: 0.85em; } .c5-article--inner sup { font-size: 0.6em; vertical-align: super; } .c5-article--inner img { margin: 60px auto; display: block; } .c5-article--inner figure { width: -moz-fit-content; width: fit-content; margin: 60px auto; font-size: 16px; } .c5-article--inner figure img { margin-bottom: 0.2em; } .c5-article--inner figure figcaption { text-align: end; } .c5-article--point { padding: 27px 24px 20px; background-color: #FFEEE3; font-size: 14px; margin-bottom: 60px; } .c5-article--point__label { display: block; color: #FF6200; font-size: 16px; margin-bottom: 12px; } .c5-article--point p { margin-bottom: 0; } .c5-article--fig { margin-top: 100px; } .c5-article--link { display: flex; flex-direction: column; align-items: center; } .c5-article--link--label { font-size: 18px; font-weight: 700; } .c5-article--link .c5-link--link_A { text-align: center; } @media screen and (max-width: 640px) { .c5-article { padding: clamp(30px, -47.824px + 20.75vw, 85px) clamp(22px, 10.672px + 3.02vw, 30px) clamp(30px, -12.448px + 11.32vw, 60px); } .c5-article img { margin: clamp(30px, -12.448px + 11.32vw, 60px) auto; } .c5-article--inner h2 { font-size: clamp(20px, 5.856px + 3.77vw, 30px); } .c5-article--inner h3 { font-size: clamp(18px, 8.096px + 2.64vw, 25px); } .c5-article--inner h4 { font-size: clamp(16px, 4.672px + 3.02vw, 22px); } .c5-article--inner h5 { font-size: clamp(15px, 7.92px + 1.89vw, 20px); } .c5-article--inner h6 { font-size: clamp(14px, 8.336px + 1.51vw, 18px); } .c5-article--inner p { font-size: clamp(13px, 8.752px + 1.13vw, 16px); } .c5-article--inner figure { font-size: clamp(13px, 8.752px + 1.13vw, 16px); } .c5-article--fig { margin-top: clamp(0px, -141.504px + 37.74vw, 100px); } .c5-article--link--label { font-size: clamp(14px, 8.336px + 1.51vw, 18px); } .c5-article--link .c5-link--link_A { font-size: clamp(11px, 6px + 1.56vw, 16px); } } .c5-article__flex2col { display: grid; grid-template-columns: repeat(auto-fit, minmax(268px, 1fr)); gap: 0 26px; } .c5-article__flex2col__outer { margin-top: 2.5em; margin-bottom: 4em; } .c5-article__flex2col:not(:has(.c5-article__flex2col__item__figcaption)) { gap: 26px; } .c5-article__flex2col__item { display: flex; flex-direction: column; align-items: center; min-width: 40%; } @media screen and (max-width: 640px) { .c5-article__flex2col__item { margin-top: 0; margin-bottom: 0; } } .c5-article__flex2col__item img { margin-top: 0; margin-bottom: 0; } .c5-article__flex2col__item__figcaption { margin-top: 0.5em; margin-bottom: 0.5em; } @media screen and (max-width: 640px) { .c5-article__flex2col__item__figcaption { margin-bottom: 1.2em; } } .c5-article__flex2col__caption { margin-top: 0.5em; } .c5-article__flex3col { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0 26px; } .c5-article__flex3col__outer { margin-top: 2.5em; margin-bottom: 4em; } .c5-article__flex3col:not(:has(.c5-article__flex2col__item__figcaption)) { gap: 26px; } .c5-article__flex3col__item { display: flex; flex-direction: column; align-items: center; min-width: 30%; } @media screen and (max-width: 640px) { .c5-article__flex3col__item { margin-top: 0; margin-bottom: 0; } } .c5-article__flex3col__item img { margin-top: 0; margin-bottom: 0; } .c5-article__flex3col__item__figcaption { margin-top: 0.5em; margin-bottom: 0.5em; } @media screen and (max-width: 640px) { .c5-article__flex3col__item__figcaption { margin-bottom: 1.2em; } } .c5-article__flex3col__caption { margin-top: 0.5em; } .c5-article .c5-imgWrap { margin: 0 auto 70px; } .c5-article .c5-imgWrap img { margin-bottom: 0; } .c5-article .c5-imgWrap__caption { font-size: 14px; line-height: 1.5; margin-top: 10px; } .c5-interview--4 .c5-article .c5-imgWrap--1 { max-width: 332px; } .c5-article .c5-imgWrap--600 { max-width: 600px; margin-left: auto; margin-right: auto; } .c5-section--onayami { padding-top: 68px; } @media screen and (max-width: 640px) { .c5-section--onayami { padding-top: 0; } } .c5-onayami--item { width: 521px; margin-left: 20px; margin-right: 20px; } @media screen and (max-width: 1280px) { .c5-onayami--item { width: 40.7vw; margin-left: 1.5vw; margin-right: 1.5vw; } } @media screen and (max-width: 980px) { .c5-onayami--item { width: 100%; } } .item { margin-left: 19px; margin-right: 19px; } .c5-sec4 { padding-bottom: 65px; } @media screen and (max-width: 640px) { .c5-sec4 { padding-bottom: clamp(35px, -11.696px + 12.45vw, 65px); } } .c5-stickyNav--inquery a { background-color: #D24615; }/*# sourceMappingURL=interview.css.map */