/*
Theme Name: ホーバー
*/

.destination img,
.destination_select img{
	max-height: 3rem;
}
#openDialog{
	background: #fff;
	padding: 1rem;
	width: 100%;
	display: flex;
	justify-content: start;
	align-items: center;
	font-size: 1.3rem;
	font-weight: 600;
    margin-bottom: .8rem;
	position: relative;
}

#openDialog i{
	position: absolute;
	right: 1rem;
	top: 50%;
	transform: translate(0, -50%);
}
dialog{
	width: 80%;
	max-width: 25rem;
	border-color: #1d86d6;
	border-radius: 4px;
	padding: 1rem;
	background: #e8f1f8;
}
dialog form{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
dialog form h4{
	margin-bottom: .5rem;
	font-size: 1.3rem;
	text-align: center;
	width: 100%;
}
dialog form > div{
	width: 100%;
}
dialog form > div input{
	border: 1px solid #1d86d6;
}
input[type=radio]{
	display:none;
}
input[type=radio]+label{
	align-items: center;
	background: #aaa;
	color: #fff;
	display: flex;
	flex-wrap: nowrap;
	font-weight: 600;
	justify-content: center;
	padding: .3rem 1rem;
	cursor: pointer;
}
input[type=radio]:checked+label{
	background: #1d86d6;
}
dialog form > button{        
	align-items: center;
	background: #1d86d6;
	color: #fff;
	display: flex;
	flex-wrap: nowrap;
	font-weight: 600;
	justify-content: center;
	align-items: center;
	padding: .3rem 1rem;
	width: calc(60% - 8px);
	height: 3rem;
}
dialog form > button:last-of-type{     
	background: #f24d80;
	width: calc(40% - 8px);
}
.ui-datepicker-trigger{
	display: none;
}
.l-section__firstView .seats h3{
	margin-bottom: .5rem;
}
.l-section__firstView .seats .search{
	margin-bottom: 1rem;
	font-size: 1.1rem;
}
.l-footer__btnBox{
	width: 12rem;
}
.l-section__news .inner ul li{
	border-bottom: 1px solid #e3e0df;
}
.l-section__news .inner ul li a{
	color: #b8b8b8;
	font-size: 1.2rem;
}
.l-section__news .inner ul li a p{
	color: #555;
}

#searchTable button{    
	height: 2.5rem;
    width: 2.5rem;
    background: #1d86d6;
    color: #fff;
    top: 0;
    position: relative;
    left: 0;
    position: absolute;
    border-radius: 5px 0 0 0;
}
	#searchTable button::before{
		height: 3px;
        width: 80%;
        background: #fff;
        transform: rotate(45deg) translate(-50%);
        position: absolute;
        top: 76%;
        left: 36%;
        display: block;
        content: "";
	}
	#searchTable button::after{
		height: 3px;
        width: 80%;
        background: #fff;
        transform: rotate(-45deg) translate(-50%);
        position: absolute;
        top: 21%;
        left: 36%;
        display: block;
        content: "";
	}
#searchTable dl{
	padding-top: 3rem;
}
.destination input {
	display:none;
}
.destination{
	display: flex;
    padding: .8rem;
    background: #c6dfef;
    flex-wrap: wrap;
    margin-bottom: .8rem;
}
.destination label {        
	font-weight: 600;
    text-align: left;
	font-size: 1.5rem;
	display: block;
	position: static !important;
	width: 100%;
	text-align: center;
    padding: .5rem 1rem;
    opacity: .5;
	cursor: pointer;
	height: auto !important;
	box-shadow: none !important;
	background: transparent !important;
	color: #3a3a3a !important;
}

