/* ------------------------------------------------

    maxalto

--------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

:root {
    --font-family-01: "Cormorant Garamond", "Noto Serif JP", serif;
    --font-family-01-en: "Cormorant Garamond", serif;
    --font-family-01-ja: "Noto Serif JP", serif;
    --font-family-02: "Inter", "Noto Sans JP", sans-serif;
    --font-family-02-en: "Inter", sans-serif;
    --font-family-02-ja: "Noto Sans JP", sans-serif;
}
/* ------------------------------------------------
    共通 Header
--------------------------------------------------- */
.header-maxalto .main-header {
    background: #fff;
}
.header-maxalto .site-branding {
    z-index: 99999;
}
/* SP用ナビゲーション */
.header-maxalto .drawer-navigation-content {
    padding: 80px 0 40px 0;
}
.drawer-navigation ul li {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    line-height: 1.8;
    padding-bottom: 12px;
    padding-top: 12px;
}
.drawer-navigation ul li a {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    line-height: 1.8;
}
@media screen and (max-width: 1160px) {
    body > header.header-maxalto nav .menu {
        padding: 0 40px 0 50px;
    }
    body > header.header-maxalto nav .menu ul {
        margin: 80px 10px 0 10px!important;
    }
    body > header.header-maxalto nav .menu ul li {
        margin-bottom: 10px;
    }
    body > header.header-maxalto nav .menu ul li a {
        line-height: 100%;
        font-family: var(--font-family-02);
        font-size: 14px;
        font-weight: 200;
        color: #000!important;
    }
    .drawer-navigation .reserve-button {
        padding: 0 50px;
    }
    header.header-maxalto .reserve-button a {
        font-family: var(--font-family-02);
        font-size: 14px;
        font-weight: 300;
        background-color: #333;
        border-radius: 50px;
    }
    .drawer-navigation .our-brands-list {
        padding-left: 24px;
    }
}



