*,
::before,
::after {
box-sizing: border-box;
border-style: solid;
border-width: 0;
}   html {
line-height: 1.15; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }   body {
margin: 0;
} main {
display: block;
}  p,
table,
blockquote,
address,
pre,
iframe,
form,
figure,
dl {
margin: 0;
}  h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit;
font-weight: inherit;
margin: 0;
}  ul,
ol {
margin: 0;
padding: 0;
list-style: none;
}  dt {
font-weight: bold;
}
dd {
margin-left: 0;
}   hr {
box-sizing: content-box; height: 0; overflow: visible; border-top-width: 1px;
margin: 0;
clear: both;
color: inherit;
} pre {
font-family: monospace, monospace; font-size: inherit; }
address {
font-style: inherit;
}   a {
background-color: transparent;
text-decoration: none;
color: inherit;
} abbr[title] {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted; } b,
strong {
font-weight: bolder;
} code,
kbd,
samp {
font-family: monospace, monospace; font-size: inherit; } small {
font-size: 80%;
} sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}   svg,
img,
embed,
object,
iframe {
vertical-align: bottom;
}   button,
input,
optgroup,
select,
textarea {
-webkit-appearance: none; -moz-appearance: none;
appearance: none;
vertical-align: middle;
color: inherit;
font: inherit;
background: transparent;
padding: 0;
margin: 0;
border-radius: 0;
text-align: inherit;
text-transform: inherit; } button,
[type=button],
[type=reset],
[type=submit] {
cursor: pointer;
}
button:disabled,
[type=button]:disabled,
[type=reset]:disabled,
[type=submit]:disabled {
cursor: default;
} :-moz-focusring {
outline: auto;
}
select:disabled {
opacity: inherit;
} option {
padding: 0;
} fieldset {
margin: 0;
padding: 0;
min-width: 0;
}
legend {
padding: 0;
} progress {
vertical-align: baseline;
} textarea {
overflow: auto;
} [type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
} [type=search] {
outline-offset: -2px; } [type=search]::-webkit-search-decoration {
-webkit-appearance: none;
} ::-webkit-file-upload-button {
-webkit-appearance: button; font: inherit; } [type=number] {
-moz-appearance: textfield;
} label[for] {
cursor: pointer;
}   details {
display: block;
} summary {
display: list-item;
} [contenteditable]:focus {
outline: auto;
}   table {
border-color: inherit; border-collapse: collapse;
}
caption {
text-align: left;
}
td,
th {
vertical-align: top;
padding: 0;
}
th {
text-align: left;
font-weight: bold;
} *,
*:before,
*:after {
box-sizing: border-box;
}
body {
font-size: 16px;
line-height: 1.5;
font-family: "Noto Sans JP", "Roboto Condensed", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
color: #ffffff;
font-weight: 400;
background-color: #111111;
letter-spacing: 0.08em;
}
a {
color: inherit;
text-decoration: none;
cursor: pointer;
}
a:hover {
text-decoration: none;
}
p {
line-height: 1.5;
}
img {
max-width: 100%;
vertical-align: bottom;
}
input {
margin: 0;
padding: 0;
}
h1,
h2,
h3,
h4,
h5,
strong {
font-weight: 700;
}
textarea {
padding: 0;
font: inherit;
color: inherit;
}
button {
font: inherit;
padding: 0;
border: none;
color: inherit;
cursor: pointer;
}
.container {
overflow-x: hidden;
}
@media (max-width: 768px) {
.pc {
display: none;
}
}
@media (min-width: 769px) {
.sp {
display: none;
}
}
.header {
position: relative;
z-index: 100;
}
.header .header-top {
position: fixed;
top: 0;
left: 0;
width: 100%;
padding: 18px 0;
}
.header .header-top .header-inner {
display: flex;
justify-content: space-between;
align-items: center;
padding-inline: 80px;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner {
padding-inline: 16px;
}
}
.header .header-top .header-inner .header-logo {
width: 188px;
z-index: 10;
}
.header .header-top .header-inner .header-logo:hover {
opacity: 0.6;
transition: 0.5s;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-logo {
width: 118px;
}
}
.header .header-top .header-inner .header-logo a {
cursor: pointer;
display: inline-block;
}
.header .header-top .header-inner .header-logo a img {
width: 100%;
height: auto;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu {
position: relative;
width: 30px;
height: 16px;
display: inline-block;
transition: all 0.5s;
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
margin-left: 12px;
cursor: pointer;
z-index: 10;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu::before {
content: "MENU";
position: absolute;
top: -5px;
left: -54px;
letter-spacing: 0.1em;
font-family: "Roboto Condensed", sans-serif;
color: #ffffff;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu:hover {
opacity: 0.6;
transition: 0.5s;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu span {
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: #ffffff;
display: inline-block;
transition: all 0.5s;
box-sizing: border-box;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu span:nth-of-type(1) {
top: 0;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu span:nth-of-type(2) {
top: 12px;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu.active span:nth-of-type(1) {
top: 0;
transform: translateY(6px) rotate(-45deg);
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu.active span:nth-of-type(2) {
top: 12px;
transform: translateY(-6px) rotate(45deg);
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu.active {
transition: 0.5s;
}
.header .header-top .header-inner .header-menu-icon .header-hamburger-menu.active::before {
content: "CLOSE";
}
.header .header-top .header-inner .header-nav {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: #111111;
padding: 0;
display: none;
}
.header .header-top .header-inner .header-nav .header-nav-list {
display: flex;
gap: 9.861vw;
align-items: center;
position: absolute;
top: 50%;
left: 45%;
margin: 0 auto;
transform: translate(-50%, -50%);
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list {
left: 50%;
}
}
.header .header-top .header-inner .header-nav .header-nav-list a {
max-width: 372px;
}
.header .header-top .header-inner .header-nav .header-nav-list a:hover {
opacity: 0.6;
transition: 0.5s;
}
.header .header-top .header-inner .header-nav .header-nav-list a img {
width: 100%;
height: auto;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list a img {
display: none;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list {
display: none;
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li {
list-style: none;
text-align: left;
width: 200px;
position: relative;
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(1)::before {
position: absolute;
content: "01";
font-family: "Roboto Condensed", sans-serif;
font-size: 20px;
top: 28px;
left: -40px;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(1)::before {
top: 24px;
font-size: 1rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(2)::before {
position: absolute;
content: "02";
font-family: "Roboto Condensed", sans-serif;
font-size: 20px;
top: 28px;
left: -40px;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(2)::before {
top: 24px;
font-size: 1rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(3)::before {
position: absolute;
content: "03";
font-family: "Roboto Condensed", sans-serif;
font-size: 20px;
top: 28px;
left: -40px;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(3)::before {
top: 24px;
font-size: 1rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(4)::before {
position: absolute;
content: "04";
font-family: "Roboto Condensed", sans-serif;
font-size: 20px;
top: 28px;
left: -40px;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(4)::before {
top: 24px;
font-size: 1rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(5)::before {
position: absolute;
content: "05";
font-family: "Roboto Condensed", sans-serif;
font-size: 20px;
top: 28px;
left: -40px;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li:nth-of-type(5)::before {
top: 24px;
font-size: 1rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li a {
color: #ffffff;
text-decoration: none;
display: block;
letter-spacing: 0.1em;
font-family: "Roboto Condensed", sans-serif;
font-weight: 400;
font-size: 4rem;
}
@media screen and (max-width: 768px) {
.header .header-top .header-inner .header-nav .header-nav-list .header-list li a {
font-size: 3rem;
}
}
.header .header-top .header-inner .header-nav .header-nav-list .header-list li a:hover {
opacity: 0.6;
transition: 0.5s;
}
.header .header-top .header-inner .header-nav.panelactive {
display: block;
position: fixed;
z-index: 1;
-webkit-animation: appear 0.5s;
animation: appear 0.5s;
}
@-webkit-keyframes appear {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes appear {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.header .header-top .header-inner .header-nav.panelactive .header-nav-list a {
display: block;
}
.header .header-top .header-inner .header-nav.panelactive .header-list {
display: flex;
flex-direction: column;
justify-content: center;
gap: 8px;
}
.top .top-wrapper .fv {
position: relative;
top: 0;
z-index: -1;
}
.top .top-wrapper .fv .fv-inner .fv-wrapper .fv-img {
width: 100%;
height: auto;
overflow: hidden;
aspect-ratio: 2/1;
}
@media screen and (max-width: 768px) {
.top .top-wrapper .fv .fv-inner .fv-wrapper .fv-img {
height: 100vh;
}
}
.top .top-wrapper .fv .fv-inner .fv-wrapper .fv-img img {
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-webkit-animation: zoomUp 15s ease-in-out infinite alternate;
animation: zoomUp 15s ease-in-out infinite alternate;
}
@-webkit-keyframes zoomUp {
100% {
transform: scale(1.2);
}
}
@keyframes zoomUp {
100% {
transform: scale(1.2);
}
}
@media screen and (max-width: 768px) {
.top .top-wrapper .fv .fv-inner .fv-wrapper .fv-img img {
height: 100vh;
}
}
.top .top-wrapper #latest-news {
padding-top: 40px;
}
.top .top-wrapper #latest-news .latest-news-inner {
padding-inline: 14.583vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner {
padding-inline: 16px;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container {
display: flex;
gap: 80px;
align-items: center;
justify-content: center;
padding: 16px 40px;
border: 1px solid #ffffff;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container {
flex-direction: column;
gap: 24px;
padding: 16px 20px;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container h2 {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.1em;
line-height: 1.666;
font-family: "Roboto Condensed", sans-serif;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container h2 {
text-align: center;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details {
display: flex;
gap: 80px;
align-items: center;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details {
gap: 18px;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-txt:hover {
opacity: 0.6;
transition: 0.5s;
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-txt .latest-news-date {
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
padding-bottom: 2px;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-txt .latest-news-date {
font-size: 0.625rem;
padding-bottom: 0.5rem;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-txt .latest-news-ttl {
letter-spacing: 0.1em;
font-size: 1rem;
font-weight: 400;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-txt .latest-news-ttl {
font-size: 0.75rem;
}
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-btn {
padding: 8px 16px;
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
border: 1px solid #ffffff;
}
.top .top-wrapper #latest-news .latest-news-inner .latest-news-container .latest-news-details .latest-news-btn:hover {
opacity: 0.6;
transition: 0.5s;
}
.top .top-wrapper #about {
padding-top: 174px;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about {
padding-top: 128px;
}
}
.top .top-wrapper #about .about-inner {
padding-inline: 8.333vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 1024px) {
.top .top-wrapper #about .about-inner {
padding-inline: 16px;
}
}
.top .top-wrapper #about .about-inner .about-container {
display: flex;
flex-direction: row-reverse;
justify-content: center;
align-items: center;
gap: 25px;
max-width: 100%;
}
@media screen and (max-width: 1024px) {
.top .top-wrapper #about .about-inner .about-container {
flex-direction: column;
gap: 26px;
}
}
.top .top-wrapper #about .about-inner .about-container ul {
display: grid;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: repeat(3, 160px);
grid-column-gap: 0px;
grid-row-gap: 0px;
}
@media screen and (max-width: 1024px) {
.top .top-wrapper #about .about-inner .about-container ul {
grid-template-rows: repeat(3, 1fr);
}
}
.top .top-wrapper #about .about-inner .about-container ul .about-img {
width: 280px;
height: auto;
}
@media screen and (max-width: 1024px) {
.top .top-wrapper #about .about-inner .about-container ul .about-img {
width: 100%;
min-width: 280px;
}
}
.top .top-wrapper #about .about-inner .about-container ul .about-img:nth-of-type(1) {
grid-area: 1/3/2/8;
}
@media screen and (max-width: 385px) {
.top .top-wrapper #about .about-inner .about-container ul .about-img:nth-of-type(1) {
grid-area: 1/2/2/7;
}
}
.top .top-wrapper #about .about-inner .about-container ul .about-img:nth-of-type(2) {
grid-area: 2/1/3/6;
}
.top .top-wrapper #about .about-inner .about-container ul .about-img:nth-of-type(3) {
grid-area: 3/4/4/9;
}
@media screen and (max-width: 385px) {
.top .top-wrapper #about .about-inner .about-container ul .about-img:nth-of-type(3) {
grid-area: 3/2/4/7;
}
}
.top .top-wrapper #about .about-inner .about-container ul .about-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
aspect-ratio: 7/4;
}
.top .top-wrapper #about .about-inner .about-container .about-txt {
position: relative;
border: 1px solid #ffffff;
padding: 93px 83px 83px 87px;
}
@media screen and (max-width: 1280px) {
.top .top-wrapper #about .about-inner .about-container .about-txt {
padding: 63px 53px 53px 57px;
}
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt {
padding: 44px 17px 40px 23px;
}
}
.top .top-wrapper #about .about-inner .about-container .about-txt::before {
content: "";
top: 5px;
left: 2px;
position: absolute;
border: 1px solid #ffffff;
width: 100%;
height: 100%;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt::before {
left: 4px;
}
}
.top .top-wrapper #about .about-inner .about-container .about-txt .about-line::before {
content: "";
top: 0;
right: 45px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt .about-line::before {
right: 20px;
}
}
.top .top-wrapper #about .about-inner .about-container .about-txt .about-line::after {
content: "";
top: 0;
right: 49px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt .about-line::after {
right: 22px;
}
}
.top .top-wrapper #about .about-inner .about-container .about-txt h2 {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.1em;
line-height: 1.666;
font-family: "Roboto Condensed", sans-serif;
}
.top .top-wrapper #about .about-inner .about-container .about-txt h3 {
font-size: 1.25rem;
font-weight: 400;
padding: 40px 0;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt h3 {
font-size: 1rem;
padding: 24px 0;
}
}
.top .top-wrapper #about .about-inner .about-container .about-txt p {
line-height: 2;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #about .about-inner .about-container .about-txt p {
font-size: 0.75rem;
line-height: 1.5;
}
}
.top .top-wrapper #company {
padding: 160px 0;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company {
padding: 120px 0;
}
}
.top .top-wrapper #company .company-inner {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company .company-inner {
padding-inline: 16px;
}
}
.top .top-wrapper #company .company-inner h2 {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.1em;
line-height: 1.666;
text-align: center;
padding-bottom: 80px;
font-family: "Roboto Condensed", sans-serif;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company .company-inner h2 {
padding-bottom: 40px;
}
}
.top .top-wrapper #company .company-inner .company-info {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 80px;
padding-inline: 9.583vw;
}
@media screen and (max-width: 1280px) {
.top .top-wrapper #company .company-inner .company-info {
padding-inline: 0;
}
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company .company-inner .company-info {
flex-direction: column;
margin-bottom: 40px;
padding-inline: 5.333vw;
}
}
.top .top-wrapper #company .company-inner .company-info .company-details {
width: calc(50% - 40px);
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company .company-inner .company-info .company-details {
width: 100%;
}
}
.top .top-wrapper #company .company-inner .company-info .company-details table {
width: 100%;
}
.top .top-wrapper #company .company-inner .company-info .company-details table tr {
width: 100%;
border-bottom: 1px solid #ffffff;
}
.top .top-wrapper #company .company-inner .company-info .company-details table tr th {
width: 97px;
text-align: left;
font-size: 0.875rem;
font-weight: 400;
letter-spacing: 0.05em;
padding: 32px 0 16px 0;
}
.top .top-wrapper #company .company-inner .company-info .company-details table tr td {
font-size: 0.875rem;
line-height: 1.714;
letter-spacing: 0.05em;
word-wrap: break-word;
word-break: break-all;
padding: 32px 0 16px 0;
}
.top .top-wrapper #company .company-inner .company-map {
max-width: 960px;
height: auto;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.top .top-wrapper #company .company-inner .company-map {
min-width: 343px;
}
}
.top .top-wrapper #company .company-inner .company-map iframe {
width: 100%;
height: 100%;
aspect-ratio: 960/556;
filter: grayscale(100%);
}
.error404 {
padding: 80px 0 160px 0;
text-align: center;
}
@media screen and (max-width: 768px) {
.error404 {
padding: 40px 0 120px 0;
}
}
.error404 .error404-inner {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.error404 .error404-inner {
padding-inline: 16px;
}
}
.error404 .error404-inner h2 {
font-size: 2rem;
padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
.error404 .error404-inner h2 {
font-size: 1.5rem;
padding-bottom: 24px;
}
}
.error404 .error404-inner p {
padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
.error404 .error404-inner p {
font-size: 0.75rem;
}
}
.error404 .error404-inner button {
border: 1px solid #ffffff;
padding: 16px 32px;
}
.error404 .error404-inner button:hover {
opacity: 0.6;
transition: 0.5s;
}
@media screen and (max-width: 768px) {
.error404 .error404-inner button {
padding: 8px 16px;
}
}
.article {
padding-top: 100px;
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.article {
padding-bottom: 120px;
}
}
.article .article-wrapper {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.article .article-wrapper {
padding-inline: 16px;
}
}
.article .article-wrapper .article-contents .article-post .article-txt {
border-bottom: 5px solid #ffffff;
}
.article .article-wrapper .article-contents .article-post .article-txt .article-date {
font-family: "Roboto Condensed", sans-serif;
padding-bottom: 0.5rem;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-txt .article-date {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .article-txt .article-ttl {
font-size: 1.5rem;
font-weight: 500;
letter-spacing: 0.1em;
padding-bottom: 32px;
line-height: 1.666;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-txt .article-ttl {
padding-bottom: 24px;
font-size: 1.25rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body {
padding-top: 80px;
width: 100%;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body {
padding-top: 40px;
}
}
.article .article-wrapper .article-contents .article-post .article-body p,
.article .article-wrapper .article-contents .article-post .article-body h1,
.article .article-wrapper .article-contents .article-post .article-body h2,
.article .article-wrapper .article-contents .article-post .article-body h3,
.article .article-wrapper .article-contents .article-post .article-body h5,
.article .article-wrapper .article-contents .article-post .article-body ul,
.article .article-wrapper .article-contents .article-post .article-body ol,
.article .article-wrapper .article-contents .article-post .article-body figure {
padding-bottom: 40px;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body p,
.article .article-wrapper .article-contents .article-post .article-body h1,
.article .article-wrapper .article-contents .article-post .article-body h2,
.article .article-wrapper .article-contents .article-post .article-body h3,
.article .article-wrapper .article-contents .article-post .article-body h5,
.article .article-wrapper .article-contents .article-post .article-body ul,
.article .article-wrapper .article-contents .article-post .article-body ol,
.article .article-wrapper .article-contents .article-post .article-body figure {
padding-bottom: 24px;
}
}
.article .article-wrapper .article-contents .article-post .article-body h4,
.article .article-wrapper .article-contents .article-post .article-body h6 {
margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h4,
.article .article-wrapper .article-contents .article-post .article-body h6 {
margin-bottom: 24px;
}
}
.article .article-wrapper .article-contents .article-post .article-body h1 {
font-size: 3rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h1 {
font-size: 1.5rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body h2 {
font-size: 2rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h2 {
font-size: 1.25rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body h3 {
font-size: 1.5rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h3 {
font-size: 1rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body h4 {
font-size: 1.5rem;
border-bottom: 1px solid #ffffff;
padding-bottom: 0.25rem;
display: inline-block;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h4 {
font-size: 1rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body h5 {
font-size: 1rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h5 {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body h6 {
font-size: 1rem;
border-bottom: 1px solid #ffffff;
padding-bottom: 0.25rem;
display: inline-block;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body h6 {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body .wp-block-image {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
max-width: 800px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body .wp-block-image {
max-width: 300px;
}
}
.article .article-wrapper .article-contents .article-post .article-body .wp-block-image img {
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
aspect-ratio: 800/494;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body .wp-block-image img {
aspect-ratio: 300/186;
}
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body p {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body ul {
list-style: circle;
padding-left: 1.2rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body ul {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .article-body ol {
list-style: decimal;
padding-left: 1.2rem;
}
@media screen and (max-width: 768px) {
.article .article-wrapper .article-contents .article-post .article-body ol {
font-size: 0.75rem;
}
}
.article .article-wrapper .article-contents .article-post .post-links {
display: flex;
justify-content: center;
align-items: center;
padding-top: 56px;
padding-bottom: 40px;
gap: 24px;
}
.article .article-wrapper .article-contents .article-post .post-links .post-link {
font-family: "Roboto Condensed", sans-serif;
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-prev {
position: relative;
padding-left: 12px;
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-prev::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
transform: rotate(45deg);
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-prev:hover {
opacity: 0.6;
transition: 0.5s;
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-next {
position: relative;
padding-right: 12px;
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-next::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 10px;
height: 10px;
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transform: rotate(45deg);
}
.article .article-wrapper .article-contents .article-post .post-links .post-link-next:hover {
opacity: 0.6;
transition: 0.5s;
}
.article .article-wrapper .list-link {
display: flex;
justify-content: center;
align-items: center;
}
.article .article-wrapper .list-link a {
font-family: "Roboto Condensed", sans-serif;
border: 1px solid #ffffff;
padding: 24px 56px;
letter-spacing: 0.1em;
}
.article .article-wrapper .list-link a:hover {
opacity: 0.6;
transition: 0.5s;
}
.brand {
padding-top: 100px;
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.brand {
padding-bottom: 120px;
}
}
.brand .brand-wrapper {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper {
padding-inline: 16px;
}
}
.brand .brand-wrapper .brand-ttl {
padding: 80px 0;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-ttl {
max-width: 343px;
padding: 40px 0 80px 0;
}
}
.brand .brand-wrapper .brand-ttl h1 {
font-size: 6rem;
line-height: 1.25;
font-weight: 400;
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-ttl h1 {
font-size: 4rem;
}
}
.brand .brand-wrapper .brand-details {
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details {
padding-bottom: 80px;
}
}
.brand .brand-wrapper .brand-details .brand-details-ttl {
position: relative;
display: flex;
gap: 0.5rem;
border-bottom: 1px solid #ffffff;
padding-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-ttl {
gap: 0;
padding-bottom: 1rem;
}
}
.brand .brand-wrapper .brand-details .brand-details-ttl::before {
content: "";
bottom: 0;
right: 16px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
.brand .brand-wrapper .brand-details .brand-details-ttl::after {
content: "";
bottom: 0;
right: 20px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
.brand .brand-wrapper .brand-details .brand-details-ttl h2 {
font-size: 2.5rem;
line-height: 1.2;
letter-spacing: 0.1em;
font-weight: 500;
font-family: "Roboto Condensed", sans-serif;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-ttl h2 {
font-size: 2rem;
}
}
.brand .brand-wrapper .brand-details .brand-details-ttl img {
width: 68px;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-ttl img {
width: 45px;
}
}
.brand .brand-wrapper .brand-details .brand-details-txt {
padding: 0.5rem 0 1rem 0;
max-width: 640px;
}
@media screen and (max-width: 1024px) {
.brand .brand-wrapper .brand-details .brand-details-txt {
max-width: 400px;
}
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-txt {
padding: 1rem 0;
font-size: 0.75rem;
}
}
.brand .brand-wrapper .brand-details .brand-details-btn {
display: flex;
gap: 24px;
}
.brand .brand-wrapper .brand-details .brand-details-btn a {
color: #111111;
background-color: #D8D8D8;
padding: 12px 64px;
}
.brand .brand-wrapper .brand-details .brand-details-btn a:last-of-type {
padding: 12px 80px;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-btn a:last-of-type {
padding: 12px 52px;
}
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-details .brand-details-btn a {
font-size: 0.75rem;
padding: 12px 40px;
}
}
.brand .brand-wrapper .brand-details .brand-details-btn a:hover {
opacity: 0.6;
transition: 0.5s;
}
.brand .brand-wrapper .brand-container {
width: 100vw;
margin-left: calc(50% - 50vw);
padding-bottom: 80px;
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(auto-fill, 482px);
gap: 0px 0px;
grid-auto-flow: row;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-container {
padding-bottom: 40px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}
.brand .brand-wrapper .brand-container .brand-link {
position: relative;
height: 482px;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-container .brand-link {
height: auto;
}
}
.brand .brand-wrapper .brand-container .brand-link:hover {
opacity: 0.8;
transition: 0.5s;
}
.brand .brand-wrapper .brand-container .brand-link .brand-list-img {
width: 100%;
height: 100%;
}
.brand .brand-wrapper .brand-container .brand-link .brand-list-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.brand .brand-wrapper .brand-container .brand-link .brand-list-title {
position: absolute;
top: 3rem;
left: 3rem;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-container .brand-link .brand-list-title {
top: 1.5rem;
left: 1.5rem;
}
}
.brand .brand-wrapper .brand-container .brand-link .brand-list-title h3 {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.1em;
font-family: "Roboto Condensed", sans-serif;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-container .brand-link .brand-list-title h3 {
font-size: 1.25rem;
font-weight: 500;
}
}
.brand .brand-wrapper .brand-container .brand-link .brand-list-txt {
position: absolute;
top: 6.5rem;
left: 3rem;
max-width: 320px;
}
@media screen and (max-width: 768px) {
.brand .brand-wrapper .brand-container .brand-link .brand-list-txt {
top: 4.5rem;
left: 1.5rem;
max-width: 200px;
font-size: 0.75rem;
}
}
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(4n + 1),
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(4n + 2) {
grid-column: span 3/auto;
}
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(8n + 3),
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(8n + 8) {
grid-column: span 2/auto;
}
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(8n + 4),
.brand .brand-wrapper .brand-container .brand-link:nth-of-type(8n + 7) {
grid-column: span 4/auto;
}
.brand .brand-wrapper .pager {
text-align: center;
}
.brand .brand-wrapper .pager .page-numbers {
padding: 0 8px;
letter-spacing: 0.05em;
font-family: "Roboto Condensed", sans-serif;
vertical-align: bottom;
}
.brand .brand-wrapper .pager .page-numbers:hover {
opacity: 0.6;
transition: 0.5s;
}
.brand .brand-wrapper .pager .current {
pointer-events: none;
}
.brand .brand-wrapper .pager .prev {
position: relative;
padding-left: 12px;
}
.brand .brand-wrapper .pager .prev::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
transform: rotate(45deg);
}
.brand .brand-wrapper .pager .prev:hover {
opacity: 0.6;
transition: 0.5s;
}
.brand .brand-wrapper .pager .next {
position: relative;
margin-left: 8px;
}
.brand .brand-wrapper .pager .next::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transform: rotate(45deg);
}
.brand .brand-wrapper .pager .next:hover {
opacity: 0.6;
transition: 0.5s;
}
.brand-collection {
padding-top: 180px;
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.brand-collection {
padding-top: 140px;
padding-bottom: 120px;
}
}
.brand-collection .brand-collection-wrapper {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper {
padding-inline: 16px;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-top {
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-top {
padding-bottom: 80px;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl {
position: relative;
border-bottom: 1px solid #ffffff;
padding-bottom: 0.5rem;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl {
padding-bottom: 1rem;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl::before {
content: "";
bottom: 0;
right: 16px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl::after {
content: "";
bottom: 0;
right: 20px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl h1 {
font-size: 2.5rem;
line-height: 1.25;
font-weight: 400;
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-ttl h1 {
font-size: 2rem;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-txt {
padding-top: 0.5rem;
max-width: 640px;
}
@media screen and (max-width: 1024px) {
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-txt {
max-width: 400px;
}
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-top .brand-collection-txt {
padding-top: 1rem;
font-size: 0.75rem;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img {
width: 100vw;
margin-left: calc(50% - 50vw);
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(auto-fill, 482px);
gap: 0px 0px;
grid-auto-flow: row;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
}
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(4n+1), .brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(4n+2) {
grid-column: span 3/auto;
}
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(8n+3), .brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(8n+8) {
grid-column: span 2/auto;
}
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(8n+4), .brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img:nth-of-type(8n+7) {
grid-column: span 4/auto;
}
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img {
width: 100%;
height: 482px;
-o-object-fit: cover;
object-fit: cover;
}
@media screen and (max-width: 768px) {
.brand-collection .brand-collection-wrapper .brand-collection-container .brand-collection-img img {
height: auto;
aspect-ratio: 375/250;
}
}
.media-list {
padding-top: 100px;
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.media-list {
padding-bottom: 120px;
}
}
.media-list .media-list-wrapper {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper {
padding-inline: 16px;
}
}
.media-list .media-list-wrapper .media-list-ttl {
padding: 80px 0 180px 0;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-ttl {
max-width: 343px;
padding: 40px 0;
margin: 0 auto;
}
}
.media-list .media-list-wrapper .media-list-ttl h1 {
font-size: 6rem;
line-height: 1.25;
font-weight: 400;
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-ttl h1 {
font-size: 4rem;
}
}
.media-list .media-list-wrapper .media-list-container {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
padding-bottom: 40px;
max-width: 960px;
gap: 40px 24px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-container {
max-width: 343px;
gap: 24px 15px;
}
}
.media-list .media-list-wrapper .media-list-container .media-list-link {
width: calc((100% - 48px) / 3);
height: 312px;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-container .media-list-link {
width: calc((100% - 15px) / 2);
height: 205px;
}
}
.media-list .media-list-wrapper .media-list-container .media-list-link:hover {
opacity: 0.6;
transition: 0.5s;
}
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-img {
width: 100%;
}
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-img img {
width: 100%;
aspect-ratio: 304/228;
height: auto;
-o-object-fit: cover;
object-fit: cover;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-img img {
aspect-ratio: 164/124;
}
}
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-txt {
padding-top: 10px;
}
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-txt .media-list-date {
font-family: "Roboto Condensed", sans-serif;
padding-bottom: 2px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-txt .media-list-date {
font-size: 0.75rem;
}
}
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-txt h2 {
font-weight: 400;
position: relative;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.media-list .media-list-wrapper .media-list-container .media-list-link .media-list-txt h2 {
font-size: 0.75rem;
}
}
.media-list .media-list-wrapper .pager {
text-align: center;
}
.media-list .media-list-wrapper .pager .page-numbers {
padding: 0 8px;
letter-spacing: 0.05em;
font-family: "Roboto Condensed", sans-serif;
vertical-align: bottom;
}
.media-list .media-list-wrapper .pager .page-numbers:hover {
opacity: 0.6;
transition: 0.5s;
}
.media-list .media-list-wrapper .pager .current {
pointer-events: none;
}
.media-list .media-list-wrapper .pager .prev {
position: relative;
padding-left: 12px;
}
.media-list .media-list-wrapper .pager .prev::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
transform: rotate(45deg);
}
.media-list .media-list-wrapper .pager .prev:hover {
opacity: 0.6;
transition: 0.5s;
}
.media-list .media-list-wrapper .pager .next {
position: relative;
margin-left: 8px;
}
.media-list .media-list-wrapper .pager .next::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transform: rotate(45deg);
}
.media-list .media-list-wrapper .pager .next:hover {
opacity: 0.6;
transition: 0.5s;
}
.news {
padding-top: 100px;
padding-bottom: 160px;
}
@media screen and (max-width: 768px) {
.news {
padding-bottom: 120px;
}
}
.news .news-wrapper {
padding-inline: 16.667vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.news .news-wrapper {
padding-inline: 16px;
}
}
.news .news-wrapper .news-ttl {
padding: 80px 0 56px 0;
}
@media screen and (max-width: 768px) {
.news .news-wrapper .news-ttl {
padding: 40px 0 56px 0;
}
}
.news .news-wrapper .news-ttl h1 {
font-size: 6rem;
line-height: 1.25;
font-weight: 400;
font-family: "Roboto Condensed", sans-serif;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.news .news-wrapper .news-ttl h1 {
font-size: 4rem;
}
}
.news .news-wrapper .news-container {
padding-bottom: 40px;
}
.news .news-wrapper .news-container .news-link {
display: block;
padding: 24px 0;
border-bottom: 1px solid #ffffff;
}
.news .news-wrapper .news-container .news-link .news-txt:hover {
opacity: 0.6;
transition: 0.5s;
}
.news .news-wrapper .news-container .news-link .news-txt .news-date {
font-family: "Roboto Condensed", sans-serif;
padding-bottom: 1rem;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.news .news-wrapper .news-container .news-link .news-txt .news-date {
font-size: 0.75rem;
}
}
.news .news-wrapper .news-container .news-link .news-txt h2 {
font-weight: 400;
position: relative;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.news .news-wrapper .news-container .news-link .news-txt h2 {
font-size: 0.75rem;
padding-right: 20px;
}
}
.news .news-wrapper .news-container .news-link .news-txt h2::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
right: 0;
width: 10px;
height: 10px;
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transform: rotate(45deg);
}
.news .news-wrapper .pager {
text-align: center;
}
.news .news-wrapper .pager .page-numbers {
padding: 0 8px;
letter-spacing: 0.05em;
font-family: "Roboto Condensed", sans-serif;
vertical-align: bottom;
}
.news .news-wrapper .pager .page-numbers:hover {
opacity: 0.6;
transition: 0.5s;
}
.news .news-wrapper .pager .current {
pointer-events: none;
}
.news .news-wrapper .pager .prev {
position: relative;
padding-left: 12px;
}
.news .news-wrapper .pager .prev::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #ffffff;
transform: rotate(45deg);
}
.news .news-wrapper .pager .prev:hover {
opacity: 0.6;
transition: 0.5s;
}
.news .news-wrapper .pager .next {
position: relative;
margin-left: 8px;
}
.news .news-wrapper .pager .next::before {
content: "";
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 10px;
height: 10px;
border-top: 1px solid #ffffff;
border-right: 1px solid #ffffff;
transform: rotate(45deg);
}
.news .news-wrapper .pager .next:hover {
opacity: 0.6;
transition: 0.5s;
}
.footer {
width: 100%;
font-family: "Roboto Condensed", sans-serif;
border-top: 1px solid #ffffff;
position: relative;
}
.footer::before {
content: "";
top: 0;
right: 316px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
@media screen and (max-width: 768px) {
.footer::before {
right: 20px;
}
}
.footer::after {
content: "";
top: 0;
right: 320px;
position: absolute;
width: 40px;
height: 1px;
background-color: #ffffff;
transform: rotate(135deg);
}
@media screen and (max-width: 768px) {
.footer::after {
right: 24px;
}
}
.footer .footer-inner {
padding-inline: 17.188vw;
margin-inline: auto;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.footer .footer-inner {
padding-inline: 9.867vw;
}
}
.footer .footer-inner .footer-top {
padding: 80px 0;
}
.footer .footer-inner .footer-top .footer-list {
display: flex;
gap: 1.5rem;
justify-content: center;
align-items: center;
}
.footer .footer-inner .footer-top .footer-list li:hover {
opacity: 0.6;
transition: 0.5s;
}
@media screen and (max-width: 768px) {
.footer .footer-inner .footer-top .footer-list li a {
font-size: 0.75rem;
}
}
.footer .footer-inner .footer-copyright {
text-align: center;
font-size: 0.75rem;
padding-bottom: 1rem;
}
@media screen and (max-width: 768px) {
.footer .footer-inner .footer-copyright {
font-size: 0.625rem;
}
}