@charset "utf-8";


/* ────────────────────── *
 *                                              *
 * グローバルナビゲーション（上書き）           *
 *                                              *
 * ────────────────────── */

#gnavi {
    border-bottom: 2px solid #d0dde7;
}


/* ────────────────────── *
 *                                              *
 * コンテンツ（上書き）                         *
 *                                              *
 * ────────────────────── */

.contents {
    padding-top: 50px;
}


/* ────────────────────── *
 *                                              *
 * 見出し（h2）                                 *
 *                                              *
 * ────────────────────── */

.contents h2.title {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 50px;
}


/* ────────────────────── *
 *                                              *
 * 見出し（h3）                                 *
 *                                              *
 * ────────────────────── */

.contents h3.title {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    color: #fff;
    background: #364957;
    clear: both;
    padding: 5px 10px;
    margin-bottom: 15px;
}


/* ────────────────────── *
 *                                              *
 * テキスト                                     *
 *                                              *
 * ────────────────────── */

.contents p.text {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 20px;
}


/* ────────────────────── *
 *                                              *
 * テーブル01                                   *
 *                                              *
 * ────────────────────── */

.contents table.table-01 {
    font-size: 16px;
    line-height: 1.7;
    width: 100%;
    margin-bottom: 120px;
    border-spacing: 0;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-collapse: collapse;
}
.contents table.table-01 th {
    font-weight: normal;
    background: #eaf6f5;
    text-align: left;
    width: 200px;
    padding: 15px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.contents table.table-01 td {
    padding: 15px;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}
.contents table.table-01 td a {
    color: #005ab7;
    text-decoration: underline;
}
.contents table.table-01 td a.tel {
    color: #333;
    text-decoration: none;
    cursor: default;    
}
.contents table.table-01 td img.email {
    vertical-align: middle;
}
.contents table.table-01 td dl dt {
    font-weight: 700;
}
.contents table.table-01 td dl dd {
    margin-bottom: 20px;
}
.contents table.table-01 td dl dd:last-child {
    margin-bottom: 0;
}
.contents table.table-01 td ul.list {
    margin-left: 25px;
    list-style-type: disc;
}


/* ────────────────────── *
 *                                              *
 * テーブル02（フォーム）                       *
 *                                              *
 * ────────────────────── */

.contents table.table-02 {
    font-size: 16px;
    line-height: 1.7;
    width: 100%;
    margin-bottom: 40px;
    border-spacing: 0;
    border-top: 1px dotted #ccc;
    border-collapse: collapse;
}
.contents table.table-02 th {
    font-weight: 700;
    text-align: left;
    vertical-align: top;
    width: 200px;
    padding: 25px 15px;
    border-bottom: 1px dotted #ccc;
    position: relative;
}
.contents table.table-02 th .ec-required {
    content: "必須";
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: #c00;
    padding: 5px;
    border-radius: 4px;
    position: absolute;
    right: 10px;
    top: 28px;
}
.contents table.table-02 td {
    padding: 15px;
    border-bottom: 1px dotted #ccc;
}
.contents table.table-02 td input.left {
    margin-right: 20px;
}
.contents table.table-02 td input.input-01 {
    font-size: 16px;
    width: 300px;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
}
.contents table.table-02 td input.input-02 {
    font-size: 16px;
    width: 150px;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
}
.contents table.table-02 td input.input-03 {
    font-size: 16px;
    width: 100%;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents table.table-02 td select.input-01 {
    font-size: 16px;
    width: 200px;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: menulist;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents table.table-02 td textarea {
    font-size: 16px;
    width: 100%;
    height: 400px;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents table.table-02 td .line {
    margin-bottom: 10px;
}
.contents table.table-02 td .ec-errorMessage {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 700;
    color: #fff;
    background: #c00;
    display: inline-block;
    padding: 5px 10px;
    margin-top: 10px;
    margin-right: 20px;
    border-radius: 4px;
}
.contents table.table-02 td .error input,
.contents table.table-02 td .error textarea {
    background: #ffcece;
    border: 1px solid #c00;
}


/* ────────────────────── *
 *                                              *
 * お客様情報変更時                             *
 *                                              *
 * ────────────────────── */

.contents .cart-left table.table-02 {
    margin-bottom: 15px;
}
.contents .cart-left table.table-02 th {
    width: 150px;
}
.contents .cart-left table.table-02 td input {
    font-size: 16px;
    width: 150px;
    padding: 10px;
    margin-right: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
}
.contents .cart-left table.table-02 td .input-full input {
    width: 100%;
    margin-right: 0;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents .cart-left table.table-02 td .customer-postal_code input,
.contents .cart-left table.table-02 td .customer-address_pref input,
.contents .cart-left table.table-02 td .customer-address_addr01 input {
    margin-bottom: 10px;
}


/* ────────────────────── *
 *                                              *
 * フォーム                                     *
 *                                              *
 * ────────────────────── */

.contents form.form {
    margin-bottom: 120px;
}
.contents button.btn-submit {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
    color: #fff;
    background: #005ab7;
    padding: 20px;
    width: 300px;
    margin: 0 auto;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents button.btn-submit:hover {
    background: #53a8ff;
}
.contents button.btn-submit.end {
    background: #c00;
}
.contents button.btn-submit.end:hover {
    background: #d00;
}
.contents button.btn-back {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
    color: #fff;
    background: #aaa;
    padding: 20px;
    width: 300px;
    margin: 0 auto;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents button.btn-back:hover {
    background: #bbb;
}
.contents #button {
    clear: both;
}
.contents #button ul {
    font-size: 0;
    text-align: center;
}
.contents #button ul li {
    display: inline-block;
    margin: 0 20px;
}
.contents #complete {
    font-size: 16px;
    line-height: 1.7;
    background: #eaf6f5;
    padding: 30px;
    margin-bottom: 120px;
}
.contents #complete h3 {
    font-size: 20px;
    font-weight: 700;
    color: #005ab7;
    background: #d0dde7;
    text-align: center;
    padding: 10px;
    margin-bottom: 15px;
}
.contents #complete h3 + p {
    margin-bottom: 30px;
}
.contents #complete p .btn-homepage {
    font-size: 16px;
    line-height: 1;
    font-weight: 700;
    color: #fff;
    background: #005ab7;
    text-align: center;
    display: block;
    padding: 20px;
    width: 300px;
    margin: 0 auto;
    border: none;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}


