@charset "UTF-8";
@font-face {
font-family: "LucidaSans Italic";
src: url(./css/fonts/lucida-sans-italic.woff);
}
body {
font-size: 1.8rem;
line-height: 1.6;
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 400;
margin: 0;
color: #323232;
overflow: hidden;
height: auto;
}
@media (max-width: 767px) {
body {
font-size: 1.6rem;
}
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
font-size: 62.5%;
overflow-x: hidden;
}
a {
text-decoration: none;
color: #323232;
transition: 0.3s;
}
a:hover {
color: #323232;
text-decoration: none;
}
img {
width: 100%;
}
figure {
margin: 0;
}
figure img {
width: 20%;
vertical-align: bottom;
}
.manners-contents figure img,
.manners_sec01 figure img,
.manners_sec02 figure img,
.manners_sec03 figure img,
.manners_sec04 figure img,
.manners_sec05 figure img,
.newproducts_sec01 figure img {
max-width: 100%;
width: 100%;
}
.news-single figure img {
max-width: 100%;
width: 100%;
vertical-align: bottom;
}
ul {
list-style: none;
margin-bottom: 0;
}
iframe {
vertical-align: bottom;
}
.fax {
text-decoration: none;
pointer-events: none;
}
.pc-only {
display: block;
}
@media (max-width: 767px) {
.pc-only {
display: none;
}
}
.mt-6 {
margin-top: 4.5rem !important;
}
.mb-6 {
margin-bottom: 4.5rem !important;
}
.mx-6 {
margin: auto 4.5rem !important;
}
.my-6 {
margin: 4.5rem auto !important;
}
.pt-6 {
padding-top: 4.5rem !important;
}
.pb-6 {
padding-bottom: 4.5rem !important;
}
.px-6 {
padding: auto 4.5rem !important;
}
.py-6 {
padding: 4.5rem auto !important;
}
@media (min-width: 768px) {
.mt-md-6 {
margin-top: 4.5rem !important;
}
.mb-md-6 {
margin-bottom: 4.5rem !important;
}
.mx-md-6 {
margin: auto 4.5rem !important;
}
.my-md-6 {
margin: 4.5rem auto !important;
}
.pt-md-6 {
padding-top: 4.5rem !important;
}
.pb-md-6 {
padding-bottom: 4.5rem !important;
}
.px-md-6 {
padding: auto 4.5rem !important;
}
.py-md-6 {
padding: 4.5rem auto !important;
}
}
@media (min-width: 576px) {
.mt-sm-6 {
margin-top: 4.5rem !important;
}
.mb-sm-6 {
margin-bottom: 4.5rem !important;
}
.mx-sm-6 {
margin: auto 4.5rem !important;
}
.my-sm-6 {
margin: 4.5rem auto !important;
}
.pt-sm-6 {
padding-top: 4.5rem !important;
}
.pb-sm-6 {
padding-bottom: 4.5rem !important;
}
.px-sm-6 {
padding: auto 4.5rem !important;
}
.py-sm-6 {
padding: 4.5rem auto !important;
}
}
.mt-7 {
margin-top: 5.25rem !important;
}
.mb-7 {
margin-bottom: 5.25rem !important;
}
.mx-7 {
margin: auto 5.25rem !important;
}
.my-7 {
margin: 5.25rem auto !important;
}
.pt-7 {
padding-top: 5.25rem !important;
}
.pb-7 {
padding-bottom: 5.25rem !important;
}
.px-7 {
padding: auto 5.25rem !important;
}
.py-7 {
padding: 5.25rem auto !important;
}
@media (min-width: 768px) {
.mt-md-7 {
margin-top: 5.25rem !important;
}
.mb-md-7 {
margin-bottom: 5.25rem !important;
}
.mx-md-7 {
margin: auto 5.25rem !important;
}
.my-md-7 {
margin: 5.25rem auto !important;
}
.pt-md-7 {
padding-top: 5.25rem !important;
}
.pb-md-7 {
padding-bottom: 5.25rem !important;
}
.px-md-7 {
padding: auto 5.25rem !important;
}
.py-md-7 {
padding: 5.25rem auto !important;
}
}
@media (min-width: 576px) {
.mt-sm-7 {
margin-top: 5.25rem !important;
}
.mb-sm-7 {
margin-bottom: 5.25rem !important;
}
.mx-sm-7 {
margin: auto 5.25rem !important;
}
.my-sm-7 {
margin: 5.25rem auto !important;
}
.pt-sm-7 {
padding-top: 5.25rem !important;
}
.pb-sm-7 {
padding-bottom: 5.25rem !important;
}
.px-sm-7 {
padding: auto 5.25rem !important;
}
.py-sm-7 {
padding: 5.25rem auto !important;
}
}
.mt-8 {
margin-top: 6rem !important;
}
.mb-8 {
margin-bottom: 6rem !important;
}
.mx-8 {
margin: auto 6rem !important;
}
.my-8 {
margin: 6rem auto !important;
}
.pt-8 {
padding-top: 6rem !important;
}
.pb-8 {
padding-bottom: 6rem !important;
}
.px-8 {
padding: auto 6rem !important;
}
.py-8 {
padding: 6rem auto !important;
}
@media (min-width: 768px) {
.mt-md-8 {
margin-top: 6rem !important;
}
.mb-md-8 {
margin-bottom: 6rem !important;
}
.mx-md-8 {
margin: auto 6rem !important;
}
.my-md-8 {
margin: 6rem auto !important;
}
.pt-md-8 {
padding-top: 6rem !important;
}
.pb-md-8 {
padding-bottom: 6rem !important;
}
.px-md-8 {
padding: auto 6rem !important;
}
.py-md-8 {
padding: 6rem auto !important;
}
}
@media (min-width: 576px) {
.mt-sm-8 {
margin-top: 6rem !important;
}
.mb-sm-8 {
margin-bottom: 6rem !important;
}
.mx-sm-8 {
margin: auto 6rem !important;
}
.my-sm-8 {
margin: 6rem auto !important;
}
.pt-sm-8 {
padding-top: 6rem !important;
}
.pb-sm-8 {
padding-bottom: 6rem !important;
}
.px-sm-8 {
padding: auto 6rem !important;
}
.py-sm-8 {
padding: 6rem auto !important;
}
}
.mt-9 {
margin-top: 6.75rem !important;
}
.mb-9 {
margin-bottom: 6.75rem !important;
}
.mx-9 {
margin: auto 6.75rem !important;
}
.my-9 {
margin: 6.75rem auto !important;
}
.pt-9 {
padding-top: 6.75rem !important;
}
.pb-9 {
padding-bottom: 6.75rem !important;
}
.px-9 {
padding: auto 6.75rem !important;
}
.py-9 {
padding: 6.75rem auto !important;
}
@media (min-width: 768px) {
.mt-md-9 {
margin-top: 6.75rem !important;
}
.mb-md-9 {
margin-bottom: 6.75rem !important;
}
.mx-md-9 {
margin: auto 6.75rem !important;
}
.my-md-9 {
margin: 6.75rem auto !important;
}
.pt-md-9 {
padding-top: 6.75rem !important;
}
.pb-md-9 {
padding-bottom: 6.75rem !important;
}
.px-md-9 {
padding: auto 6.75rem !important;
}
.py-md-9 {
padding: 6.75rem auto !important;
}
}
@media (min-width: 576px) {
.mt-sm-9 {
margin-top: 6.75rem !important;
}
.mb-sm-9 {
margin-bottom: 6.75rem !important;
}
.mx-sm-9 {
margin: auto 6.75rem !important;
}
.my-sm-9 {
margin: 6.75rem auto !important;
}
.pt-sm-9 {
padding-top: 6.75rem !important;
}
.pb-sm-9 {
padding-bottom: 6.75rem !important;
}
.px-sm-9 {
padding: auto 6.75rem !important;
}
.py-sm-9 {
padding: 6.75rem auto !important;
}
}
.mt-10 {
margin-top: 7.5rem !important;
}
.mb-10 {
margin-bottom: 7.5rem !important;
}
.mx-10 {
margin: auto 7.5rem !important;
}
.my-10 {
margin: 7.5rem auto !important;
}
.pt-10 {
padding-top: 7.5rem !important;
}
.pb-10 {
padding-bottom: 7.5rem !important;
}
.px-10 {
padding: auto 7.5rem !important;
}
.py-10 {
padding: 7.5rem auto !important;
}
@media (min-width: 768px) {
.mt-md-10 {
margin-top: 7.5rem !important;
}
.mb-md-10 {
margin-bottom: 7.5rem !important;
}
.mx-md-10 {
margin: auto 7.5rem !important;
}
.my-md-10 {
margin: 7.5rem auto !important;
}
.pt-md-10 {
padding-top: 7.5rem !important;
}
.pb-md-10 {
padding-bottom: 7.5rem !important;
}
.px-md-10 {
padding: auto 7.5rem !important;
}
.py-md-10 {
padding: 7.5rem auto !important;
}
}
@media (min-width: 576px) {
.mt-sm-10 {
margin-top: 7.5rem !important;
}
.mb-sm-10 {
margin-bottom: 7.5rem !important;
}
.mx-sm-10 {
margin: auto 7.5rem !important;
}
.my-sm-10 {
margin: 7.5rem auto !important;
}
.pt-sm-10 {
padding-top: 7.5rem !important;
}
.pb-sm-10 {
padding-bottom: 7.5rem !important;
}
.px-sm-10 {
padding: auto 7.5rem !important;
}
.py-sm-10 {
padding: 7.5rem auto !important;
}
}
.fsize-200 {
font-size: 200%;
}
.fsize-190 {
font-size: 190%;
}
.fsize-180 {
font-size: 180%;
}
.fsize-170 {
font-size: 170%;
}
.fsize-160 {
font-size: 160%;
}
.fsize-150 {
font-size: 150%;
}
.fsize-140 {
font-size: 140%;
}
.fsize-130 {
font-size: 130%;
}
.fsize-120 {
font-size: 120%;
}
.fsize-110 {
font-size: 110%;
}
.fsize-100 {
font-size: 100%;
}
.fsize-90 {
font-size: 90%;
}
.fsize-80 {
font-size: 80%;
}
.fsize-70 {
font-size: 70%;
}
.fsize-60 {
font-size: 60%;
}
.fsize-50 {
font-size: 50%;
}
@media (max-width: 767px) {
.under_logo img {
max-width: 200px;
}
}
@keyframes skewanime {
100% {
left: -10%;
}
}
.button {
width: 100%;
position: relative;
overflow: hidden;
text-decoration: none;
display: inline-block;
border: 1px solid #c8004c;
padding: 10px 90px 10px 20px;
text-align: center;
outline: none;
background-color: #fff;
transition: ease 0.2s;
}
.button span {
position: relative;
z-index: 3;
color: #c8004c;
}
@media screen and (min-width: 768px) {
.button:hover span {
color: #fff;
}
}
.bgskew:before {
content: "";
position: absolute;
top: 0;
left: -130%;
background: #c8004c;
width: 120%;
height: 100%;
transform: skewX(-25deg);
}
@media screen and (min-width: 768px) {
.bgskew:hover::before {
animation: skewanime 0.5s forwards;
}
}
.arrow {
width: 100%;
}
.arrow a:after {
content: "";
display: block;
position: absolute;
top: 30%;
right: 20px;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_arrow.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.arrow a:hover::after {
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
}
.button-oppose {
width: 100%;
position: relative;
overflow: hidden;
text-decoration: none;
display: inline-block;
border: 1px solid #c8004c;
padding: 10px 65px 10px 20px;
text-align: center;
outline: none;
background-color: #c8004c;
transition: ease 0.2s;
}
.button-oppose span {
position: relative;
z-index: 3;
color: #fff;
}
@media screen and (min-width: 768px) {
.button-oppose:hover span {
color: #c8004c;
}
}
.bgskew-oppose:before {
content: "";
position: absolute;
top: 0;
left: -130%;
background: #fff;
width: 120%;
height: 100%;
transform: skewX(-25deg);
}
@media screen and (min-width: 768px) {
.bgskew-oppose:hover::before {
animation: skewanime 0.5s forwards;
}
}
.arrow-oppose {
width: 100%;
}
.arrow-oppose a:after {
content: "";
display: block;
position: absolute;
top: 30%;
right: 20px;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.arrow-oppose a:hover::after {
background: url(./img/icon_arrow.webp) no-repeat center/contain;
}
}
.button a {
display: block;
color: #c8004c;
background: #fff;
border: 1px solid #c8004c;
padding: 0.6em 10px;
text-decoration: none;
}
.taxonomy-button a {
display: block;
color: #000;
background: #fff;
border: 1px solid #000;
padding: 0.6em 10px;
text-decoration: none;
max-width: 320px;
width: 100%;
margin: auto;
text-align: center;
font-size: 1.8rem;
}
@media screen and (min-width: 768px) {
.button a:hover {
background: #c8004c;
color: #fff;
border: 1px solid #c8004c;
}
.taxonomy-button a:hover {
background: #000;
color: #fff;
border: 1px solid #000;
}
}
@media (max-width: 767px) {
.taxonomy-button a {
font-size: 1.6rem;
}
}
.button.arrow a {
position: relative;
}
.taxonomy-button.taxonomy-arrow a {
position: relative;
}
.taxonomy-button.taxonomy-arrow a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
transition: 0.3s;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_arrow.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.taxonomy-button.taxonomy-arrow a:hover:before {
right: 3%;
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
}
.button.ex a {
position: relative;
}
.taxonomy-button.taxonomy-ex {
position: relative;
}
.taxonomy-button.ex a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_ex.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.taxonomy-button.ex a:hover:before {
background: url(./img/icon_ex_rev.webp) no-repeat center/contain;
}
}
@media (max-width: 767px) {
.taxonomy-button.ex a:before {
right: 15%;
}
}
.button.cart a {
position: relative;
}
.button.cart a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_cart.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.cart a:hover:before {
background: url(./img/icon_cart_rev.webp) no-repeat center/contain;
}
}
.button.phone a span {
position: relative;
padding-left: 30px;
}
.button.phone a span:before {
content: "";
display: inline-block;
position: absolute;
top: calc(50% + 3px);
transform: translateY(-50%);
left: 0;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_phone.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.phone a:hover span:before {
background: url(./img/icon_phone_rev.webp) no-repeat center/contain;
}
}
.button.mail a span {
position: relative;
padding-left: 30px;
}
.button.mail a span:before {
content: "";
display: inline-block;
position: absolute;
top: calc(50% + 3px);
transform: translateY(-50%);
left: 0;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_mail.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.mail a:hover span:before {
background: url(./img/icon_mail_rev.webp) no-repeat center/contain;
}
}
.button.arrow.purple a {
color: #7137c3;
background: #fff;
border: 1px solid #7137c3;
}
.button.arrow.purple a:before {
background: url(./img/icon_arrow_purple.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.arrow.purple a:hover {
color: #fff;
background: #7137c3;
border: 1px solid #7137c3;
}
.button.arrow.purple a:hover:before {
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
}
.button.arrow.ocher a {
color: #a48b60;
background: #fff;
border: 1px solid #a48b60;
}
.button.arrow.ocher a:before {
background: url(./img/icon_arrow_ocher.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.arrow.ocher a:hover {
color: #fff;
background: #a48b60;
border: 1px solid #a48b60;
}
.button.arrow.ocher a:hover:before {
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
}
.button.arrow.ocher.rev a {
color: #fff;
background: #a48b60;
border: 1px solid #fff;
}
.button.arrow.ocher.rev a:before {
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.button.arrow.ocher.rev a:hover {
color: #a48b60;
background: #fff !important;
border: 1px solid #fff;
}
.button.arrow.ocher.rev a:hover:before {
background: url(./img/icon_arrow_ocher.webp) no-repeat center/contain;
}
}
h1 {
font-size: 2.8rem;
letter-spacing: 0.02em;
padding-top: 30px;
padding-bottom: 80px;
margin-bottom: 0;
position: relative;
z-index: 10;
}
.under-pv h1 {
padding: 1.6em 10px 1.4em 8%;
}
.under-pv h1 p:first-child {
opacity: 0.3;
font-size: 4.8rem;
padding-bottom: 10px;
}
@media screen and (max-width: 767px) {
h1 {
font-size: calc(22px + 8 * (100vw - 320px) / 450);
padding-top: 20px;
padding-bottom: 40px;
}
.under-pv h1 p:first-child {
font-size: calc(30px + 8 * (100vw - 320px) / 450);
}
}
.under-pv {
background: linear-gradient(
90deg,
#1f4c8c 0%,
#1f4c8c 75%,
#002454 75%,
#002454 100%
);
}
.under-pv__pray {
background: linear-gradient(
90deg,
#9b3f54 0%,
#9b3f54 75%,
#51311e 75%,
#51311e 100%
);
}
.under-pv h1 {
color: #fff;
}
.under-pv h1:before {
background: url(./img/challenge_img-idomu.webp) no-repeat right center/contain;
top: 0;
right: 40px;
width: 100%;
height: 100%;
}
.under-pv__pray h1:before {
background: url(./img/pray_img-inoru.webp) no-repeat right center/contain;
}
@media screen and (max-width: 719px) {
.under-pv {
background: linear-gradient(
90deg,
#1f4c8c 0%,
#1f4c8c 70%,
#002454 70%,
#002454 100%
);
}
.under-pv h1:before {
right: 3vw;
}
.under-pv__pray {
background: linear-gradient(
90deg,
#9b3f54 0%,
#9b3f54 70%,
#51311e 70%,
#51311e 100%
);
}
}
.company h2,
.offices h2,
.history h2,
.strenghs-top h2,
.step__title h2,
.what__title h2 {
font-size: 2.8rem;
font-weight: 800;
line-height: 3.8rem;
text-align: left;
border-bottom: 1px solid #bbb;
}
@media screen and (max-width: 767px) {
.company h2,
.offices h2,
.history h2,
.strenghs-top h2,
.step__title h2,
.what__title h2 {
font-size: 2rem;
}
}
h1:before {
content: "";
display: inline-block;
position: absolute;
margin: auto;
}
@media (min-width: 1400px) {
h1:before {
right: 10px;
}
}
.bread {
margin: 0;
font-size: 1.2rem;
margin-left: 3%;
}
.container-fluid .bread {
margin-left: 6%;
}
@media (max-width: 767px) {
.bread {
margin: 0;
}
.container-fluid .bread {
margin-left: 0;
}
}
.bread a {
text-decoration: underline;
color: #1e50a2;
}
.bread ul {
padding: 1em 0;
margin: 0 auto;
float: none;
}
.bread li {
position: relative;
float: left;
padding-right: 2em;
margin-right: 1.5em;
word-break: keep-all;
}
.bread li:after {
content: ">";
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
margin: auto;
}
.bread li:last-child {
padding-right: 0;
margin-right: 0;
}
.bread li:last-child:after {
content: none;
}
@media screen and (min-width: 768px) {
.bread li a:hover {
text-decoration: none;
color: #323232;
}
}
h2 {
font-size: 3rem;
position: relative;
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 400;
}
@media (max-width: 767px) {
h2 {
font-size: calc(22px + 8 * (100vw - 320px) / 450);
}
h2:after {
font-size: calc(14px + 4 * (100vw - 320px) / 450);
}
}
h3 {
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
}
.contact-title .contact_h1 {
font-size: 2.8rem;
line-height: 38px;
font-weight: 800;
border-bottom: 1px solid #323232;
padding: 0 0 0px;
}
@media (min-width: 768px) {
.contact__sec00 .tel a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}
.contact__sec00 .inner {
max-width: 460px;
width: 100%;
margin: auto;
padding: 1% 0;
color: #fff;
font-size: 2.2rem;
background: #898989;
}
.contact-wrapper > p {
color: #898989;
font-size: 2.2rem;
}
.contact-wrapper span {
color: #c8004c;
font-size: 4rem;
padding-left: 10px;
}
.contact-wrapper .text-box {
font-size: 1.6rem;
background-color: #fdebe5;
padding: 2% 9%;
}
.contact__sec01 h2 {
font-size: 2.4rem;
font-weight: 600;
}
.contact__sec01 a,
.agree a {
color: #c8004c;
}
.contact__sec02 {
margin-bottom: 0;
padding-bottom: 130px;
}
.contact__sec02 .contact-item {
background-color: #fdece7;
border-bottom: 1px solid #f5cccc;
display: flex;
align-items: center;
}
.contact__sec02 .contact-item span {
padding: auto;
}
.contact__sec02 .must {
position: relative;
}
.contact__sec02 .must:after {
position: absolute;
content: "必須";
font-size: 1.4rem;
color: #fff;
top: 0;
bottom: 0;
margin: auto;
right: 20px;
background-color: #c8004c;
padding: 2px 10px;
height: 26px;
}
.contact__sec02 .contact-input {
border-bottom: 1px solid #f5cccc;
padding-top: 34px;
padding-bottom: 34px;
}
.contact__sec02 .contact-input .however {
padding-left: 10px;
}
.contact__sec02 .agree {
background-color: #e6e6e6;
line-height: 4rem;
}
.contact__sec02 .agree label {
position: relative;
}
.contact__sec02 .agree label:before {
position: absolute;
content: "必須";
font-size: 1.4rem;
color: #fff;
top: 5px;
bottom: 0;
margin: auto;
left: -30px;
background-color: #c8004c;
padding: 2px 10px;
height: 26px;
line-height: 2rem;
}
.contact__sec02 .contactform-title {
font-size: 2.4rem;
color: #fff;
background-color: #898989;
}
.contact__sec02 .contact-input #zip {
width: 25%;
margin-top: 30px;
}
.contact__sec02 .contact-input #zip1 {
width: 30%;
}
form input[type="text"] {
padding: 10px;
width: 100%;
outline: none;
color: #323232;
}
form input[type="email"] {
padding: 10px;
width: 70%;
outline: none;
color: #323232;
}
form input[type="text"]:focus,
form input[type="email"]:focus {
box-shadow: 0 0 3px #9d1a16;
border: 1px solid #9d1a16;
}
form textarea {
padding: 10px;
width: 100%;
height: 200px;
outline: none;
color: #323232;
}
form textarea:focus {
box-shadow: 0 0 3px #9d1a16;
border: 1px solid #9d1a16;
}
form input[type="checkbox"] {
margin-right: 0.5em;
}
form input[type="radio"] {
margin-right: 0.5em;
}
form .text_red {
background: #b53437;
color: #fff;
padding: 2px 10px;
margin-left: 10px;
font-size: 1.4rem;
}
.contact__sec02 .post-number {
padding-top: 0;
padding-bottom: 0px;
}
@media (max-width: 991px) {
.contact__sec00 .contact-wrapper .inner {
font-size: 2rem;
}
.contact__sec02 .contact-input #zip {
width: 40%;
}
}
@media (max-width: 767px) {
.contact__sec01 .row {
margin: 0;
}
.contact__sec00 li {
font-size: calc(20px + 4 * (100vw - 320px) / 450);
}
.contact-title .contact_h1 {
font-size: 2.4rem;
}
.contact__sec00 .contact-wrapper .inner {
max-width: 100%;
}
.contact-wrapper .text-box {
padding: 2% 7%;
}
.contact__sec02 {
padding: 15.64537% 0;
}
.contact__sec01 h2 {
font-size: 2rem;
}
.contact__sec02 .row {
margin-left: 0px;
margin-right: 0px;
}
.contact__sec02 .contactform-title {
font-size: 2.2rem;
}
.contact__sec02 .contact-item {
border-bottom: none;
}
.contact__sec02 .contact-input {
border-bottom: none;
padding-top: 10px;
}
form input[type="email"] {
width: 100%;
}
.contact__sec02 .contact-input .however {
line-height: 35px;
}
.agree a {
padding-left: 12px;
}
.contact__sec02 .agree {
line-height: 3rem;
}
.contact__sec02 .agree label:before {
left: -20px;
}
.contact__sec02 .contact-input #zip {
width: 40%;
margin-top: 0px;
}
.contact__sec02 .post-number {
padding-top: 10px;
}
}
.thanks {
padding: 120px 0;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.thanks {
padding: 15.64537% 0;
}
}
.thanks .button a:before {
right: auto;
left: 5%;
transform: translateY(-50%) rotate(180deg);
}
@media screen and (min-width: 768px) {
.thanks .button a:hover:before {
right: auto;
left: 3%;
}
}
.contact-box,
.sec_info .box,
.e-catalog_box {
background-color: #e6e6e8;
width: 100%;
height: 100px;
}
.sec_info .info_h1 {
font-size: 2.8rem;
line-height: 38px;
font-weight: 800;
border-bottom: 1px solid #323232;
padding: 0 0 0px;
}
.sec_info .info_item {
display: flex;
border-bottom: 1px solid #cacaca;
padding: 35px 0;
}
@media screen and (min-width: 768px) {
.sec_info .info_item a:hover {
opacity: 0.5;
}
}
.sec_info .info_item .category {
background-color: #c8004c;
font-size: 1.6rem;
padding: 3px;
width: 160px;
text-align: center;
margin: 0px 20px;
}
.sec_info .info_item .category a {
color: #fff;
}
.sec_info .info_item ol {
list-style: none;
display: flex;
}
.sec_info dl {
margin-bottom: 0;
min-height: 1000px;
max-height: 1000px;
overflow-y: auto;
}
.sec_info dl dt,
.sec_info dl dd {
padding: 1.5em 0;
}
.sec_info dl dt {
position: relative;
padding-left: 38px;
}
.sec_info dl dt:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
bottom: 0;
margin: auto;
width: 26px;
height: 28px;
background: url(./img/info_img01.webp) no-repeat center/cover;
}
.sec_info .info_wrap {
padding-top: 70px;
margin-bottom: 0;
}
@media screen and (max-width: 991px) {
.sec_info .info_item {
display: inline-block;
width: 100%;
}
.sec_info .info_item > li:last-child {
padding-top: 15px;
}
.sec_info .info_item .category {
font-size: 1.4rem;
width: 130px;
}
}
@media screen and (max-width: 767px) {
.sec_info .info_wrap {
padding: 15.64537% 0 0;
}
.contact-box,
.sec_info .box {
height: 70px;
}
.sec_info .info_h1 {
font-size: 3.6rem;
}
.sec_info .info_item ol {
font-size: 1.4rem;
}
.sec_info .info_item > li:last-child {
font-size: 1.6rem;
}
.sec_info .info_item .category {
font-size: 1.1rem;
padding: 4px 20px;
width: 85px;
}
.sec_info .info_item > li:last-child {
padding-top: 10px;
}
}
@media (max-width: 767px) {
.sec_info .row {
margin: 0;
}
}
.info_h2 {
padding-bottom: 38px;
}
.info_h2:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 485px;
height: 28px;
background: url(./img/h2_bg.webp) no-repeat center/cover;
}
@media (max-width: 767px) {
.info_h2:before {
width: 100%;
}
}
.sec_info02 {
margin-bottom: 0;
}
.btn {
display: block;
}
.btn a {
display: block;
color: #000;
background: #fff;
border: 1px solid #000;
padding: 0.6em 10px;
text-decoration: none;
max-width: 320px;
width: 100%;
margin: auto;
text-align: center;
font-size: 1.8rem;
}
@media screen and (min-width: 768px) {
.btn a:hover {
background: #000;
color: #fff;
border: 1px solid #000;
}
}
@media (max-width: 767px) {
.btn a {
font-size: 1.6rem;
}
}
.arr {
width: 100%;
}
.btn.arr a {
position: relative;
}
.btn.arr a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
transition: 0.3s;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_arrow.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.btn.arr a:hover:before {
right: 3%;
background: url(./img/icon_arrow_rev.webp) no-repeat center/contain;
}
}
.btn.ex a {
position: relative;
}
.btn.ex a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 5%;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_ex.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.btn.ex a:hover:before {
background: url(./img/icon_ex_rev.webp) no-repeat center/contain;
}
}
.news-single {
padding-top: 120px;
padding-bottom: 80px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.news-single {
padding-top: 15.64537%;
padding-bottom: 40px;
}
}
.news-single__heading {
border-bottom: 2px solid #ddd;
}
.news-single__h2 {
text-align: left;
}
.news-single .btn a:before,
.thanks .btn a:before {
right: auto;
left: 5%;
transform: translateY(-50%) rotate(180deg);
}
@media screen and (min-width: 768px) {
.thanks .btn a:hover:before,
.news-single .btn a:hover:before {
right: auto;
left: 3%;
}
}
.news-single-pager__prev a,
.news-single-pager__next a {
position: relative;
font-size: 1.6rem;
color: #323232;
}
.news-single-pager__prev a:before,
.news-single-pager__next a:before {
display: block;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
.news-single-pager__prev a {
padding-left: 40px;
}
.news-single-pager__prev a:before {
content: "<<<";
left: 0;
}
.news-single-pager__next a {
padding-right: 40px;
}
.news-single-pager__next a:before {
content: ">>>";
right: 0;
}
.planning_sec02 {
padding: 120px 0;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.planning_sec02 {
padding: 15.64537% 0;
}
}
.planning_sec02 h3 {
font-size: 2.2rem;
font-weight: bold;
}
@media (max-width: 767px) {
.planning_sec02 h3 {
font-size: calc(18px + 4 * (100vw - 320px) / 450);
}
}
.planning_sec03 {
padding: 120px 0;
margin-bottom: 0;
background: #bb3d3f;
}
@media screen and (max-width: 767px) {
.planning_sec03 {
padding: 15.64537% 0;
}
}
.planning_sec03 h2,
.planning_sec03 p,
.planning_sec03 a {
color: #fff;
}
.planning_sec04 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.planning_sec04 {
padding-top: 15.64537%;
}
}
.planning_sec05,
.setup_sec06 {
padding: 120px 0;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.planning_sec05,
.setup_sec06 {
padding: 15.64537% 0;
}
}
.planning_sec05 h3,
.setup_sec06 h3 {
font-size: 2.2rem;
font-weight: bold;
}
@media (max-width: 767px) {
.planning_sec05 h3,
.setup_sec06 h3 {
font-size: calc(18px + 4 * (100vw - 320px) / 450);
}
}
@media (min-width: 1200px) {
.planning_sec05 .container,
.setup_sec06 .container {
max-width: 840px;
}
}
.planning_sec05 p,
.setup_sec06 p {
margin: 0;
}
.planning_sec06 .row,
.setup_sec07 .row,
.packege_sec03 .row,
.novelty_sec03 .row {
background: #a48b60;
padding: 3em 1rem;
}
.planning_sec06 h2,
.setup_sec07 h2,
.packege_sec03 h2,
.novelty_sec03 h2,
.planning_sec06 h2:after,
.setup_sec07 h2:after,
.packege_sec03 h2:after,
.novelty_sec03 h2:after,
.planning_sec06 p,
.setup_sec07 p,
.packege_sec03 p,
.novelty_sec03 p {
color: #fff;
}
@media (max-width: 767px) {
.planning_sec06 .row,
.setup_sec07 .row,
.packege_sec03 .row,
.novelty_sec03 .row {
margin: 0;
}
}
.setup_sec01 {
padding-bottom: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.setup_sec01 {
padding-bottom: 15.64537%;
}
}
.setup_sec02 {
padding: 120px 0;
margin-bottom: 0;
background: #bb3d3f;
}
@media screen and (max-width: 767px) {
.setup_sec02 {
padding: 15.64537% 0;
}
}
.setup_sec02 h2,
.setup_sec02 p,
.setup_sec02 a {
color: #fff;
}
.setup_sec03 {
padding: 120px 0;
margin-bottom: 0;
background: #a7d6df;
}
@media screen and (max-width: 767px) {
.setup_sec03 {
padding: 15.64537% 0;
}
}
.setup_sec04,
.manners_sec04 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.setup_sec04,
.manners_sec04 {
padding-top: 15.64537%;
}
}
.setup_sec04 h3,
.manners_sec04 h3 {
background: #fed5d5;
padding: 0.5em 1em;
font-size: 2.4rem;
}
@media (max-width: 767px) {
.setup_sec04 h3,
.manners_sec04 h3 {
font-size: 2rem;
}
}
@media (min-width: 1200px) {
.setup_sec04 .container,
.manners_sec04 .container {
max-width: 840px;
}
}
.setup_sec05 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.setup_sec05 {
padding-top: 15.64537%;
}
}
.h2_border {
padding-bottom: 3rem;
display: inline-block;
}
.h2_border:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 422px;
height: 19px;
background: url(./img/h2_border_img01.webp) no-repeat center/contain;
}
@media (max-width: 767px) {
.h2_border:before {
width: 100%;
}
}
.packege_sec01,
.novelty_sec01 {
padding: 120px 0 180px 0;
padding-top: 120px;
margin-bottom: 0;
padding-bottom: 180px;
margin-bottom: 0;
background: #bb3d3f;
}
@media screen and (max-width: 767px) {
.packege_sec01,
.novelty_sec01 {
padding-top: 15.64537%;
}
}
@media screen and (max-width: 767px) {
.packege_sec01,
.novelty_sec01 {
padding-bottom: 23.46806%;
}
}
.packege_sec01 .ttl,
.novelty_sec01 .ttl {
font-size: 2.4rem;
color: #fff;
}
@media (max-width: 767px) {
.packege_sec01,
.novelty_sec01 {
padding: 10% 0 20% 0;
}
}
@media (max-width: 500px) {
.packege_sec01,
.novelty_sec01 {
padding: 15% 0 30% 0;
}
.packege_sec01 .ttl,
.novelty_sec01 .ttl {
font-size: calc(18px + 6 * (100vw - 320px) / 450);
}
.packege_sec01 .ttl_img img,
.novelty_sec01 .ttl_img img {
max-width: 60px;
}
}
@media (min-width: 768px) {
.packege_sec02,
.novelty_sec02 {
margin-top: -190px;
}
}
@media (max-width: 767px) {
.packege_sec02,
.novelty_sec02 {
margin-top: -130px;
}
}
.packege_sec02 .figure_ttl,
.novelty_sec02 .figure_ttl {
font-size: 2.4rem;
}
@media (max-width: 767px) {
.packege_sec02 .figure_ttl,
.novelty_sec02 .figure_ttl {
font-size: calc(18px + 6 * (100vw - 320px) / 450);
}
}
@media (min-width: 768px) {
.packege_sec03,
.novelty_sec03 {
padding-top: 80px;
}
}
.manners_sec02 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners_sec02 {
padding-top: 15.64537%;
}
}
@media (min-width: 1200px) {
.manners_sec02 .container {
max-width: 840px;
}
}
.manners_sec03 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners_sec03 {
padding-top: 15.64537%;
}
}
@media (min-width: 1200px) {
.manners_sec03 .container {
max-width: 840px;
}
}
.manners_sec03 h2 {
font-size: 3.6rem;
display: flex;
justify-content: center;
align-items: center;
}
.manners_sec03 h2:before,
.manners_sec03 h2:after {
content: "";
height: 1px;
background-color: #333;
width: 45px;
}
.manners_sec03 h2:before {
margin-right: 2.2rem;
}
.manners_sec03 h2:after {
margin-left: 2.2rem;
}
@media (max-width: 767px) {
.manners_sec03 h2 {
font-size: calc(22px + 14 * (100vw - 320px) / 450);
}
}
.manners_sec05 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners_sec05 {
padding-top: 15.64537%;
}
}
@media (min-width: 1200px) {
.manners_sec05 .container {
max-width: 840px;
}
}
.manners_sec05 .wrapper {
background: #eee;
padding: 10.25641% 7.69231%;
height: 100%;
}
.manners_sec05 .item_img {
max-width: 220px;
width: 100%;
margin: auto;
}
.manners_sec05 .item_img figcaption {
font-size: 2.4rem;
margin: 0.5em 0 1em;
}
@media (max-width: 767px) {
.manners_sec05 .item_img figcaption {
font-size: 2rem;
}
}
.manners_sec06 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners_sec06 {
padding-top: 15.64537%;
}
}
.manners-manner01_sec01 {
margin-bottom: 200px;
}
@media screen and (max-width: 767px) {
.manners-manner01_sec01 {
margin-bottom: 100px;
}
}
.manners-manner01_sec01 h2 {
font-size: 3.6rem;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 10px;
}
@media (max-width: 767px) {
.manners-manner01_sec01 h2 {
font-size: calc(22px + 14 * (100vw - 320px) / 450);
}
}
.manners-manner01_sec01 .sub_ttl {
padding-bottom: 36px;
border-bottom: 22px solid #fed5d5;
}
.manners-manner01_sec01 ul {
list-style: disc;
}
.manners-manner01_sec01 ul li {
position: relative;
}
.manners-manner01_sec01 ul li:before {
position: absolute;
content: "";
background: #dd4148;
left: -25px;
top: 10px;
width: 14px;
height: 14px;
display: block;
}
.manners-manner01_sec01 li {
font-size: 2rem;
margin-left: 2em;
margin-bottom: 0.8rem;
list-style: none;
}
.manners-contents a,
.manners-manner01_sec01 li a {
text-decoration: underline;
}
@media (max-width: 767px) {
.manners-manner01_sec01 li {
font-size: 1.6rem;
}
}
@media screen and (min-width: 768px) {
.manners-contents a:hover,
.manners-manner01_sec01 li a:hover {
font-weight: bold;
text-decoration: none;
}
}
.manners-manner01_sec02 {
padding-top: 120px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners-manner01_sec02 {
padding-top: 15.64537%;
}
}
.manners-single_sec01 {
padding-top: 120px;
margin-bottom: 0;
padding-bottom: 30px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.manners-single_sec01 {
padding-top: 15.64537%;
}
}
@media screen and (max-width: 767px) {
.manners-single_sec01 {
padding-bottom: 3.91134%;
}
}
@media (min-width: 1200px) {
.manners-single_sec01 .container {
max-width: 840px;
}
}
.manners-single_sec01 .container {
position: relative;
}
.manners-single_sec01 .container:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: -30px;
margin: auto;
width: calc(100% - 30px);
border-bottom: 1px solid #323232;
}
.manners-single_sec01 h2 {
font-size: 3.6rem;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 10px;
}
.manners-single_sec01 h2:before,
.manners-single_sec01 h2:after {
content: "";
height: 1px;
background-color: #333;
width: 45px;
}
.manners-single_sec01 h2:before {
margin-right: 2.2rem;
}
.manners-single_sec01 h2:after {
margin-left: 2.2rem;
}
@media (max-width: 767px) {
.manners-single_sec01 h2 {
font-size: calc(22px + 14 * (100vw - 320px) / 450);
}
}
.manners-single_sec01 .sub_ttl {
padding-bottom: 36px;
border-bottom: 22px solid #fed5d5;
}
.manners-single_sec01 .txt {
font-size: 2.4rem;
}
.manners-single_sec01 .list {
display: inline-block;
}
.manners-single_sec01 .list a {
font-size: 2rem;
color: #e50060;
position: relative;
padding-right: 3rem;
}
.manners-single_sec01 .list a:before {
content: "";
display: block;
position: absolute;
top: 50%;
transform: translateY(-50%) rotate(90deg);
right: 0;
transition: 0.3s;
margin: auto;
width: 20px;
height: 20px;
background: url(./img/icon_media_red.webp) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
.manners-single_sec01 .list a:hover {
text-decoration: underline;
}
}
@media (max-width: 767px) {
.manners-single_sec01 .txt {
font-size: 2rem;
}
.manners-single_sec01 .list a {
font-size: 1.8rem;
}
}
.manners-single_sec02 {
padding-top: 3rem;
}
@media (min-width: 1200px) {
.manners-single_sec02 .container {
max-width: 840px;
}
}
.manners-single_sec02 .container {
position: relative;
}
.manners-single_sec02 .container:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: -30px;
margin: auto;
width: calc(100% - 30px);
border-bottom: 1px solid #323232;
}
.manners-single_sec02 h2 {
text-align: left;
}
.manners-single_sec02 .box .ttl {
font-size: 2.4rem;
color: #e50060;
}
.manners-single_sec02 .text-red {
color: #e50060;
}
.manners-single_sec02 .youtube {
position: relative;
padding-top: 56.25%;
height: 0;
}
.manners-single_sec02 .youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.manners-single_sec03 {
padding-top: 3rem;
}
@media (min-width: 1200px) {
.manners-single_sec03 .container {
max-width: 840px;
}
}
.manners-single_sec03 .container {
position: relative;
}
.manners-single_sec03 .container:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: -30px;
margin: auto;
width: calc(100% - 30px);
border-bottom: 1px solid #323232;
}
.manners-single_sec03 h2 {
text-align: left;
}
.manners-single_sec03 .box .ttl {
font-size: 2.4rem;
color: #e50060;
}
.manners-single_sec03 .text-red {
color: #e50060;
}
.manners-single_sec04 {
padding-top: 3rem;
}
@media (min-width: 1200px) {
.manners-single_sec04 .container:first-of-type {
max-width: 840px;
}
.manners-single_sec04 .container:last-of-type {
max-width: 700px;
}
}
.manners-single_sec04 figure {
max-width: 260px;
width: 100%;
margin: auto;
}
.manners-single_sec04 figure figcaption {
margin-bottom: 1em;
}
@media (min-width: 768px) {
.manners-single_sec04 .box_img02 figcaption {
margin-bottom: 2.5em;
}
}
.manners-single_sec04 h2 {
text-align: left;
}
.movie_sec01,
.movie_sec03,
.movie_sec05 {
padding-top: 60px;
margin-bottom: 0;
position: relative;
}
@media screen and (max-width: 767px) {
.movie_sec01,
.movie_sec03,
.movie_sec05 {
padding-top: 7.82269%;
}
}
.movie_sec01 img,
.movie_sec03 img,
.movie_sec05 img {
width: 100vw;
height: 100%;
object-fit: cover;
}
.movie_sec01 .container-fluid,
.movie_sec03 .container-fluid,
.movie_sec05 .container-fluid {
padding: 0;
}
.movie_sec01:before,
.movie_sec03:before,
.movie_sec05:before {
content: "";
display: block;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 100%;
height: 7px;
background: url(./img/movie_border_img01.png) repeat-x center/contain;
}
.movie_sec02,
.movie_sec04,
.movie_sec06 {
padding-bottom: 90px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.movie_sec02,
.movie_sec04,
.movie_sec06 {
padding-bottom: 11.73403%;
}
}
.movie_sec02 .youtube,
.movie_sec04 .youtube,
.movie_sec06 .youtube {
position: relative;
padding-top: 56.25%;
height: 0;
}
.movie_sec02 .youtube iframe,
.movie_sec04 .youtube iframe,
.movie_sec06 .youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.movie_sec02 h2,
.movie_sec04 h2,
.movie_sec06 h2 {
display: flex;
color: #c93650;
font-size: 2.4rem;
position: relative;
}
.movie_sec02 h2 img,
.movie_sec04 h2 img,
.movie_sec06 h2 img {
padding-right: 16px;
position: relative;
z-index: 3;
}
.movie_sec02 h2 span,
.movie_sec04 h2 span,
.movie_sec06 h2 span {
display: block;
transform: translateY(20%);
}
@media (max-width: 767px) {
.movie_sec02 h2,
.movie_sec04 h2,
.movie_sec06 h2 {
font-size: 2.2rem;
}
}
.movie_sec02 h2:before,
.movie_sec04 h2:before,
.movie_sec06 h2:before {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 6px;
margin: auto;
width: 100%;
height: 17px;
border-top: 14px solid #c9c9c9;
border-bottom: 1px solid #c9c9c9;
}
.movie_sec02 h2:after,
.movie_sec04 h2:after,
.movie_sec06 h2:after {
content: "";
display: block;
position: absolute;
left: 0;
bottom: 14px;
margin: auto;
width: 99.4%;
height: 14px;
border-bottom: 14px solid #c93650;
}
.movie_sec03 {
background: #faf4e8;
}
.movie_sec03:before {
background: url(./img/movie_border_img02.png) repeat-x center/contain;
}
.movie_sec04 {
background: #faf4e8;
}
.movie_sec04 h2 {
color: #515352;
}
.movie_sec04 h2:after {
border-color: #a37e38;
}
.movie_sec04 .inner_box {
display: flex;
flex-direction: column;
}
.movie_sec04 .inner_box .button {
margin: 0;
margin-top: auto;
}
.movie_sec04 .button + .button {
margin-top: 2rem;
}
.movie_sec05 {
background: #a7d6df;
}
.movie_sec05:before {
background: url(./img/movie_border_img03.png) repeat-x center/contain;
}
.movie_sec06 {
background: #a7d6df;
}
.movie_sec06 h2:before {
border-color: #fff;
}
.movie_sec07 {
padding-top: 130px;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.movie_sec07 {
padding-top: 16.94915%;
}
}
.newproducts_sec01 figcaption {
text-align: left;
margin-top: 1em;
}
.newproducts_sec01 p {
margin-bottom: 0;
}
.newproducts_sec01 .date {
font-size: 1.8rem;
}
.newproducts_sec01 .ttl {
font-size: 2.2rem;
}
@media (max-width: 767px) {
.newproducts_sec01 .date {
font-size: 1.4rem;
}
.newproducts_sec01 .ttl {
font-size: 2rem;
}
}
.newproducts_sec01 a img {
transition: 0.3s;
}
@media screen and (min-width: 768px) {
.newproducts_sec01 a img:hover {
opacity: 0.8;
}
}
.single-title,
.privacy,
.taxonomy-title,
.manners__h1,
.newproducts__h1 {
font-size: 3rem;
letter-spacing: 0.02em;
background: #fff;
padding: 2.5em 10px 2.8em 10%;
margin-bottom: 0;
position: relative;
z-index: 10;
}
.privacy:after,
.single-title:after,
.taxonomy-title:after,
.manners__h1:after,
.newproducts__h1:after {
content: attr(data-text);
font-size: 1.3rem;
letter-spacing: 0.025em;
line-height: 2;
display: block;
}
.privacy:before,
.single-title:before,
.taxonomy-title:before,
.manners__h1:before,
.newproducts__h1:before {
content: "";
display: block;
position: absolute;
top: 0;
left: 50%;
bottom: 0;
margin: auto;
width: 708px;
height: 100%;
background: url(./img/h1_bg01.webp) no-repeat right center/cover;
}
.privacy span,
.single-title span,
.taxonomy-title span,
.manners__h1 span,
.newproducts__h1 span {
display: inline-block;
position: relative;
}
.privacy span:before,
.single-title span:before,
.taxonomy-title span:before,
.manners__h1 span:after,
.newproducts__h1 span:before {
content: "";
display: block;
position: absolute;
top: -190%;
right: -100%;
width: 112px;
height: 51px;
background: url(./img/h1_right.webp) no-repeat center/cover;
}
@media (max-width: 767px) {
.privacy span:before,
.single-title span:before,
.taxonomy-title span:before,
.manners__h1 span:before,
.newproducts__h1 span:before {
top: -190%;
right: -60%;
width: 80px;
height: 36px;
}
}
.privacy span:after,
.single-title span:before,
.taxonomy-title span:after,
.manners__h1 span:before,
.newproducts__h1 span:after {
content: "";
display: block;
position: absolute;
top: -207%;
left: -192px;
width: 155px;
height: 221px;
background: url(./img/h1_left.webp) no-repeat center/cover;
}
@media (max-width: 767px) {
.privacy span:after,
.single-title span:after,
.taxonomy-title span:after,
.manners__h1 span:after,
.newproducts__h1 span:after {
top: auto;
bottom: -270%;
left: -40%;
width: 80px;
height: 36px;
background: url(./img/h1_right.webp) no-repeat center/cover;
}
}
@media (min-width: 1400px) {
.privacy:before,
.single-title:before,
.taxonomy-title:before,
.manners__h1:before,
.newproducts__h1:before {
left: auto;
right: 0;
}
}
@media (max-width: 767px) {
.privacy,
.single-title,
.taxonomy-title,
.manners__h1,
.newproducts__h1 {
font-size: calc(22px + 8 * (100vw - 320px) / 450);
}
.privacy:before,
.single-title:before,
.taxonomy-title:before,
.manners__h1:before,
.newproducts__h1:before {
background: url(./img/h1_bg01.webp) no-repeat center/cover;
}
}
.privacy_sec01 {
padding: 120px 0;
margin-bottom: 0;
}
@media screen and (max-width: 767px) {
.privacy_sec01 {
padding: 15.64537% 0;
}
}
.privacy_sec01 .row:first-of-type {
margin-bottom: 5%;
}
.privacy_sec01 ol {
list-style: decimal-leading-zero;
}
.privacy_sec01 ul {
list-style: disc;
}
.privacy_sec01 li {
list-style: inherit;
margin-left: 2.3em;
margin-bottom: 1em;
}
.privacy_sec01 .bg_box {
background: #eee;
padding: 3% 5%;
margin-top: 1em;
}
.fax a {
text-decoration: none;
pointer-events: none;
}
.e-catalog_sec01 {
color: #fff;
margin-bottom: 0;
background-image: url(./img/catalog_img01.webp);
background-size: 78%;
background-position: bottom center;
background-repeat: no-repeat;
background-color: #241816;
height: 63vw;
}
.e-catalog_sec01 h1 {
font-size: 3.2rem;
padding: 5vw 0 0;
}
@media screen and (min-width: 768px) {
.e-catalog_sec01 span {
display: none;
}
}
.e-catalog_sec01 .row {
padding-left: 13vw;
padding-right: 13vw;
padding-top: 25.5vw;
}
.e-catalog_sec01 .e-catalog_image {
display: flex;
align-items: flex-end;
justify-content: center;
}
.e-catalog_sec01 .e-catalog_image:nth-child(3) a {
padding-left: 8%;
padding-right: 8%;
}
.e-catalog_sec01 .e-catalog_image:nth-child(4) {
}
.e-catalog_sec01 .e-catalog_image img {
width: 100%;
}
.e-catalog_sec01 .e-catalog_image img.e-catalog_img03.pc-catalog {
margin-bottom: 95%;
}
.e-catalog_sec01 .e-catalog_image img.e-catalog_img05.pc-catalog {
margin-bottom: -4%;
}
.e-catalog_sec01 .e-catalog_image .sp-catalog {
display: none;
}
.e-catalog_sec01 .e-catalog_image img.e-catalog_img03.sp-catalog {
margin-bottom: 69px;
}
.e-catalog_sec01 .e-catalog_image img.e-catalog_img04.sp-catalog {
margin-top: 15px;
}
.e-catalog_sec01 .e-catalog_image img.e-catalog_img05.sp-catalog {
margin-bottom: 14px;
}
@media screen and (max-width: 767px) {
.e-catalog_sec01 {
padding: 20px 0;
background-image: none;
margin-bottom: 375px;
}
.e-catalog_sec01 .row {
padding-top: 21vw;
}
.e-catalog_sec01 .e-catalog_spwrapper {
background-image: url(./img/catalog_img01-sp.webp);
background-size: 100%;
background-position-y: 35vw;
background-repeat: no-repeat;
background-color: #241816;
}
.e-catalog_sec01 h1 {
font-size: 2.4rem;
}
.e-catalog_sec01 .e-catalog_spwrapper p {
padding-left: 15px;
padding-right: 15px;
}
.e-catalog_sec01 .e-catalog_image {
max-height: 400px;
overflow: hidden;
}
.e-catalog_sec01 .e-catalog_image img {
width: 90%;
margin: auto;
}
.e-catalog_sec01 .e-catalog_image .sp-catalog {
display: block;
}
.e-catalog_sec01 .e-catalog_image .pc-catalog {
display: none;
}
.slider-item {
padding-top: 22vw;
}
.slider-item01 {
padding-top: 22vw;
}
.slider-item04 {
padding-top: 22vw;
}
.slick-next {
right: 22vw;
}
.slick-next {
background-image: url(./img/icon_arrow_rev.webp);
background-size: cover;
}
.slick-prev {
left: 23vw;
z-index: 99;
}
.slick-prev {
background-image: url(./img/icon_arrow_rev.webp);
background-size: cover;
transform: scale(-1, 1);
}
.slick-next {
top: 47%;
}
.slick-prev {
top: 45%;
}
.e-catalog_sec01 .slick-list {
padding-bottom: 13px;
}
}
@media (max-width: 767px) {
.e-catalog_sec01 .container {
padding: 50px 1.5rem;
}
}
.e-catalog_sec01 figure {
max-width: 200px;
width: 100%;
margin: auto;
}
.hdr {
background: #fff;
width: 100%;
position: relative;
z-index: 100;
}
.hdr__wrapper {
width: 90%;
margin: auto;
display: flex;
justify-content: space-between;
height: 100px;
align-items: center;
}
.hdr-white {
background-color: #fff;
}
.header__nav {
display: none;
position: absolute;
top: 100%;
right: 0;
z-index: 100;
padding: 0px 30px 40px;
max-width: 1300px;
width: 100%;
transition: all 0.5s;
}
.header__nav > ul {
margin-left: 40px;
max-width: 220px;
width: 100%;
}
.header__nav .header__subtxt {
display: none;
}
.header__nav > ul:first-child {
margin-left: 0px;
}
header .hdr__wrapper .header__nav .sp-box li {
border-bottom: 1px solid #323232;
font-size: 1.5rem;
position: relative;
padding: 7px 30px 7px 7px;
}
@media (min-width: 768px) and (max-width: 1160px) {
.hdr__wrapper {
padding: 0 10px;
}
}
.hdr__wrapper .logo a {
line-height: 1;
}
.hdr__wrapper .logo a img {
vertical-align: middle;
width: 100px;
margin-right: 10px;
}
.hdr__nav > ul > li {
display: inline-block;
}
@media (max-width: 767px) {
.hdr__wrapper .logo a img {
width: 90px;
}
.hdr__wrapper {
height: 76px;
padding: 0 2rem;
width: 100%;
}
.hdr__nav {
position: absolute;
top: 100%;
left: 0;
transition: all 0.3s;
z-index: 100;
max-width: none;
width: 100%;
}
.hdr__nav > ul {
padding: 0 2rem;
}
.hdr__nav > ul > li {
border-bottom: 1px solid #9d1a16;
display: block;
font-weight: bold;
transition: 0.3s;
}
.hdr__nav > ul > li:first-of-type {
border-top: 1px solid #9d1a16;
}
.hdr__nav > ul a {
margin: auto;
display: block;
padding: 1em;
}
}
.hdr__nav > ul {
text-align: center;
}
.hdr__nav > ul li {
display: block;
vertical-align: middle;
}
@media (min-width: 768px) {
.hdr__nav > ul li span {
position: relative;
}
.hdr__nav > ul li span:before {
content: "";
position: absolute;
bottom: -9px;
left: 50%;
transform: translateX(-50%);
width: 8px;
height: 8px;
background: #9d1a16;
border-radius: 50%;
}
.hdr__nav > ul li span:after {
content: "";
position: absolute;
bottom: -6px;
left: 10%;
width: 90%;
height: 2px;
background: #9d1a16;
transition: all 0.3s;
transform: scale(0, 1);
transform-origin: center top;
}
}
.hdr__nav > ul li a {
display: block;
padding: 0.6em 1em;
font-size: 1.6rem;
text-decoration: none;
position: relative;
}
.hdr__nav > ul li a:hover span:after {
transform: scale(1, 1);
}
@media (min-width: 768px) and (max-width: 1024px) {
.hdr__nav > ul li a {
font-size: 1.3rem;
padding: 0.6em 0.5em;
}
}
@media (max-width: 767px) {
.hdr__nav > ul li a {
padding: 1em;
margin: auto;
}
.hdr__nav > ul li a:before {
content: none;
}
}
.hdr__nav > ul li:last-child {
content: none;
}
.openbtn {
position: relative;
cursor: pointer;
width: 45px;
height: 45px;
border-radius: 5px;
z-index: 120;
perspective: 1000;
}
@media screen and (max-width: 767px) {
.openbtn {
width: 50px;
height: 50px;
}
}
.openbtn .openbtn-area {
transition: all 0.4s;
}
.openbtn span {
display: inline-block;
transition: all 0.4s;
position: absolute;
left: 14px;
height: 3px;
border-radius: 2px;
background: white;
width: 45%;
}
.openbtn span:nth-of-type(1) {
top: 15px;
}
.openbtn span:nth-of-type(2) {
top: 23px;
}
.openbtn span:nth-of-type(3) {
top: 31px;
}
.openbtnActive .openbtn-area {
transform: rotateY(-360deg);
}
.openbtnActive span:nth-of-type(1) {
top: 18px;
left: 18px;
transform: translateY(6px) rotate(-135deg);
width: 30%;
}
.openbtnActive span:nth-of-type(2) {
opacity: 0;
}
.openbtnActive span:nth-of-type(3) {
top: 30px;
left: 18px;
transform: translateY(-6px) rotate(135deg);
width: 30%;
}
.hdrnavActive {
display: flex;
background-color: #fff;
}
.hdrnavActive ul li {
list-style: none;
}
.hdrnavActive ul li > a {
color: #333;
text-decoration: none;
display: block;
text-transform: uppercase;
letter-spacing: 0.1em;
text-align: left;
}
@media screen and (min-width: 768px) {
.hdrnavActive ul li > a:hover {
opacity: 0.5;
}
}
.hdrnavActive ul {
animation-name: gnaviAnime;
animation-duration: 1s;
animation-delay: 0.2s;
animation-fill-mode: forwards;
opacity: 0;
}
@keyframes gnaviAnime {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.top-hdr {
background: transparent;
position: fixed;
}
.hdr .openbtn span {
background: #323232;
}
.top-hdr .openbtn span {
background: #fff;
}
.top-hdr .openbtn .active-color {
background: #323232;
}
.whiteColor {
background-color: #fff;
}
.top-hdr .hdr__wrapper .hide {
display: none;
}
.top-hdr .hdr__wrapper .logo-navActive {
display: block;
}
@media screen and (max-width: 1046px) {
.hdr .header__nav .sp-box {
display: none;
}
.header__nav > ul {
margin-left: 0;
}
.header__nav {
display: none;
width: 65vw;
}
.hdrnavActive {
display: block;
right: 0;
transition: all 0.6s;
}
.hdrnavActive ul {
animation-delay: 0.4s;
}
.header__nav > ul {
max-width: 100%;
}
.hdr .hdr__wrapper .header-item {
padding: 3vw 0;
border-top: 1px solid #323232;
}
.header__nav .header__subtxt {
display: block;
}
.hdr .hdr__wrapper .header-item p {
margin-bottom: 0;
}
.hdr .hdr__wrapper .header-item span {
display: block;
position: relative;
}
.hdr .hdr__wrapper .header-item span {
cursor: pointer;
}
.hdr .hdr__wrapper .header-item span:before,
.hdr .hdr__wrapper .header-item span:after {
content: "";
display: block;
width: 20px;
height: 3px;
border-radius: 5px;
background: #323232;
position: absolute;
right: 3vw;
top: -1vw;
transform: translateY(-50%);
}
.hdr .hdr__wrapper .header-item span::after {
transform: translateY(-50%) rotate(90deg);
transition: 0.5s;
}
.hdr .hdr__wrapper .header-item .active::after {
transform: rotate(0);
transition: 0.5s;
}
header .hdr__wrapper .header__nav .sp-box li {
border-bottom: none;
background-image: linear-gradient(
to right,
#323232,
#323232 2px,
transparent 2px,
transparent 8px
);
background-size: 8px 2px;
background-position: left top;
background-repeat: repeat-x;
}
}
@media screen and (max-width: 767px) {
.hdr .hdr__wrapper .header-item span:before,
.hdr .hdr__wrapper .header-item span:after {
top: -4vw;
}
}
@media screen and (max-width: 660px) {
.nav-fix {
position: fixed;
top: 0;
z-index: 1000;
}
.hdrnavActive > ul:last-child > li:last-child {
padding-bottom: 200px;
}
.header__nav {
padding-bottom: 40px;
width: 100%;
height: 110vh;
overflow: auto;
-webkit-overflow-scrolling: touch;
box-sizing: border-box;
}
.scroll-prevent {
display: none;
}
}
@media (min-width: 768px) {
.hdr__nav > ul .under_list {
position: relative;
}
.hdr__nav > ul .under_list .submenu {
display: none;
list-style: none;
position: absolute;
width: 220px;
top: calc(100% + 6px);
top: 100%;
background: rgba(157, 26, 22, 0.8);
z-index: 100;
}
.hdr__nav > ul .under_list .submenu > li {
margin-bottom: 1px;
display: block;
text-align: left;
}
.hdr__nav > ul .under_list .submenu > li a {
padding: 0.6em 24px 0.6em 20px;
transition: 0.3s;
background: #9d1a16;
display: block;
}
.hdr__nav > ul .under_list .submenu > li a:hover {
opacity: 0.8;
}
.hdr__nav > ul .under_list .submenu.submenu_right {
right: 0;
}
}
@media (max-width: 767px) {
.hdr__nav > ul .under_list .submenu {
display: none;
}
.hdr__nav > ul .under_list .submenu > li a {
text-indent: 1em;
}
}
.hdr__nav > ul .under_list > a {
padding-right: 1.2em;
}
.hdr__nav > ul .under_list > a:after {
content: "";
display: block;
position: absolute;
width: 5px;
height: 5px;
top: 44%;
right: 8px;
border-top: 1px solid #323232;
border-right: 1px solid #323232;
transform: rotate(135deg);
transition: 0.2s;
}
@media (max-width: 767px) {
.hdr__nav > ul .under_list > a:after {
top: 38%;
width: 10px;
height: 10px;
right: 5%;
}
}
@media (max-width: 767px) {
.hdr__nav > ul .under_list > a.active:after {
transform: rotate(-45deg);
}
}
.hdr__nav > ul .under_list:hover a:after {
transform: rotate(-45deg);
}
footer {
background-color: #fff;
}
footer .footer_box {
position: relative;
width: 100%;
height: 30px;
background-color: #c8004c;
}
@media (max-width: 767px) {
footer .footer_box {
height: 12px;
}
}
footer .footer_wrap {
max-width: 1140px;
width: 100%;
margin: auto;
padding: 5% 15px 1%;
}
@media screen and (min-width: 768px) {
footer .footer_wrap .nav a:hover {
opacity: 0.5;
}
}
footer .footer_wrap .footer_logo_wrap {
padding-bottom: 45px;
display: flex;
justify-content: space-between;
align-items: end;
}
footer .footer_wrap .footer_logo_wrap .sns {
display: flex;
}
@media screen and (min-width: 768px) {
footer .footer_wrap .footer_logo_wrap .sns a:hover {
opacity: 0.5;
}
}
footer .footer_wrap .footer_logo_wrap .sns li {
width: 40px;
margin-left: 3vw;
}
header .footer_nav_wrap {
padding-top: 40px;
}
footer .footer_nav_wrap {
padding-top: 40px;
border-top: 1px solid #323232;
}
header .footer_nav_wrap nav,
footer .footer_nav_wrap nav {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 5%;
}
footer .footer_nav_wrap nav ul {
max-width: 220px;
width: 100%;
}
header .hdr__wrapper .header__nav ul li > p a,
header .hdr__wrapper .header__nav ul li > p {
font-size: 2rem;
color: #c9004c;
}
footer .footer_nav_wrap .nav ul > a,
footer .footer_nav_wrap .nav ul > p {
color: #c9004c;
}
@media screen and (min-width: 768px) {
header .hdr__wrapper .header__nav ul li > p a:hover {
opacity: 0.5;
}
}
footer .footer_nav_wrap li {
border-bottom: 1px solid #323232;
font-size: 1.4rem;
position: relative;
padding-top: 7px;
padding-bottom: 7px;
padding-right: 30px;
max-width: 200px;
width: 100%;
}
header .hdr__wrapper .header__nav .sp-box li:after,
footer .footer_nav_wrap li:after {
background: url(./img/icon_arrow.webp) no-repeat center/contain;
content: "";
display: block;
position: absolute;
top: 30%;
right: 5px;
margin: auto;
width: 15px;
height: 15px;
}
footer .footer_logo img {
width: 150px;
}
footer .footer_copyright_wrap .row {
justify-content: center;
}
footer .footer_copyright_wrap p {
font-size: 1.3rem;
}
.footer_sp_wrap {
display: none;
}
@media (max-width: 1144px) {
footer .footer_wrap {
padding: 5% 25px 1%;
}
.footer_sp_wrap {
display: block;
width: 80%;
margin: 0 auto;
}
.footer_sp_wrap li {
position: relative;
padding: 15px 0px 15px 17px;
border-bottom: 1px dotted #e6e6e8;
font-size: 1.6rem;
}
.footer_sp_wrap li:before {
position: absolute;
content: "";
background: #fff;
border: 1px solid#c8004c;
left: 0;
top: 23px;
width: 10px;
height: 10px;
display: block;
}
.footer_sp_wrap a:hover {
opacity: 0.5;
}
footer .footer_nav_wrap {
display: none;
}
footer .footer_wrap .footer_logo_wrap {
flex-direction: column-reverse;
align-items: center;
border-bottom: none;
padding-bottom: 30px;
padding-top: 40px;
}
footer .footer_wrap .footer_logo_wrap .footer_logo {
text-align: center;
margin-top: 40px;
position: relative;
width: 80%;
border-top: 1px solid #323232;
border-bottom: 1px solid #323232;
padding: 30px 0px;
}
footer .footer_logo img {
width: 40%;
}
footer .footer_wrap .footer_logo_wrap .sns li {
width: 7vw;
margin-left: 7vw;
}
footer .footer_wrap .footer_logo_wrap .sns li:first-child {
margin-left: 0;
}
footer .footer_nav_wrap ul li a:hover {
opacity: 0.8;
}
footer .footer_logo img {
max-width: 150px;
}
footer .footer_copyright_wrap p {
font-size: 1.1rem;
}
}
@media (max-width: 767px) {
.footer_sp_wrap {
width: 100%;
}
footer .footer_wrap .footer_logo_wrap .footer_logo {
width: 100%;
}
}
.pagetop {
position: relative;
}
.pagetop a {
position: fixed;
bottom: 40px;
right: 4%;
background: url(./img/button_pagetop.webp) no-repeat center/contain;
width: 70px;
height: 70px;
transition: 0.3s;
}
@media (max-width: 767px) {
.pagetop a {
width: 30px;
height: 30px;
bottom: 30px;
z-index: 0;
}
}
.sec01,
.sec02,
.sec03,
.sec04,
.sec05,
.sec06 {
padding: 0;
position: relative;
}
.sec01 .sec01__txt,
.sec02 .sec02__txt,
.sec03 .sec03__txt,
.sec04 .sec04__txt,
.sec05 .sec05__txt {
color: #fff;
position: absolute;
right: 0;
left: 0;
font-size: 2rem;
width: 100%;
}
.sec06 .sec06__txt {
color: #fff;
position: absolute;
right: 0;
left: 0;
font-size: 1.8rem;
width: 100%;
}
.sec01 .sec01-videocontainer {
margin: 0 auto;
width: 100%;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
.sec01 .sec01-videocontainer .sec01__videowrapper {
position: relative;
width: 100vw;
height: 100vh;
overflow: hidden;
}
video {
pointer-events: none;
}
.sec01 .sec01-videocontainer .sec01__videowrapper > video {
position: absolute;
min-width: 100%;
min-height: 100%;
}
@media (aspect-ratio: 16/9), (min-aspect-ratio: 16/9) {
.sec01 .sec01-videocontainer .sec01__videowrapper > video {
width: 100%;
}
}
@media (max-aspect-ratio: 16/9) {
video {
height: 101%;
}
}
.sec01 .sec01__txt {
bottom: 160px;
}
.sec02 .sec02__txt {
bottom: 120px;
}
.sec03 .sec03__txt {
bottom: 60px;
}
.sec04 .sec04__txt,
.sec05 .sec05__txt {
bottom: 50px;
}
.sec06 .sec06__txt {
bottom: 150px;
}
.sec06 .sec06__txt .sec06__txtcustom p {
line-height: 3rem;
}
.sec01 .sec01__txt h2,
.sec02 .sec02__txt h2,
.sec03 .sec03__txt h2,
.sec04 .sec04__txt h2,
.sec05 .sec05__txt h2,
.sec06 .sec06__txt h2 {
font-size: 3.2rem;
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
}
.sec01 .sec01__txt p,
.sec02 .sec02__txt p,
.sec03 .sec03__txt p,
.sec04 .sec04__txt p,
.sec05 .sec05__txt p,
.sec06 .sec0 + __txt p {
margin-bottom: 0;
letter-spacing: 5px;
}
.sec01 .sec01__txt .text-outer:last-child p,
.sec02 .sec02__txt .text-outer:last-child p,
.sec03 .sec03__txt .text-outer:last-child p,
.sec04 .sec04__txt .text-outer:last-child p,
.sec05 .sec05__txt .text-outer:last-child p {
letter-spacing: inherit;
position: relative;
width: 177px;
height: auto;
margin: auto;
padding-left: 30px;
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
}
.sec01 .sec01__txt .text-outer:last-child p::before,
.sec02 .sec02__txt .text-outer:last-child p::before,
.sec03 .sec03__txt .text-outer:last-child p::before,
.sec04 .sec04__txt .text-outer:last-child p::before,
.sec05 .sec05__txt .text-outer:last-child p::before {
position: absolute;
content: "";
display: inline-block;
background-image: url(./img/arrow-bottom.webp);
background-repeat: no-repeat;
background-size: contain;
width: 40px;
height: 40px;
top: 30px;
left: 0;
}
@media screen and (max-width: 767px) {
.sec01 .sec01__txt,
.sec02 .sec02__txt,
.sec03 .sec03__txt {
font-size: 1.8rem;
}
.sec01 .sec01__txt {
bottom: 30%;
}
.sec02 .sec02__txt,
.sec03 .sec03__txt {
bottom: 18%;
}
.sec04 .sec04__txt,
.sec05 .sec05__txt {
bottom: 15%;
}
.sec06 .sec06__txt {
font-size: 1.6rem;
bottom: 19%;
}
.sec01 .sec01__txt h2,
.sec02 .sec02__txt h2,
.sec03 .sec03__txt h2,
.sec04 .sec04__txt h2,
.sec05 .sec05__txt h2,
.sec06 .sec06__txt h2 {
font-size: 2.8rem;
}
.sec01 .sec01__txt .text-outer:last-child p,
.sec02 .sec02__txt .text-outer:last-child p,
.sec03 .sec03__txt .text-outer:last-child p,
.sec04 .sec04__txt .text-outer:last-child p,
.sec05 .sec05__txt .text-outer:last-child p {
padding-top: 60px;
font-size: 2.2rem;
}
.sec01 .sec01__txt .text-outer:last-child p::before,
.sec02 .sec02__txt .text-outer:last-child p::before,
.sec03 .sec03__txt .text-outer:last-child p::before,
.sec04 .sec04__txt .text-outer:last-child p::before,
.sec05 .sec05__txt .text-outer:last-child p::before,
.sec06 .sec06__txt .text-outer:last-child p::before {
width: 30px;
top: 77%;
left: 0;
}
}
@media screen and (max-width: 767px) {
.sec01:before,
.sec02:before,
.sec03:before,
.sec04:before,
.sec05:before {
top: 40vw;
}
}
.sec06 {
color: #fff;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.sec06 .section__title .text-outer > p {
font-size: 2.4rem;
}
.sec06 .section__title .text-outer h1 {
font-size: 4.2rem;
}
.sec07 {
background-color: #d2d2d2;
}
.sec07 .sec07__wrapper {
background: #fff;
margin-top: 100px;
margin-bottom: 100px;
}
@media screen and (min-width: 768px) {
.sec07 .sec07__wrapper a:hover {
opacity: 0.5;
}
}
.sec07 .sec07__wrapper figure img {
display: block;
margin: auto;
width: 100%;
}
.home h2 {
font-size: 3.6rem;
margin-bottom: 3rem;
text-align: center;
position: relative;
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 400;
}
.home h2:after {
content: attr(data-text);
font-family: "Noto Sans", sans-serif;
font-weight: 400;
font-size: 2.9rem;
line-height: 2;
display: block;
}
@media screen and (max-width: 767px) {
.home h2 {
font-size: calc(20px + 16 * (100vw - 320px) / 450);
}
.home h2:after {
font-size: calc(16px + 13 * (100vw - 320px) / 450);
}
.sec06 .section__title > p {
padding-top: 170px;
font-size: 1.6rem;
}
.sec06 .section__title .text-outer h1 {
font-size: 3.2rem;
}
.sec06 .section__title .text-outer > p {
font-size: 2rem;
}
.sec06 .sec06__txt {
padding-left: 2vw;
padding-right: 2vw;
padding-bottom: 0;
bottom: unset;
top: 50%;
transform: translateY(-50%);
}
.sec07 .sec07__wrapper {
margin: 10px 12vw;
}
.sec07 {
padding-top: 15vw;
padding-bottom: 15vw;
}
}
.home .button {
margin-top: 3rem;
}
.newproducts_pager {
margin: auto;
display: flex;
justify-content: center;
}
.newproducts_pager span,
.newproducts_pager a {
border: 1px solid #333;
background: #fff;
color: #333;
padding: 6px 10px;
font-size: 1.2rem;
}
.newproducts_pager span.current,
.newproducts_pager a.current {
background: #333;
color: #fff;
}
.newproducts_pager span:not(:first-child),
.newproducts_pager a:not(:first-child) {
margin-left: 10px;
}
article:last-child > .product_ttlimg {
display: none;
}
form input[type="tel"] {
padding: 10px;
width: 50%;
outline: none;
color: #323232;
}
@media (max-width: 767px) {
form input[type="tel"] {
width: 100%;
}
}
.inputs .checkbox-interest .wpcf7-list-item {
display: block;
}
.wpcf7-box {
display: flex;
margin-top: 3rem;
}
.wpcf7-box input[type="submit"],
.wpcf7-box input[type="button"] {
display: block;
padding: 0.6em 10px;
text-decoration: none;
max-width: 320px;
width: 100%;
margin: auto;
text-align: center;
font-size: 18px;
background-color: #c8004c;
color: #fff;
border: none;
}
@media (min-width: 768px) {
.wpcf7-box input[type="button"] {
margin-right: 10px;
}
}
@media screen and (max-width: 767px) {
.wpcf7-box {
display: block;
}
.wpcf7-box input[type="submit"],
.wpcf7-box input[type="button"] {
font-size: 16px;
padding: 1em 20px;
}
.wpcf7-box input[type="submit"] {
margin-top: 16px;
}
}
.news-single__content img {
height: auto;
}
.info_wrap {
width: 100%;
}
@media screen and (min-width: 992px) {
.contact-btn .arrow .button .news-home {
left: -7%;
}
}
.manners-contents {
padding-bottom: 120px;
}
.manners-contents__h2 {
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 500;
font-size: 4.6rem;
line-height: 2;
text-align: left;
border-bottom: none;
margin-bottom: 1em;
}
@media (max-width: 767px) {
.manners-contents__h2 {
font-size: 2.8rem;
}
}
.manners-contents__h3 {
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 500;
font-size: 3.2rem;
line-height: 1.6;
text-align: left;
margin-bottom: 1em;
position: relative;
background-color: #e6deb3;
}
.manners-contents__h3:before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-45%);
left: 0;
margin: auto;
display: block;
width: 4px;
height: 22px;
background: #cb5353;
}
.manners-contents__h3:before {
content: "";
position: absolute;
top: 45%;
left: -30%;
margin: auto;
display: block;
width: 30%;
height: 51.2px;
background: #e6deb3;
}
.manners-contents__h3:after {
content: "";
position: absolute;
top: 0;
right: -20%;
margin: auto;
display: block;
width: 30%;
height: 51.2px;
background: #e6deb3;
}
@media (max-width: 767px) {
.manners-contents__h3 {
font-size: 1.8rem;
}
.manners-contents__h3:before {
height: 28.8px;
}
.manners-contents__h3:after {
height: 28.8px;
}
}
.manners-contents__h4 {
font-family: "小塚明朝 Pr6N", "Noto Serif JP", serif;
font-weight: 500;
font-size: 1.8rem;
line-height: 1.6;
text-align: left;
padding-left: 1em;
margin-bottom: 1em;
position: relative;
}
.manners-contents__h4:before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-16%);
left: 0;
margin: auto;
display: block;
width: 10px;
height: 2px;
background: #cb5353;
}
@media (max-width: 767px) {
.manners-contents__h4 {
font-size: 1.7rem;
}
}
.manners-contents__ttl {
font-family:
"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
Osaka, "MS Pゴシック", "MS PGothic", sans-serif;
font-weight: 700;
margin-bottom: 4px;
}
.manners-contents [class^="col"] > p:last-child {
margin-bottom: 0;
}
.manners-contents__ul {
list-style: disc;
padding-left: 2em;
margin: 1.5rem 0;
}
.manners-contents__ol {
padding-left: 2em;
margin: 1.5rem 0;
}
.manners-contents__youtube {
position: relative;
padding-top: 56.25%;
height: 0;
}
.manners-contents__youtube iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.manners-contents .yuinou_ol li {
line-height: 2;
}
.manners-contents .yuinou_ul {
list-style: none;
}
.manners-contents .yuinou_ul li {
margin-bottom: 8px;
}
.manners-contents .manners-sou .manners-contents__h2 {
border-color: #aaa;
}
.manners-contents__li.manners-contents-br {
padding-bottom: 15px;
}
.manners-contents .manners-sou .manners-contents__h4:before {
background-color: #aaa;
}
.movie_sec02 h2 img,
.movie_sec04 h2 img,
.movie_sec06 h2 img,
.movie_sec04 h2 img,
.movie_sec06 h2 img {
width: 100px;
}
@media (max-width: 767px) {
.movie_sec02 h2 img,
.movie_sec04 h2 img,
.movie_sec06 h2 img,
.movie_sec04 h2 img,
.movie_sec06 h2 img {
padding-right: 6px;
width: 80px;
}
.movie_sec02 h2,
.movie_sec04 h2,
.movie_sec06 h2,
.movie_sec04 h2,
.movie_sec06 h2 {
font-size: 1.8rem;
}
}
.btn_nav_product {
font-size: initial !important;
}
@media screen and (min-width: 768px) {
.start {
overflow-y: hidden;
margin-top: -29px;
margin-bottom: -29px;
}
.start .start__image {
padding-top: 30px;
padding-bottom: 30px;
}
.start .start__txt {
margin-top: 30px;
margin-bottom: 30px;
}
}
.start .start__image {
background-color: #a9a9a9;
}
.start .start__image img {
max-width: 350px;
width: 100%;
}
.start .start__txt {
background-color: #eff3f4;
padding-left: 45px;
padding-right: 45px;
}
.start .start__container p {
font-size: 2rem;
}
.start p {
font-size: 1.6rem;
margin-bottom: 2rem;
}
@media screen and (max-width: 767px) {
.start {
background-color: #eff3f4;
}
.start .start__image img {
width: 55vw;
}
.start .start__txt {
padding-left: 15px;
padding-right: 15px;
}
}
.craft__image {
background-color: #a9a9a9;
}
.craft__image .craft-img {
width: 100%;
}
@media screen and (max-width: 767px) {
.craft__image .craft-img {
width: 88vw;
}
}
.pray-underlayersec01,
.pray-underlayersec02 {
font-size: 2.2rem;
}
.pray-underlayersec01 h3 {
font-size: 2.8rem;
font-weight: 600;
}
.pray-underlayersec02 {
border-top: 1px solid #323232;
}
.pray-underlayersec02
.pray-underlayersec02__item:nth-child(2n + 1)
> .pray-underlayersec02__title,
.pray-underlayersec02
.pray-underlayersec02__item:nth-child(2n)
.pray-underlayersec02__item-txt {
color: #fff;
background-color: #9b3f54;
}
.pray-underlayersec02
.pray-underlayersec02__item
> .pray-underlayersec02__title,
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt {
display: flex;
justify-content: center;
align-items: center;
height: 23vw;
}
.pray-underlayersec02 .pray-underlayersec02__item h4 {
font-size: 2.8rem;
font-weight: 600;
}
.pray-underlayersec02 .pray-underlayersec02__item p {
padding-left: 20px;
}
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt
ul {
list-style: disc;
}
@media screen and (max-width: 991px) {
.pray-underlayersec02 .pray-underlayersec02__item h4 {
font-size: 2.4rem;
}
.pray-underlayersec02 .pray-underlayersec02__item p {
padding-left: 10px;
font-size: 1.6rem;
}
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt {
justify-content: left;
font-size: 1.6rem;
}
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt
ul {
padding-left: 30px;
}
}
@media screen and (max-width: 767px) {
.pray-underlayersec01,
.pray-underlayersec02 {
font-size: 1.6rem;
}
.pray-underlayersec02 {
border-top: none;
}
.pray-underlayersec01 h3 {
font-size: 2rem;
}
.pray-underlayersec02 .pray-underlayersec02__item h4 {
font-weight: normal;
}
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__title {
color: #fff;
background-color: #9b3f54;
}
.pray-underlayersec02
.pray-underlayersec02__item:nth-child(2n)
.pray-underlayersec02__item-txt {
color: #323232;
background-color: inherit;
}
.pray-underlayersec02
.pray-underlayersec02__item
> .pray-underlayersec02__title,
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt {
height: 100%;
justify-content: left;
}
.pray-underlayersec02 .pray-underlayersec02__item h4 {
font-size: 2.2rem;
}
.pray-underlayersec02 .pray-underlayersec02__item p {
padding-left: 0;
}
.pray-underlayersec02
.pray-underlayersec02__item
.pray-underlayersec02__item-txt
ul {
padding-left: 15px;
}
}
.what {
font-size: 2.2rem;
}
.what__title h2 {
margin-top: 80px;
margin-bottom: 20px;
}
.what__table {
width: 100%;
margin-top: 60px;
}
.what__table thead tr th {
background-color: #a0a0a0;
color: #fff;
font-size: 1.8rem;
padding-top: 6px;
padding-bottom: 6px;
}
.what__table thead tr th:last-child {
border-left: 2px solid #fff;
}
.what__table thead {
border-bottom: 2px solid #fff;
text-align: center;
}
.what__table tbody tr {
border-bottom: 2px solid #fff;
}
.what__table tbody tr th {
background-color: #003a73;
color: #fff;
text-align: center;
padding: 1.5rem 1rem 1.5rem 1rem;
width: 30vw;
}
.what__table tbody tr:nth-child(2n) th {
background-color: #1c4c8c;
}
.what__table tbody tr td {
background-color: #ddd;
border-left: 1px solid #fff;
padding: 1vw 2vw 1vw 3vw;
}
.what__table tbody tr:nth-child(2n) td {
background-color: #ececec;
}
@media screen and (max-width: 767px) {
.what {
font-size: 1.6rem;
}
.what .what__container {
flex-direction: column-reverse;
}
.what .what__container .what__image {
padding-bottom: 20px;
}
.what__table {
font-size: 1.3rem;
}
.what__table thead tr th {
font-size: 1.4rem;
}
}
@media screen and (max-width: 768px) {
.what__table tbody tr th {
padding: 0;
}
}
.howto {
padding-bottom: 130px;
}
.howto .howto__item .howto__item-txt .howto__txt {
font-size: 1.4vw;
}
.howto .howto__item .howto__item-txt h3 {
color: #9a3f52;
font-size: 2.3vw;
}
.howto .howto__item .howto__item-txt {
padding-top: auto;
padding-bottom: auto;
padding: 45px 30px 0px;
}
@media screen and (max-width: 768px) {
.howto .howto__item .howto__item-txt .howto__txt {
font-size: 1.4rem;
}
.howto .howto__item .howto__item-txt {
padding: 20px 15px 0px;
}
}
@media screen and (max-width: 767px) {
.howto {
font-size: 1.3rem;
padding-bottom: 50px;
}
.howto .howto__item .howto__item-txt h3 {
font-size: 2rem;
}
.howto .howto__item:nth-child(2n) {
flex-direction: column-reverse;
padding-left: 15px;
}
.howto .howto__item {
padding-top: 20px;
}
.howto .howto__item:nth-child(2n) .howto__item-txt {
padding-left: 0px;
}
}
.history {
padding-bottom: 130px;
}
.history h3 {
font-weight: 800;
}
.history .history__movie {
background-color: #1f4c8c;
width: 100%;
}
@media screen and (max-width: 500px) {
.history .history__movie {
width: 110%;
margin-left: -4vw;
margin-right: -4vw;
}
}
.history .history__movie #player_contents {
padding-top: 46.6%;
position: relative;
max-width: 920px;
width: 100%;
margin: auto;
overflow: hidden;
}
.history .history__movie #player_contents iframe {
left: 0;
position: absolute;
top: 50%;
width: 100% !important;
transform: translateY(-50%);
height: calc(100% + 60%);
}
@media screen and (max-width: 499px) {
.history .history__movie #player_contents {
padding-top: 56%;
}
}
@media screen and (max-width: 767px) {
.history {
padding-bottom: 50px;
}
}
.idomu .idomu__image {
background-color: #002454;
position: relative;
}
.idomu .idomu__image img {
width: 75%;
margin-left: -30px;
}
.idomu .idomu__image p {
color: #fff;
font-size: 2rem;
position: absolute;
top: 50%;
right: 16vw;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
line-height: 4rem;
letter-spacing: 3px;
}
.idomu .idomu__image:after {
content: url(./img/challenge_img-idomu.webp);
position: absolute;
transform: scale(1.4);
top: 20vw;
left: 102%;
width: 100%;
height: 100%;
}
.idomu .idomu__title {
background-color: #9fa0a0;
padding-top: 75px;
}
.idomu__title {
position: relative;
}
.idomu__title h1 {
font-size: 4rem;
color: #fff;
font-weight: normal;
padding-bottom: 7rem;
text-align: center;
}
.tunagu__title .box {
position: absolute;
top: 0;
right: 0;
height: 268px;
background-color: #b5b5b6;
background-image:
linear-gradient(-90deg, #9fa0a0 50%, transparent 50%),
linear-gradient(#9fa0a0 50%, transparent 50%);
background-size: 10px 10px;
}
.idomu__title .box {
position: absolute;
top: 0;
right: 0;
height: 250px;
background-color: #b5b5b6;
background-image:
linear-gradient(-90deg, #9fa0a0 50%, transparent 50%),
linear-gradient(#9fa0a0 50%, transparent 50%);
background-size: 10px 10px;
}
@media screen and (max-width: 767px) {
.idomu__title .box {
width: 45%;
height: 70%;
}
}
.idomu-top {
position: relative;
}
.idomu-top .idomu-top__image img {
width: 1000px;
}
.idomu-top .idomu-top__txt {
position: absolute;
left: 50vw;
}
.idomu-top .idomu-top__txt .top-title {
font-size: 2.4rem;
}
.idomu-top .idomu-top__txt h2 {
font-size: 4.2rem;
font-family: "LucidaSans Italic", "Helvetica", serif;
}
.idomu-top .idomu-top__txt h3 {
font-family: "Helvetica", serif;
}
.idomu-top .idomu-top__txt p {
padding-top: 30px;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.idomu-top .idomu-top__txt .idomu-top__sign {
padding-left: 10vw;
}
.idomu-top .idomu-top__txt .idomu-top__sign img {
width: 50%;
}
.idomu-top .idomu-top__txt .idomu-top__sign img:last-child {
display: none;
}
.idomu-top .idomu-top__txt .idomu-top__btn {
text-align: right;
padding-top: 75px;
}
.more {
margin-bottom: 100px;
}
.more .more__item .more__txt {
padding-left: 30px;
}
.more .more__item .more__txt h2 {
font-size: 2.8rem;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
padding-top: 20px;
}
@media screen and (min-width: 769px) {
.more .more__item .more__txt h2 {
padding-top: 30px;
}
}
.more .more__item .more__txt > p {
font-size: 1.5rem;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
@media screen and (max-width: 767px) {
.more .more__item .more__txt > p {
font-size: 1.4rem;
}
.idomu-top .idomu-top__txt .idomu-top__btn {
padding-top: 30px;
}
}
.idomu-top__btn a span {
font-family: "Helvetica", serif;
}
.more .more__item:after {
content: "";
margin-top: 50px;
width: 100%;
height: 1px;
background-color: #323232;
}
.more__txt h3:before {
position: absolute;
content: "";
background: #c8004c;
left: 0;
top: 5px;
width: 12px;
height: 12px;
display: block;
}
.more__txt h3 {
font-size: 1.8rem;
position: relative;
padding-left: 20px;
color: #c8004c;
font-family: "Helvetica", serif;
}
.more__txt .more__button {
margin-left: auto;
margin-right: 0;
font-family: "Helvetica", serif;
font-size: 1.6rem;
}
@media screen and (min-width: 768px) {
.idomu-top .idomu-top__txt h2 {
padding-top: 13vw;
}
.idomu-top .idomu-top__txt .idomu-top__btn {
padding-top: 40px;
}
.idomu-top .idomu-top__txt {
top: 10vw;
}
.idomu__title .box,
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
width: 29vw;
}
.more__txt .more__button .button-oppose {
padding-right: 47px;
}
}
@media screen and (min-width: 811px) {
.idomu__title .box,
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
width: 28vw;
}
}
@media screen and (min-width: 1090px) {
.idomu__title .box,
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
width: 27.2vw;
}
}
@media screen and (min-width: 992px) {
.idomu-top .idomu-top__txt .idomu-top__btn {
padding-top: 75px;
}
.idomu-top .idomu-top__txt {
top: 270px;
}
}
@media screen and (max-width: 991px) {
.idomu-top .idomu-top__txt {
top: 12vw;
}
.idomu-top .idomu-top__txt h2 {
font-size: 3.2rem;
}
.idomu-top .idomu-top__txt .idomu-top__sign {
text-align: right;
}
}
.tunagu-main {
background-color: #e0e1e1;
padding-bottom: 130px;
font-size: 1.6rem;
}
.tunagu .tunagu__image {
background-color: #608323;
position: relative;
}
.tunagu .tunagu__image img {
width: 75%;
margin-left: -30px;
}
.tunagu .tunagu__image p {
color: #fff;
font-size: 2rem;
position: absolute;
top: 24vw;
right: 14.2vw;
line-height: 4rem;
letter-spacing: 3px;
}
.tunagu .tunagu__image:after {
content: url(./img/connect_img-tunagu.webp);
position: absolute;
top: 17vw;
left: 105%;
width: 100%;
height: 100%;
transform: scale(1.4);
}
.tunagu .tunagu__title {
background-color: #9fa0a0;
}
.tunagu__title {
position: relative;
}
.tunagu__title h1 {
font-size: 4rem;
color: #fff;
font-weight: normal;
padding-bottom: 7rem;
text-align: center;
padding-top: 150px;
}
.tunagu__h2 {
font-size: 2.8rem;
color: #c9004c;
text-align: center;
padding-top: 120px;
}
.sdgs .sdgs__explan .sdgs__txt {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.sdgs .sdgs__explan .sdgs__txt p:first-child {
font-weight: 600;
font-size: 2rem;
}
.sdgs_h3 {
font-size: 2.6rem;
padding-top: 100px;
font-weight: 600;
}
.sdgs__images.row {
align-items: flex-start;
}
@media screen and (max-width: 1119px) {
.tunagu .tunagu__image:after {
transform: scale(1.2);
top: 23%;
left: 95%;
}
}
@media screen and (max-width: 940px) {
.tunagu .tunagu__image:after {
top: 14%;
}
}
@media screen and (max-width: 840px) {
.tunagu .tunagu__image:after {
top: 5vw;
left: 90%;
}
}
@media screen and (max-width: 767px) {
.tunagu-main {
padding-bottom: 50px;
}
.tunagu__h2 {
padding-top: 50px;
}
.inoru .inoru__image img,
.tunagu .tunagu__image img,
.hiraku .hiraku__image img,
.idomu .idomu__image img {
display: none;
}
.tunagu .tunagu__image {
height: 400px;
background: url(./img/connect_img01-sp.webp);
background-repeat: no-repeat;
background-position: 48% 50%;
margin: 0 auto;
background-size: cover;
}
.tunagu .tunagu__image:after {
content: url(./img/connect_img-tunagu.webp);
position: absolute;
width: 83px;
height: 295px;
top: 0;
left: 0;
right: 0;
width: 83px;
height: 295px;
transform: scale(0.8);
margin: auto;
}
.tunagu .tunagu__image p {
width: 230px;
font-size: 1.4rem;
position: absolute;
top: 73%;
right: 0;
left: 0;
text-align: center;
line-height: 2.5rem;
margin: auto;
}
.tunagu__title h1 {
font-size: 6.5vw;
padding-top: 10vw;
padding-bottom: 7vw;
}
.sdgs__explan-image {
background-color: #fff;
text-align: center;
}
.sdgs__explan img {
width: 70%;
}
.sdgs__explan .sdgs__txt {
padding-top: 20px;
}
.sdgs_h3 {
font-size: 2.3rem;
padding-top: 60px;
}
}
.guideline .guideline__container {
background-color: #fff;
padding: 50px 7vw;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.guideline .guideline__images img:first-child {
display: none;
}
.guideline .guideline__list img {
display: block;
padding-right: 10px;
}
.guideline .guideline__list .guideline__item {
border-bottom: 1px solid #231815;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.guideline .guideline__list .guideline__item .guideline__txt {
display: flex;
align-items: center;
}
.guideline .guideline__list .guideline__item .guideline__txt .subheading {
color: #0097da;
font-size: 2rem;
font-weight: 600;
}
.guideline .guideline__list .guideline__item .guideline__txt .subheading-green {
color: #006934;
font-size: 2.2rem;
font-weight: 600;
}
@media screen and (max-width: 767px) {
.guideline .guideline__container {
background-color: #fff;
padding: 20px 2vw;
}
.guideline .guideline__images img:first-child {
display: inline-block;
padding-left: 0;
padding-right: 0;
}
.guideline .guideline__images img:last-child {
display: none;
}
.guideline .guideline__list .guideline__item .guideline__txt .subheading {
font-size: 1.8rem;
}
.guideline
.guideline__list
.guideline__item
.guideline__txt
.subheading-green {
font-size: 1.8rem;
}
}
.wrapper {
background-color: #e0e1e1;
padding-bottom: 130px;
}
.hiraku .hiraku__image {
background-color: #007558;
position: relative;
}
.hiraku .hiraku__image:after {
content: url(./img/pioneer_img-hiraku.webp);
position: absolute;
top: 17vw;
left: 105%;
width: 100%;
height: 100%;
transform: scale(1.5);
}
.service {
padding-top: 120px;
font-size: 2.6rem;
text-align: center;
}
.service img {
max-width: 900px;
}
.ser-container1 ul,
.ser-container2 ul,
.ser-container3 ul {
padding-right: 15px;
padding-left: 15px;
}
.ser-container3 h3 {
font-size: 2.2rem;
font-weight: 600;
}
.ser-container3 .ser-container3__images li {
position: relative;
}
.ser-container3 .ser-container3__images p {
position: absolute;
top: 10px;
left: 10px;
color: #fff;
}
.ser-container4,
.ser-container5 {
padding-top: 200px;
}
.ser-container4 > p,
.ser-container5 > p {
font-size: 2.6rem;
}
.ser-container4 .ser-container4wrapper {
background-color: #fff;
}
.ser-container4 .ser-container4wrapper .ser-container4__worries {
padding: 3vw;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
width: 100%;
}
.ser-container4 .ser-container4__worries .check-image {
text-align: right;
}
.ser-container4 .ser-container4__worries li {
align-items: center;
}
.ser-container4 .ser-container4__worries li img {
width: 35px;
padding-top: 5px;
padding-bottom: 1rem;
}
.ser-container5__image {
padding-left: 0;
padding-right: 0;
}
.ser-container5 .ser-container5__contact ul {
background-color: #fff;
padding: 5vw 6vw 0;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
font-size: 2.2rem;
}
.ser-container5 .ser-container5__contact ul li {
position: relative;
padding-left: 25px;
}
.ser-container5 .ser-container5__contact ul li:before {
position: absolute;
content: "";
background: #323232;
left: 0;
top: 8px;
width: 18px;
height: 18px;
display: block;
border-radius: 50%;
}
.contact-btn a span {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.ser-container7 .ser-container7__image {
max-width: 800px;
margin: auto;
padding-top: 150px;
padding-bottom: 30px;
}
.ser-container7 .ser-container7__button {
margin-left: auto;
margin-right: auto;
}
.ser-container7 .ser-container7__button .button-oppose {
border-radius: 30px;
padding-left: 0;
padding-right: 0;
}
.ser-container7 .ser-container7__button .arrow-oppose a span {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.ser-container7 .ser-container7__button .arrow-oppose a:after {
display: none;
}
@media screen and (max-width: 1155px) {
.hiraku .hiraku__image:after {
transform: scale(1.2);
top: 13vw;
left: 94vw;
}
}
@media screen and (max-width: 991px) {
.ser-container5 .ser-container5__contact ul {
padding-top: 4%;
font-size: 1.6rem;
}
.ser-container5 .ser-container5__contact ul li:before {
top: 5px;
width: 15px;
height: 15px;
}
}
@media screen and (max-width: 920px) {
.hiraku .hiraku__image:after {
transform: scale(1);
top: 3vw;
left: 80vw;
}
}
@media screen and (max-width: 767px) {
.wrapper {
padding-bottom: 50px;
}
.hiraku .hiraku__image:after {
content: url(./img/pioneer_img-hiraku.webp);
position: absolute;
top: 0;
left: 0;
right: 0;
width: 97px;
height: 307px;
transform: scale(0.8);
margin: auto;
}
.hiraku .hiraku__image {
height: 400px;
background: url(./img/pioneer_img01-sp.webp);
background-repeat: no-repeat;
background-position: 30% 50%;
margin: 0 auto;
background-size: cover;
}
.service {
font-size: 2rem;
}
.ser-container3 h3 {
font-size: 2rem;
}
.ser-container4,
.ser-container5 {
padding-top: 80px;
}
.ser-container4 > p,
.ser-container5 > p {
font-size: 2rem;
}
.ser-container4 .ser-container4wrapper {
padding: 25px 15px;
}
.ser-container4 .ser-container4wrapper.row {
align-items: flex-start;
}
.ser-container4 .ser-container4wrapper .ser-container4__worries {
padding: 5vw;
margin-left: -15px;
margin-right: -15px;
width: fit-content;
}
.ser-container4 .ser-container4__worries li img {
width: 20px;
}
.ser-container4 .ser-container4__images {
background-color: #fff;
}
.ser-container5 .ser-container5__contact ul li:before {
top: 5px;
width: 15px;
height: 15px;
}
.ser-container5__image {
background-color: #fff;
padding-bottom: 40px;
padding-left: 15px;
padding-right: 15px;
}
.ser-container6 > p:last-child {
font-size: 1.2rem;
}
.ser-container7 .ser-container7__image {
padding-top: 80px;
}
}
.inoru .inoru__image {
background-color: #6d2f2d;
position: relative;
}
.inoru .inoru__image img,
.hiraku .hiraku__image img {
width: 75%;
margin-left: -30px;
}
.inoru .inoru__image p,
.hiraku .hiraku__image p,
.inoru .inoru__image p {
color: #fff;
font-size: 2rem;
position: absolute;
top: 20vw;
right: 14.2vw;
line-height: 4rem;
letter-spacing: 3px;
}
.inoru .inoru__image:after {
content: url(./img/pray_img-inoru.webp);
position: absolute;
top: 17vw;
left: 105%;
width: 100%;
height: 100%;
transform: scale(1.5);
}
.inoru .inoru__title,
.hiraku .hiraku__title {
background-color: #9fa0a0;
position: relative;
}
.inoru__title h1,
.hiraku__title h1 {
font-size: 4rem;
color: #fff;
font-weight: normal;
padding-bottom: 7rem;
padding-left: 115px;
}
@media screen and (max-width: 767px) {
.inoru__title h1,
.hiraku__title h1 {
padding-left: 0px;
}
}
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
position: absolute;
top: 0;
right: 0;
}
.hiraku__title .box img {
height: 37.8vw;
object-fit: cover;
}
.inoru .pv__txt p,
.hiraku .pv__txt p {
position: relative;
z-index: 10;
line-height: 2.2;
}
@media screen and (max-width: 767px) {
.inoru .pv__txt .sp-only,
.hiraku .pv__txt .sp-only {
display: none;
}
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
height: 85%;
}
.inoru__title .box,
.hiraku__title .box,
.tunagu__title .box {
background-color: #b5b5b6;
background-image:
linear-gradient(-90deg, #9fa0a0 50%, transparent 50%),
linear-gradient(#9fa0a0 50%, transparent 50%);
background-size: 5px 5px;
width: 48vw;
}
.hiraku__title .box img,
.inoru__title .box img {
display: none;
}
.inoru .pv__txt p:last-child {
display: inline;
}
}
.inoru .pv__txt,
.hiraku .pv__txt {
background-color: #7e7d7d;
color: #fff;
padding-left: 115px;
padding-bottom: 140px;
}
.pray {
padding-top: 120px;
text-align: center;
}
.pray .pray__title {
font-size: 2.6rem;
}
.pray .pray__title h2 {
font-size: 2.4rem;
color: #fff;
background-color: #c8004c;
padding-top: 5px;
padding-bottom: 5px;
}
.pray .pray__title h3 {
font-size: 4.2rem;
margin-top: 15px;
}
.pray__color {
color: #c8004c;
}
.pray .pray__title img {
padding-left: 30px;
padding-right: 30px;
width: 80%;
}
@media screen and (max-width: 767px) {
.pray .pray__title img {
padding-left: 0px;
padding-right: 0px;
width: 100%;
}
}
.inoru_wrapper,
.ser-container1,
.ser-container2 {
background-color: #e0e1e1;
}
.inoru_wrapper {
padding-bottom: 130px;
}
.ser-container2 .pack-img-sp {
display: none;
}
@media screen and (max-width: 767px) {
.inoru_wrapper {
padding-bottom: 50px;
}
.ser-container2 .pack-img {
display: none;
}
.ser-container2 .pack-img-sp {
display: inline-block;
}
}
@media screen and (min-width: 992px) {
.inoru_wrapper .arrow .button span,
.contact-btn .arrow .button span {
left: -15%;
}
}
.inoru__h2,
.ser-container1 h2,
.ser-container2 h2,
.ser-container3 h2,
.ser-container6 h2 {
color: #c9004c;
text-align: center;
padding-top: 120px;
}
.ofuda__txt {
font-size: 2.4rem;
text-align: center;
}
@media screen and (min-width: 768px) {
.ofuda__txt .sp-only {
display: none;
}
}
.ofuda__img {
background-color: #d1d0d8;
padding: 20px 120px;
}
.ofuda .ofuda__wrapper {
margin-top: 80px;
}
.ofuda .ofuda__wrapper .ofuda__item {
padding-left: 15px;
padding-right: 15px;
}
.ofuda .ofuda__wrapper .ofuda__item h3 {
color: #c8004c;
border-bottom: 1px solid #c8004c;
}
.ofuda .ofuda__wrapper .ofuda__item .inoru__whitewrapper p {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.inoru__whitewrapper {
background-color: #fff;
padding: 30px;
}
@media screen and (max-width: 767px) {
.inoru__whitewrapper {
padding: 28px;
}
}
.ofuda .ofuda__wrapper .ofuda__item .ofuda__itemwrapper h3 {
font-weight: 600;
}
.ofuda__gallery {
padding-top: 60px;
}
.ema h4,
.section1 h4,
.section2 h4 {
font-size: 2.2rem;
font-weight: 600;
}
.enshrine h3 {
font-size: 2.8rem;
color: #c9004c;
text-align: center;
border-bottom: 1px solid #c8004c;
}
.enshrine p {
font-size: 2.4rem;
}
.enshrine .enshrine__list li {
position: relative;
padding-left: 55px;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.enshrine .enshrine__list li:before {
position: absolute;
content: "";
background: #323232;
left: 30px;
top: 9px;
width: 14px;
height: 14px;
display: block;
}
.enshrine .enshrine__container .detail__btn {
padding-left: 25px;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
@media screen and (max-width: 767px) {
.enshrine__img {
padding-bottom: 30px;
}
}
.entrust {
margin-top: 200px;
}
.entrust h5 {
font-size: 2.8rem;
}
.entrust .entrust__wrapper {
background-color: #9fa0a0;
padding-top: 6vw;
}
.entrust .entrust__img {
background-color: #fff;
text-align: center;
}
.entrust .entrust__img img {
max-width: 300px;
width: 22vw;
padding-top: 3vw;
}
.entrust .entrust__container {
max-height: 400px;
height: 30vw;
}
.entrust .entrust__container .entrust__wrapper {
text-align: center;
}
.entrust .entrust__container .entrust__wrapper p {
width: 100%;
color: #fff;
font-size: 2.2vw;
}
.entrust .entrust__container .entrust__wrapper .big {
font-size: 5vw;
}
.section2 {
padding: 50px;
display: flex;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.section1 {
padding: 50px;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
display: grid;
grid-template-columns: auto 18%;
}
.section1__container-h4 {
grid-row: 1/2;
}
.section1 .section1__container1 {
grid-row: 2/3;
}
.section1 .section1__container2 {
grid-row: 3/4;
}
.section1 .section1__container2 .sp-only {
display: none;
}
.section1 .section1__img {
margin-left: 30px;
grid-row: 1/4;
}
@media screen and (max-width: 767px) {
.section1 {
grid-template-columns: auto 33%;
row-gap: 20px;
}
.section1__container-h4 {
grid-column: 1/3;
}
.section1 .section1__container1 {
grid-row: 2/3;
}
.section1 .section1__img {
margin-left: 15px;
grid-row: 2/3;
}
.section1 .section1__container2 {
grid-column: 1/3;
grid-row: 3/4;
}
.section1 .section1__container2 .h4-sp {
font-size: 1.6rem;
}
}
.section2 .section2__inner > p {
width: 81%;
margin-top: -12%;
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
.ofuda .inoru__whitewrapper {
height: 450px;
}
}
@media screen and (max-width: 1080px) {
.section2 .section2__inner > p {
margin-top: 0;
}
}
.section2 .section2__inner .section2__container {
justify-content: space-between;
}
.section2 .section2__inner .section2__contain {
justify-content: space-between;
display: grid;
grid-template-columns: auto 30%;
grid-template-rows: 12% auto;
column-gap: 10px;
}
.section2 .section2__inner .section2__contain .section2__container1 {
grid-column: 1/2;
}
.section2 .section2__inner .section2__contain .section2__container2 {
grid-column: 1/2;
}
.section2 .section2__inner .section2__contain .section2__img {
grid-column: 2/3;
grid-row: 1/3;
margin-left: auto;
margin-right: 0;
}
@media screen and (max-width: 767px) {
.section2 .section2__inner .section2__contain {
row-gap: 15px;
}
.section2 .section2__inner .section2__contain .section2__container1 {
grid-column: 1/3;
}
.section2 .section2__inner .section2__contain .section2__container2 {
grid-row: 2/3;
}
.section2 .section2__inner .section2__contain .section2__img {
grid-row: 2/3;
width: 100%;
}
}
.section2 .section2__img {
width: 50%;
}
.section2 .fsc {
color: #006934;
font-weight: 600;
}
.inoru__button {
margin-left: auto;
margin-right: 0;
}
.inoru_wrapper .contact-btn {
padding-left: 0;
padding-right: 0;
}
@media screen and (max-width: 1080px) {
.inoru .inoru__image:after {
top: 8vw;
left: 88vw;
transform: scale(1.2);
}
}
@media screen and (max-width: 991px) {
.ofuda .ofuda__wrapper .ofuda__item {
padding-bottom: 20px;
}
}
@media screen and (max-width: 900px) {
.inoru .inoru__image:after {
top: 4vw;
left: 79vw;
transform: scale(1);
}
.enshrine .enshrine__container .detail__btn {
padding-left: 0;
padding-right: 0;
}
}
@media screen and (max-width: 767px) {
.inoru__button .button {
text-align: left;
padding-left: 35px;
}
.inoru .inoru__image {
height: 400px;
background: url(./img/pray_img01-sp.webp);
background-repeat: no-repeat;
background-position: 48% 50%;
margin: 0 auto;
background-size: cover;
}
.inoru .inoru__image:after {
content: url(./img/pray_img-inoru.webp);
position: absolute;
width: 83px;
height: 295px;
top: 0;
left: 0;
right: 0;
width: 126px;
height: 294px;
transform: scale(0.8);
margin: auto;
}
.inoru .inoru__image p,
.hiraku .hiraku__image p,
.idomu .idomu__image p {
width: 230px;
font-size: 1.4rem;
position: absolute;
top: 73%;
right: 0;
left: 0;
text-align: center;
line-height: 2.5rem;
margin: auto;
}
.idomu .idomu__image p {
top: 80%;
}
.inoru__title h1,
.hiraku__title h1,
.idomu__title h1 {
font-size: 6.5vw;
padding-top: 10vw;
padding-bottom: 7vw;
padding-left: 0;
text-align: center;
}
.inoru .pv__txt,
.hiraku .pv__txt {
padding-left: 15px;
padding-right: 15px;
padding-bottom: 100px;
}
.pray {
padding-top: 70px;
}
.pray .pray__title h2 {
font-size: 1.6rem;
}
.pray .pray__title {
font-size: 1.8rem;
}
.pray .pray__title h3 {
font-size: 2.8rem;
}
.pray .pray__title img {
padding-left: 0;
padding-right: 0;
}
.inoru__h2,
.ser-container1 h2,
.ser-container2 h2,
.ser-container3 h2,
.ser-container6 h2 {
padding-top: 80px;
}
.ofuda__txt {
font-size: 1.8rem;
}
.ofuda__img {
padding: 0;
}
.ofuda__gallery {
padding-top: 0px;
}
.enshrine {
width: 94%;
}
.enshrine h3 {
font-size: 1.8rem;
text-align: left;
}
.enshrine p {
font-size: 1.6rem;
}
.entrust {
margin-top: 80px;
}
.entrust h5 {
font-size: 1.8rem;
}
.entrust .entrust__container {
height: 270px;
}
.entrust .entrust__container .entrust__wrapper {
padding-top: 35px;
}
.entrust .entrust__container .entrust__wrapper p {
font-size: 1.6rem;
}
.entrust .entrust__container .entrust__wrapper .big {
font-size: 6rem;
}
.entrust .entrust__img img {
width: 60%;
padding-top: 40px;
}
.ema h4,
.section1 h4,
.section2 h4 {
font-size: 1.9rem;
}
.section1,
.section2 {
padding: 25px;
width: 94%;
}
.section1 {
margin-top: 330px;
}
.section2 .section2__wrapper {
width: 70%;
}
.section2 .section2__img {
width: 30%;
margin-left: 0;
}
.section2 .section2__inner > p {
margin-top: 0;
width: 100%;
}
.section2 .section2__inner .section2__container > h4 {
padding-top: 30px;
}
.inoru_wrapper .contact-btn {
padding-left: 15px;
padding-right: 15px;
}
}
@media screen and (max-width: 575px) {
.section1 {
margin-top: 330px;
}
}
@media screen and (max-width: 500px) {
.entrust .entrust__container {
margin-left: 15px;
margin-right: 15px;
}
.entrust .entrust__img img {
width: 100%;
padding: 30px 50px;
}
.section1 {
margin-top: 250px;
}
}
.strenghs-top__heading {
font-size: 2.2rem;
text-align: center;
background-color: #dcdddd;
line-height: 42px;
}
.strenghs {
padding-bottom: 130px;
}
.strenghs h3 {
border-bottom: 1px solid #c8004c;
font-size: 2.6rem;
}
.strenghs__number {
color: #c8004c;
font-size: 4.2rem;
}
.strenghs .strenghs__line {
margin: 80px 0 40px;
height: 1px;
background-color: #c8004c;
}
.strenghs .strenghs__button {
margin-left: auto;
margin-right: 0;
}
.strenghs .strenghs__container {
height: 50px;
background-color: #dcdddd;
}
@media screen and (max-width: 767px) {
.strenghs-top__heading {
font-size: 1.6rem;
}
.strenghs {
padding-bottom: 50px;
}
.strenghs__number {
font-size: 3.2rem;
line-height: 3.2rem;
}
.strenghs h3 {
font-size: 1.9rem;
}
}
@media screen and (max-width: 490px) {
.strenghs__button .arrow .button {
padding-right: 45px;
}
}
.offices .offices__item {
margin-top: 50px;
margin-bottom: 50px;
padding-bottom: 75px;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
@media screen and (max-width: 767px) {
.offices .offices__item {
flex-direction: column-reverse;
padding-bottom: 0px;
}
.offices .offices__item img {
padding-bottom: 20px;
}
.offices__map img {
margin-left: -15px;
margin-right: -15px;
}
}
.offices .offices__item h3 {
font-weight: 600;
font-size: 2.4rem;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
@media screen and (max-width: 767px) {
.offices .offices__item h3 {
font-size: 2rem;
}
.offices__info {
font-size: 1.3rem;
}
}
.message {
position: relative;
}
.message .message__image img {
margin-left: -20vw;
width: 1440px;
}
.message .message__txt {
position: absolute;
top: 6vw;
right: 15vw;
}
.message .message__txt .message__container {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.message .message__txt .message__container h2 {
font-size: 4.2rem;
font-family: "LucidaSans Italic", "Helvetica", serif;
}
.message .message__txt .message__container h3 {
color: #c8004c;
border-bottom: 1px solid #c8004c;
font-size: 2rem;
position: relative;
font-family: "Helvetica", serif;
}
.message .message__txt .message__container h3:after {
position: absolute;
content: "";
top: 3.4rem;
left: 50rem;
width: 500px;
height: 1px;
background-color: #c8004c;
}
.message .message__txt .message__container h4 {
color: #c8004c;
font-size: 2rem;
padding-top: 5.2vw;
}
.message .message__txt .message__container p {
line-height: 38px;
font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
.message .message__txt .message__container p {
font-size: 1.1rem;
}
}
.message .message__txt .message__container p:last-child {
text-align: right;
}
@media screen and (min-width: 1300px) {
.message .message__image img {
width: 100%;
}
}
@media screen and (max-width: 1130px) {
.message .message__txt {
right: 5vw;
}
}
@media screen and (max-width: 954px) {
.message .message__txt {
right: 2vw;
}
}
@media screen and (max-width: 902px) {
.message {
background-image: url(./img/topmessage_img02-sp.webp);
background-repeat: no-repeat;
background-size: 100%;
background-position-y: 45%;
margin: 0 auto;
height: 95vw;
padding-top: 60vw;
padding-left: 15px;
padding-right: 15px;
margin-bottom: 850px;
}
.message .message__txt .message__container h2 {
color: #fff;
font-size: 3.2rem;
}
.message .message__txt .message__container h3 {
border-bottom: none;
}
.message .message__txt .message__container h3:after {
position: inherit;
}
.message__image img {
display: none;
}
.message .message__txt {
position: inherit;
top: 0;
right: 0;
}
.message .message__txt .message__container h4 {
font-size: 2rem;
padding-top: 30vw;
}
.message .message__txt .message__container p {
line-height: 28px;
}
}
@media screen and (min-width: 600px) and (max-width: 902px) {
.message .message__txt {
max-width: 600px;
width: 100%;
margin: auto;
}
}
.company {
padding-bottom: 130px;
}
.company dl dt {
background-color: #dcdcdc;
color: #888888;
font-weight: 600;
border-bottom: 1px solid #fff;
display: flex;
align-items: center;
}
.company-table dl {
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
@media screen and (max-width: 490px) {
.company {
padding-bottom: 50px;
}
}
.company-table .pc-br {
display: none;
}
@media screen and (min-width: 768px) {
.company-table .sp-br {
display: none;
}
.company-table .pc-br {
display: inline;
}
}
.step .step__age h3 {
color: #c8004c;
font-size: 3.6rem;
font-weight: 600;
}
.step .step__timeline {
background-color: #e6e6e8;
font-size: 2.2rem;
text-align: center;
align-items: center;
padding: 30px 20px 60px;
margin-right: 0px;
margin-left: 0px;
}
.step .step__timeline a {
position: relative;
}
@media screen and (min-width: 768px) {
.step .step__timeline a:hover {
opacity: 0.5;
}
.step .sp-only {
display: none;
}
}
.step .step__timeline li {
flex: 1;
font-weight: 600;
}
.step .step__timeline li:first-child {
font-size: 1.8rem;
}
.step .step__timeline a:after {
content: "";
display: block;
position: absolute;
top: 40px;
left: 0;
right: 0;
margin: auto;
width: 25px;
height: 25px;
background: url(./img/icon-triangle.webp) no-repeat center/contain;
}
.step .step__age .step__list {
font-size: 2.2rem;
}
.step .step__age:last-child {
padding-bottom: 130px;
}
@media screen and (max-width: 1199px) {
.step .step__timeline {
font-size: 2rem;
}
.step .step__timeline li:first-child {
font-size: 1.6rem;
}
}
@media screen and (max-width: 991px) {
.step .step__timeline li {
flex: inherit;
width: calc(100% / 4);
padding-bottom: 40px;
}
.step .step__timeline a:after {
top: 30px;
}
.step .step__timeline {
padding-top: 50px;
padding-bottom: 30px;
}
}
@media screen and (max-width: 535px) {
.step .step__timeline li:first-child {
font-size: 1.5rem;
}
}
@media screen and (max-width: 505px) {
.step .step__timeline li:first-child {
font-size: 1.4rem;
}
.step .step__timeline li {
width: calc(100% / 3);
}
.step .step__timeline {
font-size: 1.6rem;
}
}
@media screen and (max-width: 767px) {
.step .step__age h3 {
font-size: 2.8rem;
}
.step .step__age .step__list {
font-size: 1.6rem;
}
.step .step__age:last-child {
padding-bottom: 50px;
}
}
@media screen and (max-width: 1140px) {
.idomu .idomu__image:after {
top: 15vw;
left: 100%;
}
}
@media screen and (max-width: 1000px) {
.idomu .idomu__image:after {
transform: scale(1);
top: 7vw;
left: 78vw;
}
}
@media screen and (max-width: 767px) {
.idomu .idomu__title {
padding-top: 0px;
}
.idomu .idomu__image {
height: 400px;
background: url(./img/challenge_img01-sp.webp);
background-repeat: no-repeat;
background-position: 48% 50%;
margin: 0 auto;
background-size: cover;
}
.idomu-top .idomu-top__image img {
width: 200%;
margin-left: -35vw;
}
.idomu-top .idomu-top__txt p {
color: #fff;
padding-top: 2vw;
}
.idomu-top .idomu-top__txt .idomu-top__sign {
text-align: right;
}
.idomu-top .idomu-top__txt .idomu-top__sign img:first-child {
display: none;
}
.idomu-top .idomu-top__txt .idomu-top__sign img:last-child {
display: inline-block;
width: 35%;
}
.idomu .idomu__image:after {
content: url(./img/challenge_img-idomu.webp);
position: absolute;
top: 0;
left: 0;
right: 0;
width: 135px;
height: 270px;
transform: scale(0.8);
margin: auto;
}
.idomu-top .idomu-top__txt {
top: 30vw;
left: 0;
}
.more .more__item .more__images {
background-color: #e0e1e1;
margin-left: -15px;
margin-right: -15px;
text-align: right;
}
.more .more__item .more__images img {
width: 55%;
margin-right: -30px;
}
.more .more__item:after {
display: none;
}
.more__txt h3:before {
top: 6px;
width: 10px;
height: 10px;
}
.idomu-top .idomu-top__txt h2 {
color: #fff;
margin-top: 28vw;
}
.more__txt h3 {
font-size: 1.7rem;
padding-left: 15px;
color: #c8004c;
top: -18vw;
}
.more .more__item .more__txt {
padding-left: 15px;
}
.more .more__item .more__txt h2 {
font-size: 2rem;
}
.more__txt .more__button {
margin-left: 0;
margin-right: auto;
}
}
@media screen and (max-width: 490px) {
.more .more__item .button-oppose {
padding-right: 48px;
}
}
.dictionary-image {
background-color: #d2d2d2;
width: 100%;
height: 180px;
text-align: center;
}
.dictionary-image img {
width: 300px;
padding-top: 28px;
}
.dictionary-cat {
max-width: 800px;
}
.dictionary-button a {
display: block;
background: #fff;
border: 1px solid #beb364;
padding: 0.6em 10px;
text-decoration: none;
max-width: 250px;
width: 100%;
margin: auto;
text-align: center;
font-size: 1.4rem;
}
.dictionary-button .dic-size {
font-size: 2.8rem;
line-height: 5.2rem;
}
.dictionary-button a span {
color: #beb364;
font-size: 3.2rem;
}
.dictionary-button a:hover {
background: #beb364;
color: #fff;
border: 1px solid #beb364;
}
.dictionary-button a:hover span {
color: #fff;
}
.dictionary-title {
background-color: #dd4148;
height: 120px;
display: flex;
align-items: center;
justify-content: center;
}
.dictionary-title.manner03 {
background-color: #5654a2 !important;
}
.dictionary-title h2 {
width: 100%;
color: #fff;
display: flex;
align-items: center;
}
.dictionary-title h2 p:first-child {
font-size: 8.2rem;
padding-right: 30px;
white-space: nowrap;
}
.dictionary-bread {
width: 100%;
margin: auto;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
}
.dictionary-bread .container {
border-bottom: 1px solid #323232;
}
.dictionary-footbread .container {
width: 100%;
margin: auto;
font-family: "ヒラギノ角ゴ ProN", sans-serif;
border-top: 1px solid #323232;
}
.font-16 {
font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
.dictionary-title {
height: 80px;
}
.dictionary-title h2 p {
font-size: 2rem;
}
.dictionary-title h2 p:first-child {
font-size: 4rem;
padding-right: 20px;
}
}
@media screen and (max-width: 575px) {
.dictionary-cat .row {
justify-content: center;
padding-right: 15px;
padding-left: 15px;
}
.dictionary-bread .container {
border-bottom: none;
}
.dictionary-footbread {
display: none;
}
.dictionary-image {
background-color: #fff;
height: 130px;
}
.manners-manner01_sec01 ul li:before {
top: 8px;
}
.font-16 {
border-bottom: 1px solid #323232;
}
}
.cat-single-box {
width: 100px;
padding-bottom: 10px;
}
@media screen and (max-width: 767px) {
.cat-single-box {
height: 90px;
}
}
.cat-single-box a {
display: flex;
justify-content: center;
align-items: center;
padding: 1em 10px;
height: 100%;
}
.cat-single-box .dic-size {
font-size: 2.2rem;
line-height: 3.3rem;
}
.swiper-button-next {
right: 45px;
top: 90%;
width: 40px;
height: 40px;
}
.swiper-button-next:after {
background-repeat: no-repeat;
background-size: contain;
content: "";
margin: auto;
width: 100%;
height: 100%;
background-image: url(./img/arrow-button.webp);
}
.swiper-button-next.swiper-button-disabled {
opacity: 0;
}
@media screen and (max-width: 767px) {
.swiper-button-next {
right: 5%;
top: 85%;
}
}
.wpcf7-list-item #adjust {
margin-left: 2em;
margin-top: 15px;
}
.dictionary-button.active a {
background: #beb364;
color: #fff;
border: 1px solid #beb364;
}
.dictionary-button.active a span {
color: #fff;
}
.dictionary-button.manner03 a {
border: 1px solid #5654a2;
}
.dictionary-button.manner03 a span {
color: #5654a2;
}
.dictionary-button.active.manner03 a {
background: #5654a2;
color: #fff;
border: 1px solid #5654a2;
}
.dictionary-button.active.manner03 a span {
color: #fff;
}
.dictionary-button.manner06 a {
border: 1px solid #323232;
}
.dictionary-button.manner06 a span {
color: #323232;
}
.dictionary-button.active.manner06 a {
background: #dd4148;
color: #fff;
border: 1px solid #dd4148;
}
.dictionary-button.active.manner06 a span {
color: #fff;
}
.dictionary-button.manner03 a:hover {
background: #5654a2;
color: #fff;
border: 1px solid #5654a2;
}
.dictionary-button.manner03 a:hover span {
color: #fff;
}
.dictionary-button.manner06 a:hover {
background: #dd4148;
color: #fff;
border: 1px solid #dd4148;
}
.dictionary-button.manner06 a:hover span {
color: #fff;
}
.dictionary-button a.hover,
.dictionary-button a:active {
background: #beb364;
color: #fff;
border: 1px solid #beb364;
transition: 0s;
}
.dictionary-button a.hover span,
.dictionary-button a:active span {
color: #fff;
transition: 0s;
}
.dictionary-button.manner03 a.hover,
.dictionary-button.manner03 a:active {
background: #5654a2;
color: #fff;
border: 1px solid #5654a2;
}
.dictionary-button.manner03 a.hover span,
.dictionary-button.manner03 a:active span {
color: #fff;
}
.dictionary-button.manner06 a.hover,
.dictionary-button.manner06 a:active {
background: #dd4148;
color: #fff;
border: 1px solid #dd4148;
}
.dictionary-button.manner06 a.hover span,
.dictionary-button.manner06 a:active span {
color: #fff;
}
.dictionary-title {
background-color: #beb364;
}
.dictionary-title.manner03 {
background-color: #5654a2;
}
.dictionary-title.manner06 {
background-color: #dd4148;
}
.manners-manner01_sec01.manner03 ul li:before {
background: #5654a2;
}
@media screen and (max-width: 767px) {
.dictionary-button.active a {
background: #d2b071;
border: 1px solid #d2b071;
}
.dictionary-title {
background-color: #d2b071;
}
.dictionary-button a.hover,
.dictionary-button a:active {
background: #d2b071;
border: 1px solid #d2b071;
}
.dictionary-button a:hover {
background: #d2b071;
border: 1px solid #d2b071;
}
.dictionary-button a span {
color: #d2b071;
}
.dictionary-button a {
border: 1px solid #d2b071;
}
}
.btn-b {
max-width: 500px;
width: 100%;
margin: auto;
display: block;
}
.btn-b:hover {
filter: opacity(0.8);
}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
img{height:auto}