@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

/*==================================================================================================

      　リセット

===================================================================================================*/

        /* iOSでのデフォルトスタイルをリセット */
        input[type="submit"],
        input[type="button"] {
        border-radius: 0;
        -webkit-box-sizing: content-box;
        -webkit-appearance: button;
        appearance: button;
        border: none;
        box-sizing: border-box;
        cursor: pointer;
        }
        input[type="submit"]::-webkit-search-decoration,
        input[type="button"]::-webkit-search-decoration {
        display: none;
        }
        input[type="submit"]::focus,
        input[type="button"]::focus {
        outline-offset: -2px;
        }
        .CheckboxInput {
        padding: 7px 15px;
        display: flex;
        align-items: center;
        cursor: pointer;
        }
        .CheckboxInput-Input {
        margin: 0;
        width: 0;
        opacity: 0;
        }
        .CheckboxInput:hover{}
        .CheckboxInput-Input:focus + .CheckboxInput-DummyInput{}
        .CheckboxInput-Input:checked + .CheckboxInput-DummyInput {
        /*チェックボックス背景色*/	
        background: #005982; 
        }
        .CheckboxInput-Input:checked + .CheckboxInput-DummyInput::before {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 40%;
        height: 4px;
        border-radius: 2px;
        transform: translate(-5px, 2px) rotateZ(-135deg);
        transform-origin: 2px 2px;
        background: #FFFFFF;
        }
        .CheckboxInput-Input:checked + .CheckboxInput-DummyInput::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        width: 76%;
        height: 4px;
        border-radius: 2px;
        transform: translate(-5px, 2px) rotateZ(-45deg);
        transform-origin: 2px 2px;
        background: #FFFFFF;
        }
        .CheckboxInput-DummyInput {
        position: relative;
        top: 0;
        left: 0;
        display: block;
        width: 22px;
        height: 22px;
        border: solid 2px transparent;
        background: rgba(0,0,0, .1);
        border-radius: 4px;
        }
        .CheckboxInput-LabelText {
        margin-left: 12px;
        display: block;
        font-size: 18px;
        font-weight: bold;
        }


/*==================================================================================================

      　RSS

===================================================================================================*/