.destination label::before,
.destination label::after {
	display: none !important;
}
.destination label span{
	align-items: center;
	color: #005596;
	display: inline-flex;
	font-size: 1.5rem;
	justify-content: space-around;
	margin-right: .5rem;
}
.destination label span i{
    filter: grayscale(1);
}
.destination input:checked+label{
	background:#fff !important;
	color: #3a3a3a;
	opacity: 1;
}
.destination input:checked+label span i{
    filter: grayscale(0);
}
.destination_select{
    padding: 0 !important;
    background: transparent !important;
    display: flex;
	margin-top: 2rem;
}
.destination_select label{
	width: 100%;
    border-radius: 5px 5px 0 0;
    background: #c6dfef;
    padding: .5rem 1rem;
    font-weight: 600;
    font-size: 1.5rem;
	cursor: pointer;
}
.destination_select label span{
	align-items: center;
    color: #005596;
    display: inline-flex;
    font-size: 1.5rem;
    justify-content: space-around;
    margin-right: .5rem;
    opacity: .5;
}
.destination_select label span i {
    filter: grayscale(1);
}
.destination_select label p {
    display: inline-block;
    width: auto;
    opacity: .5;
	margin-bottom: 0 !important;
}
#toCityplan, #toPortplan, #excursionplan{
	display:none;
}
#toCityplan:checked~div .toCityplanlabel{
    background: #fff;
}
#toCityplan:checked~div .toCityplanlabel span{
    opacity: 1;
}
#toCityplan:checked~div .toCityplanlabel span i {
    filter: grayscale(0);
}
#toCityplan:checked~div .toCityplanlabel p {
    opacity: 1;
}
#toPortplan:checked~div .toPortplanlabel{
    background: #fff;
}
#toPortplan:checked~div .toPortplanlabel span{
    opacity: 1;
}
#toPortplan:checked~div .toPortplanlabel span i {
    filter: grayscale(0);
}
#toPortplan:checked~div .toPortplanlabel p {
    opacity: 1;
}
#excursionplan:checked~div .excursionplanlabel{
    background: #fff;
}
#excursionplan:checked~div .excursionplanlabel span{
    opacity: 1;
}
#excursionplan:checked~div .excursionplanlabel span i {
    filter: grayscale(0);
}
#excursionplan:checked~div .excursionplanlabel p {
    opacity: 1;
}

#statusFromAirPort, #statusFromOita{
	display:none;
	padding-bottom: 0;
}
#toCityplan:checked~div #statusFromAirPort{
	display:block;
}
#toPortplan:checked~div #statusFromOita{
	display:block;
}
.innerTit{
	text-align: center !important;
	color: #172e59;
	font-size: 2rem !important;
}
.alert{
	background: #ffe1e1 !important;
	border-radius: 0 !important;
	border: 1px solid #c84d4d;
	color: #c84d4d !important; 
	margin-bottom: .7rem !important;
	margin-top: .7rem !important; 
	padding: .5rem 5rem !important; 
}    
.l-section__status .inner a::after {
	border-right: 2px solid #c84d4d !important; 
	border-top: 2px solid #c84d4d !important; 
}
.l-section__status .inner{
	padding-bottom: 3rem;
}
.l-section__contact .inner{
	margin-top: 3rem;
	display: block;
}
.l-section__status .inner div dl {
	font-size: 1.2rem;
	max-height:20rem;
	overflow: auto;
	margin-bottom: 1rem !important;
}
.l-section__status .inner div dl dt{
	position:sticky;
	top:0 ;
	background: #126db2 !important;
	color: #fff !important;
	font-weight: bold;
	z-index: 100;
}
.l-section__status .inner div dl dd{
	font-weight: bold;
}
.l-section__status .inner div dl dd span{
	margin-right: .5rem;
}
.l-section__status .inner div dl dd:nth-of-type(5n-3){
	font-weight:normal;
	color:#b8b8b8;
}
.l-section__status .inner div dl dd:nth-of-type(5n){
	font-weight:normal;
}
*.blue{
	color:#1d86d6;
	font-weight:bold;
}
*.yellow{
	color:#e1a948;
	font-weight:bold;
}
*.red{
	color:#c84d4d;
	font-weight:bold;
}
*.error{
	color:#c84d4d;
	text-decoration: line-through;
}
*.gray{
	color:#b8b8b8;
}
*.grayBg{
	background: #aaa;
	opacity: .5;
}
.dateBox{
	position: relative;
	margin-bottom: .8rem;
}
.dateBox input{
	position: relative;
	z-index:1;
	margin-bottom: 0 !important;
}

.dateBox i{
	position:absolute;
	top: 50%;
	right: 1rem;
	transform: translate(0, -50%);
	z-index: 2;
}
.l-main ol li {
	counter-increment: cnt;
	padding-left: 1em;
	position: relative;
	text-align: left;
}
.l-main ol li::before {
        content: counter(cnt) ".";
        left: -.7em;
        position: absolute;
}

