@media screen and ( min-width:480px ){
    input[type="text"],input[type="password"] {
        padding: 4px 6px;
        margin-bottom: 2px;
        height: 24px;
        font-size:120%;
        line-height: 20px;
    }

    header{
        width:800px;
        height:56px;
        padding-top:24px;
        font-size:24px;
        font-weight:bold;
        margin-top:0px;
        text-shadow: 3px 3px 10px #000;
        background-image:url(../img/reservelogo_pc.png);
    }

    header .titlelogo_pc{
        display:block;
    }

    header .titlelogo_smart{
        display:none;
    }

    content{
        width:800px;
        margin-top:20px;
        margin-bottom:20px;
    }

    .reserve{
        display:block;
        margin-left:20px;
        font-size:14px;
        font-weight:normal;
        color:#c9171e;
    }
    .reserve ul li ul {
        display:table;
    }
    .reserve ul li ul li{
        display:table-cell;
    }

    .lefttop {
        border-top:1px solid #c9171e;
    }

    .q_left {
        width:200px;
        border-left:1px solid #c9171e;
        border-right:1px solid #c9171e;
        border-bottom:1px solid #c9171e;
        background-color:#fff8f8;
        margin-left:20px;
        text-align:left;
        font-weight:bold;
        color:#c9171e;
        padding-left:6px;
        vertical-align:top;
    }

    .q_left_r {
        width:200px;
        border-right:1px solid #c9171e;
        background-color:#fff8f8;
        margin-left:20px;
        text-align:left;
        font-weight:bold;
        color:#c9171e;
        padding-left:6px;
        vertical-align:top;
    }

    .q_left .column,.q_left_r .column {
        float:left;
        padding-top:6px;
    }

    .q_left .mark,.q_left_r .mark {
        display:inline-block;
        padding-left:5px;
        color:#f00;
        font-size:120%;
        padding-top:6px;
    }

    .q_left .nomark,.q_left_r .nomark {
        display:inline-block;
        padding-left:5px;
        color:transparent;
        padding-top:6px;
        height:18px;
    }



    .q_left .column {
        float:left;
        padding-top:6px;
    }

    .q_left .mark {
        display:inline-block;
        padding-left:5px;
        color:#f00;
        font-size:120%;
        padding-top:6px;
    }

    .q_left .nomark {
        display:inline-block;
        padding-left:5px;
        color:transparent;
        padding-top:6px;
        height:18px;
    }

    .q_right{
        width:520px;
        border-right:1px solid #c9171e;
        border-bottom:1px solid #c9171e;
        text-align:left;
        color:#000;
        padding-left:6px;
        padding-top:4px;
        padding-bottom:4px;
    }

    .q_right_r{
        width:520px;
        text-align:left;
        color:#000;
        padding-left:6px;
        padding-top:4px;
        padding-bottom:4px;
    }

    .q_right_w {
        width:701px;
        border-left:1px solid #c9171e;
        border-right:1px solid #c9171e;
        border-bottom:1px solid #c9171e;
        text-align:left;
        color:#000;
        padding:15px;
    }

    .q_right_w2 {
        width:732px;
        border-left:1px solid #c9171e;
        border-right:1px solid #c9171e;
        border-bottom:1px solid #c9171e;
        text-align:left;
        color:#000;
    }

    .q_txt1{
        width:200px;
    }

    .q_txt2{
        width:300px;
        
    }

    .q_right span,.q_right_w span,.q_right_r span{
        margin-left:4px;
        margin-right:4px;
        font-size:80%;
    }

    .rlefttop {
        border-top:1px solid #888;
    }

    .r_left {
        width:200px;
        border-left:1px solid #888;
        border-right:1px solid #888;
        border-bottom:1px solid #888;
        background-color:#eee;
        margin-left:20px;
        text-align:left;
        font-weight:bold;
        color:#666;
        padding-left:6px;
        vertical-align:top;
    }

    .r_right{
        width:520px;
        border-right:1px solid #888;
        border-bottom:1px solid #888;
        text-align:left;
        color:#000;
        padding-left:6px;
        padding-top:4px;
        padding-bottom:4px;
    }

    .txt200{
        width:200px;
    }
    .txt120{
        width:120px;
    }
    .txt500{
        width:500px;
    }
    .txt80{
        width:80px;
    }
    .txt400{
        width:400px;
    }
    .txt500area{
        width:500px;
        height:120px;
    }
    .txt500areainquiry{
        width:500px;
        height:300px;
    }
    .txt800area{
        width:800px;
        height:400px;
    }

    .reserve .planselect{
        font-size:95%;
        line-height:24px;
        padding-top:10px;
        padding-bottom:10px;
    }

    .radio + .radio-icon:before {
        font-size: 22px;
        height:20px;
        vertical-align:middle;
    }

    .radio:checked + .radio-icon:before {
        vertical-align:middle;
    }

    .radio-str{
        width:490px;
        word-break:break-word;
        word-wrap:break-word;
        padding-top:0px;
        padding-bottom:4px;
        vertical-align:top;
    }

    .checkbox + .checkbox-icon:before {
        font-size: 22px;
        height:20px;
        vertical-align:middle;
    }

    .checkbox:checked + .checkbox-icon:before {
        vertical-align:middle;
    }

    .checkbox-str{
        width:490px;
        word-break:break-word;
        word-wrap:break-word;
        padding-top:0px;
        padding-bottom:4px;
        vertical-align:top;
    }

    .peoplesubtitle{
        width:120px;
        text-align:right;
    }
    .txtpeopleinput{
        width:80px;
        margin-left:10px;
        margin-right:6px;
    }
    .peoplesubafter{
        width:60px;
        text-align:left;
    }

    .itemrepayhotelinput{
        width:500px;
    }

    .reservebtn{
        margin-top:10px;
        font-size:110%;
        padding-left:20px;
        padding-right:20px;
    }

    footer{
        width:800px;
        font-size:12px;
        padding-top:5px;
        padding-bottom:5px;
    }

/* inactive
===============================================*/
.sorry{
    font-weight:bold;
    padding:20px;
}

.sorryimage{
    width:280px;
    margin:auto;
}

/*===============================================
 inactive */


/* calender
===============================================*/
.datepicker{
    width:288px;
    padding:4px;
    z-index:1;
}

.datepicker .yearmonth{
    width:285px;
    text-align:center;
    padding-top:4px;
    padding-bottom:4px;
}

.datepicker .columns{
}

.datepicker .columns li{
    width:40px;
    height:30px;
    text-align:center;
    padding-top:10px;
    font-weight:normal;
}

.datepicker .columns .top {
    height:20px;
    padding-top:2px;
    font-size:80%;
}

.datepicker .columns .left {
    border-left:1px solid #c9171e;
}

/*===============================================
  calender */

/* date selector
===============================================*/
.dateselectorwrap{
    font-size:90%;
    margin-top:4px;
}

.dateselector{
    background:#fff url(../img/selectbg.png) no-repeat right center;
}

.dateselector select{
    padding: 3px 20px 0px 4px;
    margin-top: -4px;
    margin-bottom: 2px;
    height: 26px;
    font-size:110% !important;
    line-height: 24px;
    border-radius:4px 3px 3px 4px;
    line-height:1.5em;color:#333;
}

.year{
    margin-bottom:4px;
}
.month{
    margin-bottom:4px;
}
/*===============================================
  date selector */

.reserveerror{
    top:18px;
    left:16px;
    background: #fff5f5 url(/img/alert-icon16.gif) no-repeat 2px 2px;
    padding-top:2px;
}

.process,.currentprocess {
    width:120px;
    height:22px;
    font-size:85%;
    padding-top:2px;
}

.process::after,.currentprocess::after{
    left:120px;
    border: 12px solid transparent;
}

.currentprocess::after{
	border-left: 12px solid #ffd8d8;
}

.process::after{
	border-left: 12px solid #ccc;
}

.processspc {
    width:10px;
}
/*
キャンセル料の説明画面
=======================================*/
.soptcheck, .soptcheck2 {
    display: block;
    margin-top: 80px;
    width: 600px;
}

.soptcheck .sopt_title, .soptcheck2 .sopt_title2 {
    padding-top: 4px;
    padding-bottom: 4px;
}

.soptcheck .sopt_close, .soptcheck2 .sopt_close2 {
    height: 48px;
    width: 48px;
}

.soptcheck .soptcheck_guide, .soptcheck2 .soptcheck_guide2 {
    padding: 20px;
}

.soptcheck .sopt_subtitle, .soptcheck2 .sopt_subtitle2 {
    margin-bottom: 20px;
}

.soptcheck .soptcheck_guide .sopt_button, .soptcheck2 .soptcheck_guide2 .sopt_button2 {
    margin-top: 40px;
}

.soptcheck .soptcheck_guide .sopt_button button, .soptcheck2 .soptcheck_guide2 .sopt_button2 button {
    font-size: 110%;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-right: 10px;
    margin-left: 10px;
}

.soptcheck .soptcheck_guide .sopt_cr, .soptcheck2 .soptcheck_guide2 .sopt_cr2 {
    display: inline-block;
}

.timemessage {
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 280px;
    padding: 10px;
}

.soptcheck3 {
    display: block;
    margin-top: 80px;
    width: 600px;
}

.soptcheck3 .sopt_title3 {
    padding-top: 4px;
    padding-bottom: 4px;
}

.soptcheck3 .sopt_close3 {
    height: 48px;
    width: 48px;
}

.soptcheck3 .soptcheck_guide3 {
    padding: 20px;
}

.soptcheck3 .sopt_subtitle3 {
    margin-bottom: 20px;
}

.soptcheck3 .sopt_comment3 {
    margin-left:20px;
}

.soptcheck3 .sopt_comment3 .soptcheckcc3 {
    display: inline-block;
    margin-left: 4px;
    cursor: pointer;
}

.soptcheck3 .sopt_comment3 .soptcheckcc3 img {
    display:block;
    width:17px;
    height:18px;
}
.soptcheck3 .soptcheck_guide3 .sopt_button3 {
    margin-top: 40px;
}

.soptcheck3 .soptcheck_guide3 .sopt_button button3 {
    font-size: 110%;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-right: 10px;
    margin-left: 10px;
}

.soptcheck3 .soptcheck_guide3 .sopt_cr3 {
    display: inline-block;
}

}