/* ===================================================================
CSS information

file name  : yprox_searchForm_theme.css
author     : Abilive
style info : デフォルトtheme用CSS
=================================================================== */
/* label */
.yprox_theme--default .inner label {
    display: block;
    font-size: 0.8rem;
    margin-bottom: .3rem;
}

/* input */
.yprox_theme--default .inner input:not([type="submit"]):not([type='checkbox']):not([type='radio']):not([type='number']) {
    display: block;
    width: 100%;
}

.yprox_theme--default .inner input[type="submit"] {
    padding: .7rem;
    display: block;
    background-color: transparent;
    border: none;
    cursor: pointer;
    appearance: none;
    background-color: #232323;
    color: #fff;
    border-radius: .2rem;
    transition: opacity .3s ease-out;
}
@media (hover: hover) and (pointer: fine) {
    .yprox_theme--default .inner input[type="submit"]:hover {
        opacity: .7;
    }
}
.yprox_theme--default .inner input[name="dt"] {
    display: none !important;
}

/**
* カレンダータイプ
*/
.yprox_theme--default[data-calendar] {
    max-width: 1200px;
    margin: 0 auto;
}

.yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper {
    background-color: #fff;
    border: 1px solid #767676;
    /*padding: .5rem;*/
}

.yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper[disabled="disabled"] {
    opacity: .5;
}

.yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper::before {
    content: '';
    display: inline-block;
    margin-right: .3rem;
    background-size: 100% auto;
    width: 1rem;
    height: 1.2rem;
    transform: translate(.5rem, .5rem);
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='26.791' viewBox='0 0 24 26.791'%3E%3Cg%3E%3Cpath fill='%23232323' d='M2.233 2.791h19.534A2.235 2.235 0 0 1 24 5.024v19.534a2.235 2.235 0 0 1-2.233 2.233H2.233A2.235 2.235 0 0 1 0 24.558V5.024a2.235 2.235 0 0 1 2.233-2.233Zm19.534 22.326a.559.559 0 0 0 .558-.558V5.024a.559.559 0 0 0-.558-.558H2.233a.559.559 0 0 0-.558.558v19.534a.559.559 0 0 0 .558.558Z' /%3E%3Cpath d='M23.163 10.046H.837a.837.837 0 0 1 0-1.674h22.326a.837.837 0 1 1 0 1.674Z'/%3E%3Cpath d='M17.581 4.465a.837.837 0 0 1-.837-.837V.837a.837.837 0 0 1 1.674 0v2.791a.837.837 0 0 1-.837.837Z'/%3E%3Cpath d='M6.418 4.465a.837.837 0 0 1-.837-.837V.837a.837.837 0 1 1 1.674 0v2.791a.837.837 0 0 1-.837.837Z'/%3E%3Cg%3E%3Cpath d='M11.999 19.255a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3Cpath d='M6.418 19.255a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3Cpath d='M17.581 13.674a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3Cpath d='M11.999 13.674a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3Cpath d='M6.418 13.674a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3Cpath d='M17.581 19.255a1.118 1.118 0 1 1-1.116 1.119 1.116 1.116 0 0 1 1.119-1.119Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    pointer-events: none;
}

.yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper input[type="text"] {
    display: block;
    background-color: transparent;
    border: none;
    cursor: pointer;
    appearance: none;
    margin-left: -1.3rem;
    padding: 0.5rem;
    padding-left: 1.8rem;
}
/* グループ・エリア検索フォーム */
.yprox_theme--default[data-calendar] .inner .outer_group_select:has(.wrp_area_select) {
	width: 100%;
	margin-bottom: 1rem;
}
.yprox_theme--default[data-calendar] .inner .outer_group_select .wrp_group_select {
	width: fit-content;
}

/* select */
.yprox_theme--default .inner select:not(.flatpickr-monthDropdown-months) {
    padding: .5rem;
    display: block;
}

/* checkInn / Out */
.yprox_theme--default .inner .js-yprox-searchForm__wrpCheckInn br {
    display: none;
}

.yprox_theme--default .inner .js-yprox-searchForm__boxNoDate label {
    display: inline-block;
    vertical-align: middle;
}

.yprox_theme--default .inner .js-yprox-searchForm__wrpCheckInn span {
    display: inline-block;
}

.yprox_theme--default .inner .js-yprox-searchForm__wrpCheckInn span em {
    font-size: 0.8rem;
    margin-left: .2rem;
}

/**
 * 768px以上
 */