/* ────────────────────── *
 *                                              *
 * プライバシーポリシー                         *
 *                                              *
 * ────────────────────── */

.contents dl#privacy-policy {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 120px;
}
.contents dl#privacy-policy dt {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}
.contents dl#privacy-policy dd {
    padding: 0 20px 30px;
    margin: 0 0 30px;
    border-bottom: 1px dotted #ccc;
}
.contents dl#privacy-policy dd:last-child {
    padding: 0 20px;
    margin: 0;
    border-bottom: none;
}
.contents dl#privacy-policy dd a.tel {
    color: #333;
    text-decoration: none;
    cursor: default;    
}


/* ────────────────────── *
 *                                              *
 * カートの中身・プログレス                     *
 *                                              *
 * ────────────────────── */

.contents ol#progress {
    color: #364957;
    text-align: center;
    display: table;
    table-layout: fixed;
    width: 600px;
    margin: 0 auto 30px;
}
.contents ol#progress li {
    display: table-cell;
    width: 120px;
    position: relative;
}
.contents ol#progress li .num {
    font-size: 20px;
    line-height: 40px;
    font-weight: bold;
    color: #fff;
    background: #364957;
    width: 40px;
    height: 40px;
    margin: 0 auto 10px;
    border-radius: 50%;
    position: relative;
}
.contents ol#progress li .num:after {
    content: "";
    background: #364957;
    width: 100px;
    height: 4px;
    position: absolute;
    top: 50%;
    left: 100%;
    z-index: -1;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}
.contents ol#progress li:last-child .num:after {
    content: none;
}
.contents ol#progress li .pos {
    font-size: 13px;
    line-height: 1.5;
}
.contents ol#progress li.active .num {
    background: #005ab7;
}
.contents ol#progress li.active .pos {
    color: #005ab7;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・現在の合計                     *
 *                                              *
 * ────────────────────── */

.contents p#currentTotal {
    font-size: 16px;
    line-height: 1.7;
    text-align: center;
    margin: 0 auto 40px;
}
.contents p#currentTotal strong {
    font-size: 20px;
    font-weight: 700;
    color: #d92e2e;
}
.contents p#includeTax {
    font-size: 14px;
    text-align: right;
    margin-bottom: 10px;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・商品                           *
 *                                              *
 * ────────────────────── */

.contents table#cartItem {
    font-size: 16px;
    line-height: 1.7;
    width: 100%;
    margin-bottom: 20px;
    border-spacing: 0;
    border-collapse: collapse;
}
.contents table#cartItem th {
    background: #eee;
    padding: 15px;
}
.contents table#cartItem td {
    background: #fff;
    padding: 15px;
    border-bottom: 1px dotted #ccc;
}
.contents table#cartItem th.c-01 {
    width: 60px;
}
.contents table#cartItem td.c-01 {
    font-size: 24px;
    text-align: center;
    width: 60px;
}
.contents table#cartItem td.c-01 a {
    color: #333;
}
.contents table#cartItem th.c-02 {
    width: 500px;
}
.contents table#cartItem td.c-02 {
    width: 500px;
}
.contents table#cartItem td.c-02 a {
    color: #005ab7;
}
.contents table#cartItem td.c-02 a:hover {
    text-decoration: underline;
}
.contents table#cartItem td.c-02 p {
    vertical-align: middle;
    display: table-cell;
    width: 100px;
    padding-right: 30px;
}
.contents table#cartItem td.c-02 dl {
    vertical-align: middle;
    display: table-cell;
}
.contents table#cartItem th.c-03 {
}
.contents table#cartItem td.c-03 {
    text-align: center;
}
.contents table#cartItem td.c-03 a {
    color: #333;
}
.contents table#cartItem td.c-03 ul {
    font-size: 0;
    text-align: center;
}
.contents table#cartItem td.c-03 ul li {
    font-size: 24px;
    display: inline-block;
    margin: 0 5px;
}
.contents table#cartItem td.c-03 ul li.minus-disabled {
    color: #ccc;
}
.contents table#cartItem th.c-04 {
    width: 140px;
}
.contents table#cartItem td.c-04 {
    text-align: right;
    width: 140px;
}

.contents .cart-left table#cartItem th {
    padding: 10px;
}
.contents .cart-left table#cartItem td {
    padding: 10px;
}
.contents .cart-left table#cartItem th.c-02 {
    width: 400px;
}
.contents .cart-left table#cartItem td.c-02 {
    width: 400px;
}
.contents .cart-left table#cartItem th.c-04 {
    width: 100px;
}
.contents .cart-left table#cartItem td.c-04 {
    width: 100px;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・合計                           *
 *                                              *
 * ────────────────────── */

.contents dl#cartTotal {
    font-size: 18px;
    line-height: 1.7;
    font-weight: 700;
    text-align: right;
    margin-bottom: 30px;
}
.contents dl#cartTotal dt {
    display: inline-block;
}
.contents dl#cartTotal dd {
    font-size: 24px;
    color: #d92e2e;
    display: inline-block;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・送料無料条件                   *
 *                                              *
 * ────────────────────── */

.contents #deliveFreeRule {
    font-size: 18px;
    line-height: 1.7;
    background: #eaf6f5;
    text-align: center;
    padding: 15px;
    margin: 0 auto 10px;
    border: 1px solid #ccc;
}
.contents #deliveFreeRule i {
    color: #005ab7;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・購入手続きボタン               *
 *                                              *
 * ────────────────────── */

.contents ul#purchase {
    font-size: 0;
    font-weight: 700;
    text-align: center;
    clear: both;
    margin: 0 auto 120px;
}
.contents ul#purchase li {
    font-size: 18px;
    line-height: 1.7;
    display: inline-block;
    width: 300px;
    margin: 0 20px;
}
.contents ul#purchase li a {
    color: #fff;
    display: block;
    padding: 15px;
    border-radius: 4px;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents ul#purchase li.next a {
    background: #005ab7;
}
.contents ul#purchase li.next a:hover {
    background: #53a8ff;
}
.contents ul#purchase li.prev a {
    background: #aaa;
}
.contents ul#purchase li.prev a:hover {
    background: #bbb;
}
.contents ul#purchase li button {
    font-size: 18px;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・何らかのエラー                 *
 *                                              *
 * ────────────────────── */

