@charset "utf-8";

body {
    color: #333333;
    -webkit-text-size-adjust: 100%;
}
*{
    box-sizing: border-box;
}

/* 全画面：ヘッダ */
#header {
    min-width: 950px;
    margin-right: 0;
    margin-left: 0;
    padding-top: 5px;
    margin-bottom: 24px;
    box-shadow: 0 24px 0 0 rgb(0, 133, 173);
}

/* 全画面：ロゴ */
#header .inner img {
    visibility: hidden;
}
#header img.ci {
    position: relative;
    top: 10px;
    left: 35px;
    height: 45px;
}

/* 全画面：グローバルナビ非表示 */
.globalNavi {
    display: none !important;
}

/* 全画面：サブナビテキスト */
#header .inner .utility ul.subNavi li {
    font-size: 16px;
    font-weight: 600;
    color: black;
    background-image: none;
}
#header .inner .utility ul.subNavi a {
    text-decoration: none;
}
#header .inner .utility {
    height: 24px;
}
#header .inner .utility ul.subNavi {
    padding-top: 15px;
    padding-right: 15px;
}

/* 全画面：フッタ */
#footer {
    width: 100%;
    min-width: 950px;
    margin-right: 0;
    margin-left: 0;
    padding: 20px 0;
    background-color: rgb(26, 42, 49);
}
#footer p.copyright {
    visibility: hidden;
    color: #ffffff;
    font-size: 12px;
}

/* 全画面：本体 */
#main, #contents, #sidemenu, .catalogMyBinder {
    padding-top: 10px;
}
#contents:has(#sidemenu) {
    padding-bottom: 50px;
}
#sidemenu, #main {
    padding-left: 20px;
}

/* 全画面：パンくずリストのカタログ情報タイトル名・カテゴリ名・カタログ名非表示 */
ol.breadcrumbs li.breadcrumbsCataloginfoTitle,
ol.breadcrumbs li.breadcrumbsVolumeName,
ol.breadcrumbs li.breadcrumbsCatalogName {
    display: none !important;
}
.breadcrumbs a {
    color: #333333;
}

/* 全画面：大見出し */
#lead h1, .catalogMyBinder #lead h1, .catalogDownload #lead h1, .catalogSearchCategoryList .section h2 {
    background-color: #7a7a7a;
    padding: 14px 24px;
    font-size: 24px;
    font-weight: 600;
    color: #ffffff;
}

/* 全画面：内容 */
.viewBlock {
    padding: 0;
    background-color: transparent;
}
.viewBlock.half {
    padding: 0;
}
.viewBlock.half .heightfix {
    display: flex;
    flex-wrap: wrap;
    row-gap: 0px;
    column-gap: 0px;
}
.viewBlock li.article ul.spec li {
    font-size: 12px;
    margin-bottom: 0;
}
.viewBlock li.article .description .function {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 全画面：各種ボタンカスタマイズ */
.function .c-btn {
    background-color: #7a7a7a;
    font-size: 12px;
    font-weight: 600;
    color: #ffffff;
    padding: 8px 20px;
    display: inline-block;
    text-decoration: none;
    position: relative;
    width: 150px;
}
.function .c-btn span.size {
    position: absolute;
    top: 110%;
    left: 0;
    width: 100%;
    color: #333333;
    text-align: left;
    font-weight: 400;
}
.function .c-btn:hover {
    opacity: 0.7;
}
.function p.btn.cv.catalog.catalogview_mini_text, .function p.btn.cv.catalog.catalogview_middle_text {
    background-image: none; 
    text-indent: 0;
    width: 150px;
    height: 35.6px;
}
.function span#download_1 {
    background-image: none;
    text-align: left;
    width: 150px; 
    height: 35.6px;
}

.catalogMyBinder div.stock div.submitBlock div.submit .btn {
    background-color: #7a7a7a;
    position: relative;
    padding: 8px 16px;
    background-image: none;
    height: 33px;
}
.catalogMyBinder div.stock div.submitBlock div.submit .btn:hover {
    opacity: 0.7;
}
.catalogMyBinder div.stock div.submitBlock div.submit .btn:after {
    content: "結合してダウンロード";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    color: #ffffff;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    display: inline-block;    
}

