/* ========================================================================== */
/* caracter code settings                                                     */
/* ========================================================================== */
@charset "utf-8";

/* ========================================================================== */
/* font-family settings                                                       */
/* linked width "<link href="https://fonts.googleapis.com/c..." at each pages */
/* ========================================================================== */
* {
/*    font-family: 'M PLUS 1p', 'Roboto Mono', monospace, sans-serif !important;*/
/*    font-family: 'Amiri', monospace, sans-serif !important;*/
/*    font-family: 'Cormorant Garamond', serif;*/
    font-family: 'Nanum Myeongjo', serif;
/*    font-family: 'Quattrocento', serif;*/
/*    font-family: 'Karma', serif;*/
/*    font-family: 'Noto Serif KR', serif;*/
/*    font-family: 'Bellefair', serif;*/
/*    font-family: 'IBM Plex Serif', serif;*/
}

/* ========================================================================== */
/* br code                                                                    */
/* ========================================================================== */
.br:before {
    content: "\A";
    white-space: pre;
}

/* ========================================================================== */
/* common settings                                                            */
/* ========================================================================== */
body , html {
    margin: 0;
    padding: 0;
    height: 100%;
}

#container {
    width: 100%;
    position: relative;
    height: auto !important;
    height: 100%;
    min-height: 100%;
}

#header {
    position: fixed !important;
    position: absolute;
    top: 40px;
    width: 100%;
    height: 56px;
/*    background-color: #99aabb;*/
    background-color: #ffffff;
}

#contents1 {
    position: fixed !important;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 40px;
/*    background-color: #778899;*/
    background-color: #ffffff; /*8090a0;*/
}

@media screen and (max-width: 800px)
{
#contentsPart
{
    padding-top: 32px;
    padding-bottom: 32px;
    padding-left: 8px;
/*    background-color: #f8f8f0;*/
    background-color: #ffffff;
}
}
@media screen and (min-width: 801px)
{
#contentsPart {
    padding-top: 32px;
    padding-bottom: 32px;
    background-color: #ffffff;
}
}

#footer {
    position: fixed !important;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 32px;
    background-color: #ffffff;
}

/* ========================================================================== */
/* header settings                                                            */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/* ========================================================================== */
.headerTable {
    border-collapse: collapse;
    width: 100%;
    height: 100%;
}
.headerTable th {
    text-align: center;
    vertical-align: middle;
    font-weight: normal;
}
.headerTable th.Submenu {
    text-align: center;
    vertical-align: bottom;
    font-weight: normal;
}

.headerFont {
    font-size: 22pt;
}

.headerFont_j {
    font-family: 'Shippori Mincho', serif;;
    font-size: 22pt;
}

.headerLink {
    text-decoration: none;
    color: #000000;
}

/* ========================================================================== */
/* menu settings                                                              */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/* ========================================================================== */
.menuTable {
    width: 100%;
    height: 100%;
    table-layout: fixed;
}
.menuTable td {
    text-align: center;
    font-weight: normal;
}
.menuTable td.subMenu {
    text-align: center;
    vertical-align: middle;
    font-weight: normal;
}
.menuTable td.menuTopBL {
    width: 34%;
}
.menuTable td.menuTopBR {
    width: 34%;
    text-align: center;
    vertical-align: top;
}
.menuTable td.menuTopLL {
    width: 8%;
    text-align: center;
    vertical-align: top;
}
.menuTable td.menuTopCL {
    width: 8%;
    text-align: center;
    vertical-align: top;
}
.menuTable td.menuTopCR {
    width: 8%;
    text-align: center;
    vertical-align: top;
}
.menuTable td.menuTopRR {
    width: 8%;
    text-align: center;
    vertical-align: top;
}
.menuFont {
    font-size: 10pt;
    color: #000000;
}
.langFont {
    font-size: 8pt;
    color: #404040;
}

.menuLink {
    text-decoration: none;
    color: #000000; /*2f2f2f;*/
}
.menuLink:hover {
    text-decoration: none;
    color: #0000ef;
}
.menuLink_j {
    font-family: 'Shippori Mincho', serif;;
    text-decoration: none;
    color: #000000; /*2f2f2f;*/
}
.menuLink_j:hover {
    font-family: 'Shippori Mincho', serif;;
    text-decoration: none;
    color: #0000ef;
}

