@charset "UTF-8";

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

body {
    color: #212529;
    font-family:  'Noto Sans JP',sans-serif;
    margin-top: 0px;
    margin-left: 0px;
    margin-right: 0px;
}

a {
    text-decoration: none;
}

textarea{
    text-indent: 0;
}

/* color */
    .gold{
        background-color: #B39E65;
    }
    .natural{
        background-color: #DCCFB0;
    }
    .relax_gord{
        background-color: #D4BF89;
    }
    .gray{
        background-color: #898989;
    }
    .brown{
        background-color: #7A6A56;
    }

/* 共通部分 */
.header {
    display: block;
    widh:100%;
    back-ground-color:white;
    box-shadow: rgb(0 0 0 / 13%) 0 0.3rem 0.5rem;
    box-sizing: border-box;
    padding: 0.2em;
}

.header .title {
	max-width: 500px;
    display: flex;
}

.header .title img {
    margin-top: 5px;
    margin-left:20px;
    width: 160px;
}

.header .title .text {
    margin: 0 0 0 auto;
    text-align: right;
    color: #fff;
    font-size: 130%;
	font-weight: bold;
}

.footer {
    display: block;
    width: 100%;
    color: white;
    background-color: #898989;
    font-size: .85rem;
    text-align: center;
    margin-bottom: 0.25rem;
    padding: 1.0rem;
    position: relative;
    bottom: 0;
    white-space: nowrap;
    box-sizing: border-box;
}

.main {
    margin-top: 50px;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 50px;
}

.block {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 30px;
}

.text-danger {
    color:red;
    background-color: #f5f5f5;
    font-size: 1.0em;
    font-weight: bold;
    text-align: center;
}

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

.text-margin {
    margin-top: 20px;
}

.text-margin0 {
    margin:0 auto;
}

.text-nowrap {
    white-space: nowrap;
}


/*言語切替*/
.lang_box {
    width:600px;
    text-align: right;
}
.language {
    color:#B39E65;
    text-align: center;
    text-shadow:#d3d3d3 1px 0 1px;
    border:#d3d3d3 solid 1px;
    display: inline-block;
    width:80px;
    padding:0.5px;
    font-size: 1rem;
}
.language:hover{
    color:white;
    background-color:#B39E65;
}
.nowlang{
    color:white;
    background-color:#B39E65;
    font-weight: bold;
}



/*挨拶文*/

.block-title {
    background: white;
    padding: 0.4em;
    color: #B39E65;
    text-align: center;
    vertical-align: middle;
    font-size: 1.5rem;
    border-bottom: solid 3px #85764D;
    margin:0 auto;
    align-items: center;
    font-weight: bold;
}

.block-title img {
    width: 300px;
    margin: 0;
    padding: 0;
    overflow: hidden;
    position: relative;
}

.block-title .text {
    margin: 0 0 0 20px;
    padding-top:20px;
    vertical-align: middle;
}



.block-title2 {
    padding: 0.8em;
    color: #85764D;
    text-align: center;
    font-size: 1.4rem;
    border-bottom: solid 1px #85764D;
}

.block-text {
    font-size: 0.9rem;
    text-align: center;
    margin-top:10px;
}

.block-text2 {
    font-size: 1.0rem;
    text-align: center;
    font-weight: bold;
    margin-top: 50px;
    margin-bottom: 50px;
    display: inline-block;
    padding: 1em 1em;
    background: #fffacd;
    border-left: solid 10px #D4BF89;
}


/*question共通*/

.block-all-q {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
    margin-bottom: 10px;
}


.block-q {
    margin: 3em auto; /* ボックスの余白 */
    background-color: white; /* ボックス背景色 */
    padding:1em 1em 1em; /* ボックス内側余白 */
    position:relative; /* 配置(ここを基準に)*/
    border: 1px solid #D4BF89;  /* ボックスの線 (太さ　種類　色)*/
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}

