@charset "UTF-8";

.c-content-block__inner.c-content-block__inner--info {
    max-width: 965px;
} 

/* =================================================================================
【タイトル・導入部分】　<h1>ブログメインタイトル
================================================================================= */
@media print,
screen and (min-width: 48em) {
    .c-content-section-1 {
        margin-bottom: 3.5em !important;
    }
}

.p-article-heading {
    margin-bottom: 25px;
}

@media print,
screen and (min-width: 48em) {
    .p-article-heading {
        margin-bottom: 30px;
    }
}

.p-article-heading__main_title {
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 153.9%;
    line-height: 1.6;
}

.p-article-heading__main_title span {
    font-size: 70%;
    margin-top: 0.25em;
    display: block;
}

@media print,
screen and (min-width: 48em) {
    .p-article-heading__main_title {
        font-size: 216%;
        text-align: center;
        line-height: 1.9;
    }
}

@media only screen and (max-width: 47.9375em) {
    .p-article-heading__main_title br {
        display: none;
    }
}

/* ==================================================================
【タイトル・導入部分】　リード文 */
.p-entry-edit-area p {
    margin-bottom: 8px;
    font-size: 100%;
    line-height: 1.8;
}

[class^="p-figure__caption"] {
    margin-top: 10px;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
}

.p-figure__caption--centered {
    text-align: center;
}

.p-caption-product {
    display: block;
    font-size: 116%;
    font-weight: bold;
}

@media print,
screen and (min-width: 48em) {
    .p-entry-edit-area p {
        /*! margin-bottom: 18px; */
        font-size: 108%;
    }
}

@media print, screen and (min-width: 48em) {
    .p-column-pic-list {
        justify-content: center;
        flex-wrap: wrap;
        margin: 0 -30px;
    }

    .c-image {
        margin: 0 auto;
        max-width: 100%;
        position: relative;
    }

    .p-column-block--article .p-column-block__column--1 .c-image img,
    .p-column-block--article .p-column-block__column--2 .c-image img,
    .p-column-block--article .p-column-block__column--3 .c-image img {
        height: auto;
        left: 50%;
        max-height: 100%;
        max-width: 100%;
        position: absolute;
        top: 50%;
        transform: translate(-50%, -50%);
        width: auto;
    }

    .p-column-block--article .p-column-block__column--1 {
        margin: 0 auto;
        width: 100%;
    }

    .p-column-block--article .p-column-block__column--1 .c-image {
        height: 360px;
        width: 640px;
    }

    .p-column-block--article .p-column-block__column--2 {
        box-sizing: border-box;
        margin: 30px 0;
        max-width: 420px;
        padding: 0 30px;
    }

    .p-column-block--article .p-column-block__column--2 .c-image {
        height: 240px;
        width: 360px;
    }

    .p-column-block--article .p-column-block__column--3 {
        box-sizing: border-box;
        margin: 30px 0;
        padding: 0 20px;
        width: 33.3%;
    }

    .p-column-block--article .p-column-block__column--3 .c-image {
        height: 190px;
        width: 280px;
    }

    .p-column-block--article .p-column-block__column--2.vertical {
        flex: 0 1 360px;
    }

    .p-column-block--article .p-column-block__column--1.vertical .c-image,
    .p-column-block--article .p-column-block__column--2.vertical .c-image,
    .p-column-block--article .p-column-block__column--3.vertical .c-image {
        height: 480px;
        width: 300px;
    }

    .p-column-block--article .p-column-block__column--1 .c-image--zoom,
    .p-column-block--article .p-column-block__column--1.vertical .c-image--zoom,
    .p-column-block--article .p-column-block__column--2 .c-image--zoom,
    .p-column-block--article .p-column-block__column--2.vertical .c-image--zoom {
        height: 360px;
        width: 360px;
    }

    .p-column-block--article .p-column-block__column--3 .c-image--zoom,
    .p-column-block--article .p-column-block__column--3.vertical .c-image--zoom {
        height: 280px;
        width: 280px;
    }
}