.detail .function {
    display: flex;
    gap: 20px;
    width: 100%;
    position: relative;
    top: 20px;
}
.detail .function .c-btn {
    font-size: 14px;
    text-align: left;
    min-width: 180px;
}
.detail .function span.pdfCatalogFileSize {
    display: block;
    position: relative;
    top: 5px;
    left: 10px;
}

/* 全画面：サイドメニュー */
div.side div.section {
    background: #F6F6F6;
    position: relative;
    margin-bottom: 40px;
}
div.side div.section h2 {
    padding: 12px 13px 0;
}
div.side div.section h2 span {
    padding-bottom: 40px;
    box-sizing: border-box;
}
div.side div.section h2:after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 20px solid #CCCCCC;
    border-right: 20px solid transparent;
    top: 0;
    left: 0;
    visibility: inherit;

}
div.side div.section h2, div.side div.section div.inner {
    background: none;
    position: relative;
}

/* 全画面：キーワード検索デザインスタマイズ */
div.section#keywordSearchSideCatalog {
    background: #ffffff;
    width: 100%;
    margin-bottom: 20px;
    padding: 0; 
    height: auto;
}
div.section#keywordSearchSideCatalog .searchTitle {
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    font-weight: 600;
    margin-bottom: 8px;
    padding-left: 20px;
    background: url(../images/ico-search.png) no-repeat 0 50%;
}

.keywordSearch input.keyword {
    background: #ffffff;
    height: 33px;
    /* width: 217px; */
    padding: 5px 10px;
    box-sizing: border-box;
}
.btn.matte.search {
    background: #eeeeee;
    color: #666666;
    text-indent: 0;
    font-weight: bold;
    width: 57px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 2px rgba(0,0,0, 0.2);
    border-radius: 2px;
}

#keywordSearchSideCatalog .scope {
    margin: 10px 0;
}
#keywordSearchSideCatalog .scope img {
    height: 12px;
}
.keywordSearch ul.scope li {
    margin-right: 10px;
}

/* 全画面：カテゴリツリーカスタマイズ */
.sideCategory {
    background: #ffffff;
    border: solid 1px #EEEEEE;
}
.sideCategory .searchTitle {
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    background-color: #F2F2F2;
    padding: 9px;
}
.sideCategory .inner .treeview li span {
    padding: 8px;
    font-size: 12px;
    position: relative;
    padding-left: 45px;
    cursor: pointer;
    display: block;
}
.sideCategory .inner .treeview span.active {
    background-color: #7a7a7a;
    color: #ffffff;
    font-weight: 600;
}
.sideCategory .inner .treeview  span.active:after, 
.sideCategory .inner .treeview  span.active:before {
    border-color: #ffffff;
}
.sideCategory .inner .treeview span:after,
.sideCategory .inner .treeview span:before {
    content: "";
    position: absolute;
    left: 25px;
    top: 0;
    bottom: 3px;
    margin: auto 0;
    display: block;
    width: 5px;
    height: 5px;
    border-left: 2px solid #333333;
    border-bottom: 2px solid #333333;
    transform: rotate(-135deg);
}
.sideCategory .inner .treeview span.active:after,
.sideCategory .inner .treeview span.active:before {
    transform: rotate(-45deg);
}
.sideCategory .inner .treeview li a {
    font-size: 12px;
    text-decoration: none;
    color: #333333;
    display: block;
    padding: 8px 0;
}
.sideCategory .inner .treeview li a:hover {
    opacity: 0.6;
}
.sideCategory .inner .treeview li ul li {
    padding-left: 45px;
}
.sideCategory .inner .treeview > li > a {
    padding-left: 22.5px;
}

/* カタログ一覧画面(トップページ・カテゴリ指定) */
#lead ul.localNavi {
    display: none;
}

.catalogSearchCategoryList #lead h1 {
    display: none !important;
}
.catalogSearchCategoryList .section h2 span {
    border-bottom: none !important;
    height: 24px;
    line-height: 24px;
}

.catalogSearchResult #lead {
    margin-bottom: 1px;
}

.catalogSearchCategoryList .viewBlock.half li.article,
.catalogSearchResult .viewBlock.half li.article {
    margin: 0;
    background-image: none;
    padding-bottom: 0;
}
.catalogSearchCategoryList .viewBlock.half li.article div.wrapper,
.catalogSearchResult .viewBlock.half li.article div.wrapper {
    background-image: none;
 }