.contents .cartError {
    font-size: 16px;
    line-height: 1.7;
    background: rgba(204,0,0, 0.1);
    text-align: center;
    padding: 15px;
    margin: 0 auto 20px;
    border: 1px solid #c00;
}
.contents .cartError i {
    color: #c00;
}
.contents .cartWarning {
    font-size: 16px;
    line-height: 1.7;
    color: #005ab7;
    background: rgba(0,90,183, 0.1);
    text-align: center;
    padding: 15px;
    margin: 0 auto 20px;
    border: 1px solid #005ab7;
}
.contents .cartWarning#orderEnd {
    margin: 0 auto 120px;
}
.contents .cartWarning i {
    color: #005ab7;
}
.contents .cartWarning h3 {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin-bottom: 15px;
}
.contents .cartWarning p#orderNo {
    line-height: 1;
    color: #333;
    background: #fff;
    display: inline-block;
    padding: 10px;
    border: 1px solid #333;
}
.contents #empty {
    font-size: 16px;
    line-height: 1.7;
    text-align: center;
    padding: 15px;
    margin: 0 auto 120px;
    border: 1px solid #ccc;
}

/* ────────────────────── *
 *                                              *
 * カートの中身・左側                           *
 *                                              *
 * ────────────────────── */

.contents .cart-left {
    float: left;
    width: 620px;
    margin-bottom: 120px;
}
.contents .cart-left h3 {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    color: #fff;
    background: #364957;
    clear: both;
    padding: 5px 10px;
    margin-bottom: 15px;
}
.contents .cart-left p.btn-change {
    line-height: 1;
    text-align: center;
    float: right;
}
.contents .cart-left p.btn-change button {
    font-size: 16px;
    color: #333;
    background: #eee;
    display: inline-block;
    padding: 10px 20px;
    border: 1px solid #ccc;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
    cursor: pointer;
}
.contents .cart-left p.btn-change button:hover {
    background: #ccc;
}
.contents .cart-left ul.customer-info {
    font-size: 16px;
    line-height: 1.7;
    width: 500px;
    margin-bottom: 40px;
}
.contents .cart-left ul.customer-info.full {
    width: auto;
}
.contents .cart-left dl.shipping-select {
    font-size: 16px;
    line-height: 1.7;
    display: table;
    table-layout: fixed;
    margin-bottom: 10px;
}
.contents .cart-left dl.shipping-select dt {
    font-weight: 700;
    display: table-cell;
    width: 120px;
}
.contents .cart-left dl.shipping-select dd {
    vertical-align: middle;
    display: table-cell;
}
.contents .cart-left dl.shipping-select dd ul li {
    margin-bottom: 10px;
}
.contents .cart-left dl.shipping-select dd select {
    font-size: 16px;
    width: 250px;
    padding: 5px 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: menulist;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents .cart-left dl.shipping-select dd input[type=radio] {
    margin-right: 10px;
}
.contents .cart-left #payment-notice {
    font-size: 14px;
    line-height: 1.5;
    color: #c00;
    padding: 15px;
    border: 1px solid #c00;
    margin-bottom: 30px;
}
.contents textarea.textarea {
    font-size: 16px;
    width: 100%;
    height: 100px;
    padding: 10px;
    margin-bottom: 40px;
    border: 1px solid #999;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}


/* ────────────────────── *
 *                                              *
 * カートの中身・右側                           *
 *                                              *
 * ────────────────────── */

.contents .cart-right {
    font-size: 18px;
    line-height: 1.7;
    background: #d0dde7;
    float: right;
    width: 300px;
    padding: 15px;
    margin-bottom: 120px;
}
.contents .cart-right table {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}
.contents .cart-right table th {
    font-weight: normal;
    text-align: left;
}
.contents .cart-right table td {
    text-align: right;
}
.contents .cart-right dl {
    font-size: 0;
    text-align: right;
    margin-bottom: 20px;
}
.contents .cart-right dl dt {
    font-size: 18px;
    display: inline-block;
}
.contents .cart-right dl dd {
    font-size: 14px;
    color: #c00;
    display: inline-block;
    margin-left: 10px;
}
.contents .cart-right dl dd strong {
    font-size: 24px;
}
.contents .cart-right ul#purchase {
    margin: 0 auto;
}
.contents .cart-right ul#purchase li {
    width: 100%;
    margin: 0 0 15px;
}
.contents .cart-right ul#purchase li:last-child {
    margin: 0;
}


.contents ul.btn-change {
    text-align: center;
    margin: 0 auto 40px;
}
.contents ul.btn-change li {
    font-size: 16px;
    line-height: 1;
    color: #fff;
    display: inline-block;
    margin: 0 10px;
}
.contents ul.btn-change li #customer-ok button {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: #fff;
    font-weight: 700;
    background: #005ab7;
    padding: 10px;
    width: 150px;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents ul.btn-change li #customer-ok button:hover {
    background: #53a8ff;
}
.contents ul.btn-change li #customer-cancel button {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    color: #fff;
    font-weight: 700;
    background: #aaa;
    padding: 10px;
    width: 150px;
    margin: 0 auto;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents ul.btn-change li #customer-cancel button:hover {
    background: #bbb;
}


/* ────────────────────── *
 *                                              *
 * よくあるご質問                               *
 *                                              *
 * ────────────────────── */

