@charset "UTF-8";

 html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
dialog,
figure,
footer,
header,
nav,
section,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
box-sizing: border-box;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
main {
display: block;
}
html {
font-size: 62.5%;
}
body {
-webkit-text-size-adjust: 100%;
}
body,
table,
input,
textarea,
select,
option,
h1,
h2,
h3,
h4,
h5,
h6 {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: bold;
}
table,
input,
textarea,
select,
option {
line-height: 1.1;
}
ol,
ul {
list-style: none;
}
blockquote,
q {
quotes: none;
}
:focus {
outline: 0;
}
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
img {
vertical-align: top;
}
a,
a img {
-webkit-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
a {
color: inherit;
text-decoration: none;
}
a:hover,
a:hover img {
opacity: 0.8;
filter: alpha(opacity=80);
-ms-filter: "alpha(opacity=80)";
}
img {
max-width: 100%;
}
.sp-only {
display: none;
}
@media only screen and (max-width: 767px) {
.pc-only {
display: none;
}
.sp-only {
display: block;
}
}   .c-header__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
height: 82.61px;
-webkit-box-align: center;
align-items: center;
position: fixed;
top: 0;
left: 0;
background-color: white;
width: 100%;
z-index: 9999999;
}
main {
padding-top: 82.61px !important;
}
@media only screen and (max-width: 767px) {
.c-header__list {
height: 67.61px;
}
main {
padding-top: 67.61px !important;
}
}
@media only screen and (max-width: 516px) {
.c-header__list {
position: unset;
}
.c-header {
position: fixed;
top: 0;
left: 0;
background-color: white;
width: 100%;
z-index: 9999999;
}
}
.c-header__logo {
max-width: 367.33px;
padding-left: 26px;
display: block;
}
@media only screen and (max-width: 1124px) {
.c-header__logo {
max-width: 305.33px;
}
}
@media only screen and (max-width: 516px) {
.c-header__logo {
max-width: 250.33px;
padding-left: 10px;
}
}
.c-header__menu {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
width: 62%;
height: 100%;
letter-spacing: 1px;
}
@media only screen and (max-width: 1124px) {
.c-header__menu {
width: 66%;
}
}
@media only screen and (max-width: 1024px) {
.c-header__menu {
display: none;
}
}
.c-header__menu ul {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
font-size: 1.6rem;
width: 79%;
letter-spacing: 1px;
}
.c-header__button {
width: 48.39px;
position: fixed;
top: 100px;
right: 34px;
z-index: 1000;
}
@media only screen and (max-width: 1024px) {
.c-header__button {
right: 20px;
}
}
@media only screen and (max-width: 516px) {
.c-header__button {
width: 40.39px;
top: 77px;
right: 10px;
}
}
.c-header__contact {
background-color: #e60013;
color: white;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
font-size: 1.3rem;
width: 100.38px;
height: 100%;
}
.c-header__recruit {
z-index: 1000;
position: fixed;
width: 156.72px;
top: 60%;
right: 7.1%;
}
.c-header__recruit img {
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.c-header__recruit img:nth-child(2) {
display: none;
}
.c-header__recruit:hover img:nth-child(1) {
display: none;
}
.c-header__recruit:hover img:nth-child(2) {
display: block;
}
@media only screen and (max-width: 1124px) {
.c-header__recruit {
right: 20px;
}
}
.c-header__menu .active a span:after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
.c-header__menu li a > span::after {
z-index: 999;
content: "";
position: absolute;
top: 49px;
left: 0;
width: 100%;
height: 4.48px;
background: #e60013;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: -webkit-transform 0.3s ease;
transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.c-header__menu li a > span {
position: relative;
font-weight: bold;
}
.c-header__menu li:hover a > span:after {
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
.c-header__menu li .c-menu a > span::after {
display: none;
}
.c-menu__link.active::after {
background-color: #e60013;
position: absolute;
content: "";
height: 31.41px;
width: 205px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: -10px;
z-index: 1;
}
.c-menu__intro:hover .c-menu.intro {
display: block;
}
.c-menu__faci:hover .c-menu.faci {
display: block;
height: 104.46px;
}
.c-menu {
position: absolute;
background: white;
width: 195.23px;
z-index: 2;
margin-top: 30px;
display: none;
font-size: 1.6rem;
margin-left: -7px;
font-weight: bold;
}
.c-menu__link {
cursor: pointer;
display: block;
padding: 14px 27px;
-webkit-transition: -webkit-transform 0.3s ease;
transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.c-menu__link:hover {
background-color: #e60013;
color: white;
}
.c-menu__link span {
position: relative;
z-index: 2;
}
.c-menu__link:hover span,
.c-menu__link:hover a {
opacity: 1;
}
.c-menu:before {
position: absolute;
content: "";
height: 33px;
width: 197px;
top: -33px;
left: 0;
} .c-footer {
background-color: #f7f7f7;
padding-top: 58px;
}
.c-footer__logo {
max-width: 267.55px;
margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
.c-footer__logo {
max-width: 230.55px;
}
}
@media only screen and (max-width: 516px) {
.c-footer__logo {
max-width: 200.55px;
}
}
.c-footer__red {
background-color: #e50013;
display: -webkit-box;
display: flex;
padding: 0 20px;
height: 87.23px;
-webkit-box-align: center;
align-items: center;
color: white;
-webkit-box-pack: justify;
justify-content: space-between;
margin-top: 44px;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 516px) {
.c-footer__red {
flex-wrap: wrap;
-webkit-box-pack: center;
justify-content: center;
padding: 0 20px 10px;
}
.c-footer__red a {
margin: 10px 0 -10px;
}
}
@media only screen and (max-width: 516px) {
.c-footer__copy {
width: 100%;
text-align: center;
}
}   body {
font-family: noto-sans-cjk-jp, sans-serif;
font-weight: 400;
font-style: normal;
font-size: 1.4rem;
line-height: 1.5;
}                            .p-top1__extra {
position: relative;
}
.p-top1__white {
position: absolute;
top: 49%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 12.5%;
color: white;
letter-spacing: 5px;
font-family: "kozuka-mincho-pro", serif;
font-weight: 500;
font-style: normal;
z-index: 2;
text-shadow: 2px 2px 6px rgba(0, 0, 0, 1);
}
@media only screen and (max-width: 1024px) {
.p-top1__white {
left: 30px;
}
}
@media only screen and (max-width: 516px) {
.p-top1__white {
left: 20px;
}
}
.p-top1__white h1 {
font-size: 5.314rem;
font-weight: 500;
line-height: 1.3;
}
@media only screen and (max-width: 1024px) {
.p-top1__white h1 {
font-size: 3.314rem;
}
}
@media only screen and (max-width: 767px) {
.p-top1__white h1 {
font-size: 2.8rem;
}
}
@media only screen and (max-width: 516px) {
.p-top1__white h1 {
font-size: 6vw;
}
}
.p-top1__white p {
font-size: 2.396rem;
margin-top: 23px;
letter-spacing: 2.5px;
}
@media only screen and (max-width: 1024px) {
.p-top1__white p {
font-size: 2rem;
}
}
@media only screen and (max-width: 767px) {
.p-top1__white p {
font-size: 1.8rem;
margin-top: 15px;
}
}
@media only screen and (max-width: 516px) {
.p-top1__white p {
font-size: 3.8vw;
margin-top: 10px;
}
}
.p-top1__list {
max-width: 1104.16px;
margin: 98px auto 150px;
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
letter-spacing: 2.5px;
padding: 0 20px;
}
@media only screen and (max-width: 767px) {
.p-top1__list {
grid-template-columns: repeat(2, 1fr);
margin: 80px auto 150px;
}
}
@media only screen and (max-width: 516px) {
.p-top1__list {
margin: 80px auto 120px;
}
}
.p-top1__item {
position: relative;
}
.p-top1__item:first-child {
grid-row: span 2;
}
@media only screen and (max-width: 516px) {
.p-top1__item:nth-child(2) .p-top1__red img {
position: unset;
-webkit-transform: unset;
transform: unset;
margin-top: 3px;
margin-left: 3px;
}
}
.p-top1__abs {
position: relative;
display: inline-block;
}
.p-top1__red {
height: 78.29px;
width: 100%;
color: white;
background-color: #e60013;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
position: absolute;
bottom: 0;
left: 0;
font-size: 2.4rem;
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.p-top1__red img {
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.p-top1__item:hover .p-top1__red {
background-color: white;
color: #e60013;
border: 1px solid;
}
.p-top1__item:hover .p-top1__red img:nth-child(3) {
display: block;
}
.p-top1__red img:nth-child(3) {
display: none;
}
.p-top1__item:hover .p-top1__red img:nth-child(2) {
display: none;
}
@media only screen and (max-width: 1024px) {
.p-top1__red {
height: 53.29px;
font-size: 2rem;
}
}
@media only screen and (max-width: 767px) {
.p-top1__red {
font-size: 1.8rem;
}
}
@media only screen and (max-width: 516px) {
.p-top1__red {
letter-spacing: 0;
font-size: 1.4rem;
height: 33px;
}
}
.p-top1__red img {
width: 18.26px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
position: absolute;
top: 50%;
right: -30px;
}
@media only screen and (max-width: 516px) {
.p-top1__red img {
width: 15.26px;
right: -20px;
}
}
.p-top2 {
background-color: #f7f8f8;
padding: 84px 20px;
}
.p-top2__abs {
max-width: 1200px;
margin: 0 auto;
position: relative;
}
.p-top2__line {
position: absolute;
max-width: 144.91px;
top: -176px;
right: 22px;
width: 100%;
}
@media only screen and (max-width: 1124px) {
.p-top2__line {
top: -229px;
scale: 0.9;
}
}
@media only screen and (max-width: 1024px) {
.p-top2__line {
scale: 0.8;
top: -228px;
}
}
@media only screen and (max-width: 767px) {
.p-top2__line {
top: -196px;
scale: 0.65;
}
}
@media only screen and (max-width: 516px) {
.p-top2__line {
right: 0;
top: -207px;
}
}
.p-top2__line:nth-child(3) {
top: unset;
right: unset;
left: 47px;
bottom: -162px;
-webkit-transform: rotate(181deg);
transform: rotate(181deg);
}
@media only screen and (max-width: 767px) {
.p-top2__line:nth-child(3) {
left: 0;
bottom: -212px;
}
}
.p-top2__list {
max-width: 987.96px;
margin: 0 auto;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 767px) {
.p-top2__list {
flex-wrap: wrap;
}
}
.p-top2__left {
width: 49.5%;
}
@media only screen and (max-width: 767px) {
.p-top2__left {
width: 100%;
}
}
.p-top2__desc {
font-size: 3rem;
font-weight: 500;
letter-spacing: 3px;
line-height: 1.8;
margin-bottom: 69px;
}
@media only screen and (max-width: 1024px) {
.p-top2__desc {
font-size: 2.5rem;
letter-spacing: 2px;
}
}
@media only screen and (max-width: 516px) {
.p-top2__desc {
font-size: 2rem;
letter-spacing: 1px;
margin-bottom: 30px;
}
}
.p-top2__right {
width: 42.5%;
margin-top: -12px;
}
@media only screen and (max-width: 1024px) {
.p-top2__right {
width: 44.5%;
}
}
@media only screen and (max-width: 767px) {
.p-top2__right {
width: 100%;
margin-top: 40px;
}
}
.p-top2__title {
font-size: 5.164rem;
line-height: 1.37;
letter-spacing: 6px;
margin-bottom: 50px;
}
@media only screen and (max-width: 1024px) {
.p-top2__title {
font-size: 3.164rem;
}
}
@media only screen and (max-width: 516px) {
.p-top2__title {
font-size: 2.5rem;
letter-spacing: 3px;
margin-bottom: 20px;
}
}
.p-top2__text {
font-size: 1.6rem;
letter-spacing: 1px;
line-height: 2.25;
margin-bottom: 35px;
}
@media only screen and (max-width: 516px) {
.p-top2__text {
letter-spacing: 0px;
}
}
.p-top2__link {
letter-spacing: 3px;
box-sizing: border-box;
width: 171.69px;
height: 49.29px;
background-color: #e60013;
color: white;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
align-items: center;
border-radius: 31px;
margin-left: 7px;
padding-left: 7px;
transition:
transform 0.3s ease,
-webkit-transform 0.3s ease;
}
.p-top2__link:hover {
background-color: white;
color: #e60013;
border: 1px solid;
}
.p-top2__link:hover img:nth-child(3) {
display: block;
}
.p-top2__link:hover img:nth-child(2) {
display: none;
}
.p-top2__link img:nth-child(3) {
display: none;
}
.p-top2__link img {
width: 26.13px;
margin-right: 17px;
}
.p-top3 {
padding: 0 20px;
}
.p-top3__list {
max-width: 1014.39px;
margin: 109px auto 148px;
display: -webkit-box;
display: flex;
}
@media only screen and (max-width: 1024px) {
.p-top3__list {
flex-wrap: wrap;
margin: 109px auto;
}
}
@media only screen and (max-width: 516px) {
.p-top3__list {
margin: 109px auto 60px;
}
}
.p-top3__left {
width: 21%;
}
@media only screen and (max-width: 1024px) {
.p-top3__left {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
width: 405px;
-webkit-box-align: center;
align-items: center;
}
}
@media only screen and (max-width: 516px) {
.p-top3__left {
flex-wrap: wrap;
}
.p-top3__left .p-top3__meta {
width: 100%;
}
}
.p-top3__title {
letter-spacing: 1px;
}
.p-top3__title span {
font-size: 1.5rem;
color: #e50013;
}
.p-top3__title h3 {
font-size: 3rem;
margin-top: -10px;
letter-spacing: 3px;
}
@media only screen and (max-width: 767px) {
.p-top3__title h3 {
font-size: 2.8rem;
margin-top: 0;
}
}
@media only screen and (max-width: 516px) {
.p-top3__title h3 {
font-size: 2.5rem;
letter-spacing: 1px;
}
}
.p-top3__desc {
font-size: 1.6rem;
color: #e50013;
margin: 36px 0 10px;
letter-spacing: 1px;
line-height: 1.7;
margin-bottom: 60px;
}
@media only screen and (max-width: 516px) {
.p-top3__desc {
margin: 20px 0 0;
margin-bottom: 30px;
}
}
.p-top3__right {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
width: 80%;
margin-top: 24px;
}
@media only screen and (max-width: 1024px) {
.p-top3__right {
width: 100%;
margin-top: 0;
}
}
@media only screen and (max-width: 767px) {
.p-top3__right {
flex-wrap: wrap;
}
}
@media only screen and (max-width: 516px) {
.p-top3__right {
margin-top: 40px;
}
}
.p-top3__item {
width: 31.5%;
}
@media only screen and (max-width: 617px) {
.p-top3__item {
width: 48%;
margin-bottom: 30px;
}
}
.p-top3__info {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-top: 4px;
}
@media only screen and (max-width: 767px) {
.p-top3__info {
flex-wrap: wrap;
}
}
.p-top3__date {
margin-left: 8px;
font-family: acumin-variable, sans-serif;
}
.p-top3__date span:nth-child(2) {
font-size: 2.4rem;
font-weight: bold;
}
.p-top3__category {
font-size: 1.072rem;
min-width: 90.52px;
padding: 2px 5px;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
color: white;
background-color: #afafb0;
margin-left: 9px;
letter-spacing: 2px;
}
.p-top3__letter {
font-size: 1.5rem;
margin-left: 10px;
margin-top: -3px;
letter-spacing: 3px;
font-weight: 500;
}
@media only screen and (max-width: 767px) {
.p-top3__letter {
margin-top: 10px;
}
}
.p-top4 {
color: white;
padding: 68px 20px 90px;
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/index/top3_bg.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
@media only screen and (max-width: 767px) {
.p-top4 {
padding: 68px 20px 30px;
}
}
@media only screen and (max-width: 516px) {
.p-top4 {
background-position: left;
padding: 68px 20px 20px;
}
}
.p-top4__container {
max-width: 1003px;
margin: 0 auto;
}
.p-top4__first {
display: -webkit-box;
display: flex;
}
@media only screen and (max-width: 767px) {
.p-top4__first {
flex-wrap: wrap;
}
}
.p-top4__desc {
font-size: 1.6rem;
margin-left: 31px;
margin-top: 26px;
letter-spacing: 1px;
}
@media only screen and (max-width: 767px) {
.p-top4__desc {
margin-left: 0;
margin-top: 10px;
width: 100%;
}
}
.p-top4__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 89px 0 10px;
}
@media only screen and (max-width: 767px) {
.p-top4__list {
margin: 70px 0;
flex-wrap: wrap;
}
}
@media only screen and (max-width: 516px) {
.p-top4__list {
margin: 50px 0;
}
}
.p-top4__item {
width: 22.5%;
}
@media only screen and (max-width: 767px) {
.p-top4__item {
width: 48%;
margin-bottom: 30px;
}
}
.p-top4__info {
margin-top: 20px;
margin-left: 4px;
letter-spacing: 1px;
font-size: 1.8rem;
display: flex;
align-items: center;
}
.p-top4__info img {
width: 16.3px;
margin-right: 5px;
}
.p-top4__text {
font-size: 1.3rem;
margin-top: 12px;
letter-spacing: 1px;
line-height: 1.75;
}
.p-top5__title {
height: 65.74px;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
background-color: black;
color: white;
font-size: 3rem;
letter-spacing: 3px;
}
@media only screen and (max-width: 1024px) {
.p-top5__title {
font-size: 2.5rem;
}
}
.p-top5__list {
max-width: 996.96px;
margin: 74px auto 141px;
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 4rem 1rem;
font-size: 1.6rem;
text-align: center;
}
@media only screen and (max-width: 1024px) {
.p-top5__list {
max-width: 692.96px;
grid-template-columns: repeat(3, 1fr);
}
}
@media only screen and (max-width: 767px) {
.p-top5__list {
grid-template-columns: repeat(2, 1fr);
max-width: 450.96px;
margin: 74px auto 100px;
}
}
@media only screen and (max-width: 516px) {
.p-top5__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
flex-wrap: wrap;
gap: 3rem 1rem;
margin: 55px auto 80px;
align-items: flex-start;
}
}
.p-top5__container {
padding: 0 20px;
}
.p-top5__item {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
height: 100%;
}
@media only screen and (max-width: 516px) {
.p-top5__item {
width: 48%;
}
}
.p-top5__image {
-webkit-box-flex: 1;
flex: 1;
aspect-ratio: 5 / 3;
overflow: hidden;
border-radius: 6px;
}
.p-top5__image img {
height: 100%;
width: 100%;
object-fit: cover;
}
.p-top5__info {
margin-top: 9px;
letter-spacing: 2px;
text-wrap-mode: nowrap;
}
@media only screen and (max-width: 516px) {
.p-top5__info {
text-wrap-mode: wrap;
}
}
.p-top6 {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/index/top5_bg.png);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
padding: 120px 20px 76px;
font-size: 1.6rem;
color: white;
text-align: center;
}
@media only screen and (max-width: 767px) {
.p-top6 {
padding: 30px 20px 76px;
}
}
.p-top6__list {
max-width: 979.34px;
margin: 0 auto;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 767px) {
.p-top6__list {
flex-wrap: wrap;
}
}
.p-top6__left {
width: 34%;
text-align: center;
margin-top: 47px;
}
@media only screen and (max-width: 767px) {
.p-top6__left {
width: 100%;
}
}
.p-top6__phone {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
font-size: 4.2rem;
margin: 69px 0 0px;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
}
@media only screen and (max-width: 1024px) {
.p-top6__phone {
font-size: 3.2rem;
}
}
@media only screen and (max-width: 767px) {
.p-top6__phone {
margin: 20px 0 0px;
}
}
.p-top6__phone img {
width: 35.82px;
margin-right: 20px;
}
@media only screen and (max-width: 1024px) {
.p-top6__phone img {
width: 26.82px;
margin-right: 15px;
}
}
.p-top6__time {
letter-spacing: 2px;
}
.p-top6__right {
width: 60%;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
padding-right: 30px;
}
@media only screen and (max-width: 767px) {
.p-top6__right {
width: 100%;
padding-right: 0;
margin: 30px auto 0;
max-width: 426px;
}
}
@media only screen and (max-width: 516px) {
.p-top6__right {
flex-wrap: wrap;
max-width: 204px;
}
}
.p-top6__item {
width: 43%;
background-color: rgba(0, 0, 0, 0.608);
margin: 10px;
border-radius: 14px;
margin-top: 12px;
padding-top: 20px;
max-height: 329.61px;
}
@media only screen and (max-width: 516px) {
.p-top6__item {
width: 100%;
margin-bottom: 30px;
}
}
.p-top6__info {
line-height: 1.7;
}
.p-top6__image {
margin: 19px -10px 38px;
}
.p-top6__link {
width: 201.41px;
height: 61.84px;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
background: white;
border-radius: 8px;
margin: 0 auto 0;
color: black;
}
@media only screen and (max-width: 1024px) {
.p-top6__link {
margin: 0 -10px;
}
}
.p-top6__link img {
margin-left: 13px;
width: 38.82px;
margin-right: 29px;
}
.p-top7 {
padding: 0 20px;
margin: 148px 0 107px;
}
@media only screen and (max-width: 1024px) {
.p-top7 {
margin: 103px 0;
}
}
@media only screen and (max-width: 516px) {
.p-top7 {
margin: 80px 0 100px;
}
}
.p-top7 .p-top3__title {
text-align: center;
}
.p-top7__list {
max-width: 833px;
margin: 72px auto;
}
@media only screen and (max-width: 516px) {
.p-top7__list {
margin: 40px auto;
}
}
.p-top7__item {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin-bottom: 64px;
}
@media only screen and (max-width: 767px) {
.p-top7__item {
flex-wrap: wrap;
}
}
.p-top7__google {
width: 411.68px;
height: 249.16px;
margin-right: 30px;
}
@media only screen and (max-width: 767px) {
.p-top7__google {
margin-right: 0;
margin-bottom: 30px;
width: 100%;
}
}
.p-top7__right {
width: 46%;
}
@media only screen and (max-width: 767px) {
.p-top7__right {
width: 100%;
}
}
.p-top7__address {
font-size: 1.7rem;
margin-top: 8px;
letter-spacing: 2px;
}
@media only screen and (max-width: 516px) {
.p-top7__address {
font-size: 1.6rem;
letter-spacing: 1px;
}
}
.p-top7__store {
display: inline-block;
font-size: 1.6rem;
padding: 1px 20px;
color: white;
min-width: 95.22px;
background: black;
text-align: center;
letter-spacing: 3px;
}
.c-page {
padding: 0 20px;
}
.c-page__title {
max-width: 987.31px;
margin: 116px auto 140px;
letter-spacing: 3.5px;
}
@media only screen and (max-width: 1024px) {
.c-page__title {
margin: 40px auto 80px;
}
}
@media only screen and (max-width: 767px) {
.c-page__title {
margin: 40px auto 55px;
}
}
.c-page__title span {
font-size: 2.5rem;
color: #e60013;
letter-spacing: 0;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
}
@media only screen and (max-width: 767px) {
.c-page__title span {
font-size: 2.2rem;
}
}
.c-page__title h2 {
font-size: 3.5rem;
}
@media only screen and (max-width: 1024px) {
.c-page__title h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 767px) {
.c-page__title h2 {
font-size: 2.5rem;
}
}
.c-service__title {
max-width: 987.31px;
margin: 0 auto;
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/title_red.png);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
height: 65.96px;
border-radius: 8px;
color: white;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 0 20px;
-webkit-box-align: center;
align-items: center;
}
.c-service__title span:nth-child(1) {
font-size: 2.5rem;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
}
@media only screen and (max-width: 767px) {
.c-service__title span:nth-child(1) {
font-size: 2.2rem;
}
}
@media only screen and (max-width: 516px) {
.c-service__title span:nth-child(1) {
font-size: 2rem;
}
}
.c-service__title span:nth-child(2) {
font-size: 2.3rem;
}
@media only screen and (max-width: 767px) {
.c-service__title span:nth-child(2) {
font-size: 2.1rem;
}
}
@media only screen and (max-width: 516px) {
.c-service__title span:nth-child(2) {
font-size: 1.9rem;
}
}
.c-service__link {
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
margin: 65px 0 94px;
}
@media only screen and (max-width: 1024px) {
.c-service__link {
margin: 65px -10px 94px;
}
}
@media only screen and (max-width: 767px) {
.c-service__link {
margin: 40px -20px 80px;
flex-wrap: wrap;
}
}
@media only screen and (max-width: 516px) {
.c-service__link {
margin: 40px auto 60px;
-webkit-box-pack: justify;
justify-content: space-between;
max-width: 350px;
}
}
.c-service__link.sur {
max-width: 1030.31px;
flex-wrap: wrap;
margin: 65px auto 94px;
}
@media only screen and (max-width: 516px) {
.c-service__link.sur {
margin: 40px auto 60px;
}
}
.c-service__link.sur a {
width: 217.43px;
background: #f1f7fa;
height: 107.33px;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
border-radius: 8px;
margin-bottom: 30px;
}
@media only screen and (max-width: 767px) {
.c-service__link.sur a {
width: 45%;
height: 81.33px;
font-size: 1.5rem;
}
}
.c-service__link.sur a .c-service__info {
position: unset;
-webkit-transform: unset;
transform: unset;
}
.c-service__link.sur a .c-service__arrow {
width: 34.81px;
margin: 0 auto;
position: absolute;
bottom: -28px;
}
.c-service__link a {
display: block;
width: 159.66px;
font-size: 1.6rem;
position: relative;
margin: 0 20px;
}
@media only screen and (max-width: 1024px) {
.c-service__link a {
margin: 0 10px;
}
}
@media only screen and (max-width: 767px) {
.c-service__link a {
width: 25%;
margin: 20px 10px;
}
}
@media only screen and (max-width: 516px) {
.c-service__link a {
width: 46%;
margin: 15px 0;
}
}
.c-service__link a .c-service__info {
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
bottom: 36px;
width: 100%;
text-align: center;
letter-spacing: 1px;
}
.c-service__blue {
background-color: #f1f7fa;
padding: 79px 0 202px;
font-size: 1.6rem;
margin: 0 -20px;
}
@media only screen and (max-width: 1024px) {
.c-service__blue {
padding: 79px 0 102px;
}
}
@media only screen and (max-width: 767px) {
.c-service__blue {
padding: 60px 20px 40px;
}
}
@media only screen and (max-width: 516px) {
.c-service__blue {
padding: 60px 20px 10px;
}
}
.c-service__blue.sur .c-service__content {
margin: 20px 0 69px;
letter-spacing: 1.7px;
line-height: 1.7;
}
@media only screen and (max-width: 767px) {
.c-service__blue.sur .c-service__content {
margin: 20px 0 50px;
}
}
@media only screen and (max-width: 516px) {
.c-service__blue.sur .c-service__content {
margin: 20px 0 35px;
}
}
.c-service__list {
max-width: 1200px;
display: -webkit-box;
display: flex;
-webkit-box-pack: end;
justify-content: flex-end;
margin: -100px auto 50px;
padding: 50px 0;
}
.c-service__list:first-child {
margin: -50px auto 50px;
}
@media only screen and (max-width: 767px) {
.c-service__list {
flex-wrap: wrap;
}
}
.c-service__big {
width: 21.5%;
margin-right: -32px;
z-index: 2;
}
@media only screen and (max-width: 767px) {
.c-service__big {
width: 150px;
margin: 0 auto -80px;
}
}
@media only screen and (max-width: 516px) {
.c-service__big {
width: 125px;
}
}
.c-service__white {
width: 78%;
max-width: 930.21px;
background-color: white;
margin-top: 32px;
padding: 76px 20px 1px 45px;
border-radius: 8px;
}
@media only screen and (max-width: 1024px) {
.c-service__white {
width: 80%;
}
}
@media only screen and (max-width: 767px) {
.c-service__white {
width: 100%;
padding: 76px 20px 1px;
}
}
.c-service__container {
max-width: 796.92px;
margin: 0 auto;
padding-right: 28px;
}
@media only screen and (max-width: 1024px) {
.c-service__container {
padding-right: 0;
}
}
.c-service__letter {
font-size: 3.6rem;
position: relative;
letter-spacing: 7px;
}
@media only screen and (max-width: 1024px) {
.c-service__letter {
font-size: 3rem;
letter-spacing: 3px;
}
}
@media only screen and (max-width: 767px) {
.c-service__letter {
font-size: 2.5rem;
}
}
@media only screen and (max-width: 516px) {
.c-service__letter {
font-size: 2.2rem;
letter-spacing: 1px;
}
}
.c-service__letter span {
background: white;
z-index: 2;
position: relative;
padding-right: 20px;
}
@media only screen and (max-width: 516px) {
.c-service__letter span {
padding-right: 15px;
}
}
.c-service__letter::after {
content: "";
position: absolute;
right: 0;
width: 100%;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
background: black;
height: 1px;
}
.c-service__content {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 77px 0 71px 7px;
}
@media only screen and (max-width: 1024px) {
.c-service__content {
margin: 57px 0 57px 7px;
}
}
@media only screen and (max-width: 516px) {
.c-service__content {
flex-wrap: wrap;
margin: 40px 0;
}
}
.c-service__image {
width: 46%;
}
@media only screen and (max-width: 516px) {
.c-service__image {
width: 100%;
margin-bottom: 30px;
}
}
.c-service__text {
width: 50%;
letter-spacing: 1.4px;
line-height: 1.75;
margin-top: -6px;
}
@media only screen and (max-width: 516px) {
.c-service__text {
width: 100%;
}
}
.c-service__line {
font-size: 1.6rem;
margin-left: 8px;
letter-spacing: 1px;
margin-bottom: 52px;
}
@media only screen and (max-width: 516px) {
.c-service__line {
margin: 0 0 40px;
}
}
.c-service__line h4 {
font-size: 1.8rem;
border-bottom: 2px dashed;
padding-bottom: 5px;
}
.c-service__line p {
margin-top: 8px;
line-height: 1.6;
letter-spacing: 1.5px;
max-width: 718px;
}
.c-service__gallery {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1rem;
margin: 26px 0 10px;
max-width: 647.97px;
}
@media only screen and (max-width: 516px) {
.c-service__gallery {
grid-template-columns: repeat(2, 1fr);
}
}
.access {
margin-bottom: 200px;
}
@media only screen and (max-width: 767px) {
.access {
margin-bottom: 140px;
}
}
@media only screen and (max-width: 516px) {
.access {
margin-bottom: 110px;
}
}
.c-access__part {
max-width: 983.53px;
margin: 0 auto 101px;
border-top: 1px solid;
}
@media only screen and (max-width: 516px) {
.c-access__part {
margin: 0 auto 90px;
}
}
.c-access__title {
font-size: 2.5rem;
text-align: center;
margin: 87px 0 93px;
letter-spacing: 6px;
}
@media only screen and (max-width: 1024px) {
.c-access__title {
margin: 50px 0;
}
}
@media only screen and (max-width: 516px) {
.c-access__title {
margin: 35px 0;
font-size: 2.2rem;
}
}
.c-access__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 640px) {
.c-access__list {
flex-wrap: wrap;
}
}
.c-access__image {
width: 46.5%;
}
@media only screen and (max-width: 640px) {
.c-access__image {
width: 100%;
margin-bottom: 20px;
}
}
.c-access__content {
width: 49%;
letter-spacing: 2px;
}
@media only screen and (max-width: 640px) {
.c-access__content {
width: 100%;
}
}
.c-access__address {
font-size: 1.7rem;
}
@media only screen and (max-width: 516px) {
.c-access__address {
font-size: 1.6rem;
}
}
.c-access__address:nth-child(1) {
margin-bottom: 22px;
padding-bottom: 29px;
border-bottom: 1px solid;
}
@media only screen and (max-width: 640px) {
.c-access__address:nth-child(1) {
margin-bottom: 20px;
padding-bottom: 20px;
}
}
.c-access__address h4 {
font-size: 1.8rem;
margin-bottom: 7px;
}
.c-access__bottom {
margin-top: 25px;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 767px) {
.c-access__bottom {
flex-wrap: wrap;
}
}
.c-access__map {
width: 70%;
}
@media only screen and (max-width: 767px) {
.c-access__map {
width: 100%;
margin-bottom: 30px;
}
}
.c-access__google {
width: 27.5%;
}
@media only screen and (max-width: 767px) {
.c-access__google {
width: 100%;
height: 300px;
}
}
.c-case__list {
max-width: 993.25px;
margin: 0 auto;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 767px) {
.c-case__list {
flex-wrap: wrap;
}
}
.c-case__left {
width: 67.5%;
}
@media only screen and (max-width: 767px) {
.c-case__left {
width: 100%;
}
}
.c-case__item {
border-bottom: 1px solid;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 39px 0;
}
@media only screen and (max-width: 516px) {
.c-case__item {
flex-wrap: wrap;
}
}
.c-case__item:first-child {
border-top: 1px solid;
}
.c-case__image {
width: 30%;
border-radius: 12px;
overflow: hidden;
}
@media only screen and (max-width: 516px) {
.c-case__image {
width: 100%;
}
}
.c-case__info {
width: 46%;
}
@media only screen and (max-width: 516px) {
.c-case__info {
width: 100%;
margin: 20px 0;
}
}
.c-case__category {
background-color: #e60013;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
width: 90.52px;
height: 20.1px;
color: white;
border-radius: 36px;
margin: 2px 0 11px;
font-size: 1.072rem;
letter-spacing: 0px;
}
.c-case__letter {
font-size: 1.5rem;
letter-spacing: 3px;
}
.c-case__link {
width: 16%;
color: #e60013;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
font-size: 1.2rem;
min-width: 85px;
}
.c-case__link img {
width: 17.65px;
margin-right: 7px;
}
.c-case__right {
width: 26.5%;
font-size: 1.3rem;
border-top: 1px solid;
}
@media only screen and (max-width: 767px) {
.c-case__right {
width: 100%;
margin-top: 50px;
}
}
.c-case__red {
color: #e60013;
margin-top: 3px;
margin-bottom: 26px;
}
.c-case__black {
margin-left: 17px;
}
.c-case__black span {
display: block;
margin-bottom: 18px;
}
.c-data__part {
border-top: 1px solid;
max-width: 983.53px;
margin: 0 auto;
}
.c-data__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 92px 0 98px;
}
@media only screen and (max-width: 1024px) {
.c-data__list {
margin: 70px 0 80px;
}
}
@media only screen and (max-width: 767px) {
.c-data__list {
flex-wrap: wrap;
}
}
@media only screen and (max-width: 516px) {
.c-data__list {
margin: 50px 0 80px;
}
}
.c-data__left {
color: #e60013;
width: 44%;
}
@media only screen and (max-width: 767px) {
.c-data__left {
width: 100%;
display: -webkit-box;
display: flex;
}
}
@media only screen and (max-width: 516px) {
.c-data__left {
flex-wrap: wrap;
}
}
.c-data__left .p-top2__line {
margin: 49px 20px;
position: unset;
}
@media only screen and (max-width: 1024px) {
.c-data__left .p-top2__line {
margin: 6px 2px;
}
}
@media only screen and (max-width: 767px) {
.c-data__left .p-top2__line {
margin: -49px 20px 0;
}
}
@media only screen and (max-width: 516px) {
.c-data__left .p-top2__line {
margin: -4px 5px 0;
}
}
.c-data__left h2 {
font-size: 4.5rem;
line-height: 1.45;
}
@media only screen and (max-width: 1024px) {
.c-data__left h2 {
font-size: 3rem;
}
}
@media only screen and (max-width: 516px) {
.c-data__left h2 {
font-size: 2.8rem;
}
}
.c-data__right {
font-size: 2rem;
font-weight: bold;
width: 46%;
margin-top: 10px;
letter-spacing: 2px;
line-height: 2;
}
@media only screen and (max-width: 1024px) {
.c-data__right {
width: 60%;
font-size: 1.8rem;
}
}
@media only screen and (max-width: 767px) {
.c-data__right {
width: 100%;
margin-top: 20px;
}
}
@media only screen and (max-width: 516px) {
.c-data__right {
font-size: 1.7rem;
letter-spacing: 1px;
}
}
.c-data__history {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 34px 0 124px;
}
@media only screen and (max-width: 767px) {
.c-data__history {
flex-wrap: wrap;
margin: 50px 0 100px;
}
}
@media only screen and (max-width: 516px) {
.c-data__history {
margin: 34px 0 80px;
}
}
.c-data__info {
width: 30%;
}
@media only screen and (max-width: 1024px) {
.c-data__info {
width: 18%;
}
}
@media only screen and (max-width: 767px) {
.c-data__info {
width: 100%;
}
}
.c-data__info span {
color: #e60013;
}
.c-data__info h3 {
font-size: 1.8rem;
letter-spacing: 4px;
}
.c-data__table {
width: 91%;
margin-top: 76px;
}
@media only screen and (max-width: 767px) {
.c-data__table {
width: 100%;
margin-top: 50px;
}
}
.c-data__table.his span:nth-child(1) {
font-size: 2.2rem;
}
@media only screen and (max-width: 767px) {
.c-data__table.his span:nth-child(1) {
font-size: 2rem;
}
}
.c-data__table.his .c-data__line {
padding: 25px 0;
}
@media only screen and (max-width: 767px) {
.c-data__table.his .c-data__line {
padding: 26px 0;
}
}
@media only screen and (max-width: 426px) {
.c-data__table.his .c-data__line:nth-child(3) {
padding: 26px 0 29px;
}
}
.c-data__table.his .c-data__line span:nth-child(2)::before {
bottom: -31px;
}
.c-data__table.his .c-data__line span:nth-child(2)::after {
top: -31px;
}
@media only screen and (max-width: 516px) {
.c-data__table.cor .c-data__line {
padding: 25px 0;
flex-wrap: wrap;
}
.c-data__table.cor .c-data__line span:nth-child(2)::before,
.c-data__table.cor .c-data__line span:nth-child(2)::after {
display: none;
}
}
@media only screen and (max-width: 516px) {
.c-data__table.cor .c-data__line span:nth-child(1) {
width: 100%;
margin-bottom: 10px;
}
}
@media only screen and (max-width: 516px) {
.c-data__table.cor .c-data__line span:nth-child(2) {
width: 100%;
}
}
.c-data__line {
padding: 34px 0;
border-bottom: 1px solid;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
}
.c-data__line:nth-child(1) {
border-top: 1px solid;
}
.c-data__line:nth-child(1) span:nth-child(2)::after {
position: absolute;
content: "";
width: 100%;
background-color: black;
left: 0;
top: -36px;
height: 3px;
}
.c-data__line span:nth-child(1) {
width: 200px;
}
@media only screen and (max-width: 767px) {
.c-data__line span:nth-child(1) {
width: 100px;
}
}
.c-data__line span:nth-child(2) {
display: block;
width: 83%;
position: relative;
line-height: 1.75;
}
.c-data__line span:nth-child(2)::before {
position: absolute;
content: "";
width: 100%;
background-color: black;
left: 0;
bottom: -36px;
height: 3px;
}
.c-message__content {
max-width: 983.53px;
margin: 0 auto;
font-weight: bold;
border-top: 1px solid;
font-size: 1.6rem;
position: relative;
}
.c-message__content .p-top2__line {
top: -267px;
scale: 0.83;
right: -25px;
}
@media only screen and (max-width: 1070px) {
.c-message__content .p-top2__line {
right: -0;
top: -225px;
scale: 0.8;
}
}
@media only screen and (max-width: 767px) {
.c-message__content .p-top2__line {
top: -203px;
scale: 0.6;
right: -20px;
}
}
@media only screen and (max-width: 516px) {
.c-message__content .p-top2__line {
top: -203px;
scale: 0.6;
}
}
.c-message__container {
max-width: 711.16px;
margin: 0 auto;
}
.c-message__text {
margin: 99px 0 51px;
letter-spacing: 1.5px;
line-height: 1.95;
}
@media only screen and (max-width: 1024px) {
.c-message__text {
margin: 80px 0 51px;
}
}
@media only screen and (max-width: 767px) {
.c-message__text {
margin: 55px 0 51px;
}
}
@media only screen and (max-width: 516px) {
.c-message__text {
letter-spacing: 1px;
line-height: 1.75;
}
}
.c-message__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: end;
align-items: flex-end;
}
@media only screen and (max-width: 516px) {
.c-message__list {
flex-wrap: wrap;
}
}
.c-message__image {
width: 63%;
}
@media only screen and (max-width: 516px) {
.c-message__image {
width: 100%;
margin-bottom: 10px;
}
}
.c-message__sign {
width: 33.5%;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 516px) {
.c-message__sign {
width: 100%;
text-align: center;
}
}
.c-phil__part {
text-align: center;
border-top: 1px solid;
font-weight: 600;
max-width: 983.53px;
margin: 0 auto;
}
.c-phil__title {
margin: 64px 0 40px;
}
@media only screen and (max-width: 516px) {
.c-phil__title {
margin: 40px 0;
}
}
.c-phil__title span {
color: #e60013;
font-size: 2.5rem;
}
@media only screen and (max-width: 516px) {
.c-phil__title span {
font-size: 2.2rem;
}
}
.c-phil__title h3 {
font-size: 1.8rem;
letter-spacing: 4px;
}
@media only screen and (max-width: 516px) {
.c-phil__title h3 {
font-size: 1.8rem;
letter-spacing: 1px;
}
}
.c-phil__blue {
font-size: 4.5rem;
color: #055b98;
position: relative;
margin: 0 auto;
max-width: 813px;
}
@media only screen and (max-width: 1024px) {
.c-phil__blue {
max-width: 686px;
}
}
.c-phil__blue .p-top2__line {
position: absolute;
top: -164px;
right: -126px;
scale: 0.83;
}
@media only screen and (max-width: 1124px) {
.c-phil__blue .p-top2__line {
top: -188px;
right: -89px;
scale: 0.7;
}
}
@media only screen and (max-width: 1024px) {
.c-phil__blue .p-top2__line {
right: -31px;
}
}
@media only screen and (max-width: 767px) {
.c-phil__blue .p-top2__line {
top: -195px;
scale: 0.6;
right: -24px;
}
}
@media only screen and (max-width: 516px) {
.c-phil__blue .p-top2__line {
right: -44px;
scale: 0.5;
top: -182px;
}
}
.c-phil__info {
font-size: 4.5rem;
max-width: 813px;
margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
.c-phil__info {
font-size: 3.5rem;
}
}
@media only screen and (max-width: 767px) {
.c-phil__info {
font-size: 2.5rem;
}
}
@media only screen and (max-width: 516px) {
.c-phil__info {
font-size: 2rem;
text-align: left;
}
}
.c-phil__text {
font-size: 2rem;
margin: 48px 0 96px;
line-height: 2;
letter-spacing: 2px;
}
@media only screen and (max-width: 767px) {
.c-phil__text {
font-size: 1.8rem;
margin: 35px 0 80px;
line-height: 1.75;
letter-spacing: 1px;
}
}
@media only screen and (max-width: 516px) {
.c-phil__text {
text-align: left;
font-size: 1.6rem;
margin: 25px 0 80px;
}
}
.c-phil__list {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 2.2rem;
max-width: 971.29px;
margin: 47px auto;
}
@media only screen and (max-width: 767px) {
.c-phil__list {
grid-template-columns: repeat(3, 1fr);
}
}
@media only screen and (max-width: 516px) {
.c-phil__list {
grid-template-columns: repeat(2, 1fr);
}
}
.c-phil__item {
border-radius: 8px;
padding: 20px 28px 28px;
color: white;
background-color: #e60013;
font-weight: 500;
text-align: left;
line-height: 1.8;
min-height: 172.78px;
}
.c-phil__item h4 {
font-size: 2.5rem;
text-align: center;
margin-bottom: 5px;
}
@media only screen and (max-width: 1024px) {
.c-phil__item {
padding: 20px 10px;
}
.c-phil__item h4 {
font-size: 2.2rem;
}
}
@media only screen and (max-width: 516px) {
.c-phil__item h4 {
font-size: 2rem;
}
}
.c-contact__title {
font-size: 3.5rem;
height: 188.33px;
background-color: #e60013;
color: white;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
letter-spacing: 4px;
}
@media only screen and (max-width: 1024px) {
.c-contact__title {
font-size: 3rem;
letter-spacing: 2px;
}
}
@media only screen and (max-width: 767px) {
.c-contact__title {
font-size: 2.5rem;
height: 160.33px;
}
}
.c-contact__content {
font-size: 1.6rem;
max-width: 1011.55px;
margin: 133px auto;
padding: 0 20px;
}
@media only screen and (max-width: 1024px) {
.c-contact__content {
margin: 100px auto;
}
}
.c-contact__part {
margin-bottom: 150px;
}
@media only screen and (max-width: 1024px) {
.c-contact__part {
margin-bottom: 100px;
}
}
@media only screen and (max-width: 516px) {
.c-contact__part {
margin-bottom: 70px;
}
}
.c-contact__info {
font-size: 2.4rem;
border-bottom: 1px solid;
text-align: center;
letter-spacing: 2.5px;
padding-bottom: 9px;
}
@media only screen and (max-width: 767px) {
.c-contact__info {
font-size: 2.2rem;
}
}
@media only screen and (max-width: 516px) {
.c-contact__info {
font-size: 2rem;
letter-spacing: 1.5px;
}
}
.c-contact__social {
text-align: center;
}
.c-contact__desc {
margin: 73px 0 -1px;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 1024px) {
.c-contact__desc {
margin: 60px 0 -1px;
}
}
@media only screen and (max-width: 516px) {
.c-contact__desc {
margin: 35px 0 -1px;
}
}
.c-contact__phone {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
}
@media only screen and (max-width: 1024px) {
.c-contact__phone {
scale: 0.8;
}
}
.c-contact__phone img {
width: 35.82px;
margin-right: 15px;
}
@media only screen and (max-width: 516px) {
.c-contact__phone img {
width: 26.82px;
}
}
.c-contact__phone span {
font-size: 4.2rem;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
letter-spacing: 4px;
}
@media only screen and (max-width: 516px) {
.c-contact__phone span {
font-size: 3.2rem;
}
}
.c-contact__phone.two img {
width: 34.98px;
margin-right: 30px;
}
@media only screen and (max-width: 516px) {
.c-contact__phone.two img {
width: 26.98px;
}
}
.c-contact__time {
letter-spacing: 2px;
margin-bottom: 34px;
}
@media only screen and (max-width: 767px) {
.c-contact__time {
margin-bottom: 15px;
}
}
.c-contact__text {
max-width: 631px;
margin: 42px auto;
line-height: 2.7;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 767px) {
.c-contact__text {
line-height: 1.75;
}
}
@media only screen and (max-width: 516px) {
.c-contact__text {
margin: 30px auto;
letter-spacing: 0;
}
}
.c-licen {
margin-top: -61px;
}
@media only screen and (max-width: 1024px) {
.c-licen {
margin-top: 0;
}
}
.c-licen__part {
max-width: 983.43px;
margin: 0 auto 51px;
}
.c-licen__title span {
color: #e60013;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 400;
}
.c-licen__title h3 {
font-size: 1.8rem;
letter-spacing: 3.5px;
}
.c-licen__table {
margin-top: 16px;
}
.c-licen__table {
overflow-x: auto;
}
.c-licen__table table {
min-width: 525px;
}
.c-licen__table table {
width: 100%;
font-size: 1.6rem;
}
@media only screen and (max-width: 767px) {
.c-licen__table table {
font-size: 1.5rem;
}
}
.c-licen__table table td {
padding: 13px 19px;
letter-spacing: 3px;
line-height: 1.75;
text-wrap-mode: nowrap;
}
@media only screen and (max-width: 767px) {
.c-licen__table table td {
letter-spacing: 0;
}
}
.c-licen__table.two table td:nth-child(1),
.c-licen__table .first {
width: 134px;
}
.c-licen__table table td:nth-child(2) {
width: 143px;
}
.c-licen__table table td:nth-child(3) {
width: 69.5%;
}
.c-licen__table table td:last-child {
width: 5.5% !important;
text-align: center;
}
.c-licen__table caption {
text-align: right;
margin-bottom: 10px;
padding-right: 5px;
}
@media only screen and (max-width: 1024px) {
.c-licen__table table td:nth-child(3) {
width: 58.5%;
}
}
@media only screen and (max-width: 767px) {
.c-licen__table caption {
padding-right: 0;
}
.c-licen__table.two table td:nth-child(1),
.c-licen__table .first {
width: 114px;
}
.c-licen__table table td:nth-child(3) {
width: 46.5%;
}
}
.c-licen__table table,
.c-licen__table tr,
.c-licen__table td {
border: 1px solid;
border-collapse: collapse;
}
.c-news__list {
max-width: 971.7px;
margin: 0 auto;
}
.c-news__item {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
border-bottom: 1px solid;
padding: 24px 0;
}
@media only screen and (max-width: 767px) {
.c-news__item {
flex-wrap: wrap;
}
}
.c-news__item:nth-child(1) {
border-top: 1px solid;
}
.c-news__item .c-case__link {
width: 10%;
}
@media only screen and (max-width: 516px) {
.c-news__item .c-case__link {
margin-top: 10px;
}
}
.c-news__image {
width: 171.33px;
}
@media only screen and (max-width: 767px) {
.c-news__image {
width: 250.33px;
}
}
.c-news__info {
width: 67.5%;
margin-top: 11px;
}
@media only screen and (max-width: 1024px) {
.c-news__info {
width: 61.5%;
}
}
@media only screen and (max-width: 767px) {
.c-news__info {
width: 79%;
}
}
@media only screen and (max-width: 516px) {
.c-news__info {
width: 100%;
}
.c-news__info .p-top3__date {
margin-left: 0;
}
}
.c-news__info .p-top3__category {
border-radius: 36px;
letter-spacing: 0px;
margin-right: 33px;
}
.c-news__info .p-top3__letter {
margin-left: 10px;
margin-top: 8px;
}
@media only screen and (max-width: 516px) {
.c-news__info .p-top3__letter {
margin-left: 0;
}
}
.c-news__detail {
font-size: 1.6rem;
max-width: 980.55px;
margin: -121px auto 0;
}
@media only screen and (max-width: 1024px) {
.c-news__detail {
margin: -25px auto 0;
}
}
.c-news__detail .c-news__info {
width: 100%;
margin-top: 0;
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
align-items: center;
}
.c-news__detail .c-news__info .p-top3__date {
margin-left: 0;
}
.c-news__letter {
font-size: 2.8rem;
border-bottom: 1px solid;
padding-bottom: 41px;
margin-top: 14px;
letter-spacing: 5.5px;
font-weight: bold;
margin-bottom: 44px;
}
@media only screen and (max-width: 1024px) {
.c-news__letter {
font-size: 2.5rem;
letter-spacing: 2px;
padding-bottom: 25px;
margin-bottom: 35px;
}
}
@media only screen and (max-width: 767px) {
.c-news__letter {
font-size: 2.2rem;
letter-spacing: 1px;
margin-top: 10px;
}
}
@media only screen and (max-width: 516px) {
.c-news__letter {
font-size: 2rem;
letter-spacing: 0;
padding-bottom: 20px;
margin-bottom: 30px;
}
}
.c-news__content {
border-bottom: 1px solid;
padding-bottom: 65px;
line-height: 2;
margin-bottom: 70px;
}
@media only screen and (max-width: 1024px) {
.c-news__content {
padding-bottom: 50px;
margin-bottom: 50px;
}
}
@media only screen and (max-width: 516px) {
.c-news__content {
padding-bottom: 30px;
margin-bottom: 45px;
}
}
.c-news__content img {
height: auto;
margin: 30px 0;
}
.c-news__bottom {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
max-width: 930.76px;
margin: 0 auto;
-webkit-box-align: center;
align-items: center;
}
.c-news__bottom .p-top2__link {
width: 227.82px;
padding-left: 37px;
font-size: 1.4rem;
}
@media only screen and (max-width: 516px) {
.c-news__bottom .p-top2__link {
padding-left: 13px;
letter-spacing: 0;
margin-left: 0;
margin: 0;
max-width: 173.82px;
}
.c-news__bottom .p-top2__link img {
width: 23.13px;
margin-right: 10px;
}
}
.c-news__arrow {
width: 62px;
}
@media only screen and (max-width: 767px) {
.c-news__arrow {
width: 50px;
}
}
@media only screen and (max-width: 516px) {
.c-news__arrow {
width: 40px;
}
}
.c-privacy__content {
font-size: 1.6rem;
padding: 0 20px;
max-width: 869px;
margin: 126px auto;
line-height: 1.9;
}
@media only screen and (max-width: 1024px) {
.c-privacy__content {
margin: 100px auto;
}
}
@media only screen and (max-width: 767px) {
.c-privacy__content {
margin: 80px auto;
}
}
@media only screen and (max-width: 516px) {
.c-privacy__content {
margin: 60px auto;
}
}
.c-privacy__content h3 {
font-size: 1.6rem;
}
.c-contact {
font-size: 1.6rem;
font-weight: bold;
}
.c-recon__container {
padding: 0 20px;
}
.c-recon__title {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/recruit/recruit_contact01.png);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
color: white;
font-weight: bold;
text-align: center;
padding: 62px 20px 107px;
letter-spacing: 4px;
}
@media only screen and (max-width: 1024px) {
.c-recon__title {
padding: 62px 20px 80px;
}
}
@media only screen and (max-width: 516px) {
.c-recon__title {
padding: 70px 20px;
}
}
.c-recon__title h2 {
font-size: 3.5rem;
}
@media only screen and (max-width: 1024px) {
.c-recon__title h2 {
font-size: 3rem;
letter-spacing: 2px;
}
}
@media only screen and (max-width: 767px) {
.c-recon__title h2 {
font-size: 2.5rem;
}
}
.c-recon__title p {
font-size: 2.4rem;
margin-top: 118px;
line-height: 1.75;
letter-spacing: 2.5px;
}
@media only screen and (max-width: 1024px) {
.c-recon__title p {
margin-top: 70px;
}
}
@media only screen and (max-width: 767px) {
.c-recon__title p {
margin-top: 40px;
font-size: 2rem;
letter-spacing: 1px;
text-align: left;
}
}
@media only screen and (max-width: 516px) {
.c-recon__title p {
margin-top: 30px;
font-size: 1.8rem;
}
}
.c-recon__icon {
max-width: 659.32px;
margin: 41px auto 85px;
}
@media only screen and (max-width: 516px) {
.c-recon__icon {
margin: 41px auto 50px;
}
}
.c-recon__part {
margin-bottom: 56px;
}
.c-recon__part .c-contact__desc {
margin: 44px 0 -1px;
}
.c-recon__info {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/title_red.png);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
color: white;
font-size: 2.3rem;
max-width: 795.88px;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
height: 65.85px;
margin: 0 auto;
border-radius: 8px;
}
@media only screen and (max-width: 767px) {
.c-recon__info {
font-size: 2.1rem;
}
}
@media only screen and (max-width: 516px) {
.c-recon__info {
font-size: 1.9rem;
}
}
.c-list__content {
max-width: 983.53px;
margin: 0 auto;
font-size: 1.6rem;
}
.c-list__title {
background-color: #f6f6f6;
height: 64.45px;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding-left: 27px;
border-left: 9px solid #e60013;
font-size: 2rem;
letter-spacing: 2px;
margin-bottom: 57px;
}
@media only screen and (max-width: 767px) {
.c-list__title {
font-size: 1.8rem;
letter-spacing: 1px;
padding-left: 15px;
}
}
@media only screen and (max-width: 516px) {
.c-list__title {
margin-bottom: 40px;
}
}
.c-list__line {
display: -webkit-box;
display: flex;
border-bottom: 1px solid;
padding: 15px 2px;
letter-spacing: 1px;
line-height: 1.75;
-webkit-box-align: center;
align-items: center;
}
@media only screen and (max-width: 516px) {
.c-list__line {
flex-wrap: wrap;
}
}
.c-list__line:nth-child(1) {
border-top: 1px solid;
}
.c-list__line span:nth-child(1) {
font-weight: bold;
width: 152px;
}
@media only screen and (max-width: 516px) {
.c-list__line span:nth-child(1) {
width: 100%;
margin-bottom: 10px;
}
}
.c-list__line span:nth-child(2) {
width: 84%;
letter-spacing: 1px;
}
@media only screen and (max-width: 516px) {
.c-list__line span:nth-child(2) {
width: 100%;
}
}
.c-list__link {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 98px auto;
max-width: 500.73px;
}
@media only screen and (max-width: 767px) {
.c-list__link {
margin: 60px auto;
}
}
@media only screen and (max-width: 516px) {
.c-list__link {
flex-wrap: wrap;
-webkit-box-pack: center;
justify-content: center;
margin: 45px auto;
}
}
.c-list__link a:nth-child(1) {
padding-left: 73px;
}
.c-list__link .p-top2__link {
width: 227.82px;
padding-left: 31px;
font-size: 1.4rem;
}
@media only screen and (max-width: 516px) {
.c-list__link .p-top2__link {
margin: 10px;
}
}
.c-voice__content {
font-size: 1.6rem;
max-width: 883.53px;
margin: 0 auto;
}
.c-voice__top {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin: 210px auto 4px;
max-width: 876.86px;
position: relative;
}
@media only screen and (max-width: 1024px) {
.c-voice__top {
margin: 170px auto 4px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__top {
margin: 80px auto 4px;
}
}
.c-voice__top .p-top2__line {
top: -248px;
right: -122px;
}
@media only screen and (max-width: 1124px) {
.c-voice__top .p-top2__line {
right: -60px;
}
}
@media only screen and (max-width: 1024px) {
.c-voice__top .p-top2__line {
right: 0;
top: -230px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__top .p-top2__line {
right: -32px;
top: -200px;
}
}
@media only screen and (max-width: 516px) {
.c-voice__top .p-top2__line {
right: -43px;
top: -187px;
scale: 0.5;
}
}
.c-voice__link {
width: 28%;
}
@media only screen and (max-width: 767px) {
.c-voice__link {
width: 31%;
}
}
.c-voice__arrow {
width: 25.6px;
margin: 15px auto;
}
@media only screen and (max-width: 516px) {
.c-voice__arrow {
margin: 10px auto;
}
}
.c-voice__part {
margin-bottom: 111px;
padding-top: 150px;
margin-top: -150px;
}
@media only screen and (max-width: 767px) {
.c-voice__part {
margin-bottom: 100px;
padding-top: 100px;
margin-top: -100px;
}
}
@media only screen and (max-width: 516px) {
.c-voice__part {
margin-bottom: 80px;
}
}
.c-voice__title {
font-size: 3.5rem;
text-align: center;
color: #e60013;
font-weight: bold;
line-height: 1.75;
letter-spacing: 3px;
margin-bottom: 167px;
}
@media only screen and (max-width: 1024px) {
.c-voice__title {
font-size: 3rem;
letter-spacing: 1px;
margin-bottom: 110px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__title {
font-size: 2.5rem;
margin-bottom: 70px;
}
}
@media only screen and (max-width: 516px) {
.c-voice__title {
font-size: 2.1rem;
letter-spacing: 0;
margin-bottom: 55px;
}
}
.c-voice__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
}
@media only screen and (max-width: 767px) {
.c-voice__list {
flex-wrap: wrap;
}
}
.c-voice__left {
width: 53%;
margin-left: 28px;
}
@media only screen and (max-width: 1024px) {
.c-voice__left {
width: 55%;
margin-left: 20px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__left {
width: 100%;
margin-left: 0;
}
}
.c-voice__item {
margin-bottom: 58px;
}
@media only screen and (max-width: 1024px) {
.c-voice__item {
margin-bottom: 40px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__item {
margin-bottom: 30px;
}
}
.c-voice__question {
color: #e60013;
font-weight: bold;
letter-spacing: 2px;
}
.c-voice__answer h4 {
font-size: 2.4rem;
margin: 16px 0 14px;
}
@media only screen and (max-width: 767px) {
.c-voice__answer h4 {
margin: 10px 0;
font-size: 2rem;
}
}
@media only screen and (max-width: 516px) {
.c-voice__answer h4 {
font-size: 1.8rem;
}
}
.c-voice__answer p {
letter-spacing: 2.1px;
line-height: 1.75;
}
.c-voice__right {
width: 36%;
margin-top: -160px;
margin-right: 11px;
}
@media only screen and (max-width: 767px) {
.c-voice__right {
width: 100%;
max-width: 260px;
margin: 20px auto 0;
}
}
.c-voice__first {
margin-bottom: 176px;
}
@media only screen and (max-width: 1024px) {
.c-voice__first {
margin-bottom: 135px;
}
}
@media only screen and (max-width: 767px) {
.c-voice__first {
margin-bottom: 60px;
}
}
@media only screen and (max-width: 516px) {
.c-voice__first {
margin-bottom: 40px;
}
}
.c-voice__second {
max-width: 316.56px;
margin: 0 auto;
}
.c-recruit__list {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
font-size: 1.6rem;
max-width: 982.53px;
margin: 0 auto;
}
@media only screen and (max-width: 1024px) {
.c-recruit__list {
margin: 120px auto;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__list {
flex-wrap: wrap;
}
}
.c-recruit__left {
width: 68.5%;
}
@media only screen and (max-width: 767px) {
.c-recruit__left {
width: 100%;
margin-bottom: 30px;
}
}
.c-recruit__part {
font-weight: bold;
margin-bottom: 105px;
}
@media only screen and (max-width: 767px) {
.c-recruit__part {
margin-bottom: 85px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__part:first-child {
margin-bottom: 110px;
}
}
.c-recruit__title {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/title_red.png);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
font-size: 2.3rem;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
height: 44.29px;
border-radius: 8px;
position: relative;
color: white;
height: 65.85px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__title {
font-size: 2rem;
padding: 10px 20px;
height: auto;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__title {
font-size: 1.8rem;
padding: 10px 14px;
}
}
.c-recruit__title img {
position: absolute;
}
.c-recruit__title.one img {
width: 147.2px;
top: -94px;
left: 57px;
}
@media only screen and (max-width: 516px) {
.c-recruit__title.one img {
width: 130.2px;
top: -84px;
left: 40px;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__title.two {
-webkit-box-pack: start;
justify-content: flex-start;
padding-left: 20px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__title.two {
-webkit-box-pack: center;
justify-content: center;
padding-left: 0;
}
}
.c-recruit__title.two img {
width: 158.46px;
right: 20px;
bottom: 1px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__title.two img {
right: -50px;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__title.two img {
right: -15px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__title.two img {
width: 120.46px;
bottom: 46px;
}
}
.c-recruit__text {
margin: 44px 0 28px 9px;
letter-spacing: 1.5px;
line-height: 1.95;
}
@media only screen and (max-width: 767px) {
.c-recruit__text {
margin: 30px 0;
letter-spacing: 1px;
line-height: 1.75;
}
}
.c-recruit__text h3 {
font-size: 2rem;
margin-top: -23px;
margin-left: -7px;
letter-spacing: 0px;
line-height: 1.8;
margin-bottom: 29px;
}
@media only screen and (max-width: 767px) {
.c-recruit__text h3 {
font-size: 1.8rem;
margin-top: 0;
margin-left: 0;
letter-spacing: 0px;
line-height: 1.8;
margin-bottom: 15px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__text h3 {
font-size: 1.65rem;
}
}
.c-recruit__text p {
font-size: 1.7rem;
margin-left: -7px;
letter-spacing: 0px;
line-height: 1.8;
}
@media only screen and (max-width: 767px) {
.c-recruit__text p {
letter-spacing: 1px;
font-size: 1.6rem;
margin-left: 0;
}
}
.c-recruit__first {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
max-width: 671.52px;
margin: 0 auto;
}
.c-recruit__image {
width: 48.5%;
}
.c-recruit__second {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2.2rem;
letter-spacing: 4px;
position: relative;
}
@media only screen and (max-width: 1024px) {
.c-recruit__second {
letter-spacing: 2px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__second {
grid-template-columns: repeat(2, 1fr);
gap: 2rem;
letter-spacing: 1px;
}
}
.c-recruit__item {
border: 1px solid #1aad5d;
border-radius: 8px;
background-color: #f7f8f8;
color: #1aad5d;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
height: 80.54px;
position: relative;
text-align: center;
}
.c-recruit__item.active {
background-color: #1aad5d;
color: white;
}
.c-recruit__tab {
max-width: 599.91px;
background-color: rgba(255, 255, 255, 0.803);
border-radius: 8px;
border: 1px solid #1aad5d;
position: absolute;
left: 199px;
top: 10px;
width: 100vw;
padding: 20px 20px 45px;
z-index: 2;
display: none;
}
@media only screen and (max-width: 1290px) {
.c-recruit__tab {
max-width: 45.5vw;
left: 22%;
}
}
@media only screen and (max-width: 1024px) {
.c-recruit__tab {
max-width: 44vw;
}
}
.c-recruit__tab h4 {
font-size: 2.7rem;
border-bottom: 1px solid #1aad5d;
color: black;
letter-spacing: 2px;
text-align: center;
padding-bottom: 25px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__tab h4 {
font-size: 2.5rem;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__tab h4 {
padding-bottom: 20px;
font-size: 2.2rem;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__tab h4 {
padding-bottom: 10px;
font-size: 2rem;
letter-spacing: 0;
}
}
.c-recruit__white {
max-width: 442.75px;
margin: 0 auto;
}
.c-recruit__post {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
margin-top: 31px;
-webkit-box-align: start;
align-items: flex-start;
}
@media only screen and (max-width: 516px) {
.c-recruit__post {
flex-wrap: wrap;
margin-top: 20px;
}
}
.c-recruit__img {
width: 44%;
}
@media only screen and (max-width: 516px) {
.c-recruit__img {
width: 100%;
max-width: 250px;
margin: 0 auto;
}
}
.c-recruit__div {
width: 53%;
color: black;
letter-spacing: 3px;
line-height: 2;
margin-top: -9px;
text-align: left;
}
@media only screen and (max-width: 767px) {
.c-recruit__div {
line-height: 1.75;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__div {
width: 100%;
margin-top: 10px;
letter-spacing: 1px;
}
}
.c-recruit__data {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/recruit/recruit_data.jpg);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
padding: 67px 20px 7px;
margin: 61px 0 20px;
}
@media only screen and (max-width: 516px) {
.c-recruit__data {
padding: 50px 20px 7px;
}
}
.c-recruit__license {
text-align: center;
}
.c-recruit__license span {
font-size: 1.146rem;
color: #e60013;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
letter-spacing: 1px;
}
.c-recruit__license h4 {
font-size: 2.292rem;
letter-spacing: 2px;
margin-top: -8px;
}
@media only screen and (max-width: 516px) {
.c-recruit__license h4 {
font-size: 2rem;
margin-top: 0;
}
}
.c-recruit__group {
max-width: 665.13px;
margin: 67px auto;
display: -webkit-box;
grid-gap: 2rem;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
@media only screen and (max-width: 1024px) {
.c-recruit__group {
grid-template-columns: repeat(2, 1fr);
}
.c-recruit__circle {
display: flex;
flex-direction: column;
align-items: center;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__group {
flex-wrap: wrap;
-webkit-box-pack: center;
justify-content: center;
margin: 25px -20px;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__circle {
margin: 15px 10px;
}
}
.c-recruit__number {
aspect-ratio: 1/1;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
font-size: 5.482rem;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
border-radius: 50%;
background-color: #e60013;
color: white;
position: relative;
letter-spacing: 6px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__number {
width: 136.79px;
height: 136.79px;
font-size: 4.482rem;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__number {
width: 110.79px;
height: 110.79px;
font-size: 3.482rem;
}
}
.c-recruit__number div {
position: relative;
display: inline-block;
}
.c-recruit__number span {
font-size: 1.72rem;
position: absolute;
right: -26px;
bottom: 12px;
}
.c-recruit__case {
font-size: 1.411rem;
text-align: center;
margin-top: 14px;
letter-spacing: 1px;
}
.c-recruit__red {
font-size: 2rem;
font-weight: bold;
color: #e60013;
border-bottom: 1px solid;
letter-spacing: 1px;
padding-bottom: 11px;
}
.c-recruit__news .c-news__info {
width: 52.5%;
}
@media only screen and (max-width: 767px) {
.c-recruit__news .c-news__info {
width: 76%;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__news .c-news__info {
width: 100%;
}
}
.c-recruit__news .c-case__link {
min-width: 101px;
}
.c-recruit__right {
width: 27%;
margin-top: -265px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__right {
margin-top: 0;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__right {
width: 100%;
max-width: 264.46px;
margin: 50px auto 0;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__right {
margin: 40px auto 0;
}
}
.c-recruit__right .p-top2__link {
width: 100%;
border-radius: 8px;
margin-left: 0;
margin-top: -13px;
height: 71px;
padding-left: 68px;
font-size: 1.4rem;
}
@media only screen and (max-width: 1024px) {
.c-recruit__right .p-top2__link {
padding-left: 24px;
}
}
.c-recruit__right .p-top2__link img {
margin-right: 33px;
}
.c-recruit__pink {
background-color: #f7f0f3;
padding: 19px 31px 35px;
border-radius: 3px;
}
@media only screen and (max-width: 1024px) {
.c-recruit__pink {
padding: 19px 20px 35px;
}
}
@media only screen and (max-width: 767px) {
.c-recruit__pink {
padding: 19px 31px 35px;
}
}
.c-recruit__info span {
font-size: 1.283rem;
color: #e60013;
font-family: acumin-variable, sans-serif;
font-variation-settings:
"slnt" 0,
"wdth" 90,
"wght" 600;
letter-spacing: 1px;
}
.c-recruit__info h4 {
font-size: 2rem;
margin-top: 8px;
letter-spacing: 0px;
}
.c-recruit__letter {
font-size: 1.2rem;
margin: 26px 2px 10px;
letter-spacing: 1px;
line-height: 1.75;
}  .c-menu__intro {
cursor: pointer;
}
html {
scroll-behavior: smooth;
}
.c-service__blue.sur .c-invest__part {
margin-top: -67px;
padding-top: 67px;
}
@media only screen and (max-width: 767px) {
.c-service__blue.sur .c-invest__part {
margin-top: -55px;
padding-top: 55px;
}
}
@media only screen and (max-width: 516px) {
.c-service__blue.sur .c-invest__part {
margin-top: -40px;
padding-top: 40px;
}
.c-service__link.sur a {
width: 47%;
}
}
.line-container {
position: relative;
width: 200px;
height: 200px;
}
.line {
position: absolute;
width: 250px;
height: 10px;
transform-origin: left center;
transform: scaleX(0) rotate(45deg);
opacity: 0;
animation: drawLine 0.8s ease-out forwards;
border-radius: 2px;
}
.yellow {
top: 100px;
left: -20px;
background-color: #f6aa00;
animation-delay: 0s;
}
.red {
top: 50px;
left: 0;
background-color: #e60013;
animation-delay: 0.6s;
}
@keyframes drawLine {
0% {
transform: scaleX(0) rotate(45deg);
opacity: 0;
}
100% {
transform: scaleX(1) rotate(45deg);
opacity: 1;
}
}
.form-meta {
max-width: 752.24px;
margin: 66px auto 45px;
}
.form-item2 {
width: 503.17px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.form-item3 {
width: 336.17px;
display: flex;
justify-content: space-between;
font-size: 1.4rem;
align-items: flex-end;
}
@media only screen and (max-width: 1024px) {
.form-item2 {
width: 67%;
}
}
.form-item1 {
max-width: 447.78px;
width: 74%;
}
::placeholder {
color: #bbbcbc;
opacity: 0.8;
font-size: 1.6rem;
line-height: 2;
font-family:
Noto Sans JP,
sans-serif;
}
.mwform-checkbox-field label,
.mwform-radio-field label {
display: flex;
align-items: center;
}
.form-white {
visibility: hidden;
}
.mwform-checkbox-field-text {
margin-left: 4px;
font-size: 1.3rem;
letter-spacing: 1px;
}
.wpcf7-checkbox input {
width: 24.1px;
height: 24.1px;
margin: 0;
}
@media only screen and (max-width: 576px) {
.wpcf7-checkbox input {
width: 20.1px;
height: 20.1px;
}
}
.form-list {
display: flex;
margin: 0 auto 26px;
width: 100%;
}
.form-list.form-message1 {
margin: 25px auto;
align-items: flex-start;
}
@media only screen and (max-width: 767px) {
.form-list.form-message1 {
margin: 0;
}
}
.form-list.form-message1 .form-item:first-child {
margin-top: 13px;
}
.form-input.year {
width: 102.71px;
}
.form-input.date {
width: 55.64px;
}
.form-item:first-child {
width: 191.36px;
margin-right: 38px;
flex-direction: row-reverse;
}
.form-box {
align-items: flex-start;
margin: 26px auto 29px;
}
.form-info {
width: 145px;
font-size: 1.6rem;
font-weight: bold;
line-height: 2;
}
@media only screen and (max-width: 1024px) {
.form-info {
font-size: 1.6rem;
}
}
@media only screen and (max-width: 516px) {
.form-info {
font-size: 1.5rem;
}
}
.form-item {
-webkit-box-align: center;
align-items: center;
display: -webkit-box;
display: flex;
}
.form-red {
font-size: 1.1rem;
color: #e60013;
border-radius: 5px;
margin-right: 15px;
}
.form-info {
letter-spacing: 1px;
}
.form-list .form-item:nth-child(2) {
display: block;
width: 71%;
}
#form-mess .form-input {
padding: 10px 20px;
width: 560.75px;
height: 233.35px;
}
.mw_wp_form_confirm #form-mess .form-item:first-child {
margin-top: 0;
}
#form-mess {
align-items: flex-start;
}
#form-mess .form-item:first-child {
margin-top: 13px;
}
.form-blue {
background-color: #005aab !important;
}
.form-input {
box-sizing: border-box;
font-family:
Noto Sans JP,
sans-serif;
padding: 0 20px;
height: 48.69px;
width: 100%;
border: 1px solid white;
font-size: 1.6rem;
line-height: 2;
border-radius: 4px;
max-width: 234.35px;
background-color: #efefef;
}
.form-list.choice {
margin: 55px auto 31px;
}
@media only screen and (max-width: 767px) {
.form-list.choice {
margin: 20px auto;
}
}
.form-message2 {
box-sizing: border-box;
font-family:
Noto Sans JP,
sans-serif;
padding: 10px 20px;
height: 198.45px;
width: 100%;
border: 1px solid white;
font-size: 1.5rem;
line-height: 2;
border-radius: 4px;
background-color: #efefef;
}
.form-note {
font-size: 1.6rem;
margin: 113px 0 76px;
line-height: 2.7;
letter-spacing: 1.5px;
display: flex;
justify-content: center;
}
.form-meta .wpcf7-list-item {
margin: 0;
}
.contact-main2__text {
margin: 80px 0 63px;
text-align: center;
font-size: 1.6rem;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
position: relative;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 767px) {
.contact-main2__text {
margin: 30px 0 50px;
}
}
@media only screen and (max-width: 516px) {
.contact-main2__text {
font-size: 1.4rem;
letter-spacing: 0;
}
}
.contact-main2__text a {
color: #e60013;
}
.contact-main2__text.sp {
display: none;
}
.contact-main2__text .error {
bottom: -17px;
position: absolute;
left: 50%;
transform: translate(-50%);
}
.contact-main2__meta {
justify-content: center;
display: flex;
margin-bottom: 9px;
}
.p-contact .p-contact__btn__back {
display: none;
}
.p-contact__btn__back {
position: relative;
}
.mw_wp_form_confirm .p-contact__btn__back {
margin-right: 38px;
}
.p-contact__btn__back span {
top: 11px;
}
.p-contact__btn__back span {
cursor: pointer;
transform: rotate(180deg);
top: 87px;
font-size: 2rem;
position: absolute;
left: 26px;
color: white;
}
.contact-main2__link {
position: relative;
}
.form-item2 .wpcf7-form-control-wrap {
width: 100%;
}
.contact-main2__link input {
font-weight: bold;
-webkit-appearance: none;
cursor: pointer;
border: none;
position: relative;
width: 171.69px;
color: white;
background-color: #e60013;
height: 49.29px;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
font-size: 1.7rem;
border-radius: 36px;
letter-spacing: 1px;
padding-right: 30px;
}
@media only screen and (max-width: 1024px) {
.contact-main2__link input {
letter-spacing: 3px;
}
}
.contact-main2__text .mwform-checkbox-field-text {
display: none;
}
.contact-main2__link span {
top: 9px;
right: 35px;
font-size: 2rem;
position: absolute;
color: white;
}
.contact-main2__link:hover span {
cursor: pointer;
right: 25px;
transition: linear 0.5s;
}
.p-contact__btn__back {
position: relative;
}
.p-contact__btn__back input {
-webkit-appearance: none;
cursor: pointer;
color: white;
background-color: #595857;
border: 0;
height: 49px;
width: 150px;
}
.p-contact__btn__back span {
top: 9px;
}
.mw_wp_form_confirm .contact-main2__link img {
right: 20px;
}
.mw_wp_form_confirm .form-box {
margin: 0 auto 19px;
}
.mw_wp_form_confirm .form-list.form-message1 .form-item:first-child {
margin-top: 0;
}
.mw_wp_form_confirm .contact-main2__text,
.mw_wp_form_confirm .contact-main2__text.sp {
display: none;
}
.form-meta .wpcf7-spinner {
display: none;
}
.wpcf7 form .wpcf7-response-output {
text-align: center;
}
@media only screen and (max-width: 767px) {
.form-item2 {
width: 100%;
}
.form-list .form-item:nth-child(2) {
width: 100%;
}
.form-list {
flex-wrap: wrap;
}
.form-item:first-child {
justify-content: flex-start;
margin-bottom: 10px;
width: 100%;
flex-direction: row;
}
.form-info {
margin-right: 12px;
}
.contact-main2__link input {
font-size: 1.7rem;
letter-spacing: 1px;
width: 182.81px;
}
.mw_wp_form_confirm .p-contact__btn__back {
margin-right: 18px;
}
.contact-main2__meta {
max-width: 465px;
margin: 0 auto;
}
}
@media only screen and (max-width: 516px) {
.mw_wp_form_confirm .contact-main2__link img {
display: none;
}
.contact-main2__link img {
right: 20px;
}
.contact-main2__meta {
max-width: 288px;
}
.contact-main2__link span {
display: none;
}
.p-contact__btn__back span {
display: none;
}
.p-contact__btn__back input {
width: 50px;
font-size: 1.4rem;
}
.contact-main2__button {
width: 100%;
}
.contact-main2__text.sp {
display: flex;
}
.form-input {
width: 100%;
}
.contact-main2__link input {
margin: 0 auto;
height: 50.17px;
}
}
.mw_wp_form_confirm .form-list {
align-items: center !important;
}
.mw_wp_form_complete {
padding: 8vw 11vw;
max-width: 55vw;
margin: 150px auto 450px;
background: white;
border-radius: 8px;
}
.form-item4 {
width: 68%;
max-width: 518px;
margin-left: 4px;
}
.wpcf7-checkbox.form-choice {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.5rem 0;
}
@media only screen and (max-width: 516px) {
.wpcf7-checkbox.form-choice {
grid-template-columns: repeat(2, 1fr);
}
}
.wpcf7-checkbox {
display: flex;
justify-content: center;
align-items: center;
}
.contact-main2__text .wpcf7-list-item-label {
display: none;
}
.contact-main2__text .wpcf7-not-valid-tip {
bottom: -30px;
position: absolute;
left: 50%;
width: max-content;
transform: translateX(-50%);
}
.wpcf7-form-control-wrap {
position: unset !important;
}
.contact-main2__text .wpcf7-checkbox input {
width: 23.1px;
height: 23.1px;
margin-right: 10px;
}
.form-item4 .wpcf7-list-item {
margin: 0 0 16px;
text-wrap-mode: nowrap;
}
@media only screen and (max-width: 516px) {
.form-item4 .wpcf7-list-item {
width: 100%;
}
}
.wpcf7-list-item-label {
font-size: 1.4rem;
margin-left: 15px;
letter-spacing: 1.5px;
}
@media only screen and (max-width: 516px) {
.wpcf7-list-item-label {
letter-spacing: 1px;
margin-left: 5px;
}
}
.wpcf7-checkbox label {
display: flex;
align-items: center;
}
.mw_wp_form_complete {
border: 1px solid;
text-align: left;
}
@media only screen and (max-width: 1024px) {
.mw_wp_form_complete {
padding: 8vw 4vw;
max-width: 67vw;
}
}
@media only screen and (max-width: 767px) {
.form-item4 {
margin-left: 0;
width: 100%;
}
.form-item1 {
width: 100%;
}
.mw_wp_form_complete {
max-width: 85vw;
margin: 150px auto 250px;
}
.form-meta {
margin: 40px auto 45px;
max-width: 448.24px;
}
}
@media only screen and (max-width: 516px) {
.form-meta {
margin: 35px auto 45px;
}
.form-item1 {
max-width: 100%;
}
.mw_wp_form_complete {
margin: 120px auto 200px;
}
}
.mw_wp_form_complete p {
margin-bottom: 20px;
font-size: 1.651rem;
}
.mw_wp_form_confirm .p-contact__btn__back {
display: block;
}
.mw_wp_form_confirm .contact-main2__link input {
width: 277px;
}
@media only screen and (max-width: 767px) {
.mw_wp_form_confirm .contact-main2__link input {
width: 227px;
}
.mw_wp_form_confirm .contact-main2__link img {
display: none;
}
}
@media only screen and (max-width: 516px) {
.form-list .form-item:nth-child(2) {
width: 100%;
}
.mw_wp_form_confirm .contact-main2__link input {
font-size: 1.4rem;
width: 145px;
}
}
.contact-main2__link img {
position: absolute;
width: 26.13px;
right: 17px;
top: 50%;
transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
.contact-main2__button {
margin-top: 60px;
}
}
@media only screen and (max-width: 516px) {
.contact-main2__button {
margin-top: 40px;
}
.contact-main2__text {
margin-bottom: 30px;
}
}
.wpcf7-form .wpcf7-radio label {
position: relative;
cursor: pointer;
}
.wpcf7-form .wpcf7-radio input[type="radio"] {
position: relative;
visibility: hidden;
}
.wpcf7-form .wpcf7-radio input[type="radio"] + span { }
.wpcf7-form .wpcf7-radio input[type="radio"] + span:before {
display: block;
position: absolute;
content: "";
border-radius: 100%;
height: 14px;
width: 14px;
top: 1px;
border: 2px solid #222;
}
.wpcf7-form .wpcf7-radio input[type="radio"] + span:after {
display: block;
position: absolute;
content: "";
border-radius: 100%;
height: 8px;
width: 8px;
top: 5.5px;
left: 4.5px;
visibility: hidden;
}
.wpcf7-form .wpcf7-radio input[type="radio"]:checked + span:before {
background: transparent; }
.wpcf7-form .wpcf7-radio input[type="radio"]:checked + span:after {
background: #222;
visibility: visible;
}
.form-red.white {
visibility: hidden;
}
.form-item3 .wpcf7-not-valid-tip {
position: absolute;
left: 20px;
}
@media only screen and (max-width: 1024px) {
.c-header__recruit {
width: 130.72px;
}
}
@media only screen and (max-width: 767px) {
.form-info {
width: auto;
}
}
@media only screen and (max-width: 516px) {
.c-header__recruit {
width: 115.72px;
right: 5px;
}
.form-input.year {
width: 90.71px;
}
.form-input.date {
width: 50px;
padding: 0 10px;
}
}
.post-image {
position: relative;
}
.post-image img:nth-child(2) {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
object-fit: cover;
}
.post-image img:nth-child(1) {
visibility: hidden;
}
.p-delivery__pagination .wp-pagenavi a,
.p-delivery__pagination .wp-pagenavi span {
color: black;
text-decoration: none;
border: none;
padding: 20px 22px;
margin: 15px;
font-family: acumin-variable, sans-serif;
font-size: 1.7rem;
}
.pages {
display: none;
}
.p-delivery__pagination {
margin: 87px 0 0;
display: flex;
justify-content: center;
}
.p-delivery__pagination .wp-pagenavi a:hover,
.p-delivery__pagination .wp-pagenavi span.current {
border-color: #efefef;
background-color: #efefef;
color: black;
}
.nextpostslink {
display: none;
}
.previouspostslink {
display: none;
}
@media only screen and (max-width: 1024px) {
.p-delivery__pagination .wp-pagenavi a,
.p-delivery__pagination .wp-pagenavi span {
padding: 10px 13px;
margin: 5px;
}
}
@media only screen and (max-width: 767px) {
.p-delivery__pagination {
margin: 60px 0 0;
}
}
@media only screen and (max-width: 516px) {
.p-delivery__pagination {
margin: 50px 0 0;
}
.p-delivery__pagination .wp-pagenavi a,
.p-delivery__pagination .wp-pagenavi span {
font-size: 1.6rem;
}
}
.c-news__bottom .p-top2__link {
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.is-hidden {
visibility: hidden;
}
.p-top1__slide .slick-dots li button:before {
width: 32.39px;
height: 4.5px;
content: "";
background: #dedfdf;
opacity: 1;
}
.p-top1__slide .slick-dots li.slick-active button:before {
opacity: 1;
color: black;
background: #e60013;
}
.p-top1__slide .slick-dots {
bottom: -30px;
}
.p-top1__slide .slick-dots li {
margin: 0 14px;
}
@media only screen and (max-width: 1024px) {
.p-top1__slide .slick-dots li {
margin: 0 10px;
}
.p-top1__slide .slick-dots li button:before {
width: 25.39px;
height: 3.5px;
}
}
@media only screen and (max-width: 767px) {
.p-top1__slide .slick-dots li {
margin: 0 8px;
}
.p-top1__slide .slick-dots li button:before {
width: 22.39px;
height: 3px;
}
}
@media only screen and (max-width: 516px) {
.p-top1__slide .slick-dots li {
margin: 0 6px;
}
.p-top1__slide .slick-dots li button:before {
width: 20px;
}
}
.c-case__category.blue {
background-color: #0c80af;
}
.c-case__black .active {
position: relative;
}
.c-case__black .active::before {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: -16px;
background-color: black;
width: 8.2px;
height: 8.2px;
}
.c-list__item {
margin-bottom: 100px;
}
@media only screen and (max-width: 516px) {
.c-list__item {
margin-bottom: 80px;
}
}
.c-recruit__tab.is-active {
display: block;
z-index: 10;
}
.c-recruit__item {
cursor: pointer;
}
@media only screen and (max-width: 767px) {
.recruit__tab-wrapper {
display: flex;
justify-content: center;
}
.c-recruit__tab {
width: 100%;
max-width: 90vw;
}
.c-recruit__tab {
position: absolute;
left: 50%;
transform: translateX(-50%);
width: 57vw;
box-sizing: border-box;
padding: 20px;
top: 60px;
}
.c-recruit__tab--left {
left: 30px;
transform: unset;
}
.c-recruit__tab--right {
right: 30px;
transform: unset;
left: unset;
}
}
@media only screen and (max-width: 516px) {
.c-recruit__item:nth-child(even) .c-recruit__tab {
right: 40px;
transform: unset;
left: unset;
}
.c-recruit__tab {
width: 60vw;
left: 40px;
transform: unset;
}
}
.p-top2__animate {
position: relative;
height: 221.94px;
}
.logo-line {
position: absolute;
width: 100%;
opacity: 0;
filter: drop-shadow(0 0 0 transparent);
transition: filter 0.4s ease;
}
.wrapper {
position: absolute;
left: 13%;
bottom: 32%;
width: 100%;
overflow: hidden;
} .logo-line.reds {
left: 0;
bottom: 0;
}
.logo-line.animate.reds {
animation:
appear-from-left 1s ease-out forwards,
streak 2.5s ease-in-out infinite 2s;
z-index: 2;
} .logo-line.yellows {
position: relative;
left: 0;
bottom: 0;
}
.logo-line.animate.yellows {
animation:
appear-from-right 1s ease-out forwards 0.6s,
streak 2.5s ease-in-out infinite 2.6s;
z-index: 1;
}
.logo-line:hover {
filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.6));
} @keyframes appear-from-left {
0% {
opacity: 0;
transform: translateX(-50px);
}
100% {
opacity: 1;
transform: translateX(0);
}
} @keyframes appear-from-right {
0% {
opacity: 0;
transform: translateX(50px);
}
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes streak {
0% {
filter: drop-shadow(0 0 0 transparent);
}
50% {
filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.8));
}
100% {
filter: drop-shadow(0 0 0 transparent);
}
} @media only screen and (max-width: 516px) {
.p-top1__item:nth-child(2) .p-top1__abs {
display: flex;
align-items: center;
}
}
.p-top1__image {
overflow: hidden; }
.p-top1__image img {
transition: transform 0.5s ease; }
a:hover .p-top1__image img {
transform: scale(1.1); }
.p-top1__item:hover img {
opacity: 1; }
.p-top1__item:hover {
opacity: 1; }
.p-top4__image {
overflow: hidden;
border-radius: 8px;
border: 1px solid white; }
.p-top4__image img {
transition: transform 0.5s ease; scale: 1.03;
}
a:hover .p-top4__image img {
transform: scale(1.1); }
.p-top4__item:hover {
opacity: 1; }
.p-top4__item:hover img {
opacity: 1; }
@-webkit-keyframes moveScrollBtn {
0% {
top: 0;
}
100% {
top: calc(100% - 7px);
}
}
@keyframes moveScrollBtn {
0% {
top: 0;
}
100% {
top: calc(100% - 7px);
}
}
.p-top-mv__scroll {
position: absolute;
bottom: -53px;
left: 6.5%;
font-size: 1.5rem;
letter-spacing: 1px;
color: #e60013;
font-weight: bold;
display: -webkit-box;
display: flex;
line-height: 1.2;
font-family: acumin-variable, sans-serif;
flex-direction: column;
align-items: center;
}
.p-top-mv__scroll span {
position: relative;
display: block;
height: 161px;
width: 1.5px;
background-color: #e60013;
margin-top: 5px;
}
.p-top-mv__scroll span::before {
position: absolute;
content: "";
width: 7.61px;
height: 7.61px;
border-radius: 50%;
background-color: #e60013;
left: 50%;
top: 0;
animation: moveScrollBtn 1.5s ease-in-out infinite;
transform: translateX(-50%);
}
@media only screen and (max-width: 1024px) {
.p-top-mv__scroll span {
height: 120px;
}
.p-top-mv__scroll {
left: 30px;
}
}
@media only screen and (max-width: 767px) {
.p-top-mv__scroll span {
height: 80px;
}
.p-top-mv__scroll span {
height: 100%;
}
.p-top-mv__scroll {
bottom: -38px;
font-size: 1.4rem;
height: 31%;
}
}
.border-white.sp {
display: none;
}
@media only screen and (max-width: 516px) {
.p-top-mv__scroll {
bottom: -20%;
left: 20px;
font-size: 1.3rem;
height: 40%;
}
.border-white.pc {
display: none;
}
.border-white.sp {
display: block;
}
}   .c-min {
margin-bottom: 250px;
}
.c-min__hero {
background-image: url(//sunny-con.co.jp/wp-content/themes/sunny/assets/img/recruit3/bg.png);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
padding: 169px 20px 341px;
}
@media only screen and (max-width: 1024px) {
.c-min {
margin-bottom: 150px;
}
.c-min__hero {
padding: 120px 20px 290px;
}
}
@media only screen and (max-width: 767px) {
.c-min {
margin-bottom: 100px;
}
.c-min__hero {
padding: 90px 20px 230px;
}
}
@media only screen and (max-width: 516px) {
.c-min__hero {
padding: 50px 20px 230px;
}
}
.c-min__hero-inner {
max-width: 1100px;
margin: 0 auto;
}
.c-min__eyebrow {
font-size: 2.5rem;
font-family: "acumin-variable", sans-serif;
font-variation-settings:
"wght" 600,
"wdth" 90,
"slnt" 0;
}
@media only screen and (max-width: 516px) {
.c-min__eyebrow {
font-size: 2.3rem;
}
}
.c-min__title {
font-weight: bold;
font-size: 3.5rem;
margin: -10px 0 64px;
}
@media only screen and (max-width: 1024px) {
.c-min__title {
margin: -10px 0 30px;
}
}
@media only screen and (max-width: 767px) {
.c-min__title {
font-size: 3rem;
}
}
@media only screen and (max-width: 516px) {
.c-min__title {
font-size: 2.8rem;
}
}
.c-min__accent {
color: #e60013;
}
.c-min__accent.en {
letter-spacing: 3.5px;
}
.c-min__lead {
font-weight: bold;
font-size: 2.1rem;
letter-spacing: 2.1px;
}
@media only screen and (max-width: 767px) {
.c-min__lead {
font-size: 1.9rem;
letter-spacing: 1.1px;
}
}
@media only screen and (max-width: 516px) {
.c-min__lead {
font-size: 1.7rem;
}
}
.c-min__gallery {
grid-gap: 2.5rem;
display: grid;
margin: 88px 0 10px;
grid-template-columns: repeat(4, 1fr);
}
@media only screen and (max-width: 1024px) {
.c-min__gallery {
margin: 60px 0 10px;
grid-template-columns: repeat(2, 1fr);
}
}
@media only screen and (max-width: 767px) {
.c-min__gallery {
grid-gap: 2rem;
margin: 40px 0 10px;
}
}
@media only screen and (max-width: 516px) {
.c-min__gallery {
grid-template-columns: repeat(2, 1fr);
}
}
.c-min__content {
padding: 0 20px;
}
@media only screen and (max-width: 516px) {
.c-min__content {
padding: 0 10px;
}
}
.c-min__inner {
background: #e0e1e1;
max-width: 1137px;
margin: -125px auto 0;
padding: 74px 20px;
}
@media only screen and (max-width: 767px) {
.c-min__inner {
margin: -110px auto 0;
}
}
@media only screen and (max-width: 516px) {
.c-min__inner {
padding: 74px 10px;
}
}
.c-min__panel {
max-width: 1010.11px;
margin: 0 auto;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
gap: 30px;
}
@media only screen and (max-width: 1024px) {
.c-min__panel {
gap: 20px;
}
}
.c-min__card {
background: rgb(255, 255, 255);
border-radius: 8px;
padding: 33px 30px 45px;
}
@media only screen and (max-width: 1024px) {
.c-min__card {
padding: 33px 20px 45px;
}
}
@media only screen and (max-width: 516px) {
.c-min__card {
padding: 33px 10px;
}
}
.c-min__card-title {
font-weight: bold;
font-size: 2.8rem;
line-height: calc(40 / 28);
text-align: center;
letter-spacing: 4px;
}
@media only screen and (max-width: 1084px) {
.c-min__card-title {
font-size: 2.6rem;
}
}
@media only screen and (max-width: 1024px) {
.c-min__card-title {
font-size: 2.3rem;
letter-spacing: 0px;
}
}
@media only screen and (max-width: 516px) {
.c-min__card-title {
font-size: 2rem;
}
}
.c-min__kpi-row {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
max-width: 500px;
margin: 0 auto;
margin: 65px auto 72px;
}
@media only screen and (max-width: 1024px) {
.c-min__kpi-row {
max-width: 420px;
}
}
@media only screen and (max-width: 767px) {
.c-min__kpi-row {
margin: 40px auto 50px;
}
}
@media only screen and (max-width: 516px) {
.c-min__kpi-row {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px 30px;
margin: 30px auto 40px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.c-min__kpi {
font-weight: bold;
font-size: 2.3rem;
letter-spacing: 2.3px;
color: #e60013;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
line-height: 1;
}
@media only screen and (max-width: 1024px) {
.c-min__kpi {
font-size: 2rem;
letter-spacing: 1.3px;
}
}
@media only screen and (max-width: 516px) {
.c-min__kpi {
font-size: 1.5rem;
letter-spacing: 0;
}
}
.c-min__kpi-label {
margin-bottom: 4px;
}
.c-min__kpi-value {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
}
.c-min__kpi-num {
font-size: 5.1rem;
letter-spacing: 5.1px;
margin: 0 5px;
}
@media only screen and (max-width: 1024px) {
.c-min__kpi-num {
font-size: 4.1rem;
letter-spacing: 3.1px;
}
}
@media only screen and (max-width: 516px) {
.c-min__kpi-num {
font-size: 3.1rem;
letter-spacing: 0.1px;
}
}
.c-min__kpi-unit {
margin-bottom: 4px;
display: inline-block;
}
.c-min__kpi--blue {
color: #0c3190;
}
.c-min__note {
font-weight: bold;
font-size: 1.6rem;
letter-spacing: 1.6px;
text-align: center;
line-height: 1.35;
}
@media only screen and (max-width: 767px) {
.c-min__note {
letter-spacing: 0px;
}
}
.c-min__grid--2 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
gap: 30px;
}
@media only screen and (max-width: 1024px) {
.c-min__grid--2 {
gap: 20px;
}
}
@media only screen and (max-width: 767px) {
.c-min__grid--2 {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.c-min__card--ratio {
-webkit-box-flex: 0;
-webkit-flex: 0 0 43.5%;
-ms-flex: 0 0 43.5%;
flex: 0 0 43.5%;
padding: 33px 0 45px;
}
@media only screen and (max-width: 767px) {
.c-min__card--ratio {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
}
.c-min__card--ratio .c-min__note {
padding: 0 20px;
}
.c-min__split--2 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
position: relative;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
margin: -10px 0 48px;
}
@media only screen and (max-width: 767px) {
.c-min__split--2 {
margin: -10px auto 48px;
max-width: 400px;
}
}
@media only screen and (max-width: 516px) {
.c-min__split--2 {
margin: 0 auto 40px;
}
}
.c-min__split--2::after {
width: 3px;
position: absolute;
content: "";
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
background-color: #c9caca;
height: 100%;
}
.c-min__stat {
width: 50%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.c-min__stat-title {
text-align: left;
}
.c-min__stat-value {
margin: 16px 0 0;
}
.c-min__card--breakdown {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.c-min__card--breakdown .c-min__note {
letter-spacing: 0;
}
.c-min__bar-list {
padding: 0 5px;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
gap: 21px;
padding: 10px 0;
margin: -7px 5px 23px;
}
@media only screen and (max-width: 767px) {
.c-min__bar-list {
margin: -7px auto 23px;
max-width: 400px;
}
}
.c-min__bar-list::after {
width: 3px;
position: absolute;
content: "";
top: 0;
left: 0;
background-color: #c9caca;
height: 100%;
}
.c-min__bar-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
gap: 10px;
height: 47px;
position: relative;
font-weight: bold;
font-size: 1.9rem;
letter-spacing: 1.9px;
--width-after: 0%; }
@media only screen and (max-width: 1024px) {
.c-min__bar-item {
font-size: 1.7rem;
letter-spacing: 0;
}
}
@media only screen and (max-width: 516px) {
.c-min__bar-item {
font-size: 1.6rem;
}
}
.c-min__bar-item::after {
position: absolute;
content: "";
top: 0;
left: 0;
height: 100%;
width: var(--width-after); -webkit-transition: width 1s ease-in-out;
transition: width 1s ease-in-out; }
.c-min__bar-item--red {
color: white;
}
@media only screen and (max-width: 516px) {
.c-min__bar-item--red .c-min__bar-label {
padding-left: 20px;
}
}
.c-min__bar-item--red::after {
background-color: #e60013;
}
.c-min__bar-label {
z-index: 2;
position: relative;
padding-left: 58px;
}
@media only screen and (max-width: 1024px) {
.c-min__bar-label {
padding-left: 41px;
}
}
.c-min__bar-value {
font-size: 1.3rem;
letter-spacing: 1.3px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
line-height: 1;
z-index: 2;
position: relative;
padding-right: 93px;
margin-bottom: 7px;
}
@media only screen and (max-width: 1024px) {
.c-min__bar-value {
padding-right: 43px;
}
}
@media only screen and (max-width: 516px) {
.c-min__bar-value {
padding-right: 34px;
}
}
.c-min__bar-num {
font-size: 2.9rem;
letter-spacing: 2.9px;
margin-bottom: -2px;
}
@media only screen and (max-width: 1024px) {
.c-min__bar-num {
font-size: 2.7rem;
letter-spacing: 0.9px;
}
}
@media only screen and (max-width: 516px) {
.c-min__bar-num {
font-size: 2.5rem;
}
}
.c-min__bar-item--blue .c-min__bar-value {
color: #236eb7;
}
.c-min__bar-item--blue::after {
background: #236eb7;
}
.c-min__bar-item--green .c-min__bar-value {
color: #53b333;
}
.c-min__bar-item--green::after {
background: #53b333;
}
.c-min__media--chart {
max-width: 718px;
margin: 7px auto 9px;
overflow: hidden; }
.c-min__media--chart.is-visible .c-min__media--img {
opacity: 1; -webkit-clip-path: inset(0 0 0 0);
clip-path: inset(
0 0 0 0
); }
.c-min__media--img {
width: 100%;
height: auto;
opacity: 0; -webkit-transition:
opacity 1s ease-in-out,
-webkit-clip-path 2s ease-in-out;
transition:
opacity 1s ease-in-out,
-webkit-clip-path 2s ease-in-out;
transition:
opacity 1s ease-in-out,
clip-path 2s ease-in-out;
transition:
opacity 1s ease-in-out,
clip-path 2s ease-in-out,
-webkit-clip-path 2s ease-in-out; -webkit-clip-path: inset(0 100% 0 0);
clip-path: inset(0 100% 0 0); }
.c-min__gender-body {
max-width: 878.35px;
margin: 37px auto 25px;
}
.c-min__gender {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
gap: 15px;
}
@media only screen and (max-width: 767px) {
.c-min__gender {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.c-min__gender-item {
height: 75px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
color: white;
position: relative;
width: 0%; -webkit-transition: width 1s ease-in-out;
transition: width 1s ease-in-out; }
.c-min__gender-item--male {
background: #3da5de;
}
.c-min__gender-label {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.c-min__gender-icon {
width: 33.8px;
margin-right: 5px;
}
@media only screen and (max-width: 516px) {
.c-min__gender-icon {
width: 26.8px;
}
}
.c-min__gender-icon.girl {
width: 31.64px;
}
@media only screen and (max-width: 516px) {
.c-min__gender-icon.girl {
width: 24.64px;
}
}
.c-min__gender-text {
font-weight: bold;
font-size: 1.1rem;
line-height: calc(14 / 11);
}
.c-min__gender-value {
font-weight: bold;
font-size: 2.8rem;
line-height: calc(40 / 28);
letter-spacing: 2.8px;
margin-left: 20px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
}
@media only screen and (max-width: 1024px) {
.c-min__gender-value {
font-size: 2.5rem;
letter-spacing: 0.8px;
}
}
.c-min__gender-unit {
font-size: 1.8rem;
line-height: calc(28.32 / 18);
letter-spacing: 1.8px;
margin: 4px;
display: inline-block;
}
@media only screen and (max-width: 1024px) {
.c-min__gender-unit {
font-size: 1.6rem;
margin: 4px 2px;
}
}
@media only screen and (max-width: 516px) {
.c-min__gender-unit {
font-size: 1.5rem;
}
}
.c-min__gender-item--female {
background: #e60013;
}
.c-min__total {
position: relative;
margin: 15px 0;
}
.c-min__total::after {
width: 1px;
position: absolute;
content: "";
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
background-color: #231916;
height: 24.56px;
}
.c-min__total::before {
width: 1px;
position: absolute;
content: "";
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
right: 0;
background-color: #231916;
height: 24.56px;
}
.c-min__total-inner {
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
font-weight: bold;
font-size: 1.6rem;
letter-spacing: 1.6px;
}
.c-min__total-inner::after {
width: 100%;
position: absolute;
content: "";
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
background-color: #231916;
height: 1px;
}
.c-min__total-text {
background-color: white;
padding: 0 10px 9px;
z-index: 2;
position: relative;
}
.c-min__total-num {
font-weight: bold;
font-size: 3.5rem;
letter-spacing: 3.5px;
color: #e60013;
margin-right: -7px;
}
@media only screen and (max-width: 1024px) {
.c-min__total-num {
font-size: 3rem;
}
}
@media only screen and (max-width: 516px) {
.c-min__total-num {
font-size: 2.8rem;
}
}
.c-min__stacked-bar {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
gap: 15px;
height: 75px;
}
.c-min__stacked-seg {
width: 0; -webkit-transition: width 1s ease-in-out;
transition: width 1s ease-in-out; color: white;
text-align: center;
font-size: 1.872rem;
}
@media only screen and (max-width: 516px) {
.c-min__stacked-seg {
font-size: 1.672rem;
}
}
.c-min__stacked-seg .c-min__gender-value {
width: 100%;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
margin-left: 0;
}
.c-min__stacked-seg--red {
background: #e60013; }
.c-min__stacked-seg-label {
display: block;
font-weight: bold;
margin: 4px 0 -6px;
}
.c-min__stacked-seg--blue {
background: #3da5de; }
.c-min__stacked-seg--green {
background: #53b335; }
.c-min__card--holiday {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
@media only screen and (max-width: 1024px) {
.c-min__card--holiday {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
}
@media only screen and (max-width: 767px) {
.c-min__card--holiday {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
}
.c-min__tag-grid {
grid-gap: 1rem;
display: grid;
grid-template-columns: repeat(2, 1fr);
padding: 0 5px;
margin: 24px auto 17px;
max-width: 667.3px;
}
@media only screen and (max-width: 767px) {
.c-min__tag-grid {
margin: 24px auto 17px;
max-width: 400px;
}
}
.c-min__tag {
background: #e50013;
color: white;
font-weight: bold;
font-size: 1.6rem;
line-height: calc(21.19 / 16);
min-height: 87.37px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center; opacity: 0;
-webkit-transform: translateY(14px);
-ms-transform: translateY(14px);
transform: translateY(14px);
-webkit-transition:
opacity 600ms ease,
-webkit-transform 600ms ease;
transition:
opacity 600ms ease,
-webkit-transform 600ms ease;
transition:
opacity 600ms ease,
transform 600ms ease;
transition:
opacity 600ms ease,
transform 600ms ease,
-webkit-transform 600ms ease;
-webkit-transition-delay: calc(var(--i, 0) * 80ms);
transition-delay: calc(var(--i, 0) * 80ms);
will-change: opacity, transform;
}
.c-min__tag.is-visible {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
.c-min__tag--wide {
grid-column: 1/-1;
}
@media (prefers-reduced-motion: reduce) {
.c-min__tag {
-webkit-transition: none !important;
transition: none !important;
-webkit-transform: none !important;
-ms-transform: none !important;
transform: none !important;
opacity: 1 !important;
}
}
.c-min__kpi-inline-num {
color: #e50013;
}
.c-min__card--overtime {
-webkit-box-flex: 0;
-webkit-flex: 0 0 30%;
-ms-flex: 0 0 30%;
flex: 0 0 30%;
padding: 33px 20px 45px;
}
@media only screen and (max-width: 767px) {
.c-min__card--overtime {
-webkit-box-flex: 0;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
}
@media only screen and (max-width: 516px) {
.c-min__card--overtime {
padding: 33px 10px;
}
}
.c-min__card--overtime .c-min__card-title {
letter-spacing: 1px;
}
.c-min__overtime {
margin: 72px 0 62px;
}
@media only screen and (max-width: 767px) {
.c-min__overtime {
margin: 50px auto 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
max-width: 400px;
gap: 10px;
}
}
@media only screen and (max-width: 516px) {
.c-min__overtime {
margin: 35px auto 0;
}
}
.c-min__overtime-item {
max-width: 166.7px;
margin: 0 auto 34px;
}
@media only screen and (max-width: 767px) {
.c-min__overtime-item {
width: 48%;
}
}
.c-min__overtime-term {
background: #8c9ec0;
color: white;
text-align: center;
font-weight: bold;
font-size: 2rem;
letter-spacing: 2px;
}
@media only screen and (max-width: 516px) {
.c-min__overtime-term {
font-size: 1.8rem;
}
}
.c-min__overtime-value {
font-weight: bold;
font-size: 1.3rem;
letter-spacing: 1.3px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
background: #e8ecf4;
padding: 25px 0;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: flex-end;
}
.c-min__overtime-num {
font-weight: bold;
font-size: 2.9rem;
letter-spacing: 2.9px;
color: #e50013;
line-height: 1.2;
}
@media only screen and (max-width: 516px) {
.c-min__overtime-num {
font-size: 2.7rem;
letter-spacing: 1px;
}
}
.c-min__overtime-num.blue {
color: #189ccc;
}
.c-min__card--map {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.c-min__map {
position: relative;
max-width: 602.68px;
margin: 35px auto -36px;
}
@media only screen and (max-width: 767px) {
.c-min__map {
margin: 35px auto 0;
}
}
.c-min__map-marker {
position: absolute;
font-weight: bold;
font-size: 2.7rem;
letter-spacing: 2.7px;
}
@media only screen and (max-width: 1024px) {
.c-min__map-marker {
font-size: 2.5vw;
}
}
@media only screen and (max-width: 767px) {
.c-min__map-marker {
font-size: 3.3vw;
}
}
.c-min__map-marker:nth-child(1) {
top: -2%;
left: 17.4%;
}
.c-min__map-marker:nth-child(2) {
top: 26%;
left: 0%;
}
.c-min__map-marker:nth-child(3) {
bottom: 25.5%;
left: 25%;
}
.c-min__map-marker:nth-child(4) {
bottom: 3.5%;
left: 34.5%;
}
.c-min__map-marker:nth-child(5) {
top: 18%;
left: 74.3%;
}
.c-min__map-marker:nth-child(6) {
top: 31%;
left: 70.5%;
}
.c-min__map-marker:nth-child(7) {
top: 35%;
left: 80%;
}
.c-min__map-marker:nth-child(8) {
top: 46%;
right: 4.7%;
}
.c-min__map-marker:nth-child(9) {
top: 66%;
right: 3.5%;
}
.c-min__map-marker--m5 {
color: #6bb72d;
}
.c-min__map-marker--m1 {
color: #8c9ec0;
}
.c-min__map-marker--m2 {
color: #f5a900;
}
.c-min__map-marker--m25 {
color: #e50013;
}
.c-min__map-marker--m7 {
color: #189ccc;
} .c-min__card {
opacity: 0;
-webkit-transform: translateY(20px);
-ms-transform: translateY(20px);
transform: translateY(20px); -webkit-transition:
opacity 0.6s ease,
-webkit-transform 0.6s ease;
transition:
opacity 0.6s ease,
-webkit-transform 0.6s ease;
transition:
opacity 0.6s ease,
transform 0.6s ease;
transition:
opacity 0.6s ease,
transform 0.6s ease,
-webkit-transform 0.6s ease; will-change: opacity, transform; } .c-min__card.is-visible {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0); }  @media only screen and (max-width: 1024px) {
.c-min__stacked-seg-label {
margin: 8px 0 -6px;
}
}
@media only screen and (max-width: 516px) {
.c-min__stacked-seg-label {
margin: 11px 0 -6px;
}
}*,
:after,
:before {
border: 0 solid #e5e7eb;
box-sizing: border-box
}
:after,
:before {
--tw-content: ""
}
:host,
html {
-webkit-text-size-adjust: 100%;
font-feature-settings: normal;
-webkit-tap-highlight-color: transparent;
font-family: Noto Sans JP, sans-serif;
font-variation-settings: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4
}
body {
line-height: inherit;
margin: 0
}
hr {
border-top-width: 1px;
color: inherit;
height: 0
}
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted
}
a {
color: inherit;
text-decoration: inherit
}
b,
strong {
font-weight: bolder
}
code,
kbd,
pre,
samp {
font-feature-settings: normal;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace;
font-size: 1em;
font-variation-settings: normal
}
small {
font-size: 80%
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sub {
bottom: -.25em
}
sup {
top: -.5em
}
table {
border-collapse: collapse;
border-color: inherit;
text-indent: 0
}
button,
input,
optgroup,
select,
textarea {
font-feature-settings: inherit;
color: inherit;
font-family: inherit;
font-size: 100%;
font-variation-settings: inherit;
font-weight: inherit;
line-height: inherit;
margin: 0;
padding: 0
}
button,
select {
text-transform: none
}
[type=button],
[type=reset],
[type=submit],
button {
-webkit-appearance: button;
background-color: transparent;
background-image: none
}
:-moz-focusring {
outline: auto
}
:-moz-ui-invalid {
box-shadow: none
}
progress {
vertical-align: baseline
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto
}
[type=search] {
-webkit-appearance: textfield;
outline-offset: -2px
}
::-webkit-search-decoration {
-webkit-appearance: none
}
::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit
}
summary {
display: list-item
}
blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
margin: 0
}
fieldset {
margin: 0
}
fieldset,
legend {
padding: 0
}
menu,
ol,
ul {
list-style: none;
margin: 0;
padding: 0
}
dialog {
padding: 0
}
textarea {
resize: vertical
}
input::-moz-placeholder,
textarea::-moz-placeholder {
color: #9ca3af;
opacity: 1
}
input::placeholder,
textarea::placeholder {
color: #9ca3af;
opacity: 1
}
[role=button],
button {
cursor: pointer
}
:disabled {
cursor: default
}
audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
display: block;
vertical-align: middle
}
img,
video {
height: auto;
max-width: 100%
}
[hidden] {
display: none
}
*,
:after,
:before {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: #00A266;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia:
}
::backdrop {
--tw-border-spacing-x: 0;
--tw-border-spacing-y: 0;
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness: proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-color: #00A266;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia:
}
.container {
width: 100%
}
@media (min-width:640px) {
.container {
max-width: 640px
}
}
@media (min-width:767px) {
.container {
max-width: 767px
}
}
@media (min-width:1280px) {
.container {
max-width: 1280px
}
}
@media (min-width:1600px) {
.container {
max-width: 1600px
}
}
@media (min-width:1920px) {
.container {
max-width: 1920px
}
}
.\!pointer-events-none {
pointer-events: none!important
}
.pointer-events-none {
pointer-events: none
}
.fixed {
position: fixed
}
.\!absolute {
position: absolute!important
}
.absolute {
position: absolute
}
.\!relative {
position: relative!important
}
.relative {
position: relative
}
.sticky {
position: sticky
}
.\!bottom-0 {
bottom: 0!important
}
.\!bottom-3 {
bottom: .75rem!important
}
.\!bottom-6 {
bottom: 1.5rem!important
}
.\!left-0 {
left: 0!important
}
.\!left-6 {
left: 1.5rem!important
}
.\!left-auto {
left: auto!important
}
.\!right-3 {
right: .75rem!important
}
.-top-32 {
top: -8rem
}
.-top-px {
top: -1px
}
.bottom-0 {
bottom: 0
}
.bottom-\[3\.75rem\] {
bottom: 3.75rem
}
.bottom-\[calc\(var\(--1column\)\*2\)\] {
bottom: calc(var(--1column)*2)
}
.left-0 {
left: 0
}
.left-1\/2 {
left: 50%
}
.left-5 {
left: 1.25rem
}
.left-6 {
left: 1.5rem
}
.left-\[-10rem\] {
left: -10rem
}
.left-\[4\.8rem\] {
left: 4.8rem
}
.left-\[calc\(var\(--1column\)\*-4\)\] {
left: calc(var(--1column)*-4)
}
.left-\[var\(--1column\)\] {
left: var(--1column)
}
.right-0 {
right: 0
}
.right-1\/2 {
right: 50%
}
.right-2 {
right: .5rem
}
.right-3 {
right: .75rem
}
.right-6 {
right: 1.5rem
}
.right-\[calc\(var\(--1column\)\*2\)\] {
right: calc(var(--1column)*2)
}
.right-\[calc\(var\(--1column\)\*3\)\] {
right: calc(var(--1column)*3)
}
.right-\[calc\(var\(--1column\)\*4\)\] {
right: calc(var(--1column)*4)
}
.top-0 {
top: 0
}
.top-1\/2 {
top: 50%
}
.top-16 {
top: 4rem
}
.top-2 {
top: .5rem
}
.top-32 {
top: 8rem
}
.top-4 {
top: 1rem
}
.top-48 {
top: 12rem
}
.top-5 {
top: 20px;
}
.top-7 {
top: 1.75rem
}
.top-\[2\.1rem\] {
top: 2.1rem
}
.top-\[20\%\] {
top: 20%
}
.top-\[26\.25rem\] {
top: 26.25rem
}
.top-\[45rem\] {
top: 45rem
}
.\!z-0 {
z-index: 0!important
}
.-z-10 {
z-index: -10
}
.-z-20 {
z-index: -20
}
.z-0 {
z-index: 0
}
.z-10 {
z-index: 10
}
.z-20 {
z-index: 20
}
.z-30 {
z-index: 30
}
.z-40 {
z-index: 40
}
.z-50 {
z-index: 50
}
.\!m-0 {
margin: 0!important
}
.mx-auto {
margin-left: auto;
margin-right: auto
}
.my-6 {
margin-bottom: 1.5rem;
margin-top: 1.5rem
}
.\!mt-3 {
margin-top: .75rem!important
}
.-mt-20 {
margin-top: -5rem
}
.-mt-3 {
margin-top: -.75rem
}
.-mt-40 {
margin-top: -10rem
}
.-mt-px {
margin-top: -1px
}
.mb-16 {
margin-bottom: 4rem
}
.mb-5 {
margin-bottom: 1.25rem
}
.ml-1 {
margin-left: .25rem
}
.ml-2 {
margin-left: .5rem
}
.ml-4 {
margin-left: 1rem
}
.ml-\[calc\(var\(--1column\)\*-5\)\] {
margin-left: calc(var(--1column)*-5)
}
.ml-auto {
margin-left: auto
}
.mt-1 {
margin-top: .25rem
}
.mt-10 {
margin-top: 2.5rem
}
.mt-12 {
margin-top: 3rem
}
.mt-14 {
margin-top: 3.5rem
}
.mt-16 {
margin-top: 4rem
}
.mt-2 {
margin-top: .5rem
}
.mt-20 {
margin-top: 5rem
}
.mt-28 {
margin-top: 7rem
}
.mt-3 {
margin-top: .75rem
}
.mt-4 {
margin-top: 1rem
}
.mt-5 {
margin-top: 1.25rem
}
.mt-6 {
margin-top: 1.5rem
}
.mt-60 {
margin-top: 15rem
}
.mt-8 {
margin-top: 2rem
}
.mt-9 {
margin-top: 2.25rem
}
.mt-auto {
margin-top: auto
}
.box-content {
box-sizing: content-box
}
.block {
display: block
}
.inline-block {
display: inline-block
}
.\!flex {
display: flex!important
}
.flex {
display: flex
}
.table {
display: table
}
.grid {
display: grid
}
.hidden {
display: none
}
.aspect-\[1\/\.54\] {
aspect-ratio: 1/.54
}
.aspect-\[1\/\.666\] {
aspect-ratio: 1/.666
}
.aspect-\[1\/\.6675\] {
aspect-ratio: 1/.6675
}
.aspect-square {
aspect-ratio: 1/1
}
.\!h-1 {
height: .25rem!important
}
.\!h-\[100svh\] {
height: 100svh!important
}
.\!h-px {
height: 1px!important
}
.h-0 {
height: 0
}
.h-1\/2 {
height: 50%
}
.h-10 {
height: 2.5rem
}
.h-12 {
height: 3rem
}
.h-4 {
height: 1rem
}
.h-6 {
height: 1.5rem
}
.h-9 {
height: 2.25rem
}
.h-\[110\%\] {
height: 110%
}
.h-\[1em\] {
height: 1em
}
.h-\[2px\] {
height: 2px
}
.h-\[300\%\] {
height: 300%
}
.h-\[64\%\] {
height: 64%
}
.h-\[calc\(100\%-3\.75rem\)\] {
height: calc(100% - 3.75rem)
}
.h-\[calc\(var\(--diagonal\)\/2\.5\)\] {
height: calc(var(--diagonal)/2.5)
}
.h-\[var\(--diagonal\)\] {
height: var(--diagonal)
}
.h-full {
height: 100%
}
.h-px {
height: 1px
}
.h-screen {
height: 100vh
}
.\!w-1 {
width: .25rem!important
}
.\!w-fit {
width: -moz-fit-content!important;
width: fit-content!important
}
.w-0 {
width: 0
}
.w-12 {
width: 3rem
}
.w-16 {
width: 4rem
}
.w-2 {
width: .5rem
}
.w-24 {
width: 6rem
}
.w-28 {
width: 7rem
}
.w-3 {
width: .75rem
}
.w-32 {
width: 8rem
}
.w-36 {
width: 9rem
}
.w-4 {
width: 1rem
}
.w-40 {
width: 10rem
}
.w-5 {
width: 1.25rem
}
.w-52 {
width: 13rem
}
.w-6 {
width: 1.5rem
}
.w-60 {
width: 15rem
}
.w-64 {
width: 16rem
}
.w-7 {
width: 1.75rem
}
.w-9 {
width: 2.25rem
}
.w-\[\.375rem\] {
width: .375rem
}
.w-\[1\.125rem\] {
width: 3.125rem;
}
.w-\[110\%\] {
width: 110%
}
.w-\[16\.125rem\] {
width: 16.125rem
}
.w-\[17\.125rem\] {
width: 17.125rem
}
.w-\[1em\] {
width: 1em
}
.w-\[37\.7\%\] {
width: 37.7%
}
.w-\[7\.5rem\] {
width: 7.5rem
}
.w-\[75rem\] {
width: 75rem
}
.w-\[calc\(100\%\+\(var\(--1column\)\*2\)\)\] {
width: calc(100% + var(--1column)*2)
}
.w-\[calc\(var\(--1column\)\*1\)\] {
width: calc(var(--1column)*1)
}
.w-\[calc\(var\(--1column\)\*14\)\] {
width: calc(var(--1column)*14)
}
.w-\[calc\(var\(--1column\)\*16\)\] {
width: calc(var(--1column)*16)
}
.w-\[calc\(var\(--1column\)\*18\)\] {
width: calc(var(--1column)*18)
}
.w-\[calc\(var\(--1column\)\*26\)\] {
width: calc(var(--1column)*26)
}
.w-\[calc\(var\(--1column\)\*5\)\] {
width: calc(var(--1column)*5)
}
.w-\[calc\(var\(--1column\)\*6\)\] {
width: calc(var(--1column)*6)
}
.w-\[calc\(var\(--1column\)\*7\)\] {
width: calc(var(--1column)*7)
}
.w-\[calc\(var\(--1column\)\*8\)\] {
width: calc(var(--1column)*8)
}
.w-\[calc\(var\(--width\)\*5\)\] {
width: calc(var(--width)*5)
}
.w-\[var\(--100vw\)\] {
width: var(--100vw)
}
.w-\[var\(--width\)\] {
width: var(--width)
}
.w-fit {
width: -moz-fit-content;
width: fit-content
}
.w-full {
width: 100%
}
.min-w-\[40rem\] {
min-width: 40rem
}
.origin-right {
transform-origin: right
}
.-translate-x-1\/2 {
--tw-translate-x: -50%
}
.-translate-x-1\/2,
.-translate-x-\[var\(--width\)\] {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-x-\[var\(--width\)\] {
--tw-translate-x: calc(var(--width)*-1)
}
.-translate-y-1 {
--tw-translate-y: -0.25rem
}
.-translate-y-1,
.-translate-y-1\/2 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-y-1\/2 {
--tw-translate-y: -50%
}
.-translate-y-14 {
--tw-translate-y: -3.5rem
}
.-translate-y-14,
.-translate-y-full {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-translate-y-full {
--tw-translate-y: -100%
}
.translate-x-\[-15\%\] {
--tw-translate-x: -15%
}
.translate-x-\[-15\%\],
.translate-x-\[15\%\] {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.translate-x-\[15\%\] {
--tw-translate-x: 15%
}
.translate-y-2 {
--tw-translate-y: 0.5rem;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.\!rotate-180 {
--tw-rotate: 180deg!important;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important
}
.-rotate-6 {
--tw-rotate: -6deg
}
.-rotate-6,
.-rotate-90 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.-rotate-90 {
--tw-rotate: -90deg
}
.rotate-180 {
--tw-rotate: 180deg
}
.rotate-180,
.rotate-90 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.rotate-90 {
--tw-rotate: 90deg
}
.rotate-\[25deg\] {
--tw-rotate: 25deg
}
.rotate-\[25deg\],
.scale-0 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.scale-0 {
--tw-scale-x: 0;
--tw-scale-y: 0
}
.transform {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.animate-\[marquee_15s_linear_infinite\] {
animation: marquee 15s linear infinite
}
@keyframes marquee {
0% {
transform: translateX(0)
}
to {
transform: translateX(-100%)
}
}
.animate-\[marquee_4s_linear_infinite\] {
animation: marquee 4s linear infinite
}
@keyframes x {
0% {
transform: translateX(0)
}
to {
transform: translateX(100%)
}
}
.animate-\[x_both_\.5s_ease_1\] {
animation: x .5s ease 1 both
}
.cursor-pointer {
cursor: pointer
}
.resize {
resize: both
}
.list-decimal {
list-style-type: decimal
}
.list-disc {
list-style-type: disc
}
.appearance-none {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr))
}
.grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr))
}
.grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr))
}
.grid-cols-\[calc\(var\(--1column\)\*21\)_1fr\] {
grid-template-columns: calc(var(--1column)*21) 1fr
}
.grid-cols-\[calc\(var\(--1column\)\*4\)_calc\(var\(--1column\)\*22\)\] {
grid-template-columns: calc(var(--1column)*4) calc(var(--1column)*22)
}
.grid-cols-\[calc\(var\(--1column\)\*6\)_1fr\] {
grid-template-columns: calc(var(--1column)*6) 1fr
}
.flex-col {
flex-direction: column
}
.flex-wrap {
flex-wrap: wrap
}
.place-content-center {
place-content: center
}
.items-start {
align-items: flex-start
}
.items-end {
align-items: flex-end
}
.items-center {
align-items: center
}
.justify-center {
justify-content: center
}
.justify-between {
justify-content: space-between
}
.\!gap-3 {
gap: .75rem!important
}
.gap-1 {
gap: .55rem
}
.gap-12 {
gap: 3rem
}
.gap-2 {
gap: .5rem
}
.gap-3 {
gap: 2.75rem;
}
.gap-4 {
gap: 1rem
}
.gap-6 {
gap: 1.5rem
}
.gap-\[\.375rem\] {
gap: .375rem
}
.gap-\[\.625rem\] {
gap: .625rem
}
.gap-\[calc\(var\(--1column\)\*1\)\] {
gap: calc(var(--1column)*1)
}
.gap-y-6 {
row-gap: 1.5rem
}
.overflow-hidden {
overflow: hidden
}
.\!overflow-visible {
overflow: visible!important
}
.overflow-y-auto {
overflow-y: auto
}
.scroll-smooth {
scroll-behavior: smooth
}
.whitespace-nowrap {
white-space: nowrap
}
.rounded-\[1\.25rem\] {
border-radius: 1.25rem
}
.rounded-full {
border-radius: 9999px
}
.rounded-md {
border-radius: .375rem
}
.rounded-bl-md {
border-bottom-left-radius: .375rem
}
.rounded-br-md {
border-bottom-right-radius: .375rem
}
.rounded-tl-md {
border-top-left-radius: .375rem
}
.rounded-tr-md {
border-top-right-radius: .375rem
}
.border {
border-width: 1px
}
.border-y {
border-top-width: 1px
}
.border-b,
.border-y {
border-bottom-width: 1px
}
.border-t {
border-top-width: 1px
}
.border-\[\#005CA8\] {
--tw-border-opacity: 1;
border-color: rgb(0 92 168/var(--tw-border-opacity))
}
.border-\[\#E6E6E6\] {
--tw-border-opacity: 1;
border-color: rgb(230 230 230/var(--tw-border-opacity))
}
.border-current {
border-color: currentColor
}
.border-transparent {
border-color: transparent
}
.border-white {
--tw-border-opacity: 1;
border-color: rgb(255 255 255/var(--tw-border-opacity))
}
.border-white-30 {
border-color: hsla(0, 0%, 100%, .3)
}
.border-white-50 {
border-color: hsla(0, 0%, 100%, .5)
}
.\!bg-\[\#E6E6E6\] {
--tw-bg-opacity: 1!important;
background-color: rgb(230 230 230/var(--tw-bg-opacity))!important
}
.\!bg-transparent {
background-color: transparent!important
}
.\!bg-white {
--tw-bg-opacity: 1!important;
background-color: rgb(255 255 255/var(--tw-bg-opacity))!important
}
.bg-\[\#005CA8\] {
--tw-bg-opacity: 1;
background-color: rgb(230 0 19/var(--tw-bg-opacity))
}
.bg-\[\#212224\] {
--tw-bg-opacity: 1;
background-color: rgb(33 34 36/var(--tw-bg-opacity))
}
.bg-\[\#E6E6E6\] {
--tw-bg-opacity: 1;
background-color: rgb(230 230 230/var(--tw-bg-opacity))
}
.bg-\[var\(--accent-color\)\] {
background-color: var(--accent-color)
}
.bg-\[var\(--color\)\] {
background-color: var(--color)
}
.bg-black {
--tw-bg-opacity: 1;
background-color: rgb(0 0 0/var(--tw-bg-opacity))
}
.bg-black-40 {
background-color: rgba(0, 0, 0, .4)
}
.bg-current {
background-color: currentColor
}
.bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255/var(--tw-bg-opacity))
}
.bg-white-90 {
background-color: hsla(0, 0%, 100%, .9)
}
.fill-\[\#005CA8\],
.fill-\[\#005ca8\] {
fill: #00A266
}
.fill-\[\#A0C6E6\] {
fill: #a0c6e6
}
.fill-current {
fill: currentColor
}
.fill-transparent {
fill: transparent
}
.fill-white {
fill: #fff
}
.stroke-white {
stroke: #fff
}
.stroke-\[1px\] {
stroke-width: 1px
}
.object-cover {
-o-object-fit: cover;
object-fit: cover
}
.p-2 {
padding: .5rem
}
.p-3 {
padding: .75rem
}
.p-6 {
padding: 1.5rem
}
.px-2 {
padding-left: .5rem;
padding-right: .5rem
}
.px-3 {
padding-left: .75rem;
padding-right: .75rem
}
.px-4 {
padding-left: 1rem;
padding-right: 1rem
}
.px-6 {
padding-left: 1.5rem;
padding-right: 1.5rem
}
.px-\[calc\(var\(--1column\)\*2\)\] {
padding-left: calc(var(--1column)*2);
padding-right: calc(var(--1column)*2)
}
.py-1 {
padding-bottom: .25rem;
padding-top: .25rem
}
.py-14 {
padding-bottom: 3.5rem;
padding-top: 3.5rem
}
.py-16 {
padding-bottom: 4rem;
padding-top: 4rem
}
.py-2 {
padding-bottom: .5rem;
padding-top: .5rem
}
.py-20 {
padding-bottom: 5rem;
padding-top: 5rem
}
.py-3 {
padding-bottom: .75rem;
padding-top: .75rem
}
.py-4 {
padding-bottom: 1rem;
padding-top: 1rem
}
.py-5 {
padding-bottom: 1.25rem;
padding-top: 1.25rem
}
.py-6 {
padding-bottom: 1.5rem;
padding-top: 1.5rem
}
.py-9 {
padding-bottom: 2.25rem;
padding-top: 2.25rem
}
.py-\[1\.5rem\] {
padding-bottom: 1.5rem;
padding-top: 1.5rem
}
.pb-10 {
padding-bottom: 2.5rem
}
.pb-12 {
padding-bottom: 3rem
}
.pb-14 {
padding-bottom: 3.5rem
}
.pb-16 {
padding-bottom: 4rem
}
.pb-20 {
padding-bottom: 5rem
}
.pb-28 {
padding-bottom: 7rem
}
.pb-40 {
padding-bottom: 10rem
}
.pb-44 {
padding-bottom: 11rem
}
.pb-6 {
padding-bottom: 1.5rem
}
.pb-60 {
padding-bottom: 15rem
}
.pb-\[62\.5\%\] {
padding-bottom: 62.5%
}
.pl-4 {
padding-left: 1rem
}
.pl-6 {
padding-left: 1.5rem
}
.pl-\[1em\] {
padding-left: 1em
}
.pr-12 {
padding-right: 3rem
}
.pt-12 {
padding-top: 3rem
}
.pt-14 {
padding-top: 3.5rem
}
.pt-16 {
padding-top: 4rem
}
.pt-20 {
padding-top: 5rem
}
.pt-28 {
padding-top: 7rem
}
.pt-3 {
padding-top: .75rem
}
.pt-36 {
padding-top: 9rem
}
.pt-4 {
padding-top: 1rem
}
.pt-6 {
padding-top: 1.5rem
}
.pt-9 {
padding-top: 2.25rem
}
.pt-\[33rem\] {
padding-top: 33rem
}
.text-center {
text-align: center
}
.indent-\[-1em\] {
text-indent: -1em
}
.align-middle {
vertical-align: middle
}
.font-figtree {
font-family: Figtree, sans-serif
}
.text-2xl {
font-size: 1.5rem
}
.text-\[\.625rem\] {
font-size: .625rem
}
.text-\[0px\] {
font-size: 0
}
.text-\[2\.5rem\] {
font-size: 2.5rem
}
.text-\[2rem\] {
font-size: 2rem
}
.text-\[calc\(var\(--100vw\)\*\.5\)\] {
font-size: calc(var(--100vw)*.5)
}
.text-base {
font-size: 1rem
}
.text-lg {
font-size: 1.125rem
}
.text-sm {
font-size: 1.7rem;
}
.text-xl {
font-size: 1.25rem
}
.text-xs {
font-size: .75rem
}
.font-bold {
font-weight: 700
}
.font-medium {
font-weight: 500
}
.font-semibold {
font-weight: 600
}
.leading-\[1\.25\] {
line-height: 1.25
}
.leading-\[1\.5\] {
line-height: 1.5
}
.leading-\[1\.75\] {
line-height: 1.75
}
.leading-loose {
line-height: 2
}
.leading-none {
line-height: 1
}
.leading-normal {
line-height: 1.5
}
.leading-relaxed {
line-height: 1.625
}
.leading-tight {
line-height: 1.25
}
.tracking-\[\.02em\] {
letter-spacing: .02em
}
.tracking-wide {
letter-spacing: .025em
}
.\!text-\[var\(--accent-color\)\] {
color: var(--accent-color)!important
}
.\!text-\[var\(--color\)\] {
color: var(--color)!important
}
.\!text-white {
--tw-text-opacity: 1!important;
color: rgb(255 255 255/var(--tw-text-opacity))!important
}
.text-333 {
--tw-text-opacity: 1;
color: rgb(51 51 51/var(--tw-text-opacity))
}
.text-\[\#005CA8\] {
--tw-text-opacity: 1;
color: rgb(230 0 19/var(--tw-text-opacity))
}
.text-\[\#212224\] {
--tw-text-opacity: 1;
color: rgb(33 34 36/var(--tw-text-opacity))
}
.text-\[\#A0C6E6\] {
--tw-text-opacity: 1;
color: rgb(160 198 230/var(--tw-text-opacity))
}
.text-\[\#C6C6C6\] {
--tw-text-opacity: 1;
color: rgb(198 198 198/var(--tw-text-opacity))
}
.text-\[var\(--color\)\] {
color: var(--color)
}
.text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255/var(--tw-text-opacity))
}
.underline {
text-decoration-line: underline
}
.antialiased {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.\!opacity-100 {
opacity: 1!important
}
.opacity-0 {
opacity: 0
}
.opacity-20 {
opacity: .2
}
.opacity-60 {
opacity: .6
}
.mix-blend-multiply {
mix-blend-mode: multiply
}
.mix-blend-difference {
mix-blend-mode: difference
}
.shadow-\[0_\.1875rem_1\.875rem_rgba\(18\2c 30\2c 47\2c 0\.15\)\] {
--tw-shadow: 0 .1875rem 1.875rem rgba(18, 30, 47, .15);
--tw-shadow-colored: 0 .1875rem 1.875rem var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.shadow-\[0_5px_60px_rgba\(0\2c 0\2c 0\2c \.1\)\] {
--tw-shadow: 0 5px 60px rgba(0, 0, 0, .1);
--tw-shadow-colored: 0 5px 60px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.outline {
outline-style: solid
}
.transition-\[opacity\2c transform\] {
transition-duration: .15s;
transition-property: opacity, transform;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-\[opacity_transform\] {
transition-duration: .15s;
transition-property: opacity transform;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-colors {
transition-duration: .15s;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-opacity {
transition-duration: .15s;
transition-property: opacity;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.transition-transform {
transition-duration: .15s;
transition-property: transform;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.delay-100 {
transition-delay: .1s
}
.\!duration-1000 {
transition-duration: 1s!important
}
.duration-300 {
transition-duration: .3s
}
.duration-500 {
transition-duration: .5s
}
.\[--100vw\:100vw\] {
--100vw: 100vw
}
.\[--1column\:calc\(var\(--100vw\)\/30\)\] {
--1column: calc(var(--100vw)/30)
}
.\[--accent-color\:\#005CA8\] {
--accent-color: #005ca8
}
.\[--color\:\#005CA8\] {
--color: #005ca8
}
.\[--color\:\#212224\] {
--color: #212224
}
.\[--color\:\#C6C6C6\] {
--color: #c6c6c6
}
.\[--diagonal\:calc\(var\(--100vw\)\*\.155\)\] {
--diagonal: calc(var(--100vw)*0.155)
}
.\[--length\:45\] {
--length: 45
}
.\[--width\:75rem\] {
--width: 75rem
}
.\[-webkit-appearance\:none\] {
-webkit-appearance: none
}
.\[animation\:hover-underline-out-in_both_\.4s_ease_1\] {
animation: hover-underline-out-in .4s ease 1 both
}
.\[background\:_linear-gradient\(currentColor\2c currentColor\)_100\%_100\%\/100\%_1px_no-repeat\] {
background: linear-gradient(currentColor, currentColor) 100% 100%/100% 1px no-repeat
}
.\[clip-path\:polygon\(0_0\2c 100\%_0\2c 0_100\%\)\] {
-webkit-clip-path: polygon(0 0, 100% 0, 0 100%);
clip-path: polygon(0 0, 100% 0, 0 100%)
}
.\[clip-path\:polygon\(0_100\%\2c 100\%_0\2c 100\%_100\%\)\] {
-webkit-clip-path: polygon(0 100%, 100% 0, 100% 100%);
clip-path: polygon(0 100%, 100% 0, 100% 100%)
}
.\[clip-path\:polygon\(0_var\(--diagonal\)\2c 100\%_0\2c 100\%_calc\(100\%-var\(--diagonal\)\)\2c 0_100\%\)\] {
-webkit-clip-path: polygon(0 var(--diagonal), 100% 0, 100% calc(100% - var(--diagonal)), 0 100%);
clip-path: polygon(0 var(--diagonal), 100% 0, 100% calc(100% - var(--diagonal)), 0 100%)
}
.\[font-feature-settings\:\'palt\'\]{font-feature-settings:"palt"}.\[grid-area\:1\/2\/2\/3\]{grid-area:1/2/2/3}.\[grid-column\:1\/3\]{grid-column:1/3}.\[stroke-dasharray\:var\(--length\)\]{stroke-dasharray:var(--length)}.\[stroke-dashoffset\:calc\(var\(--length\)\*\(1-var\(--progress\)\)\)\]{stroke-dashoffset:calc(var(--length)*(1 - var(--progress)))}.\[writing-mode\:vertical-rl\]{writing-mode:vertical-rl}.marker\:w-\[1em\] ::marker{width:1em}.marker\:text-999 ::marker{color:#999}.marker\:w-\[1em\]::marker{width:1em}.marker\:text-999::marker{color:#999}.before\:absolute:before{content:var(--tw-content);position:absolute}.before\:-top-px:before{content:var(--tw-content);top:-1px}.before\:left-0:before{content:var(--tw-content);left:0}.before\:top-0:before{content:var(--tw-content);top:0}.before\:mr-1:before{content:var(--tw-content);margin-right:.25rem}.before\:inline-block:before{content:var(--tw-content);display:inline-block}.before\:h-\[2px\]:before{content:var(--tw-content);height:2px}.before\:h-px:before{content:var(--tw-content);height:1px}.before\:w-1:before{content:var(--tw-content);width:.25rem}.before\:w-6:before{content:var(--tw-content);width:1.5rem}.before\:bg-\[\#005CA8\]:before{--tw-bg-opacity:1;background-color:rgb(0 92 168/var(--tw-bg-opacity));content:var(--tw-content)}.before\:bg-current:before{background-color:currentColor;content:var(--tw-content)}.before\:align-middle:before{content:var(--tw-content);vertical-align:middle}.first\:\!mt-0:first-child{margin-top:0!important}.first\:mt-0:first-child{margin-top:0}.first\:border-t:first-child{border-top-width:1px}.last\:border-b:last-child{border-bottom-width:1px}.hover\:opacity-100:hover{opacity:1}.group\/main#index .group-\[\#index\]\/main\:\!block,.group\/main#product .group-\[\#product\]\/main\:\!block{display:block!important}.group\/slide.swiper-slide-active .group-\[\&\.swiper-slide-active\]\/slide\:animate-\[zoom-out_var\(--time\)_linear_normal_both\]{animation:zoom-out var(--time) linear normal both}@keyframes zoom-out{0%{transform:scale(1.15)}to{transform:scale(1)}}.group\/slide.swiper-slide-prev .group-\[\&\.swiper-slide-prev\]\/slide\:animate-\[zoom-out_var\(--time\)_linear_normal_both\]{animation:zoom-out var(--time) linear normal both}.group\/item.swiper-pagination-bullet-active .group-\[\.swiper-pagination-bullet-active\]\/item\:opacity-100{opacity:1}.data-\[inview\=true\]\:bg-\[\#272A31\][data-inview=true]{--tw-bg-opacity:1;background-color:rgb(39 42 49/var(--tw-bg-opacity))}.data-\[inview\=true\]\:\[--accent-color\:white\][data-inview=true]{--accent-color:#fff}.data-\[inview\=true\]\:\[--color\:white\][data-inview=true]{--color:#fff}.group\/body[data-scrollover-pointer-none=true] .group-data-\[scrollover-pointer-none\=true\]\/body\:\!pointer-events-none{pointer-events:none!important}.group\/body[data-scrollover-pointer-none=true] .group-data-\[scrollover-pointer-none\=true\]\/body\:pointer-events-none{pointer-events:none}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:pointer-events-auto{pointer-events:auto}.group\/body[data-scrollover-navigation-stop=true] .group-data-\[scrollover-navigation-stop\=true\]\/body\:absolute{position:absolute}.group\/body[data-scrollover-navigation-stop=true] .group-data-\[scrollover-navigation-stop\=true\]\/body\:top-\[calc\(var\(--scrollover-navigation-stop\)\+8rem\)\]{top:calc(var(--scrollover-navigation-stop) + 8rem)}.group\/body[data-switch-megamenu-sitemap-toggle=true] .group-data-\[switch-megamenu-sitemap-toggle\=true\]\/body\:grid{display:grid}.group\/inview[data-inview1=true] .group-data-\[inview1\=true\]\/inview\:translate-y-0{--tw-translate-y:0px}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:translate-x-0,.group\/inview[data-inview1=true] .group-data-\[inview1\=true\]\/inview\:translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:translate-x-0{--tw-translate-x:0px}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:translate-y-\[calc\(-\.25rem-2px\)\]{--tw-translate-y:calc(-0.25rem - 4.75px);transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:translate-y-\[calc\(\.25rem\+2px\)\]{--tw-translate-y:calc(0.25rem + 4.75px);transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu-sitemap-toggle=true] .group-data-\[switch-megamenu-sitemap-toggle\=true\]\/body\:rotate-0{--tw-rotate:0deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:-rotate-45{--tw-rotate:-48deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:rotate-0{--tw-rotate:0deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group\/section[data-inview=true] .group-data-\[inview\=true\]\/section\:fill-\[\#005CA8\]{fill:#005ca8}.group\/inview[data-inview1=true] .group-data-\[inview1\=true\]\/inview\:opacity-100{opacity:1}.group\/body[data-scrollover-hero-hide=true] .group-data-\[scrollover-hero-hide\=true\]\/body\:\!opacity-0{opacity:0!important}.group\/body[data-switch-megamenu=false] .group-data-\[switch-megamenu\=false\]\/body\:opacity-0,.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:opacity-0{opacity:0}.group\/body[data-switch-megamenu=true] .group-data-\[switch-megamenu\=true\]\/body\:opacity-100,.group\/body[data-switch-product-item=a1] .group-data-\[switch-product-item\=a1\]\/body\:opacity-100,.group\/body[data-switch-product-item=a2] .group-data-\[switch-product-item\=a2\]\/body\:opacity-100,.group\/body[data-switch-product-item=a3] .group-data-\[switch-product-item\=a3\]\/body\:opacity-100,.group\/body[data-switch-product-item=a4] .group-data-\[switch-product-item\=a4\]\/body\:opacity-100,.group\/body[data-switch-product-item=a5] .group-data-\[switch-product-item\=a5\]\/body\:opacity-100,.group\/body[data-window-load=true] .group-data-\[window-load\=true\]\/body\:opacity-100{opacity:1}@media not all and (min-width:516px){.max-md\:mx-auto{margin-left:auto;margin-right:auto}.max-md\:my-6{margin-bottom:1.5rem;margin-top:1.5rem}.max-md\:-mt-px{margin-top:-1px}.max-md\:mb-28{margin-bottom:7rem}.max-md\:mb-3{margin-bottom:.75rem}.max-md\:ml-\[calc\(var\(--1column\)\*-2\)\]{margin-left:calc(var(--1column)*-2)}.max-md\:ml-auto{margin-left:auto}.max-md\:mt-1{margin-top:.25rem}.max-md\:mt-10{margin-top:2.5rem}.max-md\:mt-12{margin-top:3rem}.max-md\:mt-2{margin-top:.5rem}.max-md\:mt-4{margin-top:1rem}.max-md\:mt-6{margin-top:1.5rem}.max-md\:mt-8{margin-top:2rem}.max-md\:mt-9{margin-top:2.25rem}.max-md\:grid{display:grid}.max-md\:hidden{display:none}.max-md\:w-28{width:7rem}.max-md\:w-\[calc\(100\%\+\(var\(--1column\)\*4\)\)\],.max-md\:w-\[calc\(100\%\+var\(--1column\)\*4\)\]{width:calc(100% + var(--1column)*4)}.max-md\:w-\[calc\(var\(--1column\)\*23\)\]{width:calc(var(--1column)*23)}.max-md\:w-fit{width:-moz-fit-content;width:fit-content}.max-md\:-translate-y-1{--tw-translate-y:-0.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.max-md\:grid-cols-\[4\.5rem_1fr\]{grid-template-columns:4.5rem 1fr}.max-md\:flex-col{flex-direction:column}.max-md\:gap-12{gap:3rem}.max-md\:gap-2{gap:.5rem}.max-md\:self-end{align-self:flex-end}.max-md\:justify-self-end{justify-self:end}.max-md\:overflow-x-auto{overflow-x:auto}.max-md\:rounded-full{border-radius:9999px}.max-md\:border{border-width:1px}.max-md\:border-y{border-top-width:1px}.max-md\:border-b,.max-md\:border-y{border-bottom-width:1px}.max-md\:border-t{border-top-width:1px}.max-md\:border-\[\#E6E6E6\]{--tw-border-opacity:1;border-color:rgb(230 230 230/var(--tw-border-opacity))}.max-md\:px-3{padding-left:.75rem;padding-right:.75rem}.max-md\:px-\[calc\(var\(--1column\)\*2\)\]{padding-left:calc(var(--1column)*2);padding-right:calc(var(--1column)*2)}.max-md\:py-1{padding-bottom:.25rem;padding-top:.25rem}.max-md\:py-4{padding: 2rem 0;}.max-md\:py-6{padding-bottom:1.5rem;padding-top:1.5rem}.max-md\:pb-3{padding-bottom:.75rem}.max-md\:pb-6{padding-bottom:1.5rem}.max-md\:pt-9{padding-top:2.25rem}.max-md\:font-bold{font-weight:700}.max-md\:underline{text-decoration-line:underline}.max-md\:\[writing-mode\:vertical-rl\]{writing-mode:vertical-rl}.max-md\:first\:mt-0:first-child{margin-top:0}.max-md\:first\:border-t-0:first-child{border-top-width:0}.max-md\:first\:pt-0:first-child{padding-top:0}.max-md\:last\:pb-0:last-child{padding-bottom:0}.group\/body[data-switch-megamenu-sitemap-toggle=true] .max-md\:group-data-\[switch-megamenu-sitemap-toggle\=true\]\/body\:grid{display:grid}}@media (min-width:640px){.sm\:grid{display:grid}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:border-l{border-left-width:1px}.sm\:p-8{padding:2rem}}@media (min-width:516px){.md\:absolute{position:absolute}.md\:sticky{position:sticky}.md\:\!bottom-1\/2{bottom:50%!important}.md\:\!left-auto{left:auto!important}.md\:\!right-\[calc\(var\(--1column\)\*1\.5\)\]{right:calc(var(--1column)*1.5)!important}.md\:bottom-1\/2{bottom:50%}.md\:bottom-\[calc\(var\(--1column\)\*1\)\]{bottom:calc(var(--1column)*1)}.md\:bottom-\[var\(--1column\)\]{bottom:var(--1column)}.md\:left-0{left:0}.md\:left-12{left:3rem}.md\:left-\[7\.3rem\]{left:7.3rem}.md\:left-\[calc\(100\%\+2\.5rem\)\]{left:calc(100% + 2.5rem)}.md\:left-\[calc\(var\(--1column\)\*1\)\]{left:calc(var(--1column)*1)}.md\:right-0{right:0}.md\:right-\[1\.125rem\]{right:1.125rem}.md\:right-\[3\.75rem\]{right:3.75rem}.md\:right-\[var\(--1column\)\]{right:var(--1column)}.md\:top-0{top:0}.md\:top-28{top:7rem}.md\:top-48{top:12rem}.md\:top-9{        top: 10.25rem;
right: 2.5rem;
left: unset;
}
.md\:top-\[24\%\] {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.md\:top-\[3\.6rem\] {
top: 15.5rem;
left: unset;
right: 2.3rem;
color: white;
}
.md\:top-\[3\.75rem\] {
top: 3.75rem
}
.md\:top-\[63\.6\%\] {
top: 63.6%
}
.md\:order-1 {
order: 1
}
.md\:order-2 {
order: 2
}
.md\:my-9 {
margin-bottom: 2.25rem;
margin-top: 2.25rem
}
.md\:\!mt-6 {
margin-top: 1.5rem!important
}
.md\:-mt-2 {
margin-top: -.5rem
}
.md\:-mt-8 {
margin-top: -2rem
}
.md\:mb-28 {
margin-bottom: 7rem
}
.md\:mb-6 {
margin-bottom: 1.5rem
}
.md\:mb-7 {
margin-bottom: 1.75rem
}
.md\:ml-3 {
margin-left: .75rem
}
.md\:ml-5 {
margin-left: 1.25rem
}
.md\:ml-\[calc\(var\(--1column\)\*-1\)\] {
margin-left: calc(var(--1column)*-1)
}
.md\:ml-\[calc\(var\(--1column\)\*-4\)\] {
margin-left: calc(var(--1column)*-4)
}
.md\:ml-\[calc\(var\(--1column\)\*12\)\] {
margin-left: calc(var(--1column)*12)
}
.md\:ml-\[calc\(var\(--1column\)\*2\)\] {
margin-left: calc(var(--1column)*2)
}
.md\:ml-\[calc\(var\(--1column\)\*4\)\] {
margin-left: calc(var(--1column)*4)
}
.md\:mr-6 {
margin-right: 1.5rem
}
.md\:mt-10 {
margin-top: 2.5rem
}
.md\:mt-11 {
margin-top: 2.75rem
}
.md\:mt-12 {
margin-top: 3rem
}
.md\:mt-14 {
margin-top: 3.5rem
}
.md\:mt-16 {
margin-top: 4rem
}
.md\:mt-2 {
margin-top: .5rem
}
.md\:mt-20 {
margin-top: 5rem
}
.md\:mt-24 {
margin-top: 6rem
}
.md\:mt-28 {
margin-top: 7rem
}
.md\:mt-3 {
margin-top: .75rem
}
.md\:mt-4 {
margin-top: 1rem
}
.md\:mt-40 {
margin-top: 10rem
}
.md\:mt-6 {
margin-top: 2.5rem
}
.md\:mt-8 {
margin-top: 2rem
}
.md\:mt-9 {
margin-top: 2.25rem
}
.md\:inline-block {
display: inline-block
}
.md\:flex {
display: flex
}
.md\:grid {
display: grid
}
.md\:hidden {
display: none
}
.md\:h-\[3\.75rem\] {
height: 4.75rem
}
.md\:h-\[4\.5rem\] {
height: 4.5rem
}
.md\:h-\[calc\(100\%-7\.5rem\)\] {
height: calc(100% - 7.5rem)
}
.md\:h-full {
height: 100%
}
.md\:min-h-\[42rem\] {
min-height: 42rem
}
.md\:w-10 {
width: 2.5rem
}
.md\:w-3 {
width: .75rem
}
.md\:w-32 {
width: 8rem
}
.md\:w-4 {
width: 1rem
}
.md\:w-5 {
width: 2rem;
}
.md\:w-52 {
width: 13rem
}
.md\:w-6 {
width: 1.5rem
}
.md\:w-60 {
width: 15rem
}
.md\:w-80 {
width: 20rem
}
.md\:w-9 {
width: 2.25rem
}
.md\:w-\[10\.5rem\] {
width: 10.5rem
}
.md\:w-\[14\.5rem\] {
width: 14.5rem
}
.md\:w-\[16\.875rem\] {
width: 16.875rem
}
.md\:w-\[22\.5rem\] {
width: 22.5rem
}
.md\:w-\[24\.25rem\] {
width: 24.25rem
}
.md\:w-\[27\.5rem\] {
width: 27.5rem
}
.md\:w-\[3\.75rem\] {
width: 4.75rem
}
.md\:w-\[32\.25rem\] {
width: 32.25rem
}
.md\:w-\[34\.25rem\] {
width: 34.25rem
}
.md\:w-\[37\.7\%\] {
width: 63.7%;
max-width: 850px;
}
.md\:w-\[calc\(100\%\+\(var\(--1column\)\*2\)\)\] {
width: calc(100% + var(--1column)*2)
}
.md\:w-\[calc\(var\(--1column\)\*10\)\] {
width: calc(var(--1column)*10)
}
.md\:w-\[calc\(var\(--1column\)\*12\)\] {
width: calc(var(--1column)*12)
}
.md\:w-\[calc\(var\(--1column\)\*13\)\] {
width: calc(var(--1column)*13)
}
.md\:w-\[calc\(var\(--1column\)\*14\)\] {
width: calc(var(--1column)*14)
}
.md\:w-\[calc\(var\(--1column\)\*18\)\] {
width: calc(var(--1column)*18)
}
.md\:w-\[calc\(var\(--1column\)\*4\)\] {
width: calc(var(--1column)*4)
}
.md\:w-\[calc\(var\(--1column\)\*5\)\] {
width: calc(var(--1column)*5)
}
.md\:w-\[calc\(var\(--1column\)\*6\)\] {
width: calc(var(--1column)*6)
}
.md\:w-\[calc\(var\(--1column\)\*7\)\] {
width: calc(var(--1column)*7)
}
.md\:w-\[calc\(var\(--1column\)\*8\)\] {
width: calc(var(--1column)*8)
}
.md\:w-\[var\(--1column\)\] {
width: var(--1column)
}
.md\:w-full {
width: 100%
}
.md\:min-w-\[40rem\] {
min-width: 40rem
}
.md\:-translate-x-1\/2 {
--tw-translate-x: -50%
}
.md\:-translate-x-1\/2,
.md\:-translate-y-1\/2 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.md\:-translate-y-1\/2 {
--tw-translate-y: -50%
}
.md\:-translate-y-4 {
--tw-translate-y: -1rem;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.md\:animate-\[hover-underline-in_both_\.2s_ease_1\] {
animation: hover-underline-in .2s ease 1 both
}
.md\:animate-\[hover-underline-out_both_\.2s_ease_1\] {
animation: hover-underline-out .2s ease 1 both
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr))
}
.md\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr))
}
.md\:grid-cols-\[calc\(var\(--1column\)\*1\)_1fr\] {
grid-template-columns: calc(var(--1column)*1) 1fr
}
.md\:grid-cols-\[calc\(var\(--1column\)\*12\)_calc\(var\(--1column\)\*14\)_1fr\] {
grid-template-columns: calc(var(--1column)*12) calc(var(--1column)*14) 1fr
}
.md\:grid-cols-\[calc\(var\(--1column\)\*18\)_calc\(var\(--1column\)\*2\)\] {
grid-template-columns: calc(var(--1column)*18) calc(var(--1column)*2)
}
.md\:grid-cols-\[calc\(var\(--1column\)\*2\)_1fr\] {
grid-template-columns: calc(var(--1column)*2) 1fr
}
.md\:flex-row-reverse {
flex-direction: row-reverse
}
.md\:flex-col {
flex-direction: column
}
.md\:flex-wrap {
flex-wrap: wrap
}
.md\:items-start {
align-items: flex-start
}
.md\:items-end {
align-items: flex-end
}
.md\:items-center {
align-items: center
}
.md\:justify-end {
justify-content: flex-end
}
.md\:justify-between {
justify-content: space-between
}
.md\:\!gap-4 {
gap: 1rem!important
}
.md\:gap-12 {
gap: 3rem
}
.md\:gap-16 {
gap: 4rem
}
.md\:gap-3 {
gap: 1.75rem;
}
.md\:gap-4 {
gap: 1rem
}
.md\:gap-5 {
gap: 1.25rem
}
.md\:gap-6 {
gap: 3.5rem
}
.md\:gap-9 {
gap: 2.25rem
}
.md\:gap-\[calc\(var\(--1column\)\*1\)\] {
gap: calc(var(--1column)*1)
}
.md\:gap-\[calc\(var\(--1column\)\*2\)\] {
gap: calc(var(--1column)*2)
}
.md\:gap-x-\[5\.5\%\] {
-moz-column-gap: 5.5%;
column-gap: 5.5%
}
.md\:gap-y-12 {
row-gap: 3rem
}
.md\:gap-y-20 {
row-gap: 5rem
}
.md\:self-end {
align-self: flex-end
}
.md\:self-center {
align-self: center
}
.md\:border-l {
border-left-width: 1px
}
.md\:border-t {
border-top-width: 1px
}
.md\:p-12 {
padding: 3rem
}
.md\:p-14 {
padding: 3.5rem
}
.md\:p-4 {
padding: 1rem
}
.md\:p-9 {
padding: 2.25rem
}
.md\:p-\[\.875rem\] {
padding: .875rem
}
.md\:p-\[3\.75rem\] {
padding: 3.75rem
}
.md\:p-\[var\(--1column\)\] {
padding: var(--1column)
}
.md\:px-6 {
padding-left: 1.5rem;
padding-right: 1.5rem
}
.md\:px-\[calc\(var\(--1column\)\*1\)\] {
padding-left: calc(var(--1column)*1);
padding-right: calc(var(--1column)*1)
}
.md\:px-\[calc\(var\(--1column\)\*6\)\] {
padding-left: calc(var(--1column)*6);
padding-right: calc(var(--1column)*6)
}
.md\:px-\[calc\(var\(--1column\)\*8\)\] {
padding-left: calc(var(--1column)*8);
padding-right: calc(var(--1column)*8)
}
.md\:py-12 {
padding-bottom: 3rem;
padding-top: 3rem
}
.md\:py-14 {
padding-bottom: 3.5rem;
padding-top: 3.5rem
}
.md\:py-20 {
padding-bottom: 5rem;
padding-top: 5rem
}
.md\:py-4 {
padding-bottom: 1rem;
padding-top: 1rem
}
.md\:py-44 {
padding-bottom: 11rem;
padding-top: 11rem
}
.md\:py-9 {
padding-bottom: 2.25rem;
padding-top: 2.25rem
}
.md\:py-\[1\.4375rem\] {
padding-bottom: 1.4375rem;
padding-top: 1.4375rem
}
.md\:\!pr-0 {
padding-right: 0!important
}
.md\:pb-12 {
padding-bottom: 3rem
}
.md\:pb-20 {
padding-bottom: 5rem
}
.md\:pb-28 {
padding-bottom: 7rem
}
.md\:pb-40 {
padding-bottom: 10rem
}
.md\:pb-44 {
padding-bottom: 11rem
}
.md\:pb-52 {
padding-bottom: 13rem
}
.md\:pb-6 {
padding-bottom: 1.5rem
}
.md\:pb-60 {
padding-bottom: 15rem
}
.md\:pb-80 {
padding-bottom: 20rem
}
.md\:pl-7 {
padding-left: 1.75rem
}
.md\:pl-9 {
padding-left: 2.25rem
}
.md\:pl-\[calc\(var\(--1column\)\*6\)\] {
padding-left: calc(var(--1column)*6)
}
.md\:pl-\[var\(--1column\)\] {
padding-left: var(--1column)
}
.md\:pr-20 {
padding-right: 5rem
}
.md\:pr-\[calc\(var\(--1column\)\*1\)\] {
padding-right: calc(var(--1column)*1)
}
.md\:pr-\[calc\(var\(--1column\)\*10\)\] {
padding-right: calc(var(--1column)*10)
}
.md\:pr-\[calc\(var\(--1column\)\*7\)\] {
padding-right: calc(var(--1column)*7)
}
.md\:pt-12 {
padding-top: 3rem
}
.md\:pt-14 {
padding-top: 3.5rem
}
.md\:pt-20 {
padding-top: 5rem
}
.md\:pt-28 {
padding-top: 7rem
}
.md\:pt-44 {
padding-top: 11rem
}
.md\:pt-5 {
padding-top: 1.25rem
}
.md\:pt-60 {
padding-top: 15rem
}
.md\:pt-8 {
padding-top: 2rem
}
.md\:text-left {
text-align: left
}
.md\:text-2xl {
font-size: 1.5rem
}
.md\:text-5xl {
font-size: 3rem
}
.md\:text-\[2\.5rem\] {
font-size: 2.5rem
}
.md\:text-\[2rem\] {
font-size: 2rem
}
.md\:text-\[3\.5rem\] {
font-size: 3.5rem
}
.md\:text-\[calc\(var\(--100vw\)\*\.2\)\] {
font-size: calc(var(--100vw)*.2)
}
.md\:text-base {
font-size: 1rem
}
.md\:text-lg {
font-size: 1.3rem !important;
letter-spacing: 2px;
}
.md\:text-sm {
font-size: 1.7rem
}
.md\:text-xl {
font-size: 2.5rem
}
.md\:text-xs {
font-size: .75rem
}
.md\:leading-\[1\.75\] {
line-height: 1.75
}
.md\:leading-\[2\.25\] {
line-height: 2.25
}
.md\:leading-normal {
line-height: 1.5
}
.md\:opacity-50 {
opacity: .5
}
.md\:shadow-\[0_\.3125rem_2\.5rem_rgba\(18\2c 30\2c 47\2c 0\.15\)\] {
--tw-shadow: 0 .3125rem 2.5rem rgba(18, 30, 47, .15);
--tw-shadow-colored: 0 .3125rem 2.5rem var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.md\:transition-colors {
transition-duration: .15s;
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.md\:transition-opacity {
transition-duration: .15s;
transition-property: opacity;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.md\:transition-transform {
transition-duration: .15s;
transition-property: transform;
transition-timing-function: cubic-bezier(.4, 0, .2, 1)
}
.md\:duration-1000 {
transition-duration: 1s
}
.md\:duration-300 {
transition-duration: .3s
}
.md\:duration-500 {
transition-duration: .5s
}
.md\:\[--width\:150rem\] {
--width: 150rem
}
.md\:\[background\:_linear-gradient\(currentColor\2c currentColor\)_100\%_100\%\/100\%_1px_no-repeat\] {
background: linear-gradient(currentColor, currentColor) 100% 100%/100% 1px no-repeat
}
.md\:\[grid-area\:1\/1\/2\/2\] {
grid-area: 1/1/2/2
}
.md\:\[grid-area\:1\/3\/2\/4\] {
grid-area: 1/3/2/4
}
.md\:\[grid-area\:2\/2\/3\/4\] {
grid-area: 2/2/3/4
}
.md\:\[grid-area\:3\/2\/4\/3\] {
grid-area: 3/2/4/3
}
.md\:\[grid-area\:3\/3\/4\/4\] {
grid-area: 3/3/4/4
}
.md\:\[grid-area\:4\/1\/5\/2\] {
grid-area: 4/1/5/2
}
.md\:\[grid-area\:5\/1\/6\/2\] {
grid-area: 5/1/6/2
}
.md\:\[grid-area\:5\/2\/6\/4\] {
grid-area: 5/2/6/4
}
.md\:first\:border-l-0:first-child {
border-left-width: 0
}
@keyframes hover-underline {
0% {
background-position: 100% 100%;
background-size: 100% 1px
}
50% {
background-position: 100% 100%;
background-size: 0 1px
}
51% {
background-position: 0 100%;
background-size: 0 1px
}
to {
background-position: 0 100%;
background-size: 100% 1px
}
}
.md\:hover\:animate-\[hover-underline_both_\.4s_ease_1\]:hover {
animation: hover-underline .4s ease 1 both
}
.md\:hover\:border-transparent:hover {
border-color: transparent
}
.md\:hover\:\!bg-white:hover {
--tw-bg-opacity: 1!important;
background-color: rgb(255 255 255/var(--tw-bg-opacity))!important
}
.md\:hover\:bg-\[\#005CA8\]:hover {
--tw-bg-opacity: 1;
background-color: rgb(0 92 168/var(--tw-bg-opacity))
}
.md\:hover\:\!text-\[\#005CA8\]:hover {
--tw-text-opacity: 1!important;
color: rgb(0 92 168/var(--tw-text-opacity))!important
}
.md\:hover\:text-\[\#005CA8\]:hover {
--tw-text-opacity: 1;
color: rgb(0 92 168/var(--tw-text-opacity))
}
.md\:hover\:text-white:hover {
--tw-text-opacity: 1;
color: rgb(255 255 255/var(--tw-text-opacity))
}
.md\:hover\:opacity-50:hover {
opacity: .5
}
.group\/hover:hover .md\:group-hover\/hover\:translate-x-4 {
--tw-translate-x: 1rem
}
.group\/hover:hover .md\:group-hover\/hover\:scale-100,
.group\/hover:hover .md\:group-hover\/hover\:translate-x-4 {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.group\/hover:hover .md\:group-hover\/hover\:scale-100 {
--tw-scale-x: 1;
--tw-scale-y: 1
}
.group\/hover:hover .md\:group-hover\/hover\:scale-105 {
--tw-scale-x: 1.05;
--tw-scale-y: 1.05;
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
@keyframes -x {
0% {
transform: translateX(-100%)
}
to {
transform: translateX(0)
}
}
.group\/hover:hover .md\:group-hover\/hover\:animate-\[-x_both_\.5s_ease_1\] {
animation: -x .5s ease 1 both
}
.group\/hover:hover .md\:group-hover\/hover\:animate-\[hover-arrow_both_\.3s_ease_1\] {
animation: hover-arrow .3s ease 1 both
}
@keyframes hover-arrow {
0% {
opacity: 1;
transform: translateY(0)
}
50% {
opacity: 0;
transform: translateY(-300%)
}
51% {
opacity: 0;
transform: translateY(300%)
}
to {
opacity: 1;
transform: translateY(0)
}
}
.group\/hover:hover .md\:group-hover\/hover\:animate-\[hover-arrow_both_\.5s_ease_1\] {
animation: hover-arrow .5s ease 1 both
}
@keyframes hover-underline-in {
0% {
background-position: 0 100%;
background-size: 0 1px
}
to {
background-position: 0 100%;
background-size: 100% 1px
}
}
.group\/hover:hover .md\:group-hover\/hover\:animate-\[hover-underline-in_both_\.2s_ease_1\] {
animation: hover-underline-in .2s ease 1 both
}
@keyframes hover-underline-out {
0% {
background-position: 100% 100%;
background-size: 100% 1px
}
to {
background-position: 100% 100%;
background-size: 0 1px
}
}
.group\/hover:hover .md\:group-hover\/hover\:animate-\[hover-underline-out_both_\.2s_ease_1\] {
animation: hover-underline-out .2s ease 1 both
}
.group\/hover:hover .md\:group-hover\/hover\:\!bg-\[\#00A0CA\] {
--tw-bg-opacity: 1!important;
background-color: rgb(0 160 202/var(--tw-bg-opacity))!important
}
.group\/hover:hover .md\:group-hover\/hover\:bg-\[\#005CA8\],
.group\/hover:hover .md\:group-hover\/hover\:bg-\[\#005ca8\] {
--tw-bg-opacity: 1;
background-color: rgb(0 92 168/var(--tw-bg-opacity))
}
.group\/hover:hover .md\:group-hover\/hover\:bg-\[\#00A0CA\] {
--tw-bg-opacity: 1;
background-color: rgb(0 160 202/var(--tw-bg-opacity))
}
.group\/hover:hover .md\:group-hover\/hover\:fill-white {
fill: #fff
}
.group\/hover:hover .md\:group-hover\/hover\:text-white {
--tw-text-opacity: 1;
color: rgb(255 255 255/var(--tw-text-opacity))
}
.group\/hover:hover .md\:group-hover\/hover\:opacity-100 {
opacity: 1
}
.group\/item:nth-child(3n+1) .md\:group-\[\&\:nth-child\(3n\+1\)\]\/item\:border-l-0 {
border-left-width: 0
}
.group\/item:nth-child(3n+2) .md\:group-\[\&\:nth-child\(3n\+2\)\]\/item\:px-\[15\%\] {
padding-left: 15%;
padding-right: 15%
}
.group\/item:nth-child(3n+1) .md\:group-\[\&\:nth-child\(3n\+1\)\]\/item\:pr-\[17\.6\%\] {
padding-right: 17.6%
}
.group\/item:nth-child(3n+3) .md\:group-\[\&\:nth-child\(3n\+3\)\]\/item\:pl-\[17\.6\%\] {
padding-left: 17.6%
}
@media not all and (min-width:1600px) {
.md\:max-xl\:text-\[calc\(var\(--100vw\)\*16\/1600\)\] {
font-size: calc(var(--100vw)*16/1600)
}
}
}
@media only screen and (max-width: 1024px) {
.md\:w-\[37\.7\%\] {
width: 90%;
}
}
@media only screen and (max-width: 767px) {
.md\:top-9 {
top: 10.25rem;
right: 2.5rem;
left: unset;
}
}
@media (min-width:1600px) {
.xl\:w-12 {
width: 3rem
}
}
.\[\&\+\*\]\:relative+* {
position:relative
}
.\[\&\+\*\]\:z-10+* {
z-index:10
}
.\[\&\.prev\]\:opacity-100.prev {
opacity:1
}
.\[\&\.swiper-button-disabled\]\:fill-\[\#E6E6E6\].swiper-button-disabled {
fill:#e6e6e6
}
.\[\&\.swiper-slide-active\]\:opacity-100.swiper-slide-active {
opacity:1
}
@media (min-width:640px) {
.sm\:\[\&\:nth-child\(-n\+3\)\]\:border-t:nth-child(-n+3) {
border-top-width: 1px
}
}
@media (min-width:767px) {
.md\:\[\&\:nth-child\(-n\+3\)\]\:pt-0:nth-child(-n+3) {
padding-top: 0
}
}
@media (min-width:640px) {
.sm\:\[\&\:nth-child\(2n\+1\)\]\:border-l-0:nth-child(odd) {
border-left-width: 0
}
}
@media (min-width:767px) {
.md\:\[\&\:nth-child\(3n\+1\)\]\:w-\[31\.5\%\]:nth-child(3n+1) {
width: 31.5%
}
.md\:\[\&\:nth-child\(3n\+1\)\]\:border-l-0:nth-child(3n+1) {
border-left-width: 0
}
.md\:\[\&\:nth-child\(3n\+2\)\]\:w-\[37\%\]:nth-child(3n+2) {
width: 37%
}
.md\:\[\&\:nth-child\(3n\+3\)\]\:w-\[31\.5\%\]:nth-child(3n+3) {
width: 31.5%
}
.md\:\[\&\:nth-child\(n\+4\)\]\:border-t:nth-child(n+4) {
border-top-width: 1px
}
.md\:\[\&\:nth-last-child\(-n\+3\)\]\:pb-0:nth-last-child(-n+3) {
padding-bottom: 0
}
}
.\[\&\>\*\]\:\!m-0>* {
margin:0!important
}
.\[\&\>\*\]\:\!h-\[\.25rem\]>* {
height:.25rem!important
}
.\[\&\>\*\]\:\!w-\[\.25rem\]>* {
width:.25rem!important
}
.\[\&\>\*\]\:\!bg-white>* {
--tw-bg-opacity:1!important;
background-color:rgb(255 255 255/var(--tw-bg-opacity))!important
}
.\[\&\>\*\]\:bg-\[\#E6E6E6\]>* {
--tw-bg-opacity:1;
background-color:rgb(230 230 230/var(--tw-bg-opacity))
}
.\[\&\>\*\]\:\!opacity-100>* {
opacity:1!important
}
@media (min-width:767px) {
.md\:\[\&\>\*\]\:\!h-\[\.375rem\]>* {
height: .375rem!important
}
.md\:\[\&\>\*\]\:\!w-\[\.375rem\]>* {
width: .375rem!important
}
}
.\[\&\>\.swiper-pagination-bullet-active\]\:\!bg-\[\#005CA8\]>.swiper-pagination-bullet-active {
--tw-bg-opacity:1!important;
background-color:rgb(0 92 168/var(--tw-bg-opacity))!important
}
@media (min-width:767px) {
.md\:\[\&\>br\]\:hidden>br {
display: none
}
}
.\[\&\>p\:nth-child\(n\+2\)\]\:mt-4>p:nth-child(n+2) {
margin-top:1rem
}
.\[\&\>p\:nth-child\(n\+2\)\]\:mt-6>p:nth-child(n+2) {
margin-top:1.5rem
}
.\[\&\>ul\>li\:\:marker\]\:text-999>ul>li::marker {
--tw-text-opacity:1;
color:rgb(153 153 153/var(--tw-text-opacity))
}
.\[\&\>ul\]\:grid>ul {
display:grid
}
.\[\&\>ul\]\:list-decimal>ul {
list-style-type:decimal
}
.\[\&\>ul\]\:list-disc>ul {
list-style-type:disc
}
.\[\&\>ul\]\:gap-3>ul {
gap:.75rem
}
.\[\&\>ul\]\:pl-\[1em\]>ul {
padding-left:1em
}
.\[\&\>ul\]\:text-sm>ul {
font-size:.875rem
}
.\[\&\>ul\]\:leading-\[1\.75\]>ul {
line-height:1.75
}
.\[\&\>ul\]\:tracking-\[\.02em\]>ul {
letter-spacing:.02em
}
.\[\&\>ul\]\:marker\:w-\[1em\] *>ul::marker {
width:1em
}
.\[\&\>ul\]\:marker\:w-\[1em\]>ul::marker {
width:1em
}
@media (min-width:767px) {
.md\:\[\&\>ul\]\:gap-4>ul {
gap: 1rem
}
.md\:\[\&\>ul\]\:text-xl>ul {
font-size: 1.25rem
}
.md\:\[\&\>ul\]\:leading-normal>ul {
line-height: 1.5
}
}
.\[\&\>ul_ul\]\:mt-3>ul ul {
margin-top:.75rem
}
@media (min-width:767px) {
.md\:\[\&\>ul_ul\]\:mt-4>ul ul {
margin-top: 1rem
}
}
.\[\&_\*\]\:block * {
display:block
}
.\[\&_\*\]\:\!h-full * {
height:100%!important
}
.\[\&_\*\]\:\!w-full * {
width:100%!important
}
.\[\&_\.current-item\]\:text-\[\#212224\] .current-item {
--tw-text-opacity:1;
color:rgb(33 34 36/var(--tw-text-opacity))
}
.\[\&_\.main\]\:mt-3 .main {
margin-top:.75rem
}
.\[\&_\.main\]\:block .main {
display:block
}
.\[\&_\.main\]\:font-figtree .main {
font-family:Figtree,
sans-serif
}
.\[\&_\.main\]\:text-\[2\.5rem\] .main {
font-size:2.5rem
}
.\[\&_\.main\]\:text-\[2rem\] .main {
font-size:2rem
}
.\[\&_\.main\]\:text-\[3\.5rem\] .main {
font-size:3.5rem
}
.\[\&_\.main\]\:font-bold .main {
font-weight:700
}
.\[\&_\.main\]\:font-semibold .main {
font-weight:600
}
.\[\&_\.main\]\:leading-\[1\.25\] .main {
line-height:1.25
}
.\[\&_\.main\]\:tracking-\[\.02em\] .main {
letter-spacing:.02em
}
@media (min-width:767px) {
.md\:\[\&_\.main\]\:mt-6 .main {
margin-top: 1.5rem
}
.md\:\[\&_\.main\]\:text-7xl .main {
font-size: 4.5rem
}
.md\:\[\&_\.main\]\:text-\[3rem\] .main {
font-size: 3rem
}
.md\:\[\&_\.main\]\:text-\[4rem\] .main {
font-size: 4rem
}
.md\:\[\&_\.main\]\:text-\[7\.5rem\] .main {
font-size: 7.5rem
}
}
.\[\&_\.slug-hybrid-springs\]\:bg-product-hybridSprings .slug-hybrid-springs {
--tw-bg-opacity:1;
background-color:rgb(223 245 247/var(--tw-bg-opacity))
}
.\[\&_\.slug-scrowave-springs\]\:bg-product-scrowaveSprings .slug-scrowave-springs {
--tw-bg-opacity:1;
background-color:rgb(229 240 245/var(--tw-bg-opacity))
}
.\[\&_\.slug-seal-rings\]\:bg-product-sealRings .slug-seal-rings {
--tw-bg-opacity:1;
background-color:rgb(226 242 233/var(--tw-bg-opacity))
}
.\[\&_\.slug-spiral-retaining-rings\]\:bg-product-spiralRetainingRings .slug-spiral-retaining-rings {
--tw-bg-opacity:1;
background-color:rgb(229 217 237/var(--tw-bg-opacity))
}
.\[\&_\.sub\]\:block .sub {
display:block
}
.\[\&_\.sub\]\:flex .sub {
display:flex
}
.\[\&_\.sub\]\:items-center .sub {
align-items:center
}
.\[\&_\.sub\]\:gap-\[\.5em\] .sub {
gap:.5em
}
.\[\&_\.sub\]\:font-figtree .sub {
font-family:Figtree,
sans-serif
}
.\[\&_\.sub\]\:text-base .sub {
font-size:1rem
}
.\[\&_\.sub\]\:text-sm .sub {
font-size:.875rem
}
.\[\&_\.sub\]\:text-xs .sub {
font-size:.75rem
}
.\[\&_\.sub\]\:font-bold .sub {
font-weight:700
}
.\[\&_\.sub\]\:tracking-\[\.02em\] .sub {
letter-spacing:.02em
}
.\[\&_\.sub\]\:text-\[\#005CA8\] .sub {
--tw-text-opacity:1;
color:rgb(0 92 168/var(--tw-text-opacity))
}
.\[\&_\.sub\]\:before\:block .sub:before {
content:var(--tw-content);
display:block
}
.\[\&_\.sub\]\:before\:aspect-square .sub:before {
aspect-ratio:1/1;
content:var(--tw-content)
}
.\[\&_\.sub\]\:before\:w-\[\.25rem\] .sub:before {
content:var(--tw-content);
width:.25rem
}
.\[\&_\.sub\]\:before\:rounded-full .sub:before {
border-radius:9999px;
content:var(--tw-content)
}
.\[\&_\.sub\]\:before\:bg-current .sub:before {
background-color:currentColor;
content:var(--tw-content)
}
@media (min-width:767px) {
.md\:\[\&_\.sub\]\:text-base .sub {
font-size: 1rem
}
.md\:\[\&_\.sub\]\:text-lg .sub {
font-size: 1.125rem
}
}
.\[\&_\.taxonomy-casestudy-field\]\:bg-\[\#F5F5F5\] .taxonomy-casestudy-field {
--tw-bg-opacity:1;
background-color:rgb(245 245 245/var(--tw-bg-opacity))
}
.\[\&_\.taxonomy-casestudy-field\]\:bg-white .taxonomy-casestudy-field {
--tw-bg-opacity:1;
background-color:rgb(255 255 255/var(--tw-bg-opacity))
}
@media (min-width:767px) {
.md\:\[\&_a\]\:border-b a {
border-bottom-width: 1px
}
.md\:\[\&_br\]\:hidden br {
display: none
}
}
.\[\&_img\]\:ml-auto img {
margin-left:auto
}
.\[\&_img\]\:h-full img {
height:100%
}
.\[\&_img\]\:w-\[12rem\] img {
width:12rem
}
.\[\&_img\]\:w-full img {
width:100%
}
.\[\&_img\]\:max-w-\[40\%\] img {
max-width:40%
}
.\[\&_img\]\:object-cover img {
-o-object-fit:cover;
object-fit:cover
}
.\[\&_p\:nth-child\(n\+2\)\]\:mt-6 p:nth-child(n+2) {
margin-top:1.5rem
}
.\[\&_p\]\:text-sm p {
font-size:.875rem
}
.\[\&_p\]\:leading-loose p {
line-height:2
}
.\[\&_p\]\:tracking-\[\.02em\] p {
letter-spacing:.02em
}
@media (min-width:767px) {
.md\:\[\&_p\]\:text-xl p {
font-size: 1.25rem
}
.md\:\[\&_p\]\:leading-\[1\.75\] p {
line-height: 1.75
}
}
.\[\&_th\]\:w-\[calc\(var\(--1column\)\*8\)\] th {
width:calc(var(--1column)*8)
}
.\[\&_th\]\:text-left th {
text-align:left
}
.\[\&_th\]\:align-top th {
vertical-align:top
}
.\[\&_th\]\:font-bold th {
font-weight:700
}
@media (min-width:767px) {
.md\:\[\&_th\]\:w-\[calc\(var\(--1column\)\*4\)\] th {
width: calc(var(--1column)*4)
}
}
.\[\&_tr\:nth-child\(1\)\>\*\]\:border-t tr:first-child>* {
border-top-width:1px
}
.\[\&_tr\>\*\]\:border-b tr>* {
border-bottom-width:1px
}
.\[\&_tr\>\*\]\:border-\[\#E6E6E6\] tr>* {
--tw-border-opacity:1;
border-color:rgb(230 230 230/var(--tw-border-opacity))
}
.\[\&_tr\>\*\]\:py-6 tr>* {
padding-bottom:1.5rem;
padding-top:1.5rem
}
@media (min-width:767px) {
.md\:\[\&_tr\>\*\]\:py-9 tr>* {
padding-bottom: 2.25rem;
padding-top: 2.25rem
}
}
.close {
margin-right: 1.5px;
}
.md\:w-5 {
width: 2rem;
}
.md\:w-\[3\.75rem\] {
width: 4.75rem;
}
.md\:h-\[3\.75rem\] {
height: 4.75rem;
}
.\[\&_svg\]\:\!fill-\[\#005CA8\] svg {
fill:#005ca8!important
}
.group\/hover:hover .md\:\[\&_svg\]\:group-hover\/hover\:\!fill-white svg {
fill: #fff!important
}
@media only screen and (max-width: 1024px) {
.close {
margin-right: 3px;
}
.md\:top-9 {
top: 1.25rem;
right: 2.5rem;
z-index: 99999999;
}
.md\:top-\[3\.6rem\] {
right: 2.2rem;
top: 6.5rem;
display: none;
}
.md\:text-xl {
font-size: 2.2rem;
}
.text-sm {
font-size: 1.7rem;
}
}
@media only screen and (max-width: 767px) {
.md\:text-xl {
font-size: 2rem;
}
.text-sm {
font-size: 1.5rem;
}
}
@media only screen and (max-width: 516px) {
.max-md\:border-b,
.max-md\:border-y {
border-bottom: 1px solid white;
}
#megamenu {
margin-top: 59.6px;
}
.md\:w-\[37\.7\%\] {
position: absolute;
top: 30.6px;
left: 50%;
transform: translateX(-50%);
}
.md\:text-xl {
font-size: 1.8rem;
}
.menu {
display: none;
}
.md\:top-9 {
top: 1rem;
right: 1rem;
border: 1px solid #E60013;
border-radius: 50%;
}
.md\:w-\[3\.75rem\] {
width: 4.2rem;
}
.md\:h-\[3\.75rem\] {
height: 4.2rem;
}
.max-md\:pb-6 {
padding: 0rem 0 3rem;
}
.gap-3 {
gap: 1.75rem;
}
.md\:top-9,
#megamenu {
z-index: 10002;
}
}
.bi-arrow-down-short {
height: 20px;
width: 20px;
}
#megamenu {
background-color: #F7F8F8;
}
[data-switch="megamenu-sitemap-toggle,click"] {
transition: transform 0.3s ease;
}
[data-switch="megamenu-sitemap-toggle,click"][data-state="open"] {
transform: rotate(360deg);
}