/* ========================================================================== */
/* height addjustment                                                         */
/* ========================================================================== */
.adjustHeightTable {
    width: 100%;
    height: 100%;
    table-layout: fixed;
    height: 92px;
}

/* ========================================================================== */
/* table tag common settings                                                  */
/*  (1) Top/Middle/Bottom Left/Right                                          */
/* ========================================================================== */
.indexTable {
    width: 100%;
    height: 100%;
}
.indexTable td.TopLeft {
    min-width: 32px;
}
.indexTable td.TopRight {
    min-width: 32px;
}
.indexTable td.MiddleLeft {
    min-width: 32px;
}
.indexTable td.MiddleRight {
    min-width: 32px;
}
.indexTable td.topMiddleLeft {
    min-width: 32px;
}
.indexTable td.topMiddleRight {
    min-width: 32px;
}
.indexTable td.BottomLeft {
    min-width: 32px;
}
.indexTable td.BottomRight {
    min-width: 32px;
}

/* ========================================================================== */
/* index page settings                                                        */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/*  (4) image                                                                 */
/* ========================================================================== */
.indexTable td {
    text-align: center;
    vertical-align: top;
    font-weight: normal;
}
.indexTable td.indexTopCenter {
    text-align: left;
    text-align: justify;
    width: 480px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 12px;
}
.indexTable td.indexMiddleCenter {
    text-align: right;
    width: 480px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 24px;
}
.indexTable td.topMiddleCenter {
    text-align: center;
    width: 480px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 24px;
}
.indexTable td.indexMiddleCenter_new {
    text-align: right;
    width: 1024px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 24px;
}
.indexTable td.indexBottomCenter {
    width: 480px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 32px;
}
.indexTable td.indexTopCenter_Narrow {
    text-align: left;
    text-align: justify;
    width: 256px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 12px;
}
.indexTable td.indexMiddleCenter_Narrow {
    text-align: right;
    width: 256px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 24px;
}
.indexTable td.indexBottomCenter_Narrow {
    width: 256px;
    min-width: 256px;
    padding-top: 8px;
    padding-bottom: 32px;
}
.indexTable td.indexTopCenter_caption1 {
    text-align: left;
    text-align: justify;
    width: 480px;
    min-width: 256px;
    padding-top: 4px;
    padding-bottom: 4px;
}
.indexTable td.indexTopCenter_caption2 {
    text-align: left;
    text-align: justify;
    width: 480px;
    min-width: 256px;
    padding-bottom: 24px;
}
.indexTable td.indexTopCenter_caption3 {
    text-align: center;
    width: 480px;
    min-width: 256px;
    padding-bottom: 24px;
}

.indexFontTop {
    font-weight: 300;
/*    font-size: 12pt;*/
    font-size: 11pt;
    color: #040404;
}
.indexFontSmall {
    font-weight: 300;
    font-size: 11pt;
    color: #040404;
}

.indexFontTop_j {
    line-height: 24px;
    font-family: 'Shippori Mincho', serif;;
    font-weight: 300;
/*    font-size: 11pt;*/
    font-size: 10pt;
    color: #040404;
}
.indexFontSmall_j {
    line-height: 24px;
    font-family: 'Shippori Mincho', serif;;
    font-weight: 300;
    font-size: 10pt;
    color: #040404;
}

.indexFontLargeI {
    font-weight: 300;
    font-size: 14pt;
    color: #040404;
    font-style: italic;
}
.indexFontSmallI {
    font-weight: 300;
    font-size: 11pt;
    color: #202020;
    font-style: italic;
}

img.indexConceptImage {
    display: block;
}
.indexBlockcenter {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 640px;
    border: 1px #c0c0c0 solid;
}
.indexBlockcenter_new {
    margin-top: 128px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 512px;
}
.indexBlockleft {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 120px;
    border: 1px #e0e0e0 solid;
}