.block-q .box-num {
    background-color:#D4BF89; /* タイトル背景色 */
    font-size: 1.5em;/* タイトル文字の大きさ */
    color: #fff ; /* タイトル文字色 */
    padding: 10px 15px;/*タイトルの余白*/
    line-height: 1;/*タイトルの行の高さ*/
    position:absolute;  /* 配置(ここを動かす) */
    top: -20px; /*上から（0px）移動*/
    left: 20px; /*左から(0px)移動*/
}


.block-q-title {
    background: white;
    padding: 0.4em;
    color: #85764D;
    text-shadow:#d3d3d3 1px 0 1px;
    text-align: left;
    font-size: 1.2rem;
    margin-top: 10px;
    border-bottom: solid 1px #DCCFB0;
    line-height: 1.8; /*行間*/
}

.block-q-text {
    font-size: 1.0rem;
    text-align: center;
    margin-top: 10px;
}

.error-text{
    color: red;
}

.text-conf {
    font-weight: bold;
    font-size: 1.0rem;
    color:black !important;
    background-color: #e6e6fa;
    border-color: #e6e6fa;
    border-radius: 10px;
    padding:2px 10px;
    text-align: left;
    pointer-events: none;
    list-style: none;
}

.radio-conf {
    pointer-events: none;
}

.text-noanswer{
    color:#c0c0c0;
    margin:0;
    font-weight: bold;
    font-size: 1.0rem;
}

.required::before {
    content: "必須";
    color: #ffffff;
    background: #ff4500;
    font-size: 0.7em;
    padding: 0.1em 0.4em;
    border-radius: 0.2em;
    white-space: nowrap;
}

.required_EN::before {
    content: "required";
    color: #ffffff;
    background: #ff4500;
    font-size: 0.7em;
    padding: 0.1em 0.4em;
    border-radius: 0.2em;
    white-space: nowrap;
}




.small{
    font-size: 0.8em;
    font-weight: normal;
}


/*ラジオボタン用*/

.radio_label_upper_pc ,.radio_label_upper_pc_name,.radio_group{
    display: flex;
    list-style: none;
    padding-inline-start:0;
}

.radio_label_sp {
    display: none;
}

.radio_label_upper_pc li{
    font-size: 0.8em;
    width:100px;
}
.radio_label_upper_pc_name li{
    font-size: 0.8em;
    width:200px;
}

.radio_item input[type=radio] {
    display:none;
}

.radio_item {
    width:100px;
}

.radio_item label{
    cursor: pointer;
    font-size: 1.0em;
    color: #909090;
    font-weight: bold;
    width:100px;
    box-sizing: border-box;
    padding:5px 15px;
    margin:0 auto;
}

.radio_item label:before{
    content: "〇";
}

.radio_item input[type=radio]:checked + label{
    color:white;
    background-color: #4169e1;
    padding:5px 15px;
    border-radius: 5px;
    box-sizing: border-box;
}

.radio_item input[type=radio]:checked + label:before{
    content: "●";
}

.radio_item input[type=radio]+ label:hover{
    cursor: pointer;
    color:white;
    background-color: #4169e1;
/*    padding:5px 20px;*/
    border-radius: 5px;
    box-sizing: border-box;
}


/*「利用していない」ボタン*/
.radio_item_nouse input[type=radio] {
    display:none;
}

.radio_item_nouse input[type=radio]:checked + label{
    color:white;
    background-color: #4169e1;
    border-radius: 5px;
}

.radio_item_nouse input[type=radio]+ label:hover{
    cursor: pointer;
    color:white;
    background-color: #4169e1;
    border-radius: 5px;
}

.radio_item_nouse input[type=radio]+ label{
    display:block;
    color: black;
    width:110px;
    border:solid #696969 1px;
    border-radius: 5px;
    padding:5px 10px;
    cursor: pointer;
    font-size: 0.8em;
    font-weight: normal;
    text-align: center;
    margin-top: 10px;
}


.label_small{
    width:100px;
}


/*テキストエリア用*/
.comment_area {
    width: 500px;
    height: 90px;
    font-size: 0.8em;
}


/*最初に用*/

