@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/

html { scroll-behavior: smooth; }
.entry-title {
display: none;
}

body {
-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"
}

.b15 {
    padding-bottom: 15px;
}


.header-container-in.hlt-top-menu .logo-header {
   max-height: 75px;
}

.header-container-in.hlt-top-menu .logo-header img {
   max-height: 75px;
}

#header {
   flex-shrink: 0;
}

div#header-container {
	border-bottom: 5px solid #eeaa25;
    padding-bottom: 3px;
}

.breadcrumb-home svg,
.breadcrumb .fa-folder,
.breadcrumb .fa-file,
.breadcrumb .fa-file-o,
.none
{
display: none;
}

.start-time, .end-time {
	appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
}

.pc-callender-slider {
    margin: 0;
    padding: 0;
}

#main-view-img-box {
	margin-top: 15px;
}

.swiper-container-pointer-events {
	margin-top: 20px;
}

.swiper-container .swiper-slide {
   position: relative;
}

.swiper-button-next:after, .swiper-button-prev:after {
   display: none;
}
.swiper-button-prev {
    position: absolute;
    width: 50px !important;
    height: 50px !important;
    background: #dedede;
    color: #333 !important;
    border-radius: 50%;
    display: table;
    text-align: center;
    top: 50%;
    left: 0;
}
.swiper-button-next {
    position: absolute;
    width: 50px !important;
    height: 50px !important;
    background: #dedede;
    color: #333 !important;
    border-radius: 50%;
    display: table;
    text-align: center;
    top: 50%;
    right: 0;
}

.swiper-container .swiper-slide a {
	text-decoration: none;
}

.class-box {
border: 1px solid #ccc;
-webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
padding: 0 10px;
text-align: center;
box-sizing: border-box;
}

.class-name {
	font-weight: bold;
    font-size: 18px;
	color: #333;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
}

.img-box {
    height: 150px;
    margin: auto;
    position: relative;
    text-align: center;
}

.class-img {
	bottom: 0;
    display: inline;
    left: 0;
    margin: auto;
    max-height: 100%;
    max-width: 100%;
    padding-bottom: 10px;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}

a.class-box div.class-name {
text-decoration: none;
color: #212529 !important;
}

h2.list-style-b {
	border-top: 1px solid #ccc;
    border-bottom: 3px solid #ccc;
    font-size: 20px;
    font-weight: bold;
	font-feature-settings: "palt";
    margin-bottom: 0px;
    padding: 15px 0 12px 10px;
}

footer {
	padding-top: 1px;
}

.content-bottom, aside#custom_html-2 {
    margin-bottom: 0;
}

div#content-bottom-in {
	margin-bottom: 0;
}

ul#menu-footer a {
	font-size: 16px;
}

.copyright {
	font-size: 16px;
	margin-top: 15px;
}



.footer-bottom.fdt-up-and-down .footer-bottom-content .navi-footer-in > ul {
	justify-content: space-around;
}

.navi-footer-in > .menu-footer li, .navi-footer-in > .menu-footer li:last-child{
	border: none;
}

#navi .navi-in a:hover, #footer a:hover {
	background-color: inherit;
}

div#top-scroll-area {
    text-align: center;
}

a.gray, a.gray:hover {
	color:#808080;
}

a.gray {
	text-decoration: none;
}

a.gray:hover {
	text-decoration: underline;
}

/************************************
** カレンダー検索
************************************/

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
/*     margin-right: -15px;
    margin-left: -15px; */
}

.form-control:disabled, .form-control[readonly] {
    background-color: #e9ecef;
    opacity: 1;
}

#reserve-box .form-control:disabled {
    cursor: default;
    color: #aaa;
}

#reserve-box {
  background: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  border: 2px solid #eeaa25;
  font-size: 16px;
  padding-top: 25px;
  padding-right: 15px;
  padding-bottom: 25px;
  padding-left: 15px;
  margin-bottom: 25px;
}

#reserve-box .form-group.form-group-during {
    overflow: hidden;
    margin-bottom: 5px;
}

