@charset "utf-8";

body{
	background:#fafafa;
	font-family: 'TsukuARdGothic-Regular','TsukuBRdGothic-Regular','メイリオ', Meiryo,'Yu Gothic UI','ヒラギノ角ゴシック','Hiragino Sans','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}

body {
    overflow-y: scroll;
}

#section-breadcrumb{
	margin-top:80px;
	border-bottom:1px solid #e7e7e7;
}


/*
PCMB
*************************************/

@media(min-width:768px) {
	.pcview{display:block;}
	.mbview{display:none;}
}

@media(max-width:767px) {
	.pcview{display:none;}
	.mbview{display:block;}
}

.txt-red,
.txt-red-l{
	font-weight:bold;
	color:#f63232;
}

.txt-red-l{
	font-size:24px;
}

h3{
	font-size:18px;
	font-weight:bold;
	margin-bottom:10px;
}

/*
カラー	#3BAFDA
*************************************/

.main{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#3bafda+0,3bafda+50,399cce+100 */
	background: #3bafda; /* Old browsers */
	background: -moz-linear-gradient(top,  #3bafda 0%, #3bafda 50%, #399cce 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #3bafda 0%,#3bafda 50%,#399cce 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #3bafda 0%,#3bafda 50%,#399cce 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3bafda', endColorstr='#399cce',GradientType=0 ); /* IE6-9 */
	text-align:center;
}

.main h1{
	font-size:34px;
	font-weight:bold;
	color:#fff;
	font-family:"游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	letter-spacing: .1em;
	display:inline-block;
}

@media(min-width : 768px) {
	.main h1{
		margin:30px 0;
	}
	.main{
		padding:50px 0 ;
	}
}

@media(max-width:767px) {
	.main {
		background: #3bafda; /* Old browsers */
		background: -moz-linear-gradient(top,  #3bafda 0%, #3bafda 90%, #399cce 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #3bafda 0%,#3bafda 90%,#399cce 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #3bafda 0%,#3bafda 90%,#399cce 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3bafda', endColorstr='#399cce',GradientType=0 ); /* IE6-9 */
		height:auto;
		margin-bottom:20px;
		padding-bottom:20px;
	}
	.main h1{
		font-size:20px;
		margin-top:30px;
		margin-bottom:20px;
		padding:0;
	}
}


/*
メイン
*************************************/

.txt-disc{
	padding:40px 0;
	text-align:center;
	line-height:1.8;
}


/*
sort-btn
*************************************/

ul.sort-btn{
	text-align:center;
	margin:40px 0;
	font-size:0;
}

ul.sort-btn:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}


ul.sort-btn li{
	display:inline-block;
	margin:5px;
	width:100px;
}
ul.sort-btn li a{
	display:block;
	font-size:16px;
	padding:8px 8px;
	color:#fff;
	background:#888;
	text-decoration:none;
	border-radius:3px;
	text-align:center;
}

ul.sort-btn li a:hover,
ul.sort-btn li a.selected{
	font-weight:bold;
	color:#fff;
	background:#3BAFDA;
}

ul.sort-btn li:last-child{
	margin-right:0;
}

@media(min-width : 992px) and (max-width : 1199px) {
	ul.sort-btn li{
		width:92px;
	}
}

@media(min-width : 768px) and (max-width : 991px) {
	ul.sort-btn li{
		width:65px;
	}
	ul.sort-btn li a{
		font-size:14px;
	}

}

@media(max-width:767px) {
	ul.sort-btn{
		text-align:left;
		margin:20px 0;
	}
	ul.sort-btn li{
		width:30%;
	}
	ul.sort-btn li a{
		font-size:14px;
	}
}


@media(max-width:374px) {
	ul.sort-btn li{
		width:29.85%;
	}
}



/*
c-list
***********************************/

ul.c-list li{
	float:left;
	margin:7.5px;
}

ul.c-list:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

ul.c-list li a{
	display: block;
	width: 100%;
	color: #333333;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	text-decoration:none;
	box-shadow: 0 0 6px #E7E7E7;
}
ul.c-list li a:hover{
	background: #feebf2;
}
ul.c-list li a img{
	width: 100%;
	height: 160px;
	object-fit: cover;
}

ul.c-list li a h3{
	font-size:16px;
	font-weight:bold;
	line-height:1.5;
	padding:20px 12px 20px 12px;
	height:90px;
}

@media(min-width:1200px) {
	ul.c-list li{
		width:262px;
	}
}

@media(min-width : 992px) and (max-width : 1199px) {
	ul.c-list li{
		width:217px;
	}
}



@media(min-width : 768px) and (max-width : 991px) {
	ul.c-list li{
		width:215px;
	}
	
	ul.c-list li a img{
		height: 150px;
	}
	ul.c-list li a h3{
		font-size:16px;
		padding:10px;
		height:80px;
	}
}

@media(max-width:767px) {
	ul.c-list li{
		width:46%;
	}

	ul.c-list li:nth-child(2n){
		margin-right:0;
	}
	ul.c-list li a img{
		height: 100px;
	}
	ul.c-list li a h3{
		font-size:14px;
		padding:10px;
		height:60px;
	}
}


h2{
	font-size:30px;
	text-align:center;
}

/*
route
*********************/

.route{
	margin:20px 0 60px 0;
}

/*
route-info
*********************/

.route-info{
	padding:0px 0 ;
	background:url(/static/3/img/ferry/bg-stripe02.png) repeat ;
	border-radius:5px;
	border:5px solid #fff;
}

.route-info dl{
	padding:20px;
	display:block;
	width:100%;
	font-size:20px;
	font-weight:bold;
	color:#333;
}

.route-info dt{
	display:inline-block;
	font-weight:bold;
	color:#0168b3;
	margin-right:30px;
}
.route-info dd{
	display:inline-block;
}

.route-info dd a{
	color:#0168b3;
	text-decoration:underline;
}

.route-info dd a:hover{
	text-decoration:none;
}

.route-info dl.info02 dt,
.route-info dl.info03 dt{
	margin-right:0;
}

.route-info dl.info02 dt i{
	color:#dcad0b;
	font-size:24px;
}

.route-info dl.info03 dt i{
	color:#cc0000;
	font-size:24px;
}

.route-info dl.info01 + dl.info02,
.route-info dl.info01 + dl.info03,
.route-info dl.info02 + dl.info02,
.route-info dl.info03 + dl.info03,
.route-info dl.info02 + dl.info03{
	padding-top:0;
}

.route-info dl.info02 + dl.info03{
	padding-top:0;
}

.route-info + .route-info{
	margin-top:5px;
}

@media(max-width:767px) {
	.route-info{
		padding-top:0;
	}
	.route-info dl{
		font-size:16px;
		margin:0;
		padding:7px;
	}
	.route-info dt{
		margin-right:0;
		margin-bottom:5px;
	}
	.route-info dt,
	.route-info dd{
		width:100%;
	}
	.route-info dd{
		font-size:14px;
	}
	.route-info dl.info02 dt,
	.route-info dl.info02 dd{
		display:inline-block;
		width:auto;
		vertical-align:middle;
	}
	.route-info dl.info02 dd{
		width:80%;
	}
	.route-info dl.info03 dt,
	.route-info dl.info03 dd{
		display:inline-block;
		width:auto;
		vertical-align:middle;
	}
	.route-info dl.info03 dd{
		width:80%;
	}
}


.modal#information .modal-header{
	background:#3bafda;
}

