/*
Theme Name: Hotel LUX Child
Theme URI: http://cmsmasters.net/hotel-lux-child/
Author: cmsmasters
Author URI: http://cmsmasters.net/
Description: Hotel LUX Child Theme
Template: hotel-lux
Version: 1.0.0
License:
License URI:
Text Domain: hotel-lux-child
Tags: one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/


body {
  color: #FFFFFF;
}

H2 {
	font-family: 'Yu Mincho','游明朝体', 'YuMincho', 'Hiragino Mincho ProN', 'Noto Serif JP', 'serif';
}

H4{
	font-family:'Arial','ヒラギノ角ゴ ProN W3',sans-serif;
}

main {
   border-top: none;
}

.entry-content {
   margin-top: 0;
}


.home-header, .home .jumbotron{
	display: none;
}
.home .site-header{
	position: absolute;
	top: 0;
	left: 0;
	background-color: rgba(255,255,255,0.5);
	width: 100vw;
	z-index: 2;
}

.header_wrap{
	position: relative;
	width: 100vw;
	height: 100vh;
	margin: 0 calc(50% - 50vw);
}
.header_movie{
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100%;
	z-index: 1;
}
.header_movie video {
	position: absolute;
	top: 50%;
	left: 50%;
	width: auto;
	height: auto;
	min-width: 100%;
	min-height: 100%;
	transform: translate(-50%,-50%);
}
.header_text{
	position: absolute;
	z-index: 2;
	left: 50%;
	top: 40%;
	transform: translate(-50%, -50%);
	text-align: center;
}
.header_text h2{
	font-size: 60px;
	color: #fff;
	font-weight: bold;
	text-shadow: 2px 2px 8px #000;
	margin-bottom: 0;
}
.header_text h3{
	font-size: 20px;
	color: #fff;
	text-shadow: 2px 2px 8px #000;
	margin-top: 10px;
}
.arrow{
	position: absolute;
	top: 85%;
	left: 50%;
	width: 30px;
  height: 30px;
  border: 2px solid;
  border-color: transparent transparent #fff #fff;
  transform: rotate(-45deg) translatex(-30px);
	z-index: 2;
}
.down{
  position: absolute;
	top: 80%;
	left: 50%;
	transform: translatex(-50px);
	color: #fff;
	z-index: 2;
}


/*************************************
 * 料金表スタイルシート　ここから
*************************************/
.pricebox{
 	min-width: 100px; /* テーブルがこれ以下にはならないようにする */
	table-layout: auto; /* テーブルの幅を自動で調整 */
	font-family:'Arial','ヒラギノ角ゴ ProN W3',sans-serif;/*フォントを指定*/
    border-collapse: collapse; /* ボーダーの重なりを防ぐ */
}

.pricebox table {
	width: 100%;
	min-width: 1000px; /* 必要に応じて調整 */
}


/*↓号室の行　rooms*/
.pricebox tr .rooms{
	background-color:#70000f;/*赤*/
	padding: 10px;
	border:2px solid rgba(132,0,35,0.9) !important;/*白（透明度有）*/
	border-bottom:none !important;
	color:#ddd;/*薄いグレー*/
	text-align:center;
	vertical-align:middle;
}

/*↓号室の行　rooms*/
td.rooms{
	border-bottom:none;
	border-top-left-radius: 12px !important;
	border-top-right-radius: 12px!important;
	text-align:center;
}

/*号室の左側　shopnamearea*/
.pricebox tr .shopnamearea{
	background-color:#70000f;/*赤*/
	margin:0;
	padding:10px;
	border:none !important;
	font-size: 18pt;
	font-weight: bold;
	color:#ddd;/*薄いグレー*/
	background-color:rgba(132,0,35,0.94);
	vertical-align: bottom;
	border-top-left-radius: 12px !important;
	border-top-right-radius: 12px!important;
}

/*↓グレード　*/
.pricebox tr .type{
	width:9%;
	border:none !important;
	text-align:center;
}