.contents #faq-index {
    font-size: 16px;
    line-height: 1.5;
    clear: both;
    width: 100%;
    margin: 0 auto 50px;
}
.contents #faq-index h3 {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    color: #fff;
    background: #364957;
    clear: both;
    padding: 5px 10px;
    margin-bottom: 15px;
}
.contents #faq-index ul li {
    padding-left: 25px;
    margin-bottom: 10px;
    position: relative;
}
.contents #faq-index ul li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f35a";
    display: inline-block;
    margin-right: 5px;
    position: absolute;
    left: 0;
    top: 0;
}
.contents #faq-index ul li a {
    color: #333;
    text-decoration: underline;
}
.contents #faq-index ul li a:hover {
    text-decoration: none;
}
.contents #faq-index .left {
    float: left;
    width: 480px;
    margin-bottom: 20px;
}
.contents #faq-index .right {
    float: right;
    width: 480px;
    margin-bottom: 20px;
}
.contents .faq {
    font-size: 16px;
    line-height: 1.7;
    background: #d0dde7;
    padding: 30px;
    margin-bottom: 120px;
}
.contents .faq dl dt {
    font-size: 18px;
    font-weight: 700;
    color: #c00;
    padding-left: 75px;
    margin-bottom: 10px;
    position: relative;
}
.contents .faq dl dt:before {
    content: "Q";
    color: #fff;
    font-weight: 400;
    background: #c00;
    text-align: center;
    display: inline-block;
    width: 60px;
    margin-right: 15px;
    border-radius: 4px;
    position: absolute;
    left: 0;
    top: 0;
}
.contents .faq dl dd {
    padding-left: 75px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    border-bottom: 1px dotted #333;
    position: relative;
}
.contents .faq dl dd:before {
    content: "A";
    font-size: 18px;
    color: #fff;
    background: #005ab7;
    text-align: center;
    display: inline-block;
    width: 60px;
    margin-right: 15px;
    border-radius: 4px;
    position: absolute;
    left: 0;
    top: 0;
}
.contents .faq dl dd:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
}
.contents h4.title-faq {
    font-size: 30px;
    font-weight: 700;
    padding-left: 40px;
    margin-bottom: 20px;
    position: relative;
}
.contents h4.title-faq:before {
    content: "";
    background: #333;
    width: 100%;
    height: 3px;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: -1;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}
.contents h4.title-faq span {
    background: #fff;
    padding: 0 15px;
    display: inline-block;
}


/* ────────────────────── *
 *                                              *
 * 食中毒予防ポイント（原因菌）                 *
 *                                              *
 * ────────────────────── */

.contents #virus-index {
    font-size: 16px;
    line-height: 1.5;
    clear: both;
    width: 100%;
    margin: 0 auto 50px;
}
.contents #virus-index h3 {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    color: #fff;
    background: #364957;
    clear: both;
    padding: 5px 10px;
    margin-bottom: 15px;
}
.contents #virus-index ul {
    font-size: 0;
}
.contents #virus-index ul li {
    font-size: 16px;
    display: inline-block;
    padding-left: 25px;
    margin-bottom: 10px;
    margin-right: 20px;
    position: relative;
}
.contents #virus-index ul li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f35a";
    display: inline-block;
    margin-right: 5px;
    position: absolute;
    left: 0;
    top: 0;
}
.contents #virus-index ul li a {
    color: #333;
    text-decoration: underline;
}
.contents #virus-index ul li a:hover {
    text-decoration: none;
}
.contents .virus {
    font-size: 16px;
    line-height: 1.7;
    background: #d0dde7;
    padding: 30px;
    margin-bottom: 120px;
}
.contents .virus p {
    margin-bottom: 20px;
}
.contents .virus dl dt {
    font-size: 18px;
    font-weight: 700;
    color: #ff6e00;
    margin-bottom: 5px;
}
.contents .virus dl dd {
    margin-bottom: 30px;
}
.contents .virus dl dd:last-of-type {
    margin-bottom: 0;
}
.contents .virus dl dd ul li {
    margin-left: 20px;
    list-style-type: disc;
}
.contents .virus .kind {
    background: #fff;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 8px;
}


/* ────────────────────── *
 *                                              *
 * 食中毒予防ポイント（三原則）                 *
 *                                              *
 * ────────────────────── */

#rule {
    background: #d0dde7;
    padding: 50px 0;
}
#rule .inner {
    width: 1000px;
    margin: 0 auto;
}
#rule .inner h3 {
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 60px;
}
#rule .inner dl {
    font-size: 16px;
    line-height: 1.7;
    background: #fff;
    float: left;
    width: 300px;
    padding: 30px;
    margin-left: 50px;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    position: relative;
}
#rule .inner dl:after {
    position: absolute;
    top: -20px;
    right: -40px;
}
#rule .inner dl:nth-of-type(1) {
    margin-left: 0;
}
#rule .inner dl:nth-of-type(1):after {
    content: url("../../image/food-poisoning/icon-rule-01.png");
}
#rule .inner dl:nth-of-type(2):after {
    content: url("../../image/food-poisoning/icon-rule-02.png");
}
#rule .inner dl:nth-of-type(3):after {
    content: url("../../image/food-poisoning/icon-rule-03.png");
}
#rule .inner dl dt {    
    font-size: 30px;
    font-weight: 700;
    color: #c00;
    text-align: center;
    margin-bottom: 20px;
}


/* ────────────────────── *
 *                                              *
 * 食中毒予防ポイント（衛生管理のポイント）     *
 *                                              *
 * ────────────────────── */

#health-point {
    background: #e5e5e5;
    padding: 50px 0;
}
#health-point .inner {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto;
}
#health-point .inner h3 {
    font-size: 30px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 60px;
}
#health-point .inner .point {
    background: #fff;
    padding: 30px;
    margin-bottom: 30px;
    border-radius: 8px;
}
#health-point .inner .point:last-of-type {
    margin-bottom: 0;
}
#health-point .inner .point h4 {
    font-size: 22px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 10px;
}
#health-point .inner .point dl dt {
    font-size: 18px;
    font-weight: 700;
    color: #ff6e00;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ff6e00;
}
#health-point .inner .point dl dd {
    margin-bottom: 30px;
}
#health-point .inner .point dl dd:last-of-type {
    margin-bottom: 0;
}
#health-point .inner .point dl dd ul li {
    margin-left: 20px;
    list-style-type: disc;
}
#health-point .inner .point dl dd ol li {
    margin-left: 25px;
    list-style-type: decimal;
}



/* ────────────────────── *
 *                                              *
 * ご利用ガイド                                 *
 *                                              *
 * ────────────────────── */

.contents .guide {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 60px;
}
.contents .guide dl dt {
    font-size: 18px;
    font-weight: 700;
    color: #c00;
    padding-bottom: 5px;
    margin-bottom: 10px;
    border-bottom: 1px dotted #ccc;
}
.contents .guide dl dd {
    margin-bottom: 30px;
}
.contents .guide ul li {
    margin-left: 20px;
    list-style-type: disc;
}


