@charset "UTF-8";

.wrapper {
    line-height: 0;
}

.fr-pagetop {
    z-index: 99;
}

.main_inner {
    max-width: 768px;
    margin: 0 auto;
    background-color: #fff;
    padding: 0;

    font-family: ヒラギノ角ゴ Pro, Hiragino Kaku Gothic Pro, Hiragino Sans, Noto Sans CJK JP, Osaka, Meiryo, メイリオ, MS PGothic, ＭＳ Ｐゴシック, YuGothic, Yu Gothic, Hiragino Sans GB, Helvetica Neue, HelveticaNeue, Helvetica, Noto Sans, Roboto, Arial, Arial Unicode MS, sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.6em;
}

img {
    object-fit: contain;
}

footer .fr-globalFooter {
    margin-top: 0 !important;
}

section {
    margin-bottom: 40px;
}

.list-note {
    margin: 0 1em;
    padding-bottom: 1em;
}

.list-note li {
    text-indent: -1em;
    margin-bottom: 0.5em;
}

.list-note li:before {
    content: "※";
}

.sp-only {
    display: block;
}

.pc-only {
    display: none;
}

/* content */

section.mv {
    position: relative;
}

.mv_img {
    position: relative;
}

.link-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.link-box a {
    position: relative;
    display: inline-block;
    width: 250px;
    padding: 1em 0;
    margin-bottom: 2.5em;
    border: 1px solid #000;
}

.link-box a::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 27px;
    width: 9px;
    height: 9px;
    margin: auto;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
    box-sizing: border-box;
}

