@charset "utf-8";

.price-red {
    color: red;
}

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

    .contents-wrapper {
        width: 100%;
    }

    .top-desc {
        text-align: center;
    }

    .set-contents {
        margin: 20px 0;
        background: #f7f7f7;
    }

    .set-title {
        text-align: center;
    }

    .set-h3 {
        background: #f7f7f7;
        color: #000;
        margin-bottom: 0;
        font-size: 3rem;
        padding: 10px 0;
        font-weight: bold;
    }

    .set-box {
        display: flex;
        justify-content: space-evenly;
    }

    .set-box p {
        text-align: center;
    }

    .set-box img {
        width: 90%;
    }

    /* メインコンテンツ */

    .main-contents h4 {
        font-size: 1.6rem;
    }

    .item-description {
        display: flex;
        padding: 30px 0;
    }

    .item-name {
        font-weight: bold;
    }

    .item-name span {
        background: linear-gradient(transparent 60%, #FFF1A3 60%);
        font-weight: bold;
    }

    .itemtitle {
        padding: 0;
    }

    .spcart_price {
        padding: 20px 0;
    }

    .meas-item {
        padding: 10px;
        background: #fff;
    }

    .meas-item p {
        display: inline-block;
        height: auto;
        margin: 0;
    }

    .main-box {
        margin-bottom: 30px;
        padding: 0 0 20px 0;
    }

    .main-block {
        width: 100%;
    }

    .main-block table {
        width: 100%;
        margin-top: 20px;
        border-collapse: collapse;
        border-spacing: 10px 0;
    }

    .main-block table tbody {
        display: flex;
        justify-content: space-around;
    }

    .main-block tr {
        width: 45%;
    }

    .main-block table th {
        position: relative;
        padding: 20px;
        background: #f7f7f7;
        text-align: left;
    }

    .main-block table td {
        padding: 20px;
    }

    .main-block table th,
    .main-block table td {
        font-weight: bold;
        display: block;
    }

    .adjust-table tbody tr{
        width: 100% !important;
    }

    .adjust-price {
        margin-bottom: 20px;
        padding: 0 !important;
        border-bottom: 2px solid #000;
    }

    .adjust-flex {
        display: flex;
        justify-content: space-evenly;
        clear: both;
    }

    .adjust-wrap {
        width: 100%;
        padding: 20px;
        border: 1px solid ;
    }

    .piano-border2 {
        border: none;
    }

    .piano-img {
        position: absolute;
        width: 70px;
        top: 0;
        right: 5%;
    }

    .piano-img2 {
        width: 100px;
        display: flex;
        margin: 0 auto;
    }

    .piano-img2 img {
        display: block
    }

    .promis {
        margin-top: 20px;
    }

    .piano-border {
        clear: both;
        border: 1px solid #000;
    }

    .adjust-price {
        float: right;
        font-weight: bold;
    }

    .piano-h4 {
        font-size: 3rem;
        font-weight: bold;
    }

    .main-desc {

        margin: 30px 0 20px 0;
    }

    .main-border {
        border: 1px solid;
        padding: 10px;
        border-radius: 10px;
    }

    .main2-desc {
        margin: 15px 0;
    }

    .main2-desc {
        padding: 20px;
    }

    .main-block2 table {
        width: 100%;
        height: auto;
        margin-top: 30px;
        border-collapse: collapse;
        border-spacing: 15px 0px;
        table-layout: fixed;
    }

    .main-block2 table tbody {
        display: flex;
        justify-content: space-around;
    }

    .main-block2 tr {
        width: 45%;
        table-layout: auto;
    }

    .main-block2 table th {
        padding: 20px;
        border: 1px solid #000;
        background: #f7f7f7;
        table-layout: auto;
        text-align: left;
        display: table-cell;
    }

    .main-block2 table td {
        padding: 20px;
        border: 1px solid #000;
        display: table-cell;
        font-weight: bold;
    }

    .main-block2 table th,
    .main-block2 table td {
        display: block;
        word-wrap: break-word;
        /* IEやFirefox対応用 */
        overflow-wrap: break-word;
        overflow: hidden;
    }

    .spcart {
        justify-content: space-evenly;
    }

    .spcart_color {
        padding-top: 20px;
    }

    .spcart_select {
        margin-bottom: 10px;
        position: relative;
        /* border: 1px solid #bbbbbb; */
        border-radius: 2px;
        background: #ffffff;
        width: 100%;
        height: 30px;
    }

    .large--ibox__btn {
        margin: 20px 0;
        text-align: center;
    }

    .large--ibox__btn button {
        background: #c40201;
        display: block;
        border-radius: 6px;
        font-weight: bold;
        color: #fff !important;
        box-shadow: 0 5px 0 0 #800100;
        filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.2));
        text-decoration: none;
        margin: 0 auto;
        padding: 10px;
    }

    .spcart_select select {
        width: 100%;
    }

    .main2-comment {
        margin: 0;
        color: #000;
        text-align: center;
        padding: 20px;
        font-size: 2.4rem;
        font-weight: bold;
    }

    .main2-comment mark {
        background: linear-gradient(transparent 75%, #ffadad 75%);
    }

    .main2-wrap {
        border: 2px solid #ccc;
        border-radius: 10px;
        margin-bottom: 30px;
    }

    .main2-img {
        display: flex;
        justify-content: space-evenly;
    }

    .main-2-img p {
        margin: 0;
    }

    .spcart_col2 {
        padding: 0;
        margin: 0;
    }

    .show-item {
        margin-top: 40px;
        margin-bottom: 20px;
        padding-bottom: 10px;
    }

    .item-title2 {
        margin: 0px auto -40px auto;
        font-weight: bold;
        position: relative;
        padding: 20px;
        background: #f7f7f7;
        text-align: left;
        display: inline-block;
        width: 100%;
    }

    .item-title2 p {
        font-size: 2.2rem;
        text-align: center;
    }

    .nece-item {
        font-weight: bold;
        padding: 30px 0 0 20px;
    }

    .div-price {
        float: right;
        font-weight: bold;
        border-bottom: 2px solid #000;
        margin-right: 30px;
        margin-bottom: 20px;
    }

    .show-item ul {
        margin: 0;
        padding: 0;
    }


    .show-item ul li img {
        width: 100%;
    }

    .item-wrap {
        font-size: 1.9rem;
        padding: 15px;
    }

    .item-wrap2 {
        width: 100%;
        padding: 30px 0;
        display: grid;
        grid-template-columns: repeat(2, 50%);
    }

    .item-container2 {
        width: 90%;
        margin: 0 auto;
        border: 1px solid #000;
        word-wrap: break-word;
        background: #e0dfdf;
    }

    .item-img-wrap {
        padding: 0;
    }

    .main3-wrap {
        border: 2px solid #ccc;
        border-radius: 10px;
    }

    .main3-box {
        padding-top: 10px;
    }

    .main3-img {
        width: 100%;
    }

    .main3-desc {
        width: 90%;
        margin: 20px auto;
    }

    .show-item3 {
        margin-bottom: 20px;
        border: 1px solid #ccc;
    }

    .show-item3 ul {
        margin: 0;
        padding: 0;
    }

    .spcart_col3 li {
        border: 2px solid #ccc;
        padding: 1%;
        list-style: none;
        background: #e0dfdf;
    }

    .show-item3 ul li img {
        width: 100%;
    }

    .col3_table {
        width: 100%;
        line-height: 2rem;
    }

    table.row th,
    table.row td {
        width: 100%;
        display: block;
    }

    .spcart_col3 tr th {
        width: 100%;
        padding: 20px;
        text-align: center;
        background: #f7b700;
    }

    .adjust-td {
        line-height: 2;
        font-weight: bold;
    }

    .piano-adjust {
        margin-bottom: 20px;
        overflow: hidden;
    }

    .total-price {
        margin-top: 40px;
        font-size: 3rem;
        font-weight: bold;
        text-align: center;
    }
}