/*
address
*********************/

.address{
	margin:20px 0;
}

.address span{
	font-weight:bold;
	margin-right:15px;
}


@media(max-width:767px) {
	.address span{
		display:block;
	}

}


/*
disc
*********************/

.disc{
	padding:50px 0;
	background:#fff;
}

.ferry-thumb{
	width:100%;
	height:auto;
	border-radius:5px;
	margin-bottom:20px;
}

.disc-in{
	width:100%;
	margin:0 auto;
}

@media(max-width:767px) {
	.disc{
		padding:20px 0;
	}
}

/*
slick
*********************/
.slick-dots {
	bottom:-25px;
}

.slick-active{

}

.slick-dots li.slick-active button:before{
	color:#007aff;
	opacity:1.0;
}
.slick-dots li button:before{
	color:#cccccc;
	opacity:1.0;
}

p.tokutencompany{
	text-align:center;
}
p.tokutencompany a{
	color:#666;
	position:relative;
}
p.tokutencompany a:before{
    content: url(/static/3/img/ferry/bg_icon_ferry.png);
    position: relative;
    top: 2px;
	left:0;
	margin-right:5px;
}


/*
ticket-info
**********************/

.ticket-info{

}

.ticket-info .ticket-info-txt{
	font-weight:bold;
	color:#ff6633;
}

.tokutentxt{
	clear:both;
	padding:10px 5px 15px 0;
}
.tokutentxt li{
	font-size:1.6em;
	font-weight:bold;
	line-height:1.3em;
	margin-bottom:5px;
	color:#2d92fa;
}
.tokutentxt li:last-child{
	margin-bottom:0;
}

a.ticket-info-link{
	color:#333;
	text-decoration:underline;
}

a.ticket-info-link:hover{
	text-decoration:none;
}

.camplan_sub{
	clear:both;
	margin-bottom:15px;
}



/*
reco
**********************/

.reco{
	width:100%;
	margin:30px auto;
	border:3px solid #dcad0b;
	border-radius:5px;
}

.reco h2{
	font-size:20px;
	font-weight:bold;
	color:#fff;
	padding:15px;
	background:#dcad0b;
}

.reco-box{
	padding:30px 50px;
	background:#fff;
}

ul.reco-list {
	margin-left:20px;
}

ul.reco-list li{
	list-style:disc;
}

ul.reco-list li a{
	color:#333;
	text-decoration:underline;
}

ul.reco-list li a:hover{
	text-decoration:none;
}

@media(max-width:767px) {
	.reco{
		margin-bottom:15px;
	}
	.reco h2{
		font-size:16px;
		line-height:1.6;
		padding:8px;
	}
	.reco-box{
		padding:20px 10px;
	}
	ul.reco-list li{
		font-size:14px;
	}
}


/*
terminal
**********************/


/*
route-list
******************************/

ul.route-list{
	margin:0 auto 15px auto;
	text-align:center;
}

ul.route-list:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

ul.route-list li{
	display:block;
	font-weight:bold;
	margin:5px;
	position: relative;
	border-radius:5px;
}

ul.route-list li:nth-child(odd){
	float:left;
}

ul.route-list li:nth-child(even){
	float:right;
}

ul.route-list li a:hover{
	background:#F989B1;
	text-decoration:none !important;
}
ul.route-list a{
	font-size:16px;
	color:#fff;
	display:block;
	padding:30px;
	background:#F53D7E;
	border-radius:5px;
}


ul.route-list li:after{
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right:8px;
	color: #fff;
	font-size:18px;
}


	@media(min-width:1200px) {
		ul.route-list{
			width:900px;
		}
		ul.route-list li{
			width:430px;
		}
		
		ul.route-list li a{
			font-size:18px;
		}
		
	}

	@media only screen and (min-width : 992px) and (max-width : 1199px) {
		ul.route-list{
			width:866px;
		}
		ul.route-list li{
			width:420px;
		}
		
		ul.route-list li a{
			font-size:18px;
		}
	}

	@media only screen and (min-width : 768px) and (max-width : 991px) {
		ul.route-list{
			width:642px;
		}
		ul.route-list li{
			width:308px;
		}
		
		ul.route-list li a{
			font-size:18px;
		}
	}

	@media(max-width:767px) {
	
		ul.route-list li{
			width:100%;
			margin:5px 10px 5px 0;

		}
		ul.route-list li:nth-child(even){
			margin-right:0px;
		}
		
		ul.route-list li a{
			font-size:16px;
			padding:15px;
		}
		
		ul.route-list li:after{
			right:10px;
		}
		
	}
	
/*
route-list single
*********************/

ul.route-list.single{
	width:500px;
}


ul.route-list.single li{
	width:100%;
	margin:5px 0;
}

@media(max-width:767px) {

	ul.route-list.single{
		width:97%;
	}

}
	
/*
terminal-list
******************************/

#terminal{
	padding-top:100px;
	margin-top:-100px;
}

#terminal.btn-reserve-none{
	padding-top:30px;
	margin-top:0;
}

@media(max-width:767px) {
	#terminal.btn-reserve-none{
		padding-top:5px;
		margin-top:0;
	}

}

ul.terminal-list{
	margin:0 auto 15px auto;
	text-align:center;
}

ul.terminal-list:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

ul.terminal-list li{
	display:block;
	font-weight:bold;
	margin:5px;
	position: relative;
	border-radius:5px;
}

ul.terminal-list li:nth-child(odd){
	float:left;
}


ul.terminal-list li:nth-child(even){
	float:right;
}


ul.terminal-list li a:hover{
	background:#fad6dc;
	text-decoration:none !important;
}
ul.terminal-list a{
	font-size:16px;
	color:#6c1044;
	display:block;
	padding:30px;
	background:#fff;
	border:1px solid #ccc;
	border-radius:5px;
	text-align:left;
}

.ken-name{
	display:block;
	color:#666;
	font-size:16px;
	font-weight:normal;
	text-align:left;
}


ul.terminal-list li:after{
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right:10px;
	color: #F53D7E;
	font-size:24px;
}