#timeNotation,
#daytxt{
    font-weight: 600;
    color: #172e59;
    font-size: 2rem !important;
    margin-right: 0;
}

#btnNextday,
#btnYesterday{
	border-right: 3px solid #1d86d6;
    border-top: 3px solid #1d86d6;
	background: transparent;
    font-weight: 600;
    font-size: 2rem !important;
	position: relative;
	height: 1.2rem;
	width: 1.2rem;
}

#btnYesterday{
	display: none;
    transform: rotate(225deg);
}
#btnNextday{
    transform: rotate(45deg);
}
.onlineBox{
	justify-content: space-around !important;
	display: flex;
}
.onlineBox > a{
	width: 43%;
	max-width: 100% !important;
}
.onlineBox > div{
	width: 45%;
	display: block !important;
}
.onlineBox > div p{
	font-size: 1.5rem;
    white-space: nowrap;
}
.onlineBox > div >a{
	display: flex;
	justify-content: center;
	width: 100%;
	margin-top: .5rem; 
	max-width:100% !important;
}


    .l-section__contact .inner .left {
        padding: 1rem;
        width: 100%
    }

.l-section__contact .inner h2{
	font-size: 2rem;
}
.l-section__contact .inner .left p{
	font-size: 1.3rem;
	font-weight: normal;
}
	.l-section__contact .inner .left .tel h3 span{
		display: block;
		font-size: 70%;
	}

    .l-section__contact .inner a {
        background: linear-gradient(to right,#01b5f2,#008ae3);
        color: #fff;
        display: inline-block;
        font-size: 1.2rem;
        font-weight: 600;
        height: auto;
        margin-top: 1rem;
        padding: .8rem 5rem;
        position: relative;
        text-align: left;
        transition: all ease .4s
    }

    .l-section__contact .inner a::after,.l-section__contentArea.bg_ship a::after {
        border-right: 2px solid #fff;
        border-top: 2px solid #fff;
        content: "";
        height: .8rem;
        right: 1rem;
        transform: translate(0,-50%) rotate(45deg);
        top: 50%
    }

    .l-section__contact .inner a::after {
        position: absolute;
        width: .8rem
    }


    .bokking_bototm{
        background: #f24d80;
        padding: 1rem;
    width: 50rem;
    margin: 3rem auto 5rem;
		max-width: 100%;
    }

    .bokking_bototm * {
        color: #fff
    }

    .bokking_bototm h3 {
        font-size: 1.5rem;
        font-weight: 600
    }

    .bokking_bototm div {
        display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    margin: 1rem 0;
    width: 100%;
    gap: 10px;
    }

@media screen and  (min-width: 769px){
	.destination{
		justify-content: space-between;
	}
	.destination label{
		padding: .5rem;
		width: 32%;
		font-size: 1.3rem;
		min-height: 6.8rem;
		display: flex;
		justify-content: center;
		align-items: center;
        flex-direction: column;
	}
	.l-section__firstView .seats{
		width: 34rem;
		padding: 1rem 2rem 1.5rem;
	}
	.l-section__news{
		padding-bottom: 3rem;
	}    
	.l-section__status .inner div dl {
        display: grid;
        grid-template-columns: 25% 3rem 20% 20% 1fr;
		max-height:20rem;
    }
	.l-section__status .inner div dl dd:nth-of-type(5n-1){
		padding-left:4rem;
		text-align: left;
	}
	.l-section__status .inner div dl dd:nth-of-type(5n-4),
	.l-section__status .inner div dl dt:nth-of-type(5n-4){
		padding-left: 3rem;
    }
	
	.l-section__contact .inner .left {
		display: flex;
		flex-wrap: wrap;
	}
	.l-section__contact .inner .left p{
		display: block;
		width: 100%;
	}
	
	.l-section__contact .inner .left .tel {
		display: flex;
		width: 66%;
		flex-wrap: wrap;
	}
	.l-section__contact .inner .left .etc {
		display: flex;
		width: 33%;
		flex-wrap: wrap;
	}
	
	.l-section__contact .inner .left .tel h3{
		width: 50%;
	}
	.l-section__contact .inner .left .etc h3{
		width: 100%;
	}
}
@media screen and (max-width: 768px) {
	.l-main .entry-content {
		padding: 1rem;
	}
	.l-main .titleBlock {
        background: linear-gradient(to left, #01b5f2, #008ae3);
        height: 7rem;
        margin-bottom: 2.5rem;
        position: relative;
		padding-left: 1rem;
    }
	.l-section__status .inner div dl{
		grid-template-columns: 21% 1rem 28% 19% 1fr;
		font-size: 1rem;
	}
	.l-main .titleBlock::before {
		background: url(./assets/img/wave.png) right 6% top 13px no-repeat, url(./assets/img/wave.png) right 21% top 13px no-repeat, url(./assets/img/wave.png) right 36% top 13px no-repeat, url(./assets/img/wave.png) right 51% top 13px no-repeat, url(./assets/img/wave.png) right 14% bottom 13px no-repeat, url(./assets/img/wave.png) right 29% bottom 13px no-repeat, url(./assets/img/wave.png) right 44% bottom 13px no-repeat, url(./assets/img/wave.png) right 59% bottom 13px no-repeat;
		background-size: 30px;
        content: "";
        display: block;
        height: 100%;
        left: 0;
        opacity: .7;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 1;
    }
	.l-main .titleBlock h1 {
        color: #fff;
        display: flex;
        flex-direction: column;
        font-size: 2.5rem;
        height: 100%;
        justify-content: center;
        margin: auto;
        max-width: 1240px;
        position: relative;
        text-align: left;
        width: 100%;
        z-index: 2;
    }
	.l-header__list li {
		border-bottom: 1px solid #fff;
	}
	.l-header__list.down li a{
		width: 100%;
		display: block;
		background: #008ae3;
		color: #fff;
		padding: 1rem 1rem 1rem 2rem;
		font-size: 1.2rem;
	}
	.l-header__list.down li a img{
		height: 2.5rem;
		width: auto;
		margin-right: .5rem;
    	filter: invert(88%) sepia(61%) saturate(0%) hue-rotate(229deg) brightness(107%) contrast(200%);
	}
	.l-header__list.top li a{
		width: 100%;
		display: block;
		background: #008ae3;
		color: #fff;
		padding: 1rem 1rem 1rem 2rem;
		font-size: 1.2rem;
	}
	.l-section__firstView{
		height: calc(80vh + 50rem);
	}
	.l-section__firstView h2{
		font-size: 4.5rem;
	}
	.l-section__news .inner {
        align-items: center;
    }
	.l-section__news {
        padding: 1rem .5rem;
    }
	.l-section__news .inner .title {
        font-size: 2.5rem;
        font-weight: 600;
        justify-content: center;
        letter-spacing: 1px;
        line-height: 1.6rem;
		margin-bottom: 1rem;
		text-align: center;
    }
	.l-section__news .inner br {
		display: none;
    }
	.l-section__news .inner .title span.big {
        font-size: 3rem;
    }
	.l-section__news .inner .title span.small {
        color: #1d86d6;
        font-size: 1.2rem;
        font-weight: 500;
        letter-spacing: 0;
    }
	.l-section__news .inner ul {
		padding-left: 0;
	}
	.l-section__news .inner ul li {
        width: 100%;
		border-bottom: 1px dotted;
    }
	.l-section__news .inner ul li a {
        align-items: center;
        color: #555;
        display: flex;
        padding: .3rem 1rem;
		font-size: 1.2rem;
    }
	.l-section__news .inner ul li a p {
        margin-left: .8rem;
    }
	
    .l-section__news .inner>a {
        border: 2px solid #b8b8b8;
        color: #b8b8b8;
        display: block;
        height: 2.5rem;
        padding: .3rem 2rem .3rem 1rem;
        position: relative;
        width: 10rem;
        margin: 2rem auto 0;
    }

    .l-section__news .inner>a::before {
        border-right: 2px solid #b8b8b8;
        border-top: 2px solid #b8b8b8;
        content: "";
        display: block;
        height: .7rem;
        position: absolute;
        right: .5rem;
        top: 50%;
        transform: translate(0,-50%) rotate(45deg);
        width: .7rem
    }

	
	.l-section__status {
        background: url(./assets/img/bg_operation.png) no-repeat;
        background-size: cover;
    }
	
    .l-section__status .inner {
        padding: 1rem .5rem;
    }

    .l-section__status .inner h3 {
        color: #083e67;
        font-size: 2.5rem;
        line-height: 1.2;
        margin-bottom: 1rem;
        margin-top: 3rem;
        position: relative;
        text-align: center;
        z-index: 1
    }

    .l-section__status .inner div {
        background: #fff;
        border-radius: 5px;
        padding: 1rem .5rem;
        width: 100%
    }

    .l-section__status .inner div p {
        font-weight: 600;
        margin-bottom: 1rem;
        text-align: left
    }

    .l-section__status .inner div dl {
        display: flex;
		flex-wrap: wrap;
    }

    .l-section__status .inner div dl dt {
        background: #e5ecf8;
        border-bottom: 1px solid #739fde;
        border-top: 1px solid #739fde;
        color: #005596;
        font-weight: 700;
        padding: .3rem;
        text-align: center
    }
    .l-section__status .inner div dl dt:first-of-type {
        border-left: 1px solid #739fde;
		width: 21%;
    }
    .l-section__status .inner div dl dt:nth-of-type(2) {
		width: 1rem;
    }
    .l-section__status .inner div dl dt:nth-of-type(3) {
		width: 28%;
    }
    .l-section__status .inner div dl dt:nth-of-type(4) {
        border-right: 1px solid #739fde;
		width: calc(100% - 21% - 28% - 1rem);
    }

    .l-section__status .inner div dl dt:last-of-type {
		display:none;
    }


    .l-section__status .inner div dl dd {
        padding: .3rem;
        text-align: center
    }

    .l-section__status .inner div dl dd.blueBg {
        background: #f1f4fb
    }

    .l-section__status .inner div dd:nth-of-type(5n-4) {
		width: 21%;
    }
    .l-section__status .inner div dd:nth-of-type(5n-3) {
		width: 1rem;
    }
    .l-section__status .inner div dd:nth-of-type(5n-2) {
		width: 28%;
    }
    .l-section__status .inner div dd:nth-of-type(5n-1) {
		width: calc(100% - 21% - 28% - 1rem);
    }
    .l-section__status .inner div dd:nth-of-type(5n){
		text-align: center;
		width: 100%;
		padding: 0 .2rem .5rem calc(21% + 28% + 1rem);
    }
    .l-section__status .inner p {
        font-size: 1.2rem
    }

    .l-section__status .inner p.date {
        color: #fff;
        margin-bottom: 3rem;
        margin-top: -1.5rem
    }

    .l-section__status .inner p span {
        align-items: center;
        color: #005596;
        display: inline-flex;
        font-size: 1.2rem;
        justify-content: space-around;
        margin-right: .5rem
    }

    .l-section__status .inner a {
        background: #ee9e13;
        border-radius: 5px;
        color: #fff;
        display: inline-block;
        font-size: 1.2rem;
        font-weight: 600;
        margin-bottom: 3rem;
        margin-top: 3rem;
        padding: .8rem 5rem;
        position: relative
    }

    .l-section__status .inner a i {
        margin-right: .3rem
    }

    .l-section__status .inner a::after {
        border-right: 2px solid #fff;
        border-top: 2px solid #fff;
        content: "";
        height: .8rem;
        position: absolute;
        right: 1rem;
        top: 50%;
        transform: translate(0,-50%) rotate(45deg);
        width: .8rem
    }
	
	.l-section__contentArea.bg_ship h3 {
		width: 90%;
	}
	
	
    .l-section__contact .inner {
        align-items: center;
        background: #f1eeeb;
        justify-content: space-between;
        margin: auto;
        padding: 1rem .5rem;
		display: block;
    }


    .l-section__contact .inner .left h3 {
        color: #205797;
        font-size: 2.5rem
    }

    .l-section__contact .inner .left p {
        font-size: 1.2rem;
        font-weight: 600;
		width: 100%;
		display: block;
    }

    .l-section__contact .inner .left p span {
        font-size: 1rem;
        font-weight: 400;
        padding-left: .5rem
    }

    .l-section__contact .inner .left a {
        background: linear-gradient(to right,#01b5f2,#008ae3);
        color: #fff;
        display: inline-block;
        font-size: 1.2rem;
        font-weight: 600;
        height: auto;
        margin-top: 1rem;
        padding: .8rem 5rem;
        position: relative;
        text-align: left;
        transition: all ease .4s
    }

    .l-section__contact .inner .left a::after,.l-section__contentArea.bg_ship a::after {
        border-right: 2px solid #fff;
        border-top: 2px solid #fff;
        content: "";
        height: .8rem;
        right: 1rem;
        transform: translate(0,-50%) rotate(45deg);
        top: 50%
    }

    .l-section__contact .inner .left a::after {
        position: absolute;
        width: .8rem
    }

    .l-section__contact .inner .right {
        background: #f24d80;
        padding: 1rem;
        width: 100%
    }

    .l-section__contact .inner .right * {
        color: #fff
    }

    .l-section__contact .inner .right h3 {
        font-size: 1.5rem;
        font-weight: 600
    }

    .l-section__contact .inner .right div {
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-around;
        margin: 1rem 0;
        width: 100%
    }
	.l-section__firstViewInner{
		top: calc((100% - 50rem) / 2 - 2rem);
	}
	.bg_img{
		height: 85vh;
	}
	.recruit{
		display: none;
	}

    .l-section__firstView .seats {
        background: #e8f1f8;
        bottom: .5rem;
        padding: 2rem;
        position: relative;
		z-index: 100;
		top: 80vh;
		left:100vw;
		width:100%;
		transition: all ease .4s;
		height: 50rem;
    }
	
	.l-section__firstView .seats label{
		width: calc(50% - .5rem);
        height: 3rem;
        display: flex;
		justify-content: center;
		align-items: center;
        top: 1rem;
        left: 0;
	}

	

    .l-section__firstView .seats h3 {
        font-size: 1.5rem;
        margin-bottom: 1rem
    }

    .l-section__firstView .seats select {
        border: none;
        font-size: 1.3rem;
        font-weight: 600;
        margin-left: .5rem;
        padding: 1rem;
        width: 70%
    }

    .l-section__firstView .seats input {
        border: none;
        font-size: 1.3rem;
        font-weight: 600;
        margin-bottom: 1rem;
        padding: 1rem;
        width: 100%
    }

    .l-section__firstView .seats .port {
        align-items: center;
        background: #fff;
        display: flex;
        flex-wrap: nowrap;
        justify-content: space-between;
        margin-bottom: .7rem;
        padding: .3rem .5rem;
        position: relative
    }

    .l-section__firstView .seats .port::before {
        background: #e3e0df;
        content: "";
        height: 2px;
        position: absolute;
        right: 1rem;
        top: 4.5rem;
        width: 20rem;
        z-index: 1
    }

    .l-section__firstView .seats .port::after {
        background: #e3e0df;
        content: "";
        height: .5rem;
        left: 2.65rem;
        position: absolute;
        top: 48%;
        transform: translate(0,-50%);
        width: 3px;
        z-index: 1
    }

    .l-section__firstView .seats .port>div {
        width: 100%
    }

    .l-section__firstView .seats .port>div div {
        align-items: center;
        display: flex;
        justify-content: space-around
    }

    .l-section__firstView .seats .port>div div p {
        align-items: center;
        display: flex;
        flex-direction: column;
        font-weight: 500;
        justify-content: center;
    }

    .l-section__firstView .seats .port>button {
        align-items: center;
        background: #fff;
        border: 1px solid #005596;
        border-radius: 50%;
        display: flex;
        height: 3rem;
        justify-content: center;
        min-width: 3rem;
        position: relative;
        width: 3rem;
        z-index: 10
    }

    .l-section__firstView .seats .time {
        align-items: center;
        column-gap: 5px;
        display: flex;
        flex-wrap: nowrap;
		width: 100%;
    }

    .l-section__firstView .seats .time select {
        padding: .5rem;
        width: 50%
    }

    .l-section__firstView .seats .timeBox {
        gap: .5rem;
		justify-content: space-between;
        display: flex;
		flex-wrap: wrap;
        font-weight: 600;
        margin-bottom: .5rem
    }

    .l-section__firstView .seats .timeBox button {
        align-items: center;
        background: #1d86d6;
        color: #fff;
        display: flex;
        flex-wrap: nowrap;
        font-weight: 600;
        justify-content: center;
        padding: .3rem 1rem
    }

    .l-section__firstView .seats .timeBox .notchoose {
        background: #aaa
    }

    .l-section__firstView .seats .search {
        background: #1d86d6;
        color: #fff;
        font-weight: 600;
        margin-bottom: .8rem;
        padding: 1rem;
        width: 100%;
    }

    .l-section__firstView .seats .booking {
        background: #f24d80;
        padding: 1rem
    }

    .l-section__firstView .seats .booking * {
        color: #fff
    }

    .l-section__firstView .seats .booking h3 {
        font-size: 1.2rem;
        font-weight: 600;
		margin-bottom: .5rem;
    }

    .l-section__firstView .seats .booking div {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        padding: .5rem
    }

    .l-section__firstView .seats .booking div a {
        max-width: 33%;
        padding: .2rem;
    }
	#seatbox{
		display:none;
	}
	
	#seatbox~label{
		width: 9rem;
        position: absolute;
        height: 3rem;
        background: #1d86d6;
        color: #fff;
        z-index: 9;
        border-radius: 5px;
        display: flex;
        justify-content: center;
        align-items: center;
		font-size: 1.2rem;		
        box-shadow: 0px 2px 7px #555;
        bottom: 5rem;
        left: 50%;
        transform: translate(-50%, 0);
	}
	#seatbox~label .off{
		display: none;
	}
	#seatbox:checked~.seats{
		left:0;
	}
	#seatbox:checked~label .on{
		display: none;
	}
	#seatbox:checked~label .off{
		display: block;
	}
	
    #searchTable {
        left: 0;
        position: absolute;
        top: 5rem;
		width: 100%;
        z-index: 10;
    }

    #searchTable dl {
       background: #e8f1f8;
        border: 1px solid #1d86d6;
        border-radius: 5px;
        box-shadow: -4px 4px 5px 0 #555;
        display: grid;
        grid-template-columns: repeat(4, 25%);
        padding: 3rem 1rem 1rem 1rem;
        width: 98%;
        margin: auto;
    }

    #searchTable dl dt {
        background: #e5ecf8;
        border-bottom: 1px solid #739fde;
        border-top: 1px solid #739fde;
        color: #005596;
        font-weight: 700
    }

    #searchTable dl dt:first-of-type {
        border-left: 1px solid #739fde
    }

    #searchTable dl dt:last-of-type {
        border-right: 1px solid #739fde
    }

    #searchTable dl dd:nth-of-type(8n+1),#searchTable dl dd:nth-of-type(8n+2),#searchTable dl dd:nth-of-type(8n+3),#searchTable dl dd:nth-of-type(8n+4) {
        background: #f1f4fb
    }

    #searchTable dl dd {
		font-size: 1.1rem;
    }
    #searchTable dl dd.scheduleBlue {
        color: #1d86d6;
        font-weight: 500
    }

    #searchTable dl dd.scheduleRed {
        color: #de1515;
		font-size: 1rem;
        font-weight: 500
    }
	.destination_select label{
		justify-content: space-between;
		display: flex;
    	flex-direction: column;		
	}
	.destination_select label p{
		width: 100%;
		text-align: center !important;
	}
	
	#searchTable button{
		left: 1%;
	}
	.l-footer__btnBox{
		display:none;
	}
	.l-footer__logo a{
        background: #fff;
        border-radius: 5px;
        display: inline-block;
        padding: .2rem;
        width: auto;
	}
	.seats{
		left: 0 !important;
	}
	.seats > label{
		display: none !important;
	}
	.destination{
		flex-direction: row;
	}
	.destination>label{
		width: 100% !important;
	}
	.onlineBox > div{
		width: 48%;
	}
}

.scroll{
  height: 50px;
  overflow: auto;
}
.insta_icon {
    width: 46px;
    display: block;
    padding: .6rem;
    background: #fff;
    border-radius: 50%;
    margin-top: .7rem;
}
