@charset "utf-8";

:root {
    /* Base Color */
    --konami-red: #b60014;
    --konami-red-rgb: 182, 0, 20;
    
    /* General Color */
    --def-black: #000;
    --def-black-rgb: 0, 0, 0;
    --def-white: #fff;
    --def-white-rgb: 255, 255, 255;
    --primaly-impact-color: #0040ff;
    --gray-dark: #333;
    --gray-midium: #999;
    --gray-light: #ccc;
    --gray-lighter: #e9e9e9;

    /* Base Size */
    --title-font-size: 32px;
    --middle-font-size: 24px;
    --sub-font-size: 18px;
    --paragraph-font-size: 14px;
    --caption-font-size: 0.8rem;

    /* marign padding */
    --main-padding: 1.4rem;
    --harf-padding: 0.8rem;
    --quarter-padding: 0.4rem;
    --eighth-padding: 0.2rem;

    @media (prefers-color-scheme: dark) {
        :root {
            --def-black: #000;
            --def-white: #fff;
        }
      }
    @media only screen and (max-width: 768px) {
        :root {
            --caption-font-size: 1rem;
        }
    }
}

/*----------------------------------
*
* Common Style
*
----------------------------------*/
* {
    border: 0;
    transition: 0.2s all;
}
html, body {
    font-size: var(--paragraph-font-size);
    color: var(--def-black);
    background-color: var(--def-white);
}
body {
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 100%;
    min-height: 100vh;
    color: var(--def-black);
    background-color: var(--def-white);
}
main {
    position: relative;
}
a {
    text-decoration: none;
    color: var(--def-black);
}
a:hover {
    text-decoration: underline;
    color: var(--konami-red);
}
p {
    margin-bottom: var(--harf-padding);
}
em {
    font-weight: bold;
    font-style: normal;
    color: var(--konami-red);
}
figure {
    margin-bottom: calc(var(--harf-padding) * 1);
}
figcaption {
    font-size: var(--caption-font-size);
}
img {
    width: 100%;
}
hr {
    border-top: 1px solid var(--gray-lighter);
    margin: var(--main-padding) 0;
}
@media only screen and (max-width: 768px) {
    figure {
        margin-bottom: 0;
    }
}
/*----------------------------------
*
* Module Style
*
----------------------------------*/
/*====================
* Hedline
====================*/
/*---- h1 -----*/
.hl1 {
    font-size: var(--title-font-size);
    margin: 0 0 calc(var(--main-padding) * 2);
}
.hl2 {
    font-size: var(--middle-font-size);
    margin: calc(var(--main-padding) * 3) 0 var(--main-padding);
}
.hl3 {
    font-size: var(--sub-font-size);
    margin: var(--main-padding) 0 var(--harf-padding);
}
.discription-title {
    font-size: var(--paragraph-font-size);
    font-weight: bold;
    margin: var(--main-padding) 0 var(--quarter-padding);
}
.item [class^=hl] {
    margin-top: 0;
}
.discription-title:first-child {
    margin-top: 0;
}
@media only screen and (max-width: 768px) {
    .hl1 {
        font-size: calc(var(--middle-font-size) * 0.9);
        margin: 0 0 calc(var(--main-padding) * 1);
    }
    .hl2 {
        font-size: calc(var(--middle-font-size) * 0.82);
    }
}
/*====================
* Padding / Margin
====================*/
.ma-main-4 { margin: calc(var(--main-padding) * 4) !important; }
.ma-main-3 { margin: calc(var(--main-padding) * 3) !important; }
.ma-main-2 { margin: calc(var(--main-padding) * 2) !important; }
.ma-main-1 { margin: var(--main-padding) !important; }
.ma-harf { margin: var(--harf-padding) !important; }
.ma-quarter { margin: var(--quarter-padding) !important;}
.ma-none { margin: 0 !important;}

.mt-main-4 { margin-top: calc(var(--main-padding) * 4) !important; }
.mt-main-3 { margin-top: calc(var(--main-padding) * 3) !important; }
.mt-main-2 { margin-top: calc(var(--main-padding) * 2) !important; }
.mt-main-1 { margin-top: var(--main-padding) !important; }
.mt-harf { margin-top: var(--harf-padding) !important; }
.mt-quarter { margin-top: var(--quarter-padding) !important;}
.mt-none { margin-top: 0 !important;}