h2.lbl-style-a {
  border-bottom: 1px solid #ccc;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  margin-top: 0;
  margin-bottom: 0.5rem;
  padding:0 0 5px;
}
.form-control {
  background-color: #fff;
  background-image: none;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  color: #495057;
  cursor: pointer;
  display: block;
  font-size: 1rem;
  line-height: 1.5;
  padding: 0.375rem 0.75rem;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  width: 100%;
}
select.form-control:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px);
}
.form-group {
/*   display: flex;
  flex-wrap: wrap;
  justify-content: space-between; */
  margin-bottom: 5px;
}
/* .orange-btn {
  background: #ee6e25;
  border: 0;
  border-radius: 2px;
  color: #fff;
  cursor: pointer;
  display: block;
  font-size: 16px;
  margin: 0 auto;
  padding: 10px 20px;
} */
.input-text-box {
  margin-top: 5px;
  width: 46%;
}
#search-btn-box {
  margin-top: 15px;
} 
/* カレンダーアイコン */
.calendar-icon {
  font: normal normal normal 14px/1 FontAwesome;
  position: relative;
}
.calendar-icon:after {
  color: #5e6265;
  content: "\f073";
  font-size: 1.2rem;
  position: absolute;
  pointer-events: none;
  right: 10px;
  top: 10px;
} /* 時計アイコン */
.time-icon {
  font: normal normal normal 14px/1 FontAwesome;
  position: relative;
}
.time-icon:after {
  color: #5e6265;
  content: "\f017";
  font-size: 1.3rem;
  position: absolute;
  pointer-events: none;
  right: 10px;
  top: 10px;
}
.start-time,
.end-time {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  cursor: pointer;
}

.ui-datepicker-calendar .ui-state-default {
    background: #fff;
}

.ui-datepicker-calendar .ui-state-highlight {
    border: 1px solid #ff8728;
}

.form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #80bdff;
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

button:focus {
    outline: 1px dotted;
    outline: 5px auto -webkit-focus-ring-color;
}

input#date-undecided[type=checkbox] {
	width: 1rem;
	height: 1rem;
}

label.custom-control-label.date-undecided-label.pointer_btn.mb0 {
    vertical-align: text-bottom;
}

input#start-date, input#end-date {
	font-size: 16px;
    padding: 0.375rem 0.75rem;
}

#reserve-box button[type="submit"] {
    display: block;
    width: 80%;
    margin: 0 auto;
}

.orange-btn {
	max-width: 66.666667%;
    background: #eeaa25;
	border: 0;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    padding: 16px 20px;
}

#reserve-box .form-group .col-12, #reserve-box .form-group .col-6 {
	margin-bottom: 15px;
}

.custom-control-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}

.custom-control {
    position: relative;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-height: 1.5rem;
    padding-left: 1.5rem;
    margin-right: 1rem;
}

.custom-control-input:checked ~ .date-undecided-label::before {
    border-color: #ced4da;
}

.custom-control-label::before {
    position: absolute;
    top: 0.25rem;
    left: 0.2rem;
    display: block;
    width: 1rem;
    height: 1rem;
    pointer-events: none;
    content: "";
    background-color: #fff;
    border: #ced4da solid 1px;
}

.custom-control-label::after {
    position: absolute;
    top: 0.25rem;
    left: 0.2rem;
    display: block;
    width: 1rem;
    height: 1rem;
    content: "";
    background: no-repeat 70%/70% 70%;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #eeaa25;
    background-color: #eeaa25;
    padding-top: 2px;
}

.custom-control-input:checked~.custom-control-label::after {
    background-image: url('/wp-content/themes/cocoon-child-master/icons/arrow.svg');
    background-size: 80%;
	width: 1.2rem;
	height:1.2rem;
}

button, input {
    overflow: visible;
}

@media screen and (min-width: 360px) {
    #reserve-box .form-group.form-group-col3 .input-text-box {
        width: 32%;
    }
	#reserve-box .form-group.form-group-col3 .input-text-box {
		margin-left: 0;
	}
#reserve-box .form-group.form-group-col3 .input-text-box:nth-child(2) {
    margin-right: 1%;
    margin-left: 1%;
}
}

@media screen and (max-width: 544px) {
.c-container {
	padding: 0;		
}
.sp-calendar {
	padding: 0;
}
#reserve-box {
    padding: 0 0 20px;
    border-top: none !important;
    border-right: none !important;
    border-left: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background-color: transparent;
}
	
#reserve-box .form-group.form-group-during {
    overflow: hidden;
    margin-bottom: 5px;
}

#reserve-box .form-group.form-group-during .col-box:nth-child(1) {
    float: left;
	padding-top: 12px;
    width: 20%;
}

#reserve-box .form-group .input-text-box {
	float:left;
    width: 44%;
    margin-left: 2%;
}