.txt-s{
	font-size:16px;
}


	@media(min-width:1200px) {
		ul.terminal-list{
			width:900px;
		}
		ul.terminal-list li{
			width:430px;
		}
		
		ul.terminal-list li a{
			font-size:18px;
		}
		
	}

	@media only screen and (min-width : 992px) and (max-width : 1199px) {
		ul.terminal-list{
			width:866px;
			margin-left:auto;
			margin-right:auto;
			display:block;
			text-align:left;
		}
	
		ul.terminal-list li{
			width:420px;
		}
		
		ul.terminal-list li a{
			font-size:15px;
		}
	}

	@media only screen and (min-width : 768px) and (max-width : 991px) {
		ul.terminal-list{
			width:642px;
			margin-left:auto;
			margin-right:auto;
			display:block;
			text-align:left;
		}
		ul.terminal-list li{
			width:308px;
		}
		
		ul.terminal-list li a{
			font-size:14px;
		}
	}

	@media(max-width:767px) {
		ul.terminal-list{
			width:100%;
		}
		ul.terminal-list li{
			width:100%;
			margin:5px 10px 5px 0;

		}
		ul.terminal-list li:nth-child(even){
			margin-right:0px;
		}
		
		ul.terminal-list li a{
			font-size:16px;
			padding:15px 12px;
		}
		
		ul.terminal-list li:after{
			right:5px;
			font-size:18px;
		}
		
	}
	
/*
pr
**********************/

.pr .card{
	border: 1px solid rgba(0,0,0,.125);
	border-radius:5px;
}

.pr-in{
	padding:20px;
	background:#fff;
}

.pr h3{
	font-size:24px;
	font-weight:bold;
	color:#333;
	padding:30px 20px;
	background:#f4f4f4;
	text-align:center;
	margin-bottom:0;
	border-top:5px solid #3bafda;
}
.pr h3 span.label{
	font-size:20px;
	color:#fff;
	padding:3px 10px;
	background:#3bafda;
	text-align:center;
	border-radius:5px;
	margin-right:15px;
}

.pr h4{
	font-size:18px;
	font-weight:bold;
	margin-top:5px;
	margin-bottom:5px;
}

table.camplan-tbl tr{
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}

table.camplan-tbl th{
	font-size:15px;
	padding:15px 10px;
	background:#f4f4f4;
	width:17%;
}

table.camplan-tbl td{
	font-size:15px;
	padding:15px 10px 15px 10px;
	background:#fff;
}

.pr ul.route-list{
	text-align:center;
}

.pr ul.route-list li{
	float:none;
	display:inline-block;
}

.pr ul.route-list a{
	color:#fff ;
	background:#3bafda;
	border:none;
}

.pr ul.route-list a:hover{
	opacity:0.8;
	background:#3bafda;
}

.pr ul.route-list li:after{
	color:#fff ;
}


.pr + .pr{
	margin-top:30px;
}

.pr .mbview img{
	width:100%;
	height:auto;
}

.pr.prbnr{
	margin-top:60px;
	text-align:center;
}

.pr.prbnr img{
	display:inline-block;
}

.pr h4{
	font-size:18px;
}

ul.btn-mc{
	margin:15px 0 22px 0;
}

ul.btn-mc:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

ul.btn-mc li:nth-child(odd){
	float:left;
}

ul.btn-mc li:nth-child(even){
	float:right;
}

ul.btn-mc li a{
	padding:20px 15px;
	display:block;
	font-size:16px;
	font-weight:bold;
	color:#fff;
	text-align:center;
	background:#3bafda;
	border-radius:5px;
	text-decoration:none;
	position: relative;
}
ul.btn-mc li a:hover{
	text-decoration:none;
	opacity:0.8;
}

ul.btn-mc li a:after{
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right:10px;
	color: #fff;
	font-size:16px;
}

.mark-note{
	font-size:14px;
	margin-bottom:15px;
}

@media(min-width:1200px) {
	ul.btn-mc li{
		width:350px;
	}
}

@media(min-width : 992px) and (max-width : 1199px) {
	ul.btn-mc li{
		width:300px;
	}
}

@media(min-width : 768px) and (max-width : 991px) {
	ul.btn-mc li:nth-child(odd){
		width:170px;
	}

	ul.btn-mc li:nth-child(even){
		width:270px;
	}
}

@media(max-width:767px) {
	.pr h4{
		font-size:14px;
	}
	ul.btn-mc{
		margin-bottom:5px;
	}
	ul.btn-mc li:nth-child(odd),
	ul.btn-mc li:nth-child(even){
		flaot:none;
		width:100%;
	}
	
	ul.btn-mc li{
		margin-bottom:15px;
	}
}



.pr .bnr-set{
	position: relative;
	width:960px;
	height:375px;
	margin:0 auto;
}

.pr .bnr-set .bnr-pop{
	position: absolute;
	top:0px;
	left: 0;
}

.pr .bnr-set .bnr-btn{
	position: absolute;
	top:150px;
	right:30px;
}

.pr .bnr-set .bnr-shuttle{
	position: absolute;
	bottom:15px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}





@media(min-width : 768px) and (max-width : 991px) {
	.pr h3 span.label{
		font-size:18px;
	}
	.pr h3 span.ttl{
		font-size:20px;
	}
	table.camplan-tbl th{
		width:25%;
	}
	
	.camplan_title_copy{
		font-size:14px;
		margin:0px 0 15px 0;
	}
	
	table.camplan-tbl td .txt-red-l{
		font-size:20px;
	}
	
	.pr .bnr-set,
	.pr .bnr-set .bnr-pop{
		width:740px;
		height:290px;
	}
	
	.pr .bnr-set .bnr-btn{
		position: absolute;
		top:110px;
		right:23px;
		width:120px;
		height:auto;
	}
	.pr .bnr-set .bnr-shuttle{
		position: absolute;
		bottom:12px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		transform: translateX(-50%);
		width:720px;
		height:auto;
	}
	
	#popup55 .modal-dialog.modal-lg{
		max-width:740px;
		width:740px;
	}

}



@media(max-width:767px) {

	.pr-in{
		padding:10px;
	}
	.pr h3{
		padding:20px 5px;
		background:#f4f4f4;
		text-align:center;
		margin-bottom:0;
		border-top:5px solid #3bafda;
	}
	.pr h3 span.label{
		font-size:14px;
		color:#fff;
		padding:3px 10px;
		background:#3bafda;
		text-align:center;
		border-radius:5px;
		margin-right:15px;
	}
	
	.pr h3 span.ttl{
		display:block;
		font-size:16px;
		margin-top:15px;
	}
	
	.camplan_title_copy{
		font-size:14px;
		margin:15px 0;
	}
	
	table.camplan-tbl th{
		width:33%;
		font-size:14px;
	}
	
	table.camplan-tbl td{
		font-size:14px;
	}
	
	table.camplan-tbl td .txt-red-l{
		font-size:16px;
	}

}