.plan_rss {
        position: relative;
        width:100%;
        height:100%;
        }
        .plan_rss			{ margin-left:auto; margin-right:auto; position: relative;}
        .plan_rss:before,
        .plan_rss:after      { content:""; display:table; }
        .plan_rss:after      { clear: both; }
        .plan_rss            { zoom: 1; }

        .mini {
        position: relative;
        width:23.2%;
        float:left;
        margin-right:2.4%;
        box-sizing: border-box;
        z-index: 0;
        }
        .plan_rss .mini:last-child { margin-right:0; }
        
        .plan_img {
        width:100%;
        order:1;
        position: relative;
        border-radius: 5px;
        box-sizing: border-box;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
        }

        .plan_img a { display:block; overflow: hidden;border-radius: 5px; }
        .plan_img img{ display: block; width:100%; min-width:100%; height:auto; border-radius:5px; }
        .plan_img a:hover { opacity:1; }
        .plan_img:hover img {
        opacity: 1;
        -moz-transform:    scale(1.1);
        -webkit-transform: scale(1.1);
        -ms-transform:     scale(1.1);
        transform:         scale(1.1);
        }
        .plan_text { position: relative; width:100%; text-align: left; order:2; padding:1rem 1rem 1.5rem; box-sizing: border-box; }
        .plan_text h4 { font-size:1rem; padding-top:.25rem; line-height: 160%; letter-spacing: 0; font-weight:500;  }
        .plan_text a { text-decoration: none; display: block; position: relative;}
        .plan_text h4 a { color:#262E31;}
        .plan_text h4 a:hover { opacity:.6; }

        .plan_text p { font-size:.9375rem; line-height: 150%; color:#26221A;}

        @media only screen and (max-width: 1024px){
        .plan_rss { flex-wrap: wrap; max-width: 720px; margin:0 auto;}
        .mini { width:48%; margin-bottom:2rem; }
        .plan_rss .mini:nth-child(2) { margin-right:0; }
        .plan_text h4 { }
        }
        @media only screen and (max-width: 767px){
        .plan_rss { max-width: 270px;}
        .mini { width:100%; margin-bottom:2rem; }
        .mini:last-child { margin-bottom:0rem; }
        .plan_text h4 {  }
        }

/*==================================================================================================

       空室検索

===================================================================================================*/





/*==================================================================================================

       空室検索

===================================================================================================*/

/* ▼▼ Liberty基本設定 変更しない ▼▼ */

.plan_form{width:800px;}
.plan_form .form_box{display: flex; flex-wrap: wrap; justify-content:space-between;}
.plan_form .title{margin:0 0 5px 0; padding:0; text-align: center; font-size:14px; font-weight: bold;}
.plan_form span{margin:0;}
.plan_form select{position: relative;border-radius: 1px;border: 1px solid #bfbfbf; background: #ffffff; padding:10px;}
.plan_form input{position: relative;border-radius: 1px;border: 1px solid #bfbfbf; background: #ffffff; padding:10px;}
.plan_form .check_in {width:auto; text-align: center;}
.plan_form .check_in input{width:100px; cursor: pointer;}
.plan_form .undecided {width:auto; text-align: center;}
.plan_form .guests{width:auto; text-align: center;}
.plan_form .guests select{width:100px;}
.plan_form .type {width:auto; text-align: center;}
.plan_form .type select{width:100px;}
.plan_form .price {width:auto; text-align: center;}
.plan_form .price span {width:10px; text-align: center; margin:0;}
.plan_form .search_btn .btn{width:100px; margin:20px auto; padding:10px 0 10px 0; background-position:right 15px center; border:none; color:#fff; font-size:18px; cursor: pointer;background:#005982;}
.plan_form .option-input{position:relative;  cursor: pointer;}

@media only screen and (max-width: 767px){
.plan_form {width:auto; padding: 20px; position: relative;}
.plan_form .form_box{display: flex; flex-wrap: wrap; justify-content:space-between;}
.plan_form .title{margin:0 0 5px 0; padding:0; text-align: center; font-size:16px; font-weight: bold;}
.plan_form span{margin:0;}
.plan_form select{position: relative;border-radius: 1px;border: 1px solid #bfbfbf; background: #ffffff; padding:10px;}
.plan_form input{position: relative;border-radius: 1px;border: 1px solid #bfbfbf; background: #ffffff; padding:10px;}
.plan_form .check_in {width:48%; text-align: center; margin:0 0 20px 0;}
.plan_form .check_in input{width:100%;}
.plan_form .undecided {width:50%; text-align: center; margin:0 0 20px 0;}
.plan_form .undecided input{}
.plan_form .undecided .CheckboxInput {padding: 0 15px; display: flex; justify-content:center; cursor: pointer;}
.plan_form .guests{width:48%; text-align: center; margin:0 0 20px 0;}
.plan_form .guests select{width:100%;}
.plan_form .type {width:48%; text-align: center; margin:0 0 20px 0;}
.plan_form .type select{width:100%;}
.plan_form .price {width:100%; text-align: center; display: flex; flex-wrap: wrap; justify-content:space-between; align-items: center;}
.plan_form .price .title{width:100%;}
.plan_form .price select{width:46%;} 
.plan_form .price span {width:auto; text-align: center; padding:0;}
.plan_form .search_btn{width:100%;}    
.plan_form .search_btn .btn{width:100%; margin:20px auto; padding:10px 0 10px 0; background-position:right 15px center; border:none; color:#fff; font-size:18px; cursor: pointer;}
.plan_form .option-input{position:relative;  cursor: pointer; height: auto;}
.plan_form .option-input:before{display: none;}
.plan_form .option-input:checked:before {display: none;}
.plan_form .option-input:after{display: none;}
input{ height: 42px;}
input[type="text"] {box-sizing: border-box;font-size: 16px;}
select {box-sizing: border-box;font-size: 16px; height: 42px;}    
}
/*
@media only screen and (max-width: 360px){
.plan_form .check_in {width:100%; text-align: center; margin:0 0 20px 0;}
.plan_form .check_in input{width:100%;}
.plan_form .undecided {width:100%; text-align: center; margin:0 0 20px 0;}
.plan_form .guests{width:100%; text-align: center; margin:0 0 20px 0;}
.plan_form .type {width:100%; text-align: center; margin:0 0 20px 0;}
.plan_form .type select{width:100%;}
.plan_form .price {width:100%; text-align: center; display: flex; flex-wrap: wrap; justify-content:space-between; align-items: center;}
.plan_form .price .title{width:100%;}
.plan_form .price select{width:100%;} 
.plan_form .price span {width:100%; text-align: center; padding:0; margin:10px 0!important; display: block;}
.plan_form .search_btn{width:100%;}    
}
*/

/* ▲▲ Liberty基本設定 変更しない ▲▲ */






    /*=================================================
            オリジナル設定
    ==================================================*/

        select { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; outline: none; background: transparent; }

        .search-container {
        position: relative;
        z-index: 5;
        }
        .search-container:after {
        content:"";
        display: block;
        position: absolute;
        top:0;
        left:-100px;
        width:100%;
        height:100%;
        background: url("../assets/images/parts/brown.jpg") right top repeat;
        z-index: -1;
        border-radius:0 10px 10px 0;
        }
        .search-container:before {
        content:"";
        display: block;
        position: absolute;
        top:25%;
        right:-100px;
        width:100%;
        height:110%;
        background:rgba(55,53,52,.03);
        z-index: -2;
        border-radius:10px;
        }
        @media screen and (max-width:1200px) {
        .search-container:after { left:-4vw; }
        .search-container:before { right:-4vw; }
        }
        @media screen and (max-width:767px) {
        .search-container:before { top:15%; height:105%; }
        }


        .search-title {
        position: absolute;
        top: -0.5em;
        left:0;
        line-height: 1;
        width: 100%;
        text-align: center;
        z-index: 1001;
        }
        .search-wrap {
        position: relative;
        width:100%;
        position: relative;
        padding: 33px 25px 33px;
        box-sizing: border-box;
        z-index: 1000;
        }
        .search {
        width:100%;
        }

        .plan_form { max-width:900px; width:100%; line-height: 1; margin:0 auto; color:#FFF;}
        .plan_form .title { font-size:13px; padding-bottom:4px; color:#FFF; font-weight:500; }
        .plan_form select { border:1px solid rgba(0,0,0,.2); padding:13px 10px; border-radius:4px; background:#FFF; font-family: 'Noto Sans JP', serif; height:46px; text-align: center; }
        .plan_form input  { border:1px solid rgba(0,0,0,.2); padding:13px 15px; border-radius:4px; background:#FFF; font-family: 'Noto Sans JP', serif; }
        .plan_form .check_in input { width:110px; box-sizing: border-box; height:46px; }
        .plan_form .option-input { margin-top: 14px; }
        .plan_form .undecided input[type=checkbox] { -webkit-transform: scale(1.5,1.5); transform: scale(1.5,1.5); }

        .plan_form .search_btn .btn {
        width:110px;
        height:46px;
        line-height: 46px;
        margin:21px auto 0;
        padding:0;
        background:#EC9F47;
        border-radius:3px;
        border: none;
        box-sizing: border-box;
        color:#FFF !important;
        font-size:15px;
        letter-spacing: .05em;
        cursor: pointer;
        font-weight: 500;
        font-family: 'Noto Sans JP', serif;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
        position: relative;
        }
        .plan_form .search_btn .btn:hover { opacity: .75;}

        @media only screen and (max-width: 1024px){
        .search { width:100%; float:none;  max-width: 100%; margin:0 auto; padding:0;}
        .search-wrap { padding:35px 40px 25px; top:0; height:auto; }
        .form_box div { padding-bottom:1rem;}
        .form_box div.search_btn { width: 100%; padding-bottom:0; }
        .plan_form { max-width:750px; }
        .plan_form .search_btn .btn { width:100%; margin:0 auto; height:46px; line-height: 46px; }
        }

        @media only screen and (max-width: 767px){
        .search-wrap { background: none; box-shadow: none; padding:0; }
        .search-title { top:-1.2em; }
        .search-container { padding: 18px 15px 0; box-sizing:border-box; }
        .plan_form { max-width:270px; padding:20px 0px; }
        .plan_form .form_box div { padding-bottom:0;}
        .plan_form .title{ margin:0; }
        .plan_form span {margin:0 10px 0 0;}
        .plan_form select { border-radius:2px; border:1px solid #b1aead; background: #ffffff; padding:3px 10px; height:38px; }
        .plan_form input { border-radius:2px; border:1px solid #b1aead; background: #ffffff; padding:3px 10px;}
        .plan_form .check_in { margin:0 0 10px 0;}
        .plan_form .check_in input{ min-height:unset; height: 38px; width:100%; }
        .plan_form .undecided { margin:0 0 10px 0;}
        .plan_form .undecided input{ margin:12px 0 0 0;}
        .plan_form .guests{ margin:0 0 11px 0;}
        .plan_form .type { margin:0 0 11px 0;}
        .plan_form .price span { width:10px; padding:0 6px 0 0;}
        .plan_form .search_btn{ margin-top:15px; height:58px; }    
        .plan_form .search_btn .btn { height:50px; line-height: 50px; font-size:16px; }
        }


        @media screen and (max-width:767px) {
        .search-container { padding-left:0; }
        }



/*==================================================================================================

       Rss カレンダー

===================================================================================================*/

.ui-datepicker table { line-height: 25px; }
        @media screen and (max-width:767px) {
        .ui-datepicker table { line-height: 22px; }
        }