/* ────────────────────── *
 *                                              *
 * 商品ページ                                   *
 *                                              *
 * ────────────────────── */

.contents #product-intro {
    font-size: 16px;
    line-height: 1.7;
    clear: both;
    width: 100%;
    margin: 0 auto 60px;
}
.contents #product-intro a {
    color: #005ab7;
    text-decoration: underline;
}
.contents #product-intro a:hover {
    text-decoration: none;
}
.contents #product-intro .left {
    float: left;
    width: 580px;
}
.contents #product-intro .left .bx-viewport{
    margin-bottom: 15px;
}
.contents #product-intro .left ul.slider-thumb li {
    float: left;
    width: 104px;
    margin-left: 15px;
    margin-bottom: 15px;
}
.contents #product-intro .left ul.slider-thumb li:nth-child(5n+1) {
    margin-left: 0;
}
.contents #product-intro .right {
    float: right;
    width: 370px;
}
.contents #product-intro .right h3 {
    font-size: 32px;
    line-height: 1.3;
    font-weight: 700;
    margin-bottom: 20px;
}
/*
.contents #product-intro .right .price {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 30px;
}
*/
.contents #product-intro .right .price {
    font-size: 16px;
    font-weight: 500;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.contents #product-intro .right .price h4 {
    color: #fff;
    font-weight: 700;
    background: #333;
    text-align: center;
    padding: 0 5px;
    margin-bottom: 10px;
    border-radius: 4px;
}
.contents #product-intro .right .price ul li {
    margin-left: 20px;
    list-style-type: disc;
}
.contents #product-intro .right dl.description {
    margin-bottom: 30px;
}
.contents #product-intro .right dl.description dt {
    font-size: 18px;
    font-weight: 500;
    color: #c00;
    margin-bottom: 15px;
}
.contents #product-intro .right .different {
    font-size: 13px;
    line-height: 1.6;
    background: #d0dde7;
    padding: 15px;
    margin-bottom: 30px;
}
.contents #product-intro .right .different h4 {
    font-size: 16px;
    font-weight: 700;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #333;
}
.contents #product-intro .right .different p {
    margin-bottom: 10px;
}
.contents #product-intro .right dl.shopping {
    clear: both;
    margin-bottom: 20px;
}
.contents #product-intro .right dl.shopping dt {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 5px;
}
.contents #product-intro .right dl.shopping dd {
    margin-bottom: 10px;
}
.contents #product-intro .right dl.shopping dd select {
    font-size: 16px;
    width: 100%;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: menulist;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents #product-intro .right dl.shopping dd input[type=number] {
    font-size: 18px;
    text-align: right;
    width: 100px;
    padding: 10px 20px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
.contents #product-intro .right p.btn {
    margin-bottom: 10px;
}
.contents #product-intro .right button.add-cart {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 24px;
    color: #fff;
    font-weight: 700;
    background: #005ab7;
    text-align: center;
    padding: 20px 10px;
    width: 100%;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents #product-intro .right button.add-disabled,
.contents #product-intro .right button:disabled {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
    font-size: 24px;
    color: #fff;
    background: #aaa;
    padding: 20px 10px;
    width: 100%;
    margin: 0 auto;
    border: none;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    cursor: pointer;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents #product-intro .right button.add-cart:hover {
    background: #53a8ff;
}
.contents #product-intro .right button:disabled:hover {
    background: #aaa;
}
.contents #product-intro .right p.notice {
    font-size: 13px;
}
.contents #product-intro .right ul.guide-link {
    font-size: 13px;
    float: right;
}
.contents #product-intro .right ul.guide-link li i {
    display: inline-block;
    text-decoration: none;
    margin-right: 5px;
}
.contents #product-intro .right .attention {
    font-size: 13px;
    line-height: 1.6;
    font-weight: bold;
    color: #c00;
    background: #fae5e5;
    padding: 10px;
    margin-bottom: 30px;
    border: 2px solid #c00;
}
.contents #product-intro .right .attention hr {
    background: #333;
    width: 100%;
    height: 1px;
    margin: 10px 0;
    border: none;
}
.contents #product-intro .right .attention-special {
    font-size: 16px;
    line-height: 1.6;
    font-weight: bold;
    color: #c00;
    background: #fae5e5;
    padding: 10px;
    margin-bottom: 30px;
    border: 2px solid #c00;
}
.contents #product-intro .right .attention-special hr {
    background: #333;
    width: 100%;
    height: 1px;
    margin: 10px 0;
    border: none;
}
.contents #product-intro .right .attention-special h3 {
    font-size: 18px;
    text-align: center;
}
.contents #product-intro .right .attention-special h3 i {
    font-size: 24px;
}
.contents #product-intro .right .attention-special ul li {
    color: #333;
    margin-left: 25px;
    margin-bottom: 10px;
    list-style-type: disc;
}
.contents #product-intro .right .attention-special ul li span.underline {
    border-bottom: 1px solid #c00;
}

/* ────────────────────── *
 *                                              *
 * 商品：F-1＞特徴                              *
 *                                              *
 * ────────────────────── */

#character-f1 {
    background: url("../../image/product/f1/bg-character.jpg") no-repeat center center / cover;
    clear: both;
    width: 100%;
    padding: 70px 0 40px;
}
#character-f1 h4 {
    text-align: center;
    margin: 0 auto 30px;
}
#character-f1 h4 span {
    font-size: 20px;
    line-height: 44px;
    font-weight: 500;
    color: #005ab7;
    background: url("../../image/product/f1/bg-fukidashi.png") no-repeat center top ;
    display: inline-block;
    letter-spacing: 2px;
    width: 290px;
    height: 60px;
    margin: 0 auto 10px;
}
#character-f1 h4 img {
    display: block;
    margin: 0 auto;
}
#character-f1 ol {
    width: 1000px;
    margin: 0 auto;
}
#character-f1 ol li {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    background: url("../../image/product/f1/bg-merit.png") no-repeat center center;
    float: left;
    width: 210px;
    height: 120px;
    padding-left: 110px;
    margin-left: 20px;
    margin-bottom: 30px;
    position: relative;
}
#character-f1 ol li:nth-child(3n+1) {
    margin-left: 0;
}
#character-f1 ol li:before {
    font-size: 50px;
    line-height: 85px;
    font-weight: 700;
    color: #1d2d7d;
    text-align: center;
    width: 85px;
    height: 85px;
    position: absolute;
    left: 13px;
    top: 26px;
}
#character-f1 ol li:nth-child(1):before {
    content: "01";
}
#character-f1 ol li:nth-child(2):before {
    content: "02";
}
#character-f1 ol li:nth-child(3):before {
    content: "03";
}
#character-f1 ol li:nth-child(4):before {
    content: "04";
}
#character-f1 ol li:nth-child(5):before {
    content: "05";
}
#character-f1 ol li:nth-child(6):before {
    content: "06";
}
#character-f1 ol li div {
    vertical-align: middle;
    display: table-cell;
    width: 320px;
    height: 120px;
    padding: 0 15px;
}
#character-f1 ol li div span {
    font-size: 12px;
    display: block;
}