.catalogSearchCategoryList .viewBlock.half li.article .name,
.catalogSearchResult .viewBlock.half li.article .name {
    background-image: none;
    font-size: 16px;
    padding: 14px 14px 0;
    height: 58.78px;
}
.catalogSearchCategoryList .viewBlock.half li.article .name a,
.catalogSearchResult .viewBlock.half li.article .name a {
    color: #333333;
    pointer-events: none;
}
.catalogSearchCategoryList .viewBlock.half li.article div.inner, 
.catalogSearchResult .viewBlock.half li.article div.inner {
    display: flex;
    padding: 14px;
    min-height:  150px; 
    position: relative;
}
.catalogSearchCategoryList .viewBlock.half li.article div.image,
.catalogSearchResult .viewBlock.half li.article div.image {
    margin-right: 14px;
}
.catalogSearchCategoryList .viewBlock.half li.article div.description,
.catalogSearchResult .viewBlock.half li.article div.description {
    display: flex;
    flex-direction: column;
    position: absolute;
    left: 130px;
    width: 180px;
}
.catalogSearchCategoryList .viewBlock.half li.article div.description div.comment,
.catalogSearchResult .viewBlock.half li.article div.comment {
    display: none;
}
.catalogSearchCategoryList .viewBlock.half li.article div.description ul.spec li:last-child,
.catalogSearchResult .viewBlock.half li.article div.description ul.spec li:last-child {
    visibility: hidden;
}
.catalogSearchCategoryList .viewBlock.half li.article div.description div.function,
.catalogSearchResult .viewBlock.half li.article div.function {
    position: absolute;
    top: 50px;
}

/* マイバインダー画面 */
.catalogMyBinder #lead img {
    display: none;
}
.catalogMyBinder #lead p.lead.mybinder {
    margin-top: 20px;
}
.catalogMyBinder li.article.mybinder span.image,
.catalogMyBinder li.article.mybinder span.image img {
    max-width: 82px;
}
.catalogMyBinder li.article.mybinder ul.spec li.volume {
    display: none;
}
.viewInline li.mybinder {
    margin: 0 7px;
}

/* キーワード検索画面 */
.viewBlock.half.catalogPage li.article div.image ol.pages {
    width: 243px;
}
.catalogPageGroupSearchResult .viewBlock.half li.article {
    width: calc(50% - 20px);
    background-image: none;
    border: 1px solid #CCCCCC;
    border-radius: 4px
}
.catalogPageGroupSearchResult .viewBlock.half li.article .wrapper.hf,
.catalogPageGroupSearchResult .viewBlock.half li.article .wrapper.hf h3.name {
    background-image: none;
}
.catalogPageGroupSearchResult .viewBlock.half li.article .wrapper.hf h3.name a {
    color: #333333
}
.catalogPageGroupSearchResult .searchResultCatalogSummary li.article ul.spec li:not(:last-child) {
    display: none;
}
.catalogPageGroupSearchResult .searchResultCatalogSummary li.article ul.spec li.name {
    display: block;
}
.catalogPageGroupSearchResult .searchResultCatalogSummary li.article ul.spec li {
    word-break: break-all;
}
.viewPanel {
    height: max-content !important;
}
.searchResultCatalogSummary .catalogview_mini_text {
    margin-left: 5px;
}
.viewPanel .article .nallowdown_mini_text {
    position: relative;
    right: 10px;
}

/* ダウンロード画面 */
.catalogDownload #lead img {
    display: none;
}

/* 詳細画面 */
.catalogDetail form#CatalogDetail > div:not(#lead, #overview, #index) {
    display: none !important;
}

.catalogDetail .detail .image {
    text-align: left;
    width: 200px;
} 
.catalogDetail .detail .image img {
    width: 150px;
}

.catalogDetail #overview {
    margin-left: 10px;
}
.catalogDetail #overview .description {
    pointer-events: none;
    position: relative;
    left: -100px;
    font-weight: 600;
}
.catalogDetail #overview h2 {
    border: none;
}
.catalogDetail #overview h2 span {
    font-weight: 600;
    font-size: 18px;
    border: none;
}