.pr .txt-l{
	margin-top:20px;
	font-size:24px;
	font-weight:bold;
}

.pr .txt-l i.arrow-down{
	font-size:36px;
}

@media(max-width:767px) {
	.pr .txt-l{
		font-size:16px;
	}
	.pr .txt-l i.arrow-down{
		font-size:30px;
	}
}


/*
ship-list
*************************/





/*
もっと見る
*************************/

.link-motto{
	margin-top:15px;
	text-align: right;
}
.link-motto a{
	background:#333;
	text-decoration: none;
	display: inline-block;
	font-size: 15px;
	font-weight:bold;
	padding: 8px 10px;
	border-radius:5px;
	color: #fff !important;
	width:200px;
	text-align:center;
	position: relative;
}
.link-motto a:after{
	content: "\f105";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #fff !important;
	margin-left: 15px;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 10px;
}
.link-motto a:hover{
	color: #fff !important;
	opacity:0.8;
}

.link-motto a + a{
	margin-left:15px;
}

@media(max-width:767px) {
	.link-motto{
		margin-top:15px;
		text-align: center;
	}

	.link-motto a{
		font-size: 16px;
		width:100%;
	}
	
	.link-motto a + a{
		margin-top:15px;
		margin-left:0px;
	}
}

/*
intro
***********************/


.intro h3{
	font-size:18px;
	margin:10px 0 8px 0 ;
	padding-top:0 !important;
}

.intro h3 a{
	text-decoration:underline;
}

.intro h3 a:hover{
	text-decoration:none;
}

.intro h3:before{
	content: "\f138";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	margin-right:8px;
}

.intro p{
	font-size:14px;
	line-height:1.6;
}

.intro .card{
	padding:30px;
}

.intro .row + .row{
	margin-top:20px;
}

.intro img{
	border-radius:5px;
	width:240px;
	height:135px;
	object-fit: cover;
}

.intro img:hover{
	opacity:0.8;
}

#intro .title02-set{
	padding-top:100px;
	margin-top:-50px;
}

@media(min-width : 768px) and (max-width : 991px) {
	.intro h3{
		font-size:15px;
		margin:5px 0 ;
	}

}

@media(max-width:767px) {
	.intro .card{
		padding:20px;
	}
	.intro .row + .row{
		margin-top:20px;
	}
	
	.intro img{
		width:100%;
		height:auto;
	}
	.intro h3{
		font-size:15px;
		margin:10px 0 ;
	}
}






/*
titleset
***********************/

.title02-set{
	text-align:center;
	margin:80px 0 30px 0;
}

.title02:before{
	content:url(/static/3/img/bus_search/ja/bg-title.png);
	position: absolute;
	top:-22px;
	left:-15px;
}
.title02{
	font-size:26px;
	font-weight:bold;
	display:inline-block;
	background:linear-gradient(transparent 70%, #ffff66 70%);
	padding:0 7px;
	margin-bottom:20px;
	position: relative;
	letter-spacing:5px;
}

@media(min-width : 768px) and (max-width : 991px) {
	.title02{
		font-size:20px;
	}
	.title02-set p{
		font-size:12px;
	}

}

@media(max-width:767px) {
	
	.title02-set{
		margin-top:60px;
		margin-bottom:15px;
	}
	
	.title02{
		font-size:20px;
	}
	
	.title02-set p{
		font-size:14px;
	}

}


@media(max-width:374px) {
	
	.title02-set{
		margin:60px 0 15px 0;
	}
	
	.title02-set p{
		font-size:14px;
	}
	.title02-set p br{
		display:none;
	}
	
	.title02{
		font-size:18px;
	}
	
	.title02:before{
		left:-5px;
	}

}

@media(max-width:767px) {
	#reserve.route .title02-set{
		padding-top:100px;
		margin-top:-50px;
	}

	.btn-reserve{
		padding:10px;
		margin:20px 15px;
		background:#f53d7e;
		display:block;
		border-radius:5px;
		text-align:center;
		font-size:16px;
		font-weight:bold;
		color:#fff;
		text-decoration:none;
	}
	
	.btn-reserve:hover,
	.btn-reserve:focus,
	.btn-reserve:active{
		color:#fff;
		text-decoration:none;
	}

	.sticky-top{
		padding-top:10px;
		padding-bottom:10px;
		background:rgba(255,255,255,0.5);
	}

	.sticky-top .btn-reserve{
		margin-top:0;
		margin-bottom:0;
	}

}
/*
searchbox
********************************************/

#searchbox .modal-header{
	display:block;
	text-align:center;
	background:#333;
	height:auto;
}
#searchbox .modal-header h2{
	color:#fff;
	font-size:18px;
	font-weight:bold;
	padding:10px;
}

#searchbox .modal-header .close{
	color:#fff;
}




/*
searchbox01
*************************************************/


.searchbox01 h3{
	font-size:18px;
	padding-bottom:10px;
	margin-bottom:15px;
	border-bottom:1px solid #ddd;
}

.searchbox01 .rh-select .btn + .btn{
	border-left:1px solid #DBDBDB;
	margin-left:0;
}

@media(max-width:767px) {
	.searchbox01{
		margin-bottom:10px;
	}
	.rh-select dl dt{
		width:100%;
	}
	.rh-select dl dd{
		margin-left:0;
	}
	
	.searchbox01 .btn-group .btn{
		font-size:13px;
	}
	

}

.btn-search{
	color:#fff;
	font-weight:bold;
	background:#333;
	display:block;
	width:100%;
	margin-bottom:20px;
}

.btn-search:hover{
	color:#fff;
	opacity:0.8;
}


/*
about_baby
******************************************/
@media(max-width:767px) {
	.searchbox01 .people-selection{
		margin-bottom:0;
	}
}

.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;
}
.about_baby h5{
	font-size:14px;
	font-weight:bold;
	margin-top:10px;
	margin-bottom:5px;
}

.about_baby p{
	margin-bottom:0;
}

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

.baby-sp{
	margin-left:23px;
}

.modal-header{
	display:block;
	text-align:center;
	background:#333;
	height:auto;
}
.modal-header h2{
	color:#fff;
	font-size:16px;
	font-weight:bold;
	padding:10px;
	text-align:left;
}

.modal-header .close{
	color:#fff;
}

#searchbox .modal-header h2{
	text-align:center;
}

/*
faq
**************************/

.faq{
	border:3px solid #ddd;
	padding:30px 20px;
	border-radius:5px;
}

.faq a{
	display:block;
	color:#fff;
	font-size:16px;
	font-weight:bold;
	background:#333;
	text-decoration:none;
	padding:15px;
	border-radius:5px;
	position: relative;
}

.faq a:hover{
	opacity:0.8;
}