/* ────────────────────── *
 *                                              *
 * 商品：F-1＞特許                              *
 *                                              *
 * ────────────────────── */

#patent-f1 {
    background: url("../../image/product/f1/bg-patent.jpg") no-repeat center center / cover;
    clear: both;
    width: 100%;
    padding: 70px 0;
}
#patent-f1 h4 {
    text-align: center;
    margin: 0 auto 30px;
}
#patent-f1 h4 span {
    font-size: 20px;
    line-height: 44px;
    font-weight: 500;
    color: #005ab7;
    background: url("../../image/product/f1/bg-fukidashi.png") no-repeat center top ;
    display: inline-block;
    letter-spacing: 2px;
    width: 290px;
    height: 60px;
    margin: 0 auto 10px;
}
#patent-f1 h4 img {
    display: block;
    margin: 0 auto;
}
#patent-f1 .inner {
    font-size: 18px;
    line-height: 1.7;
    font-weight: 500;
    width: 1000px;
    margin: 0 auto;
}
#patent-f1 .inner figure {
    float: left;
    margin-right: 40px;
}
#patent-f1 .inner p {
    margin-bottom: 30px;
    overflow: hidden;
}


/* ────────────────────── *
 *                                              *
 * 商品：F-1＞使用例                            *
 *                                              *
 * ────────────────────── */

#use-f1 {
    clear: both;
    width: 100%;
    padding: 70px 0;
}
#use-f1 h4 {
    font-size: 30px;
    font-weight: 700;
    color: #005ab7;
    text-align: center;
    width: 1000px;
    padding: 20px 0;
    margin: 0 auto 30px;
    border-top: 2px solid #005ab7;
    border-bottom: 2px solid #005ab7;
}
#use-f1 .bx-viewport {
    margin-bottom: 60px;
}
#use-f1 p {
    text-align: center;
}
#use-f1 p a {
    font-size: 18px;
    line-height: 1;
    color: #fff;
    background: #005ab7;
    display: inline-block;
    width: 400px;
    padding: 25px 0;
    border-radius: 12px;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
#use-f1 p a:hover {
    background: #53a8ff;
}


/* ────────────────────── *
 *                                              *
 * 商品：詳細                                   *
 *                                              *
 * ────────────────────── */

#product-detail {
    background: #e5e5e5;
    clear: both;
    width: 100%;
    padding: 100px 0;
}
#product-detail .inner {
    background: #fff;
    width: 1000px;
    margin: 0 auto 100px;
    display: flex;
    flex-direction: row;
}
#product-detail .inner:last-of-type {
    margin: 0 auto;
}
#product-detail .inner p.photo {
    vertical-align: top;
    /*display: table-cell;*/
    width: 400px;
    flex-basis: 400px;
    order: 1;
}
#product-detail .inner .description {
    font-size: 14px;
    line-height: 1.7;
    vertical-align: middle;
    /*display: table-cell;*/
    padding: 30px;
    width: 540px;
    flex-basis: 540px;
    order: 2;
}
#product-detail .inner .description.nophoto {
    width: auto;
    flex-basis: auto;
}
#product-detail .inner.even p.photo {
    order: 2;
}
#product-detail .inner.even .description {
    order: 1;
}
#product-detail .inner .description h5 {
    font-size: 24px;
    line-height: 1.4;
    font-weight: 700;
    margin-bottom: 20px;
}
#product-detail .inner .description ol li {
    margin-left: 20px;
    margin-bottom: 5px;
    list-style-type: decimal;
}
#product-detail .inner .description ul li {
    margin-left: 20px;
    margin-bottom: 5px;
    list-style-type: disc;
}


/* ────────────────────── *
 *                                              *
 * 商品：データ＞F-1                            *
 *                                              *
 * ────────────────────── */

#data-f1 {
    background: url("../../image/product/f1/bg-data.png") repeat;
    clear: both;
    width: 100%;
    padding: 100px 0;
}
#data-f1 h4 {
    font-size: 30px;
    font-weight: 700;
    color: #005ab7;
    text-align: center;
    width: 1000px;
    padding: 20px 0;
    margin: 0 auto 30px;
    border-top: 2px solid #005ab7;
    border-bottom: 2px solid #005ab7;
}
#data-f1 .inner {
    width: 1000px;
    margin: 0 auto;
}
#data-f1 .inner h5 {
    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
    padding-left: 10px;
    margin-bottom: 30px;
    border-left: 4px solid #1d2d7d;
}
#data-f1 .inner p:last-of-type {
    margin-bottom: 70px;
}
#data-f1 .inner #test-result {
    font-size: 16px;
    line-height: 1.5;
    width: 740px;
    padding: 40px;
    margin: 0 auto;
    border: 2px solid #bac2c8;
    border-radius: 4px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#data-f1 .inner #test-result ul li {
    padding-left: 30px;
    margin-bottom: 15px;
    position: relative;
}
#data-f1 .inner #test-result ul li:before {
    font-size: 0;
    content: url("../../image/product/f1/icon-result.png");
    display: inline-block;
    position: absolute;
    left: 0;
    top: 3px;
}
#data-f1 .inner #test-result ul li a:after {
    content: "ダウンロード";
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: #005ab7;
    display: inline-block;
    padding: 5px;
    border-radius: 4px;
    position: absolute;
    right: 0;
    top: 0;
}
#data-f1 .inner #test-result ul li a {
    color: #333;
}
#data-f1 .inner #test-result ul li a:hover {
    text-decoration: underline;
}


