@charset "utf-8";
/* CSS Document */
/* タブレット
-------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1279px) {
    img {
        max-width: 100%;
        height: auto;
    }
    .br {
        display: none;
    }
    .contents .fat-nav {
        width: 18%;
    }
    .mainbody {
        width: 78%;
    }
}
/* タブレット
-------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 979px) {
    .mainbody {
        width: 100%;
    }
}
/* スマートフォン
-------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 767px) {
    body {
        font-size: 1.5rem;
        padding-top: 110px;
    }
    /* header
------------------------------------------------- */
    aside.sns ul {
        list-style: none;
        max-width: 1280px;
        margin: auto;
        display: flex;
        justify-content: flex-end;
    }
    aside.sns ul li:last-child {
        border-left: none;
    }
    #header_in {
        padding: 0;
    }
    #header_in h1 {
        width: 80px;
        padding: 10px 0 10px 4%;
    }
    ul.global_menu li a {
        padding: 10px 20px;
    }
    ul.global_menu li:last-child a {
        border-right: none;
    }
    .contents {
        margin: 30px auto 100px;
        flex-direction: column;
    }
    /* 左メニュー
------------------------------------------------- */
    .contents .fat-nav {
        width: auto;
    }
    ul.sidemenu li a {
        padding: 15px 10px 15px 35px;
        text-decoration: none;
        color: #333;
        display: block;
        border-bottom: solid 1px #e4e4e4;
        position: relative;
    }
    ul.sidemenu li a:hover {
        background-color: #efefef;
    }
    ul.sidemenu li a::before {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 7px;
        margin: auto;
        content: "";
        vertical-align: middle;
        width: 6px;
        height: 6px;
        border-top: 2px solid #3aa1d6;
        border-right: 2px solid #3aa1d6;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    /* トップページ
------------------------------------------------- */
    h2.top_h2 {
        font-size: 2rem;
        margin-bottom: 30px;
    }
    h2.top_h2 span {
        font-size: 1.2rem;
    }
    dl.info {
        flex-direction: column;
        margin-bottom: 20px;
    }
    dl.info dt {
        width: auto;
        margin-bottom: 0px;
    }
    dl.info dd {
        width: auto;
        margin-bottom: 15px;
    }
    dl.info.list dt {
        margin-bottom: 0px;
    }
    dl.info.list dd {
        margin-bottom: 20px;
    }
    /* 商品一覧
------------------------------------------------- */
    ul.item {
        display: flex;
        flex-wrap: wrap;
        list-style: none;
        justify-content: space-between;
    }
    ul.item li {
        width: 48%;
        margin: 0 0 8%;
    }
    ul.item li a {
        display: block;
        text-decoration: none;
        color: #333;
    }
    ul.item li a span {
        display: block;
        margin-top: 7px;
    }
    ul.item li img {
        width: 100%;
        height: auto;
        border: solid 1px #e4e4e4;
    }
    ul.item:before {
        display: block;
        content: "";
        width: 48%;
        order: 1;
    }
    ul.item:after {
        display: block;
        content: "";
        width: 48%;
    }
    /* video
------------------------------------------------- */
    aside#video {
        background-color: #f3faff;
        padding: 50px 4%;
    }
    .youtube {
        flex-direction: column;
    }
    .youtube div {
        width: 100%;
        text-align: center;
    }
    .youtube h3 {
        font-size: 2rem;
        display: inline-block;
    }
    .youtube h3 span {
        font-size: 1.2rem;
    }
    .youtube ul {
        list-style: none;
        width: 100%;
        flex-direction: column;
    }
    .youtube ul li {
        width: 100%;
        margin-bottom: 20px;
        margin-left: 0;
    }
    /* footer
------------------------------------------------- */
    footer {
        padding: 150px 0 0px;
    }
    address {
        font-style: normal;
        font-size: 1.2rem;
        margin: 0 4% 20px;
    }
    #page-top {
        position: static;
    }
    #page-top a {
        width: 100%;
        height: 40px;
        line-height: 40px;
    }
    /* お知らせ
------------------------------------------------- */
    .pagination li {
        display: none;
    }
    .pagination li.pre, .pagination li.next {
        display: inline-block;
        width: 40%;
        height: 45px;
        text-align: center;
    }
    .pagination li.pre a, .pagination li.next a {
        width: 100%;
        text-align: center;
    }
    .pagination li.pre span::after {
        content: "　前の10件へ";
    }
    .pagination li.next span::before {
        content: "次の10件へ　";
    }
    .day {
        margin: -20px 0 20px !important;
    }
    /* 商品詳細
------------------------------------------------- */
    .product_main {
        flex-direction: column;
    }
    .product_picture {
        width: 100%;
        margin-bottom: 30px;
    }
    .product_picture .slider img {
        box-sizing: border-box
    }
    .product_title {
        width: 100%;
        margin-left: 0;
    }
    .product_main h2 {
        font-size: 2rem;
        margin-bottom: 30px;
    }
    .product_main table {
        margin-bottom: 30px;
        width: 100%;
        table-layout: fixed;
    }
    .product_main table thead {
        display: none;
    }
    .product_main table td {
        font-size: 1.3rem;
        box-sizing: border-box;
        xborder-bottom: none;
        position: relative;
        width: 5%;
    }
    .product_main table tr td:last-child {
        xborder-bottom: 1px solid #dddddd;
    }
    .product_main table tr {
        border-bottom: solid 20px #ffffff;
        display: block;
    }
    .product_main table td:first-child {
        width: auto;
        display: block;
        border-bottom: none;
        padding-left: 75px;
        min-height: 40px;
    }
    .product_main table td:first-child:before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 65px;
        background-color: #f5f5f5;
    }
    .product_main table td:first-child:after {
        position: absolute;
        content: "品番";
        width: 40px;
        top: 50%;
        left: 5px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }
    .product_main table td:nth-child(2) {
        width: auto;
        display: block;
        border-bottom: none;
        padding-left: 75px;
        min-height: 40px;
    }
    .product_main table td:nth-child(2):before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 65px;
        background-color: #f5f5f5;
    }
    .product_main table td:nth-child(2):after {
        position: absolute;
        content: "仕様";
        width: 65px;
        top: 50%;
        left: 5px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }
    .product_main table.new td:nth-child(2):after {
        position: absolute;
        content: "仕様";
        width: 65px;
        top: 50%;
        left: 5px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
    }
    
    .product_main table.new td:nth-child(3) {
    width: auto;
    display: block;
    border-bottom: none;
    padding-left: 0;
    min-height: 40px;
}
    .product_main table.new td:nth-child(3):before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 65px;
        background-color: #f5f5f5;
    }
    .product_main table.new td:nth-child(3):after {
        position: absolute;
        content: "定価";
        width: 65px;
        top: 50%;
        left: 5px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        text-align: left;
    }
    .product_main table.new td:nth-child(4):before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 65px;
        background-color: #f5f5f5;
    }
    .product_main table.new td:nth-child(4):after {
        position: absolute;
        content: "識別番号";
        width: 65px;
        top: 50%;
        left: 5px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        text-align: left;
    } 