.faq a:after{
	content: "\f105";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #fff;
	margin-left: 15px;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right: 10px;
}
.faq .txt-faq{
	font-size:18px;
	font-weight:bold;
	color:#333;
}


@media(min-width : 768px) and (max-width : 991px) {
	.faq .txt-faq{
		font-size:16px;
	}
}

@media(max-width:767px) {
	.faq{
		padding:20px;
	}
	.faq .txt-faq{
		font-size:14px;
		margin:15px 0;
	}
}

.txt-start-reserve{
	margin:15px 0 0 0;
}

.reserve-guide{
	margin:5px 0 15px 0;
}

.reserve-guide a{
	text-decoration:underline;
}

.reserve-guide a:hover{
	text-decoration:none;
}

/*
discount
*************************/

table.discountTbl{
	width:925px;
}

table.discountTbl .Item{
	background:#f4f4f4;
}

table.discountTbl .Item td{
	font-weight:bold;
	text-align:center;
}

table.discountTbl td{
	padding:5px;
	border:1px solid #ccc;
	font-size:14px;
	vertical-align:middle;
}

table.discountTbl .name{
	width:125px;
}

table.discountTbl .rate{
	width:90px;
	text-align:center;
}

table.discountTbl .text01{
	width:350px;
}

table.discountTbl .passenger,
table.discountTbl .car,
table.discountTbl .bike,
table.discountTbl .baggage{
	width:55px;
	text-align:center;
}

table.discountTbl .text02{
	
}


@media(min-width:1200px) {
	#discount .modal-dialog{
		max-width:960px;
	}

}

@media(min-width : 992px) and (max-width : 1199px) {
	#discount .modal-dialog{
		max-width:960px;
	}

}

@media(min-width : 768px) and (max-width : 991px) {
	#discount .modal-dialog{
		max-width:90%;
	}

}

table.js-scrollable  {
	width:925px;

}
.scroll-hint-icon{
	top:100px;
}
/*
bnr-sunflower
*********************/

.bnr-sunflower{
	margin-bottom:30px;
	text-align:center;
	background:#FEE8EE;
}


/*
notes
********************/


.notes{
	padding:20px 20px;
	border:1px solid #f38585;
	background:#fff;
	border-radius:5px;
}

.notes ul li{
	padding-left:25px;
	position: relative;
}

.notes ul li:before{
	content:"※";
	position: absolute;
	top:0px;
	left: 0;
	
}

.notes ul li + li{
	margin-top:7px;
}

.notes i {
	color:#cc0000;
}

a.note-link{
	color:#cc0000;
	margin-top:15px;
	display:inline-block;
	text-decoration:underline;
}

a.note-link:hover{
	text-decoration:none;
}

a.note-link:before{
	content: "\f071";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	margin-right:10px;
}

@media(min-width : 768px) {
	.notes{
		padding:40px 40px;
	}
}

@media(max-width:767px) {
	.notes{
		padding:20px;
	}
	.notes ul li {
		font-size:14px;
	}
}

#info-93 .modal-body h1,
#info-116 .modal-body h1{
	display:none;
}

#info-93 .modal-body,
#info-116 .modal-body,
#info-93 .modal-body dt,
#info-116 .modal-body dt,
#info-93 .modal-body dd,
#info-116 .modal-body dd{
	font-size:14px !important;
}
#info-93 .modal-body p,
#info-116 .modal-body p{
	font-size:14px !important;
	margin-bottom:10px;
}


#info-93 .modal-body h2,
#info-116 .modal-body h2{
	padding:10px;
	color:#cc0000;
	background:#f9f7e6;
}

#info-93 .modal-body h4,
#info-116 .modal-body h4{
	font-size:16px ;
	font-weight:bold;
	color:#333;
	padding-bottom:10px;
	margin-top:15px;
	margin-bottom:15px;
	border-bottom:1px solid #ccc;
}
#info-93 .mark-note,
#info-116 .mark-note{
	color:#333;
	margin-top:5px;
	margin-bottom:5px;
}

#info-93 .mark-note li,
#info-116 .mark-note li{
	color:#333;
}
#info-93 .mark-note > li:before ,
#info-116 .mark-note > li:before {
	content: '※';
	display: inline;
}

#info-93 .tab-content>.tab-pane,
#info-116 .tab-content>.tab-pane{
	display:block !important;
}

#info-93 .modal-body .close-btn,
#info-116 .modal-body .close-btn{
	display:none;
}


#info-93 .modal-body a,
#info-116 .modal-body a{
	text-decoration:underline;
}

#info-93 .modal-body a:hover,
#info-116 .modal-body a:hover{
	text-decoration:none;
}



#info-93 .modal-body dt
#info-116 dt,
#info-93 b,
#info-116 .modal-body b{
	color:#333;
}

#info-93 .modal-body dt br,
#info-116 .modal-body dt br{
	display:none;
}

#info-93 .modal-header h2,
#info-116 .modal-header h2{
	color:#fff;
	background:#cc0000;
}



a.topback{
	background:#333;
	text-decoration: none;
	display:block;
	font-size: 18px;
	font-weight:bold;
	padding:15px;
	margin:70px auto 50px auto;
	border-radius:5px;
	color: #fff;
	width:300px;
	text-align:center;
	position: relative;
}
a.topback:before{
	content: "\f104";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #fff;
	margin-right: 15px;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	left:10px;
	font-size: 28px;
}
a.topback:hover{
	color: #fff;
	opacity:0.8;
}

@media(max-width:374px) {
	a.topback{
		width:100%;
	}
}

.modal-body .img img{
	width:100%;
}

#about_reservation .modal-body h2.sectionTitle,
#participate .modal-body h2.sectionTitle{
	display:none;
}

#about_reservation .modal-body h3.stepTitle,
#participate .modal-body h3.stepTitle{
	padding:10px;
	color:#FFF;
	background:#F53D7E;
}

#about_reservation .modal-body h4,
#participate .modal-body h4{
	font-size:16px;
	font-weight:bold;
	color:#F53D7E;;
	margin-bottom:10px;
}

#about_reservation .modal-body ul,
#about_reservation .modal-body ol,
#participate .modal-body ul,
#participate .modal-body ol{
	margin-left:25px;
	margin-bottom:20px;
}

#about_reservation .modal-body ul li,
#participate .modal-body ul li{
	list-style:disc;
	font-size:14px;
	margin-bottom:3px;
}

#about_reservation .modal-body ol li,
#participate .modal-body ol li{
	list-style:decimal;
	font-size:14px;
	margin-bottom:3px;
}


#about_reservation .modal-body p,
#participate .modal-body p{
	font-size:14px;
}

.btn.disabled{
	color:#ccc;
	background:#eee !important;
}