/* ────────────────────── *
 *                                              *
 * 商品：データ＞野菜クリーン                   *
 *                                              *
 * ────────────────────── */

#data-vegetable {
    background: url("../../image/product/f1/bg-data.png") repeat;
    clear: both;
    width: 100%;
    padding: 100px 0;
}
#data-vegetable .inner {
    font-size: 16px;
    line-height: 1.5;
    width: 1000px;
    margin: 0 auto;
}
#data-vegetable .inner h5 {
    display: table;
    margin-bottom: 30px;
}
#data-vegetable .inner h5 span {
    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
    vertical-align: middle;
    display: table-cell;
    padding-left: 10px;
    border-left: 4px solid #1d2d7d;
}
#data-vegetable .inner p {
    font-size: 12px;
    line-height: 1.5;
    text-align: right;
}
#data-vegetable .inner .left {
    float: left;
    width: 480px;
}
#data-vegetable .inner .right {
    float: right;
    width: 480px;
}
#data-vegetable .inner table {
    background: #fff;
    width: 100%;
    margin-bottom: 10px;
    border-spacing: 1px;
    border-collapse: separate;
}
#data-vegetable .inner table tr {
    background: #eaf6f5;
}
#data-vegetable .inner table tr:nth-child(odd) {
    background: #e5e5e5;
}
#data-vegetable .inner table th {
    background: #9ad7e8;
    padding: 5px 10px;
}
#data-vegetable .inner table td {
    text-align: center;
    width: 33.33333333333333%;
    padding: 5px 10px;
}


/* ────────────────────── *
 *                                              *
 * 商品：まほうの水の使い方                     *
 *                                              *
 * ────────────────────── */

#use-magicwater {
    background: url("../../image/product/f1/bg-data.png") repeat;
    clear: both;
    width: 100%;
    padding: 100px 0;
}
#use-magicwater h4 {
    font-size: 30px;
    font-weight: 700;
    color: #005ab7;
    text-align: center;
    width: 1000px;
    padding: 20px 0;
    margin: 0 auto 30px;
    border-top: 2px solid #005ab7;
    border-bottom: 2px solid #005ab7;
}
#use-magicwater ul {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto 50px;
}
#use-magicwater ul li {
    float: left;
    width: 300px;
    margin-left: 50px;
}
#use-magicwater ul li:first-child {
    margin-left: 0;
}
#use-magicwater ul li .photo {
    margin-bottom: 10px;
    position: relative;
}
#use-magicwater ul li .photo:after {
    font-family: "Font Awesome 5 Free";
    font-size: 30px;
    line-height: 1;
    content: "\f061";
    font-weight: 900;
    text-align: center;
    display: inline-block;
    width: 50px;
    position: absolute;
    left: 100%;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}
#use-magicwater ul li:last-child .photo:after {
    content: none;
}
#use-magicwater #after {
    background: #d0dde7;
    width: 660px;
    padding: 20px;
    margin: 0 auto;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#use-magicwater #after ul {
    width: 100%;
    margin-bottom: 0;
}
#use-magicwater #after ul li:last-child {
    margin-left: 20px;
}
#use-magicwater #after ul li .photo:after {
    content: none;
}

/* ────────────────────── *
 *                                              *
 * 商品：使用例                                 *
 *                                              *
 * ────────────────────── */

#use-notice {
    clear: both;
    width: 100%;
    padding: 30px 0;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#use-notice h6 {
    font-size: 30px;
    font-weight: 500;
    color: #d92e2e;
    width: 1000px;
    margin: 0 auto 10px;
}
#use-notice .inner {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto;
}
#use-notice .inner ul li {
    margin-left: 20px;
    margin-bottom: 10px;
    list-style-type: disc;
}


/* ────────────────────── *
 *                                              *
 * 商品一覧                                     *
 *                                              *
 * ────────────────────── */

.contents #product-list {
    width: 1000px;
    margin: 0 auto 50px;
}
.contents #product-list ul.list li {
    float: left;
    width: 300px;
    margin-left: 50px;
    margin-bottom: 50px;
}
.contents #product-list ul.list li:nth-child(3n+1) {
    margin-left: 0;
}
.contents #product-list ul.list li .photo {
    margin-bottom: 10px;
}
.contents #product-list ul.list li .name {
    font-size: 18px;
    line-height: 1.4;
    font-weight: 700;
    margin-bottom: 10px;
}
.contents #product-list ul.list li .name a {
    color: #005ab7;
}
.contents #product-list ul.list li .name a:hover {
    text-decoration: underline;
}
.contents #product-list ul.list li .description {
    font-size: 13px;
    line-height: 1.5;
    margin-bottom: 10px;
}
.contents #product-list ul.list li .price {
    margin-bottom: 10px;
}
.contents #product-list ul.list li .btn a {
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: #fff;
    background: #005ab7;
    text-align: center;
    display: block;
    padding: 15px 10px;
    border-radius: 4px;
    -webkit-transition: all .5s ease;
            transition: all .5s ease;
}
.contents #product-list ul.list li .btn a:hover {
    background: #53a8ff;
}


/* ────────────────────── *
 *                                              *
 * 商品：スパイラルミスト＞特徴                 *
 *                                              *
 * ────────────────────── */

#character-mist {
    background: #c7e8ef;
    padding: 70px 0;
}
#character-mist h4 {
    text-align: center;
    margin: 0 auto 30px;
}
#character-mist .inner {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto;
}
#character-mist .inner dl {
    background: #fff url("../../image/product/mist/bg-character.png") no-repeat 20px 20px;
    padding: 20px 20px 20px 115px;
    margin: 0 auto 30px;
    position: relative;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#character-mist .inner dl dt {
    font-size: 26px;
    line-height: 1.4;
    font-weight: 700;
    color: #005ab7;
    padding-top: 15px;
    margin-bottom: 20px;
}
#character-mist .inner dl dt:before {
    font-size: 30px;
    line-height: 70px;
    font-weight: 500;
    color: #1d2d7d;
    text-align: center;
    width: 70px;
    height: 70px;
    position: absolute;
    left: 20px;
    top: 20px;
}
#character-mist .inner dl:nth-child(1) dt:before {
    content: "01";
}
#character-mist .inner dl:nth-child(2) dt:before {
    content: "02";
}
#character-mist .inner dl:nth-child(3) dt:before {
    content: "03";
}
#character-mist .inner dl:nth-child(4) dt:before {
    content: "04";
}
#character-mist .inner dl:nth-child(5) dt:before {
    content: "05";
}
#character-mist .inner dl dd ul li {
    margin-left: 20px;
    list-style-type: disc;
}



