@charset "utf-8";
/* gendaikougei */
.indexWrap {
    width: 800px;
}
/* LEFT */
.cLeftIndex {
    float: left;
    width: 300px;
    height: 1081px;
    height: 856px;
    background-color: #7a4f4b
}
    .cLeftIndex h1 {
        text-align: center;
    }
    
    /* info */
    .indexInfo {
        margin-left: 100px;
        margin-bottom: 15px;
    }
        .indexInfo h2 {
            color: #ddd;
            font-size: 10px;
            text-align: left;
        }
        .indexInfo div a {
            display: inline-block;
            width: 92px;
            padding-top: 6px;
            padding-bottom: 5px;
            background-color: #757579;
            color: #fcfcfc;
            font-size: 12px;
            font-weight: 400;
            text-align: center;
            line-height: 12px;
            transition: .3s;
        }
            .indexInfo div a:hover {
                background-color: #dadadb;
                color: #ce2421;
            }
    
    /* menu table */
    .cLeftIndex table.menu {
        margin: 0 auto 10px;
        width: 280px;
        border-collapse: collapse;
        border-spacing: 0;
    }
        .cLeftIndex table.menu td {
            line-height: 0;
            padding-bottom: 6px;
        }
            .cLeftIndex table.menu td.wrapTd {
                text-align: center;
            }
            

    /* hot news */
    .cLeftIndex h2.hotNewsTtl{
        margin-left: 10px;
        line-height: 1;
        text-align: left;
    }
        .cLeftIndex ul.hotNews {
            width: 280px;
            margin: 0 0 20px 10px;
            padding: 0;
            text-align: left;
        }
        .cLeftIndex ul.hotNews li a {
            color: #333333;
        }
            .cLeftIndex ul.hotNews li a:hover {
                color: #cc0000;
            }
        .cLeftIndex ul.hotNews li.bl,
        .cLeftIndex ul.hotNews li.re,
        .cLeftIndex ul.hotNews li.bk {
            display: block;
            list-style-type: none;
            margin-bottom: 3px;
            padding: 5px 5px 5px 1.8em;
            background: #d9d8d8 url(../images/index/news/arr_news_blue.gif) 8px 8px no-repeat;
            line-height: 1.4;
        }
        .cLeftIndex ul.hotNews li.re {
            background: #d9d8d8 url(../images/index/news/arr_news_red.gif) 8px 8px no-repeat;
        }
        .cLeftIndex ul.hotNews li.bk {
            background: #d9d8d8 url(../images/index/news/arr_news_black.gif) 8px 8px no-repeat;
        }

    /* hot news */
    .materialAndTechniqueWrap {
        margin: 0 auto 10px;
        width: 280px;
    }
        .materialAndTechniqueWrap h2 {
            color: #ddd;
            font-size: 12px;
            text-align: left;
        }
        .materialAndTechniqueWrap ul {
            margin: 0;
            padding: 0;
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            gap: 5px;
            list-style-type: none;
        }
        .materialAndTechniqueWrap li {
            width: 100px;
            margin-bottom: 0px;
            flex-grow: 1;
        }
            .materialAndTechniqueWrap li a {
                display: block;
                width: 133px;
                padding-top: 6px;
                padding-bottom: 5px;
                background-color: #e0dfdf;
                border: 1px solid #7a4f4b;
                border-radius: 3px;
                color: #333333;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                line-height: 13px;
                transition: .3s;
            }
                .materialAndTechniqueWrap li a:hover {
                    background-color: #7a4f4b;
                    border-color: #e0dfdf;
                    color: #fff;
                }
    
/* RIGHT */
.cRightIndex {
    float:right;
    width: 500px;
}

/* INDEX WORKS */
.indexWorks {
    width: 480px;
    margin: 10px 0 50px 15px;
    padding-right: 10px;
    background: #fff;
}
    .indexWorks ul {
        margin: 0;
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 15px;
        list-style-type: none;
    }
    .indexWorks li {
        width: 210px;
        margin-bottom: 0px;
    }
        .indexWorks li img {
            vertical-align:top;
        }



/* INDEX EXHIBITION */
.indexExhibition {
    width: 480px;
    margin: 10px 0 30px 10px;
    padding-right: 10px;
    border: 1px solid #cccccc;
    background: #fff;
}
    .indexExhibition h2 {
        float: left;
        margin: 19px 20px 50px 9px;
        line-height: 0;
    }
    .indexExhibition h3 {
    margin: 20px 0 8px 0;
    }
    .indexExhibition h4 {
        margin: 0 0 10px 0;
    }
    .indexExhibition h3,
    .indexExhibition h4,
    .indexExhibition ul {
        line-height: 0;
    }
    .indexExhibition ul {
        float: right;
    }
        .indexExhibition ul li {
            list-style-type: none;
            margin-bottom: 3px;
            line-height: 0;
    }
        .indexExhibition ul li a {
            display: block;
            width: 250px;
            height: 23px;
            background: transparent url(../images/index/ex/btn.png) top left no-repeat;
            font-size: 12px;
            font-weight: bold;
            text-indent: 5px;
            line-height: 23px;
        }
            .indexExhibition ul li a:hover {
                background-position: 0 -100px;
            }

    .indexExhibition p.goToLocalList {
        margin-bottom: 20px;
        line-height: 0;
    }
    .indexExhibition p.goToEx {
        clear: both;
        margin: 0 15px 5px 15px;
        padding: 5px 0 0 0;
        border-top: 1px dashed #cccccc;
        text-align: right;
        font-size: 90%;
    }


/* FOOTER */
.footer {
    clear: both;
    width: 800px;
    margin-bottom: 20px;
    padding: 10px 0;
    border-top: 1px solid #cccccc;
}
    .footer ul {
        text-align: right;
        font-size: 80%;
    }
    .footer ul li {
        display: inline;
        margin-bottom: 10px;
        padding: 3px 10px;
        border-left: 1px solid #cccccc;
    }
    .footer p {
        margin-top: 10px;
        padding: 10px 0;
        border-top: 1px solid #cccccc;
        text-align: right;
    }