@media print, screen and (max-width: 47em) {
    .p-column-block--article .p-column-block__column--1 .c-image img,
    .p-column-block--article .p-column-block__column--2 .c-image img,
    .p-column-block--article .p-column-block__column--3 .c-image img {
        height: auto;
        margin: 0 auto;
        max-height: 100%;
        width: 100%;
    }

    .p-column-pic-list {
        flex-direction: column;
        align-items: center;
    }

    .c-image {
        margin: 0 auto;
    }

    .p-column-block__column--1,
    .p-column-block__column--2,
    .p-column-block__column--3 {
        margin-left: auto;
        margin-right: auto;
        max-width: 545px;
        width: 100% !important;
    }

    .p-column-block__column--2,
    .p-column-block__column--3 {
        margin: 20px 0;
    }

    .p-column-block--article .p-column-block__column--1.vertical .c-image,
    .p-column-block--article .p-column-block__column--2.vertical .c-image {
        /*height: 320px;*/
        /*width: 200px;*/
        max-width: 545px;
        height: auto;
    }

    .p-column-block--article .p-column-block__column--1.vertical .c-image img,
    .p-column-block--article .p-column-block__column--2.vertical .c-image img {
        max-width: 100%;
        width: auto;
    }

    .p-column-block--article .p-column-block__column--1 .c-image--zoom,
    .p-column-block--article .p-column-block__column--1.vertical .c-image--zoom,
    .p-column-block--article .p-column-block__column--2 .c-image--zoom,
    .p-column-block--article .p-column-block__column--2.vertical .c-image--zoom,
    .p-column-block--article .p-column-block__column--3 .c-image--zoom,
    .p-column-block--article .p-column-block__column--3.vertical .c-image--zoom {
        height: 87vw;
        max-height: 545px;
        max-width: 545px;
        width: 100%;
    }
}

@supports not (-ms-high-contrast: none) {
    .c-image--zoom img {
        height: 100% !important;
        object-fit: cover;
        width: 100% !important;
    }
}

/* ==================================================================
【共通】拡大なし画像
 */