/*
loader
******************************/
#loader {
    position: fixed;
    top:calc(50% - 120px/2);
    left:calc(50% - 180px/2);
	width: 180px;
	height: 120px;
	text-align: center;
	color: #333;
	z-index: 1000000;
	background:rgba(255,255,255,0.8);
	padding:20px;
	border-radius: 10px;
	border:3px solid #666;
}

#loader p{
	padding:15px;
	font-size:18px;
	font-weight:bold;
}

/*
マルエーフェリー、マリックスライン 微調整
carrier-89 route-list 
carrier-101 route-list 
*******************************/

@media(min-width:1200px) {
	.carrier-89 ul.route-list,
	.carrier-101 ul.route-list{
		width:100%;
		text-align:left;
	}
	.carrier-89 ul.route-list li,
	.carrier-101 ul.route-list li{
		width:32%;
		float:none;
		display:inline-block;
	}
	
	.carrier-89 ul.route-list li a,
	.carrier-101 ul.route-list li a{
		font-size:15px;
		padding:20px 10px;
		text-align:center;
	}
	
}

@media only screen and (min-width : 992px) and (max-width : 1199px) {
	.carrier-89 ul.route-list,
	.carrier-101 ul.route-list{
		width:100%;
		text-align:left;
	}
	.carrier-89 ul.route-list li,
	.carrier-101 ul.route-list li{
		width:32%;
		float:none;
		display:inline-block;
		vertical-align:middle;
	}
	
	.carrier-89 ul.route-list li a,
	.carrier-101 ul.route-list li a{
		font-size:14px;
		padding:20px 10px;
		text-align:center;
	}
	.carrier-89 ul.route-list li:after,
	.carrier-101 ul.route-list li:after{
		font-size:16px;
		right:5px;
	}
}

