* {
-webkit-text-size-adjust: 100%;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
}
::before,
::after {
box-sizing: border-box;
border-style: solid;
border-width: 0;
}
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: transparent;
}
html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
header,
nav,
main,
footer,
article,
section,
aside,
dl,
dt,
dd,
ul,
li,
ol,
blockquote,
address,
pre,
iframe,
form,
figure,
table,
tr,
th,
td,
tbody {
margin: 0;
padding: 0;
line-height: 1.6;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
line-height: inherit;
font-weight: inherit;
}
ul {
list-style: none;
}
ol {
padding-left: 1rem;
}
dd {
margin-left: 0;
}
hr {
box-sizing: content-box;
height: 0;
overflow: visible;
border-top-width: 1px;
margin: 0;
clear: both;
color: inherit;
}
pre {
font-family: monospace, monospace;
font-size: inherit;
}
a {
text-decoration: none;
color: inherit;
background-color: transparent;
transition: all 0.5s ease-out;
}
img {
max-width: 100%;
height: auto;
vertical-align: bottom;
border: 0;
line-height: 1em;
-ms-interpolation-mode: bicubic;
}
svg,
embed,
object,
iframe {
vertical-align: bottom;
}
button,
input,
optgroup,
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
vertical-align: middle;
color: inherit;
font: inherit;
border: 0;
background: transparent;
padding: 0;
margin: 0;
outline: 0;
border-radius: 0;
text-align: inherit;
text-transform: inherit;
}
button,
input {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
[type=button],
[type=reset],
[type=submit] {
cursor: pointer;
}
button[disabled],
[type=button][disabled],
[type=reset][disabled],
[type=submit][disabled] {
cursor: default;
}
[type=checkbox] {
-webkit-appearance: checkbox;
-moz-appearance: checkbox;
appearance: checkbox;
}
[type=radio] {
-webkit-appearance: radio;
-moz-appearance: radio;
appearance: radio;
}
input[type=text],
input[type=submit] {
border-radius: 0;
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
outline: 1px dotted ButtonText;
}
select::-ms-expand {
display: none;
}
option {
padding: 0;
}
fieldset {
margin: 0;
padding: 0;
border: 0;
min-width: 0;
}
textarea {
overflow: auto;
}
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
}
[type=search] {
outline-offset: -2px;
}
[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}
label[for] {
cursor: pointer;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption {
text-align: left;
}
td,
th {
vertical-align: top;
}
th {
text-align: left;
}
header,
nav,
menu,
article,
section,
main,
aside,
footer {
display: block;
}
address {
font-style: inherit;
}
b,
strong {
font-weight: bolder;
}
embed,
object,
iframe {
border: 0;
vertical-align: bottom;
}
abbr[title] {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
code,
kbd,
samp {
font-family: monospace, monospace;
font-size: inherit;
}
fieldset {
margin: 0;
padding: 0;
min-width: 0;
}
legend {
padding: 0;
}
progress {
vertical-align: baseline;
}
details {
display: block;
}
summary {
display: list-item;
}
[contenteditable]:focus {
outline: auto;
}
@font-face {
font-family: "Nasalization";
src: url(//www.rearth-tokyo.co.jp/wp-content/themes/rearthtokyo2025/fonts/nasalization-rg.otf) format("opentype");
}
html,
body {
margin: 0;
padding: 0;
font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "Hiragino Sans", Meiryo, sans-serif;
font-size: 16px;
line-height: 1.6;
color: #000000;
}
html.is-fixed,
body.is-fixed {
overflow: hidden;
}
body {
padding-top: 120px !important;
}
@media screen and (max-width: 767px) {
body {
padding-top: 80px !important;
}
}
.f-content__img img {
display: block;
height: auto;
margin: 0 auto;
}
.f-heading {
text-align: center;
line-height: 1.4;
}
.f-heading--xxl {
font-size: clamp(1.5rem, 1.125rem + 1.88vw, 2.625rem);
font-weight: 600;
}
@media screen and (max-width: 767px) {
.f-heading--xxl {
font-size: clamp(1.375rem, 1.286rem + 0.45vw, 1.5rem);
}
}
.f-heading--xl {
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-weight: 600;
}
.f-heading--lg {
font-size: clamp(1.875rem, 1.255rem + 1.09vw, 2.125rem);
font-weight: 500;
}
@media screen and (max-width: 767px) {
.f-heading--lg {
font-size: clamp(1.25rem, 0.803rem + 2.24vw, 1.875rem);
}
}
.f-heading--md {
font-size: clamp(1.375rem, 0.136rem + 2.17vw, 1.875rem);
font-weight: 800;
}
.f-heading--en {
display: block;
font-size: clamp(0.938rem, 0.833rem + 0.52vw, 1.25rem);
font-weight: 500;
color: #c5a76e;
}
.f-text--xxxl {
font-size: clamp(1.625rem, 1.313rem + 1.56vw, 2.563rem);
font-weight: 500;
}
.f-text--xxl {
font-size: clamp(1.375rem, 1.25rem + 0.63vw, 1.75rem);
font-weight: 500;
}
.f-text--xl {
font-size: clamp(1rem, 0.813rem + 0.39vw, 1.125rem);
font-weight: 500;
}
.f-text--lg {
font-size: clamp(1rem, 0.917rem + 0.42vw, 1.25rem);
font-weight: 500;
}
.f-text--md {
font-size: clamp(0.938rem, 0.803rem + 0.67vw, 1.125rem);
font-weight: 500;
}
.f-text--link {
display: block;
margin-left: auto;
margin-right: auto;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-size: 18px;
font-weight: 500;
text-align: center;
color: #333;
transition: color 0.3s ease-out;
}
.f-text--link span {
display: inline-block;
width: 30px;
height: 30px;
margin-left: 20px;
padding: 7px;
vertical-align: middle;
background-color: #c5a76e;
border-radius: 50%;
}
.f-text--link span img {
display: block;
width: 100%;
height: auto;
transition: transform 0.3s ease-out;
}
.f-text--link:hover {
color: #aaa;
}
.f-text--link:hover span img {
transform: translateX(4px);
}
.f-font-family--mincho {
font-family: "Noto Serif JP", serif;
}
.l-container {
display: block;
width: 100%;
max-width: 1280px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 1440px) {
.l-container {
padding-left: 60px;
padding-right: 60px;
}
}
@media screen and (max-width: 1280px) {
.l-container {
padding-left: 50px;
padding-right: 50px;
}
}
@media screen and (max-width: 767px) {
.l-container {
padding-left: 40px;
padding-right: 40px;
}
}
@media screen and (max-width: 540px) {
.l-container {
padding-left: 20px;
padding-right: 20px;
}
}
.l-container--outer {
max-width: 1800px;
padding-left: 60px;
padding-right: 60px;
}
@media screen and (max-width: 1280px) {
.l-container--outer {
padding-left: 50px;
padding-right: 50px;
}
}
@media screen and (max-width: 767px) {
.l-container--outer {
padding-left: 40px;
padding-right: 40px;
}
}
@media screen and (max-width: 540px) {
.l-container--outer {
padding-left: 20px;
padding-right: 20px;
}
}
.l-container--medium {
max-width: 1040px;
padding-left: 40px;
padding-right: 40px;
}
@media screen and (max-width: 540px) {
.l-container--medium {
padding-left: 20px;
padding-right: 20px;
}
}
.l-container--base {
max-width: 880px;
padding-left: 40px;
padding-right: 40px;
}
@media screen and (max-width: 540px) {
.l-container--base {
padding-left: 20px;
padding-right: 20px;
}
}
.l-container--inner {
max-width: 840px;
padding-left: 40px;
padding-right: 40px;
}
@media screen and (max-width: 540px) {
.l-container--inner {
padding-left: 20px;
padding-right: 20px;
}
}
.l-container--xs {
max-width: 520px;
padding-left: 20px;
padding-right: 20px;
}
.l-section__top-service {
padding-top: 0;
padding-bottom: 50px;
background: linear-gradient(to bottom, #ffffff 0px, #ffffff 30px, #39b54a 30px, #39b54a 100%);
}
.l-section__top-main-content {
position: relative;
padding-top: 50px;
background-color: #39b54a;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
z-index: 5;
}
.l-section__top-faq {
padding-top: 50px;
padding-bottom: 50px;
}
.l-section__advantage {
position: relative;
width: 100%;
margin-top: -10px;
padding-top: 100px;
padding-bottom: 100px;
background-color: #e6e6e6;
z-index: 4;
}
.l-section__top-company {
padding-top: 100px;
padding-bottom: 100px;
background-color: #39b54a;
}
@media screen and (max-width: 911px) {
.l-section__top-company {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media screen and (max-width: 767px) {
.l-section__top-company {
padding-top: 60px;
padding-bottom: 60px;
}
}
.l-section__top-company-wrap {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
@media screen and (max-width: 911px) {
.l-section__top-company-wrap {
grid-template-columns: 1fr;
}
}
.l-section__top-voice {
padding-top: 70px;
padding-bottom: 50px;
background-color: #e6e6e6;
}
.l-section__top-blog {
padding-top: 70px;
padding-bottom: 70px;
}
.l-section__top-blog-wrap {
gap: clamp(1.25rem, -3.397rem + 8.15vw, 3.125rem);
}
.l-section__banner {
position: relative;
width: 100%;
aspect-ratio: 192/80;
overflow: hidden;
}
@media screen and (max-width: 767px) {
.l-section__banner {
aspect-ratio: 767/950;
}
}
.l-flex {
display: flex;
}
.l-flex--between {
justify-content: space-between;
}
.l-flex--jc-center {
justify-content: center;
}
.l-flex--flex-end {
justify-content: flex-end;
}
.l-flex--flex-start {
justify-content: flex-start;
}
.l-flex--align-center {
align-items: center;
}
.l-flex--wrap {
flex-wrap: wrap;
}
.l-flex--nowrap {
flex-wrap: nowrap;
}
.l-flex--gap-10 {
gap: 10px;
}
.l-flex--gap-20 {
gap: 20px;
}
.l-flex--gap-30 {
gap: 30px;
}
.l-flex--gap-40 {
gap: 40px;
}
.l-flex--gap-50 {
gap: 50px;
}
.l-flex--gap-60 {
gap: 60px;
}
.l-grid {
display: grid;
}
.l-grid__1col {
grid-template-columns: 1fr;
}
.l-grid__2col {
grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 911px) {
.l-grid__2col {
grid-template-columns: 1fr;
}
}
.l-grid__1-2col {
grid-template-columns: 30% 1fr;
}
@media screen and (max-width: 767px) {
.l-grid__1-2col {
grid-template-columns: 1fr;
}
}
.l-grid__with-sidebar-left {
grid-template-columns: clamp(15rem, 5.707rem + 16.3vw, 18.75rem) 1fr;
}
@media screen and (max-width: 911px) {
.l-grid__with-sidebar-left {
grid-template-columns: 1fr;
}
}
.l-grid__with-sidebar-right {
grid-template-columns: 1fr 300px;
gap: 30px;
}
@media screen and (max-width: 911px) {
.l-grid__with-sidebar-right {
grid-template-columns: 1fr;
}
}
.l-grid__3col {
grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 911px) {
.l-grid__3col {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 540px) {
.l-grid__3col {
grid-template-columns: 1fr;
}
}
.l-grid__4col {
grid-template-columns: repeat(4, 1fr);
}
@media (max-width: 991px) {
.l-grid__4col {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 540px) {
.l-grid__4col {
grid-template-columns: 1fr;
}
}
@media (max-width: 911px) {
.l-grid--top-advantage {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 767px) {
.l-grid--top-advantage {
grid-template-columns: 1fr;
justify-content: center;
}
}
.l-grid__footer {
grid-template-columns: 1fr 25%;
grid-template-areas: "navigation logo";
gap: 50px;
}
@media screen and (max-width: 911px) {
.l-grid__footer {
grid-template-columns: 1fr;
grid-template-areas: "logo" "navigation";
gap: clamp(1.875rem, 1.198rem + 3.38vw, 3.125rem);
}
}
.l-grid-company {
gap: 15px;
}
@media screen and (max-width: 991px) {
.l-grid-company {
gap: 30px;
}
}
@media screen and (max-width: 767px) {
.l-grid-company {
grid-template-columns: 1fr;
}
}
.l-grid-advantage {
gap: 30px;
}
.l-grid-speedy {
gap: 50px;
}
.l-grid-speedy-header {
gap: 10px;
grid-template-columns: 100px 1fr;
align-items: center;
}
@media screen and (max-width: 540px) {
.l-grid-speedy-header {
grid-template-columns: 1fr;
justify-content: center;
gap: 0;
}
}
.l-grid-stance {
gap: 30px;
}
@media screen and (max-width: 911px) {
.l-grid-stance {
grid-template-columns: repeat(2, 1fr);
}
}
@media screen and (max-width: 767px) {
.l-grid-stance {
gap: 15px;
}
}
@media screen and (max-width: 540px) {
.l-grid-stance {
grid-template-columns: 1fr;
}
}
.l-sidebar {
padding: 30px 20px;
background-color: #ffffff;
border-radius: 10px;
}
.l-sidebar__title {
font-size: clamp(1.125rem, 0.196rem + 1.63vw, 1.5rem);
font-weight: 500;
margin-bottom: 20px;
}
.l-sidebar__title--popular-article {
font-size: 14px;
}
@media screen and (max-width: 911px) {
.l-sidebar__title--popular-article {
padding-bottom: 10px;
margin-bottom: 15px;
border-bottom: 1px dotted #000000;
}
}
.l-sidebar__list {
margin-bottom: 30px;
}
.l-sidebar__item {
display: block;
}
.l-sidebar__item--recent-voice {
margin-bottom: 10px;
}
.l-sidebar__item--recent-voice .l-sidebar__post-title {
white-space: nowrap;
}
.l-sidebar__item-category {
margin-bottom: 10px;
}
.l-sidebar__link {
font-size: 16px;
font-weight: 600;
transition: color 0.3s ease-out;
}
.l-sidebar__link:hover {
color: #aaa;
}
.l-sidebar__more {
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
height: auto;
padding: 6px 15px;
margin-right: 0;
margin-left: auto;
color: #ffffff;
background-color: #006837;
font-size: clamp(0.875rem, 0.72rem + 0.27vw, 0.938rem);
border: 1px solid #006837;
border-radius: 9999px;
transition: background-color 0.3s ease-out, color 0.3s ease-out;
}
@media screen and (max-width: 911px) {
.l-sidebar__more {
font-size: clamp(0.938rem, 0.893rem + 0.22vw, 1rem);
}
}
.l-sidebar__more:hover {
background-color: #ffffff;
color: #006837;
}
.l-sidebar__count {
padding: 2px 15px;
margin-left: 20px;
font-size: 11px;
font-weight: 800;
color: #00ff00;
background-color: #006837;
border-radius: 9999px;
}
.l-sidebar__thumb {
display: block;
width: 100%;
margin-bottom: 10px;
border-radius: 10px;
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2), -1px -1px 4px rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 911px) {
.l-sidebar__thumb {
display: none;
}
}
.l-sidebar__thumb img {
display: block;
width: 100%;
height: auto;
}
.l-sidebar--voice {
background-color: transparent !important;
padding: 0;
}
.l-sidebar--voice-search {
margin-bottom: 30px;
background-color: #ffffff;
border-radius: 20px;
padding: 30px;
}
.l-footer {
padding-top: 60px;
}
.l-footer__logo {
display: flex;
justify-content: flex-end;
width: 100%;
grid-area: logo;
}
@media screen and (max-width: 911px) {
.l-footer__logo {
justify-content: flex-start;
}
}
.l-footer__logo a {
display: block;
max-width: 320px;
}
.l-footer__logo a img {
display: block;
width: 100%;
height: auto;
}
.l-footer__bottom {
height: 70px;
width: 100%;
background-color: #ccc;
}
.l-footer__bottom-wrap {
height: 100%;
}
.l-footer--copyright-text {
font-size: 14px;
color: #333;
}
.l-footer--copyright-nav {
height: 100%;
}
.menu-copyright-nav-container {
height: 100%;
}
#menu-copyright-nav {
display: flex;
align-items: center;
height: 100%;
}
#menu-copyright-nav .menu-item {
font-size: 14px;
color: #333;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 0;
border-right: 1px solid #333;
}
#menu-copyright-nav .menu-item:nth-of-type(2) {
border-right: none;
}
#menu-copyright-nav .menu-item a {
transition: color 0.2s ease-out;
}
#menu-copyright-nav .menu-item a:hover {
color: #aaa;
}
.sub-menu {
margin-top: 20px;
}
.sub-menu .menu-item {
font-size: 14px;
font-weight: 500;
color: #333;
}
.sub-menu .menu-item a {
font-weight: 300;
transition: color 0.3s ease-out;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sub-menu .menu-item a:hover {
color: #aaa;
}
.l-footer-sitemap {
display: grid;
grid-template-areas: "top service blog contact" "company solution support legal";
grid-template-columns: repeat(4, 1fr);
gap: 30px;
grid-area: navigation;
padding-bottom: 60px;
}
@media screen and (max-width: 1280px) {
.l-footer-sitemap {
grid-template-areas: "top service contact" "company solution support" "company blog legal";
grid-template-columns: repeat(3, 1fr);
}
}
@media screen and (max-width: 911px) {
.l-footer-sitemap {
grid-template-areas: "top  contact" "company blog" "solution support" "service legal";
grid-template-columns: repeat(2, 1fr);
}
}
@media screen and (max-width: 540px) {
.l-footer-sitemap {
grid-template-columns: 1fr;
grid-template-areas: "top" "company" "service" "solution" "contact" "blog" "support" "legal";
}
}
.l-footer-sitemap__item .menu .menu-item {
line-height: 1;
margin-bottom: 15px;
}
.l-footer-sitemap__item .menu .menu-item.menu-item-has-children {
font-size: clamp(1rem, 0.938rem + 0.31vw, 1.188rem);
font-weight: 600;
color: #c5a76e;
margin-bottom: 0;
}
.l-footer-sitemap__item .menu .menu-item.menu-item-has-children > a {
display: block;
width: 100%;
padding-bottom: 10px;
border-bottom: 1px solid #c5a76e;
pointer-events: none;
cursor: default;
}
.l-footer-sitemap__item-top {
grid-area: top;
}
.l-footer-sitemap__item-company {
grid-area: company;
}
.l-footer-sitemap__item-service {
grid-area: service;
}
.l-footer-sitemap__item-solution {
grid-area: solution;
}
.l-footer-sitemap__item-blog {
grid-area: blog;
}
.l-footer-sitemap__item-support {
grid-area: support;
}
.l-footer-sitemap__item-contact {
grid-area: contact;
}
.l-footer-sitemap__item-legal {
grid-area: legal;
}
.l-header {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 999;
}
.l-header::after {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
content: "";
}
.l-header__top {
height: 40px;
background-color: #009245;
}
@media screen and (max-width: 767px) {
.l-header__top {
display: none;
}
}
.l-header__top-wrap {
display: flex;
justify-content: flex-end;
align-items: center;
height: 100%;
}
.l-header__main {
height: 80px;
background-color: #013f20;
}
@media screen and (max-width: 767px) {
.l-header__main {
height: 80px;
}
}
.l-header__main-wrap {
display: flex;
justify-content: space-between;
align-items: center;
height: 100%;
}
@media screen and (max-width: 767px) {
.l-header__main-wrap {
display: block;
}
}
.l-header__main.is-fixed {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
}
.l-header__main.is-fixed .l-header__sp-nav {
top: 0;
}
.l-header__logo {
position: relative;
width: auto;
height: 100%;
padding-top: 10px;
padding-bottom: 10px;
z-index: 1000;
}
@media screen and (max-width: 1280px) {
.l-header__logo {
width: 100%;
max-width: clamp(13.75rem, 8.875rem + 10.16vw, 17rem);
}
}
@media screen and (max-width: 840px) {
.l-header__logo {
max-width: 180px;
}
}
@media screen and (max-width: 767px) {
.l-header__logo {
width: 100%;
max-width: clamp(14.375rem, 12.496rem + 9.4vw, 17rem);
}
}
.l-header__logo a {
display: flex;
align-items: center;
height: 100%;
width: auto;
}
.l-header__logo a img {
display: block;
width: auto;
height: 100%;
}
.c-banner {
width: 100%;
aspect-ratio: 192/80;
}
@media screen and (max-width: 767px) {
.c-banner {
aspect-ratio: 767/950;
}
}
.c-banner-dark {
position: relative;
width: 100%;
aspect-ratio: 1920/800;
color: #ffffff;
background-color: #000000;
z-index: 1;
}
@media screen and (max-width: 991px) {
.c-banner-dark {
aspect-ratio: 960/1080;
}
}
.c-banner-dark .c-banner__bg {
z-index: 2;
}
@media screen and (max-width: 991px) {
.c-banner-dark .c-banner__bg {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
overflow: hidden;
}
}
@media screen and (max-width: 991px) {
.c-banner-dark .c-banner__bg img {
height: 100%;
width: auto;
max-width: unset;
}
}
.c-banner-dark .c-banner__wrap {
align-items: center;
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__wrap {
align-items: center;
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__wrap {
align-items: center;
padding: 10px;
}
}
.c-banner-dark .c-banner__content {
position: relative;
width: 100%;
max-width: 960px;
margin-left: auto;
margin-right: auto;
padding-left: 30px;
padding-right: 30px;
z-index: 11;
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content {
padding-left: 10px;
padding-right: 10px;
}
}
.c-banner-dark .c-banner__content-wrap {
position: relative;
width: 100%;
border: 2px solid #ffffff;
text-align: center;
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-wrap {
padding: 10px;
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-wrap {
padding: 5px 10px;
}
}
.c-banner-dark .c-banner__content-wrap::before {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%) translateY(-2px);
display: block;
width: 100%;
max-width: clamp(22.5rem, 10rem + 26.04vw, 41.25rem);
height: 2px;
background-color: #000000;
content: "";
z-index: 3;
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-wrap::before {
width: 100%;
max-width: 370px;
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-wrap::before {
display: none;
}
}
.c-banner-dark .c-banner__content-logo {
position: relative;
display: block;
margin-left: auto;
margin-right: auto;
padding-left: 20px;
padding-right: 20px;
transform: translateY(-50%);
z-index: 5;
}
@media screen and (max-width: 991px) {
.c-banner-dark .c-banner__content-logo {
margin-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-logo {
width: 100%;
max-width: 350px;
padding-left: 0;
padding-right: 0;
margin-bottom: 40px;
transform: translateY(-80%);
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-logo {
max-width: 250px;
transform: translateY(0);
margin-bottom: 20px;
padding-top: 20px;
}
}
.c-banner-dark .c-banner__content-title {
font-size: clamp(1.5rem, 0.667rem + 1.74vw, 2.75rem);
font-weight: 600;
line-height: 1.25;
margin-bottom: clamp(0.625rem, 0.208rem + 0.87vw, 1.25rem);
}
@media screen and (max-width: 991px) {
.c-banner-dark .c-banner__content-title {
margin-bottom: 40px;
}
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-title {
font-size: clamp(0.875rem, 0.428rem + 2.24vw, 1.5rem);
line-height: 1.4;
margin-bottom: 20;
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-title {
margin-bottom: 10px;
}
}
.c-banner-dark .c-banner__content-text {
font-size: clamp(0.75rem, 0.583rem + 0.35vw, 1rem);
font-weight: 500;
margin-bottom: clamp(0.625rem, -0.625rem + 2.6vw, 2.5rem);
}
@media screen and (max-width: 991px) {
.c-banner-dark .c-banner__content-text {
margin-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-text {
margin-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-text {
margin-bottom: 20px;
}
}
.c-banner-dark .c-banner__content-link {
display: grid;
grid-template-columns: 1fr 30px;
gap: 15px;
align-items: center;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 20px;
color: #ffffff;
font-weight: 500;
text-align: center;
font-size: clamp(0.938rem, 0.836rem + 0.51vw, 1.125rem);
margin-left: auto;
margin-right: auto;
background-color: #998675;
transform: translateY(50%);
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-link {
padding: 5px 10px;
transform: translateY(80%);
}
}
@media screen and (max-width: 540px) {
.c-banner-dark .c-banner__content-link {
padding: 0;
margin-bottom: 10px;
background-color: transparent;
transform: translateY(40%);
}
}
.c-banner-dark .c-banner__content-link-base {
margin-top: -3px;
}
.c-banner-dark .c-banner__content-link-icon {
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
background-color: #ffffff;
}
@media screen and (max-width: 767px) {
.c-banner-dark .c-banner__content-link-icon {
width: 18px;
height: 18px;
}
}
.c-banner-dark .c-banner__content-link-icon img {
display: block;
width: 70%;
height: auto;
}
.c-banner__wrap {
position: relative;
display: flex;
align-items: center;
width: 100%;
height: 100%;
}
@media screen and (max-width: 767px) {
.c-banner__wrap {
align-items: flex-start;
padding-top: clamp(1.25rem, -0.092rem + 6.71vw, 3.125rem);
padding-bottom: clamp(1.25rem, -0.092rem + 6.71vw, 3.125rem);
padding-left: clamp(0rem, -1.818rem + 9.09vw, 1.25rem);
padding-right: clamp(0rem, -1.818rem + 9.09vw, 1.25rem);
}
}
.c-banner__bg {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: -1;
}
.c-banner__bg img {
display: block;
width: 100%;
height: auto;
}
.c-banner__content {
position: relative;
width: 100%;
z-index: 2;
}
.c-banner__content-logo {
width: 100%;
max-width: clamp(21.25rem, 9.583rem + 24.31vw, 38.75rem);
margin-bottom: clamp(0.625rem, -0.208rem + 1.74vw, 1.875rem);
}
@media screen and (max-width: 767px) {
.c-banner__content-logo {
width: 85%;
max-width: unset;
margin-bottom: clamp(1.25rem, 0.355rem + 4.47vw, 2.5rem);
}
}
@media screen and (max-width: 540px) {
.c-banner__content-logo {
width: 95%;
}
}
.c-banner__content-logo img {
display: block;
width: 100%;
height: auto;
}
.c-banner__content-title {
font-size: clamp(1.5rem, 0.667rem + 1.74vw, 2.75rem);
font-weight: 800;
line-height: 1.25;
margin-bottom: clamp(0.625rem, 0.208rem + 0.87vw, 1.25rem);
}
@media screen and (max-width: 767px) {
.c-banner__content-title {
font-size: clamp(1.25rem, 0.087rem + 5.82vw, 2.875rem);
line-height: 1.4;
margin-bottom: clamp(0.625rem, 0.178rem + 2.24vw, 1.25rem);
}
}
.c-banner__content-title-sub {
margin-bottom: clamp(0.625rem, -0.208rem + 1.74vw, 1.875rem);
font-size: clamp(1rem, 0.583rem + 0.87vw, 1.625rem);
font-weight: 800;
color: #bfa775;
}
@media screen and (max-width: 767px) {
.c-banner__content-title-sub {
font-size: clamp(1rem, 0.239rem + 3.8vw, 2.063rem);
margin-bottom: clamp(1.25rem, -2.329rem + 17.9vw, 6.25rem);
}
}
.c-banner__content-text {
font-size: clamp(0.75rem, 0.583rem + 0.35vw, 1rem);
font-weight: 500;
margin-bottom: clamp(0.625rem, -0.625rem + 2.6vw, 2.5rem);
}
.c-banner__content-link {
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
align-items: center;
}
@media screen and (max-width: 1280px) {
.c-banner__content-link {
gap: 13px;
}
}
.c-banner__content-link-base {
font-size: clamp(0.875rem, 0.708rem + 0.35vw, 1.125rem);
font-weight: 500;
}
@media screen and (max-width: 767px) {
.c-banner__content-link-base {
font-size: clamp(0.688rem, 0.374rem + 1.57vw, 1.125rem);
}
}
.c-banner__content-link-icon {
width: 25px;
height: 25px;
padding: 4px;
border-radius: 50%;
background-color: #000000;
}
@media screen and (max-width: 1280px) {
.c-banner__content-link-icon {
width: 20px;
height: 20px;
padding: 3px;
}
}
@media screen and (max-width: 540px) {
.c-banner__content-link-icon {
border: 1px solid rgba(255, 255, 255, 0.6);
}
}
.c-banner__content-link-icon img {
display: block;
width: 100%;
height: auto;
transition: transform 0.2s ease-out;
}
.c-banner__content-link:hover .c-banner__content-link-icon img {
transform: translateX(4px);
}
.c-page-top {
position: fixed;
right: 10px;
bottom: 10px;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
padding: 10px;
background-color: rgba(255, 255, 255, 0.65);
border-radius: 5px;
cursor: pointer;
transform: scaleY(0);
transform-origin: bottom center;
opacity: 0;
transition: transform 0.3s ease-out, opacity 0.3s ease-out;
}
.c-page-top.is-visible {
transform: scaleY(1);
opacity: 1;
}
.c-page-top span {
display: block;
}
.c-page-top span img {
display: block;
width: 100%;
height: 100%;
}
.c-btn {
display: block;
width: 100%;
max-width: 300px;
height: auto;
padding: 10px 20px;
font-size: 16px;
font-weight: 600;
text-align: center;
transition: background-color 0.3s ease-out, color 0.3s ease-out;
}
.c-btn--submit {
margin: 15px auto;
background-color: #006837;
color: #ffffff;
border: 1px solid #006837;
border-radius: 10px;
}
.c-btn--submit:hover {
background-color: #ffffff;
color: #006837;
}
.c-link {
display: inline-block;
transition: color 0.3s ease-out;
}
.c-link--with-arrow {
position: relative;
padding-right: 35px;
margin-bottom: 10px;
}
.c-link--with-arrow::before {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
transform: translateY(-50%);
background-color: #000000;
content: "";
z-index: 1;
}
.c-link--with-arrow::after {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 20px;
height: 20px;
transform: translateY(-50%) translateX(-1px);
background-repeat: no-repeat;
background-size: 60% auto;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/arrow-white.svg);
transition: transform 0.3s ease-out;
content: "";
z-index: 2;
}
.c-link:hover {
color: #aaa;
}
.c-link:hover::after {
transform: translateY(-50%) translateX(4px);
}
:root {
--header-h: 120px;
}
.c-book {
position: relative;
padding: 20px;
}
.c-book__viewport {
position: relative;
height: calc(100vh - var(--header-h));
z-index: 0;
}
.c-book__stage {
position: relative;
width: 100%;
height: 100%;
z-index: 0;
}
.c-book__frame {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 0;
}
.c-book__frame--cover {
display: grid;
grid-template-columns: 1fr;
justify-items: center;
box-sizing: unset;
}
@media screen and (max-width: 911px) {
.c-book__frame--cover {
grid-template-columns: 100%;
}
}
.c-book__frame--cover .c-book__wrap {
position: relative;
}
@media screen and (max-width: 911px) {
.c-book__frame--cover .c-book__wrap {
width: 100%;
}
}
.c-book__frame--cover .c-book__content {
width: 100%;
height: 100%;
}
@media screen and (max-width: 911px) {
.c-book__frame--cover .c-book__content {
padding: 15% 10% 5%;
}
}
@media screen and (max-width: 767px) {
.c-book__frame--cover .c-book__content {
padding: 15% 7% 5%;
}
}
@media screen and (max-width: 540px) {
.c-book__frame--cover .c-book__content {
padding: 20% 5% 5%;
}
}
.c-book__frame--cover .c-book__bg-img {
position: absolute;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
overflow: hidden;
}
.c-book__frame--cover .c-book__bg-img img {
position: relative;
display: block;
width: auto;
height: auto;
min-width: 100%;
min-height: 100%;
}
.c-book__frame--spread .c-book__wrap {
display: grid;
grid-template-columns: 50% 50%;
grid-template-areas: "content img";
}
@media screen and (max-width: 1280px) {
.c-book__frame--spread .c-book__wrap {
grid-template-columns: 1fr;
grid-template-areas: "content" "img";
}
}
.c-book__frame--spread .c-book__content {
padding: 7% 7%;
}
@media screen and (max-width: 1280px) {
.c-book__frame--spread .c-book__page--dark {
color: #ffffff;
}
}
.c-book__frame--spread .c-book__page--content {
grid-area: content;
}
.c-book__frame--spread .c-book__page--img {
grid-area: img;
}
@media screen and (max-width: 1280px) {
.c-book__frame--spread .c-book__page--img {
position: absolute;
top: 0;
left: 0;
}
}
.c-book__frame--spread:nth-of-type(even) .c-book__wrap {
grid-template-areas: "img content";
}
@media screen and (max-width: 1280px) {
.c-book__frame--spread:nth-of-type(even) .c-book__wrap {
grid-template-areas: "content" "img";
}
}
.c-book__frame--spread:nth-of-type(even) .c-book__content {
padding: 7% 7%;
}
@media screen and (max-width: 1280px) {
.c-book__frame--spread:nth-of-type(even) .c-book__page--dark {
color: #ffffff;
}
}
.c-book__page {
position: relative;
width: 100%;
height: calc(100vh - 160px);
margin-bottom: 20px;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.2), -1px -1px 10px rgba(0, 0, 0, 0.2);
}
.c-book__content {
position: relative;
width: 100%;
aspect-ratio: 960/1080;
z-index: 5;
padding: 10% 5%;
}
@media screen and (max-width: 911px) {
.c-book__content {
aspect-ratio: unset;
height: 100%;
}
}
.c-book__bg-img {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: 1;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: bottom;
object-position: bottom;
}
@media screen and (max-width: 1280px) {
.c-book__bg-img {
-o-object-position: center;
object-position: center;
}
}
.c-book__bg-img img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: bottom;
object-position: bottom;
}
@media screen and (max-width: 1280px) {
.c-book__bg-img img {
-o-object-position: center;
object-position: center;
}
}
.c-book__title {
margin-bottom: clamp(1.25rem, 0.714rem + 2.68vw, 3.125rem);
font-size: clamp(1.25rem, 1.071rem + 0.89vw, 1.875rem);
font-weight: 600;
font-family: "Noto Serif JP", serif;
line-height: 1.4;
}
.c-book__title--top-cover {
margin-bottom: 0;
font-weight: 500;
font-size: clamp(1.625rem, 1.268rem + 1.79vw, 2.875rem);
}
.c-book__title--back-cover {
position: absolute;
bottom: 0;
left: 0;
display: block;
width: 100%;
margin-bottom: 50px;
font-weight: 500;
text-align: center;
font-size: clamp(1.625rem, 1.268rem + 1.79vw, 2.875rem);
}
.c-book__text {
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
font-family: "Noto Serif JP", serif;
line-height: 1.4;
margin-bottom: 20px;
}
.c-book__page p {
margin-bottom: 30px;
font-weight: 500;
font-family: "Noto Serif JP", serif;
}
.c-book__nav {
position: fixed;
inset: 0;
z-index: 9999;
pointer-events: none;
}
.c-book__nav.is-hidden {
opacity: 0;
pointer-events: none;
transition: opacity 0.3s ease-out;
}
.c-book__btn {
position: absolute;
top: 50%;
pointer-events: auto;
width: 54px;
height: 54px;
padding: 14px;
border: 0;
border-radius: 999px;
background: rgb(0, 0, 0);
color: #fff;
display: grid;
place-items: center;
cursor: pointer;
font-size: 28px;
line-height: 1;
transition: background 0.3s ease-out;
}
.c-book__btn img {
display: block;
width: 100%;
height: auto;
}
.c-book__btn:hover {
background: rgba(0, 0, 0, 0.8);
}
.c-book__btn--prev {
left: 5px;
}
.c-book__btn--prev img {
transform: rotate(180deg);
transition: transform 0.3s ease-out;
}
.c-book__btn--prev:hover img {
transform: rotate(180deg) translateX(4px);
}
.c-book__btn--next {
right: 5px;
}
.c-book__btn--next img {
transition: transform 0.3s ease-out;
}
.c-book__btn--next:hover img {
transform: translateX(4px);
}
.c-book__btn:disabled {
opacity: 0;
}
.c-card-top-service {
gap: 20px;
margin-top: -30px;
}
@media screen and (max-width: 911px) {
.c-card-top-service {
grid-template-columns: repeat(3, 1fr);
gap: 10px;
}
}
@media screen and (max-width: 767px) {
.c-card-top-service {
grid-template-columns: 1fr;
}
}
.c-card-top-service .c-card__item {
position: relative;
padding-top: 30px;
padding-bottom: 30px;
background-color: #006837;
z-index: 1;
opacity: 0;
}
@media screen and (max-width: 767px) {
.c-card-top-service .c-card__item {
display: block;
width: 100%;
max-width: 500px;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
}
}
@media screen and (max-width: 767px) {
.c-card-top-service .c-card__item:nth-of-type(1) {
margin-top: 90px;
}
}
.c-card-top-service .c-card__item .c-card__img {
margin-bottom: 20px;
}
.c-card-top-service .c-card__item .c-card__text {
padding-left: 15px;
padding-right: 15px;
font-size: 14px;
color: #ffffff;
margin-bottom: 20px;
}
.c-card-top-service .c-card__item .c-card__link {
color: #ffffff;
}
.c-card-top-service .c-card__item .c-card__link:hover {
color: #aaa;
}
.c-card-top-service .c-card__item .c-card__link:hover .c-card__link-icon {
transform: translateX(5px);
}
.c-card__item {
display: block;
width: 100%;
height: auto;
border-radius: 10px;
}
.c-card__img {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: auto;
}
.c-card__title {
display: block;
width: 100%;
height: auto;
margin-bottom: 20px;
font-size: 28px;
font-weight: 600;
text-align: center;
line-height: 1;
color: #c5a76e;
}
.c-card__title-en {
display: block;
width: 100%;
font-size: 14px;
color: #ffffff;
text-align: center;
margin-bottom: 10px;
line-height: 1;
}
.c-card__text {
display: block;
width: 100%;
height: auto;
text-align: center;
font-weight: 500;
color: #666;
}
.c-card__link {
display: block;
margin-left: auto;
margin-right: auto;
width: 100%;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-size: 13px;
color: #666;
transition: color 0.2s ease-out;
}
.c-card__link span {
display: inline-block;
width: 30px;
height: 30px;
padding: 7px;
margin-left: 20px;
background-color: #c5a76e;
border-radius: 50%;
vertical-align: middle;
}
.c-card__link span img {
display: block;
width: 100%;
height: auto;
transition: transform 0.3s ease-out;
}
.c-card__link:hover {
color: #aaa;
}
.c-card__link:hover span img {
transform: translateX(5px);
}
.c-card__link-icon {
display: inline-block;
width: 30px;
height: 30px;
margin-left: 10px;
vertical-align: middle;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_slide-arrow-right.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
transition: transform 0.2s ease-out;
}
.c-card-financial {
gap: 30px;
}
@media screen and (max-width: 911px) {
.c-card-financial {
grid-template-columns: 450px;
justify-content: center;
}
}
@media screen and (max-width: 540px) {
.c-card-financial {
grid-template-columns: 1fr;
}
}
.c-card-financial .c-card__title {
line-height: 1.4;
}
.c-card-financial .c-card__item {
position: relative;
aspect-ratio: 400/440;
padding-top: 15%;
background-repeat: no-repeat;
background-size: 80% auto;
background-position: center center;
background-color: #39b54a;
border-radius: 10px;
opacity: 0;
cursor: pointer;
overflow: hidden;
}
.c-card-financial .c-card__item:nth-of-type(1) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_finaial_001.png);
}
.c-card-financial .c-card__item:nth-of-type(2) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_finaial_002.png);
}
.c-card-financial .c-card__item:nth-of-type(3) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_finaial_003.png);
}
.c-card-financial .c-card__item .c-card__overlay {
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
width: 100%;
height: 100%;
padding-left: 50px;
padding-right: 50px;
background-color: rgba(0, 0, 0, 0.6);
transform: translateY(100%);
transition: transform 0.3s ease-out;
}
@media screen and (max-width: 540px) {
.c-card-financial .c-card__item .c-card__overlay {
padding-left: 20px;
padding-right: 20px;
}
}
.c-card-financial .c-card__item .c-card__overlay-text {
color: #ffffff;
font-size: 16px;
line-height: 1.8;
}
.c-card-financial .c-card__item .c-card__icon {
position: absolute;
bottom: 30px;
right: 30px;
display: block;
width: 40px;
height: 40px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_plus.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
transition: transform 0.3s ease-out;
}
.c-card-financial .c-card__item.is-open .c-card__overlay {
transform: translateY(0);
}
.c-card-financial .c-card__item.is-open .c-card__icon {
transform: rotate(45deg);
}
.c-card-category {
display: block;
margin-bottom: 7%;
}
.c-card-category__list {
display: block;
aspect-ratio: 420/560;
width: 100%;
}
.c-card-category__thumb-link {
display: block;
width: 100%;
margin-bottom: 20px;
border-radius: 10px;
overflow: hidden;
}
.c-card-category__thumb {
width: 100%;
}
.c-card-category__thumb img {
display: block;
width: 100%;
height: auto;
}
.c-card-category__meta {
margin-bottom: 10px;
}
.c-card-category__terms {
margin-right: 20px;
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
color: #00ff00;
background-color: #006837;
padding: 5px clamp(1.563rem, 1.055rem + 2.54vw, 2.5rem);
border-radius: 9999px;
}
.c-card-category__date {
font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
font-weight: 500;
}
.c-card-category__title {
font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
font-weight: 600;
line-height: 1.4;
}
.c-card-post {
display: grid;
grid-template-columns: repeat(1fr);
margin-bottom: clamp(2.5rem, 1.146rem + 6.77vw, 5rem);
width: 100%;
aspect-ratio: 420/560;
}
.c-card-post__list {
display: grid;
grid-template-columns: repeat(3, 32%);
gap: 2%;
}
.c-card-post__thumb-link {
display: block;
width: 100%;
margin-bottom: 20px;
border-radius: 10px;
overflow: hidden;
}
.c-card-post__thumb {
width: 100%;
}
.c-card-post__thumb img {
display: block;
width: 100%;
height: auto;
}
.c-card-post__meta {
margin-bottom: 10px;
}
.c-card-post__date {
font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
font-weight: 500;
}
.c-card-post__title {
font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
font-weight: 600;
line-height: 1.4;
}
.c-card-voice {
margin-top: 100px;
margin-bottom: 100px;
}
.c-card-voice .c-card__list {
display: grid;
grid-template-columns: 32% 32% 32%;
gap: 2%;
}
@media screen and (max-width: 1024px) {
.c-card-voice .c-card__list {
grid-template-columns: 48% 48%;
gap: 4%;
}
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__list {
grid-template-columns: 100%;
gap: 20px;
}
}
.c-card-voice .c-card__item {
width: 100%;
aspect-ratio: 420/560;
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__item {
aspect-ratio: 1280/650;
}
}
.c-card-voice .c-card__item a {
position: relative;
display: flex;
justify-content: flex-end;
flex-direction: column;
flex-wrap: wrap;
gap: 10px;
width: 100%;
height: 100%;
padding: 30px;
overflow: hidden;
border-radius: 20px;
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__item a {
padding: 20px;
}
}
@media screen and (max-width: 540px) {
.c-card-voice .c-card__item a {
padding: 13px;
}
}
.c-card-voice .c-card__title {
position: relative;
margin-bottom: 10px;
color: #ffffff;
font-size: clamp(1rem, 0.917rem + 0.42vw, 1.25rem);
font-weight: 600;
text-align: left;
line-height: 1.4;
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__title {
margin-bottom: 0;
}
}
.c-card-voice .c-card__meta {
position: relative;
display: flex;
justify-content: flex-start;
align-items: center;
gap: 10px;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 20px;
border-radius: 9999px;
background-color: #009245;
color: #00ff00;
font-size: 14px;
font-weight: 500;
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__meta {
padding: 5px 15px;
}
}
@media screen and (max-width: 540px) {
.c-card-voice .c-card__meta {
display: none;
}
}
.c-card-voice .c-card__img {
position: absolute;
top: 0;
right: 0;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}
.c-card-voice .c-card__img img {
position: absolute;
right: 0;
top: 50%;
display: block;
width: auto;
height: 100%;
max-width: unset;
transform: translate(0, -50%);
z-index: 0;
}
@media screen and (max-width: 767px) {
.c-card-voice .c-card__img img {
width: 100%;
height: auto;
}
}
.c-card-home .c-card-post__list {
display: grid;
grid-template-columns: 100%;
gap: 50px;
}
.c-card-home .c-card-post__list .c-card-post {
position: relative;
width: 100%;
height: auto;
display: block;
margin-bottom: 0;
aspect-ratio: unset;
}
.c-card-home .c-card-post__list .c-card-post__thumb {
display: block;
width: 100%;
height: 100%;
}
.c-card-home .c-card-post__list .c-card-post__thumb img {
display: block;
min-width: 100%;
min-height: 100%;
}
.c-card-home .c-card-post__list .c-card-post__thumb-link {
display: block;
width: 100%;
aspect-ratio: 16/9;
overflow: hidden;
border-radius: 20px;
}
.c-card-home .c-card-post__list .c-card-post__meta {
margin-bottom: 10px;
}
.c-card-home .c-card-post__list .c-card-post__category {
margin-right: 20px;
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
color: #00ff00;
background-color: #006837;
padding: 5px clamp(1.563rem, 1.055rem + 2.54vw, 2.5rem);
border-radius: 9999px;
}
.c-card-home .c-card-post__list .c-card-post__date {
font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
font-weight: 500;
}
.c-card-home .c-card-post__list .c-card-post__title {
font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
font-weight: 600;
line-height: 1.4;
}
.c-media__img-section {
display: flex;
justify-content: center;
align-items: center;
margin-left: auto;
margin-right: auto;
}
.c-media__img-section img {
display: block;
height: 100%;
width: auto;
margin-left: auto;
margin-right: auto;
}
.c-media__title {
color: #000000;
margin-bottom: 30px;
}
.c-media__title--xxl {
font-size: clamp(1.375rem, 1.25rem + 0.63vw, 1.75rem);
font-weight: 500;
}
.c-media__title--xl {
font-size: clamp(2rem, 0.594rem + 2.47vw, 2.938rem);
font-weight: 800;
}
@media screen and (max-width: 767px) {
.c-media__title--xl {
font-size: clamp(1.5rem, 0.885rem + 3.08vw, 2rem);
}
}
.c-media__title--mlg {
font-size: clamp(1.75rem, -0.418rem + 3.8vw, 2.625rem);
font-weight: 500;
}
.c-media__title--lg {
font-size: clamp(1.375rem, 1.017rem + 1.79vw, 1.875rem);
font-weight: 500;
}
.c-media__title--md {
font-size: 28px;
font-weight: 600;
}
.c-media__title-en {
display: block;
line-height: 1;
font-size: 18px;
font-weight: 500;
color: #c5a76e;
}
.c-media__text {
font-size: 1rem;
font-weight: 500;
color: #666;
margin-bottom: 30px;
}
.c-media__text--md {
font-size: 16px;
font-weight: 500;
}
.c-media__text--lg {
font-size: clamp(0.938rem, 0.803rem + 0.67vw, 1.125rem);
font-weight: 500;
}
.c-media__text--xl {
font-size: clamp(1rem, 0.732rem + 1.34vw, 1.375rem);
font-weight: 500;
}
.c-media__text--xxl {
font-size: 24px;
font-weight: 500;
}
.c-media__link {
font-size: 18px;
font-weight: 500;
color: #333;
margin-bottom: 30px;
transition: color 0.3s ease-out;
}
.c-media__link span {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
padding: 5px;
margin-left: 20px;
border-radius: 50%;
background-color: #000000;
}
.c-media__link span img {
display: block;
width: 100%;
height: auto;
transition: transform 0.3s ease-out;
}
.c-media__link:hover {
color: #aaa;
}
.c-media__link:hover span img {
transform: translateX(3px);
}
.c-media__icon-quot-start {
display: flex;
justify-content: flex-start;
width: 100%;
margin-bottom: 10px;
}
.c-media__icon-quot-start img {
display: block;
width: 50px;
height: auto;
}
@media screen and (max-width: 767px) {
.c-media__icon-quot-start img {
width: 30px;
}
}
.c-media__icon-quot-end {
display: flex;
justify-content: flex-end;
width: 100%;
margin-top: 10px;
}
.c-media__icon-quot-end img {
display: block;
width: 50px;
height: auto;
}
@media screen and (max-width: 767px) {
.c-media__icon-quot-end img {
width: 30px;
}
}
.c-media__quotation {
display: block;
padding: 0 50px;
}
.c-media-top-voice {
grid-template-columns: 25% 1fr;
}
@media screen and (max-width: 767px) {
.c-media-top-voice {
grid-template-columns: 1fr;
}
}
@media screen and (max-width: 767px) {
.c-media-top-voice .c-media__img-section {
display: none;
}
}
.c-media-top-faq {
grid-template-columns: 25% 1fr;
align-items: center;
gap: 80px;
}
@media screen and (max-width: 911px) {
.c-media-top-faq {
grid-template-columns: 35% 1fr;
gap: 50px;
}
}
@media screen and (max-width: 767px) {
.c-media-top-faq {
grid-template-columns: 1fr;
gap: 30px;
}
}
.c-media-top-faq .c-media__img-section img {
display: block;
width: 100%;
height: auto;
}
@media screen and (max-width: 767px) {
.c-media-top-faq .c-media__img-section img {
max-width: 300px;
margin-left: auto;
margin-right: auto;
}
}
.c-media-top-faq .c-media__text-section .c-media__link span {
border-radius: 50%;
background-color: #000000;
}
.c-media-advantage {
position: relative;
gap: 50px;
}
.c-media-advantage .c-media__img-section {
padding-top: 0;
align-items: flex-start;
}
.c-media-advantage .c-media__img-section--inner {
position: -webkit-sticky;
position: sticky;
top: 100px;
left: 0;
display: block;
height: auto;
width: 100%;
}
.c-media-advantage .c-media__img-section--inner img {
display: block;
margin-bottom: 15px;
width: 100%;
height: auto;
}
.c-media-advantage .c-media__text-section {
padding-top: 0;
}
.c-media-advantage .c-media__text-section .c-media__title--xl {
color: #000000;
}
.c-media-advantage .c-media__text-section .c-media__text--lg {
color: #000000;
}
.c-media-financial {
gap: 50px;
}
.c-media-financial .c-media__img-section {
padding-top: 0;
display: flex;
align-items: center;
}
@media screen and (max-width: 911px) {
.c-media-financial .c-media__img-section {
padding-top: 60px;
padding-bottom: 10px;
}
}
.c-media-financial .c-media__img-section img {
display: block;
height: auto;
width: 100%;
}
.c-media-financial .c-media__text-section {
padding-top: 60px;
padding-bottom: 60px;
}
@media screen and (max-width: 911px) {
.c-media-financial .c-media__text-section {
padding-top: 10px;
}
}
.c-media-financial .c-media__text-section .c-media__title--xl {
font-size: clamp(1.75rem, 1.458rem + 1.46vw, 2.625rem);
color: #000000;
}
.c-media-financial .c-media__text-section .c-media__text--lg {
color: #000000;
}
.c-media-financial-help {
grid-template-columns: 30% 1fr;
gap: 0px;
background-color: #f2f2f2;
border-radius: 10px;
}
@media screen and (max-width: 767px) {
.c-media-financial-help {
grid-template-columns: 1fr;
}
}
.c-media-financial-help .c-media__img-section {
padding: 50px 30px;
display: flex;
align-items: center;
}
@media screen and (max-width: 767px) {
.c-media-financial-help .c-media__img-section {
width: 100%;
max-width: 260px;
padding: 50px 30px 0;
}
}
@media screen and (max-width: 540px) {
.c-media-financial-help .c-media__img-section {
padding: 30px 20px 0;
}
}
.c-media-financial-help .c-media__img-section img {
display: block;
height: auto;
width: 100%;
}
.c-media-financial-help .c-media__text-section {
display: flex;
height: 100%;
align-items: center;
padding: 50px 30px;
}
@media screen and (max-width: 540px) {
.c-media-financial-help .c-media__text-section {
padding: 30px 20px;
}
}
.c-media-funding-lead {
width: 100%;
height: auto;
background-color: #39b54a;
border-radius: 10px;
overflow: hidden;
}
.c-media-funding-lead .c-media__img-section {
display: flex;
justify-content: center;
align-items: center;
padding: 80px 70px;
}
@media screen and (max-width: 911px) {
.c-media-funding-lead .c-media__img-section {
padding: 40px;
}
}
.c-media-funding-lead .c-media__img-section img {
display: block;
width: 100%;
max-width: 390px;
height: auto;
}
.c-media-funding-lead .c-media__text-section {
color: #ffffff;
background-color: #39b54a;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
}
@media screen and (max-width: 911px) {
.c-media-funding-lead .c-media__text-section {
display: flex;
justify-content: center;
}
}
.c-media-funding-slide {
gap: 50px;
}
.c-media-funding-slide .c-media__img-section {
display: flex;
justify-content: center;
align-items: center;
}
.c-media-funding-slide .c-media__img-section img {
display: block;
width: 100%;
max-width: 600px;
height: auto;
}
.c-media-funding-qa {
gap: 50px;
}
.c-media-funding-qa .c-media__img-section img {
width: 100%;
height: auto;
}
.c-media-funding-qa .c-media__text-section .c-media__link {
color: #ffffff;
transition: color 0.3s ease-out;
}
.c-media-funding-qa .c-media__text-section .c-media__link span {
transform: translateX(0);
transition: transform 0.3s ease-out;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_arrow-black.svg);
}
.c-media-funding-qa .c-media__text-section .c-media__link:hover {
color: #aaa;
}
.c-media-funding-qa .c-media__text-section .c-media__link:hover span {
transform: translateX(5px);
}
.c-media-speedy {
gap: 50px;
padding-bottom: clamp(3.125rem, -4.62rem + 13.59vw, 6.25rem);
opacity: 0;
}
.c-media-speedy--odd {
grid-template-areas: "image text";
}
@media screen and (max-width: 767px) {
.c-media-speedy--odd {
gap: 30px;
grid-template-areas: "image" "text";
}
}
.c-media-speedy--even {
grid-template-areas: "text image";
}
@media screen and (max-width: 767px) {
.c-media-speedy--even {
grid-template-areas: "image" "text";
}
}
.c-media-speedy .c-media__img-section {
grid-area: image;
}
@media screen and (max-width: 767px) {
.c-media-speedy .c-media__img-section {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: auto;
}
}
.c-media-speedy .c-media__img-section:nth-of-type(1) img {
max-height: 270px;
width: auto;
}
@media screen and (max-width: 767px) {
.c-media-speedy .c-media__img-section:nth-of-type(1) img {
height: 100%;
max-height: 150px;
width: auto;
max-width: unset;
}
}
.c-media-speedy .c-media__img-section:nth-of-type(2) img {
width: 100%;
max-width: 400px;
height: auto;
}
@media screen and (max-width: 767px) {
.c-media-speedy .c-media__img-section:nth-of-type(2) img {
height: 100%;
max-height: 150px;
width: auto;
max-width: unset;
}
}
.c-media-speedy .c-media__img-section:nth-of-type(3) img {
max-height: 330px;
width: auto;
}
@media screen and (max-width: 767px) {
.c-media-speedy .c-media__img-section:nth-of-type(3) img {
height: 100%;
max-height: 150px;
width: auto;
max-width: unset;
}
}
.c-media-speedy .c-media__text-section {
grid-area: text;
}
.c-accordion {
width: 100%;
height: auto;
}
.c-accordion__header {
position: relative;
display: flex;
align-items: center;
width: 100%;
height: 120px;
padding-left: 100px;
padding-right: 100px;
color: #ffffff;
background-color: #39b54a;
border-top-right-radius: 60px;
font-size: clamp(0.938rem, 0.803rem + 0.67vw, 1.125rem);
font-weight: 500;
}
@media screen and (max-width: 767px) {
.c-accordion__header {
height: auto;
min-height: 80px;
padding-top: 10px;
padding-bottom: 10px;
}
}
@media screen and (max-width: 540px) {
.c-accordion__header {
min-height: 60px;
padding-left: 20px;
padding-right: 50px;
}
}
.c-accordion__header::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100px;
height: 100%;
background-repeat: no-repeat;
background-size: 50% 50%;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_question.svg);
content: "";
}
@media screen and (max-width: 540px) {
.c-accordion__header::before {
display: none;
}
}
.c-accordion__header::after {
position: absolute;
top: 0;
right: 0;
display: block;
width: 100px;
height: 100%;
background-repeat: no-repeat;
background-size: 40% 40%;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_plus-narrow.svg);
content: "";
transform: rotate(0);
transition: transform 0.3s ease-out;
}
@media screen and (max-width: 540px) {
.c-accordion__header::after {
right: -20px;
}
}
.c-accordion__content {
display: grid;
grid-template-columns: 15% 1fr;
gap: 30px;
max-height: 0;
overflow: hidden;
transition: max-height 0.6s ease-in-out;
background-color: #ffffff;
}
@media screen and (max-width: 540px) {
.c-accordion__content {
grid-template-columns: 1fr;
}
}
.c-accordion__content-img {
display: flex;
align-items: center;
justify-content: center;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 40px;
}
@media screen and (max-width: 540px) {
.c-accordion__content-img {
display: none;
}
}
.c-accordion__content-img img {
display: block;
max-height: 100%;
max-width: 100%;
}
.c-accordion__content-text {
display: flex;
align-items: center;
padding-top: 30px;
padding-bottom: 30px;
padding-right: 40px;
font-size: clamp(0.938rem, 0.803rem + 0.67vw, 1.125rem);
font-weight: 500;
}
@media screen and (max-width: 767px) {
.c-accordion__content-text {
padding-top: 10px;
padding-bottom: 10px;
}
}
@media screen and (max-width: 540px) {
.c-accordion__content-text {
padding: 10px 20px;
}
}
.c-accordion__item {
margin-bottom: 30px;
}
.c-accordion__item.is-open .c-accordion__header::after {
transform: rotate(45deg);
}
.c-accordion__item.is-open .c-accordion__content {
max-height: 800px;
}
.c-accordion-financial .c-accordion__header {
color: #ffffff;
background-color: #39b54a;
}
.js-accordion-trigger {
position: relative;
cursor: pointer;
transition: opacity 0.3s ease-out;
}
.js-accordion-trigger::after {
content: "";
position: absolute;
top: 50%;
right: 0;
display: block;
width: 30px;
height: 30px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_submit-arrow.svg);
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center center;
transform-origin: center;
transform: translateY(-50%) rotate(0deg);
transition: transform 0.3s ease-out;
}
.js-accordion-trigger:hover {
opacity: 0.5;
}
.js-accordion-trigger:hover::after {
transform: translateY(-50%) rotate(90deg);
}
.js-accordion-trigger.is-active::after {
transform: translateY(-50%) rotate(90deg);
}
.c-box {
position: relative;
border-radius: 10px;
border-radius: 10px;
overflow: hidden;
}
.c-box__header {
padding-top: 40px;
padding-left: 40px;
padding-right: 40px;
padding-bottom: 10px;
margin-bottom: 20px;
border-bottom: 3px dotted #8dc21f;
}
.c-box__header .c-box__icon {
display: block;
height: 100px;
width: auto;
}
.c-box__header .c-box__icon img {
display: block;
height: 100%;
width: auto;
}
.c-box__header .c-box__title--md {
font-size: clamp(1.5rem, 0.571rem + 1.63vw, 1.875rem);
font-weight: 600;
line-height: 1.35;
}
.c-box__body {
padding: 20px 40px 40px;
}
.c-box__body .c-box__block-wrap {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
align-items: center;
}
@media screen and (max-width: 767px) {
.c-box__body .c-box__block-wrap {
grid-template-columns: 1fr;
gap: 20px;
}
}
.c-box__body .c-box__block {
display: grid;
grid-template-columns: 45px 1fr;
align-items: center;
gap: 10px;
padding: 20px 30px;
background-color: #ffffff;
border-radius: 10px;
}
.c-box__body .c-box__block-icon {
height: 45px;
width: 100%;
}
.c-box__body .c-box__block-icon img {
display: block;
height: 100%;
width: auto;
}
.c-box__body .c-box__block-title {
font-size: 14px;
font-weight: 500;
}
.c-box__body .c-box__list-wrap {
padding-top: 20px;
padding-bottom: 40px;
}
.c-box__body .c-box__item {
position: relative;
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
padding-left: 40px;
}
.c-box__body .c-box__item::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 30px;
height: 30px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_check.svg);
content: "";
}
.c-box__body .c-box__text {
font-size: 14px;
}
.c-box__link {
display: block;
position: relative;
width: 100%;
height: 100%;
color: #ffffff;
z-index: 6;
}
.c-box__link-icon {
display: inline-block;
width: 30px;
height: 30px;
margin-left: 20px;
padding: 7px;
background-color: #ffffff;
border-radius: 50%;
vertical-align: middle;
}
.c-box__link-icon img {
display: block;
width: 100%;
height: auto;
transform: transleteX(0);
transition: transform 0.3s ease-out;
}
.c-box__link:hover .c-box__background {
transform: scale(1.08);
}
.c-box__link:hover .c-box__link-icon img {
transform: translateX(4px);
}
.c-box__title {
font-size: 50px;
font-weight: 600;
line-height: 1;
margin-bottom: 10px;
}
.c-box__title span {
display: block;
margin-bottom: 10px;
font-size: 23px;
line-height: 1;
color: #c5a76e;
}
.c-box__overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
z-index: 3;
}
.c-box__background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
transition: transform 0.5s ease-out;
transform-origin: bottom center;
z-index: 3;
}
.c-box__text-wrap {
position: relative;
padding: 60px;
z-index: 5;
}
.c-box__definition-list {
display: grid;
grid-template-columns: 14rem 1fr;
padding-top: 40px;
padding-bottom: 10px;
border-bottom: 1px solid #000000;
}
@media screen and (max-width: 767px) {
.c-box__definition-list {
grid-template-columns: 1fr;
}
}
.c-box__definition-term {
display: block;
font-size: 16px;
font-weight: 500;
color: #000000;
}
.c-box__definition-description {
display: block;
font-size: 16px;
font-weight: 500;
color: #000000;
}
@media screen and (max-width: 767px) {
.c-box__definition-description {
padding-left: 2rem;
color: #666;
}
}
.c-box--company:nth-of-type(1) {
position: relative;
width: 100%;
aspect-ratio: 1280/700;
background-color: #006837;
z-index: 1;
}
.c-box--company:nth-of-type(1) .c-box__float-text {
position: absolute;
top: 40%;
left: 0;
width: 100%;
height: 50%;
z-index: 2;
overflow: hidden;
}
.c-box--company:nth-of-type(1) .c-box__float-text p {
display: inline-block;
white-space: nowrap;
font-size: 82px;
color: #009245;
line-height: 1;
font-family: "Impact";
}
.c-box--company:nth-of-type(1) .c-box__float-text p:nth-of-type(1) {
padding-left: 0;
-webkit-animation: float-text-scroll 600s linear infinite;
animation: float-text-scroll 600s linear infinite;
}
.c-box--company:nth-of-type(1) .c-box__float-text p:nth-of-type(2) {
padding-left: 0;
-webkit-animation: float-text-scroll 400s linear infinite;
animation: float-text-scroll 400s linear infinite;
}
.c-box--company:nth-of-type(1) .c-box__float-text p:nth-of-type(3) {
padding-left: 0;
-webkit-animation: float-text-scroll 800s linear infinite;
animation: float-text-scroll 800s linear infinite;
}
.c-box--company:nth-of-type(1) .c-box__float-text p:nth-of-type(4) {
padding-left: 0;
-webkit-animation: float-text-scroll 350s linear infinite;
animation: float-text-scroll 350s linear infinite;
}
.c-box--company:nth-of-type(1) .c-box__background {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_philosophy.png);
background-size: 70% auto;
background-position: right bottom;
}
.c-box--company:nth-of-type(2) {
aspect-ratio: 1280/700;
}
.c-box--company:nth-of-type(2) .c-box__background {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_top-message.jpg);
}
.c-box--company:nth-of-type(2) .c-box__link {
display: flex;
align-items: center;
}
.c-box--company:nth-of-type(3) {
aspect-ratio: 1280/700;
}
.c-box--company:nth-of-type(3) .c-box__background {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_company-profile.jpg);
}
.c-box--company:nth-of-type(3) .c-box__link {
display: flex;
align-items: center;
}
.c-box-profile {
padding: clamp(0rem, -3.738rem + 7.8vw, 2.5rem) clamp(2.5rem, -1.238rem + 7.8vw, 5rem) clamp(2.5rem, -1.238rem + 7.8vw, 5rem);
background-color: #ffffff;
border-radius: 10px;
}
@media screen and (max-width: 767px) {
.c-box-profile {
padding: 0 20px 20px;
}
}
.c-box-top {
position: relative;
width: 100%;
aspect-ratio: 600/690;
border-radius: 10px;
border-radius: 10px;
overflow: hidden;
}
.c-box-top__link {
display: block;
position: relative;
width: 100%;
height: 100%;
color: #ffffff;
z-index: 6;
}
.c-box-top__link-icon {
display: inline-block;
width: 30px;
height: 30px;
padding: 7px;
margin-left: 20px;
vertical-align: middle;
background-color: #ffffff;
border-radius: 50%;
}
.c-box-top__link-icon img {
display: block;
width: 100%;
height: auto;
transition: transform 0.3s ease-out;
}
.c-box-top__link:hover .c-box-top__background {
transform: scale(1.08);
}
.c-box-top__link:hover .c-box-top__img-background {
transform: scale(1.1);
}
.c-box-top__link:hover .c-box-top__link-icon img {
transform: translateX(5px);
}
.c-box-top__title {
font-size: clamp(1.25rem, 1.042rem + 1.04vw, 1.875rem);
font-weight: 600;
line-height: 1.35;
color: #ffffff;
margin-bottom: clamp(0.625rem, 0.178rem + 2.24vw, 1.25rem);
}
.c-box-top__title span {
display: block;
margin-bottom: clamp(0.313rem, -0.359rem + 3.36vw, 1.25rem);
font-size: clamp(1rem, 0.917rem + 0.42vw, 1.25rem);
line-height: 1;
color: #c5a76e;
}
.c-box-top__text {
font-size: 14px;
font-weight: 500;
color: #ffffff;
}
@media screen and (max-width: 767px) {
.c-box-top__text {
line-height: 1.4;
}
}
.c-box-top__overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
z-index: 3;
}
.c-box-top__background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
transition: transform 0.5s ease-out;
transform-origin: bottom center;
z-index: 3;
}
.c-box-top__text-wrap {
position: relative;
padding: clamp(0.938rem, 4.69vw, 3.75rem);
z-index: 5;
}
.c-box-top:nth-of-type(1) {
position: relative;
background-color: #006837;
z-index: 1;
}
.c-box-top:nth-of-type(1) .c-box-top__float-text {
position: absolute;
top: 40%;
left: 0;
width: 100%;
height: 50%;
z-index: 2;
overflow: hidden;
}
.c-box-top:nth-of-type(1) .c-box-top__float-text p {
display: inline-block;
white-space: nowrap;
font-size: 82px;
color: #009245;
line-height: 1;
font-family: "Impact";
}
.c-box-top:nth-of-type(1) .c-box-top__float-text p:nth-of-type(1) {
padding-left: 0;
-webkit-animation: float-text-scroll 600s linear infinite;
animation: float-text-scroll 600s linear infinite;
}
.c-box-top:nth-of-type(1) .c-box-top__float-text p:nth-of-type(2) {
padding-left: 0;
-webkit-animation: float-text-scroll 400s linear infinite;
animation: float-text-scroll 400s linear infinite;
}
.c-box-top:nth-of-type(1) .c-box-top__float-text p:nth-of-type(3) {
padding-left: 0;
-webkit-animation: float-text-scroll 800s linear infinite;
animation: float-text-scroll 800s linear infinite;
}
.c-box-top:nth-of-type(1) .c-box-top__float-text p:nth-of-type(4) {
padding-left: 0;
-webkit-animation: float-text-scroll 350s linear infinite;
animation: float-text-scroll 350s linear infinite;
}
.c-box-top:nth-of-type(1) .c-box-top__img-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_top-box01.png);
background-repeat: no-repeat;
background-size: 70% auto;
background-position: center bottom;
transition: transform 0.5s ease-in-out;
z-index: 3;
}
.c-box-top:nth-of-type(2) {
background-color: #39b54a;
}
@media screen and (max-width: 911px) {
.c-box-top:nth-of-type(2) {
width: 100%;
}
}
.c-box-top:nth-of-type(2) .c-box-top__img-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_top-box02.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
transition: transform 0.5s ease-in-out;
z-index: 1;
}
.c-box-speedy {
padding: 40px;
background-color: #f9e8af;
}
@media screen and (max-width: 767px) {
.c-box-speedy {
padding: 30px;
}
}
@media screen and (max-width: 540px) {
.c-box-speedy {
padding: 20px;
}
}
.c-box-speedy .c-box__header {
padding: 0 0 10px;
}
.c-box-speedy .c-box__header .c-box__icon img {
display: block;
}
@media screen and (max-width: 540px) {
.c-box-speedy .c-box__header .c-box__icon img {
margin-left: auto;
margin-right: auto;
}
}
@media screen and (max-width: 540px) {
.c-box-speedy .c-box__header .c-box__title {
text-align: center;
}
}
.c-box-speedy .c-box__body {
padding: 20px 0 0;
}
.c-tab-panel__trigger-group {
display: grid;
grid-template-columns: repeat(3, minmax(0, 320px));
justify-content: center;
align-items: center;
}
@media screen and (max-width: 767px) {
.c-tab-panel__trigger-group {
grid-template-columns: repeat(3, 1fr);
}
}
@media screen and (max-width: 540px) {
.c-tab-panel__trigger-group {
grid-template-columns: 1fr;
}
}
.c-tab-panel__trigger-group .c-tab-panel__trigger {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
max-width: 320px;
height: 60px;
background-color: #ffffff;
border-left: 2px solid rgba(0, 0, 0, 0.05);
border-right: 2px solid rgba(0, 0, 0, 0.05);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
font-weight: 500;
}
@media screen and (max-width: 540px) {
.c-tab-panel__trigger-group .c-tab-panel__trigger {
display: none;
}
}
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(1) {
transform: translateX(10px);
z-index: 3;
}
@media screen and (max-width: 767px) {
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(1) {
transform: translateX(0);
}
}
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(2) {
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(2) {
transform: translateX(0);
}
}
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(3) {
transform: translateX(-10px);
z-index: 1;
}
@media screen and (max-width: 767px) {
.c-tab-panel__trigger-group .c-tab-panel__trigger:nth-of-type(3) {
transform: translateX(0);
}
}
.c-tab-panel__trigger-group .c-tab-panel__trigger.is-active {
z-index: 6;
}
@media screen and (max-width: 767px) {
.c-tab-panel__trigger-group .c-tab-panel__trigger:hover {
background-color: #006837;
color: #ffffff;
}
}
.c-tab-panel {
position: relative;
width: 100%;
height: auto;
box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.1);
z-index: 5;
}
.c-tab-panel__wrap {
padding: clamp(1.25rem, -0.54rem + 8.95vw, 3.75rem);
background-color: #ffffff;
}
.c-tab-panel__item {
display: none;
}
@media screen and (max-width: 540px) {
.c-tab-panel__item {
display: block;
margin-bottom: 30px;
}
}
.c-tab-panel__item-body-wrap {
gap: clamp(1.25rem, -0.092rem + 6.71vw, 3.125rem);
}
.c-tab-panel__item-body-img {
display: block;
width: 100%;
height: auto;
}
.c-tab-panel__item-body-text {
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
font-weight: 500;
color: #666;
}
.c-tab-panel__item.is-active {
display: block;
}
.c-tab-panel__title {
font-size: clamp(1.25rem, 1.116rem + 0.67vw, 1.438rem);
font-weight: 600;
margin-bottom: 10px;
color: #000000;
}
.c-nav--extra-post {
position: relative;
height: 100%;
width: auto;
z-index: 1000;
}
@media screen and (max-width: 767px) {
.c-nav--extra-post {
display: none;
}
}
.c-nav--extra-post .menu-extra-post-nav-container {
height: 100%;
}
.c-nav--extra-post .menu-extra-post-nav-container .menu {
display: flex;
height: 100%;
align-items: center;
margin-right: 10px;
}
.c-nav--extra-post .menu-extra-post-nav-container .menu-item {
font-size: 0.75rem;
border-right: 1px solid #ffffff;
padding-left: 5px;
padding-right: 5px;
margin-bottom: 0;
}
.c-nav--extra-post .menu-extra-post-nav-container .menu-item:last-child {
border-right: none;
}
.c-nav--extra-post .menu-extra-post-nav-container .menu-item a {
display: block;
color: #ffffff;
padding-left: 10px;
padding-right: 10px;
font-weight: 500;
transition: color 0.2s ease-out;
}
.c-nav--extra-post .menu-extra-post-nav-container .menu-item a:hover {
color: #aaa;
}
.c-nav--extra {
position: relative;
height: 100%;
width: auto;
z-index: 1000;
}
.c-nav--extra .menu-extra-nav-container {
height: 100%;
}
.c-nav--extra .menu-extra-nav-container .menu {
display: flex;
height: 100%;
align-items: center;
}
.c-nav--extra .menu-extra-nav-container .menu-item {
display: flex;
align-items: center;
height: 100%;
margin-bottom: 0;
font-size: 0.75rem;
border-right: 1px solid #ffffff;
}
.c-nav--extra .menu-extra-nav-container .menu-item:last-child {
border-right: none;
}
.c-nav--extra .menu-extra-nav-container .menu-item a {
display: flex;
align-items: center;
width: 100%;
padding-left: 40px;
padding-right: 40px;
height: 100%;
text-align: center;
color: #ffffff;
background-color: #c5a76e;
font-weight: 500;
transition: all 0.2s ease-out;
}
.c-nav--extra .menu-extra-nav-container .menu-item a:hover {
color: #000000;
background-color: #ffffff;
}
.c-nav--contact {
justify-content: center;
display: flex;
align-items: center;
width: 240px;
height: 100%;
font-size: 14px;
font-weight: 500;
color: #ffffff;
background-color: #000000;
text-align: center;
}
.c-nav--contact p {
line-height: 1;
}
.c-nav--contact p span {
font-size: 10px;
}
.c-nav-sp {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 60px;
height: 60px;
z-index: 1000;
}
.c-nav-sp span {
position: relative;
display: block;
width: 30px;
height: 3px;
background-color: #ffffff;
}
.c-nav-sp span::before {
position: absolute;
top: 10px;
left: 0;
display: block;
width: 100%;
height: 3px;
background-color: #ffffff;
transition: transform 0.2s ease-out, top 0.2s ease-out;
content: "";
}
.c-nav-sp span::after {
position: absolute;
bottom: 10px;
right: 0;
display: block;
width: 100%;
height: 3px;
background-color: #ffffff;
transition: transform 0.2s ease-out, bottom 0.2s ease-out;
content: "";
}
.c-nav-sp.is-open span {
background-color: transparent;
}
.c-nav-sp.is-open span::before {
transform: rotate(45deg);
top: 0;
}
.c-nav-sp.is-open span::after {
transform: rotate(-45deg);
bottom: 0;
}
.l-header__nav {
position: relative;
display: flex;
align-items: center;
width: auto;
height: 100%;
}
@media screen and (max-width: 767px) {
.l-header__nav {
position: relative;
display: block;
width: 100%;
height: 100%;
z-index: 998;
}
}
.l-header__nav--inner {
display: flex;
align-items: center;
height: 100%;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner {
height: auto;
max-height: 0;
background-color: #ffffff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
transition: max-height 0.3s ease-out, height 0.3s ease-out;
overflow-y: auto;
-webkit-overflow-scrolling: touch;
}
}
.l-header__nav--inner .menu-global-nav-container {
height: 100%;
width: auto;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container {
height: auto !important;
width: 100%;
}
}
.l-header__nav--inner .menu-global-nav-container .menu {
position: relative;
display: flex;
align-items: center;
height: 100%;
padding-top: 20px;
padding-bottom: 20px;
z-index: 1000;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu {
display: block;
height: auto !important;
max-height: 0;
opacity: 0;
transition: opacity 0.3s ease-out, max-height 0.3s ease-out;
}
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu.is-open {
display: block;
grid-template-columns: 1fr;
width: 100%;
height: auto;
max-height: 100vh;
padding-top: 30px;
background-color: #ffffff;
opacity: 1;
z-index: 999;
}
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item {
height: auto;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item:not(.u-visible-sp) {
border-right: 1px solid #ffffff;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item:not(.u-visible-sp).last-item-pc {
border-right: none;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item {
width: 100%;
border-right: none;
background-color: #ffffff;
padding-left: 30px;
padding-right: 30px;
}
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item:last-child {
padding-bottom: 30px;
}
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item a {
display: flex;
align-items: center;
height: 100%;
padding-left: 20px;
padding-right: 20px;
color: #ffffff;
font-size: 14px;
font-weight: 500;
transition: all 0.2s ease-out;
}
@media screen and (max-width: 1280px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item a {
padding-left: clamp(0.375rem, -0.933rem + 2.73vw, 1.25rem);
padding-right: clamp(0.375rem, -0.933rem + 2.73vw, 1.25rem);
}
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item a {
display: block;
color: #000000;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
margin-top: 5px;
margin-bottom: 5px;
border-left: 5px solid #39b54a;
}
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item a:hover, .l-header__nav--inner .menu-global-nav-container .menu .menu-item a.is-active {
color: #aaa;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item .sub-menu {
display: none;
opacity: 0;
overflow: hidden;
transition: max-height 0.4s ease, opacity 0.4s ease;
will-change: max-height, opacity;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children {
position: relative;
height: auto;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open {
height: auto;
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu {
position: absolute;
top: 40px;
left: 50%;
display: block;
width: 20rem;
padding: 40px;
background-color: #013f20;
color: #ffffff;
border-radius: 10px;
opacity: 1;
transform: translateX(-50%);
transition: all 0.3s ease-out;
z-index: 1000;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu {
position: relative;
top: 0;
left: 0;
margin-top: 0;
transform: translateX(0);
border-radius: unset;
background-color: inherit;
width: 100%;
padding: 0;
}
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu > .menu-item {
border-right: none;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu > .menu-item {
padding-left: 0;
padding-right: 0;
}
}
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu > .menu-item > a {
padding: 10px 0;
width: 100%;
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu > .menu-item > a {
padding: 10px 0 10px 20px;
background-color: #f2f2f2;
}
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item-has-children.is-open > .sub-menu > .menu-item:last-child {
padding-bottom: 0;
}
}
@media screen and (max-width: 767px) {
.l-header__nav--inner .menu-global-nav-container .menu .menu-item.current-menu-item > a {
border-left: 5px solid #00ff00;
}
}
@media screen and (max-width: 767px) {
.l-header__nav.is-open .l-header__nav--inner {
max-height: 100vh;
height: auto;
overflow: auto;
}
}
.l-header__sp-nav {
display: none;
}
@media screen and (max-width: 767px) {
.l-header__sp-nav {
position: relative;
position: fixed;
top: 10px;
right: 20px;
display: block;
z-index: 1001;
}
}
.l-header-float-nav {
position: fixed;
top: 50%;
right: 0;
display: none;
grid-template-columns: 1fr;
width: 35px;
height: auto;
transform: translateY(-50%);
z-index: 999;
opacity: 0;
}
@media screen and (max-width: 767px) {
.l-header-float-nav {
display: grid;
}
}
@media screen and (max-width: 420px) {
.l-header-float-nav {
display: none;
}
}
.l-header-float-nav__item {
position: relative;
display: block;
width: 35px;
height: 140px;
padding-top: 25px;
border-radius: 5px;
}
.l-header-float-nav__item span {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(-90deg);
transform-origin: center center;
display: block;
padding-right: 25px;
color: #ffffff;
font-size: 12px;
font-weight: 500;
white-space: nowrap;
}
.l-header-float-nav__item-contact {
display: block;
background-color: #39b54a;
box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.2);
opacity: 1;
transition: opacity 0.3s ease-out;
}
.l-header-float-nav__item-contact::before {
position: absolute;
top: 10px;
left: 5px;
display: block;
width: 25px;
height: 25px;
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_mail.svg);
content: "";
}
.l-header-float-nav__item-contact:hover {
opacity: 0.7;
}
.l-header-float-nav__item-tel {
margin-top: -10px;
background-color: #000000;
}
.l-header-float-nav__item-tel::before {
position: absolute;
top: 10px;
left: 5px;
display: block;
width: 25px;
height: 25px;
background-repeat: no-repeat;
background-size: contain;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_free-dial.svg);
content: "";
}
.pagination .nav-links {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 8px;
margin-top: 40px;
margin-bottom: 40px;
}
.pagination .nav-links .page-numbers {
display: flex;
justify-content: center;
align-items: center;
width: auto;
height: auto;
padding: 6px 10px;
font-size: 14px;
font-weight: 400;
color: #000000;
border: 1px solid #000000;
border-radius: 3px;
background-color: #ffffff;
transition: all 0.3s ease-in-out;
}
.pagination .nav-links .page-numbers.next, .pagination .nav-links .page-numbers.prev {
font-weight: 500;
border: none;
background-color: transparent;
}
.pagination .nav-links .page-numbers:hover {
background-color: #000000;
color: #ffffff;
}
.pagination .nav-links .page-numbers.current {
background-color: #000000;
color: #ffffff;
pointer-events: none;
}
.c-pagination-section {
display: flex;
justify-content: center;
align-items: center;
padding-top: 30px;
padding-bottom: 30px;
background-color: #009245;
}
.c-pagination__list {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
gap: 30px;
}
.c-pagination__item.is-empty {
opacity: 0;
pointer-events: none;
}
.c-pagination__item a {
display: block;
padding: 10px 30px;
background-color: #ffffff;
border-radius: 9999px;
text-align: center;
font-size: 20px;
font-weight: 500;
color: #000000;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.c-pagination__item a:hover {
background-color: #000000;
color: #ffffff;
}
.c-pagination-voice {
margin-top: 50px;
margin-bottom: 50px;
}
.c-pagination-voice ul {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 15px;
}
.c-pagination-voice ul li span {
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 30px;
font-size: 24px;
font-weight: 500;
color: #00ff00;
background-color: #006837;
border: 1px solid #006837;
border-radius: 9999px;
}
.c-pagination-voice ul li a {
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 30px;
font-size: 24px;
font-weight: 500;
text-align: center;
color: #00ff00;
background-color: #006837;
border: 1px solid #006837;
border-radius: 9999px;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.c-pagination-voice ul li a:hover {
color: #006837;
background-color: #ffffff;
}
.c-pagination--single {
display: block;
width: 100%;
padding-top: 50px;
padding-bottom: 50px;
}
.c-pagination--single .c-pagination__list {
display: grid;
grid-template-columns: 30% 30% 30%;
gap: 5%;
justify-items: center;
list-style: none;
}
.c-pagination--single .c-pagination__item a {
display: block;
margin: 0 auto;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 30px;
background-color: #006837;
color: #00ff00;
font-size: 15px;
font-weight: 500;
border: 1px solid #006837;
border-radius: 9999px;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.c-pagination--single .c-pagination__item a:hover {
color: #006837;
background-color: #ffffff;
}
.p-page .wpcf7-form p {
margin-bottom: 0;
}
.p-page .wpcf7-form .c-form-label__title {
display: inline-block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 5px 10px;
margin-left: 20px;
background-color: #ffffff;
font-size: 14px;
}
.p-page .wpcf7-form .c-form__input {
display: block;
width: 100%;
margin-top: -20px;
margin-bottom: 20px;
font-size: 15px;
border: 1px solid #666;
border-radius: 5px;
}
@media screen and (max-width: 911px) {
.p-page .wpcf7-form .c-form__input {
margin-bottom: 10px;
}
}
.p-page .wpcf7-form .c-form__input input {
width: 100%;
height: 100%;
padding: 20px 10px 10px;
font-size: 15px;
color: #666;
}
.p-page .wpcf7-form .c-form__input select {
width: 100%;
height: 100%;
padding: 20px 10px 10px;
font-size: 15px;
color: #666;
}
.p-page .wpcf7-form .c-form__input textarea {
width: 100%;
height: 100%;
padding: 20px 10px 10px;
font-size: 15px;
color: #666;
}
.p-page .wpcf7-form .c-form__input input:-internal-autofill-selected {
background-color: transparent !important;
color: #666;
}
.submit-wrap {
position: relative;
width: 220px;
height: 60px;
cursor: pointer;
}
.submit-wrap::before {
content: "";
position: absolute;
right: 5px;
top: 5px;
display: block;
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #39b54a;
z-index: 1;
}
.submit-wrap::after {
content: "";
position: absolute;
right: 5px;
top: 5px;
display: block;
width: 40px;
height: 40px;
transform: translateX(0);
background-repeat: no-repeat;
background-size: 50% 50%;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/arrow-white.svg);
transition: transform 0.3s ease-out;
z-index: 2;
}
.submit-wrap .wpcf7-submit {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 50px;
background-color: #006837;
color: #ffffff;
border: 1px solid #006837;
font-size: 15px;
font-weight: 600;
letter-spacing: 2rem;
text-align: center;
border-radius: 9999px;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.submit-wrap:hover::after {
transform: translateX(6px);
}
.c-form--sidebar-search .c-form__checkbox-list {
display: grid;
grid-template-columns: 1fr;
gap: 5px;
margin-bottom: 10px;
padding-left: 1rem;
}
.c-form--sidebar-search .c-form__checkbox-item {
font-size: clamp(0.875rem, 0.72rem + 0.27vw, 0.938rem);
font-weight: 500;
}
.c-form--sidebar-search .c-form__submit {
display: flex;
justify-content: center;
}
.c-form-voice-search {
display: block;
padding: 30px;
border-radius: 20px;
background-color: #e6e6e6;
}
.c-form-voice-search .c-form__list {
display: grid;
grid-template-columns: 6rem 1fr;
gap: 10px;
}
.c-form-voice-search .c-form__title {
font-size: 18px;
font-weight: 500;
}
.c-form-voice-search .c-form__checkbox {
position: relative;
display: block;
width: 100%;
}
.c-form-voice-search .c-form__checkbox-list {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
gap: 10px 30px;
margin-bottom: 30px;
}
.c-form-voice-search .c-form__checkbox-item {
position: relative;
padding-left: 25px;
}
.c-form-voice-search .c-form__checkbox-item input[type=checkbox] {
display: none;
}
.c-form-voice-search .c-form__checkbox-item input[type=checkbox]:checked + .c-form__checkbox-icon {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_check.svg);
}
.c-form-voice-search .c-form__checkbox-item .c-form__checkbox-icon {
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
display: block;
width: 20px;
height: 20px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_checkbox.svg);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
}
.c-form-voice-search .c-form__submit {
display: flex;
justify-content: center;
}
.c-form-voice-search .c-form__submit button {
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
min-width: 180px;
padding: 10px 20px;
font-size: 15px;
font-weight: 500;
text-align: center;
color: #00ff00;
background-color: #006837;
border-radius: 9999px;
border: 1px solid #006837;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.c-form-voice-search .c-form__submit button:hover {
background-color: #ffffff;
color: #006837;
}
.c-form-keyword {
display: grid;
grid-template-columns: 1fr 150px;
width: 100%;
max-width: 700px;
height: auto;
margin: 50px auto;
}
.c-form-keyword .c-form__field-keyword {
padding: 10px;
font-size: 15px;
font-weight: 500;
border: 1px solid #000000;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.c-form-keyword .c-form__submit {
padding: 10px;
font-size: 15px;
font-weight: 500;
background-color: #000000;
color: #ffffff;
border: 1px solid #000000;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
text-align: center;
}
.c-modal-trigger {
position: relative;
border-radius: 10px;
border-radius: 10px;
overflow: hidden;
}
.c-modal-trigger__link {
display: block;
position: relative;
width: 100%;
height: 100%;
color: #ffffff;
z-index: 6;
}
.c-modal-trigger__link-icon {
display: inline-block;
width: 30px;
height: 30px;
padding: 7px;
margin-left: 20px;
vertical-align: middle;
background-color: #ffffff;
border-radius: 50%;
}
.c-modal-trigger__link-icon img {
display: block;
width: 100%;
height: auto;
transition: transform 0.3s ease-out;
}
.c-modal-trigger__link:hover .c-modal-trigger__background {
transform: scale(1.08);
}
.c-modal-trigger__link:hover .c-modal-trigger__img-background {
transform: scale(1.1);
}
.c-modal-trigger__link:hover .c-modal-trigger__link-icon img {
transform: translateX(5px);
}
.c-modal-trigger__title {
font-size: clamp(1.5rem, 0.958rem + 2.71vw, 3.125rem);
font-weight: 600;
line-height: 1;
margin-bottom: 10px;
}
.c-modal-trigger__title span {
display: block;
margin-bottom: clamp(0.313rem, 0.208rem + 0.52vw, 0.625rem);
font-size: clamp(0.875rem, 0.688rem + 0.94vw, 1.438rem);
line-height: 1;
color: #c5a76e;
}
.c-modal-trigger__overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
z-index: 3;
}
.c-modal-trigger__background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
transition: transform 0.5s ease-out;
transform-origin: bottom center;
z-index: 3;
}
.c-modal-trigger__text-wrap {
position: relative;
padding: clamp(0.938rem, 4.69vw, 3.75rem);
z-index: 5;
}
.c-modal-trigger--top:nth-of-type(1) {
position: relative;
grid-area: area1;
width: 100%;
aspect-ratio: 1280/690;
background-color: #006837;
z-index: 1;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text {
position: absolute;
top: 40%;
left: 0;
width: 100%;
height: 50%;
z-index: 2;
overflow: hidden;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text p {
display: inline-block;
white-space: nowrap;
font-size: 82px;
color: #009245;
line-height: 1;
font-family: "Impact";
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text p:nth-of-type(1) {
padding-left: 0;
-webkit-animation: float-text-scroll 600s linear infinite;
animation: float-text-scroll 600s linear infinite;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text p:nth-of-type(2) {
padding-left: 0;
-webkit-animation: float-text-scroll 400s linear infinite;
animation: float-text-scroll 400s linear infinite;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text p:nth-of-type(3) {
padding-left: 0;
-webkit-animation: float-text-scroll 800s linear infinite;
animation: float-text-scroll 800s linear infinite;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__float-text p:nth-of-type(4) {
padding-left: 0;
-webkit-animation: float-text-scroll 350s linear infinite;
animation: float-text-scroll 350s linear infinite;
}
.c-modal-trigger--top:nth-of-type(1) .c-modal-trigger__img-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_philosophy.png);
background-repeat: no-repeat;
background-size: 70% auto;
background-position: right bottom;
transition: transform 0.5s ease-in-out;
z-index: 3;
}
.c-modal-trigger--top:nth-of-type(2) {
grid-area: area2;
aspect-ratio: 620/820;
background-color: #39b54a;
}
@media screen and (max-width: 911px) {
.c-modal-trigger--top:nth-of-type(2) {
width: 100%;
aspect-ratio: 1280/690;
}
}
.c-modal-trigger--top:nth-of-type(2) .c-modal-trigger__img-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #ffffff;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_top-message.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
transition: transform 0.5s ease-in-out;
z-index: 1;
}
@media screen and (max-width: 911px) {
.c-modal-trigger--top:nth-of-type(2) .c-modal-trigger__img-background {
background-size: 50% auto;
background-position: bottom right;
}
}
.c-modal-trigger--top:nth-of-type(3) {
grid-area: area3;
aspect-ratio: 620/820;
background-color: #ffffff;
}
@media screen and (max-width: 911px) {
.c-modal-trigger--top:nth-of-type(3) {
width: 100%;
aspect-ratio: 1280/690;
}
}
.c-modal-trigger--top:nth-of-type(3) .c-modal-trigger__img-background {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/img_company-profile.png);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
transition: transform 0.5s ease-in-out;
z-index: 1;
}
@media screen and (max-width: 911px) {
.c-modal-trigger--top:nth-of-type(3) .c-modal-trigger__img-background {
background-size: 50% auto;
background-position: bottom right;
}
}
.c-modal-trigger--advantage {
position: relative;
width: 100%;
aspect-ratio: 420/620;
background: linear-gradient(to right, #006837, #39b54a);
z-index: 1;
}
@media screen and (max-width: 767px) {
.c-modal-trigger--advantage {
aspect-ratio: 420/280;
}
}
.c-modal-trigger--advantage .c-modal-trigger__link {
display: flex;
align-items: flex-start;
}
.c-modal-trigger--advantage .c-modal-trigger__text-wrap {
padding: 40px;
color: #ffffff;
}
.c-modal-trigger--advantage .c-modal-trigger__text-wrap .c-modal-trigger__title {
font-size: 30px;
font-weight: 800;
}
.c-modal-trigger--advantage .c-modal-trigger__text-wrap .c-modal-trigger__title-en {
font-size: 16px;
font-weight: 600;
}
.c-modal-trigger--advantage .c-modal-trigger__text-wrap .c-modal-trigger__text {
font-size: 14px;
font-weight: 500;
}
@media screen and (max-width: 767px) {
.c-modal-trigger--advantage .c-modal-trigger__text-wrap p {
display: none;
}
}
.c-modal-trigger--advantage .c-modal-trigger__background {
width: 100%;
height: auto;
top: 50%;
left: 0;
}
@media screen and (max-width: 767px) {
.c-modal-trigger--advantage .c-modal-trigger__background {
top: 20%;
}
}
.c-modal-trigger--advantage .c-modal-trigger__background img {
display: block;
width: 70%;
margin-left: auto;
margin-right: auto;
height: auto;
}
.c-modal-trigger--advantage .c-modal-trigger__button {
position: absolute;
bottom: 20px;
right: 20px;
display: block;
width: 40px;
height: 40px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_plus.svg);
z-index: 5;
}
.c-modal-trigger--advantage:nth-of-type(1) .c-modal-trigger__background img {
width: 100%;
}
@media screen and (max-width: 767px) {
.c-modal-trigger--advantage:nth-of-type(3) .c-modal-trigger__background {
top: 38%;
}
}
.c-modal-trigger--stance {
position: relative;
width: 100%;
aspect-ratio: 6/7;
background-size: cover;
background-repeat: no-repeat;
background-position: center bottom;
z-index: 1;
}
.c-modal-trigger--stance .c-modal-trigger__link {
display: flex;
align-items: flex-start;
}
.c-modal-trigger--stance .c-modal-trigger__text-wrap {
padding: 40px;
}
@media screen and (max-width: 760px) {
.c-modal-trigger--stance .c-modal-trigger__text-wrap {
padding: 20px;
}
}
.c-modal-trigger--stance .c-modal-trigger__text-wrap .c-modal-trigger__title {
color: #000000;
font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
font-weight: 600;
line-height: 1.35;
}
.c-modal-trigger--stance .c-modal-trigger__background {
width: 100%;
height: auto;
top: 50%;
left: 0;
}
.c-modal-trigger--stance .c-modal-trigger__background img {
display: block;
width: 70%;
margin-left: auto;
margin-right: auto;
height: auto;
}
.c-modal-trigger--stance .c-modal-trigger__button {
position: absolute;
bottom: 20px;
right: 20px;
display: block;
width: 40px;
height: 40px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_plus.svg);
z-index: 5;
}
.c-modal-trigger--stance:nth-of-type(1) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance01.png);
}
.c-modal-trigger--stance:nth-of-type(2) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance02.png);
}
.c-modal-trigger--stance:nth-of-type(3) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance03.png);
}
.c-modal-trigger--stance:nth-of-type(4) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance04.png);
}
.c-modal-trigger--stance:nth-of-type(5) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance05.png);
}
.c-modal-trigger--stance:nth-of-type(6) {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal-stance06.png);
}
.c-modal__target {
position: fixed;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
opacity: 0;
transform: scale(0);
transform-origin: bottom center;
transition: opacity 0.4s ease-out, transform 0.4s ease-out;
z-index: 1000;
}
.c-modal__target.is-open {
transform: scale(1);
opacity: 1;
}
.c-modal__target-stance .c-modal__header {
aspect-ratio: 128/14;
background: linear-gradient(to right, #510000, #e32b11);
}
.c-modal__target-stance .c-modal__header-title {
color: #ffffff;
}
.c-modal__overlay {
position: fixed;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, 0.8);
z-index: 90;
}
.c-modal__content {
position: relative;
display: block;
height: auto;
max-height: 90vh;
padding-left: 0;
padding-right: 0;
border-radius: 40px;
overflow: auto;
z-index: 95;
}
.c-modal__content--inner {
width: 100%;
}
.c-modal__header {
position: relative;
display: flex;
align-items: flex-start;
width: 100%;
height: auto;
padding: clamp(0.938rem, 4.69vw, 3.75rem);
aspect-ratio: 128/62;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.c-modal__header-title {
font-size: clamp(1.125rem, 1rem + 0.63vw, 1.5rem);
font-weight: 600;
line-height: 1.35;
color: #000000;
}
.c-modal__header-title-en {
display: block;
margin-bottom: 10px;
color: #c5a76e;
font-size: clamp(0.938rem, 0.875rem + 0.31vw, 1.125rem);
line-height: 1;
font-weight: 600;
}
.c-modal__header-icon {
position: absolute;
bottom: 0;
right: clamp(0.625rem, -0.417rem + 5.21vw, 3.75rem);
display: flex;
justify-content: center;
align-items: center;
width: 110px;
height: 110px;
padding: 10px;
background-color: #ffffff;
border: 2px solid #006837;
border-radius: 50%;
transform: translateY(55px);
}
.c-modal__header-icon img {
display: block;
max-width: 100%;
height: auto;
max-height: 100%;
}
.c-modal__button-close {
position: absolute;
z-index: 99;
top: 20px;
right: 20px;
display: block;
width: 40px;
height: 40px;
transform: rotate(45deg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_plus.svg);
}
.c-modal__body {
padding: 20px clamp(0.938rem, 4.69vw, 3.75rem) 40px;
background-color: #ffffff;
}
.c-modal__body-text {
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
}
#modal1 .c-modal__header {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal_advantage01.png);
}
#modal2 .c-modal__header {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal_advantage02.png);
}
#modal3 .c-modal__header {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_modal_advantage03.png);
}
.c-kv {
position: relative;
width: 100%;
aspect-ratio: 192/38;
background-repeat: no-repeat;
background-size: auto 100%;
background-position: center right;
color: #ffffff;
}
@media screen and (max-width: 1280px) {
.c-kv {
aspect-ratio: 192/48;
background-position: bottom right;
}
}
@media screen and (max-width: 911px) {
.c-kv {
aspect-ratio: 192/66;
background-position: bottom right;
}
}
@media screen and (max-width: 767px) {
.c-kv {
aspect-ratio: 192/84;
background-position: bottom right;
}
}
@media screen and (max-width: 540px) {
.c-kv {
aspect-ratio: 192/120;
background-position: bottom right;
}
}
.c-kv--low {
aspect-ratio: 192/66;
background: linear-gradient(to right, #006837, #009245 45%, #00ff00 90%);
}
.c-kv-basic {
aspect-ratio: 192/38;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_bg_funding.png);
}
@media screen and (max-width: 1280px) {
.c-kv-basic {
aspect-ratio: 192/48;
background-position: bottom right;
}
}
@media screen and (max-width: 911px) {
.c-kv-basic {
aspect-ratio: 192/66;
background-position: bottom right;
}
}
@media screen and (max-width: 767px) {
.c-kv-basic {
aspect-ratio: 192/84;
background-position: bottom right;
}
}
@media screen and (max-width: 540px) {
.c-kv-basic {
aspect-ratio: 192/120;
background-position: bottom right;
}
}
.c-kv-basic-breadcrumb {
height: 60px;
}
.c-kv-basic-breadcrumb .c-breadcrumb {
display: flex;
justify-content: flex-start;
align-items: center;
height: 100%;
width: 100%;
}
.c-kv-basic-breadcrumb .c-breadcrumb ul {
display: flex;
justify-content: flex-start;
align-items: center;
height: auto;
width: 100%;
}
.c-kv-basic-breadcrumb .c-breadcrumb li {
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid #ffffff;
}
.c-kv-basic-breadcrumb .c-breadcrumb li:last-child {
border-right: none;
margin-right: 0;
}
.c-kv-basic-breadcrumb .c-breadcrumb li a {
transition: opacity 0.3s ease-out;
}
.c-kv-basic-breadcrumb .c-breadcrumb li a:hover {
opacity: 0.5;
}
.c-kv-basic-wave {
aspect-ratio: 192/38;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
width: 100%;
background: linear-gradient(-45deg, #39b54a, #006837, #00ff00, #39b54a);
background-size: 800% 400%;
transition: all 1s ease-in-out;
-webkit-animation: gradient 20s infinite cubic-bezier(0.62, 0.28, 0.23, 0.99) both;
animation: gradient 20s infinite cubic-bezier(0.62, 0.28, 0.23, 0.99) both;
}
.c-kv__wrap {
position: relative;
display: flex;
align-items: center;
height: 100%;
z-index: 2;
}
.c-kv__wrap-company {
align-items: unset;
padding-top: 7%;
}
.c-kv__inner {
margin-top: -4%;
height: auto;
}
.c-kv__heading {
margin-bottom: clamp(0.938rem, 0.833rem + 0.52vw, 1.25rem);
line-height: 1;
}
@media screen and (max-width: 767px) {
.c-kv__heading {
text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}
}
.c-kv__heading--01 {
font-size: clamp(1.5rem, 1.125rem + 1.88vw, 2.625rem);
font-weight: 600;
}
.c-kv__heading--01-black {
color: #000000;
}
.c-kv__heading-en {
display: block;
margin-bottom: clamp(0.313rem, 1.56vw, 1.25rem);
color: #c5a76e;
font-size: clamp(1rem, 0.833rem + 0.83vw, 1.5rem);
font-weight: 600;
line-height: 1;
}
.c-kv__heading-cat {
display: block;
margin-bottom: clamp(0.313rem, 1.56vw, 1.25rem);
color: #ffffff;
font-size: clamp(1rem, 0.833rem + 0.83vw, 1.5rem);
font-weight: 600;
line-height: 1;
}
.c-kv__category {
font-size: clamp(0.938rem, 0.875rem + 0.31vw, 1.125rem);
font-weight: 500;
color: #006837;
background-color: #00ff00;
padding: 5px clamp(1.25rem, 0.833rem + 2.08vw, 2.5rem);
margin-right: 40px;
border-radius: 9999px;
}
@media screen and (max-width: 911px) {
.c-kv__category {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
margin-right: 10px;
}
}
.c-kv__date {
font-size: clamp(0.813rem, 0.708rem + 0.52vw, 1.125rem);
font-weight: 500;
}
.c-kv__text {
font-size: clamp(0.875rem, 0.75rem + 0.63vw, 1.25rem);
font-weight: 500;
line-height: 1.25;
}
@media screen and (max-width: 767px) {
.c-kv__text {
text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}
}
.c-kv__text-black {
color: #000000;
}
.c-kv-advantage {
position: relative;
background: linear-gradient(to right, #006837, #009245 45%, #00ff00 90%);
}
.c-kv-advantage .c-kv__img {
position: absolute;
bottom: 0;
right: 0;
display: block;
width: auto;
height: 100%;
z-index: 1;
}
@media screen and (max-width: 767px) {
.c-kv-advantage .c-kv__img {
display: flex;
justify-content: flex-end;
align-items: center;
overflow: hidden;
}
}
.c-kv-advantage .c-kv__img img {
display: block;
height: 100%;
width: auto;
}
@media screen and (max-width: 767px) {
.c-kv-advantage .c-kv__img img {
height: 100%;
max-width: unset;
width: auto;
}
}
@media screen and (max-width: 540px) {
.c-kv-advantage .c-kv__img img {
transform: translateX(15%);
}
}
.c-kv-company {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_company.jpg);
}
.c-kv-profile {
position: relative;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_profile-1.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: 80% 50%;
overflow: hidden;
}
.c-kv-message {
position: relative;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_message.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
}
.c-kv-philosophy {
position: relative;
width: 100%;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_philosophy.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
}
.c-kv-financial {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_financial.png);
}
.c-kv-funding {
top: 0;
left: 0;
background-size: cover;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_bg_funding.png);
}
.c-kv-funding .c-kv__img {
position: absolute;
bottom: 0;
right: 0;
display: block;
width: auto;
height: 100%;
z-index: 1;
}
@media screen and (max-width: 767px) {
.c-kv-funding .c-kv__img {
display: flex;
justify-content: flex-end;
align-items: center;
overflow: hidden;
}
}
.c-kv-funding .c-kv__img img {
display: block;
height: 100%;
width: auto;
}
@media screen and (max-width: 767px) {
.c-kv-funding .c-kv__img img {
height: 100%;
max-width: unset;
width: auto;
}
}
@media screen and (max-width: 540px) {
.c-kv-funding .c-kv__img img {
transform: translateX(15%);
}
}
.c-kv-turnaround {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/kv_turnaround_00.png);
}
.c-kv-speedy {
position: relative;
background: linear-gradient(to right, #006837, #009245 45%, #00ff00 90%);
}
.c-kv-speedy .c-kv__img {
position: absolute;
bottom: 0;
right: 0;
display: block;
width: auto;
height: 100%;
z-index: 1;
}
@media screen and (max-width: 767px) {
.c-kv-speedy .c-kv__img {
display: flex;
justify-content: flex-end;
align-items: center;
overflow: hidden;
}
}
.c-kv-speedy .c-kv__img img {
display: block;
width: auto;
height: 100%;
}
@media screen and (max-width: 767px) {
.c-kv-speedy .c-kv__img img {
height: 100%;
max-width: unset;
width: auto;
}
}
@media screen and (max-width: 540px) {
.c-kv-speedy .c-kv__img img {
transform: translateX(15%);
}
}
.c-kv-voice {
display: grid;
grid-template-columns: 1fr;
grid-template-areas: "label" "title";
gap: 20px;
}
.c-kv-voice__title {
grid-area: title;
font-size: clamp(1rem, 0.833rem + 0.83vw, 1.5rem);
font-weight: 600;
line-height: 1;
text-indent: 2rem;
color: #ffffff;
}
.c-kv-voice__label {
grid-area: label;
line-height: 1;
}
.c-post-list__header {
margin-bottom: 30px;
}
.c-post-list__item {
display: grid;
grid-template-columns: 12rem 1fr;
gap: 20px;
padding-bottom: 20px;
margin-bottom: 30px;
border-bottom: 1px solid #000000;
}
@media screen and (max-width: 767px) {
.c-post-list__item {
grid-template-columns: 1fr;
gap: 20px;
margin-bottom: 10px;
}
}
.c-post-list__item-category {
display: flex;
justify-content: flex-start;
align-items: center;
}
.c-post-list__item-category a {
display: block;
padding: 5px 30px;
border: 1px solid #39b54a;
background-color: #39b54a;
color: #ffffff;
font-size: 14px;
border-radius: 9999px;
transition: color 0.3s ease-out, background 0.3s ease-out;
}
.c-post-list__item-category a:hover {
color: #39b54a;
background-color: #ffffff;
}
.c-post-list__item-body {
display: flex;
flex-direction: column;
}
.c-post-list__item-date {
margin-bottom: 10px;
font-size: 12px;
color: #c5a76e;
}
.c-post-list__item-title {
width: 100%;
}
.c-post-list__item-title a {
position: relative;
color: #000000;
width: 100%;
height: 100%;
padding-right: 60px;
font-size: 16px;
display: block;
transition: color 0.3s ease-out;
}
.c-post-list__item-title a span {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 40px;
height: 40px;
padding: 10px;
border-radius: 50%;
vertical-align: middle;
transform: translateY(-50%);
background-color: #c5a76e;
}
.c-post-list__item-title a span img {
display: block;
width: 100%;
height: auto;
transform: translateX(0);
transition: transform 0.3s ease-out;
}
.c-post-list__item-title a:hover {
color: #aaa;
}
.c-post-list__item-title a:hover span img {
transform: translateX(6px);
}
.c-slide {
position: relative;
}
.c-slide__item img {
height: auto;
display: block;
-o-object-fit: cover;
object-fit: cover;
}
.c-slide .slick-dots {
bottom: 40px;
}
.c-slide .slick-dots li button:before {
color: #fff;
opacity: 0.5;
}
.c-slide .slick-dots li.slick-active button:before {
opacity: 1;
}
.c-slide--top .c-slide__item {
position: relative;
width: 100%;
aspect-ratio: 1920/750;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item {
aspect-ratio: 767/900;
}
}
.c-slide--top .c-slide__item-inner {
position: relative;
z-index: 3;
height: 100%;
}
.c-slide--top .c-slide__item-inner .c-slide__item-title {
font-size: 55px;
font-weight: 600;
margin-bottom: 20px;
}
.c-slide--top .c-slide__item-inner .c-slide__item-text {
font-size: 28px;
font-weight: 600;
}
.c-slide--top .c-slide__item-img {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: 1;
}
.c-slide--top .c-slide__item-img img {
display: block;
width: 100%;
height: auto;
transform-origin: left center;
transition: transform 10s linear 0.5s;
}
.c-slide--top .c-slide__item-bg img {
display: block;
width: 100%;
height: auto;
transform-origin: center bottom;
transition: transform 10s linear 0.5s;
}
.c-slide--top .c-slide__item--first {
position: relative;
}
.c-slide--top .c-slide__item--first .c-slide__whiteout {
position: absolute;
inset: 0;
background-color: #ffffff;
opacity: 0;
pointer-events: none;
z-index: 4;
transition: opacity 1.4s ease-in;
}
.c-slide--top .c-slide__item--first .c-slide__whiteout.is-show {
opacity: 1;
}
.c-slide--top .c-slide__item--first .c-slide__item-text {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: 3;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--first .c-slide__item-text {
display: none;
}
}
.c-slide--top .c-slide__item--first .c-slide__item-bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
background-color: #ffffff;
z-index: 2;
}
.c-slide--top .c-slide__item--first .c-slide__item-bg img {
display: block;
width: 100%;
height: auto;
}
.c-slide--top .c-slide__item--first .c-slide__item-bg--video iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
display: block;
border: 0;
-o-object-fit: cover;
object-fit: cover;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
}
.c-slide--top .c-slide__item--first .c-slide__item-bg--video::after {
content: "";
position: absolute;
inset: -1px;
box-shadow: 0 0 0 1px #ffffff inset;
pointer-events: none;
}
.c-slide--top .c-slide__item--second {
display: flex;
justify-content: center;
align-items: center;
}
.c-slide--top .c-slide__item--second .c-slide__item-inner {
padding-top: 4.296875vw;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--second .c-slide__item-inner {
display: none;
}
}
.c-slide--top .c-slide__item--second .c-slide__item-inner .c-slide__item-title {
font-size: clamp(1.875rem, 0.833rem + 2.17vw, 3.438rem);
font-weight: 600;
margin-bottom: clamp(1.25rem, 0.417rem + 1.74vw, 2.5rem);
text-align: center;
line-height: 1;
}
.c-slide--top .c-slide__item--second .c-slide__item-inner .c-slide__item-text {
font-size: clamp(1.125rem, 0.708rem + 0.87vw, 1.75rem);
font-weight: 600;
text-align: center;
}
.c-slide--top .c-slide__item--second .c-slide__item-bg {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
aspect-ratio: 1920/750;
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--second .c-slide__item-bg {
aspect-ratio: 767/900;
}
}
.c-slide--top .c-slide__item--second .c-slide__item-bg img {
display: block;
width: 100%;
height: 100%;
transform-origin: center center;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--second .c-slide__item-img {
display: none;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-bg {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
aspect-ratio: 1920/750;
z-index: 2;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-bg {
aspect-ratio: 767/900;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-bg img {
transform: scale(1.275) translateX(6%);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-bg img {
transform: scale(1) translateX(0);
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container {
position: absolute;
top: 0;
left: 0;
display: flex;
align-items: center;
width: 100%;
height: 100%;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container {
align-items: flex-start;
padding-top: 80px;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner {
position: relative;
display: block;
width: 100%;
max-width: 1280px;
height: auto;
margin-top: -50px;
margin-left: auto;
margin-right: auto;
z-index: 3;
}
@media screen and (max-width: 1400px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner {
padding-left: 60px;
padding-right: 60px;
}
}
@media screen and (max-width: 911px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner {
margin-top: -25px;
}
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner {
margin-top: -50px;
padding-left: 30px;
padding-right: 30px;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-logo {
display: block;
width: 100%;
max-width: clamp(21.563rem, 9.271rem + 25.61vw, 40rem);
height: auto;
margin-bottom: clamp(0.313rem, -1.146rem + 3.04vw, 2.5rem);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-logo {
width: 100%;
max-width: 480px;
margin-bottom: 3%;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-logo img {
display: block;
width: 100%;
height: auto;
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title {
font-size: clamp(1.25rem, 0.5rem + 1.56vw, 2.375rem);
font-weight: 600;
text-align: left;
line-height: 1.4;
margin-bottom: clamp(0.313rem, -0.313rem + 1.3vw, 1.25rem);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title {
font-size: clamp(1.25rem, -0.003rem + 6.26vw, 3rem);
margin-bottom: 30vw;
}
}
@media screen and (max-width: 540px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title {
margin-bottom: 27vw;
}
}
@media screen and (max-width: 450px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title {
margin-bottom: 24vw;
}
}
@media screen and (max-width: 350px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title {
margin-bottom: 20vw;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title-sub {
font-size: clamp(1rem, 0.5rem + 1.04vw, 1.75rem);
font-weight: 600;
color: #c5a76e;
margin-bottom: clamp(0.313rem, -0.313rem + 1.3vw, 1.25rem);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-title-sub {
display: none;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text {
font-size: clamp(0.688rem, 0.479rem + 0.43vw, 1rem);
font-weight: 500;
text-align: left;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text {
display: none;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link {
display: grid;
grid-template-columns: auto 1fr;
gap: 20px;
align-items: center;
margin-top: clamp(0.313rem, -1.979rem + 4.77vw, 3.75rem);
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link-base {
display: inline-block;
font-weight: 500;
font-size: clamp(0.813rem, 0.521rem + 0.61vw, 1.25rem);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link-base {
font-size: clamp(0.688rem, 0.509rem + 0.89vw, 0.938rem);
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link-icon {
display: inline-block;
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
border-radius: 50%;
background-color: #000000;
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link-icon {
width: 20px;
height: 20px;
border: 1px solid #ffffff;
}
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link-icon img {
display: block;
width: 50%;
height: auto;
transition: transform 0.3s ease-out;
}
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link:hover .c-slide__item-text-link-icon img {
transform: translateX(4px);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item--third .c-slide__item-container .c-slide__item-inner .c-slide__item-text-link:hover .c-slide__item-text-link-icon img {
transform: translateX(2px);
}
}
.c-slide--top .c-slide__item.slick-current .c-slide__item-bg img {
transform: scale(1.15);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item.slick-current .c-slide__item-bg img {
transform: scale(1);
}
}
.c-slide--top .c-slide__item.slick-current .c-slide__item-img img {
transform: translateX(15%);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item.slick-current .c-slide__item-img img {
display: none;
}
}
.c-slide--top .c-slide__item.slick-current.c-slide__item--third .c-slide__item-bg img {
transform: scale(1.275) translateX(0);
}
@media screen and (max-width: 767px) {
.c-slide--top .c-slide__item.slick-current.c-slide__item--third .c-slide__item-bg img {
transform: scale(1) translateX(0);
}
}
.c-voice-slider {
width: 100%;
padding: 50px 0;
}
.c-voice-slider__inner {
overflow: visible;
}
.c-voice-slider__list {
margin: 0 -15px;
}
.c-voice-slider__item {
padding: 0 15px;
box-sizing: border-box;
width: 80%;
margin: 0 auto;
}
.c-voice-slider__img {
position: relative;
width: 100%;
aspect-ratio: 16/9;
background-size: cover;
background-position: center;
border-radius: 12px;
overflow: hidden;
transform: scale(1);
transition: transform 0.4s ease;
}
@media screen and (max-width: 767px) {
.c-voice-slider__img {
border-radius: 0;
}
}
.c-voice-slider__overlay {
position: absolute;
inset: 0;
background: radial-gradient(circle, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.3) 100%);
color: #fff;
padding: 80px;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
@media screen and (max-width: 1280px) {
.c-voice-slider__overlay {
padding: 50px;
}
}
@media screen and (max-width: 991px) {
.c-voice-slider__overlay {
padding: 40px;
}
}
@media screen and (max-width: 767px) {
.c-voice-slider__overlay {
padding: 30px;
}
}
@media screen and (max-width: 540px) {
.c-voice-slider__overlay {
padding: 20px;
}
}
.c-voice-slider__title {
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-weight: 600;
margin-bottom: 50px;
}
.c-voice-slider__desc {
width: 50%;
margin-bottom: 30px;
font-size: clamp(1rem, 0.958rem + 0.21vw, 1.125rem);
}
@media screen and (max-width: 1280px) {
.c-voice-slider__desc {
width: 65%;
}
}
@media screen and (max-width: 991px) {
.c-voice-slider__desc {
width: 75%;
}
}
@media screen and (max-width: 767px) {
.c-voice-slider__desc {
width: 100%;
}
}
.c-voice-slider__service {
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding: 10px 20px;
font-size: 16px;
font-weight: 500;
background-color: #006837;
color: #00ff00;
text-align: center;
border-radius: 9999px;
}
.c-voice-slider__btn {
position: absolute;
right: 80px;
bottom: 80px;
display: block;
}
.c-voice-slider__btn-link {
position: relative;
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
padding-right: 30px;
color: #ffffff;
font-size: clamp(1rem, 0.958rem + 0.21vw, 1.125rem);
font-weight: 500;
text-align: right;
}
.c-voice-slider__btn-link::before {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 20px;
height: 20px;
transform: translateY(-50%);
background-color: #ffffff;
border-radius: 50%;
content: "";
}
.c-voice-slider__btn-link::after {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 20px;
height: 20px;
transform: translateY(-50%);
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/arrow-black.svg);
background-repeat: no-repeat;
background-position: center center;
background-size: 65% 65%;
content: "";
transition: transform 0.3s ease-out;
}
.c-voice-slider__btn-link:hover::after {
transform: translateX(3px) translateY(-50%);
}
.c-voice-slider .slick-list {
overflow: visible !important;
}
.slick-center .c-voice-slider__img {
transform: scale(1);
}
.c-slide--voice .slick-dots {
bottom: -10px;
}
.js-slick-fade {
opacity: 0;
visibility: hidden;
}
.slick-list {
overflow: hidden;
}
.slick-track {
will-change: transform;
}
.slick-slide {
outline: none;
}
.js-fade-text {
display: inline-block;
white-space: pre-wrap;
word-break: break-word;
overflow-wrap: break-word;
line-height: 2;
margin-bottom: clamp(0.938rem, 0.266rem + 3.36vw, 1.875rem);
}
.js-fade-text__char {
display: inline-block;
opacity: 0;
transform: translateY(2px);
}
.c-rotating-animation {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: calc(100% - 400px);
height: auto;
margin-left: auto;
margin-right: auto;
aspect-ratio: 1/1;
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/diagram_base.svg);
}
@media screen and (max-width: 911px) {
.c-rotating-animation {
width: calc(100% - 300px);
}
}
@media screen and (max-width: 767px) {
.c-rotating-animation {
width: 100%;
max-width: 408px;
margin-bottom: 40px;
}
}
.c-rotating-animation__part {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
visibility: hidden;
opacity: 0;
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center center;
transition: opacity 0.6s ease, visibility 0.6s ease;
}
.c-rotating-animation__part--first {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/diagram_01.svg);
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.c-rotating-animation__part--second {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/diagram_02.svg);
-webkit-animation-delay: 5s;
animation-delay: 5s;
}
.c-rotating-animation__part--third {
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/diagram_03.svg);
-webkit-animation-delay: 10s;
animation-delay: 10s;
}
.c-rotating-animation__part.is-active {
opacity: 1;
visibility: visible;
}
.c-rotating-animation__title {
padding-top: 15%;
padding-left: 8%;
font-size: 28px;
font-weight: 500;
text-align: center;
}
.c-rotating-animation .c-rot-trigger {
position: absolute;
display: block;
width: 200px;
height: 200px;
z-index: 99;
}
.c-rotating-animation .c-rot-trigger--01 {
top: 0;
left: 50%;
transform: translateX(-50%);
}
.c-rotating-animation .c-rot-trigger--02 {
top: 60%;
right: 0;
}
.c-rotating-animation .c-rot-trigger--03 {
top: 60%;
left: 0;
}
.c-rot-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
display: block;
width: 60px;
height: 60px;
}
.c-rot-arrow--prev {
left: -50px;
}
.c-rot-arrow--next {
right: -50px;
}
.slick-dots li {
transition: width 0.3s ease-out;
width: 10px;
height: 10px;
}
.slick-dots li button {
width: 10px;
height: 10px;
border-radius: 9999px;
background-color: #8cc63f;
}
.slick-dots li button::before {
display: none;
}
.slick-dots li.slick-active {
width: 70px;
}
.slick-dots li.slick-active button {
background-color: #8cc63f;
width: 70px;
}
.slick-dotted.slick-slider {
margin-bottom: 0;
}
.slick-arrow {
position: absolute;
display: block;
width: 40px;
height: 40px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
z-index: 50;
}
@media screen and (max-width: 767px) {
.slick-arrow {
display: none;
opacity: 0;
width: 0;
height: 0;
}
}
.slick-arrow.slick-prev {
left: 20px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_slide-arrow-left.svg);
}
.slick-arrow.slick-prev::before {
display: none;
}
.slick-arrow.slick-next {
right: 20px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_slide-arrow-right.svg);
}
.slick-arrow.slick-next::before {
display: none;
}
.c-slide--voice .slick-arrow.slick-prev {
left: 0;
}
.c-slide--voice .slick-arrow.slick-next {
right: 0;
}
.p-single {
width: 100%;
padding-top: 100px;
padding-bottom: 100px;
background-color: #e6e6e6;
}
.p-single-wrapper {
gap: 30px;
}
.p-single__body h2 {
font-size: clamp(1.625rem, 1.375rem + 1.25vw, 2.375rem);
font-weight: 600;
margin-bottom: 40px;
}
.p-single__body h3 {
font-size: clamp(1.25rem, 1.167rem + 0.42vw, 1.5rem);
font-weight: 500;
margin-bottom: 30px;
}
.p-single__body h4 {
font-size: clamp(1.125rem, 1.042rem + 0.42vw, 1.375rem);
font-weight: 400;
margin-bottom: 20px;
color: #39b54a;
}
.p-single__body h5 {
font-size: 18px;
font-weight: 500;
margin-bottom: 20px;
}
.p-single__body p {
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
margin-bottom: 30px;
}
.p-single__body ul {
margin-left: 2rem;
margin-bottom: 30px;
list-style-type: disc;
}
.p-single__body ul li {
font-size: clamp(0.875rem, 0.854rem + 0.1vw, 0.938rem);
margin-bottom: 7px;
}
.p-single__body figure {
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
}
.p-single__body figure figcaption {
display: block;
margin-top: 10px;
margin-bottom: 50px;
color: #999;
font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
font-weight: 500;
font-style: italic;
text-align: right;
}
.p-single__body blockquote {
position: relative;
display: block;
width: 100%;
padding: 40px 60px 30px;
margin-bottom: 30px;
border-radius: 20px;
background-color: #ffffff;
}
.p-single__body blockquote p {
margin-bottom: 0;
color: #999;
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
font-style: italic;
line-height: 1.8;
}
.p-single__body blockquote p span.c-quote__source {
display: block;
margin-top: 20px;
font-size: clamp(0.75rem, 0.708rem + 0.21vw, 0.875rem);
font-weight: 500;
text-align: right;
}
.p-single__body blockquote::before {
content: "";
position: absolute;
top: 20px;
left: 40px;
display: block;
width: 20px;
height: 20px;
background-image: url(//www.rearth-tokyo.co.jp/wp-content/uploads/icon_quotation-gray.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.p-single-voice {
padding-top: 60px;
padding-bottom: 0;
}
.p-single-voice .p-single__body {
padding: 50px 60px;
background-color: #ffffff;
border-radius: 10px;
}
@media screen and (max-width: 767px) {
.p-single-voice .p-single__body {
padding: 50px 40px;
}
}
@media screen and (max-width: 540px) {
.p-single-voice .p-single__body {
padding: 50px 20px;
}
}
.p-single-voice .p-single__body-title {
font-size: clamp(1.25rem, 1.083rem + 0.83vw, 1.75rem);
font-weight: 600;
margin-bottom: 40px;
}
.p-single-voice .p-voice__meta {
display: grid;
grid-template-columns: 1fr;
gap: 25px;
margin-bottom: 50px;
margin-top: 100px;
}
.p-single-voice .p-voice__meta-wrap {
display: block;
}
.p-single-voice .p-voice__meta-wrap .p-voice__meta-data {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.p-single-voice .p-voice__meta-wrap .p-voice__meta-data span {
display: inline-block;
padding: 10px 15px;
margin-right: 10px;
color: #ffffff;
font-weight: 500;
border-radius: 9999px;
}
.p-single-voice .p-voice__meta-wrap:nth-of-type(1) .p-voice__meta-data span {
background-color: #39b54a;
}
@media screen and (max-width: 767px) {
.p-single-voice .p-voice__meta-wrap:nth-of-type(2) .p-voice__meta-data {
overflow-x: hidden;
}
}
.p-single-voice .p-voice__meta-wrap:nth-of-type(2) .p-voice__meta-data span {
background-color: #006837;
}
@media screen and (max-width: 767px) {
.p-single-voice .p-voice__meta-wrap:nth-of-type(2) .p-voice__meta-data span {
white-space: nowrap;
}
}
.p-single-voice .p-voice__meta-row {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
align-items: center;
gap: 20px;
width: 100%;
margin-bottom: 20px;
}
.p-single-voice .p-voice__meta-row span {
display: inline-block;
padding: 10px 20px;
margin-right: 10px;
background-color: #006837;
color: #00ff00;
font-size: 14px;
font-weight: 500;
border-radius: 9999px;
}
.p-single-voice .p-voice__meta-title {
padding-top: 10px;
padding-bottom: 10px;
color: #000000;
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
font-weight: 600;
}
@media screen and (max-width: 767px) {
.p-single-voice .p-voice__meta-title {
padding-top: 0;
padding-bottom: 0;
}
}
.p-single-voice .p-voice__meta-data {
font-weight: 500;
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
}
.p-single-voice .p-voice__content {
position: relative;
padding: 20px 0 80px;
}
.p-single-voice .p-voice__content h2 {
font-size: clamp(1.625rem, 1.167rem + 2.29vw, 3rem);
font-weight: 600;
margin-bottom: 50px;
}
.p-single-voice .p-voice__content h3 {
position: relative;
margin-top: 80px;
padding-left: 50px;
margin-bottom: 30px;
color: #009245;
font-size: clamp(1rem, 0.833rem + 0.83vw, 1.5rem);
font-weight: 500;
}
.p-single-voice .p-voice__content h3::before {
content: "";
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
width: 40px;
height: 2px;
background-color: #009245;
}
.p-single-voice .p-voice__content p {
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
margin-bottom: 30px;
}
.p-single-voice .p-voice__content-bubble {
position: relative;
background-color: #f2f2f2;
padding: 50px 50px 20px;
border-radius: 20px;
width: 100%;
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
font-weight: 500;
line-height: 1.4;
}
@media screen and (max-width: 767px) {
.p-single-voice .p-voice__content-bubble {
padding: 30px 30px 10px;
}
}
.p-single-voice .p-voice__content-bubble-mouse {
position: absolute;
bottom: -59px;
left: 50%;
transform: translateX(-50%);
width: 80px;
height: 60px;
}
.p-single-voice .p-voice__content-bubble-mouse img {
display: block;
width: 100%;
height: auto;
}
.p-single-voice .p-voice__content-people {
position: absolute;
bottom: 0;
right: 0;
width: 150px;
height: auto;
}
.p-single__thumbnail {
width: 100%;
margin-bottom: 50px;
border-radius: 20px;
overflow: hidden;
}
.p-single__thumbnail img {
display: block;
width: 100%;
}
.p-single__sidebar {
width: 100%;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
background-color: #ffffff;
border-radius: 10px;
}
.p-page {
background-color: #e6e6e6;
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-page__body {
padding: clamp(2.5rem, 1.667rem + 4.17vw, 5rem) clamp(1.25rem, 0.417rem + 4.17vw, 3.75rem);
background-color: #ffffff;
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
border-radius: 10px;
}
.p-page-funding {
background-color: #ffffff;
padding-top: unset;
padding-bottom: unset;
}
@media screen and (max-width: 911px) {
.p-page-funding {
display: flex;
justify-content: center;
}
}
.p-page-funding .p-page__body {
border-radius: unset;
background-color: unset;
}
@media screen and (max-width: 911px) {
.p-page-funding .p-page__body {
padding: 20px 20px 40px;
}
}
.p-page-funding .p-page__body ul {
margin-bottom: 20px;
}
.p-page-funding .p-page__body ul li {
position: relative;
margin-bottom: 12px;
padding-left: 3rem;
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 400;
line-height: 1.8;
}
.p-page-funding .p-page__body ul li::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 30px;
height: 26px;
content: "";
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_check_white.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.p-page-funding .p-page__body ul li > ul.list-disc {
margin-top: 20px;
list-style-type: disc;
margin-left: 1rem;
}
.p-page-funding .p-page__body ul li > ul.list-disc > li {
padding-left: 0;
}
.p-page-funding .p-page__body ul li > ul.list-disc > li::before {
display: none;
}
.p-page h2 {
font-size: clamp(1.375rem, 1.25rem + 0.63vw, 1.75rem);
font-weight: 600;
line-height: 1.1;
margin-top: clamp(2.5rem, 2.292rem + 1.04vw, 3.125rem);
padding-bottom: clamp(0.625rem, 0.521rem + 0.52vw, 0.938rem);
margin-bottom: clamp(0.938rem, 0.625rem + 1.56vw, 1.875rem);
border-bottom: 1px solid #000000;
}
.p-page h3 {
font-size: clamp(1.188rem, 1.104rem + 0.42vw, 1.438rem);
font-weight: 400;
margin-bottom: 20px;
margin-top: 20px;
}
.p-page p {
font-size: clamp(0.875rem, 0.833rem + 0.21vw, 1rem);
font-weight: 500;
margin-bottom: 20px;
line-height: 1.8;
}
.p-page ul {
margin-bottom: 30px;
}
.p-page ul li {
position: relative;
margin-bottom: 10px;
padding-left: 2rem;
font-size: 14px;
font-weight: 400;
line-height: 1.6;
}
.p-page ul li::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 23px;
height: 24px;
content: "";
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_check.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.p-page ul li > ul.list-disc {
margin-top: 20px;
list-style-type: disc;
margin-left: 1rem;
}
.p-page ul li > ul.list-disc > li {
padding-left: 0;
}
.p-page ul li > ul.list-disc > li::before {
display: none;
}
.p-page ul.list--disc {
list-style: disc;
margin-left: 1rem;
}
.p-page ul.list--disc > li {
padding-left: 0;
}
.p-page ul.list--disc > li::before {
display: none;
}
.p-page a {
display: inline-block;
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
transition: color 0.3s ease-out;
}
.p-page a.with-arrow {
position: relative;
padding-right: 35px;
}
.p-page a.with-arrow::after {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 20px;
height: 20px;
transform: translateY(-50%);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/icon_arrow-black.svg);
transition: transform 0.3s ease-out;
content: "";
}
.p-page a:hover {
color: #aaa;
}
.p-page a:hover.with-arrow::after {
transform: translateY(-50%) translateX(5px);
}
.p-top-advantage {
gap: 50px;
}
@media screen and (max-width: 911px) {
.p-top-advantage {
grid-template-columns: repeat(3, 1fr);
gap: 10px;
}
}
@media screen and (max-width: 767px) {
.p-top-advantage {
grid-template-columns: 1fr;
gap: 30px;
}
}
.p-top-advantage__item {
opacity: 0;
transform: translateY(100px);
}
.p-advantage-lead {
position: relative;
width: 100%;
height: auto;
margin-left: auto;
margin-right: auto;
padding-top: 100px;
padding-bottom: 100px;
background-color: #39b54a;
}
.p-advantage-lead__background {
position: absolute;
top: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100vh;
transform: scale(1);
border-radius: 0;
z-index: 3;
}
.p-advantage-lead__background img {
display: block;
width: 100%;
max-width: 900px;
height: auto;
}
.p-advantage-lead__overlay {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
transition: background 0.8s ease-out;
will-change: background;
z-index: 4;
}
.p-advantage-lead__body {
position: relative;
z-index: 5;
color: #ffffff;
}
.p-advantage-consulting {
padding-top: 60px;
padding-bottom: 60px;
padding-bottom: 100px;
background-color: #e6e6e6;
}
.p-advantage-attitude-link {
display: flex;
align-items: center;
width: 100%;
aspect-ratio: 192/52;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_advantage005.png);
}
@media screen and (max-width: 1280px) {
.p-advantage-attitude-link {
aspect-ratio: 192/77;
}
}
@media screen and (max-width: 767px) {
.p-advantage-attitude-link {
aspect-ratio: 192/100;
}
}
@media screen and (max-width: 767px) {
.p-advantage-attitude-link {
aspect-ratio: 192/120;
}
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__title {
margin-bottom: 40px;
line-height: 1.35;
font-size: clamp(1.25rem, 0.792rem + 2.29vw, 2.625rem);
font-weight: 600;
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__title-en {
display: block;
font-size: clamp(0.938rem, 0.833rem + 0.52vw, 1.25rem);
font-weight: 500;
color: #c5a76e;
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__link {
position: relative;
display: block;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-size: 14px;
font-weight: 500;
transition: color 0.3s ease-out;
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__link::before {
position: absolute;
top: 5px;
right: -35px;
display: block;
width: 10px;
height: 10px;
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/arrow-black.svg);
transition: transform 0.3s ease-out;
z-index: 99;
content: "";
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__link::after {
position: absolute;
top: 0;
right: -40px;
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #ffffff;
z-index: 10;
content: "";
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__link:hover {
color: #aaa;
}
.p-advantage-attitude-link--inner .p-advantage-attitude-link__link:hover::before {
transform: translateX(4px);
}
.p-profile {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #e6e6e6;
}
.p-message {
background-color: #f2f2f2;
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-philosophy {
color: #ffffff;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/bg_philosophy_lg2.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom center;
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-philosophy__title {
margin-bottom: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
font-size: clamp(1.375rem, 1.104rem + 1.35vw, 2.188rem);
font-weight: 600;
text-align: center;
}
.p-financial-lead {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #009245;
color: #ffffff;
line-height: 2;
}
.p-financial-help {
padding-top: clamp(1.875rem, 0.833rem + 5.21vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-financial-faq {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #f2f2f2;
}
.p-funding-lead {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-funding-merit {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #e6e6e6;
}
.p-funding-merit-title {
margin-bottom: 60px;
}
@media screen and (max-width: 911px) {
.p-funding-merit-title {
margin-bottom: 50px;
}
}
@media screen and (max-width: 767px) {
.p-funding-merit-title {
margin-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
.p-funding-merit-title {
margin-bottom: 30px;
}
}
.p-funding-qa {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #39b54a;
}
.p-turnaround-wrapper {
position: relative;
}
.p-turnaround__background {
position: absolute;
display: block;
width: 100%;
height: 100%;
z-index: 5;
}
.p-turnaround__background img {
position: -webkit-sticky;
position: sticky;
top: 93px;
left: 0;
display: block;
width: 100%;
height: auto;
}
@media screen and (max-width: 767px) {
.p-turnaround__background img {
top: 80px;
}
}
.p-turnaround-lead {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #39b54a;
}
.p-turnaround-lead--inner {
position: relative;
z-index: 10;
}
.p-turnaround-process {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-turnaround-process--inner {
position: relative;
z-index: 10;
}
.p-turnaround-description {
position: relative;
width: 600px;
z-index: 10;
}
.p-turnaround-description-wrap {
position: relative;
display: none;
opacity: 0;
transition: opacity 0.4s ease-out 0.5s;
}
.p-turnaround-description-wrap.is-active {
display: block;
opacity: 1;
}
.p-turnaround-faq {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #f2f2f2;
}
.p-speedy-point {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-speedy-lead {
position: relative;
padding-top: 100px;
padding-bottom: 100px;
background-color: #39b54a;
}
@media screen and (max-width: 911px) {
.p-speedy-lead {
padding-top: 60px;
padding-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.p-speedy-lead {
padding-top: 40px;
padding-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
.p-speedy-lead {
padding-top: 30px;
padding-bottom: 30px;
}
}
.p-speedy-lead__title {
margin-bottom: clamp(1.25rem, 0.803rem + 2.24vw, 1.875rem);
font-size: clamp(1.375rem, 1.017rem + 1.79vw, 1.875rem);
font-weight: 600;
}
.p-speedy-lead__text {
margin-bottom: clamp(1.25rem, 0.803rem + 2.24vw, 1.875rem);
font-size: clamp(0.938rem, 0.893rem + 0.22vw, 1rem);
font-weight: 500;
}
.p-speedy-business-plan {
padding-top: 110px;
padding-bottom: 110px;
background-color: #ffffff;
}
@media screen and (max-width: 911px) {
.p-speedy-business-plan {
padding-top: 60px;
padding-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.p-speedy-business-plan {
padding-top: 40px;
padding-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
.p-speedy-business-plan {
padding-top: 30px;
padding-bottom: 30px;
}
}
.p-speedy-business-plan--inner {
gap: 40px;
margin-bottom: 60px;
}
@media screen and (max-width: 767px) {
.p-speedy-business-plan--inner {
gap: 20px;
margin-bottom: 40px;
}
}
@media screen and (max-width: 767px) {
.p-speedy-business-plan--inner {
margin-bottom: 30px;
}
}
.p-category {
background-color: #e6e6e6;
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-category-wrapper {
gap: 30px;
}
.p-archive {
background-color: #e6e6e6;
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
}
.p-archive-wrapper {
gap: 30px;
}
.p-archive-search {
padding-top: 50px;
}
.p-archive-search .c-card-voice {
margin-top: 0;
}
.p-qa {
padding-top: clamp(2.5rem, 1.667rem + 4.17vw, 5rem);
padding-bottom: clamp(3.125rem, 2.083rem + 5.21vw, 6.25rem);
background-color: #e6e6e6;
}
.p-qa__heading {
text-align: center;
padding-bottom: 15px;
margin-bottom: 50px;
border-bottom: 1px solid #000000;
}
@media screen and (max-width: 1280px) {
.p-qa__heading {
padding-bottom: 10px;
margin-bottom: 20px;
}
}
.p-company-links {
padding-top: 100px;
padding-bottom: 100px;
background-color: #f2f2f2;
}
@media screen and (max-width: 911px) {
.p-company-links {
padding-top: 60px;
padding-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.p-company-links {
padding-top: 40px;
padding-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
.p-company-links {
padding-top: 30px;
padding-bottom: 30px;
}
}
.p-company-links.p-company-links-legal {
background-color: #ccc;
padding-top: 100px;
padding-bottom: 100px;
}
.p-company-links.p-company-links-legal .p-company-links__item {
background-color: #ffffff;
}
.p-company-links__item {
display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
}
.p-company-links__title {
margin-bottom: 10px;
font-size: clamp(1.25rem, 0.63rem + 1.09vw, 1.5rem);
font-weight: 600;
text-align: center;
}
.p-company-links__title-en {
display: block;
margin-bottom: 5px;
line-height: 1;
color: #00ff00;
font-size: clamp(1rem, 0.69rem + 0.54vw, 1.125rem);
}
.p-company-links__title-main {
margin-bottom: 30px;
font-weight: 600;
text-align: center;
font-size: clamp(1.125rem, 0.917rem + 1.04vw, 1.75rem);
}
.p-company-links__img {
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 20px;
width: 100%;
max-width: 110px;
}
.p-company-links__text-with-arrow {
position: relative;
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
font-size: 14px;
font-weight: 500;
margin-right: auto;
margin-left: auto;
transition: transform 0.3s ease-out;
}
.p-company-links__text-with-arrow::before {
position: absolute;
top: 0;
right: -40px;
display: block;
width: 20px;
height: 20px;
padding: 10px;
background-repeat: no-repeat;
background-position: center;
background-size: 10px 10px;
background-image: url(https://www.rearth-tokyo.co.jp/wp-content/uploads/arrow-white.svg);
transition: transform 0.3s ease-out;
z-index: 3;
content: "";
}
.p-company-links__text-with-arrow::after {
position: absolute;
top: 0;
right: -40px;
display: block;
width: 20px;
height: 20px;
background-color: #000000;
border-radius: 50%;
z-index: 2;
content: "";
}
.p-company-links__link {
display: block;
width: 100%;
height: 100%;
padding-top: 30px;
padding-bottom: 30px;
border-radius: 10px;
box-shadow: 1px 1px 9px rgba(0, 0, 0, 0.2), -1px -1px 9px rgba(0, 0, 0, 0.2);
}
.p-company-links__link:hover .p-company-links__text-with-arrow {
color: #aaa;
}
.p-company-links__link:hover .p-company-links__text-with-arrow::before {
transform: translateX(4px);
}
.p-stance-block img {
display: block;
margin-top: 100px;
margin-left: auto;
margin-right: auto;
width: 140px;
height: auto;
}
.p-stance-block p {
font-size: 16px;
font-weight: 500;
text-align: center;
}
.p-stance-modal {
padding-top: 80px;
padding-bottom: 80px;
background-color: #e6e6e6;
}
@media screen and (max-width: 911px) {
.p-stance-modal {
padding-top: 60px;
padding-bottom: 60px;
}
}
@media screen and (max-width: 767px) {
.p-stance-modal {
padding-top: 40px;
padding-bottom: 40px;
}
}
.p-about {
width: 100%;
height: calc(100vh - 120px);
}
.p-about-kv {
position: relative;
display: block;
width: 100%;
height: 100%;
}
.p-about-kv.reveal-mask .kv-movie {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
inset: 0;
z-index: 0;
overflow: hidden;
}
.p-about-kv.reveal-mask .kv-movie iframe {
position: absolute !important;
top: 0 !important;
left: 50% !important;
transform: translateX(-50%);
width: 100vw;
height: 56.25vw;
min-width: 100%;
min-height: 100%;
inset: 0;
display: block;
margin-left: auto;
margin-right: auto;
z-index: 0;
}
.p-about-kv.reveal-mask .kv-movie.adjust-height iframe {
height: 100vh !important;
width: 177.78vh !important;
}
.p-about-kv.reveal-mask .kv-movie .kv-movie-overlay {
background-color: #000;
position: absolute;
inset: 0;
z-index: -1;
}
.p-about-kv.reveal-mask .kv-inner {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
gap: 30px;
z-index: 8;
}
.p-about-kv.reveal-mask .kv-inner .kv-title {
color: #ffffff;
font-size: clamp(1.5rem, 0.896rem + 3.02vw, 3.313rem);
font-family: "Noto Serif JP", serif;
font-weight: 600;
text-align: center;
text-shadow: 0.6px 0.6px 0 #000, -0.2px -0.2px 0 #000;
opacity: 0;
-webkit-animation: fadeIn 1s ease-in-out 0.5s forwards;
animation: fadeIn 1s ease-in-out 0.5s forwards;
}
.p-about-kv.reveal-mask .kv-inner .kv-description {
color: #c7b299;
font-weight: 500;
font-family: "Noto Serif JP", serif;
text-align: center;
text-shadow: 0.6px 0.6px 0 #000, -0.2px -0.2px 0 #000;
font-weight: 600;
opacity: 0;
-webkit-animation: fadeIn 1s ease-in-out 0.8s forwards;
animation: fadeIn 1s ease-in-out 0.8s forwards;
}
.p-about-vision {
position: relative;
width: 100%;
height: auto;
padding-top: 140px;
padding-bottom: 140px;
background-color: #000;
overflow: hidden;
z-index: 2;
}
.p-about-vision .vision-bg-img {
position: absolute;
top: 130px;
left: 0;
display: block;
width: 100%;
height: auto;
z-index: 1;
}
.p-about-vision .vision-inner {
position: relative;
inset: 0;
font-family: "Noto Serif JP", serif;
color: #ffffff;
z-index: 5;
}
.p-about-vision .vision-title {
margin-bottom: 40px;
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-weight: 600;
text-align: center;
}
.p-about-vision .vision-grid {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
}
.p-about-vision .vision-grid p {
font-weight: 500;
}
.p-about-main {
position: relative;
padding-top: 100px;
padding-bottom: 100px;
}
@media screen and (max-width: 767px) {
.p-about-main {
display: grid;
grid-template-columns: 1fr;
gap: 20px;
padding-bottom: 42.8571428571vw;
}
}
.p-about-main .main-title {
color: #006837;
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-weight: 600;
margin-bottom: 40px;
font-family: "Noto Serif JP", serif;
}
.p-about-main .main-content-wrap {
display: grid;
grid-template-columns: 1fr;
gap: 30px;
font-weight: 500;
font-family: "Noto Serif JP", serif;
}
.p-about-main .main-content-wrap P {
font-size: clamp(1rem, 0.911rem + 0.45vw, 1.125rem);
}
.p-about-main .main-content-wrap P .js-fade-text {
line-height: 1.5;
margin-bottom: 0;
}
.p-about-main .main-bg-img {
position: absolute;
bottom: 0;
right: 5%;
width: 40%;
aspect-ratio: 350/300;
}
@media screen and (max-width: 1280px) {
.p-about-main .main-bg-img {
right: 0;
width: 50%;
}
}
@media screen and (max-width: 991px) {
.p-about-main .main-bg-img {
right: 0;
width: 45%;
}
}
@media screen and (max-width: 767px) {
.p-about-main .main-bg-img {
padding-bottom: 1.7142857143vw;
right: 50%;
transform: translateX(50%);
width: 50%;
}
}
.p-about-main .main-bg-img img {
display: block;
width: 100%;
height: auto;
}
.p-about-feature {
padding-top: 100px;
padding-bottom: 100px;
background-color: #000000;
color: #ffffff;
font-family: "Noto Serif JP", serif;
}
.p-about-feature .feature-title {
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-weight: 600;
margin-bottom: 40px;
}
.p-about-feature .feature-wrap {
display: grid;
grid-template-columns: 1fr;
gap: 100px;
}
.p-about-feature .feature-wrap .feature-item {
display: grid;
grid-template-columns: 1fr 50%;
grid-template-areas: "img content";
gap: 50px;
}
@media screen and (max-width: 767px) {
.p-about-feature .feature-wrap .feature-item {
grid-template-columns: 1fr;
grid-template-areas: "img" "content";
gap: 30px;
}
}
.p-about-feature .feature-wrap .feature-item:nth-of-type(even) {
grid-template-columns: 50% 1fr;
grid-template-areas: "content img";
}
@media screen and (max-width: 767px) {
.p-about-feature .feature-wrap .feature-item:nth-of-type(even) {
grid-template-columns: 1fr;
grid-template-areas: "img" "content";
gap: 30px;
}
}
.p-about-feature .feature-wrap .feature-item .item__img {
width: 100%;
height: auto;
border-radius: 10px;
overflow: hidden;
grid-area: img;
}
.p-about-feature .feature-wrap .feature-item .item__img img {
display: block;
width: 100%;
height: auto;
}
.p-about-feature .feature-wrap .feature-item .item__content {
grid-area: content;
}
.p-about-feature .feature-wrap .feature-item .item__content .item__title {
margin-bottom: 30px;
font-size: clamp(1.125rem, 0.875rem + 1.25vw, 1.875rem);
font-weight: 600;
line-height: 1.35;
}
.p-about-feature .feature-wrap .feature-item .item__content .item__text {
font-size: 16px;
font-weight: 500;
}
.p-about-chance {
position: relative;
width: 100%;
background-color: #000000;
aspect-ratio: 1920/1186;
}
.p-about-chance .chance-wrap {
position: relative;
display: flex;
justify-content: flex-end;
align-items: center;
height: 100%;
color: #ffffff;
z-index: 1;
}
.p-about-chance .chance-wrap .chance-inner {
display: block;
width: 40%;
height: auto;
margin-top: 15%;
}
@media screen and (max-width: 1280px) {
.p-about-chance .chance-wrap .chance-inner {
width: 50%;
margin-top: 10%;
}
}
@media screen and (max-width: 991px) {
.p-about-chance .chance-wrap .chance-inner {
width: 60%;
margin-top: 5%;
}
}
@media screen and (max-width: 911px) {
.p-about-chance .chance-wrap .chance-inner {
width: 80%;
margin-top: 5%;
}
}
@media screen and (max-width: 767px) {
.p-about-chance .chance-wrap .chance-inner {
width: 100%;
margin-top: 0;
}
}
.p-about-chance .chance-wrap .chance-title {
margin-bottom: 20px;
font-size: clamp(1.375rem, 1.042rem + 1.67vw, 2.375rem);
font-family: "Noto Serif JP", serif;
font-weight: 600;
text-shadow: 0.6px 0.6px 0 #000, -0.2px -0.2px 0 #000;
}
.p-about-chance .chance-wrap .chance-text {
text-shadow: 0.6px 0.6px 0 #000, -0.2px -0.2px 0 #000;
font-weight: 500;
font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);
}
.p-about-chance .chance-bg-img {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: auto;
}
.p-about-chance .chance-bg-img img {
display: block;
width: 100%;
height: auto;
}
.p-home {
background-color: #e6e6e6;
padding-top: 100px;
padding-bottom: 100px;
}
.p-home-wrap {
width: 100%;
}
.p-home__body {
width: 100%;
}
@-webkit-keyframes float-text-scroll {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-100%);
}
}
@keyframes float-text-scroll {
0% {
transform: translateX(0%);
}
100% {
transform: translateX(-100%);
}
}
@-webkit-keyframes fadeLoop {
0% {
opacity: 0;
}
10% {
opacity: 1;
}
30% {
opacity: 1;
}
40% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes fadeLoop {
0% {
opacity: 0;
}
10% {
opacity: 1;
}
30% {
opacity: 1;
}
40% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
@keyframes gradient {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.u-pb--200 {
margin-bottom: clamp(3.125rem, 1.25rem + 9.38vw, 12.5rem);
}
.u-pb--150 {
margin-bottom: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-pb--120 {
margin-bottom: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-pb--100 {
margin-bottom: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-pb--90 {
margin-bottom: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-pb--80 {
margin-bottom: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-pb--70 {
margin-bottom: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-pb--60 {
margin-bottom: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-pb--50 {
margin-bottom: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-pb--40 {
margin-bottom: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-pb--30 {
margin-bottom: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-pb--20 {
margin-bottom: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-pb--10 {
margin-bottom: 10px;
}
.u-pt--150 {
margin-top: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-pt--120 {
margin-top: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-pt--100 {
margin-top: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-pt--90 {
margin-top: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-pt--80 {
margin-top: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-pt--70 {
margin-top: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-pt--60 {
margin-top: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-pt--50 {
margin-top: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-pt--40 {
margin-top: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-pt--30 {
margin-top: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-pt--20 {
margin-top: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-pt--10 {
margin-top: 10px;
}
.u-pl--150 {
margin-left: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-pl--120 {
margin-left: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-pl--100 {
margin-left: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-pl--90 {
margin-left: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-pl--80 {
margin-left: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-pl--70 {
margin-left: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-pl--60 {
margin-left: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-pl--50 {
margin-left: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-pl--40 {
margin-left: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-pl--30 {
margin-left: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-pl--20 {
margin-left: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-pl--10 {
margin-left: 10px;
}
.u-pr--150 {
margin-right: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-pr--120 {
margin-right: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-pr--100 {
margin-right: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-pr--90 {
margin-right: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-pr--80 {
margin-right: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-pr--70 {
margin-right: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-pr--60 {
margin-right: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-pr--50 {
margin-right: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-pr--40 {
margin-right: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-pr--30 {
margin-right: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-pr--20 {
margin-right: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-pr--10 {
margin-right: 10px;
}
.u-mb--200 {
margin-bottom: clamp(3.125rem, 1.25rem + 9.38vw, 12.5rem) !important;
}
.u-mb--150 {
margin-bottom: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem) !important;
}
.u-mb--120 {
margin-bottom: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem) !important;
}
.u-mb--100 {
margin-bottom: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-mb--90 {
margin-bottom: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-mb--80 {
margin-bottom: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-mb--70 {
margin-bottom: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-mb--60 {
margin-bottom: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-mb--50 {
margin-bottom: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-mb--40 {
margin-bottom: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-mb--30 {
margin-bottom: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-mb--20 {
margin-bottom: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-mb--10 {
margin-bottom: 10px;
}
.u-mb--0 {
margin-bottom: 0;
}
.u-mt--150 {
margin-top: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-mt--120 {
margin-top: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-mt--100 {
margin-top: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-mt--90 {
margin-top: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-mt--80 {
margin-top: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-mt--70 {
margin-top: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-mt--60 {
margin-top: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-mt--50 {
margin-top: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-mt--40 {
margin-top: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-mt--30 {
margin-top: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-mt--20 {
margin-top: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-mt--10 {
margin-top: 10px;
}
.u-ml--150 {
margin-left: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-ml--120 {
margin-left: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-ml--100 {
margin-left: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-ml--90 {
margin-left: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-ml--80 {
margin-left: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-ml--70 {
margin-left: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-ml--60 {
margin-left: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-ml--50 {
margin-left: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-ml--40 {
margin-left: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-ml--30 {
margin-left: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-ml--20 {
margin-left: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-ml--10 {
margin-left: 10px;
}
.u-ml--0 {
margin-left: 0;
}
.u-mr--150 {
margin-right: clamp(0.625rem, -1.125rem + 8.75vw, 9.375rem);
}
.u-mr--120 {
margin-right: clamp(0.625rem, -0.75rem + 6.88vw, 7.5rem);
}
.u-mr--100 {
margin-right: clamp(0.625rem, -0.5rem + 5.63vw, 6.25rem);
}
.u-mr--90 {
margin-right: clamp(0.625rem, -0.375rem + 5vw, 5.625rem);
}
.u-mr--80 {
margin-right: clamp(0.625rem, -0.25rem + 4.38vw, 5rem);
}
.u-mr--70 {
margin-right: clamp(0.625rem, -0.125rem + 3.75vw, 4.375rem);
}
.u-mr--60 {
margin-right: clamp(0.625rem, 3.13vw, 3.75rem);
}
.u-mr--50 {
margin-right: clamp(0.625rem, 0.125rem + 2.5vw, 3.125rem);
}
.u-mr--40 {
margin-right: clamp(0.625rem, 0.25rem + 1.88vw, 2.5rem);
}
.u-mr--30 {
margin-right: clamp(0.625rem, 0.375rem + 1.25vw, 1.875rem);
}
.u-mr--20 {
margin-right: clamp(0.625rem, 0.5rem + 0.63vw, 1.25rem);
}
.u-mr--10 {
margin-right: 10px;
}
.u-mr--0 {
margin-right: 0;
}
.u-stack {
display: grid;
grid-template-columns: 1fr;
gap: 10px;
}
.u-stack--20 {
gap: 20px;
}
.u-stack--30 {
gap: 30px;
}
.u-stack--40 {
gap: 40px;
}
.u-stack--50 {
gap: 50px;
}
.u-stack--60 {
gap: 60px;
}
.u-stack--70 {
gap: 70px;
}
.u-stack--80 {
gap: 80px;
}
.u-stack--90 {
gap: 90px;
}
.u-stack--100 {
gap: 100px;
}
.u-stack--120 {
gap: 120px;
}
.u-stack--150 {
gap: 150px;
}
.u-stack--200 {
gap: 200px;
}
.u-text--left {
text-align: left !important;
}
.u-text--center {
text-align: center !important;
}
.u-text--right {
text-align: right !important;
}
.u-text--normal {
font-weight: 400 !important;
}
.u-text--md {
font-weight: 500 !important;
}
.u-text--bold {
font-weight: 600 !important;
}
.u-text--semi-bold {
font-weight: 700 !important;
}
.u-text--extra-bold {
font-weight: 800 !important;
}
.u-text--lh-lg {
line-height: 1.8;
}
.u-text--lh-xl {
line-height: 2;
}
.u-text--link {
position: relative;
color: #999;
cursor: pointer;
transition: color 0.3s ease-out;
}
.u-text--link::after {
content: "";
position: absolute;
left: 0;
bottom: -2px;
display: block;
width: 100%;
height: 1px;
background-color: #aaa;
transform: scaleX(0);
transform-origin: left;
transition: transform 0.3s ease-out;
}
.u-text--link:hover {
color: #aaa;
}
.u-text--link:hover::after {
transform: scaleX(1);
}
.u-line-height--xxs {
line-height: 1 !important;
}
.u-line-height--sm {
line-height: 1.25 !important;
}
.u-line-height--lg {
line-height: 1.8 !important;
}
.u-color--white {
color: #ffffff !important;
}
.u-color--black {
color: #000000 !important;
}
.u-color--red {
color: #ff0000 !important;
}
.u-color--light {
color: #00ff00 !important;
}
.u-color--sand-beige {
color: #c7b299 !important;
}
.u-color--text {
color: #666 !important;
}
.u-color--primary {
color: #39b54a !important;
}
.u-color--secondary {
color: #c5a76e !important;
}
.u-text--center {
text-align: center;
}
.is-emphasis {
position: relative;
display: inline-block;
white-space: nowrap;
z-index: 1;
}
.is-emphasis::before {
content: "";
position: absolute;
left: 0;
bottom: 0.1em;
width: 100%;
height: 1.8rem;
background-color: rgba(255, 230, 0, 0.6);
transform: scaleX(0);
transform-origin: left;
transition: transform 1.5s ease-out 0.5s;
z-index: -1;
}
.is-emphasis.is-emphasis--active::before {
transform: scaleX(1);
}
.u-visually-hidden {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
.grecaptcha-badge {
visibility: hidden;
}
.u-tab--off {
display: block;
}
@media screen and (max-width: 767px) {
.u-tab--off {
display: none;
}
}
.u-tab--on {
display: none;
}
@media screen and (max-width: 767px) {
.u-tab--on {
display: block;
}
}
.u-visible-tab {
display: none;
}
@media screen and (max-width: 911px) {
.u-visible-tab {
display: block;
}
}
.u-visible-sp {
display: none;
}
@media screen and (max-width: 767px) {
.u-visible-sp {
display: block;
}
}
.u-visible-sp-small {
display: none;
}
@media screen and (max-width: 540px) {
.u-visible-sp-small {
display: block;
}
}
.u-hidden-tab {
display: block;
}
@media screen and (max-width: 911px) {
.u-hidden-tab {
display: none !important;
}
}
.u-hidden-sp {
display: block;
}
@media screen and (max-width: 767px) {
.u-hidden-sp {
display: none !important;
}
}
.u-hidden-mobile {
display: block;
}
@media screen and (max-width: 540px) {
.u-hidden-mobile {
display: none !important;
}
}
.u-hidden--wide {
display: block;
}
@media screen and (max-width: 1920px) {
.u-hidden--wide {
display: none;
}
}
.u-hidden--pc-large {
display: block;
}
@media screen and (max-width: 1440px) {
.u-hidden--pc-large {
display: none;
}
}
.u-hidden--pc {
display: block;
}
@media screen and (max-width: 1280px) {
.u-hidden--pc {
display: none;
}
}
.u-hidden--tab {
display: block;
}
@media screen and (max-width: 1024px) {
.u-hidden--tab {
display: none;
}
}
.u-hidden--sp-large {
display: block;
}
@media screen and (max-width: 767px) {
.u-hidden--sp-large {
display: none;
}
}
.u-hidden--sp {
display: block;
}
@media screen and (max-width: 540px) {
.u-hidden--sp {
display: none;
}
}