.ul_first {
    text-align: left;
    list-style: none;
    line-height: 1.8; /*行間*/
    display:flex;
}

.ul_first li{
    font-weight: bold;
    font-size: 1.0em;
    color:#85764D;
    margin-right: 20px;
    list-style: none;
}

.room_num input,.stay_date input,.stay_day input,.name input{
    width:230px;
}


.first_text {
    width:130px;
/*    line-height: 1.0;*/
}

.gender {
    width:80px;
    display:inline-block;
    font-weight: normal;
    color:black;
}

.gender.text-conf{
    width:120px;
}

.age {
    width:150px;
}

.times_of_use {
    display:block;
    float:left;
    width:200px;
    font-weight: normal;
    color:black;
}


/*Q1用*/

#ul_route {
    text-align: left;
    list-style: none;
    line-height: 2; /*行間2倍*/
}

#ul_route li{
    display: inline-block;
    width:150px;
}

#ul_route .long{
    display: inline-block;
    width:500px;
    font-size: 1rem;
}

#ul_route li label{
    font-size: 1.0rem;
}

#ul_route li label:hover{
    cursor: pointer;
}

.route_else_comment {
    width:450px;
    height:100px;
    font-size: 0.8em;
}



/*Q5用*/
#ul_room_best_thing {
    text-align: left;
}
#ul_room_best_thing li{
    list-style: none;
    display: inline-block;
    width:300px;
}
.room_best_thing {
    font-weight: normal;
    font-size: 1rem;
    color:black;
}

/*Q12用*/
/*2024.6.24追加*/

#ul_recieve_info {
    text-align: left;
    list-style: none;
    line-height: 2; /*行間2倍*/
}

#ul_recieve_info .long{
    display: inline-block;
    width:500px;
    font-size: 1rem;
}

#ul_recieve_info li label{
    font-size: 1.0rem;
}

#ul_recieve_info li label:hover{
    cursor: pointer;
}

.recieve_info_else_comment {
    width:450px;
    height:100px;
    font-size: 0.8em;
}


/*optin用*/
/*2024.6.24追加*/

.last_text_top{
    padding:10px;
    font-size: 0.9em;
    color: #85764D;
    text-shadow: #d3d3d3 1px 0 1px;
    font-weight: bold;
    text-align: left;
}

.last_box{
    text-align: center;
    display: block;
    margin-top:10px;
    margin-bottom:30px;
}


.last_text_bottom{
    padding:10px;
    font-size: 0.5em;
}

.ul_last {
    text-align: left;
    list-style: none;
    line-height: 1.8; /*行間*/
    display:flex;
    margin-top:20px;
}

.ul_last li{
    font-weight: bold;
    font-size: 0.9em;
    color:#85764D;
    margin: 0 auto;
    list-style: none;
}


.last_text {
    width:120px;
    color: #85764D;
    font-weight: bold;
/*    line-height: 1.0;*/
}

.email input{
    width: 250px;
}




/*ボタン*/
.button {
    margin: 1.1em auto;
    text-align: center;
    margin-top:60px;
}

.button-sub {
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border: #796a56 solid 1px;
    background: #796a56;
    max-width: 250px;
    width: 100%;
    text-align: center;
    color: #fff!important;
    font-size: 1.2em;
    font-weight: 700;
    display: block;
    box-sizing: border-box;
    padding: 17px 8px ;
    border-radius: 4px;
    margin: 0 auto;
    cursor: pointer;
}

.button-sub:hover {
    color: #796a56!important;
    background: #fff;
}

.button-ret {
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border: #708090 solid 1px;
    background: #708090;
    max-width: 100px;
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 1.2em;
    font-weight: 700;
    display: block;
    box-sizing: border-box;
    padding: 17px 8px ;
    border-radius: 4px;
    margin: 0 auto;
    cursor: pointer;
}

.button-ret:hover {
    color: #708090;
    background: #fff;
}

.button-container {
    display: flex;
    justify-content: center;
}

.button-container button{
    margin:0 auto;
}


}
