/*モーダル開いてる時　スクロール防止→jsで制御*/

/* モーダルのオーバーレイ */
.modal-overlay {
    display: none; /* 初期状態では非表示 */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);  /*半透明の黒背景 */
    z-index: 1000; /* 他の要素より手前に表示 */
	overflow-x: hidden;/*スクロール可にするため*/
    overflow-y: auto;/*スクロール可にするため*/
/*
    justify-content: center;
    align-items: center;
*/
}

/* モーダルのコンテンツ */
.modal-ferry-search {
    background-color: white;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    width: 90%;
    max-width: 400px;
    position: relative;
	margin: 20px auto;
}

@media(min-width : 768px) {
	.modal-ferry-search {
		margin: 50px auto;
	}
}

.modal-ferry-search h2 {
    margin-top: 0;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    padding: 10px;
	background: #333;
	border-radius: 5px 5px 0 0;
}
.form-group {
    margin-bottom: 15px;
	display: flex;
	position: relative;
}
.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}
.form-group input {
    width: calc(100% - 65px);/*65px＝左のlabelの幅*/
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 16px;
	line-height: 38px;
}
button[type="submit"] {
    display: block;
    width: 100%;
    padding: 12px;
    background-color: #333;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 16px;
    cursor: pointer;
    margin-top: 20px;
	font-weight: bold;
}
button[type="submit"]:hover{
	opacity: 0.8;
}
.close-button {
    position: absolute;
    top: 5px;
    right: 5px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #fff;
	font-weight: bold;
}
.close-button:hover{
	opacity: 0.7;
}


/*追記20250818*/
.modal-search-body{
	padding: 1.5rem 1rem;
}

/*各項目*/
.form-group label{
	width: 65px;
	font-size: 14px;
	line-height: 38px;
}

/*日付*/
.form-group input[type="date"]{
    position: relative;
}
/*祝日 赤字*/
.holiday {
    color: #da4453 !important;
}

/*アイコン カレンダー*/
.form-group input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    width: 100%;
    height: 100%;
	cursor: pointer;
	background: none;/*デフォルトのアイコン画像非表示*/
}
.form-group.calendar-wrap:before {
    z-index: 1;
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    content: "\f073";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    line-height: 38px;
    color: #ddd;
    font-size: 16px;
    pointer-events: none;
}

/* 人数全体(+-と数字) */
.input-group{
	position: relative;
	margin-bottom: 0;
	width: calc(100% - 65px);/*65px＝左のlabelの幅*/
}

/*数字部分*/
.input-group .form-control{
	text-align: center;
	color:#000;
	border-color:#DBDBDB;
	border-left:none;
	border-right:none;
	height:36px;
}
.input-group .form-control:disabled, 
.input-group .form-control[readonly]{
	background:#fff;
}

/*ボタン「+-」*/
.input-group-btn .btn-left,
.input-group-btn .btn-right{
	font-size: 14px;
	background:#fff;
	border-color:#ccc;
	height:36px;
	width:46px;
	color:#999;
	box-shadow: none;
}
.input-group-btn .btn-left{
	border-radius: 36px 0 0 36px;
}
.input-group-btn .btn-right{
	border-radius: 0 36px 36px 0;
}

/*アイコン「+-」*/
.input-group .fa-plus,
.input-group .fa-minus{
	color: #3BAFDA;
}


/*アイコン 小児と幼児の「?」*/
.fa-question-circle{
	padding: 0 5px;
	color: #333;
}

/*アコーディオン中身*/
.about_baby{
	padding:10px;
	margin-top:10px;
	margin-bottom:10px;
	border:1px solid #ccc;
	border-radius:5px;
}

.about_baby h4{
	font-size:14px;
	font-weight:bold;
	margin-top:-10px;
	margin-left:-10px;
	margin-right:-10px;
	padding:7px;
	text-align:center;
	background:#f4f4f4;
	border-radius: 5px 5px 0 0;
}
.about_baby h5{
	font-size:14px;
	font-weight:bold;
	margin-top:10px;
	margin-bottom:5px;
}

.about_baby ul{
	margin-left:20px;
}
.about_baby ul li{
	list-style:disc;
	font-size: 12px;
}

.about_baby p{
	margin-bottom:0;
	font-size: 12px;
}

/*赤字*/
.about_baby .txt-red{
	color: #C01616 !important;
	font-weight: bold;
}