.product_main table.new td:nth-child(4) {
    padding-left: 75px;
    min-height: 40px;
} 
    .product_main table td.special_price {
        font-size: 1.6rem;
    }

    input.number {
        padding: 5px;
        border: solid 1px #ccc;
        width: 50px;
        font-size: 1.6rem;
        border-radius: 3px;
    }
    .btn_order a {
        text-align: center;
        display: block;
        padding: 10px 30px;
        font-weight: bold;
    }
    /* カート
------------------------------------------------- */
    ul.cart_ttl {
        display: none;
    }
    ul.cart_item {
        flex-direction: column;
    }
    ul.cart_item li {
        border-right: none;
        width: 100%;
        text-align: right;
        padding: 5px 10px 5px 100px;
    }
    ul.cart_item li:nth-child(1) {
        width: 100%;
        padding-left: 0;
        padding: 10px 0;
        border-top: solid 1px #dddddd;
    }
    ul.cart_item li:nth-child(1) picture {
        width: 80px;
    }
    ul.cart_item li:nth-child(1) div {
        width: calc(100% - 100px);
    }
    ul.cart_item li:last-child {
        padding-bottom: 10px;
    }
    .order_total {
        margin-top: 20px;
        font-size: 1.6rem;
    }
    .order_total dd {
        font-size: 2.5rem;
    }
  .advice ul.cart_item li {
    border-right: none;
}
  ul.cart_item {
    border-bottom: none;
}

  
      /* ログイン
----------------------------------------*/

    .login_wrap_in {
        padding: 20px;
    }
    .login_wrap h1 {
        width: 70px;
        margin: auto;
    }
    .error_message {
        font-size: 1.5rem;
    }
  .contents .error_message {
    margin: 0 0 10px;
}
    input, textarea, select {
        padding: 10px;
        font-size: 1.5rem;
    }
    textarea {
        min-height: 160px;
    }
    select {
        font-size: 1.5rem;
    }
    button.btn_login {
        font-size: 1.5rem;
    }
    button.btn_login:hover {
        background-color: #1875c5;
    }
  
  
  
}