@media screen and (min-width: 768px) {
    .yprox_theme--default .inner {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__boxNoDate {
        display: block;
        width: 5rem;
        margin-left: .3rem;
        align-self: center;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__boxNoDate label {
        margin-bottom: 0;
    }

    .yprox_theme--default .inner select:not(.flatpickr-monthDropdown-months) {
        padding: .5rem;
        display: block;
        width: calc(100% - 1rem);
    }
	.yprox_theme--default .inner .js-yprox-searchForm__wrpGroupSelect select,
	.yprox_theme--default .inner .js-yprox-searchForm__wrpAreaGroupSelect select {
		width: 100%;
	}

    /**
    * カレンダータイプ
    */
    .yprox_theme--default input[type="checkbox"] {
        transform: translate(0, .1rem);
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn {
        flex: 1;
        display: flex;
        flex-wrap: wrap;
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpAdults {
        width: 18%
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpNights,
    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpRooms {
        width: 18%;
    }

    .yprox_theme--default[data-calendar] .inner input[type="submit"] {
        width: 12%;
        align-self: flex-end;
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn > label {
        width: 100%;
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper {
        flex: 1;
        display: flex;
    }

	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpCheckInn,
	.yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpCheckInn {
		width: fit-content;
		max-width: 35%;
		margin-right: 1rem;
	}


	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .outer_group_select {
		width: fit-content;
		max-width: 25%;
	}

	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpAdults {
		width: fit-content;
		margin-right: .5rem;
	}

	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpRooms {
		width: 11%;
	}

    /* エリア＆ホテル両方がある場合は2行構成にする */
    .yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):has(.wrp_group_select) {
        column-gap: 1rem;
        row-gap: .75rem;
    }

	.yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .outer_area_group_select,
	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .outer_group_select {
        margin-right: 1rem;
    }

    .yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):has(.wrp_group_select) .outer_area_group_select,
    .yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):has(.wrp_group_select) .outer_group_select {
        flex: 1 1 calc(50% - .5rem);
        max-width: calc(50% - .5rem);
        margin-bottom: 0;
    }
	.yprox_theme--default[data-calendar] .inner .outer_area_group_select select,
    .yprox_theme--default[data-calendar] .inner .outer_group_select select {
        width: 100%;
    }
	.yprox_theme--default[data-calendar] .inner .outer_group_select select.is-no-hotels {
		background-color: #eee;
		color: #333;
		pointer-events: none;
	}
	.yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):has(.wrp_group_select) .outer_area_group_select .wrp_areaselect,
    .yprox_theme--default[data-calendar] .inner:has(.wrp_areaselect):has(.wrp_group_select) .outer_group_select .wrp_group_select {
        width: 100%;
    }

	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpCheckInn {
		flex-direction: column;
	}

	.yprox_theme--default .inner:not(:has(.wrp_group_select)) input[type="submit"] {
		opacity: 1 !important;
	}

	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpCheckInn .js-yprox-searchForm__boxNoDate {
		align-self: flex-start;
		margin-left: 0;
	}

	.yprox_theme--default .inner:has(.wrp_group_select){
		align-items: flex-start;
	}
	.yprox_theme--default[data-calendar] .inner:has(.wrp_group_select) input[type="submit"] {
		align-self: flex-start;
		margin-top: 1rem;
	}

    /**
    * 泊数選択タイプ
     */
	.yprox_theme--default:not([data-calendar]) .js-yprox-searchForm__wrpCheckInn {
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect) .js-yprox-searchForm__wrpCheckInn span,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpCheckInn span {
		width: 31% !important;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select) .js-yprox-searchForm__wrpCheckInn .js-yprox-searchForm__boxNoDate {
		align-self: flex-start;
		margin-left: 0;
		width: 100% !important;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select) input[type="submit"] {
		margin-top: 1rem;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpGroupSelect,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpAreaGroupSelect {
		width: 15%;
		margin-right: 1rem;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpCheckInn,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpCheckInn {
		width: 40%;
	}

	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)),
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) {
		align-items: flex-start;
	}

	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) input[type="submit"],
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) input[type="submit"] {
		margin-top: 1rem;
	}

	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpAdults,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpAdults {
		width: 15%;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpNights,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpNights {
		width: 9%;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):not(:has(.wrp_areaselect)) .js-yprox-searchForm__wrpRooms,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_areaselect):not(:has(.wrp_group_select)) .js-yprox-searchForm__wrpRooms {
		width: 10%;
	}

	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):has(.wrp_areaselect) .js-yprox-searchForm__wrpGroupSelect,
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):has(.wrp_areaselect) .js-yprox-searchForm__wrpAreaGroupSelect {
		flex: 1 1 calc(50% - .5rem);
        max-width: calc(50% - .5rem);
        margin-bottom: 1rem;
	}
	.yprox_theme--default:not([data-calendar]) .inner:has(.wrp_group_select):has(.wrp_areaselect) .js-yprox-searchForm__wrpGroupSelect {
		margin-left: 1rem;
	}
    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn {
        flex: 1;
        display: flex;
        flex-wrap: wrap;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn > label {
        width: 100%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:not(.js-yprox-searchForm__boxNoDate) {
        display: flex;
        align-items: center;
        width: 20%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span.js-yprox-searchForm__boxCheckin-year {
        width: 33%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:nth-of-type(n+2) {
        margin-left: .5rem;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpAdults {
        width: 20%
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpNights,
    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpRooms {
        width: 12%;
    }

	.yprox_theme--default:not([data-calendar]) .inner:not(:has(.wrp_group_select)):not(:has(.wrp_areaselect)) input[type="submit"] {
		align-self: flex-end;
	}
}

/**
 * 1024px-768px
 */
@media screen and (max-width: 1024px) and (min-width: 768px) {
    /* select */
    .yprox_theme--default .inner select:not(.flatpickr-monthDropdown-months) {
        padding: .5rem;
        display: block;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn {
        flex: 1;
        display: flex;
        flex-wrap: wrap;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn > label {
        width: 100%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:not(.js-yprox-searchForm__boxNoDate) {
        width: 20%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span.js-yprox-searchForm__boxCheckin-year {
        width: 26%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:nth-of-type(n+2) {
        margin-left: .5rem;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpAdults {
        width: 18%
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpNights {
        width: 11%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpRooms {
        width: 13%;
    }

    /* select */
    .yprox_theme--default:not([data-calendar]) .inner select:not(.flatpickr-monthDropdown-months) {
        padding: .5rem .2rem;
    }
}

/**
 * 767px以下
 */
@media screen and (max-width: 767px) {
    .flatpickr-calendar, .flatpickr-days {
        width: auto !important;
    }

    .yprox_theme--default .inner {
        display: flex;
        flex-wrap: wrap;
    }

    .yprox_theme--default[data-calendar] .inner div:nth-of-type(3) {
        margin-left: auto;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__wrpCheckInn {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 1rem;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__boxNoDate {
        display: block;
        margin-top: .3rem;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__wrpAdults,
    .yprox_theme--default .inner .js-yprox-searchForm__wrpRooms,
    .yprox_theme--default .inner .js-yprox-searchForm__wrpNights {
        width: 48%;
        margin-bottom: 1rem;
    }

    .yprox_theme--default .inner input[type="submit"] {
        width: 100%;
        margin: 0 auto;
    }

    .yprox_theme--default .inner select:not(.flatpickr-monthDropdown-months) {
        width: 100%;
    }

    .yprox_theme--default .inner .js-yprox-searchForm__wrpCheckInn > label {
        width: 100%;
    }

    /**
   * カレンダータイプ
   */
    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__wrpCheckInn .flatpickr-wrapper {
        flex: 1;
        display: flex;
    }

    .yprox_theme--default[data-calendar] .inner .js-yprox-searchForm__boxNoDate {
        width: 100%;
    }

    /**
     * 泊数選択タイプ
     */
    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpAdults {
        width: 100%;
    }

    .yprox_theme--default:not([data-calendar]) .inner div:nth-of-type(4) {
        margin-left: auto;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:not(.js-yprox-searchForm__boxNoDate) {
        display: flex;
        align-items: center;
        width: 32%;
    }

    .yprox_theme--default:not([data-calendar]) .inner .js-yprox-searchForm__wrpCheckInn span:not(.js-yprox-searchForm__boxNoDate):nth-of-type(n+2) {
        margin-left: 2%;
    }

	.yprox_theme--default .inner .outer_area_group_select,
    .yprox_theme--default .inner .outer_group_select {
		width: 100%;
		max-width: 100%;
    }

	.yprox_theme--default .inner .outer_area_group_select .wrp_areaselect,
    .yprox_theme--default .inner .outer_group_select .wrp_group_select {
        width: 100% !important;
		margin-bottom: 1rem;
    }

	.yprox_theme--default .inner .outer_area_group_select select,
    .yprox_theme--default .inner .outer_group_select select {
        width: 100%;
    }

	.yprox_theme--default .inner .js-yprox-searchForm__wrpRooms {
		margin-left: auto;
    }
}