.mr-main-4 { margin-right: calc(var(--main-padding) * 4) !important; }
.mr-main-3 { margin-right: calc(var(--main-padding) * 3) !important; }
.mr-main-2 { margin-right: calc(var(--main-padding) * 2) !important; }
.mr-main-1 { margin-right: var(--main-padding) !important; }
.mr-harf { margin-right: var(--harf-padding) !important; }
.mr-quarter { margin-right: var(--quarter-padding) !important;}
.mr-none { margin-right: 0 !important;}

.mb-main-4 { margin-bottom: calc(var(--main-padding) * 4) !important; }
.mb-main-3 { margin-bottom: calc(var(--main-padding) * 3) !important; }
.mb-main-2 { margin-bottom: calc(var(--main-padding) * 2) !important; }
.mb-main-1 { margin-bottom: var(--main-padding) !important; }
.mb-harf { margin-bottom: var(--harf-padding) !important; }
.mb-quarter { margin-bottom: var(--quarter-padding) !important;}
.mb-none { margin-bottom: 0 !important;}

.ml-main-4 { margin-left: calc(var(--main-padding) * 4) !important; }
.ml-main-3 { margin-left: calc(var(--main-padding) * 3) !important; }
.ml-main-2 { margin-left: calc(var(--main-padding) * 2) !important; }
.ml-main-1 { margin-left: var(--main-padding) !important; }
.ml-harf { margin-left: var(--harf-padding) !important; }
.ml-quarter { margin-left: var(--quarter-padding) !important;}
.ml-none { margin-left: 0 !important;}

.pa-main-4 { padding: calc(var(--main-padding) * 4) !important; }
.pa-main-3 { padding: calc(var(--main-padding) * 3) !important; }
.pa-main-2 { padding: calc(var(--main-padding) * 2) !important; }
.pa-main-1 { padding: var(--main-padding) !important; }
.pa-harf { padding: var(--harf-padding) !important; }
.pa-quarter { padding: var(--quarter-padding) !important;}

.pt-main-4 { padding-top: calc(var(--main-padding) * 4) !important; }
.pt-main-3 { padding-top: calc(var(--main-padding) * 3) !important; }
.pt-main-2 { padding-top: calc(var(--main-padding) * 2) !important; }
.pt-main-1 { padding-top: var(--main-padding) !important; }
.pt-harf { padding-top: var(--harf-padding) !important; }
.pt-quarter { padding-top: var(--quarter-padding) !important;}

.pr-main-4 { padding-right: calc(var(--main-padding) * 4) !important; }
.pr-main-3 { padding-right: calc(var(--main-padding) * 3) !important; }
.pr-main-2 { padding-right: calc(var(--main-padding) * 2) !important; }
.pr-main-1 { padding-right: var(--main-padding) !important; }
.pr-harf { padding-right: var(--harf-padding) !important; }
.pr-quarter { padding-right: var(--quarter-padding) !important;}

.pb-main-4 { padding-bottom: calc(var(--main-padding) * 4) !important; }
.pb-main-3 { padding-bottom: calc(var(--main-padding) * 3) !important; }
.pb-main-2 { padding-bottom: calc(var(--main-padding) * 2) !important; }
.pb-main-1 { padding-bottom: var(--main-padding) !important; }
.pb-harf { padding-bottom: var(--harf-padding) !important; }
.pb-quarter { padding-bottom: var(--quarter-padding) !important;}

.pl-main-4 { padding-left: calc(var(--main-padding) * 4) !important; }
.pl-main-3 { padding-left: calc(var(--main-padding) * 3) !important; }
.pl-main-2 { padding-left: calc(var(--main-padding) * 2) !important; }
.pl-main-1 { padding-left: var(--main-padding) !important; }
.pl-harf { padding-left: var(--harf-padding) !important; }
.pl-quarter { padding-left: var(--quarter-padding) !important;}

/*====================
* width
====================*/
.wid40 { width: 40% !important; }
.wid60 { width: 60% !important; }
@media only screen and (max-width: 768px) {
    .wid60, .wid40 { width: 100% !important; }
}

