/*
Theme Name:twentytwentyone-child
Template:twentytwentyone
Theme URI: https://wordpress.org/themes/twentytwentyone/
*/

/*▼▼▼▼▼▼▼▼汎用▼▼▼▼▼▼▼▼*/
	/*-----基本フォント-----*/
	body, h1, h2, h3, h4, h5, h6, p, span, a, th, td, li, strong, caption {
		font-family: 游ゴシック, YuGothic, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, メイリオ, Meiryo, Verdana, sans-serif !important;
	}
    #poststuff {

    }
/*▼▼▼▼▼▼▼▼ヘッダー▼▼▼▼▼▼▼▼*/
/*=====サイトタイトル=====*/
    /*-----非表示-----*/
    #masthead .site-branding {
        display: none;
    }
/*=====ロゴ=====*/
    /*-----親要素-----*/
    #masthead.site-header {
        padding: 30px 0 30px;
    }
    #masthead .site-logo {
        padding: 0;
        border: none;
        margin: 0 auto;
    }
    /*-----子要素-----*/
    #masthead .site-logo .custom-logo-link {
        display: block;
    }
    /*-----サイズ-----*/
    #masthead .site-logo img {
        max-width: 100%;
        max-height: 100%;
        height: 150px!important;
        padding: 0 10px;
    }

/*▼▼▼▼▼▼▼▼予約カレンダー▼▼▼▼▼▼▼▼*/
/*◆◆◆◆◆空き状況◆◆◆◆◆*/
    /*-----親要素-----*/
    .bookingBox {
        margin: 0 auto 0!important;
        max-width: 1024px!important;
        width: 100%;
    }
    /*-----子要素-----*/
    .bookingBox_inner {
        width: 95%;
        margin: auto;
        display: flex;
    }
    /*-----テキスト-----*/
    .bookingBox_inner p {
        font-size: 14px;
        letter-spacing: 1px;
        margin: 0 6px 0 0;
        font-weight: 600;
        color: #666;
    }
/*◆◆◆◆◆デザイン：カレンダー以外◆◆◆◆◆*/
/*=====上下=====*/
    /*-----親要素-----*/
    #main {
        padding: 0 0;
    }
    /*-----子要素-----*/
    #main .entry-content {
        margin: 0 0;
    }
/*=====幅=====*/
    /*-----親要素-----*/
    #booking01 {
        max-width: 1024px;
        width: 100%;
    }
    /*-----子要素-----*/
    #booking01 table {
        width: 95%;
        margin: 0 auto!important;
    }
/*=====年月=====*/
    /*-----テキスト-----*/
    #booking01 .monthly-calendar caption {
        font-size: 30px;
        letter-spacing: 2px;
        margin: 0 0 10px 0;
        font-weight: 600;
        color: #777;
    }
/*=====前月・次月=====*/
    /*-----親要素-----*/
    #booking01 .monthly-prev-next {
        margin: 10px auto 0;
        width: 95%;
    }
    /*-----終了前月非表示-----*/
    #booking01 .monthly-prev-next .no-link {
        display: none;
    }
    /*-----下線なし-----*/
    #booking01 .monthly-prev-next a {
        text-decoration: none;
        font-weight: 600;
        color: #777;
        letter-spacing: 1px;
    }
    /*-----アクティブ時-----*/
    .site #booking01 a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
        background: no-repeat;
    }
    /*-----次月-----*/
    #booking01 .monthly-prev-next .monthly-next {
        margin: 0 25px 0 0;
    }
    /*-----前月-----*/
    #booking01 .monthly-prev-next .monthly-prev {
        margin: 0 0 0 25px;
    }
    /*-----矢印：親要素-----*/
    #booking01 .monthly-prev-next a {
        position: relative;
    }
    /*-----矢印：次月-----*/
    #booking01 .monthly-prev-next .monthly-next a::after {
        content: "";
        position: absolute;
        top: 50%;
        width: 10px;
        height: 10px;
        border-top: 2px solid #777;
        border-right: 2px solid #777;
        transform: rotate(45deg);
        margin-top: -5px;
        right: -15px;
    }
    /*-----矢印：前月-----*/
    #booking01 .monthly-prev-next .monthly-prev a::before {
        content: "";
        position: absolute;
        top: 50%;
        width: 10px;
        height: 10px;
        border-top: 2px solid #777;
        border-right: 2px solid #777;
        transform: rotate(-135deg);
        margin-top: -5px;
        left: -17px;
    }