/* ========================================================================== */
/* cray work / art work / dialogue monologue page settings                    */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/* ========================================================================== */
.indexTable td.contentTopCenter {
    text-align: left;
    text-align: justify;
    padding-top: 8px;
    padding-bottom: 12px;
    width: 360px;
    max-width: 256px;
    min-width: 256px;
}
.indexTable td.contentMiddleCenter {
    text-align: center;
    padding-top: 16px;
    padding-bottom: 4px;
    width: 360px;
    min-width: 256px;
}
.indexTable td.contentBottomCenter {
    text-align: center;
    padding-top: 4px;
    padding-bottom: 16px;
    width: 360px;
    min-width: 256px;
    background-color: #ffffff;
}
.indexTable td.contentMiddleCenterCopyright {
    text-align: center;
    padding-top: 16px;
    padding-bottom: 0px;
    width: 360px;
    min-width: 256px;
}
.indexTable td.contentBottomCenterCopyright {
    text-align: right;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 360px;
    min-width: 256px;
    background-color: #ffffff;
}
.indexTable td.contentTopCenter_Concept {
    text-align: center;
    padding-top: 40px;
    padding-bottom: 0px;
    width: 360px;
    max-width: 256px;
    min-width: 256px;
}
.indexTable td.contentTopCenter_Sub {
    text-align: left;
    padding-top: 16px;
    padding-bottom: 0px;
    width: 360px;
    max-width: 256px;
    min-width: 256px;
}
.indexTable td.contentTopCenter_Sub_Art {
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 360px;
    max-width: 256px;
    min-width: 256px;
}

.contentFontLargeI {
    font-weight: 300;
    font-size: 14pt;
    color: #040404;
    font-style: italic;
}
.contentFontLargeILC {
    font-weight: 300;
    font-size: 14pt;
    color: #e0e0e0;
    font-style: italic;
}
.contentFontMiddle {
    font-weight: 300;
    font-size: 12pt;
    color: #040404;
    font-style: italic;
}
.contentFontSmall {
    font-weight: 300;
    font-size: 10pt;
    color: #040404;
}
.contentFontSmallest {
    font-weight: 300;
    font-size: 8pt;
    color: #040404;
}
.contentCaptionFontI {
    font-weight: 300;
    font-size: 9pt;
    color: #606060;
    font-style: italic;
}
.copyrightFont {
    font-weight: 300;
    font-size: 8pt;
    color: #606060;
    font-style: italic;
}
.copyrightFont_j {
    font-family: 'Shippori Mincho', serif;;
    font-weight: 300;
    font-size: 8pt;
    color: #606060;
    font-style: italic;
}

.contentFontLargeILink {
    font-weight: 300;
    text-decoration: none;
    font-size: 14pt;
    color: #e0e0e0;
    font-style: italic;
}
.contentFontLargeILink:hover {
    text-decoration: none;
    color: #0000ef;
}

img.contentImage {
    border: 1px #c0c0c0 solid;
    max-width: 512px;
    min-width: 256px;
}

div .class_jumpto_dest {
 position: relative;
 visibility: hidden;
 top: -142px;
}

/* ========================================================================== */
/* biography / media page settings                                            */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/* ========================================================================== */
.indexTable td.informationListTopCenter {
    text-align: left;
    padding-top: 8px;
    padding-bottom: 12px;
    width: 480px;
    min-width: 256px;
}
.indexTable td.informationListTopCenter_Gray {
    background-color: #f4f4f4;
/*    background-color: #f0f0ff;*/
    text-align: left;
    padding-top: 8px;
    padding-bottom: 12px;
    width: 480px;
    min-width: 256px;
/*    border: 1px #c0c0c0 solid;*/
}
.indexTable td.informationListMiddleCenter {
    text-align: left;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 480px;
    min-width: 256px;
}
.indexTable td.informationListMiddleCenter_Gray {
    background-color: #f4f4f4;
/*    background-color: #f0f0ff;*/
    text-align: left;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 480px;
    min-width: 256px;
/*    border: 1px #c0c0c0 solid;*/
}
.indexTable td.informationListMiddleCenter_Spacer
 {
    text-align: left;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 480px;
    height: 16px;
    min-width: 256px;
}