/* ────────────────────── *
 *                                              *
 * 商品：スパイラルミスト＞使用箇所例           *
 *                                              *
 * ────────────────────── */

#use-mist {
    clear: both;
    padding: 70px 0 30px;
}
#use-mist h4 {
    text-align: center;
    margin: 0 auto 30px;
}
#use-mist ul {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 500;
    color: #c00;
    width: 1000px;
    margin: 0 auto;
}
#use-mist ul li {
    text-align: center;
    float: left;
    width: 320px;
    margin-left: 20px;
    margin-bottom: 40px;
}
#use-mist ul li:nth-child(3n+1) {
    margin-left: 0;
}
#use-mist ul li img {
    margin-bottom: 10px;
}


/* ────────────────────── *
 *                                              *
 * 商品：サットクリーン＞特徴                   *
 *                                              *
 * ────────────────────── */

#character-satcrean {
    background: #c7e8ef;
    padding: 70px 0;
}
#character-satcrean h4 {
    text-align: center;
    margin: 0 auto 30px;
}
#character-satcrean .inner {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto;
}
#character-satcrean .inner dl {
    background: #fff url("../../image/product/mist/bg-character.png") no-repeat 20px 20px;
    padding: 20px 20px 20px 115px;
    margin: 0 auto 30px;
    position: relative;
    border-radius: 8px;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
#character-satcrean .inner dl dt {
    font-size: 26px;
    line-height: 1.4;
    font-weight: 700;
    color: #005ab7;
    padding-top: 15px;
    margin-bottom: 20px;
}
#character-satcrean .inner dl dt:before {
    font-size: 30px;
    line-height: 70px;
    font-weight: 500;
    color: #1d2d7d;
    text-align: center;
    width: 70px;
    height: 70px;
    position: absolute;
    left: 20px;
    top: 20px;
}
#character-satcrean .inner dl:nth-child(1) dt:before {
    content: "01";
}
#character-satcrean .inner dl:nth-child(2) dt:before {
    content: "02";
}
#character-satcrean .inner dl:nth-child(3) dt:before {
    content: "03";
}
#character-satcrean .inner dl:nth-child(4) dt:before {
    content: "04";
}
#character-satcrean .inner dl:nth-child(5) dt:before {
    content: "05";
}


/* ────────────────────── *
 *                                              *
 * 商品：お客様の声                             *
 *                                              *
 * ────────────────────── */

#voice {
    background: #ffffdf;
    clear: both;
    width: 100%;
    padding: 70px 0;
}
#voice h4 {
    font-size: 30px;
    font-weight: 700;
    color: #005ab7;
    text-align: center;
    width: 1000px;
    padding: 20px 0;
    margin: 0 auto 30px;
    border-top: 2px solid #005ab7;
    border-bottom: 2px solid #005ab7;
}
#voice .inner {
    font-size: 16px;
    line-height: 1.7;
    width: 1000px;
    margin: 0 auto;
}
#voice .inner p {
    margin-bottom: 20px;
}
#voice .inner ul li {
    margin-bottom: 20px;
    margin-left: 20px;
    list-style-type: disc;
}
#voice .inner ul li:last-child {
    margin-bottom: 0;
}
#voice .inner ol li {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 20px;
}
#voice .inner ol li:nth-child(1) {
    color: #c00;
}
#voice .inner ol li:nth-child(3) {
    margin-bottom: 0;
}
#voice .inner ol li:before {
    font-size: 0;
    vertical-align: bottom;
    margin-right: 10px;
}
#voice .inner ol li:nth-child(1):before {
    content: url("../../image/product/icon-crown-01.png");
}
#voice .inner ol li:nth-child(2):before {
    content: url("../../image/product/icon-crown-02.png");
}
#voice .inner ol li:nth-child(3):before {
    content: url("../../image/product/icon-crown-03.png");
}


/* ────────────────────── *
 *                                              *
 * クレジットカード決済                         *
 *                                              *
 * ────────────────────── */

#yamato_payment4_credit {
    font-size: 16px;
    line-height: 1.6;
    background: rgba(0,90,183, 0.2);
    padding: 20px;
    margin-bottom: 50px;
}
#yamato_payment4_credit h2 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 10px;
}
#yamato_payment4_credit p.notice {
    font-size: 14px;
    font-weight: bold;
    color: #c00;
    margin-bottom: 10px;
}
#yamato_payment4_credit dl {
    border-bottom: 1px dotted #333;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
#yamato_payment4_credit dl#detail_box__method {
    border-bottom: none;
}
#yamato_payment4_credit dl dt {
    font-weight: 700;
    text-align: left;
    vertical-align: top;
    width: 200px;
    padding: 20px 15px;
    position: relative;
    flex-shrink: 0;
}
#yamato_payment4_credit dl dt span.ec-required {
    content: "必須";
    font-size: 12px;
    line-height: 1;
    color: #fff;
    background: #c00;
    padding: 5px;
    border-radius: 4px;
    position: absolute;
    right: 10px;
    top: 22px;
}
#yamato_payment4_credit dl dd {
    text-align: left;
    vertical-align: top;
    width: 100%;
    padding: 15px;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#yamato_payment4_credit dl dd p {
    font-size: 13px;
    margin-top: 5px;
}
#yamato_payment4_credit dl dd input[type=text] {
    font-size: 16px;
    width: 100%;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: none;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#yamato_payment4_credit dl dd input[type=text]#shopping_order_security_code {
    width: 70px;
}
#yamato_payment4_credit dl dd select {
    font-size: 16px;
    width: 150px;
    padding: 10px;
    border: 1px solid #999;
    border-radius: 4px;
    -webkit-appearance: menulist;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#yamato_payment4_credit dl dd select#shopping_order_card_exp_month,
#yamato_payment4_credit dl dd select#shopping_order_card_exp_year {
    width: 70px;
}