/*◆◆◆◆◆カレンダー◆◆◆◆◆*/
/*=====背景=====*/
    /*-----共通-----*/
    #booking01 tbody {
        background: #fff;
        box-shadow: 0 0 3px 0 rgb(0 0 0 / 10%), 0 4px 6px 0 rgb(0 0 0 / 10%);
    }
/*=====ボーダー=====*/
    /*-----共通-----*/
    #booking01 tbody th,
    #booking01 tbody td {
        border: none;
    }
    /*-----th-----*/
    #booking01 tbody th {
        border-right: solid 4px #d1e4dd;
    }
    #booking01 tbody th:last-child {
        border-right: none;
    }
    /*-----td-----*/
    #booking01 tbody td {
        border-top: solid 4px #d1e4dd;
        border-right: solid 4px #d1e4dd;
        font-weight: 600;
    }
    #booking01 tbody td:last-child {
        border-right: none;
    }
/*=====枠=====*/
    /*-----th：first-----*/
    #booking01 tbody th:first-child {
        border-top-left-radius: 6px;
    }
    /*-----th：last-----*/
    #booking01 tbody th:last-child {
        border-top-right-radius: 6px;
    }
    /*-----td：first-----*/
    #booking01 tbody tr:last-child td:first-child {
        border-bottom-left-radius: 6px;
    }
    /*-----td：last-----*/
    #booking01 tbody tr:last-child td:last-child {
        border-bottom-right-radius: 6px;
    }
/*=====当月以外=====*/
    /*-----背景-----*/
    #booking01 tbody tr .day-box.no-day {
        background-color: rgb(240 240 240 / 40%);
    }
/*=====予約枠あり=====*/
    /*-----親要素-----*/
    #booking01 tbody tr .vacant .calendar-daylink {
        text-decoration: none;
    }
/*=====曜日=====*/
    /*-----平日-----*/
    #booking01 tbody .week-title {
        color: #666;
        font-size: 20px;
    }
    /*-----土-----*/
    #booking01 tbody .week-title.sat {
        color: #79CEED;
    }
    /*-----日-----*/
    #booking01 tbody .week-title.sun {
        color: #ec7079;
    }
/*=====日付=====*/
    /*-----親要素-----*/
    #booking01 tbody td {
        font-weight: 600;
        color: #666;
        height: 100px;
    }
    /*-----土-----*/
    #booking01 tbody .sat .day-number {
        color: #79CEED;
    }
    /*-----日-----*/
    #booking01 tbody .sun .day-number {
        color: #ec7079;
    }
    /*-----予約状況-----*/
    #booking01 tbody td div:nth-child(2) {
        font-size: 18px;
        padding: 6px 0 0 0;
    }
/*◇◇◇◇◇レスポンシブ◇◇◇◇◇*/
	@media screen and (max-width: 660px) {
    /*=====ロゴ=====*/
        /*-----親要素-----*/
        #masthead.site-header {
            padding: 20px 0 20px;
        }
        /*-----サイズ-----*/
        #masthead .site-logo img {
            height: 90px!important;
        }
    /*=====年月=====*/
        /*-----テキスト-----*/
        #booking01 .monthly-calendar caption {
            font-size: 24px;
        }
    /*=====前月・次月=====*/
        /*-----矢印：親要素-----*/
        #booking01 .monthly-prev-next a {
            font-size: 18px;
        }
        /*-----矢印：次月-----*/
        #booking01 .monthly-prev-next .monthly-next a::after {
            width: 8px;
            height: 8px;
            margin-top: -4px;
        }
        /*-----矢印：前月-----*/
        #booking01 .monthly-prev-next .monthly-prev a::before {
            width: 8px;
            height: 8px;
            margin-top: -4px;
        }
    /*=====日付=====*/
        /*-----親要素-----*/
        #booking01 tbody td {
            height: 50px;
            padding: 4px 0;
        }
        /*-----予約状況-----*/
        #booking01 tbody td div:nth-child(2) {
            padding: 0 0 0 0;
        }
    }
/*▼▼▼▼▼▼▼▼予約時間▼▼▼▼▼▼▼▼*/
    /*-----親要素-----*/
    #booking01 .day-calendar {
        padding: 0 20px;
    }
    /*-----タイトル-----*/
    #booking01 .day-calendar h3 {
        font-size: 26px;
        font-weight: 600;
        color: #666;
        text-align: center;
    }
    /*-----年月日-----*/
    #booking01 .day-calendar p {
        font-size: 20px;
        letter-spacing: 1px;
        font-weight: 600;
        color: #666;
        text-align: center;
    }