#reserve-box .form-group.form-group-during .col-box:nth-child(3) {
	float:left;
    width: 32%;
    margin-left: 2%;
}
}

@media (min-width: 992px){
/* 	#main {
		padding-top: 0;	
	}
	
	.content {
		margin-top: 0;
	} */
}

@media (max-width: 1036px){
	.swiper-wrapper {
	text-align: center;
}
}

@media (max-width: 1036px) {
	.entry-content {
		max-width: 720px;
		margin: 0 auto;
	}
	.mobile-menu-buttons > li {
		padding-top: 0.5rem;
    	padding-bottom: 0.5rem;
    	padding-left: 6rem;
	}
	.mobile-header-menu-buttons {
		box-shadow: none;
	}
	.mobile-menu-buttons .menu-caption {
		display: none;
	}
	
.mobile-menu-buttons {
    min-height: 50px;
    top: 0; bottom: auto;
    padding-bottom: 0;
    align-items: stretch;
    transition: .3s;
}
.mobile-menu-buttons .menu-button .menu-button-in {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.mobile-menu-buttons .search-menu-caption,
.mobile-menu-buttons .home-menu-caption, 
.mobile-menu-buttons .home-menu-icon {
    display: none;
}

.mobile-menu-buttons .home-menu-button>a {
	margin: 0 20px;
}

.navi-menu-button .svg-inline--fa {
	height: 1.3em;
	padding: 8px 18px;
	border: 1px solid #ccc;
    border-radius: 5px;
	color: #7f7f7f;
}

.mobile-menu-buttons .menu-button .menu-button-in {
	justify-content: center;
}

.menu-button {
	border-bottom : 5px solid #eeaa25;
}
	
	.input-text-box {
		float: left;
	}
	
	#reserve-box .form-group .input-text-box+.input-text-box {
    margin-left: 4%;
}
}

@media (min-width: 1037px) {
	main#main {
		padding-top: 0;
	}
	.content {
		margin-top: 0;		
	}
	
#reserve-box {
	float: left;
	width: 33%;
	margin-right: 2%;
}

#reserve-box .form-group .input-text-box {
	float: left;
    width: 48%;

}

#reserve-box .form-group .input-text-box+.input-text-box {
	margin-left: 2%;
}

#reserve-box .form-group .input-text-box select.form-control {
	border-radius: 0;
}

#reserve-box .form-group {
/*     overflow: hidden;
    padding-bottom: 5px; */
}
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

/* =========================
   モバイルヘッダーロゴ 共通設定
   ロゴ画像サイズ：456 × 76
   ========================= */
.mobile-menu-buttons .home-menu-button > a {
	display: block;
	width: 100%;
	max-width: 456px;
	aspect-ratio: 456 / 76;
	margin: 0 auto;
	background-image: url('https://banana-rentacar.com/wp-content/uploads/2022/11/header_logo3.png');
	background-position: center center;
	background-size: contain;
	background-repeat: no-repeat;
}

/*1036px以下*/
@media screen and (max-width: 1036px){

	.mobile-button-slide-in {
		margin-top: 40px;
	}

	article#post-118 {
		padding-top: 10px;
	}

	.fee-table {
		width: 100%;
		margin-top: 20px;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		overflow: scroll;
	}

	.fee-table tbody {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}

	.fee-table th,
	.fee-table td {
		border: 1px solid #ccc;
		display: block;
		text-align: center;
		white-space: nowrap;
		padding: 10px;
	}
}

#fee-calc {
	text-align: center;
}

/*834px以下*/
@media screen and (max-width: 834px){
	/* 必要ならここに追加 */
}

/*480px～760px*/
@media (min-width: 480px) and (max-width: 760px) {

	.entry-content {
		max-width: 540px;
	}

	.mobile-menu-buttons .home-menu-button > a {
		max-width: 240px;
	}

	.mobile-menu-buttons > li {
		padding-top: 0;
		padding-bottom: 0;
	}
}

/*480px以下*/
@media screen and (max-width: 480px){

	.mblt-header-mobile-buttons {
		margin-top: 68px;
	}

	.mobile-menu-buttons > li {
		padding: 0 16px;
	}

	.mobile-menu-buttons .home-menu-button > a {
		max-width: 220px;
	}

	.home-menu-button {
		padding-left: 1rem;
	}

	#reserve-box {
		margin-top: 0;
	}
}