.indexTable td.informationListTopCenter2L {
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 120px;
    min-width: 64px;
}
.indexTable td.informationListTopCenter_Gray2L {
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 120px;
    min-width: 64px;
}
.indexTable td.informationListTopCenter2R {
    text-align: left;
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 8px;
    padding-bottom: 12px;
    width: 336px;
    min-width: 192px;
}
.indexTable td.informationListTopCenter_Gray2R {
/*    background-color: #f4f4f4;*/
    text-align: left;
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 8px;
    padding-bottom: 12px;
    width: 336px;
    min-width: 192px;
}
.indexTable td.informationListMiddleCenter2L {
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 120px;
    min-width: 64px;
}
.indexTable td.informationListMiddleCenter_Gray2L {
    text-align: left;
    padding-top: 0px;
    padding-bottom: 0px;
    width: 120px;
    min-width: 64px;
}
.indexTable td.informationListMiddleCenter2R {
    text-align: left;
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 336px;
    min-width: 192px;
}
.indexTable td.informationListMiddleCenter_Gray2R {
/*    background-color: #f4f4f4;*/
    text-align: left;
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 8px;
    padding-bottom: 8px;
    width: 336px;
    min-width: 192px;
}

.informationListFontLarge2 {
    font-size: 12pt;
    color:#000000;
}
.informationListFontLarge {
    font-size: 12pt;
    color:#040404;
    font-style: italic;
}
.informationListFontSmall {
    font-size: 9pt;
    color:#040404;
}
.informationListFontSmallI {
    font-size: 9pt;
    color:#040404;
    font-style: italic;
}
.informationListPlaceFont {
    font-size: 9pt;
    color:#606060;
}
.informationListFontLarge2_j {
    font-family: 'Shippori Mincho', serif;;
    font-size: 12pt;
    color:#000000;
}
.informationListFontLarge_j {
    font-family: 'Shippori Mincho', serif;;
    font-size: 12pt;
    color:#040404;
    font-style: italic;
}
.informationListFontSmall_j {
    line-height: 24px;
    font-family: 'Shippori Mincho', serif;;
    font-size: 9pt;
    color:#040404;
}
.informationListFontSmallI_j {
    font-family: 'Shippori Mincho', serif;;
    font-size: 9pt;
    color:#040404;
    font-style: italic;
}
.informationListPlaceFont_j {
    font-family: 'Shippori Mincho', serif;;
    font-size: 8pt;
    color:#606060;
}

.informationListLink {
    text-decoration: none;
    color: #202020;
}
.informationListLink:hover {
    text-decoration: none;
    color: #0000ef;
}

.informationListLink_j {
    font-family: 'Shippori Mincho', serif;;
    text-decoration: none;
    color: #202020;
}
.informationListLink_j:hover {
    font-family: 'Shippori Mincho', serif;;
    text-decoration: none;
    color: #0000ef;
}

/* ========================================================================== */
/* contact page settigns                                                      */
/*  (1) table                                                                 */
/*  (2) font                                                                  */
/*  (3) link                                                                  */
/*  (4) image                                                                 */
/* ========================================================================== */
.indexTable td.contactTopCenter {
    text-align: center;
    vertical-align: middle;
    padding-top: 0px;
    padding-bottom: 0px;
    height: 144px;
    width: 144px;
    min-width: 144px;
    background-color: #ffffff;
/*    border: 1px #808080 solid;*/
/*    box-sizing: border-box;*/
}
.indexTable td.contactMiddleCenter {
    text-align: center;
    vertical-align: middle;
    padding-top: 0px;
    padding-bottom: 0px;
    height: 128px;
    width: 128px;
    min-width: 128px;
/*    border-style: none;*/
    border: 1px #ffffff solid;
    background-color: #ffffff;
}
.indexTable td.contactBottomCenter {
    text-align: left;
    height: 144px;
    width: 144px;
    min-width: 144px;
    background-color: #ffffff;
    padding-top: 32px;
/*    border: 1px #808080 solid;*/
/*    box-sizing: border-box;*/
}