/*=====テーブル=====*/
    /*-----親要素-----*/
    #booking01 .day-calendar table {
        width: 100%;
        margin: 20px 0 0 0!important;
    }
    /*-----子要素-----*/
    #booking01 .day-calendar table tbody {
        box-shadow: none;
    }
    /*-----テキストカラー-----*/
    #booking01 .day-calendar table th,
    #booking01 .day-calendar table td {
        color: #666;
        height: 100%;
        border-radius: 0;
        border: none;
    }
    /*-----角-----*/
    #booking01 .day-calendar table tr th:first-child {
        border-right: solid 4px #d1e4dd;
    }
    #booking01 .day-calendar table tr:first-child th:first-child {
        border-top-left-radius: 6px;
        border-right: solid 4px #d1e4dd;
    }
    #booking01 .day-calendar table tr:first-child th:last-child {
        border-top-right-radius: 6px;
    }
    #booking01 .day-calendar table tr:last-child th:first-child {
        border-bottom-left-radius: 6px;
        border-right: solid 4px #d1e4dd;
    }
    #booking01 .day-calendar table tr:last-child th:last-child {
        border-bottom-right-radius: 6px;
    }
    /*-----ヘッダー-----*/
    #booking01 .day-calendar table tr:first-child th {
        font-size: 20px;
        letter-spacing: 4px;
        height: 40px;
        padding: 0;
    }
    /*-----テキスト-----*/
    #booking01 .day-calendar table tr th,
    #booking01 .day-calendar table tr td {
        font-size: 20px;
    }
    /*-----予約状況-----*/
    #booking01 .day-calendar table tr td .calendar-mark {
        font-size: 20px;
    }
    #booking01 .day-calendar table tr td .calendar-mark a {
        text-decoration: none;
    }

/*▼▼▼▼▼▼▼▼予約フォーム▼▼▼▼▼▼▼▼*/
/*=====タイトル=====*/
    /*-----親要素-----*/
    #post-10 .entry-header,
    #post-12 .entry-header {
        margin: 0 auto 40px;
        padding: 0;
        border-bottom: none;
    }
    /*-----子要素-----*/
    #post-10 .entry-header h1,
    #post-12 .entry-header h1 {
        color: #666;
        font-size: 26px;
        text-align: center;
        font-weight: 600;
        margin: 10px 0;
        letter-spacing: 2px;
    }
/*◆◆◆◆◆フォーム◆◆◆◆◆*/
    /*-----親要素-----*/
    #post-10 #booking-form {
        width: 100%;
        max-width: 768px;
        margin: auto;
        padding: 0 15px;
    }
/*=====共通=====*/
    /*-----親要素-----*/
    #post-10 #booking-form form fieldset {
        border: none;
        width: 100%;
        margin: 0;
        padding: 0;
        display: flex;
        border-top: solid #666;
    }
    /*-----項目名-----*/
    #post-10 #booking-form form fieldset legend {
        color: #666;
        font-size: 20px;
        letter-spacing: 2px;
        line-height: 1;
        padding: 0 15px 0 0;
    }
    /*-----table-----*/
    #post-10 #booking-form form fieldset table {
        width: 100%;
        margin: 30px 0 20px;
    }
    /*-----tr-----*/
    #post-10 #booking-form form fieldset table tr {
        height: 60px;
    }
    /*-----th-----*/
    #post-10 #booking-form form fieldset table th {
        border: none;
        color: #666;
        letter-spacing: 1px;
        text-align: left;
        line-height: 1;
        padding: 0;
        vertical-align: middle;
        width: 140px;
    }
    /*-----小項目名-----*/
    #post-10 #booking-form form fieldset table th label {
        font-size: 16px;
        letter-spacing: 1px;
        font-weight: 600;
        color: #666;
    }
    /*-----td-----*/
    #post-10 #booking-form form fieldset table td {
        border: none;
        border-radius: 3px;
        padding: 0;
    }
    /*-----入力ボックス-----*/
    #post-10 #booking-form form fieldset table td input,
    #post-10 #booking-form form fieldset table td textarea {
        border-color: #666;
        padding: 6px 10px;
        height: 46px;
        color: #666;
        border-radius: 3px;
        margin: 0;
        width: 100%;
    }