@media only screen and (min-width : 768px) and (max-width : 991px) {
	.carrier-89 ul.route-list,
	.carrier-101 ul.route-list{
		width:100%;
		text-align:left;
	}
	.carrier-89 ul.route-list li,
	.carrier-101 ul.route-list li{
		width:48%;
		float:none;
		display:inline-block;
		vertical-align:middle;
	}
	
	.carrier-89 ul.route-list li a,
	.carrier-101 ul.route-list li a{
		font-size:13px;
		padding:15px 10px;
		text-align:center;
		height:55px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.carrier-89 ul.route-list li:after,
	.carrier-101 ul.route-list li:after{
		font-size:16px;
		right:5px;
	}
}

/*
宮崎カーフェリー 項目追加調整
*******************************/
.plan_box{
    text-align: center;
    margin: 0 auto;
}
.plan_box .main_txt{
    background: #3BAFDA;
    padding: 10px 0;
    text-align: center;
    font-weight: 700;
    font-size: 18px;
    color: #FFF;
    margin-bottom: 0;
}
.plan_box .limited{
    background: #FFF;
    padding: 10px;
    color: #ff0000;
    font-weight: 700;
}
.plan_box .limited span{
	color: #333;
}
.item_block {
    margin-top: 10px;
}
.plan_box .item_block .card{
    margin-bottom: 0;
}
.plan_box .pr h3{
    padding: 15px 10px 10px;
}
.plan_box .pr h3 span.label{
    font-size: 14px;
    margin-right: 0;
    padding: 5px 6px;
    line-height: 1.9;
}
.plan_box .pr h3 p.ttl{
    margin-top: 10px;
    font-size: 16px;
}

.item_block .pr .pr-in{
    text-align: center;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    padding: 15px 20px 10px;
}
.item_block .pr .pr-in .price{
    color: #212529;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.8;
}
.item_block .pr .pr-in .price span{
    color: #f63232;
    font-size: 24px;
    font-weight: 700;
    padding-left: 5px;
}


@media(max-width:767px) {
    .plan_box .pr h3 {
        padding: 15px 0;
    }
    .plan_box .pr h3 p.ttl {
        font-size: 16px;
    }
    .plan_box .pr h3 span.label {
        padding: 5px 8px;
    }
    
    .item_block .pr .pr-in .price{
        line-height: 1.4;
    }
    .item_block .pr .pr-in span{
        font-size: 22px;

    }
}


/*
色調整
********************************/

.input-group .fa-plus,
.input-group .fa-minus{
	color:#3BAFDA !important;
}

.btn-reserve,
ul.route-list a,
.searchbox01 .btn-group .btn.active{
	background:#3BAFDA !important;
}

/*
検索用モーダル時調整
********************************/

body.search-modal-open{
	position: fixed !important;
	overflow: hidden !important;
	width:100%;
}


.holiday {
    color: #da4453 !important;
}


/*
Goto用リンク
********************************/
.goto_box{
	margin-bottom: 60px;
}
.goto_box ul.goto_inner{
	margin: 0 auto;
	text-align: center;
}
.goto_box .goto_inner li.btn_box{
	margin-top: 10px;
    margin: 10px 10px 0 0;
    display: inline-block;
    width: 47%;
    position: relative;
    max-width: 900px;
}
.goto_box .goto_inner li{
    margin: 20px 10px 0 0;
    display: inline-block;
    width: 47%;
    position: relative;
    max-width: 430px;
}
.goto_box .goto_inner li a{
	display: block;
	font-weight: bold;
	font-size: 18px;
	color: #FFF;
	background: #3BAFDA;
	padding: 20px 10px;
	border-radius: 5px;
	text-decoration: none;
}
.goto_box .goto_inner li a::after{
	content: "\f054";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 8px;
    color: #fff;
    font-size: 18px;
}
.goto_box .goto_inner li a:hover{
	opacity: .8;
}
/*----- 61.html用 ------*/

.goto_box .goto_inner li.btn_box{
    width: 100%;
    max-width: 640px;
    margin-right: 0;
}
.goto_box .goto_inner li.btn_box a{
	padding: 25px 10px;
}


@media(max-width:767px) {
	.goto_box .goto_inner li{
		display: block;
		width: 100%;
		margin: 20px auto 0;
		max-width: 100%;
	}
	.goto_box .goto_inner li a, .goto_box .goto_inner li a::after{
		font-size: 16px;
	}
}
/*----- 55.html用 ------*/
.l_clm{
	float:left;
	margin-right:5px;
}

/* 2021.04 改修 */

ul.terminal-list li{
	overflow:hidden;
}

ul.terminal-list li img{
	float:left;
	border-radius:4px;
	object-fit: cover
}


ul.terminal-list li a:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

.terminal-add{
	color:#666;
	font-weight:normal;
	display:block;
	margin-top:7px;
	position:relative;
	margin-left:25px;
	margin-bottom:3px;
	font-size:14px;
	line-height:1.3;
}

.terminal-add:before{
	content: "\f3c5";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	left: -21px;
}

.terminal-tel{
	color:#666;
	font-weight:normal;
	display:block;
	position:relative;
	margin-left:25px;
	font-size:14px;
}

.terminal-tel:before{
	content: "\f095";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	left: -25px;
}

ul.terminal-list li:after{
	font-size:20px;
	right:5px;
}

.terminal-info .txt-s{
	font-size:14px;
	display:block;
}


@media(min-width:992px) {
	ul.terminal-list{
		width:100%;
	}
	ul.terminal-list li{
		width:48.8%;
	}
	
	ul.terminal-list li:nth-child(odd){
		margin-left:0;
	}
	ul.terminal-list li:nth-child(even){
		margin-right:0;
	}
	ul.terminal-list li img{
		width:135px;
		height:100px;
		
	}
	ul.terminal-list li .terminal-info{
		margin-left:148px;
	}
	ul.terminal-list li a{
		font-size:16px;
		padding:17px 22px 17px 17px;
	}
}
@media(min-width : 992px) and (max-width : 1199px) { 
	.terminal-add,
	.terminal-tel{
		font-size:13px;
	}
} 
@media(min-width : 768px) and (max-width : 991.99px) { 
	ul.terminal-list{
		width:100%;
	}
	ul.terminal-list li{
		width:100%;
	}
	
	ul.terminal-list li:nth-child(odd){
		margin-left:0;
	}
	ul.terminal-list li:nth-child(even){
		margin-right:0;
	}
	ul.terminal-list li img{
		width:150px;
		height:110px;
	}
	ul.terminal-list li .terminal-info{
		margin-left:170px;
	}
	ul.terminal-list li a{
		font-size:16px;
	}

} 
@media(max-width:767px) {
	ul.terminal-list{
		width:100%;
	}
	ul.terminal-list li{
		width:100%;
		margin:5px 10px 5px 0;

	}
	ul.terminal-list li:nth-child(even){
		margin-right:0px;
	}
	ul.terminal-list li img{
		width:68px;
		height:55px;
	}
	ul.terminal-list li .terminal-info{
		margin-left:77px;
	}
	ul.terminal-list li a{
		font-size:14px;
		padding:10px 15px 8px 7px;
	}
	
	ul.terminal-list li:after{
		right:3px;
		font-size:13px;
	}
	
	.terminal-add{
		margin-top:1px;
	}
	.terminal-add,
	.terminal-tel{
		font-size:12px;
		margin-left:15px;
	}
	.terminal-add:before{
		left:-14px;
	}
	.terminal-tel:before{
		left:-16px;
	}
	
	.terminal-info .txt-s{
		font-size:13px;
		display:block;
	}
}

ul.route-list a{
	padding:20px;
}

ul.route-list a:hover{
	opacity:0.8;
}
.ferry-timetable{
	padding:30px;
}

.ferry-timetable table{
	border-collapse: collapse;
	margin-bottom:0;
}

.ferry-timetable table th{
	background:#eee;
}

.ferry-timetable table tr{
	border-top:1px solid #ddd;
}

.ferry-timetable table tr:nth-child(even){
	background:rgba(0,0,0,0.025);
}
.ferry-timetable table tr:last-child{
	border-bottom:1px solid #ddd;
}

.ferry-timetable table th,
.ferry-timetable table td{
	padding:10px 5px;
	text-align:center;
}

.ferry-timetable table th:first-child,
.ferry-timetable table th:last-child,
.ferry-timetable table td:first-child,
.ferry-timetable table td:last-child{
	text-align:left;
}

.ferry-timetable table th:first-child,
.ferry-timetable table td:first-child{
	width:270px;
}

.ferry-timetable table th:nth-child(2),
.ferry-timetable table td:nth-child(2){
	width:100px;
}

.ferry-timetable.bin-wide table th:nth-child(2),
.ferry-timetable.bin-wide table td:nth-child(2){
	width:160px;
	font-size:15px;
}
	
	
.ferry-timetable table th:nth-child(3),
.ferry-timetable table td:nth-child(3),
.ferry-timetable table th:nth-child(4),
.ferry-timetable table td:nth-child(4){
	width:140px;
}


.ferry-timetable table td:nth-child(3){
	position:relative;
}


.ferry-timetable table td:nth-child(3):after{
	position: absolute;
	top:11px;
	right: -6px;
	content: "\f061";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	color:#666;
	font-size:14px;
}

.ferry-timetable table .dep_port{
	margin-right:5px;
}

.ferry-timetable table .arr_port{
	margin-left:5px;
}

.ferry-timetable.bin-wide table th:nth-child(2),
.ferry-timetable.bin-wide table td:nth-child(2){
	width:150px;
}

@media(min-width : 768px) and (max-width : 991.99px) { 
	.card.ferry-timetable{
		padding:20px;
	}
	.ferry-timetable table{
		font-size:15px;
	}
	.ferry-timetable table th:first-child,
	.ferry-timetable table td:first-child{
		width:160px;
	}
	.ferry-timetable table th:nth-child(3),
	.ferry-timetable table td:nth-child(3),
	.ferry-timetable table th:nth-child(4),
	.ferry-timetable table td:nth-child(4){
		width:110px;
	}

} 
@media(max-width:767px) {
	.ferry-timetable{
		padding:20px 5px;
		margin:0 -7px;
	}
	.ferry-timetable table {
		font-size:12px;
		width:550px;
		margin: 0 auto;
	}
	.ferry-timetable table th,
	.ferry-timetable table td{
		padding:10px 3px;
		text-align:center;
	}
	.ferry-timetable table th:first-child,
	.ferry-timetable table td:first-child{
		width:138px
	}
	.ferry-timetable table th:first-child{
		padding-left:5px;
	}
	.ferry-timetable table th:nth-child(2),
	.ferry-timetable table td:nth-child(2){
		width:55px;
	}
	.ferry-timetable table th:nth-child(3),
	.ferry-timetable table td:nth-child(3),
	.ferry-timetable table th:nth-child(4),
	.ferry-timetable table td:nth-child(4){
		width:58px;
	}
	.ferry-timetable table td:nth-child(3):after{
		right:-4px;
		font-size:10px;
	}
	.ferry-timetable table th:last-child,
	.ferry-timetable table td:last-child{
		/* width:260px;*/
	}
	
	.ferry-timetable:before{
		content:"← 左右に横スクールできます →";
		text-align:center;
		font-size:13px;
		padding:5px 0;
	}
	
	.ferry-timetable.ope-none:before,
	.ferry-timetable.ope-none .table th:last-child,
	.ferry-timetable.ope-none .table td:last-child{
		display:none;
	}
	.ferry-timetable.ope-none .table {
		width:100%;
	}

	.ferry-timetable.ope-none.bin-wide table th:nth-child(2),
	.ferry-timetable.ope-none.bin-wide table td:nth-child(2),
		.ferry-timetable.bin-wide table th:nth-child(2),
	.ferry-timetable.bin-wide table td:nth-child(2){
		width:65px;
		font-size:11px;
	}
}


.ferry-ope a.pdf{
	text-decoration:underline;
	position:relative;
	padding-right;15px:
}

.ferry-ope a.pdf:hover{
	text-decoration:none;
}

.ferry-ope a.pdf:after{
	content:"\f1c1";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position:absolute;
	right:-18px;
	color:#cc0000;
	
}

.tablesorter-default{
	font:initial;
}

a.restore{
	text-decoration:underline;
}

a.restore:hover{
	text-decoration:none;
}


/* 住所アイコン */

.address{
	color:#666;
	font-weight:normal;
	display:block;
	margin-top:7px;
	position:relative;
	margin-left:27px;
	font-size:15px;
}

.address:before{
	content: "\f3c5";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	top: 0px;
	left: -22px;
}

/* 航路一覧改修 */

ul.route-list {
	font-size:0;
}

.carrier-89 ul.route-list li,
.carrier-101 ul.route-list li{
	float:left !important;
}
.carrier-89 ul.route-list li a,
.carrier-101 ul.route-list li a{
	display:block;
}

ul.route-list{
	position:relative;
}

.carrier-89 ul.route-list,
.carrier-101 ul.route-list{
	padding-top:40px;
}


.carrier-89 ul.route-list:before,
.carrier-101 ul.route-list:before{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	font-size:20px;
	font-weight:bold;
	width:100%;
	text-align:center;
}
ul.route-list.departure-port-37:before{
	content:"鹿児島新港";
}
ul.route-list.departure-port-89:before{
	content:"名瀬港";
}
ul.route-list.departure-port-90:before{
	content:"那覇港";
}
ul.route-list.departure-port-91:before{
	content:"本部港";
}
ul.route-list.departure-port-92:before{
	content:"亀徳港";
}
ul.route-list.departure-port-93:before{
	content:"和泊港";
}
ul.route-list.departure-port-94:before{
	content:"与論港";
}
ul.route-list.departure-port-95:before{
	content:"湾港（喜界島）";
}
ul.route-list.departure-port-96:before{
	content:"古仁屋港（奄美大島）";
}
ul.route-list.departure-port-97:before{
	content:"平土野港";
}
ul.route-list.departure-port-98:before{
	content:"知名港";
}
ul.route-list.departure-port-99:before{
	content:"鹿児島本港";
}

.price-num{
    display: block;
}
.price-num:before {
    content: "￥";
    color: #fff;
    font-weight: bold;
    display: inline-block;
}


/*
隣接エリアの船会社
*********************************/

ul.area-link-list a{
	font-size:16px;
	color:#6c1044;
	display:block;
	padding:30px;
	background:#fff;
	border:1px solid #ccc;
	border-radius:5px;
	text-align:left;
	text-decoration:none;
}

ul.area-link-list a:hover{
	background:#fad6dc;
}


ul.area-link-list li{
	overflow:hidden;
	margin:5px;
	font-weight:bold;
	position:relative;
}

ul.area-link-list li img{
	float:left;
	border-radius:4px;
	object-fit: cover
}


ul.area-link-list li a:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}