/*====================
* Text
====================*/
.bk-red {
    background-color: var(--konami-red);
    padding: 0.2em 0.4em;
    color: var(--def-white);
    font-weight: bold;
}
.text-blue {
    color: var(--primaly-impact-color);
}
.ta-c {
    text-align: center;
    margin-inline: auto;
    justify-content: center;
    flex-wrap: wrap;
}
.ta-r {
    text-align: right;
    margin-left: auto;
    justify-content: end;
}
.sp-break {
    display: none;
}
.pc-break {
    display: block;
}
@media only screen and (max-width: 768px) {
    .sp-break {
        display: block;
    }
    .pc-break {
        display: none;
    }
}

/*====================
* Link
====================*/
.link {
    text-decoration: underline;
    color: var(--konami-red);
}
.link:hover {
    text-decoration: none;
    opacity: 0.6;
}
/*---- target_blank -----*/
main a[target="_blank"]:after {
    display: inline-block;
    content: url('/2026/common/images/icon_open_new.svg');
    width: calc(var(--paragraph-font-size) * 1.64);
    padding: var(--eighth-padding);
    vertical-align: top;
}
main .time-schedule a[target="_blank"]:after {
    content: "";
}
main a.button-style-01[target="_blank"]:after {
    content: url('/2026/common/images/icon_open_new.svg') !important;
}
main a.button-style-01[target="_blank"]:hover:after {
    content: url('/2026/common/images/icon_open_new_comp.svg') !important;
}
main a[href$=".pdf"]:after {
    display: inline-block;
    content: url('/2026/common/images/icon_pdf_line.svg') !important;
    width: calc(var(--paragraph-font-size) * 1.72) !important;
    padding: var(--eighth-padding);
    vertical-align: top;
}
main a[href$=".xlsx"]:after,
main a[href$=".docx"]:after {
    display: inline-block;
    content: url('/2026/common/images/icon_file.svg') !important;
    width: calc(var(--paragraph-font-size) * 1.72) !important;
    padding: var(--eighth-padding);
    vertical-align: top;
}
a.noticon:after,
.time-schedule a[href$=".pdf"]:after,
figure a:after {
    content: none !important;
}
/*====================
* List
====================*/
/*---- topic-path -----*/
.topic-path {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.topic-path > li {
    font-size: var(--caption-font-size);
}
.topic-path > li:after {
    content: ">";
    margin: 0 var(--quarter-padding);
}
.topic-path > li:last-child::after {
    content: none;
}
/*---- dl-horizon -----*/
/* 定義リストの横並び */
.dl-horizon-item {
    display: flex;
    align-items: center;
    margin: var(--quarter-padding) 0;
}
.dl-horizon-item dt {
    margin-right: var(--harf-padding);
}
.dl-horizon-item dt:after {
    content: ":";
    padding-left: var(--quarter-padding);
}
.dl-horizon-item dd {
    padding-right: var(--quarter-padding);
}
.dl-horizon-item dd:last-child:after {
    content: none;
}
/*---- ul -----*/
[class*="-list"] {
    margin-bottom: var(--main-padding);
}
[class*="table-style-0"] td [class*="-list"],
[class*="-list"] > li > [class*="-list"] {
    margin-bottom: 0;
}
.disc-list > li {
    list-style: disc;
    margin-left: calc(var(--main-padding) * 1.6);
}
.info-link-list li {
    padding: var(--harf-padding) 0;
    border-bottom: 1px solid var(--gray-lighter);
}
.info-link-list li a {
    color: var(--konami-red);
}
/*---- news-list ------*/
.news-list li {
    border-bottom: 1px solid var(--gray-lighter);
    padding: var(--harf-padding) 0;
    margin: var(--harf-padding) 0;
    display: flex;
}
.news-list li span {
    padding-right: var(--main-padding);
}

@media only screen and (max-width: 768px) {
    .news-list li {
        display: block;    
    }
    .news-list li span {
        display: block;    
    }
}
/*---- ol -----*/
.number-list > li {
    list-style: decimal;
    margin-left: calc(var(--main-padding) * 1.6);
    padding: var(--quarter-padding) 0;
}
/*====================
* Table
====================*/
/*---- table-style-0n -----*/
[class*=table-style-0] {
    width: 100%;
    border-collapse:  collapse;
    padding-top: var(--harf-padding);
    margin-bottom: var(--main-padding);
}
[class*=table-style-0] th,
[class*=table-style-0] td {
    border: 1px solid var(--gray-light);
    padding: calc(var(--harf-padding) * 1.5) var(--main-padding);
}
[class*=table-style-0] th {
    background-color: var(--gray-lighter);
    white-space: nowrap;
}
/*---- time-schedule -----*/
.time-schedule {
    table-layout: auto;
}
.time-schedule thead th {
    font-size: var(--caption-font-size);
}
.time-schedule th,
.time-schedule td {
    padding: calc(var(--quarter-padding) * 0.8);
}
.time-schedule > tbody > tr > td:first-child,
.time-schedule > tbody > tr > td:nth-child(4),
.time-schedule > tbody > tr > td:nth-child(5) {
    width: 10%;
    text-align: center;
}
.time-schedule > tbody > tr > td:nth-child(2) {
    width: 50%;
    text-align: left;
}
.time-schedule > tbody > tr > td:nth-child(3) {
    width: 20%;
    text-align: center;
}
.time-schedule > tbody img {
    width: calc(var(--paragraph-font-size) * 2.5);
    margin: 0 auto;
}
@media only screen and (max-width: 768px) {
    .table-style-01 tr {
        margin-bottom: var(--quarter-padding);
    }
    .table-style-01 th {
        white-space: wrap;
        width: 30%;
        text-align: left;
    }
    .table-style-01 th,
    .table-style-01 td {
        border: 0;
        padding: var(--harf-padding);
        display: block;
    }
    /*---- time-schedule -----*/
    .time-schedule thead th {
        white-space: nowrap;
    }
    .time-schedule > tbody {
        font-size: calc(var(--caption-font-size) * 1.2);
        white-space: nowrap;
    }
    .table-style-01 th,
    .time-schedule > tbody > tr > td:nth-child(2) {
        width: inherit;
    }
    .table-style-01 tr.table-flex {
        display: flex;
        align-items: center;
    }
    .table-style-01 tr.table-flex th {
        width: 40%;
    }
}
/*====================
* col
====================*/
[class^="col"] {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.non-align {
    align-items: inherit;
}
.jc-left {
    justify-content: left;
}
.col-row {
    flex-wrap: nowrap;
}
/*---- col2 -----*/
.col2 .item {
    width: calc( 50% - calc(var(--main-padding) * 2));
    margin: var(--main-padding);
}
.col2 .item > .col2 {
    justify-content: flex-start;
}
/*---- col3 -----*/
.col3 .item {
    width: calc( 33% - calc(var(--harf-padding) * 2));
    margin: var(--harf-padding);
}
/*---- col4 -----*/
.col4 .item {
    width: calc( 25% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}
/*---- col5 -----*/
.col5 .item {
    width: calc( 20% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}
/*---- col6 -----*/
.col6 .item {
    width: calc( 16% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}
/*---- col-comment-box -----*/
/*
* 写真：30%, コメント：70%の横並びもじゅる
*/
.col-comment-box .item.box-image {
    width: calc( 30% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}
.col-comment-box .item.box-comment {
    width: calc( 70% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}
.col2 > .col-comment-box .item.box-image,
.col2 > .col-comment-box .item.box-comment {
    width: calc( 50% - calc(var(--quarter-padding) * 2));
    margin: var(--quarter-padding);
}

/*---- col-row -----*/
/* 幅300pxのカラムが横並び */
.col-row .item {
    width: calc( 300px - calc(var(--quarter-padding) * 2));
    margin: var(--harf-padding);
}
/*---- reverse -----*/
/* 並び順を逆にする */
.reverse {
    flex-direction: row-reverse;
}
@media only screen and (max-width: 768px) {
    .col2:not(.col2.no-flex-break),
    .col3:not(.col2.no-flex-break) {
        display: block;
    }
    .col2 .item:not(.col2.no-flex-break .item),
    .col3 .item:not(.col3.no-flex-break .item) {
        width: calc(100% - var(--main-padding));
        margin: var(--main-padding) auto;
    }
    .col4 .item,
    .col5 .item {
        width: calc( 50% - calc(var(--quarter-padding) * 2));
    }
    /*---- col6 -----*/
    .col6 .item {
        width: calc( 33% - calc(var(--quarter-padding) * 2));
    }
    /*---- col-comment-box -----*/
    .col-comment-box .item.box-image {
        width: calc( 50% - calc(var(--quarter-padding) * 2));
    }
    .col-comment-box .item.box-comment {
        width: calc( 50% - calc(var(--quarter-padding) * 2));
    }
    /*---- col-comment-box -----*/
    /*
    * 縦長の画像で名前を左に表示
    * 左右50%
    */
    .col2.vertical {
        display: flex !important;
        justify-content: flex-start !important;
    }
    .col2.vertical .col-comment-box.item {
        width: calc( 50% - calc(var(--harf-padding) * 2)) !important;
        margin: var(--harf-padding) !important;
    }
    .col2.vertical .col-comment-box.item > .item {
        margin: var(--quarter-padding) !important;
    }
}
.align-right {
    justify-content: start !important;
    text-align: left;
}



/*====================
* panel
====================*/
/*---- box-line -----*/
.box-line {
    border: 1px solid var(--gray-light);
    padding: var(--main-padding);
}
.box-line [class^="hl"]:first-child {
    margin-top: 0;
}
.box-line [class*="-list"]:last-child {
    margin-bottom: 0;
}
[class^="col"].box-line {
    align-items: inherit;
    border: 0;
}
[class^="col"].box-line .item {
    border: 1px solid var(--gray-light);
    padding: var(--main-padding);
}
/*---- box-rich -----*/
.box-rich {
    box-shadow: 1px 1px 6px rgba(var(--def-black-rgb), 0.4);
    border-radius: var(--eighth-padding);
}
.box-rich .content {
    padding: var(--main-padding);
}
.box-rich .content .title {
    margin: 0 0 var(--quarter-padding);
}
.box-rich .content [class*="-list"]:last-child
.box-rich .content p:last-child {
    margin-bottom: 0;
}
.box-rich [target="_blank"]:after,
.box-rich [target*=".pdf"]:after {
    content: none;
}
.box-rich .content .box-line {
    padding: var(--harf-padding);
}


/*====================
* other
====================*/
.google-map iframe {
    width: 100%;
    height: 480px;
    border: 0;
}
.ds-non {
    display: none;
}
/*---- hr -----*/
.hr1 {
    border-bottom: 1px solid var(--gray-light);
}
/*---- btn -----*/
/* -01が標準のボタンになります。*/
[class^="button-style-"] {
    border: 1px solid var(--konami-red);
    padding: var(--quarter-padding) var(--harf-padding) ;
    text-align: center;
    font-weight: bold;
    color: var(--konami-red);
    white-space: nowrap;
}
[class^="button-style-"]:hover {
    background-color: var(--konami-red);
    color: var(--def-white);
    text-decoration: none;
}
/* -02: 背景がコナミレッドで文字が白抜き サイズが少し大きい */
.button-style-02 {
    display: block;
    width: 100%;
    background-color: var(--konami-red);
    color: var(--def-white);
    padding: var(--harf-padding) var(--main-padding);
    font-size: large;
}
.button-style-02:hover {
    opacity: 0.6;
}
.button-style-02[target="_blank"]:after {
    display: inline-block;
    content: url('/2026/common/images/icon_open_new_comp.svg');
    width: calc(var(--paragraph-font-size) * 1.64);
    padding: var(--eighth-padding);
    vertical-align: top;
}


/*---- print-button -----*/
.print-button {
    display: none;
}
#information .print-button,
.print .print-button {
    display: block;
    position: fixed;
    right: 0;
    bottom: calc(var(--paragraph-font-size) * 3);
    background-color: var(--konami-red);
    border-radius: 50%;
    padding: var(--harf-padding);
    margin: var(--main-padding);
    box-shadow: 1px 1px 5px rgba(var(--def-black-rgb), 0.4);
}
.print-button:hover,
[class^="move-button-"]:hover {
    opacity: 0.6;
}
.print-button svg {
    width: calc(var(--paragraph-font-size) * 3);
}
.print-button svg path,
[class^="move-button-"] svg path,
.pop-up-close-button svg path {
    fill: var(--def-white);
}
/*---- move-button-top -----*/
[class^="move-button-"] {
    display: block;
    position: fixed;
    right: 0;
    bottom: 0;
    background-color: var(--gray-midium);
    border-radius: 50%;
    padding: var(--quarter-padding);
    margin: var(--main-padding);
    box-shadow: 1px 1px 5px rgba(var(--def-black-rgb), 0.4);
}
[class^="move-button-"] svg {
    width: calc(var(--paragraph-font-size) * 2);
}
/*---- pop-up-close-button -----*/
.pop-up-close-button {
    display: block;
    position: absolute;
    right: calc(var(--quarter-padding) - var(--quarter-padding) * 2);
    top: calc(var(--quarter-padding) - var(--quarter-padding) * 2);
    background-color: var(--gray-dark);
    border-radius: 50%;
    padding: var(--quarter-padding);
    box-shadow: 1px 1px 5px rgba(var(--def-black-rgb), 0.4);
}
/*---- image-zoom-button -----*/
.image-zoom-button {
    position: relative;
}
.image-zoom-button:after {
    content: url('/2026/common/images/icon_zoomin.svg');
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: rgba(var(--def-black-rgb), 0.4);
    border-radius: 50%;
    padding: var(--quarter-padding);
    margin: var(--harf-padding);
    box-shadow: 1px 1px 5px rgba(var(--def-black-rgb), 0.4);
    line-height: 0;
    cursor: pointer;
}
/*---- video-container -----*/
/* Youtubeの埋め込み */
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
/*----------------------------------
*
* Section Style
* 大きなセクション単位でのスタイル
*
----------------------------------*/
/*====================
* Main
====================*/
main {
    width: calc(var(--paragraph-font-size) * 70);
    margin: calc(var(--main-padding) * 4) auto;
}
@media only screen and (max-width: 768px) {
    main {
        width: calc(100% - var(--main-padding) * 2);
        margin: var(--main-padding) auto;
    }
}
/*====================
* Section
====================*/
section {
    margin-top: calc(var(--main-padding) * 2);
}

/*====================
* Header
====================*/
header {
    display: flex;
    justify-content: space-between;
    max-height: 94px;
    position: relative;
    z-index: 1;
}
header .main_logo {
    width: 30rem;
    padding: var(--main-padding);
}
header nav .header-navi {
    display: flex;
    align-items: center;
    height: 100%;
}
header nav .header-navi .header-navi-item {
    position: relative;
    width: 100%;
    height: 100%;
    padding: var(--main-padding);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    text-align: center;
}
header nav .header-navi .header-navi-item:hover {
    background-color: rgba(var(--konami-red-rgb), 1);
}
header nav .header-navi .header-navi-item:hover a {
    text-decoration: none;
    color: #fff;
}
header nav .header-navi .header-sub-navi {
    display: none;
    position: absolute;
    top: 94px;
    left: 0;
    background-color: var(--konami-red);
}
header nav .header-navi .header-navi-item.has-sub-menu:hover .header-sub-navi {
    display: block;
}
header nav .header-navi .header-sub-navi .header-sub-navi-item {
    border: 1px solid var(--konami-red);
    padding: var(--main-padding);
    color: var(--def-white);
}
header nav .header-navi .header-sub-navi .header-sub-navi-item:hover {
    background-color: var(--def-white);
}
header nav .header-navi .header-sub-navi .header-sub-navi-item:hover a {
    color: var(--konami-red);
}
@media only screen and (max-width: 768px) {
    header {
        width: 100%;
        height: 50px;
        position: relative;
    }
    header h1 {
        width: calc(100% - 50px);
        text-align: left;
    }
    header .main_logo {
        width: 20rem;
        padding: calc(var(--main-padding) * 0.4);
    }
    header nav {
        display: block;
        background-color: var(--konami-red);
        width: 50px;
    }
    header nav::after,
    header nav::before {
        content: "";
        width: 30px;
        height: 2px;
        background-color: var(--def-white);
        position: absolute;
        top: 15px;
        right: 25px;
        transform: translateX(50%) translateY(50%);
        transition: 0.3s all;
    }
    header nav::after {
        top: 30px;
    }
    header nav.open::before {
        top: 23px;
        transform: translateX(50%) translateY(50%) rotate(45deg);
    }
    header nav.open::after {
        top: 23px;
        transform: translateX(50%) translateY(50%) rotate(-45deg);
    }
    header nav .header-navi {
        display: none;
        opacity: 0;
    }
    header nav.open .header-navi {
        display: block;
        text-align: left;
        width: 100%;
        height: initial;
        position: absolute;
        top: 50px;
        left: 0;
        padding: var(--main-padding) 0;
        background-color: var(--konami-red);
        opacity: 1;
    }
    header nav.open .header-navi .header-navi-item {
        background-color: var(--konami-red);
        position: initial;
        display: block;
        padding: var(--harf-padding) var(--main-padding);
        border-bottom: 1px solid rgba(var(--def-white-rgb), 0.4);
    }
    header nav.open .header-navi .header-navi-item a {
        color: var(--def-white);
    }
    header nav.open .header-navi .header-navi-item .header-sub-navi {
        display: block;
        position: initial;
        margin-top: var(--harf-padding);
    }
    header nav.open .header-navi .header-sub-navi .header-sub-navi-item {
        padding: var(--harf-padding) var(--main-padding);
    }
    header nav.open .header-navi .header-navi-item:active,
    header nav.open .header-navi .header-sub-navi .header-sub-navi-item:active {
        background-color: var(--def-white);
        color: var(--konami-red);
    }
    header nav.open .header-navi .header-navi-item.has-sub-menu {
        padding-right: 0;
        padding-bottom: 0;
    }
    header nav.open .header-navi .header-navi-item.has-sub-menu .header-sub-navi .header-sub-navi-item {
        background-color: rgba(var(--def-black-rgb), 0.2);
    }
}
/*====================
* Footer
====================*/
footer {
    background-color: var(--gray-light);
    padding: var(--main-padding);
}
footer nav .footer-navi {
    display: flex;
    justify-content: center;
    font-size: var(--caption-font-size);
    flex-wrap: wrap;
}
footer nav .footer-navi .footer-navi-item {
    border-right: 1px solid var(--gray-dark);
    padding-right: var(--harf-padding);
    margin-right: var(--harf-padding);
}
footer nav .footer-navi .footer-navi-item:last-child {
    border-right: 0;
    padding-right: 0;
    margin-right: 0;
}
footer .copyright {
    font-size: var(--caption-font-size);
    text-align: center;
    padding: var(--harf-padding);
}
footer .sponsorship {
    margin: var(--main-padding) auto calc(var(--main-padding) * 2);
}
/*----------------------------------
*
* Page Style
* ページ個別のスタイル
*
----------------------------------*/
/*====================
* program
====================*/
/*---- hl-button-box -----*/
.hl-button-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: calc(var(--main-padding) * 2);
    flex-wrap: wrap;
}
.hl-button-box [class^="hl"] {
    margin: 0;
}
.hl-button-box p {
    margin-bottom: 0;
}
@media only screen and (max-width: 768px) {
    .hl-button-box {
        margin-bottom: var(--harf-padding);
        display: block;
    }
    .hl-button-box [class^="hl"]  {
        margin-bottom: var(--harf-padding);
    }
}
/*---- #program .dl-horizon -----*/
.dl-horizon.program-dl {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: var(--main-padding);
    padding: var(--main-padding) 0;
    border-top: 1px solid var(--gray-light);
    border-bottom: 1px solid var(--gray-light);
}
.dl-horizon.program-dl .dl-horizon-item {
    width: calc(33% - calc(var(--main-padding) * 2));
    margin: var(--quarter-padding) var(--main-padding);
}
@media only screen and (max-width: 768px) {
    .dl-horizon.program-dl .dl-horizon-item {
        width: calc(50% - calc(var(--main-padding) * 2));
        margin: var(--quarter-padding) var(--harf-padding);
    }
    .dl-horizon-item dt,
    .dl-horizon-item dd {
        white-space: nowrap;
    }
}
/*====================
* sponsors
====================*/
/*---- sponsors-banner-list -----*/
.sponsors-banner-list {
    flex-wrap: wrap;
    justify-content: start;
}
.sponsors-banner-list .item picture img {
    border: 1px solid var(--gray-lighter);
    margin: 0 0 var(--quarter-padding);
}
.sponsors-banner-list .item figcaption {
    white-space: nowrap;
}
/*---- sponsors-list -----*/
.sponsors-list {
    justify-content: start;
}
.sponsors-list .item {
    border: 1px solid var(--gray-light);
    padding: var(--harf-padding);
    text-align: center;
}
.sponsors-list .item a {
    white-space: nowrap;
}
@media only screen and (max-width: 768px) {
    .sponsors-banner-list {
        display: block;
    }
    .sponsors-banner-list .item,
    .sponsors-list .item {
        width: calc( 100% - calc(var(--harf-padding) * 2));
    }
}
/*====================
* swimmers
====================*/
#swimmer {
    position: relative;
}
#swimmer figure {
    margin-bottom: var(--main-padding);
}
#swimmers-inner .col3 {
    justify-content: flex-start;
}
#swimmer-name rt,
#swimmers-inner .hl3 rt {
    position: relative;
	top: -.3em;
	transform: translateY(-.3em);
}
#swimmer-inner .swimmer-name-wapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--main-padding);
}
#swimmer-inner .swimmer-name-wapper .hl1 {
    width: 270px;
    margin: 0;
}
#swimmer-inner .swimmer-name-wapper .swimmer-type {
    width: 13em;
    text-align: right;
    white-space: nowrap;
}
#swimmer-inner .swimmer-name-wapper .swimmer-type span {
    background-color: var(--def-black);
    color: var(--def-white);
    padding: var(--eighth-padding) var(--harf-padding);
}