/*=====ご予約=====*/
    /*-----大人・br非表示-----*/
    #post-10 #booking-form #booking-reservation-fieldset .input-number label,
    #post-10 #booking-form #booking-reservation-fieldset .input-number br {
        display: none;
    }
    /*-----人数ボックス-----*/
    #post-10 #booking-form #booking-reservation-fieldset .input-number #client-adult {
        padding: 0;
        text-align: center;
        width: 4rem;
    }
    /*-----予約内容-----*/
    #post-10 #booking-form #booking-reservation-fieldset tr:first-child td {
        font-size: 18px;
        font-weight: 600;
        color: #666;
    }
/*=====ご連絡先=====*/
    /*-----非表示-----*/
    #post-10 #booking-form #booking_client-fieldset table tr:nth-child(6) #client-address2 {
        display: none;
    }
/*=====連絡事項=====*/
    /*-----親要素-----*/
    #post-10 #booking-form #booking-note {
        height: 138px;
    }
/*=====送信ボタン=====*/
    /*-----親要素-----*/
    #post-10 #booking-form #action-button button {
        line-height: 1;
        padding: 10px 0;
        width: 150px;
        border-radius: 4px;
        letter-spacing: 2px;
    }
/*◇◇◇◇◇フォーム：レスポンシブ◇◇◇◇◇*/
@media screen and (max-width: 500px) {
    #post-10 #booking-form #booking-reservation-fieldset th {
        width: 70px;
    }
    #post-10 #booking-form #booking_client-fieldset th,
    #post-10 #booking-form #booking_client-fieldset td,
    #post-10 #booking-form #booking-message-fieldset th,
    #post-10 #booking-form #booking-message-fieldset td {
        display: block;
    }
    #post-10 #booking-form #booking_client-fieldset th,
    #post-10 #booking-form #booking-message-fieldset th {
        width: 100%;
        margin: 0 0 8px 0; 
    }
    #post-10 #booking-form #booking_client-fieldset td,
    #post-10 #booking-form #booking-message-fieldset td {
        margin: 0 0 16px 0;
    }
}
/*▼▼▼▼▼▼▼▼予約フォーム▼▼▼▼▼▼▼▼*/
    /*-----親要素-----*/
    #post-10 #booking-confirm-fieldset table td {
        color: #666;
        font-weight: 600;
        letter-spacing: 1px;
    }
    /*-----非表示-----*/
    #post-10 #booking-form #booking-confirm-fieldset tr:nth-child(3),
    #post-10 #booking-form #booking-confirm-fieldset tr:nth-child(10),
    #post-10 #booking-form #booking-confirm-fieldset tr:nth-child(2) br {
        display: none;
    }
/*◇◇◇◇◇予約フォーム：レスポンシブ◇◇◇◇◇*/
@media screen and (max-width: 500px) {
    #post-10 #booking-form #booking-confirm-fieldset th,
    #post-10 #booking-form #booking-confirm-fieldset td {
        display: block;
    }
    #post-10 #booking-form #booking-confirm-fieldset th,
    #post-10 #booking-form #booking-confirm-fieldset th {
        width: 100%;
        margin: 0 0 8px 0; 
    }
    #post-10 #booking-form #booking-confirm-fieldset td,
    #post-10 #booking-form #booking-confirm-fieldset td {
        margin: 0 0 16px 0;
    }
}

/*▼▼▼▼▼▼▼▼予約完了▼▼▼▼▼▼▼▼*/
    /*-----親要素-----*/
    .doneBox {
        text-align: center;
    }
    /*-----子要素-----*/
    .doneBox .doneBox_inner {
        display: inline-block;
        text-align: left;
    }
    /*-----一行目-----*/
    .doneBox .doneBox_inner .doneBox_txt1 {
        margin: 0 0 15px;
        line-height: 1.4;
    }
    /*-----二行目-----*/
    .doneBox .doneBox_inner .doneBox_txt2 {
        line-height: 1.4;
    }

/*▼▼▼▼▼▼▼▼フッター▼▼▼▼▼▼▼▼*/
    /*-----親要素-----*/
    #colophon {
        margin: 0 auto;
        padding: 0;
    }
    /*-----子要素-----*/
    #colophon .site-info {
        margin: 0 auto;
        padding: 0;
        border: none;
    }
    /*-----ロゴなし-----*/
    #colophon .site-info .site-name {
        display: none;
    }
    /*-----コピーライト-----*/
    #colophon .site-info .powered-by {
        display: none;
    }
    /*-----余白-----*/
    .entry-footer {
        margin: 80px auto 0!important;
    }