@media screen and (min-width: 1161px) {
    .header-maxalto .site-logo img {
        width: 100%;
        max-width: 272px;
        height: auto;
    }
    .header-maxalto .main-header-content {
        height: 82px;
    }
    .header-maxalto .main-header-content .main-navigation {
        margin-left: 40px;
    }
    .header-maxalto .main-header-content .main-navigation a:hover,
    .main-navigation .about:hover {
        border-bottom: 1px solid #333 !important;
    }
    .header-maxalto .main-header-content .main-navigation ul.menu > li,
    .header-maxalto .main-header-content .main-navigation ul.menu > li a {
        color: #000;
        font-family: var(--font-family-02);
        font-size: 14px;
        font-weight: 100;
        line-height: 180%;
    }
    .header-maxalto .main-header-content .main-navigation ul.menu > li {
        padding-left: 12px;
        padding-right: 12px;
    }

    /* Aboutメニュー
    -------------------------------- */
    .header-maxalto .main-navigation ul .about-list {
        width: 100%;
        z-index: -1;
    }
    /* .header-maxalto .about-list .logo-a a:hover {
        border-bottom: none !important;
    }
    .header-maxalto .about-list .logo-a img {
        width: 150px;
        height: auto;
        margin: 80px 24px 0;
    } 
    .header-maxalto .about-list .logo-a a {
        left: 15%;
    }*/
    .header-maxalto .about-list .ul-list .url-acd {
        left:20%;
    }
    .header-maxalto .about-list .ul-list .url-list {
        text-align: left;
    }
    .header-maxalto .about-list .ul-list .url-list li {
        width: max-content;
    }
    .header-maxalto .about-list .ul-list .url-list li a {
        color: #000;
        font-family: var(--font-family-02);
        font-size: 14px;
        font-weight: 100;
        padding-bottom: 2px;
        padding-top: 2px;
    }
    .header-maxalto .about-list .ul-list .in-about {
        border-bottom: 1px solid #333 !important;
        font-family: var(--font-family-02);
        font-weight: 200;
    }
    .header-maxalto .url-rink ul .philosophy-img,
    .header-maxalto .url-rink ul .creative-direction-img,
    .header-maxalto .url-rink ul .manufacture-img,
    .header-maxalto .url-rink ul .history-img,
    .header-maxalto .url-rink ul .anniversary-img {
        position: absolute;
        left: 200%;
        top: 5%;
        display: none;
    }
    .header-maxalto .philosophy-img .url-list-img,
    .header-maxalto .creative-direction-img .url-list-img,
    .header-maxalto .manufacture-img .url-list-img,
    .header-maxalto .history-img .url-list-img,
    .header-maxalto .anniversary-img .url-list-img {
        width: 300px;
        height: 357px;
    }
    .header-maxalto .philosophy-img .url-list-img img,
    .header-maxalto .creative-direction-img .url-list-img img,
    .header-maxalto .manufacture-img .url-list-img img,
    .header-maxalto .history-img .url-list-img img,
    .header-maxalto .anniversary-img .url-list-img img {
        width: 300px;
        height: 357px;
        margin: 0;
    }
    .url-rink ul li a:hover + .philosophy-img,
    .url-rink ul li a:hover + .creative-direction-img,
    .url-rink ul li a:hover + .manufacture-img,
    .url-rink ul li a:hover + .history-img,
    .url-rink ul li a:hover + .anniversary-img {
        display: block;
    }

    /* 来店予約ボタン */
    .header-maxalto .reserve-button a {
        font-family: var(--font-family-02);
        font-size: 14px;
        font-weight: 300;
        line-height: normal;
        background-color: #333;
        color: #fff;
        border-radius: 50px;
        height: 42px;
    }
    /* Our Brands*/
    .header-maxalto .sub-header-cntent {
        background: #F0F0F0;
    }
    .header-maxalto .sub-header-cntent-inner {
        justify-content: flex-start;
        margin-left: 50px;
        margin-right: auto;
        padding: 8px 0;
    }
    .header-maxalto .sub-header-cntent-inner a {
        color: #333;
    }
    .header-maxalto .sub-header-cntent-inner .our-brands {
        display: flex;
        align-items: center;
        flex-direction: row;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li,
    .header-maxalto .sub-header-cntent-inner ul.our-brands li a {
        font-family: var(--font-family-02);
        color: #6E6E6E;
        font-size: 14px;
        font-weight: 200;
        line-height: 100%;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li {
        padding-right: 20px;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li:not(:first-child) {
        border-right: 1px solid #6E6E6E;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li:nth-child(3) {
        padding-left: 20px;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li a {
        text-decoration: underline;
    }
    .header-maxalto .sub-header-cntent-inner ul.our-brands li a:hover {
        color: #6E6E6E!important;
    }
}
@media screen and (max-width: 1160px) {
    .header-maxalto .site-logo img {
        height: auto;
        width: 140px;
        transform: unset;
        padding-top: 12px;
    }
    .header-maxalto .main-navigation .about:hover {
        border-bottom: none !important;
    }
}

/* ------------------------------------------------
    共通 Footer
--------------------------------------------------- */
.footer-maxalto {
    background-color: #000;
}
.footer-maxalto .inner .nav_area {
    width: 70%;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}
.footer-maxalto .maxalto-home {
    display: inline-block;
    width: max-content;
    height: max-content;
}
.footer-maxalto .maxalto-home img {
    max-width: 120px;
    width: 100%;
    height: auto;
}
.footer-maxalto .footer_link li a,
.footer-maxalto .footer_under_ul ul.under_ul a {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    line-height: 140%;
}
.footer-maxalto .inner p.copyright {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    line-height: 140%;
}

@media screen and (max-width: 1079px) {
    .footer-maxalto .inner .nav_area {
        width: 100%;
        justify-content: center;
        padding-top: 40px;
    }
    .footer-maxalto .maxalto-home {
        width: 80%;
        height: auto;
        text-align: center;
    }
    .footer-maxalto .maxalto-home img {
        max-width: 400px;
    }
    .footer-maxalto .footer_link li {
        margin-bottom: 24px;
    }
    .footer-maxalto .footer_link li a {
        font-size: 16px;
    }
}


/* ------------------------------------------------
    共通 layout
--------------------------------------------------- */
body.body-maxalto {
    color: #333;
    font-family: var(--font-family-02);
    font-size: 16px;
    line-height: 160%;
}
.body-maxalto .content-area {
    padding-top: 112px;
}
.main-maxalto {
}

.main-maxalto .main-visual {
    position: relative;
    overflow: hidden;
    max-width: 1280px;
    height: auto;
    padding: 0 10px;
    margin: 0 auto 80px;
}
.main-maxalto .main-visual .image {
    width: 100%;
    height: auto;
    text-align: center;
}
.main-maxalto .main-visual .image video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.main-maxalto .content {
    max-width: 1080px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 120px;
}

.main-maxalto .content .inner {
    padding-bottom: 0;
}

@media screen and (max-width: 1160px) {
    .body-maxalto .content-area {
        padding-top: 48px;
    }
}

@media screen and (max-width: 1079px) {
    body.body-maxalto article {
        background: #fff;
    }
}

@media screen and (max-width: 768px) {
    .main-maxalto .main-visual {
        margin-bottom: 40px;
    }
    .main-maxalto .content {
        padding-bottom: 90px;
    }

}


/* ------------------------------------------------
    共通 content
--------------------------------------------------- */
/* タイトル
-------------------------------- */
.main-maxalto h1 {
    font-size: 40px;
    font-weight: 700;
    line-height: 160%;
}
.main-maxalto h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 140%;
}
.main-maxalto h3 {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 600;
    line-height: 140%;
}

.main-maxalto .page-title-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin-bottom: 64px;
    gap: 4px;
}
.main-maxalto .page-title {
    font-family: var(--font-family-01);
    font-size: 32px;
    font-weight: 700;
    line-height: 140%;
}
.main-maxalto .page-title-wrapper .sub-title {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 200;
    line-height: 160%;
    margin-bottom: 0;
}

/* 本文
-------------------------------- */
.main-maxalto .content p,
.main-maxalto .content .title {
    margin-bottom: 32px;
}
.main-maxalto .content .inner > p:last-child,
.main-maxalto .content .block > p:last-child {
    margin-bottom: 0;
}

/* 画像
-------------------------------- */
.main-maxalto .content .image {
    width: 100%;
    height: auto;
    text-align: center;
    margin-bottom: 32px;
}
.main-maxalto .content .image img {
    width: 100%;
    height: auto;
}
.main-maxalto .content .image.col-2 {
    gap: 24px;
}
.main-maxalto .content .image.col-2 img {
    width: calc((100% - (24px * 1 )) / 2);
    height: auto;
}
.main-maxalto .content .image.col-3 {
    gap: 24px;
}
.main-maxalto .content .image.col-3 img {
    width: calc((100% - (24px * 2 )) / 3);
    height: auto;
}
.main-maxalto .content .block {
    margin-bottom: 64px;
}

/* スライダー
-------------------------------- */
.main-maxalto .image-slider {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}
.main-maxalto .image-slider img {
    width: 100%;
    height: auto;
    display: block;
}
.main-maxalto .image-slider .slick-prev,
.main-maxalto .image-slider .slick-next {
    z-index: 10;
}
.main-maxalto .image-slider .slick-prev:before,
.main-maxalto .image-slider .slick-next:before {
    color: #333;
}
.main-maxalto .image-slider .slick-prev {
    left: 0;
}
.main-maxalto .image-slider .slick-next {
    right: 0;
}
.main-maxalto .image-slider .slick-dots {
    bottom: 20px;
}

/* ボタン
-------------------------------- */
.main-maxalto .btn-black {
    display: block;
    background-color: #333;
    color: #fff;
    border-radius: 50px;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    text-decoration: none;
    transition: background-color 0.3s ease-in-out;
    width: 250px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.main-maxalto .btn-black:hover {
    background-color: #4d4d4d;
    color: #fff !important;
}
.main-maxalto .btn-white {
    display: block;
    background-color: #fff;
    color: #000;
    border-radius: 50px;
    border: 1px solid #4d4d4d;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    text-decoration: none;
    transition: background-color 0.3s ease-in-out;
    width: 208px;
    height: 48px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.main-maxalto .btn-white:hover {
    background-color: #fff;
    color: #000 !important;
}
.main-maxalto .btn-wrap {
    display: flex;
    margin-top: 32px;
}
.main-maxalto .btn-wrap.center {
    justify-content: center;
}
@media screen and (max-width: 768px) {
    .main-maxalto h2 {
        font-size: 24px;
    }
    .main-maxalto h3 {
        font-size: 20px;
    }
    .main-maxalto .page-title-wrapper {
        margin-bottom: 40px;
    }
    .main-maxalto .page-title-wrapper .sub-title {
        font-size: 12px;
    }
    .main-maxalto .btn-black,
    .main-maxalto .btn-white {
        font-size: 14px;
        width: 200px;
        height: 48px;
    }

    .main-maxalto .content .image.col-3 {
        gap: 8px;
    }
    .main-maxalto .content .image.col-3 img {
        width: calc((100% - (8px * 2 )) / 3);
        height: auto;
    }

}


/* ------------------------------------------------
    TOP ページ
--------------------------------------------------- */
.page-maxalto-top {
    padding-bottom: 120px;
}
.page-maxalto-top .section {
}
.page-maxalto-top .sec-title {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 500;
    line-height: 140%;
    text-align: center;
}
/* overlap-block */
.page-maxalto-top .section .overlap-block {
    position: relative;
    overflow: visible;
}
.page-maxalto-top .section .overlap-block .image {
    width: 100%;
    height: auto;
    margin-bottom: 90px;
}
.page-maxalto-top .section .overlap-block .image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.page-maxalto-top .section .overlap-block .box {
    position: absolute;
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 839px;
    width: 100%;
    opacity: 0.9;
    background: #FFF;
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.10);
}
.page-maxalto-top .section .overlap-block .box .post-content {
    text-align: center;
    padding: 24px;
}
.page-maxalto-top .section .overlap-block .box .post-content .sub {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 100;
    line-height: 140%;
    text-align: center;
    margin-bottom: 8px;
}
.page-maxalto-top .section .overlap-block .box .post-content h2.sec-title {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 500;
    line-height: 140%;
    margin-bottom: 40px;
}
.page-maxalto-top .section .overlap-block .box .post-content .btn-black {
    justify-content: center;
}
/* view all */
.page-maxalto-top .section a.view-all {
    display: block;
    font-family: var(--font-family-01);
    font-size: 18px;
    font-weight: 500;
    line-height: 140%;
    text-decoration: underline;
}

/* Main Visual
-------------------------------- */
.page-maxalto-top #main-visual {
    position: relative;
    max-width: 1920px;
    width: 100%;
    height: auto;
    overflow: visible;
    margin: 0 auto 90px;
}
.page-maxalto-top #main-visual .image {
    width: 100%;
    height: auto;
}
.page-maxalto-top #main-visual .image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.page-maxalto-top #main-visual .box {
    position: absolute;
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 839px;
    width: 100%;
    opacity: 0.9;
    background: #FFF;
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.10);
}
.page-maxalto-top #main-visual .box .post-content {
    padding: 24px;
}
.page-maxalto-top #main-visual .box .post-content h2.title {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    line-height: 140%;
    margin-bottom: 24px;
}
.page-maxalto-top #main-visual .box .post-content .btn-wrap {
    justify-content: center;
}