ul.area-link-list li:after{
	content: "\f054";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	right:10px;
	color: #F53D7E;
	font-size:24px;
}


.carrier-add{
	color:#666;
	font-weight:normal;
	display:block;
	margin-top:7px;
	position:relative;
	margin-left:25px;
	margin-bottom:3px;
	font-size:14px;
	line-height:1.3;
}

.carrier-add:before{
	content: "\f3c5";
	font-family: "Font Awesome 5 Free";
	font-weight:900;
	position: absolute;
	left: -21px;
}

ul.area-link-list li:after{
	font-size:20px;
	right:5px;
}

ul.area-link-list li:nth-child(odd){
	float:left;
}


ul.area-link-list li:nth-child(even){
	float:right;
}



@media(min-width:992px) {
	ul.area-link-list{
		width:100%;
	}
	ul.area-link-list li{
		width:48.8%;
	}
	
	ul.area-link-list li:nth-child(odd){
		margin-left:0;
	}
	ul.area-link-list li:nth-child(even){
		margin-right:0;
	}
	ul.area-link-list li img{
		width:135px;
		height:100px;
		
	}
	ul.area-link-list li .carrier-info{
		margin-left:148px;
	}
	ul.area-link-list li a{
		font-size:16px;
		padding:17px 22px 17px 17px;
	}
}
@media(min-width : 992px) and (max-width : 1199px) { 
	.carrier-add,
	.terminal-tel{
		font-size:13px;
	}
} 
@media(min-width : 768px) and (max-width : 991.99px) { 
	ul.area-link-list{
		width:100%;
	}
	ul.area-link-list li{
		width:100%;
	}
	
	ul.area-link-list li:nth-child(odd){
		margin-left:0;
	}
	ul.area-link-list li:nth-child(even){
		margin-right:0;
	}
	ul.area-link-list li img{
		width:150px;
		height:110px;
	}

	ul.area-link-list li a{
		font-size:16px;
	}
	
	ul.area-link-list li .carrier-info{
		margin-left:170px;
	}

} 
@media(max-width:767px) {
	ul.area-link-list{
		width:100%;
	}
	ul.area-link-list li{
		width:100%;
		margin:5px 10px 5px 0;

	}
	ul.area-link-list li:nth-child(even){
		margin-right:0px;
	}
	ul.area-link-list li img{
		width:68px;
		height:55px;
	}

	ul.area-link-list li a{
		font-size:14px;
		padding:10px 15px 8px 7px;
	}
	
	ul.area-link-list li:after{
		right:3px;
		font-size:13px;
	}
	
	.carrier-add{
		margin-top:1px;
	}
	.carrier-add{
		font-size:12px;
		margin-left:15px;
	}
	.carrier-add:before{
		left:-14px;
	}
	ul.area-link-list li .carrier-info{
		margin-left:77px;
		line-height:1.3;
	}
	
}

/* Balloon追加
--------------------------------------------------------- */
.balloon {
  position: relative;
  /*display: inline-block;*/
  margin: 1.5rem auto 0.4rem;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 86%;
  color: #555;
  font-size: 16px;
  background: #FFF;
  border: solid 3px #555;
	text-align: center;
}

.balloon:before {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 50%;
  margin-left: -15px;
  border: 12px solid transparent;
  border-top: 12px solid #FFF;
  z-index: 2;
}
.balloon:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 50%;
  margin-left: -17px;
  border: 14px solid transparent;
  border-top: 14px solid #555;
  z-index: 1;
}
.balloon p {
  margin: 0;
  padding: 0;
	font-size: 12px;
}

/* ComingSoon追加
--------------------------------------------------------- */
.comingsoon {
	opacity: 0.5;
	transition-property: all;
	transition: 0.3s linear;
	pointer-events: none;
}