@charset "UTF-8";
:root {
--color-border: #e4e4e4;
--color-accent: #005c4c;
--color-text: #000;
--color-sub-text: #707070;
--color-text-hover: #b2b2b2;
--transition-duration-hover: 0.6s;
--icon-arrow: url('data:image/svg+xml;charset=UTF-8,');
--icon-arrow-thin: url('data:image/svg+xml;charset=UTF-8,');
--icon-pdf: url('data:image/svg+xml;charset=UTF-8,');
--icon-window: url('data:image/svg+xml;charset=UTF-8,');
}
@media screen and (min-width: 48em), print {
:root {
--container-width: 71.7423133236vw;
--container-article-width: 64.4216691069vw;
}
}
@media screen and (max-width: 47.99em) {
:root {
--container-width: 89.7435897436vw;
--container-article-width: 89.7435897436vw;
}
}
@media screen and (max-width: 47.99em) {
.globalMenu {
top: 150vw;
}
}
.lowerLayer .header {
opacity: 1;
}
.lowerLayer .footer {
border-top: 1px solid var(--color-border);
}
.container {
width: var(--container-width);
margin-inline: auto;
}
.container.container--article {
width: var(--container-article-width);
}
.hero {
position: relative;
height: -moz-fit-content;
height: fit-content;
overflow: hidden;
border-radius: 5px;
}
@media screen and (min-width: 48em), print {
.hero {
margin-bottom: 4.39238653vw;
}
}
@media screen and (max-width: 47.99em) {
.hero {
margin-bottom: 10.2564102564vw;
}
}
.hero__bg {
position: absolute;
inset: 0;
}
.hero__bg img {
-o-object-fit: cover;
object-fit: cover;
}
.hero__textArea {
position: relative;
z-index: 1;
color: #fff;
}
@media screen and (min-width: 48em), print {
.hero__textArea {
padding: 4.0263543192vw 5.1244509517vw 3.2942898975vw;
}
}
@media screen and (max-width: 47.99em) {
.hero__textArea {
padding: 7.6923076923vw 10.2564102564vw 10vw;
}
}
.hero__enTitle {
font-weight: 500;
}
@media screen and (min-width: 48em), print {
.hero__enTitle {
margin-bottom: 0.7320644217vw;
font-size: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.hero__enTitle {
margin-bottom: 1.7948717949vw;
font-size: 6.1538461538vw;
}
}
.hero--news .hero__enTitle {
letter-spacing: 2px;
}
@media screen and (min-width: 48em), print {
.hero__enTitle__whiteSpace {
margin-right: 0.7320644217vw;
}
}
@media screen and (max-width: 47.99em) {
.hero__enTitle__whiteSpace {
margin-right: 1.2820512821vw;
}
}
.hero__jaTitle {
letter-spacing: 1.5px;
}
@media screen and (min-width: 48em), print {
.hero__jaTitle {
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.hero__jaTitle {
font-size: 2.5641025641vw;
}
}
.newsList {
display: grid;
}
.newsList__itemLink {
position: relative;
display: grid;
}
@media screen and (min-width: 48em), print {
.newsList__itemLink {
grid-template-columns: 8.345534407vw 1fr;
-moz-column-gap: 2.3426061493vw;
column-gap: 2.3426061493vw;
padding-bottom: 1.756954612vw;
margin-top: 1.756954612vw;
}
}
@media screen and (max-width: 47.99em) {
.newsList__itemLink {
row-gap: 3.0769230769vw;
padding-bottom: 6.1538461538vw;
margin-top: 8.2051282051vw;
}
}
.newsList__itemLink::before, .newsList__itemLink::after {
position: absolute;
bottom: 0;
display: block;
height: 1px;
content: "";
}
.newsList__itemLink::before {
width: 100%;
background-color: var(--color-border);
}
.newsList__itemLink::after {
width: 0;
background-color: var(--color-accent);
transition-duration: var(--transition-duration-hover);
transition-property: background-color width;
}
.newsList__itemLink:hover::after {
width: 100%;
}
.newsList__date,
.newsList__title {
line-height: 2;
}
@media screen and (min-width: 48em), print {
.newsList__date,
.newsList__title {
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.newsList__date,
.newsList__title {
font-size: 3.5897435897vw;
}
}
.newsList__date {
font-weight: 500;
color: var(--color-sub-text);
}
.newsList__title {
font-weight: 700;
color: var(--color-text);
transition-duration: var(--transition-duration-hover);
transition-property: color;
}
.newsList__itemLink:hover .newsList__title {
color: var(--color-accent);
}
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)) {
position: relative;
font-weight: 700;
line-height: 1.5;
letter-spacing: 0.02em;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)) {
padding-left: 1.6105417277vw;
font-size: 1.317715959vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)) {
padding-left: 5.641025641vw;
font-size: 4.6153846154vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 4.39238653vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 12.3076923077vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:last-child)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:last-child)) {
margin-bottom: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:last-child)),
.is-root-container :where(h2):not(:where(.elementStyle__ignore *)):where(:not(:last-child)) {
margin-bottom: 8.2051282051vw;
}
}
.elementStyle :where(h2):not(:where(.elementStyle__ignore *))::before,
.is-root-container :where(h2):not(:where(.elementStyle__ignore *))::before {
position: absolute;
left: 0;
display: block;
content: "";
background-color: var(--color-accent);
border-radius: 50%;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *))::before,
.is-root-container :where(h2):not(:where(.elementStyle__ignore *))::before {
top: 0.5856515373vw;
width: 0.7320644217vw;
height: 0.7320644217vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(h2):not(:where(.elementStyle__ignore *))::before,
.is-root-container :where(h2):not(:where(.elementStyle__ignore *))::before {
top: 2.0512820513vw;
width: 2.5641025641vw;
height: 2.5641025641vw;
}
}
.elementStyle :where(p):not(:where(.elementStyle__ignore *)),
.is-root-container :where(p):not(:where(.elementStyle__ignore *)) {
font-weight: 500;
line-height: 2;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(p):not(:where(.elementStyle__ignore *)),
.is-root-container :where(p):not(:where(.elementStyle__ignore *)) {
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(p):not(:where(.elementStyle__ignore *)),
.is-root-container :where(p):not(:where(.elementStyle__ignore *)) {
font-size: 3.5897435897vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(p):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(p):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(p):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(p):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 6.1538461538vw;
}
}
.elementStyle :where(strong):not(:where(.elementStyle__ignore *)),
.is-root-container :where(strong):not(:where(.elementStyle__ignore *)) {
font-weight: 700;
}
.elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *)),
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *)) {
color: var(--color-accent);
overflow-wrap: break-word;
-webkit-text-decoration: solid underline;
text-decoration: solid underline;
text-decoration-color: var(--color-accent);
transition-duration: var(--transition-duration-hover);
transition-property: opacity;
}
.elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *)):hover,
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *)):hover {
opacity: 0.4;
}
.elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *))[target=_blank]::after, .elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *))[href$=".pdf"]::after,
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *))[target=_blank]::after,
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *))[href$=".pdf"]::after {
display: inline-block;
width: 1em;
height: 1em;
margin-inline: 0.45em;
content: "";
background-color: currentColor;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-size: contain;
mask-size: contain;
transform: translateY(15%);
}
.elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *))[target=_blank]:not([href$=".pdf"])::after,
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *))[target=_blank]:not([href$=".pdf"])::after {
-webkit-mask-image: var(--icon-window);
mask-image: var(--icon-window);
}
.elementStyle :where(a):not(:where(.elementStyle__ignore *, .textLink *))[href$=".pdf"]::after,
.is-root-container :where(a):not(:where(.elementStyle__ignore *, .textLink *))[href$=".pdf"]::after {
-webkit-mask-image: var(--icon-pdf);
mask-image: var(--icon-pdf);
}
.elementStyle :where(ul, ol):not(:where(.elementStyle__ignore *)),
.is-root-container :where(ul, ol):not(:where(.elementStyle__ignore *)) {
display: grid;
padding-left: 1.5em;
font-weight: 500;
line-height: 2;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(ul, ol):not(:where(.elementStyle__ignore *)),
.is-root-container :where(ul, ol):not(:where(.elementStyle__ignore *)) {
row-gap: 0.5856515373vw;
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(ul, ol):not(:where(.elementStyle__ignore *)),
.is-root-container :where(ul, ol):not(:where(.elementStyle__ignore *)) {
row-gap: 2.0512820513vw;
font-size: 3.5897435897vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(ul, ol):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(ul, ol):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(ul, ol):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(ul, ol):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 6.1538461538vw;
}
}
.elementStyle :where(ul):not(:where(.elementStyle__ignore *)),
.is-root-container :where(ul):not(:where(.elementStyle__ignore *)) {
list-style-type: disc;
}
.elementStyle :where(ol):not(:where(.elementStyle__ignore *)),
.is-root-container :where(ol):not(:where(.elementStyle__ignore *)) {
list-style-type: decimal;
}
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)) {
margin-inline: auto;
}
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)):where(:not(.wp-block-embed)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)):where(:not(.wp-block-embed)) {
width: -moz-fit-content;
width: fit-content;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:first-child)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:first-child)) {
margin-top: 8.2051282051vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:last-child)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:last-child)) {
margin-bottom: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:last-child)),
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)):where(:not(:last-child)) {
margin-bottom: 8.2051282051vw;
}
}
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)) figcaption,
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)) figcaption {
margin-bottom: 0;
font-weight: 500;
line-height: 2.25;
color: #d2d2d2;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)) figcaption,
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)) figcaption {
margin-top: 1.1713030747vw;
font-size: 0.878477306vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(figure):not(:where(.elementStyle__ignore *)) figcaption,
.is-root-container :where(figure):not(:where(.elementStyle__ignore *)) figcaption {
margin-top: 2.5641025641vw;
font-size: 3.0769230769vw;
}
}
.elementStyle :where(img):not(:where(.elementStyle__ignore *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)) {
display: block;
width: -moz-fit-content;
width: fit-content;
height: -moz-fit-content;
height: fit-content;
margin-inline: auto;
-o-object-fit: contain;
object-fit: contain;
}
@media screen and (min-width: 48em), print {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)) {
max-height: 26.3543191801vw;
border-radius: 0.439238653vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)) {
max-height: 56.4102564103vw;
border-radius: 1.5384615385vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)):where(:not(:first-child):not(:where(figure) *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)):where(:not(:first-child):not(:where(figure) *)) {
margin-top: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)):where(:not(:first-child):not(:where(figure) *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)):where(:not(:first-child):not(:where(figure) *)) {
margin-top: 10.2564102564vw;
}
}
@media screen and (min-width: 48em), print {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)):where(:not(:last-child):not(:where(figure) *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)):where(:not(:last-child):not(:where(figure) *)) {
margin-bottom: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.elementStyle :where(img):not(:where(.elementStyle__ignore *)):where(:not(:last-child):not(:where(figure) *)),
.is-root-container :where(img):not(:where(.elementStyle__ignore *)):where(:not(:last-child):not(:where(figure) *)) {
margin-bottom: 10.2564102564vw;
}
}
.noteList {
padding-left: 0;
font-weight: 500;
line-height: 1.83;
}
@media screen and (min-width: 48em), print {
.noteList {
row-gap: 0.2928257687vw;
font-size: 0.878477306vw;
}
}
@media screen and (max-width: 47.99em) {
.noteList {
row-gap: 1.0256410256vw;
font-size: 3.0769230769vw;
}
}
@media screen and (min-width: 48em), print {
.noteList:where(:not(:first-child)) {
margin-top: 1.1713030747vw;
}
}
@media screen and (max-width: 47.99em) {
.noteList:where(:not(:first-child)) {
margin-top: 6.1538461538vw;
}
}
.noteListItem {
display: grid;
grid-template-columns: auto 1fr;
}
@media screen and (min-width: 48em), print {
.noteListItem {
-moz-column-gap: 0.2928257687vw;
column-gap: 0.2928257687vw;
}
}
@media screen and (max-width: 47.99em) {
.noteListItem {
-moz-column-gap: 1.0256410256vw;
column-gap: 1.0256410256vw;
}
}
.noteListItem::before {
content: "※";
}
ol .noteListItem {
counter-increment: cnt;
}
ol .noteListItem::before {
content: "※" counter(cnt);
}
.blockLink {
width: -moz-fit-content;
width: fit-content;
transform: translate(0, 0);
transition-duration: 0.4s;
transition-property: transform;
will-change: transform;
}
@media screen and (min-width: 48em), print {
.blockLink:where(:not(:first-child)) {
margin-top: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.blockLink:where(:not(:first-child)) {
margin-top: 6.1538461538vw;
}
}
@media screen and (min-width: 48em), print {
.blockLink + .blockLink {
margin-top: 1.1713030747vw;
}
}
@media screen and (max-width: 47.99em) {
.blockLink + .blockLink {
margin-top: 4.1025641026vw;
}
}
.blockLink:has(.blockLink__link:hover) {
transform: translate(2%, 2%);
}
.blockLink__link {
color: #000;
overflow-wrap: break-word;
text-decoration: none;
transition-duration: inherit;
transition-property: color;
}
@media screen and (min-width: 48em), print {
.blockLink__link {
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.blockLink__link {
font-size: 3.5897435897vw;
}
}
.blockLink__link:hover {
color: var(--color-accent);
}
.blockLink__link::after {
display: inline-block;
width: 1em;
height: 1em;
margin-left: 0.45em;
content: "";
background-color: var(--color-accent);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: contain;
mask-size: contain;
transform: translateY(15%);
transition-duration: var(--transition-duration-hover);
transition-property: none;
}
.blockLink:has(a[href$=".pdf"]) .blockLink__link::after {
-webkit-mask-image: var(--icon-pdf);
mask-image: var(--icon-pdf);
}
.blockLink:has(a:not([href$=".pdf"]):not([target=_blank])) .blockLink__link::after {
-webkit-mask-image: var(--icon-arrow-thin);
mask-image: var(--icon-arrow-thin);
}
.blockLink:has(a[target=_blank]:not([href$=".pdf"])) .blockLink__link::after {
-webkit-mask-image: var(--icon-window);
mask-image: var(--icon-window);
}
.news {
border-bottom: 1px solid #e4e4e4;
}
@media screen and (min-width: 48em), print {
.news {
padding-bottom: 10.2489019034vw;
margin-bottom: 10.2489019034vw;
}
}
@media screen and (max-width: 47.99em) {
.news {
padding-bottom: 15.3846153846vw;
margin-bottom: 14.358974359vw;
}
}
.news__content {
visibility: hidden;
opacity: 0;
filter: blur(5px);
will-change: filter;
}
.news--on .news__content {
visibility: visible;
opacity: 1;
filter: blur(0);
transition-duration: 1800ms;
transition-property: opacity, filter;
}
.news__buttonArea {
text-align: right;
opacity: 0;
filter: blur(5px);
will-change: filter;
}
@media screen and (min-width: 48em), print {
.news__buttonArea {
margin-top: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.news__buttonArea {
margin-top: 4.1025641026vw;
}
}
.news--on .news__buttonArea {
opacity: 1;
filter: blur(0);
transition-duration: 1800ms;
transition-property: opacity, filter;
}
.news__button {
display: inline-grid;
grid-template-columns: auto auto;
align-items: center;
margin-left: auto;
font-weight: 700;
line-height: 2;
color: var(--color-text);
transition-duration: var(--transition-duration-hover);
transition-property: color;
}
.news__button:hover {
color: var(--color-text-hover);
}
@media screen and (min-width: 48em), print {
.news__button {
-moz-column-gap: 0.878477306vw;
column-gap: 0.878477306vw;
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.news__button {
-moz-column-gap: 3.0769230769vw;
column-gap: 3.0769230769vw;
font-size: 3.5897435897vw;
}
}
.news__buttonIcon {
position: relative;
display: block;
width: 0.75em;
height: 0.85em;
margin-bottom: 0.15em;
overflow: hidden;
background-color: var(--color-accent);
-webkit-mask-image: var(--icon-arrow);
mask-image: var(--icon-arrow);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: 50% 50%;
mask-position: 50% 50%;
-webkit-mask-size: contain;
mask-size: contain;
}
.news__button:hover .news__buttonIcon {
animation: right-arrow var(--transition-duration-hover) cubic-bezier(0.65, 0, 0.35, 1) forwards;
}
@keyframes right-arrow {
0% {
opacity: 1;
translate: 0rem 0;
}
50% {
opacity: 0;
translate: 1rem 0;
}
51% {
translate: -1rem 0;
}
to {
opacity: 1;
translate: 0rem 0;
}
}
@media screen and (min-width: 48em), print {
.news .p-contentTtl {
margin-bottom: 2.9282576867vw;
}
}
@media screen and (max-width: 47.99em) {
.news .p-contentTtl {
margin-bottom: 0;
}
}
.news--on .p-contentTtl {
opacity: 1;
filter: blur(0);
transition-duration: 1800ms;
transition-property: opacity, filter;
}
@media screen and (min-width: 48em), print {
.archiveNews__content {
margin-bottom: 4.39238653vw;
}
}
@media screen and (max-width: 47.99em) {
.archiveNews__content {
margin-bottom: 15.3846153846vw;
}
}
.archiveNews__yearList {
position: relative;
display: flex;
flex-wrap: wrap;
}
@media screen and (min-width: 48em), print {
.archiveNews__yearList {
row-gap: 0.5856515373vw;
margin-bottom: 2.3426061493vw;
}
}
@media screen and (max-width: 47.99em) {
.archiveNews__yearList {
row-gap: 2.0512820513vw;
}
}
.archiveNews__yearList::before {
position: absolute;
bottom: 0;
display: block;
width: 100%;
height: 1px;
content: "";
background-color: var(--color-border);
}
.archiveNews__yearList > li {
position: relative;
}
.archiveNews__yearList > li::before {
position: absolute;
bottom: 0;
display: block;
width: 100%;
height: 1px;
content: "";
background-color: var(--color-border);
}
.archiveNews__year {
position: relative;
display: block;
font-weight: 500;
line-height: 2;
color: var(--color-sub-text);
}
@media screen and (min-width: 48em), print {
.archiveNews__year {
padding-inline: 0.5856515373vw;
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.archiveNews__year {
padding-inline: 2.0512820513vw;
font-size: 3.5897435897vw;
}
}
.archiveNews__year::before {
position: absolute;
bottom: 0;
left: 0;
display: block;
width: 0%;
height: 1px;
content: "";
background-color: var(--color-accent);
transition-duration: var(--transition-duration-hover);
transition-property: width;
}
.archiveNews__year:hover::before {
width: 100%;
}
.archiveNews__year[aria-current=true] {
color: var(--color-accent);
}
.archiveNews__year[aria-current=true]::before {
width: 100%;
}
.singleNews__title {
display: grid;
border-bottom: 1px solid var(--color-border);
}
@media screen and (min-width: 48em), print {
.singleNews__title {
row-gap: 1.1713030747vw;
padding-bottom: 2.9282576867vw;
margin-bottom: 4.39238653vw;
}
}
@media screen and (max-width: 47.99em) {
.singleNews__title {
row-gap: 2.5641025641vw;
padding-bottom: 8.2051282051vw;
margin-bottom: 12.3076923077vw;
}
}
.singleNews__title p {
font-size: 500;
line-height: 2;
color: var(--color-sub-text);
}
@media screen and (min-width: 48em), print {
.singleNews__title p {
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.singleNews__title p {
font-size: 3.5897435897vw;
}
}
.singleNews__title h1 {
font-size: 700;
line-height: 27/24;
letter-spacing: 0.05em;
}
@media screen and (min-width: 48em), print {
.singleNews__title h1 {
font-size: 1.756954612vw;
}
}
@media screen and (max-width: 47.99em) {
.singleNews__title h1 {
font-size: 6.1538461538vw;
}
}
@media screen and (min-width: 48em), print {
.singleNews__button {
width: -moz-fit-content;
width: fit-content;
margin-block: 4.39238653vw;
margin-inline: auto;
}
}
@media screen and (max-width: 47.99em) {
.singleNews__button {
width: 100%;
margin-block: 15.3846153846vw;
}
}
.singleNews__button a {
display: grid;
grid-template-columns: auto 1fr;
align-items: center;
font-weight: 700;
line-height: 2;
color: var(--color-text);
text-align: center;
border: 1px solid var(--color-border);
border-radius: 6px;
transition-duration: var(--transition-duration-hover);
transition-property: color;
}
@media screen and (min-width: 48em), print {
.singleNews__button a {
-moz-column-gap: 1.4641288433vw;
column-gap: 1.4641288433vw;
width: -moz-fit-content;
width: fit-content;
padding: 0.878477306vw 2.635431918vw 0.7320644217vw 1.756954612vw;
font-size: 1.0248901903vw;
}
}
@media screen and (max-width: 47.99em) {
.singleNews__button a {
-moz-column-gap: 6.149341142vw;
column-gap: 6.149341142vw;
padding: 3.0769230769vw 12.3076923077vw 2.5641025641vw 4.1025641026vw;
font-size: 3.5897435897vw;
}
}
.singleNews__button a:hover {
color: var(--color-text-hover);
}
.singleNews__buttonIcon {
position: relative;
display: block;
width: 0.75em;
height: 0.85em;
margin-bottom: 0.15em;
overflow: hidden;
background-color: var(--color-accent);
-webkit-mask-image: var(--icon-arrow);
mask-image: var(--icon-arrow);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: 50% 50%;
mask-position: 50% 50%;
-webkit-mask-size: contain;
mask-size: contain;
transform: scale(-1, 1);
}
.singleNews__button:hover .singleNews__buttonIcon {
animation: left-arrow var(--transition-duration-hover) cubic-bezier(0.65, 0, 0.35, 1) forwards;
}
@keyframes left-arrow {
0% {
opacity: 1;
translate: 0rem 0;
}
50% {
opacity: 0;
translate: -1rem 0;
}
51% {
translate: 1rem 0;
}
to {
opacity: 1;
translate: 0rem 0;
}
}