/* Product type リスト
-------------------------------- */
.page-maxalto-top #product-type {
    padding: 80px 0;
}
.page-maxalto-top #product-type .sec-title {
    padding: 20px 0;
    background-color: #E6E6E6;
}
.page-maxalto-top #product-type .inner {
    max-width: 1920px;
    padding: 0 24px;
}
.page-maxalto-top .product-type-slider {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding-top: 42px;
}
.page-maxalto-top .product-type-slider .slick-slide {
    margin: 0 10px;
}
.page-maxalto-top .product-type-slider .slick-list {
    margin: 0 -10px;
}
.page-maxalto-top .product-type-slider li a {
    display: inline-block;
    text-decoration: none;
}
.page-maxalto-top .product-type-slider li .image {
    width: 100%;
    height: auto;
    aspect-ratio: 300 / 200;
}
.page-maxalto-top .product-type-slider li .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.page-maxalto-top .product-type-slider li .info p.name {
    text-align: center;
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 500;
}
.page-maxalto-top .product-type-slider .slick-prev {
   left: -30px;
}
.page-maxalto-top .product-type-slider .slick-next {
   right: -30px;
}
.page-maxalto-top .product-type-slider .slick-prev:before,
.page-maxalto-top .product-type-slider .slick-next:before {
    color: #333;
}