.p-column-block-image {
    margin-bottom: 1em !important;
    border: none !important;
    text-align: center;
    display: flex;
    -webkit-justify-content: center;
    /*Safari etc.*/
    -ms-justify-content: center;
    /*IE10*/
    justify-content: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.p-column-block-image img {
    width: 100%;
    max-width: 1110px;
    height: auto;
}

/* ==================================================================
【共通】領域ブロック
 */
.p-column-block {
    margin-top: 2.5em;
}

@media print,
screen and (min-width: 48em) {
    .p-column-block {
        margin-top: 2em;
    }
}

/* =================================================================================
【ページ本文ブロック】ページ本文ブロック　<h2>項目メインタイトル
================================================================================= */
.p-contents-heading {
    margin-bottom: 25px;
}

@media print,
screen and (min-width: 48em) {
    .p-contents-heading {
        margin-bottom: 20px;
    }
}

.p-contents-heading__main_title {
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 153.9%;
    line-height: 1.4;
}

.p-contents-heading__main_title span {
    font-size: 70%;
    margin-top: 0.25em;
    display: block;
}

@media print,
screen and (min-width: 48em) {
    .p-contents-heading__main_title {
        font-size: 197%;
        text-align: center;
        line-height: 1.8;
    }
}

@media only screen and (max-width: 47.9375em) {
    .p-contents-heading__main_title br {
        display: none;
    }
}




/* ===========================================================【ページ本文ブロック】各項目表題*/
.c-heading-2__title {
    display: inline-block;
    margin-right: 10px;
    vertical-align: middle;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    letter-spacing: 0.16em;
    font-weight: bold;
    font-size: 116%;
}

.c-heading-2__title .c-txt-price {
    margin-left: 0;
    font-weight: normal;
    font-size: 73%;
    display: block;
}

@media print,
screen and (min-width: 48em) {
    .c-heading-2__title .c-txt-price {
        margin-left: 1em;
        font-weight: normal;
        font-size: 73%;
        display: inline-block;
    }
}

@media print,
screen and (min-width: 61.25em) {
    .c-heading-2__title {
        margin-right: 27px;
        font-size: 174.2%;
    }

    .c-heading-2__title .c-txt-price {
        margin-left: 1em;
        font-weight: normal;
        font-size: 73%;
    }
}

.c-heading-3--simple .c-heading-3__title {
    font-size: 146.6%;
}

.c-heading-3--simple .c-heading-3__title span {
    font-size: 93%;
}

.c-indent {
    padding-left: 1.5em;
}

.c-small-txt {
    font-size: 85%;
    font-weight: normal;
}

/* ===========================================================
【ページ本文ブロック】左画像＆表題＆文章　ボックス
 */
.p-img-txt-block {
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    letter-spacing: -0.4em;
    margin-bottom: 2em;
}

.p-img-txt-block .c-img-block {
    width: 100%;
    margin: 0;
    display: inline-block;
    letter-spacing: normal;
    vertical-align: middle;
    text-align: center;
}

.p-img-txt-block .c-img-block img {
    width: 60%;
    max-width: 380px;
    height: auto;
}

.p-img-txt-block .c-txt-block {
    width: 100%;
    display: inline-block;
    letter-spacing: normal;
    vertical-align: middle;
}

.p-img-txt-block .c-txt-block-ttl {
    font-size: 100%;
    font-weight: bold;
}

.p-img-txt-block .c-txt-block-txt {}

@media print,
screen and (min-width: 48em) {
    .p-img-txt-block {
        font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
        letter-spacing: -0.4em;
        margin-bottom: 0;
        display: block;
        width: 100%;
        margin: 0.5em 0;
    }

    .p-img-txt-block .c-img-block {
        width: 13%;
        margin: 0 2% 0 3%;
        display: inline-block;
        letter-spacing: normal;
        vertical-align: middle;
    }

    .p-img-txt-block .c-img-block img {
        width: 100%;
        max-width: 380px;
        height: auto;
    }

    .p-img-txt-block .c-txt-block {
        width: 82%;
        display: inline-block;
        letter-spacing: normal;
        vertical-align: middle;
    }

    .p-img-txt-block .c-txt-block-ttl {
        font-size: 133%;
        font-weight: bold;
    }

    .p-img-txt-block .c-txt-block-txt {}
}

/*--------------------------------------------------------------------------------------------------
【ページ本文ブロック】製品画像とラインアップ
--------------------------------------------------------------------------------------------------*/
.p-product-block {
    letter-spacing: -0.4em;
}

.c-procuct-img {
    width: 100%;
    margin-right: 5%;
    display: inline-block;
    letter-spacing: normal;
    vertical-align: top;
    text-align: center;
}

.c-procuct-img img {
    width: 100%;
    max-width: 200px;
    height: auto;
}

@media print,
screen and (min-width: 48em) {
    .c-procuct-img {
        width: 20%;
        margin-right: 5%;
        display: inline-block;
        letter-spacing: normal;
        vertical-align: top;
    }

    .c-procuct-img img {
        width: 100%;
        max-width: 200px;
        height: auto;
    }
}

.c-table-list {
    width: 100%;
    display: inline-block;
    letter-spacing: normal;
    vertical-align: top;
}

.c-table-list table {
    margin: 1em 0 1em;
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    color: #333;
}

.c-table-list th {
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    padding: 17px 6px 14px;
    margin: 0;
    font-size: 100%;
    line-height: 1.3;
    color: #333;
    border: 1px solid #CCC;
    vertical-align: middle;
    background-color: #f1f1f1;
    text-align: center;
    font-weight: bold;
}

.c-table-list .c-img-item {}

.c-table-list .c-img-item img {
    width: 100%;
    max-width: 160px;
    height: auto;
}

.c-table-list td {
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    font-size: 100%;
    padding: 14px 10px 13px 14px;
    margin: 0;
    color: #333;
    border: 1px solid #CCC;
    vertical-align: top;
    table-layout: fixed;
    word-break: break-all;
    word-wrap: break-word;
    line-height: 1.4;
    vertical-align: middle;
    text-align: center;
}

.p-scroll-table--wide .p-scroll-table__table {
    min-width: 963px;
}

.p-scroll-table__table th,
.p-scroll-table__table td {
    text-align: center;
}

.c-txt-price--tax-excluded {
    font-weight: bold;
}

.c-txt-price--tax-included {
    font-weight: normal;
}

.c-table-list td em {
    font-style: normal;
    font-size: 133%;
}

@media print,
screen and (min-width: 48em) {
    .c-table-list {
        width: 100%;
        display: inline-block;
        letter-spacing: normal;
        vertical-align: top;
    }

    .c-table-list table {
        margin: 0 0 0.5em;
        border-collapse: collapse;
        table-layout: fixed;
        width: 100%;
        color: #333;
    }
}

/*--------------------------------------------------------------------------------------------------
リスト文章
--------------------------------------------------------------------------------------------------*/
.c-list--disc {
    /*margin-top: 2em;*/
}

.c-list--disc>li {
    margin-bottom: 0.8em;
    padding-left: 11px;
    background-image: url(//www.elecom.co.jp/common/svg/icon_disc.svg);
    background-repeat: no-repeat;
    background-position: 0 0.7em;
    background-image: url(//www.elecom.co.jp/common/svg/icon_disc_02.svg);
    font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
    font-weight: normal;
    font-size: 108%;
}

/*--------------------------------------------------------------------------------------------------
定義リスト;
--------------------------------------------------------------------------------------------------*/
.c-dl-list {
    text-align: left;
    margin: 0.5em 0 0.5em 0;
}

.c-dl-list dt::before {}

.c-dl-list dt::after {
    content: " :"
}

.c-dl-list dt.c-after-none::after {
    content: ""
}

.c-dl-list dt {
    vertical-align: top;
    float: left;
    clear: left;
    margin: 0 0.21em 0 0;
}

@media print,
screen and (min-width: 48em) {}

.c-dl-list dd {
    float: left;
    text-align: left;
    vertical-align: top;
    margin: 0 0 0.5em 0;
}

.c-dl-list:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
}

/*--------------------------------------------------------------------------------------------------
モーダルウインドウのサイズ調整
--------------------------------------------------------------------------------------------------*/
.p-modal-module {
    transform: translate(-50%, -50%);
}

.p-modal-module--simple.is-size-s img {
    height: auto;
    max-height: 90vh;
    max-width: 700px;
    width: auto;
}

.p-modal-module--simple.is-size-m img {
    height: auto;
    max-height: 90vh;
    max-width: 900px;
    width: auto;
}

.p-modal-module--simple.is-size-l img {
    height: auto;
    max-height: 90vh;
    max-width: 1200px;
    width: auto;
}

/*--------------------------------------------------------------------------------------------------
定義リスト　タイプ
--------------------------------------------------------------------------------------------------*/
.c-list-txt-box {
    display: table-row-group
}

.c-list-txt-box>div {
    display: table-row
}

.c-list-txt-box-ttl {
    display: table-cell;
    padding-right: 1.6rem;
    font-size: 108%;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
}

.c-list-txt-box-ttl p {
    font-weight: bold;
}

.c-list-txt-box-ttl>div {
    white-space: nowrap
}

.c-list-txt-box-body {
    font-size: 108%;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
}

/*--------------------------------------------------------------------------------------------------
製品ページリンク掲載　特殊パターンボタン
--------------------------------------------------------------------------------------------------*/
.p-product-link-panel__title {
    position: relative;
    margin-right: 11px;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 123.1%;
    line-height: 1.4;
    word-break: break-all;
}

@media print,
screen and (min-width: 48em) {
    .p-product-link-panel__title {
        font-size: 116%;
    }
}

@media print,
screen and (min-width: 87.5em) {
    .p-product-link-panel__title {
        margin-right: 15px;
        font-size: 146%;
    }
}

.p-download-link-panel__subtitle {
    display: block;
    position: relative;
    margin-right: 11px;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 100%;
    line-height: 1.3;
    color:
        #333;
    transition: color cubic-bezier(0.215, 0.61, 0.355, 1) 0.15s;
    word-break: break-all;
    width: 100%;
}

.p-product-link-panel__image {
    margin-right: 15px;
}

@media print,
screen and (min-width: 48em) {
    .p-product-link-panel__image {}
}

.p-product-link-panel__label span {
    display: inline-block;
    margin-top: 0px;
    font-size: 77%;

}

.p-product-link-panel__title {
    position: relative;
    margin-right: 11px;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 123.1%;
    line-height: 1.4;
    word-break: break-all;
}

@media print,
screen and (min-width: 48em) {
    .p-product-link-panel__title {
        font-size: 133%;
    }
}

@media print,
screen and (min-width: 87.5em) {
    .p-product-link-panel__title {
        margin-right: 15px;
        font-size: 133%;
    }
}

/*アイコンのラベル色ワークグループエディション*/
.p-product-link-panel__label span {
    display: inline-block;
    margin-top: 0 !important;
    padding-top: 1px !important;
    padding-bottom: 0 !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
    border-radius: 2px !important;
    font-family: "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo;
    -webkit-font-feature-settings: 'palt'1;
    font-feature-settings: 'palt'1;
    font-weight: bold;
    font-size: 77%;
    color: #fff;
    text-align: center;
}

.p-product-link-panel__label.c-icn-red span {
    background-color: #b2001d !important;
}

.c-flex-container--2col,
.c-flex-container--3col,
.c-flex-container--4col,
.c-flex-container--5col {
    margin-bottom: 0 !important;
}

@media print,
screen and (min-width: 48em) {

    .c-flex-container--2col,
    .c-flex-container--3col,
    .c-flex-container--4col,
    .c-flex-container--5col {
        margin-bottom: 0 !important;
    }
}

@media print,
screen and (min-width: 40.0625em) {
    .c-flex-container--stretch {
        -webkit-box-align: stretch !important;
        -ms-flex-align: stretch !important;
        align-items: stretch !important;
    }
}

.c-content-section-2:last-child {
    margin-bottom: 40px !important;
}

/* ==================================================================
【共通】リンク
 */
.p-link-blank,
.p-link-arrow {
    margin-right: 5px;
}

/* ==================================================================
【共通】リンク
 */
.p-annotation-text:not(.p-annotation-text--emphasis) {
    color: #666;
}
