@charset "UTF-8";
.sp {
    display: none;
}

.sp_head {
    display: none;
}

.infocheckbox {
    padding: 10px;
}

.notification.left_txt {
    padding: 5px;

}

@media screen and (max-width: 640px) {
    .pc {
        display: none;
    }

    #frame {
        width: auto;
    }

    .header-img {
        width: 100%;
        height: auto;
    }

    .auction-rule {
        width: 100vw;
    }
    
    .auction-rule .title {
        background-color: #444433;
        text-align: left;
        font-size: 5vw;
        color: #FFFFFF;
    }
    
    .auction-rule ol {
        padding-inline-start: 2rem;
        margin-block-start: 0;
        margin-block-end: 0;
        margin-top: 0.5rem;
        padding-right: 1rem;
    }
    
    .auction-rule ol li{
        text-align: left;
        font-weight: bold;
        font-size: 1rem;
    }
    
    .footer {
        width: auto;
        padding: 5vw;
    }

    .auction-rule-title Strong {
        font-size: 3.8vw;
        padding: 3vw;
        display: inline-block;
    }

    div.aucdata {
        font-size: 4.6vw;
    }

    div.aucterm {
        font-size: 3.6vw;
        display: inline-block;
    }

    div.stateopen {
        font-size: 3.6vw;
        display: inline-block;
    }

    .linkALResource {
        display: none;
    }

    .infolabel {
        margin: 0vw 0 0 5vw;
    }

    .infodoc {
        margin: 0 5vw 5vw 5vw;
        padding: 5vw;
        width: auto;
        font-size: 3.2vw;
    }

    .left_txt {
        text-align: left;
    }

    .login-area {
        width: 90vw;
        margin: 0 auto;
    }

    .login-area td.dammy {
        display: none;
    }

    .login-area td:nth-child(2) {
        width: auto;
    }

    .login-area input[type="text"],
    .login-area input[type="password"] {
        width: 90%;
    }

    .login-input-area tr:nth-child(2) td:nth-child(1),
    .login-input-area tr:nth-child(3) td:nth-child(1) {
        width: 20%;
    }

    .infocheckbox {
        padding-bottom: 10px;
    }

    .sp {
        display: inline-block;
    }

    .auction-rule td {
        font-size: 3vw;
        font-weight: normal;
        padding-bottom: 5px;
        text-indent: -2rem;
        padding-left: 2rem;
        padding-right: 0rem;
    }

    .lotno-label .lotno-info {
        background: #ffc400;
        padding: 2vw 3vw;
    }

    .lotno-label .lotno-info {
        font-size: 4vw;
    }

    .lotno-label .lotno-info .spacer {
        display: none;
    }

    .lotno-info .bid-text,
    .lotno-label .lotno-info .labelCurLot,
    .lotno-label .lotno-info .labelLotNoText {
        font-size: 4vw !important;
        color: #000;
    }

    .message-area {
        background: #cc0000;
        border: none;
        float: none;
        width: auto;
    }

    .receive-message {
        background: #cc0000;
        color: #FFF;
        height: auto;
        overflow: visible;
    }

    .sp_head {
        display: block;
        vertical-align: bottom;
    }

    .sp_head img {
        vertical-align: bottom;
    }

    .objpos {
        width: 100vw;
        height: auto;
        position: static;
        transform: none;
        overflow: hidden;
    }

    .receive-message>div {
        padding: 2vw 5vw;
        font-weight: 700;
        display: block;
        line-height: 1.5;
    }

    .receive-message>div>span {
        display: block;
        font-size: 3vw;
    }

    .movie-operation-area {
        display: none;
    }

    .movie-display-area {
        float: none;
        width: 100%;
    }

    #topPicArea,
    #areaMovie {
        width: 100vw;
        height: 60vw;
    }

    #smart-live-frame {
        position: static;
        transform: none;
        width: 100vw;
        height: 60vw;
    }

    .movie-area,
    .subscreen-spec-area {
        float: none;
    }

    .subscreen-area {
        display: none;
    }

    .movie-spec-area {
        width: 100vw;
    }

    .label-spec .speclabel>div:nth-child(2) {
        display: none;
    }

    .label-spec .speclabel>div:nth-child(1) {
        width: 100%;
        background-size: 100%;
        border: none;
    }

    .movie-spec-area {
        width: auto;
        height: auto;
        float: none;
    }

    .label-spec {
        width: auto;
        height: auto;
        float: none;
    }

    .movie-area {
        width: 100vw;
        height: 60vw;
    }

    .spec-area {
        width: auto;
        float: none;
        background: #dbdbdb;
    }

    .label-spec .speclabel {
        width: 100%;
        float: none;
    }

    .label-spec .speclabel.any-bid {
        background: #000 url(/assets/image/spec_title_4.png) no-repeat center left 10px;
        background-size: 40%;
    }

    .year-hour .year-area,
    .year-hour {
        width: auto;
    }

    .label-spec .speclabel {
        height: 10vw;
    }

    .bid-text {
        font-family: Arial, Helvetica, sans-serif !important;
    }

    .year-hour {
        height: auto;
        float: none;
        padding: 2vw 0 0 2vw;
    }

    .spec-detail .spec-frame .spec,
    .year-hour .hour-unit span,
    .hour-area .hour,
    .year-hour .year-unit span,
    .year-hour .year {
        width: auto;
        font-size: 4vw;
        padding: 0 1vw;
        line-height: 1.6;
        color: #333;
        height: auto;
        float: none;
        display: inline-block;
        background-color: transparent !important;
    }

    .spec-detail {
        border: none;
        background-color: transparent;
        color: #333;
        height: auto;
        width: auto;
        float: none;
        display: inline-block;
        padding: 0 0 0 2vw;
        margin: 0;
    }

    .spec-detail .spec-frame,
    .year-hour .hour-unit,
    .year-hour .hour-area,
    .year-hour .year-unit,
    .year-hour .year-area {
        border: none;
        background-color: transparent !important;
        color: #333;
        height: auto;
        width: auto;
        float: none;
        display: inline-block;
        padding: 0;
        margin: 0;
    }

    .bid-nextlist-area {
        width: auto;
        float: none;
    }

    .bid-panel {
        width: auto;
        background: #fff3c9 !important;
    }

    .bid-state-area .price-box {
        width: auto;
    }

    .bid-panel .bid-state-area {
        height: auto;
        border: none;
        padding: 2vw 4vw 0 4vw;
    }

    .bid-panel .bid-layout .state-selling {
        display: none;
    }

    .bid-panel .bid-panel-bg1 .bid-next-value-area {
        float: left;
        width: calc(100vw - 22vw);
        height: auto;
        background: #FFF;
        border: 2px solid #dbdbdb;
        color: #333;
        margin: 0;
        display: inline-block;
    }

    .bid-state-area .price-box {
        float: left;
        width: calc(100vw - 22vw);
        height: auto;
        background: #FFF;
        border: 2px solid #dbdbdb;
        color: #333;
        margin: 0;
        display: inline-block;
    }

    .bid-next-value-area .next-price,
    .bid-state-area .price {
        font-size: 6vw;
        line-height: 1.6;
        color: #333;
        font-weight: 700;
    }

    .bid-panel .bid-panel-bg1 .bid-next-text,
    .bid-state-area .price-title {
        margin: 0;
        font-size: 5vw;
        padding: 1vw;
        font-weight: 700;
        text-align: left;
        display: block;
        line-height: 1.6;
        float: none;
        padding: 0;
    }

    .bid-panel .bid-panel-bg1 .price-unit-box .price-unit1,
    .bid-panel .bid-panel-bg1 .bid-next-text .bid-next-text3,
    .bid-panel .bid-panel-bg1 .bid-next-text .bid-next-text2,
    .bid-panel .bid-panel-bg1 .bid-next-text .bid-next-text1,
    .bid-state-area .price-unit-box {
        display: inline-block;
        float: none;
        height: auto;
        width: auto;
        padding: 0;
        position: relative;

        text-align: left;
        margin: 0;
        vertical-align: middle;
    }

    .bid-panel .bid-panel-bg1 .price-unit-box .price-unit2,
    .bid-panel .bid-panel-bg1 .price-unit-box .price-unit1,
    .bid-panel .bid-panel-bg1 .price-unit-box,
    .bid-state-area .price-unit-box .price-unit2,
    .bid-state-area .price-unit-box .price-unit1 {
        font-size: 4vw;
        padding-left: 0px;
        font-weight: 700;
    }

    .bid-button-area,
    .bid-panel .bid-panel-bg1 {
        height: auto;
        border: none;
    }

    .bid-state-area .approx-title {
        font-size: 5vw;
        font-weight: 700;
        float: none;
        display: inline-block;
        margin: 0 0 0 auto;
    }

    .bid-state-area .approx {
        float: none;
        font-size: 5vw;
        height: auto;
        width: auto;
        display: inline-block;
        letter-spacing: 0;
    }

    .bid-state-area .approx-rate .approx-k {
        display: none;
    }

    .bid-state-area .approx-rate br {
        display: none;
    }

    .bid-state-area .approx-rate .approx-choice,
    .bid-state-area .approx-rate {
        float: none;
        font-size: 4vw;
        width: auto;
        height: auto;
        display: inline-block;
        vertical-align: middle;
        text-align: right;
        font-family: Arial, Helvetica, sans-serif !important;
        letter-spacing: 0;
    }

    .price-area {
        text-align: right;
    }

    .bid-next-text.bid-text br {
        display: none;
    }

    .bid-panel .bid-panel-bg1 .price-unit-box {
        width: auto;
        height: auto;
        margin: 0;
        padding: 0;
        float: none;
        display: inline-block;
        position: relative;
        top: 2vw;
    }

    .bid-panel .bid-panel-bg1 {
        text-align: right;
        width: auto;
        padding: 0vw 4vw 2vw 4vw;
    }

    .price-unit-box br {
        display: none;
    }

    .price-unit-box span {
        display: block !important;
    }

    .bid-button-area {
        padding: 5vw 5vw;
    }

    .bid-panel-bg2 {
        width: auto;
    }

    .bid-panel-bg2 .right-lamp {
        width: 20vw;
        height: auto;
        margin: 0;
    }

    #bid {
        background-color: #fff4c4;
        background-image: url("/assets/image/smp_bid_btn.png") !important;
        background-repeat: no-repeat;
        background-size: contain;
        width: 22vw !important;
        height: 55vw !important;
        position: absolute;
        transform: rotate(-90deg);
        transform-origin: top left;
        left: 3vw;
        top: 20vw;
    }

    .bid-panel-bg3 {
        width: auto;
        height: auto;

    }

    .switch-area {
        position: absolute;
        left: 5vw;
        top: 32vw;
        transform: rotate(-90deg);
        transform-origin: top left;
    }

    .bid-panel-bg2 br+div {
        display: none;
    }

    #bid.bid-none {
        background-color: #fff4c4;
        background-image: url("/assets/image/smp_bid_btn2.png") !important;
    }

    .switch-area label {
        height: 51vw;
    }

    .switch-area .switch-image {
        top: 40vw;
    }

    .switch-area-on {
        transform: rotate(90deg);
        top: -28px;
    }

    .switch-area-off {
        top: 54vw;
        transform: rotate(90deg);
    }

    .bid-panel {
        height: 90vw;

    }


    #next_d {
        width: 100vw;
        height: auto;
        overflow: hidden;
    }

    .lot-list {
        width: 100vw;

    }
}