/* STORIES
-------------------------------- */
.page-maxalto-top #stories {
    padding-top: 45px;
    background: #E6E6E6;
    margin-bottom: 80px;
}
.page-maxalto-top #stories .inner {
    max-width: 1920px;
    padding: 0 24px 80px;
}
.page-maxalto-top #stories .view-all {
    display: block;
    text-align: right;
}
.page-maxalto-top #stories .stories-list {
    padding-top: 50px;
}
.page-maxalto-top #stories .stories-list li.item {
    /* aspect-ratio: 408 / 650; */
    height: 100%;
    margin: 0 15px;
    background-color: #fff;
}
.page-maxalto-top #stories .stories-list li a {
    display: block;
    height: 100%;
    text-decoration: none;
}
.page-maxalto-top #stories .stories-list li a .image {
    aspect-ratio: 408 / 485;
    width: 100%;
    height: auto;
}
.page-maxalto-top #stories .stories-list li a .image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page-maxalto-top #stories .stories-list li a .box {
    padding: 24px;
    height: auto;
}
.page-maxalto-top #stories .stories-list li a .box .post-content {
    text-align: center;
}
.page-maxalto-top #stories .stories-list li a .box .post-content h2.title {
    font-family: var(--font-family-01-ja);
    font-size: 16px;
    font-weight: 500;
    line-height: 140%;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 24px;
}
.page-maxalto-top #stories .stories-list li a .box .post-content .description {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 200;
    line-height: 140%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.page-maxalto-top .stories-slider .slick-prev {
   left: -30px; 
}
.page-maxalto-top .stories-slider .slick-next {
   right: -30px;
}
.page-maxalto-top .stories-slider .slick-prev:before,
.page-maxalto-top .stories-slider .slick-next:before {
    color: #333;
}