/*↓種類の列　utility*/
.pricebox tr .utility{
	background-color:#70000f;/*赤*/
	width:9%;
	color:#ddd;/*薄いグレー*/
	border-color:rgba(132,0,35,0.9);/*白（透明度有）*/
}

th.utility{
	text-align:center;
	vertical-align:middle;
	font-weight: bold;
}


/*↓曜日の列　weeks*/
table tr .weeks{
	border:none !important;
	width: 15%;
}
.pricebox tr .weeks{
	width:50px;
	border:none !important;
	width: 9%;
	padding: 5px;
	border-left:1px dotted #666666;/*濃いグレー*/
}
th.weeks{
	height:80px;
	font-weight: bold;
}

/*↓時間の列　time*/
table tr .time{
	border:none !important;
	width: 15%;
}
.pricebox tr .time{
	width:50px;
	border:none !important;
	width: 9%;
	padding: 5px;
	border-left:1px dotted #666666;/*濃いグレー*/
}
th.time{
	height:80px;
	font-weight: bold;
}


/*↓金額の表　pircedetail*/
.pricebox tr .pircedetail{
	width:9%;
}

.pricebox tr .on{
	border:2px solid rgba(132,0,35,0.2) !important;/*濃い赤（透明度有）*/
	background-color:#FAF0E6;/*めちゃ薄クリーム色*/
	color:#666666;/*薄いグレー*/
	min-width: 80px;
	text-align:center;
	vertical-align:middle;
}
.pricebox tr .off{
	border:2px solid rgba(132,0,35,0.2) !important;/*濃い赤（透明度有）*/
	background-color:#ffffff;/*白*/
	color:#666666;/*薄いグレー*/
	text-align:center;
	vertical-align:middle;
}

.pricebox th {
	min-width: 120px;
}

th.last-row{
	border-bottom:2px solid #70000f;/*濃い赤*/
}
.pricebox tr .last-row{
	border-bottom-color:#70000f !important;/*濃い赤*/
}

/*横スクロール*/
.yoko-scroll{
	overflow-x:auto; !important;
}


/* スマートフォンとタブレット用の設定 */
@media (max-width: 1024px) {
    .pricebox {
        min-width: 800px; /* タブレット用に調整 */
    }
}

@media (max-width: 640px) {
    .pricebox {
        min-width: 550px; /* スマートフォン用に調整 */
    }
}

/* スマートフォン用のテーブルスタイル */
@media (max-width: 640px) {
    .pricebox {
        display: block;
        width: 100%;
    }
    
    .pricebox tr {
        display: flex;
        flex-direction: column; /* 縦並び */
        margin-bottom: 10px;
    }
    
    .pricebox th, .pricebox td {
        display: flex; /* セルをフレックスボックスに */
        justify-content: center; /* セル内のコンテンツを中央揃え */
        text-align: center;
        padding: 5px; /* パディングを追加 */
        border: 1px solid #70000f; /* ボーダーを追加 */
    }

    /* 最初の行を特別にスタイリング */
    .pricebox th.utility {
        flex-basis: 100%; /* 1行目は全幅に */
    }
    
    /* 2行目と3行目のカスタマイズ */
    .pricebox tr:nth-child(2) th, .pricebox tr:nth-child(3) th {
        flex-basis: 50%; /* 2列分 */
    }
    
    .pricebox td.rooms {
        flex-basis: 100%; /* roomsは全幅に */
    }
    
    .pricebox td.pircedetail {
        flex-basis: 50%; /* price detailは2列分 */
    }
}


/*************************************
 * 料金表スタイルシート　ここまで
*************************************/

/* ヘッダーとスライダーの間の余白削除 */

.middle_content.entry {
  padding-top: 0 !important;
}


/* ヘッダーとスライダーの間の余白削除
.middle_content.entry {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.elementor-column-gap-default > .elementor-column > .elementor-element-populated {
  padding: 0 !important;
}

p {
  padding: 0 !important;
}
 */