.catalogDetail #overview .description {
    position: relative;
    left: -100px;
    font-weight: 600;
}
.catalogDetail #overview .description .comment,
.catalogDetail #overview .description .spec {
    font-size: 14px;
}
.catalogDetail #overview .spec table.horizontal.dotted,
.catalogDetail #overview .spec table.horizontal.dotted tbody,
.catalogDetail #overview .spec table.horizontal.dotted tr,
.catalogDetail #overview .spec table.horizontal.dotted td,
.catalogDetail #overview .spec table.horizontal.dotted th {
    border: none !important;
    color: black;
    padding-left: 0;
}
.catalogDetail #overview .spec table.horizontal.dotted th {
    width: 30%;
}
.catalogDetail #overview .spec table.horizontal.dotted td {
    width: 70%;
    word-break: break-all;
}


.catalogDetail #index {
    margin-top: 10px;
    margin-left: 10px;
}
.catalogDetail .catalogIndex ul, 
.catalogDetail .catalogIndex .categoryNode {
    width: 100%;
}
.catalogDetail .catalogIndex .categoryNode .title {
    width: 45%;
}
.catalogDetail .catalogIndex .categoryNode .function {
    width: 55%;
}

@media screen and (max-device-width: 767px), screen and (max-device-height: 767px) {
    /* 全画面 */
    #header, #main, #footer {
        min-width: 100%;
        width: 100%;
    }
    #contents, #header .inner {
        padding: 0 10px 20px;
        position: relative;
        width: 100%;
    }
    #sidemenu, #main {
        padding-left: 0;
    }

    /* ヘッダ */
    #header div.inner {
        padding: 10px;
        height: 60px;
    }
    #header img.ci {
        position: relative;
        top: 0;
        left: 0;
        height: 38px;
    }
    .utility {
        width: 100% !important;
    }
    .utility ul {
        padding-right: 0 !important; 
        position: relative;
        top: -50px;
    }

    /* 全画面 */
    #contents {
        display: flex;
        flex-direction: column-reverse;
    }
    #lead h1 {
        font-size: 18px;
    }
    .breadcrumbs li {
        font-size: 14px;
    }
    .viewBlock li.article p.function,.viewBlock.half.catalogPage li.article ol.nombre .function {
        display: none;
    }
    .viewBlock li.article ul.spec li {
        font-size: 14px;
    }
    .viewBlock li.article .image {
        width: 200%;
        margin: 0 auto;
    }
    .viewBlock li.article ul.spec {
        margin-bottom: 24px;
    }
    .viewBlock li.article .description .function {
        flex-direction: row;
        gap: 17px;
        max-width: 100%;
    }

    /* サイドメニュー */
    div.side, #extra {
        width: 100%;
    }
    #sidemenu {
        margin-bottom: 40px;
    }
    .sideMybinder{
        display: none;
    }
    #keywordSearchSideCatalog .scope img {
        height: 16px;
    }
    div.section#keywordSearchSideCatalog .searchTitle {
        font-size: 20px;
    }
    .keywordSearch input.keyword,.btn.matte.search {
        height: 42px;
    }
    .keywordSearch input.keyword {
        width: calc(100% - 80px);
    }
    .sideCategory .searchTitle {
        font-size: 18px;
        padding: 16px;
    }
    .sideCategory .inner .treeview li span {
        font-size: 16px;
        padding: 13px;
        padding-left: 45px;
    }
    .sideCategory .inner .treeview li a {
        font-size: 16px;
    }

    /* 一覧画面(トップページ・カテゴリ指定) */
    .function p.btn.cv.catalog.catalogview_mini_text,
    .function .c-btn {
        text-align: center;
        font-size: 14px; 
        height: auto;
    }
    .catalogSearchCategoryList .viewBlock.half,
    .catalogSearchResult .viewBlock.half {
        padding: 0;
    }
    .catalogSearchCategoryList .viewBlock.half li.article,
    .catalogSearchResult .viewBlock.half li.article {
        width: 100%;
        padding-bottom: 0;
    }
    .catalogSearchCategoryList .viewBlock.half li.article div.inner,
    .catalogSearchResult .viewBlock.half li.article div.inner {
        flex-direction: column;
        align-items: center;
        padding: 20px;
    }
    .catalogSearchCategoryList .viewBlock.half li.article div.image,
    .catalogSearchResult .viewBlock.half li.article div.image {
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 28px;
        width: 70%;
    }
    .catalogSearchCategoryList .viewBlock.half li.article div.image img,
    .catalogSearchResult .viewBlock.half li.article div.image img {
        width: 100%;
    }
    .catalogSearchCategoryList .viewBlock.half li.article div.description,
    .catalogSearchResult .viewBlock.half li.article div.description {
        position: relative;
        left: 0;
        width: 100%;
    }
    .catalogSearchCategoryList .viewBlock.half li.article .name,
    .catalogSearchResult .viewBlock.half li.article .name {
        padding: 20px 20px 0;
        font-size: 18px;
    }
    .catalogSearchCategoryList .viewBlock.half li.article div.description div.function, 
    .catalogSearchResult .viewBlock.half li.article div.function {
        position: static;
        justify-content: center;
    }

    /* 詳細画面 */
    .catalogDetail .detail .image {
        width: 30%;
    }
    .catalogDetail .detail .image img {
        width: 100%;
    }
    .catalogDetail #overview .spec table.horizontal.dotted th {
        width: 35%;
    }
    .catalogDetail #overview .spec table.horizontal.dotted td {
        width: 60%;
    }
    .catalogDetail #overview .description {
        position: relative;
        width: 70%;
        left: 0;
        padding-left: 15px;
        height: auto;
    }
    .detail .function {
        flex-wrap: wrap;
        gap: 10px
    }
    .detail .function .c-btn {
        width: 100%;
        flex: auto;
        text-align: center;
    }

    .function p.btn.cv.catalog.catalogview_middle_text,
    .function span#download_1 {
        width: 100%;
        height: auto;
        padding: 12px;
        text-align: center;
    }
    .detail .functionDownload {
        width: 100%;
    }

    .catalogDetail #index h2 {
        border-bottom: none;
        text-align: center;
        background-color: #e9e9e9;
        font-weight: 700;
        padding: 16px 10px;
    }
    .catalogDetail #index h2 span {
        border-bottom: none;
    }
    .catalogDetail #lead p {
        font-size: 18px;
        margin-bottom: 20px;
    }
    .catalogIndex ul.level_1 div.function {
        width: 100%;
    }
    .catalogIndex .categoryNode {
        flex-wrap: wrap;
    }
    .catalogIndex ul.level_1 {
        width: 100%;
    }
    .catalogDetail .catalogIndex .categoryNode .title {
        width: 100%;
    }
    .catalogDetail .catalogIndex .categoryNode .function {
        width: 100%;
    }

    /* キーワード検索画面 */
    .catalogPageGroupSearchResult .viewBlock.half li.article {
        width: calc(100% - 20px);
    }
    .btn.mybinder_mini_text {
        display: none;
    }
    #wrapper {
        overflow: hidden;
    }
    .catalogPageGroupSearchResult dl {
        display: flex;
    }   
    .catalogPageGroupSearchResult dd, .catalogPageGroupSearchResult dt  {
        position: static !important;
        width: 50% !important;
    }
    .viewBlock.half.catalogPage li.article div.image ol.pages {
        width: 100%;
    }
    .viewBlock.half.catalogPage li.article div.image ol.pages li.left,
    .viewBlock.half.catalogPage li.article div.image ol.pages li.right  {
        width: 50%;
    }
    .viewBlock.half.catalogPage li.article div.image ol.pages li div,
    .viewBlock.half.catalogPage li.article div.image ol.pages li img {
        width: 100%;
    }
    .viewBlock.half.catalogPage li.article ol.nombre {
        width: 100%;
    }
    .viewBlock.half.catalogPage li.article ol.nombre li.left {
        width: 50%;
        text-align: center;
        padding-right: 0;
    }
    .viewBlock.half.catalogPage li.article ol.nombre li.right {
        width: 50%;
        text-align: center;
        padding-right: 0;
    }
    .viewBlock.half.catalogPage li.article ol.hit {
        width: 100%;
    }
    .btn.icon_catalogview {
        right: 0;
    }
    .searchCondition, .searchResultCatalogSummary {
        display: none !important;
    }

    .btn.matte.search {
        width: 72px;
    }

    #index p.lead .sp-hide {
        display: none;
    }

    .catalogIndex div.catalogIndexContents {
        overflow: scroll;
    }
    .catalogIndex .function {
        width: auto;
    }
    #skip_CatalogSearch a {
        position: relative;
        left: 220px;
    }
}