/* discover-our-project
-------------------------------- */
.page-maxalto-top #discover-our-project {
}
.page-maxalto-top #discover-our-project .inner {
    max-width: 1280px;
    padding: 0 24px 80px
}

/* showroom
-------------------------------- */
.page-maxalto-top #showroom .inner {
    max-width: 1280px;
    padding: 0 24px;

}

@media screen and (max-width: 1160px) {
    .page-maxalto-top #main-visual {
        margin: 0;
    }
    .page-maxalto-top #main-visual .box {
        position: relative;
        bottom: -10px;
    }
}
@media screen and (max-width: 1079px) {
    .page-maxalto-top #discover-our-project .inner,
    .page-maxalto-top #showroom .inner {
        padding: 0 0 80px;
    }
}
@media screen and (max-width: 1024px) {
    .page-maxalto-top .product-type-slider li .image {
        /* height: 200px; */
    }
    .page-maxalto-top .product-type-slider .slick-prev {
        left: -16px;
    }
    .page-maxalto-top .product-type-slider .slick-next {
        right: -16px;
    }

    .page-maxalto-top .stories-slider .slick-prev {
        left: -16px;
    }
    .page-maxalto-top .stories-slider .slick-next {
        right: -16px;
    }

}
@media screen and (max-width: 768px) {
    .page-maxalto-top {
        padding-bottom: 90px;
    }
    .page-maxalto-top #product-type {
        padding: 40px 0;
    }
    .page-maxalto-top .product-type-slider li .info p.name {
        font-size: 20px;
    }
    .page-maxalto-top #stories {
        margin-bottom: 40px;
    }
    .page-maxalto-top #stories .inner {
        padding: 0px 6px 40px;
    }
    .page-maxalto-top #discover-our-project .inner {
        padding: 0 0 40px;
    }
    .page-maxalto-top #showroom .inner {
        padding: 0;
    }
    .page-maxalto-top .section .overlap-block .box .post-content {
        padding: 16px;
    }
    .page-maxalto-top .section .overlap-block .box .post-content .sub {
        font-size: 14px;
    }
    .page-maxalto-top .section .overlap-block .box .post-content h2.sec-title {
        font-size: 20px;
        margin-bottom: 24px;
    }
    .page-maxalto-top .section .overlap-block .box .post-content .btn-black {
        font-size: 14px;
    }
}


/* ------------------------------------------------
    About 子ページ共通
--------------------------------------------------- */
.about-child .content {
}
.about-child .page-title {
    color: #000;
    font-family: var(--font-family-01);
    font-size: 28px;
    font-weight: 500;
    line-height: 140%;
    text-align: center;
}
.about-child .page-title span {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 100;
    line-height: 140%;
    text-align: center;
    display: block;
}
.about-child .title {
    font-size: 24px;
    text-align: center;
}
.about-child .content p {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 300;
    line-height: 200%;
    text-align: center;
    margin-bottom: 28px;
}
.about-child .content i {
    font-style: italic;
}

/* creative direction ページ
-------------------------------- */
.about-child .content .creative-director-firma-img {
    display: block;
    width: 187px;
    height: 50px;
    margin: 0 auto 64px;
}
.about-child .content .creative-director-video {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    margin: 0 auto 64px;
}
.about-child .content .creative-director-video iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* manufacture ページ
-------------------------------- */
.page-manufacture.about-child h3.title {
    font-size: 20px;
    line-height: 180%;
}
.about-child .content .manufacture-video {
    width: 100%;
    height: 100%;
    aspect-ratio: 16 / 9;
    margin: 0 auto 64px;
    padding-top: 32px;
}
.about-child .content .manufacture-video iframe {
    width: 100%;
    height: 100%;
    border: none;
}
@media screen and (max-width: 768px) {
    .page-manufacture.about-child h3.title {
        font-size: 18px;
    }
}

/* history ページ
-------------------------------- */
.about-child .content span.page-title-ja {
    font-family: var(--font-family-01-ja);
    font-size: 22px;
    font-weight: 500;
    display: inline-block;
}
.about-child .content span.title-ja {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 300;
    line-height: 140%;
    text-align: center;
    display: block;
}

/* 50th anniversary ページ
-------------------------------- */
.page-50th-anniversary.about-child .content .image {
    max-width: 432px;
    margin: 0 auto 32px;
}
.page-50th-anniversary.about-child .image-slider {
    max-width: 432px;
    margin: 0 auto;
}


@media screen and (max-width: 768px) {
    .about-child .page-title {
        font-size: 24px;
    }
    .about-child .content p {
        margin-bottom: 16px;
    }
}