.link-box.link-box_pdf a::before {
    content: '';
    background: url(https://www.plst.com/jp/ja/special-feature/common/images/pdficon.png) no-repeat;
    position: absolute;
    bottom: 0.9em;
    left: 2em;
    display: inline-block;
    width: 2em;
    height: 2em;
    background-size: contain;
    vertical-align: middle;
}

/* graph */

.graph {
    position: relative;
    max-width: 960px;
    margin: 0 auto 40px;
}

.graph ul li {
    position: absolute;
    width: 16%;
    list-style: none;
    margin: 0 0;
    padding: 0 0;
}

.graph ul li:nth-child(1) {
    top: 77%;
    left: 1%;
}

.graph ul li:nth-child(2) {
    top: 3%;
    left: 7%;
}

.graph ul li:nth-child(3) {
    top: 15%;
    left: 21%;
}

.graph ul li:nth-child(4) {
    top: 72%;
    left: 19%;
}

.graph ul li:nth-child(5) {
    top: 47%;
    left: 31%;
}

.graph ul li:nth-child(6) {
    top: 8%;
    left: 44%;
}

.graph ul li:nth-child(7) {
    bottom: 6%;
    left: 55%;
}

.graph ul li:nth-child(8) {
    top: 4%;
    left: 60%;
}

.graph ul li:nth-child(9) {
    bottom: 6%;
    left: 70%;
}

.graph ul li:nth-child(10) {
    top: 27%;
    left: 71%;
    width: 14%;
}

.graph ul li:nth-child(11) {
    bottom: 6%;
    right: 1%;
}

.graph ul li:nth-child(12) {
    top: 1%;
    right: 1%;
}

@media screen and (min-width: 768px) {

    .graph ul li {
        width: 13%;
    }

    .graph ul li:nth-child(1) {
        top: 77%;
        left: 1%;
    }

    .graph ul li:nth-child(2) {
        top: 3%;
        left: 7%;
    }

    .graph ul li:nth-child(3) {
        top: 15%;
        left: 21%;
    }

    .graph ul li:nth-child(4) {
        top: 72%;
        left: 19%;
    }

    .graph ul li:nth-child(5) {
        top: 47%;
        left: 31%;
    }

    .graph ul li:nth-child(6) {
        top: 8%;
        left: 48%;
    }

    .graph ul li:nth-child(7) {
        bottom: 8%;
        left: 55%;
    }

    .graph ul li:nth-child(8) {
        top: 4%;
        left: 60%;
    }

    .graph ul li:nth-child(9) {
        bottom: 8%;
        left: 69%;
    }

    .graph ul li:nth-child(10) {
        top: 27%;
        left: 76%;
        width: 11%;
    }

    .graph ul li:nth-child(11) {
        bottom: 8%;
        right: 3%;
    }

    .graph ul li:nth-child(12) {
        top: 1%;
        right: 1%;
    }

}

.graph-icon{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.icon-num_circle{
    height: 1.6em;
    width: 1.6em;
    border: 1px solid #000;
    border-radius:50%;
    line-height:1.5em;
    text-align:center;
    background: #fff;
    box-shadow: 0 0 0 5px #fff;
    font-size: 10px;
}

.graph ul li{
    counter-increment: num_graph;
}

.graph .icon-num_circle span:after {
    content: counter(num_graph);
}

.table-coat{
    counter-reset: num_table -1;
}
.table-coat tr{
    counter-increment: num_table;
}

.table-coat .icon-num_circle span:after {
    content: counter(num_table);
}

.table-coat .icon-num_circle{
    background: transparent;
    box-shadow: none;
}


/* Table */

.fixed-table-col {
    overflow-x: scroll;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;

    * {
        box-sizing: border-box;
    }

    table {
        border-spacing: 0;

        th,
        td {
            min-width: 6rem;
            text-align: center;
            border-right: 1px solid #ccc;
            border-bottom: 1px solid #ccc;
            vertical-align: middle;
        }

        tr:nth-child(1) {
            position: sticky;
            top: 0;
            z-index: 15;
        }

        th {
            background-color: #eee;

            &:nth-child(1) {
                position: sticky;
                left: 0;
                z-index: 10;
            }
        }

        th.th-name{
            min-width: 130px;
        }

        th.th-img{
            min-width: 120px;
        }

        th.th-point{
            min-width: 200px;
        }
    }
}

th.th-point{
    width: 200px;
}

.table-coat {
    font-size: 12px;
}

.table-icon{
    display: flex;
    flex-direction: column;
    align-items: center;
}

.table-icon >*{
    margin-top: 1em;
}

.td-price,
.td-color {
    pointer-events: none;
}

.td-price .sf_bff_products_inner li .sf_bff_products_itemName,
.td-price .favorites_layout,
.td-price .sf_bff_price_flags,
.td-price .sf_bff_products_flags {
    display: none;
}
.td-price .sf_bff_products_inner ul.column_1_text li,
.td-price .sf_bff_products_inner ul.column_1_text li .sf_bff_products_detail {
    padding: 0;
}

.td-price .sf_bff_products_inner ul.column_1_text,
.td-price .sf_bff_products_inner ul.column_1_text li,
.sf_bff_products_inner ul.column_1_text li .sf_bff_products_price{
    margin: 0;
}

.td-color .sf_bff_products_image,
.td-color .sf_bff_products_detail,
.td-color .favorites_layout{
    display: none;
}

.td-color .sf_bff_products_inner li .sf_bff_products_colorchip span:not(.chipOver).current{
    background: none;
}
.td-color .sf_bff_products_inner li .sf_bff_products_colorchip span.current img{
    border: none;
}

.td-color .sf_bff_products_inner ul,
.td-color .sf_bff_products_inner ul.column_1 li,
.td-color .sf_bff_products_inner ul.column_3 li,
.td-color .sf_bff_products_inner li .sf_bff_products_colorchip
{
    margin: 0;
}

.td-color .sf_bff_products_inner ul.column_3 li{
    width: 100%;
}

.td-color .sf_bff_products_inner ul{
    justify-content: center;
}

.td-point ul{
    list-style-type: disc;
    padding: 0 1em 0 2em;
}

.td-point li {
    text-align: left;
}

.td-link a{
    text-decoration: underline;
}

section.items .item-product{
    margin: 0 1em;
}

/* pc */

@media screen and (min-width: 768px) {

    .sp-only {
        display: none;
    }

    .pc-only {
        display: block;
    }

    .main_inner {
        font-size: 16px;
        max-width: 1000px;
    }

    .fixed-table-col {

        table {
            th.th-img{
                min-width: 150px;
            }
        }
    }

}