.contactFontLargeI {
    font-weight: 300;
    font-size: 14pt;
    color: #040404;
}
.contactFontSmallI {
    font-weight: 300;
    font-size: 9pt;
    color: #040404;
    font-style: italic;
}
.topFontSmallI {
    text-align: center;
    font-weight: 300;
    font-size: 9pt;
    color: #040404;
    font-style: italic;
}

.contactLink {
    text-decoration: none;
    color: #040404;
}
.contactLink:hover {
    text-decoration: none;
    color: #0000ef;
}

img.contactImage {
    display: block;
    border: 1px #808080 solid;
}
.contactBlockcenter {
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    width: 100%;
    max-width: 128px;
}
.contactBlocksns {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 128px;
}




/**************************************************************/
/*humberger menu(ボタン)の表示                                */
/**************************************************************/
@media screen and (max-width: 800px)
{
    .menu-btn
    {
        position: fixed;
        top: 10px;
        right: 10px;
        display: flex;
        height: 60px;
        width: 60px;
        justify-content: center;
        align-items: center;
        z-index: 90;
        background-color: #ffffff;
    }
    .menu-btn span,
    .menu-btn span:before,
    .menu-btn span:after
    {
        content: '';
        display: block;
        height: 3px;
        width: 25px;
        border-radius: 3px;
        background-color: #cfcfcf;
        position: absolute;
    }
    .menu-btn span:before
    {
        bottom: 8px;
    }
    .menu-btn span:after
    {
        top: 8px;
    }
    #menu-btn-check:checked ~ .menu-btn span
    {
        background-color: rgba(255, 255, 255, 0);
    }
    #menu-btn-check:checked ~ .menu-btn span::before
    {
        bottom: 0;
        transform: rotate(45deg);
    }
    #menu-btn-check:checked ~ .menu-btn span::after
    {
        top: 0;
        transform: rotate(-45deg);
    }
    #menu-btn-check
    {
        display: none;
    }

/**************************************************************/
/*humberger menuの(メニュー)表示                              */
/**************************************************************/
    .menu-content
    {
        width: 100%;
        height: 242px; /* 1メニュー辺りの高さ×メニュー数(5)＋パディング×2(上下) */
        position: fixed;
        top: 70px;
        left: 100%;
        z-index: 80;
        background-color: #f8f8f8;
        transition: all 0.5s;
        opacity: 0.85;
    }
    .menu-content ul
    {
        height: 240px; /* 1メニュー辺りの高さ×メニュー数(5) */
        padding: 16px;
    }
    .menu-content ul li
    {
        width: 480px;
        height: 40px; /* 1メニュー辺りの高さ */
        list-style: none;
    }
    #menu-btn-check:checked ~ .menu-content
    {
        left: 0;
    }

    .menuTable
    {
        display: none;
    }
}

/* 480px以上はハンバーガーボタン非表示、ヘッダー固定 */
@media screen and (min-width: 801px)
{
    #menu-btn-check
    {
        display: none;
    }
    .menu-btn
    {
        display: none;
    }
    .menu-content
    {
        display: none;
    }

    .menubar
    {
        top: 0px;
        position: fixed;
        border-collapse: collapse;
        background-color: #ffffff;
    }
    .menubar th
    {
        padding: 32px;
        padding-bottom: 0px;
        text-align: left;
        vertical-align: bottom;
        font-weight: normal;
    }
}

.menuTable2
{
    width: 100%;
    height: 100%;
    table-layout: fixed;
    opacity: 0.5;
}
#contents2 {
    position: fixed !important;
    position: absolute;
    top: 96px;
    width: 100%;
    height: 8px;
    background-color: #ffffff;
    opacity: 0.9;
}
#contents3 {
    position: fixed !important;
    position: absolute;
    top: 104px;
    width: 100%;
    height: 8px;
    background-color: #ffffff;
    opacity: 0.7;
}
#contents4 {
    position: fixed !important;
    position: absolute;
    top: 112px;
    width: 100%;
    height: 8px;
    background-color: #ffffff;
    opacity: 0.3;
}
#contents5 {
    position: fixed !important;
    position: absolute;
    top: 120px;
    width: 100%;
    height: 8px;
    background-color: #ffffff;
    opacity: 0.1;
}