/* ------------------------------------------------
    stories アーカイブページ
--------------------------------------------------- */
.page-stories {
}
/* Main Visual
-------------------------------- */
.page-stories .main-visual {
    position: relative;
    overflow: visible;
    max-width: 1280px;
    height: auto;
    margin: 0 auto 80px;
}
.page-stories .main-visual .image {
    text-align: center;
    width: auto;
    height: 580px;
}
.page-stories .main-visual .image img {
    height: 100%;
    width: auto;
    object-fit: contain;
}
.page-stories .main-visual .box {
    position: absolute;
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 866px;
    width: 80%;
    opacity: .9;
    background-color: #fff;
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, .1);
    padding: 20px 36px;
}
.page-stories .box .post-content {
    text-align: center;
}
.page-stories .box .post-content h1.page-title {
    margin-bottom: 12px;
    font-size: 28px;
    line-height: 160%;
}
.page-stories .box .post-content p.description {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 300;
}

.page-stories .content {
    padding-top: 80px;
}

/* ストーリー一覧
-------------------------------- */
.block-stories-list ul.stories-list {
    display: flex;
    flex-wrap: wrap;
    gap: 42px 24px;
}
.block-stories-list ul.stories-list li {
    width: calc((100% - (24px * 3)) / 4);
    max-height: 500px;
    display: block;
    overflow: hidden;
}
.block-stories-list ul.stories-list a {
    display: inline-block;
    text-decoration: none;
    width: 100%;
    height: auto;
}
.block-stories-list ul.stories-list a .image {
    width: 100%;
    height: 100%;
    aspect-ratio: 250 / 350;
    margin-bottom: 16px;
}
.block-stories-list ul.stories-list a .image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.block-stories-list ul.stories-list a .info {
    text-align: center;
}
.block-stories-list ul.stories-list a .info p.name {
    font-family: var(--font-family-01-ja);
    font-size: 16px;
    font-weight: 600;
    line-height: 140%;
    margin-bottom: 16px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.block-stories-list ul.stories-list a .info .description p {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 200;
    line-height: 140%;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

@media screen and (max-width: 1160px) {
    .page-stories .main-visual .image {
        height: 400px;
    }
    .block-stories-list ul.stories-list li {
        width: calc((100% - (24px * 2)) / 3);
    }
    .block-stories-list ul.stories-list a .image {
        height: 300px;
        aspect-ratio: unset;
    }
}
@media screen and (max-width: 768px) {
    .page-stories .main-visual {
        margin: 0 auto;
    }
    .page-stories .main-visual .image {
        height: 200px;
    }
    .page-stories .main-visual .box {
        position: relative;
        bottom: 12px;
        width: 86%;
        padding: 20px 24px;
    }
    .page-stories .content {
        padding-top: 40px;
    }
    .page-stories .box .post-content h1.page-title {
        font-size: 24px;
    }
    .block-stories-list ul.stories-list li {
        width: 100%;
        max-height: unset;
    }
    .block-stories-list ul.stories-list a .image {
        height: auto;
    }
}

/* ------------------------------------------------
    stories シングルページ
--------------------------------------------------- */
.single .hentry.page-stories-detail {
    padding-bottom: 120px;
}
.page-stories-detail header.entry-header {
    margin: 40px 0;
}
.page-stories-detail header.entry-header .inner {
    max-width: 1280px;
    padding-bottom: 0;
}
.entry-header .img {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
}

.page-stories-detail .entry-content {
    padding-bottom: 0;
}
.page-stories-detail .entry-content .inner {
    padding: 0;
}

.page-stories-detail h1.page-title {
    font-family: var(--font-family-01);
    font-size: 28px;
    font-weight: 500;
    line-height: 130%;
    text-align: center;
}

.page-stories-detail .post-content {
    font-family: var(--font-family-02-ja);
    font-size: 16px;
    font-weight: 300;
    line-height: 200%;
}
.page-stories-detail .post-content h2 {
    font-family: var(--font-family-01-ja);
    font-size: 32px;
    font-weight: 500;
    line-height: 140%;
    margin-top: 64px;
    margin-bottom: 32px;
}
.page-stories-detail .post-content h3 {
    font-family: var(--font-family-01-ja);
    font-size: 24px;
    font-weight: 500;
    line-height: 140%;
    margin-bottom: 32px;
}
.page-stories-detail .post-content p {
    margin-bottom: 20px;
}
/* リストのスタイル設定 */
.post-content > ul {
    list-style: disc;
    margin-bottom: 32px;
    margin-left: 22px;
}
.post-content > ol {
    list-style: decimal;
    margin-bottom: 32px;
    margin-left: 18px;
}
/* リスト項目の余白設定 */
.post-content ul li,
.post-content ol li {
    margin-bottom: 16px;
}
.post-content ul li:last-child,
.post-content ol li:last-child {
    margin-bottom: 0;
}
.page-stories-detail .btn-wrap {
    justify-content: center;
    margin-top: 64px;
}

@media screen and (max-width: 1160px) {
    .page-stories-detail header.entry-header {
        margin: 20px 0;
    }
    .page-stories-detail .post-content h2 {
        font-size: 24px;
        margin-top: 48px;
        margin-bottom: 24px;
    }
    .page-stories-detail .post-content h3 {
        font-size: 20px;
        margin-bottom: 24px;
    }
    .page-stories-detail .post-content p {
        margin-bottom: 24px;
    }
    .post-content > ul {
        margin-bottom: 24px;
        margin-left: 22px;
    }
    .post-content > ol {
        margin-bottom: 24px;
        margin-left: 22px;
    }
}


/* ------------------------------------------------
    maxalto products ページ
--------------------------------------------------- */
.page-maxalto-products {
}
/* Product Type リスト
-------------------------------- */
.page-maxalto-products .block-prodect-type {
    padding-top: 80px;
}
.page-maxalto-products .block-prodect-type .inner {
    padding: 0;
    max-width: 1280px;
}
.page-maxalto-products .block-prodect-type p.block-title {
    color: #010101;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-weight: 400;
    line-height: 140%;
    letter-spacing: 1.28px;
    text-align: center;
    margin-bottom: 16px;
}
.page-maxalto-products ul.product-type-list.fa-taxi-list {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}
.page-maxalto-products ul.product-type-list.fa-taxi-list li {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 100;
    text-align: center;
}
.page-maxalto-products ul.product-type-list.fa-taxi-list li a {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid #BFBFBF;
    text-decoration: none;
}

/* Main Visual
-------------------------------- */
.page-maxalto-products .main-visual {
    position: relative;
    overflow: visible;
    max-width: 1280px;
    height: auto;
    margin: 80px auto 80px;
}
.page-maxalto-products .main-visual .image {
    text-align: center;
    width: auto;
    height: 580px;
}
.page-maxalto-products .main-visual .image img {
    height: 100%;
    width: auto;
    object-fit: contain;
}
.page-maxalto-products .main-visual .box {
    position: absolute;
    bottom: -80px;
    left: 50%;
    transform: translateX(-50%);
    max-width: 866px;
    width: 80%;
    opacity: .9;
    background-color: #fff;
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, .1);
    padding: 20px 36px;
}
.page-maxalto-products .box .post-content {
    text-align: center;
}
.page-maxalto-products .box .post-content h1.page-title {
    font-family: var(--font-family-01);
    margin-bottom: 12px;
    font-size: 28px;
    line-height: 160%;
}
.page-maxalto-products .box .post-content p.description {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 300;
}

.page-maxalto-products .content {
    padding-top: 80px;
}

/* 製品一覧
-------------------------------- */
.page-maxalto-products ul.product-list {
    display: flex;
    flex-wrap: wrap;
    gap: 80px 48px;
}
.page-maxalto-products ul.product-list li {
    width: calc((100% - (48px *2 ) )/ 3);
    height: auto;
    text-align: center;
    cursor: pointer;
}   
.page-maxalto-products ul.product-list li a {
    display: inline-block;
    text-decoration: none;
}
.page-maxalto-products ul.product-list li a img {
    width: 100%;
    height: 150px;
    object-fit: contain;
    margin-bottom: 16px;
}
.page-maxalto-products ul.product-list li a span.name {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-weight: 300;
}

@media screen and (max-width: 1160px) {  
    .page-maxalto-products .block-prodect-type {
        padding-top: 40px;
    }
    .page-maxalto-products ul.product-type-list.fa-taxi-list li {
        font-size: 12px;
    }
    .page-maxalto-products ul.product-type-list.fa-taxi-list li a {
        padding: 4px 12px;
    }

}
@media screen and (max-width: 768px) {  
    .page-maxalto-products .content {
        padding-top: 40px;
    }
    .page-maxalto-products ul.product-list {
        gap: 8px;
    }
    .page-maxalto-products ul.product-list li {
        width: calc((100% - 8px) / 2);
    }
    .page-maxalto-products ul.product-list li a span.name {
        font-size: 20px;
    }
    .page-maxalto-products ul.product-type-list.fa-taxi-list {
        gap: 8px;
    }
}

@media screen and (max-width: 425px) {
    .page-maxalto-products ul.product-list li a img {
        height: 100px;
    }
}

/* ------------------------------------------------
    maxalto products  詳細ページ
--------------------------------------------------- */
body article.products_detail section h2 {
    font-family: var(--font-family-01);
}
body article.products_detail section.products_detail .detail p.typology {
    color: #000;
    font-family: var(--font-family-01);
    font-size: 20px;
    font-weight: 500;
}
body article.products_detail section.products_detail .detail ul.local_menu li a {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 100;
    color: #000;
    border: 1px solid #BFBFBF;
}
body article.products_detail section.info .info_text>div h3 {
    font-family: var(--font-family-01);
    font-size: 28px;
    font-weight: 500;
    line-height: 140%;
}
body article.products_detail section.info .info_text>div h4 {
    font-family: var(--font-family-01);
    font-size: 20px;
    font-weight: 500;
    line-height: 140%;
}
body article.products_detail section.info .info_text>div dl.designer dt {
    font-family: var(--font-family-01);
}
body article.products_detail section.info .info_text>div dl.designer dd {
    font-family: var(--font-family-02);
    font-weight: 100;
}
body article.products_detail section.products_detail .detail p.designer {
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: 100;
    font-size: 16px;
}
body article.products_detail section.products_detail .detail dl.download dt {
    font-family: var(--font-family-01);
    font-size: 20px;
    font-weight: 500;
}
body article.products_detail section.products_detail .detail dl.download dd ul li {
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: 100;
    font-size: 16px;
}
body article.products_detail section.info .info_text>div p.year {
    font-family: var(--font-family-01);
}
body article.products_detail section.info .info_text>div p.year span {
    font-family: var(--font-family-02);
    font-weight: 100;
}
body article.products_detail section.info .info_text>div dl.tech dt {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 300;
    line-height: 140%;
}
body article.products_detail section.info .info_text>div dl.tech dd {
    font-family: var(--font-family-02);
    font-weight: 200;
}
body article.products_detail section.configurator .configurator-area-inner p {
    font-family: var(--font-family-02-ja);
    font-size: 14px;
    font-weight: 100;
    line-height: 140%;
}
body article.products_detail section.configurator .configurator-area-inner a {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 200;
    height: 40px;
    line-height: 40px;
    border-radius: 50px;
    width: 240px;
}
body article.products_detail section.info .info_text>div p.description {
    font-family: var(--font-family-02);
    font-weight: 200;
}
body article.products_detail section.info .info_text>div p.concept_link {
    font-family: var(--font-family-02);
    font-weight: 200;
}


/* ------------------------------------------------
    50th anniversary ページ
--------------------------------------------------- */
.page-50th-anniversary {
}
.page-50th-anniversary i {
    font-style: italic;
}
.page-50th-anniversary .block-catalog {
    text-align: center;
}
.page-50th-anniversary .block-catalog .image.maxalto-logo img {
    width: 215px;
    height: auto;
}
.page-50th-anniversary .block-catalog a.maxalto-catalog {
    display: inline-block;
    width: 320px;
    height: auto;
}
.page-50th-anniversary .block-catalog a.maxalto-catalog img {
    width: 100%;
    height: auto;
}
.page-50th-anniversary .block-catalog a.maxalto-catalog:hover {
    opacity: 0.8;
}

/* ------------------------------------------------
    maxalto showroom ページ
--------------------------------------------------- */
.page-maxalto-showroom {
}
.page-maxalto-showroom .showroom-list {
    padding: 80px 0 0;
}
.page-maxalto-showroom .showroom-list .inner {
    padding-bottom: 0;
}
.page-maxalto-showroom .block-showroom .info {
    gap: 48px;
    justify-content: space-between;    
}
.page-maxalto-showroom .block-showroom .info p {
    font-family: var(--font-family-02-ja);
    font-size: 16px;
    font-weight: 300;
    line-height: 160%;
}
@media screen and (max-width: 1160px) {
    .page-maxalto-products .main-visual {
        margin: 40px auto 40px;
    }
    .page-maxalto-products .main-visual .image {
        width: 100%;
        /* max-height: 400px; */
        /* height: auto; */
        height: 400px;
    }
    .page-maxalto-products .main-visual .image img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
    .page-maxalto-showroom .showroom-list {
        padding: 40px 0 0;
    }
}
@media screen and (max-width: 768px) {
    .page-maxalto-products .main-visual {
        margin: 40px auto 40px;
    }
    .page-maxalto-products .main-visual .image {
        max-height: 300px;
    }
    .page-maxalto-products .main-visual .box {
        position: relative;
        bottom: 10px;
    }
    .page-maxalto-showroom .block-showroom .info {
        gap: 24px;
        flex-direction: column;
    }
}