@media screen and (max-width: 676px) {
    .contents-wrapper {
        width: 100%;
        margin: 0 auto;
    }

    .top-desc {
        text-align: center;
    }

    .set-title {
        text-align: center;
    }

    .set-title h3 {
        color: #fff;
        margin-bottom: 0;
        font-size: 1.5rem;
    }

    .set-box {
        display: flex;
        justify-content: space-evenly;
    }

    .set-box p {
        text-align: center;
    }

    .set-box img {
        width: 90%;
    }

    .set-contents {
        margin-top: 20px;
        background: #f7f7f7;
    }

    .set-h3 {
        color: #000;
        margin: 0;
        padding: 10px 0;
        font-weight: bold;
    }

    /* メインコンテンツ */

    .main-contents h4 {
        font-size: 1.6rem;
    }

    .item-description {
        font-size: 1.4rem;
        /* padding: 20px 0; */
    }

    .item-name {
        font-size: 1.2rem;
        font-weight: bold;
    }


    .item-name span {
        font-size: 1.7rem;
        font-weight: bold;
        background: linear-gradient(transparent 75%, #ffadad 75%);
    }

    .item-dott {
        display: none;
    }

    .spcart_price {
        padding-bottom: 10px;
    }

    .meas-item {
        padding: 10px;
        background: #fff;
    }

    .meas-item p {
        display: inline-block;
        height: auto;
        margin: 0;
    }

    .main-box {

        margin: 30px 0;
        padding: 0 0 0px 0;
    }

    .main-block {
        width: 100%;
    }

    .main-desc {
        padding: 30px 0 0 0;
    }

    .main-block table {
        width: 100%;
        border-collapse: collapse;
        border-spacing: 10px 0;
    }

    .main-block tr {
        width: 100%;
        margin-top: 40px;
        display: block;
    }

    .main-block table th {
        position: relative;
        padding: 20px;
        background: #f7f7f7;
        text-align: left;
    }

    .piano-img {
        position: absolute;
        width: 50px;
        top: 15%;
        right: 5%;
    }

    .piano-img2 {
        width: 100px;
        display: flex;
        margin: 0 auto;
    }

    .piano-img2 img {
        display: block
    }

    .piano-block {
        display: flex;
        border: 1px solid #000;
    }

    .main-block table td {
        padding: 20px;
    }

    .main-block table th,
    .main-block table td {
        display: block;
    }

    .piano-border {
        clear: both;
        border: 1px solid #000;
    }
    .piano-border2 {
        padding: 0;
    }

    .piano-h4 {
        font-size: 2rem;
        font-weight: bold;
    }

    .main-border {
        border: 1px solid #000;
        border-radius: 10px;
        padding: 10px;
    }

    .main-border p {
        margin: 0;
    }

    .adjust-price {
        float: right;
        font-weight: bold;
        border-bottom: 2px solid #000;
        margin-bottom: 20px;
        padding: 0 0 5px 0 !important;

    }

    .adjust-flex{
        display: flex;
        clear: both;
    }

    .adjust-wrap {
        border: 1px solid #000;
        margin-bottom: 20px;
        padding: 20px;
    }

    .main-block2 table {
        width: 100%;
        height: auto;
        margin-top: 30px;
        border-collapse: collapse;
        border-spacing: 15px 0px;
        table-layout: fixed;
    }

    .main-block2 tr {
        width: 47%;
        display: block;
        margin: 30px auto 0 auto;
        margin-top: 30px;
        table-layout: auto;
    }

    .main-block2 table th {
        padding: 10px;
        border: 1px solid #000;
        background: #f7f7f7;
        table-layout: auto;
        text-align: left;
        display: table-cell;
    }

    .main-block2 table td {
        display: block;
        padding: 1%;
        font-weight: bold;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .main-block2 table th,
    .main-block2 table td {
        padding: 0 10px;
        display: block;
        border: 1px solid #000;
        word-wrap: break-word;
        /* IEやFirefox対応用 */
        overflow-wrap: break-word;
    }

    .main-block2 table td select {
        font-size: 1.4rem;
    }

    .main-block2 table tbody {
        display: flex;
    }

    .spcart {
        justify-content: space-evenly;
    }

    .large--ibox__btn {
        text-align: center;
    }

    .large--ibox__btn button {
        background: #c40201;
        display: block;
        border-radius: 6px;
        font-size: 2rem;
        font-weight: bold;
        color: #fff !important;
        box-shadow: 0 5px 0 0 #800100;
        filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.2));
        text-decoration: none;
        margin: 0 auto;
        padding: 10px;
    }

    .spcart_select select {
        width: 100%;
    }

    .main2-comment {
        margin: 0 0 20px 0;
        padding: 20px 0;
        color: #000;
        text-align: center;
        font-weight: bold;
        font-size: 2rem;
}

    .main2-comment mark {
        background: linear-gradient(transparent 75%, #ffadad 75%);
    }

    .main2-wrap {
        margin-bottom: 30px;
    }

    .main2-desc {
        padding: 20px 0;
    }

    .main2-img p {
        margin: 0;
    }

    .spcart_col2 {
        padding: 0;
        margin: 0;
    }

    .show-item {
        margin-top: 40px;
    }

    .item-title2 {
        margin: 0px auto -40px auto;
        font-weight: bold;
        position: relative;
        padding: 20px;
        background: #f7f7f7;
        text-align: left;
        display: inline-block;
        width: 100%;
    }

    .piano-img2 {
        display: flex;
    }

    .show-item ul {
        margin: 0;
        padding: 0;
    }


    .show-item ul li img {
        width: 100%;
    }

    .nece-item {
        font-weight: bold;
        padding: 30px 0 0 20px;
    }

    .div-price {
        float: right;
        font-weight: bold;
        border-bottom: 2px solid #000;
        margin-bottom: 20px;
    }

    .div-price p {
        margin-bottom: 0;
    }

    .item-wrap {
        padding: 0 15px 15px 15px;
    }

    .item-wrap2 {
        width: 100%;
        padding: 30px 0;
        display: grid;
        grid-template-columns: repeat(2, 50%);
    }

    .item-container2 {
        width: 90%;
        margin: 0 auto;
        border: 1px solid #000;
        word-wrap: break-word;
        background: #e0dfdf;
    }

    .item-img-wrap {
        padding: 0;
    }

    .main3-box {
        padding-top: 10px;
    }

    .main3-img {
        width: 100%;
    }

    .main3-desc {
        width: 100%;
        padding: 20px 0;
    }

    .show-item3 {
        border: 1px solid #ccc;
    }

    .show-item3 ul {
        margin: 0;
        padding: 0;
    }

    .spcart_col3 li {
        border: 2px solid #ccc;
        padding: 1%;
        list-style: none;
        background: #e0dfdf;
    }

    .show-item3 ul li img {
        width: 100%;
    }

    .col3_table {
        width: 100%;
        line-height: 2rem;
    }

    table.row th,
    table.row td {
        width: 100%;
        display: block;
    }

    .spcart_col3 tr th {
        width: 100%;
        padding: 20px;
        text-align: center;
        background: #f7b700;
    }

    .adjust-td {
        line-height: 2;
        font-weight: bold;
    }

    .piano-adjust {
        padding-bottom: 20px;
    }

    .total-price {
        margin-top: 40px;
        font-size: 2rem;
        font-weight: bold;
        text-align: center;
    }

    .promis {
        padding-top: 20px;
    }
}