@media only screen and (max-width: 768px) {
    #swimmer-inner {
        margin-top: 0;
    }
    #swimmers-inner .col3 .item {
        width: calc( 50% - calc(var(--harf-padding) * 2));;
    }
    #swimmer-inner .swimmer-name-wapper {
        display: block;
    }
    #swimmer-inner .swimmer-name-wapper .hl1 {
        width: 100%;
        margin-bottom: var(--harf-padding);
    }
    #swimmer-inner .swimmer-name-wapper .swimmer-type {
        width: inherit;
        text-align: left;
    } 
}
/*---- popup-windw -----*/
.popup-mask {
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 9;
    background-color: rgba(var(--def-black-rgb), 0.6);
    width: 100%;
    height: 100%;
    padding: calc(var(--main-padding) * 2) calc(var(--main-padding));
    transform: translateX(-50%) translateY(-50%);
}
.popup-mask.open {
    display: flex;
}
.popup-mask .swimmer-wapper {
    position: relative;
    z-index: 9;
    height: 100%;
    padding: var(--main-padding);
}
.popup-mask .swimmer-main-content {
    background-color: var(--def-white);
    padding: var(--main-padding);
}
.popup-mask .swimmer-main-content .table-style-01 {
    width: 520px;
    max-width: 520px;
}
.popup-mask .pre-button svg path,
.popup-mask .next-button svg path {
    fill: var(--def-white);
}
@media only screen and (max-width: 768px) {
    .popup-mask .swimmer-wapper {
        height: 100%;
        padding: 0;
    }
    .popup-mask .swimmer-main-content {
        height: 100%;
        overflow-x: scroll;  
    }
    .popup-mask .swimmer-main-content .table-style-01 {
        width: 100%;
    }
    .table-style-01 colgroup {
        display: none;
    }
    .table-style-01.thed-none thead {
        display: none;
    }
}
@media only screen and (max-height: 845px) {
    .popup-mask .swimmer-main-content {
        height: 100%;
        overflow-x: scroll;  
    }
}
/*====================
* access
====================*/
#access .map-icon-infomation .item {
    display: flex;
}
#access .map-icon-infomation .item .map-icon {
    width: 20px;
    margin-right: var(--quarter-padding);
}
/*---- detail-info-img -----*/
.detail-info-img {
    position: relative;
}
.detail-info-img .img-num {
    position: absolute;
    top: -0.4em;
    left: -0.4em;
    display: block;
    font-size: var(--paragraph-font-size);
    font-weight: bold;
    text-align: center;
    line-height: 1.4em;
    color: var(--primaly-impact-color);
    width: var(--middle-font-size);
    height: var(--middle-font-size);
    border: 2px solid var(--primaly-impact-color);
    border-radius: 5em;
    background-color: var(--def-white);
}