@charset "utf-8";
/* CSS Document */

#pankuzu{
	display:none;
}

#wrap_w{
    background-image: url(../image/index/bg.png);
    background-repeat: repeat-x;
    background-position: top;
	padding:15px 0 0;
}

/*----------------------------------------
	#top_content01
----------------------------------------*/

#top_content01{
	padding:20px 0 15px;
}

/* CM画像 */
#top_video{
	display:block;
	padding:0;
}
#top_video a img{
	width:695px;
	height:auto;
}
#top_video a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

/*グループ航路図 */
#top_map{
	margin:15px 0 0;
	width:645px;
	display:block;
	padding:30px 25px;
	background-color:#cdf5ff;
}
#top_map img{
	width:100%;
	display:block;
	margin:auto;
}

/*船紹介バナー */
#top_ship_banner{
	width:220px;
	padding:20px 0 10px;
	background-color:#47beda;
	background-image:url(../image/index/shipbanner_back.png);
	background-repeat:no-repeat;
	background-position:top center;
}
#top_ship_banner h3{
	display:block;
	text-align:center;
	color:#ffffff;
	font-size:184%;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin:0 0 10px;
}
#top_ship_banner .text{
	display:block;
	text-align:center;
	color:#ffffff;
	margin:0 10px 0;
	font-size:11px;
}
#top_ship_banner ul{
	margin:0 10px;
}
#top_ship_banner ul li{
	list-style:none;
	padding:0;
	margin:10px 0 0 ;
}
#top_ship_banner ul li a{
	display:block;
	width:200px;
	height:115px;
	background-repeat:no-repeat;
	background-position:center center;
}
#top_ship_banner ul li:nth-child(1) a{
	background-image:url(../image/index/banner01.png);
}
#top_ship_banner ul li:nth-child(2) a{
	background-image:url(../image/index/banner02.png);
}

#top_ship_banner ul li a:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

/*メニューバナー */
#top_menu_banner{
	width:220px;
	margin:20px 0 0;
}
#top_menu_banner li{
	list-style:none;
	padding:0;
	border:1px solid #cccccc;
	margin:0 0 7px;
}
#top_menu_banner li a{
	font-size:11px;
	display:block;
	height:70px;
	padding:14px 35px 14px 12px;
	background-image:url(../image/index/ya01.png);
	background-repeat:no-repeat;
	background-position:94% center;
	background-size:10px auto;
	background-color:#cccccc;
	text-decoration:none;
	color:#ffffff;
	line-height:1.4;
}
#top_menu_banner li a strong{
	display:block;
	font-size:177%;
	font-weight:bold;
	margin:0 0 7px;
}
#top_menu_banner li:nth-child(1) a{
	background-color:#ea822e;
}
#top_menu_banner li:nth-child(2) a{
	background-color:#60b4b2;
}
#top_menu_banner li:nth-child(3) a{
	background-color:#bb7d9c;
}

#top_menu_banner li a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

/*----------------------------------------
	#top_content02
----------------------------------------*/

/*- ティッカー -*/
#ticker_container{
	width:695px;
	height:88px;
	background-image:url(../image/index/ticker_dd.png);
	background-repeat:no-repeat;
	background-position:right top;
}
#ticker_container dt{
	display:block;
	width:132px;
	height:88px;
	float:left;
}
#ticker_container dd{
	display:block;
	float:left;
	width:533px;
	height:88px;
}
#ticker_container dd #ticker01{
	width:533px;
	margin:0px;
	padding:0px;
}
#ticker_container dd #ticker01 li{
	line-height:80px;
	margin:0px;
	padding:0px;
	font-weight:bold;
	font-size:15px;
}

/*-通常時-*/
.service_status{
	line-height:1.2em;
	padding:0 0 10px 0;
	margin:0;
	background-color:#00007D;
}
.service_status .ss_title{
	background: #00007D; /* Old browsers */
	background: -moz-linear-gradient(top, #036EB8 0%, #00007D 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #00007D), color-stop(0.00, #036EB8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #036EB8 0%, #00007D 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #036EB8 0%, #00007D 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #036EB8 0%, #00007D 100%); /* IE10+ */
	background: linear-gradient(to bottom, #036EB8 0%, #00007D 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#036EB8', endColorstr='#00007D', GradientType=0); /* IE7,8,9 */
}
.service_status .ss_img{
	height:35px;
	background-image: url(../img/u_title.png);
	background-repeat: no-repeat;
	background-position: 10px center;	
}
.service_status .ss_img span{
	display:none;
}

.service_status .ss_coment{
	padding:5px 10px;
	margin:0 10px;
	background-color:#ffffff;
}

/*-緊急時（文字のみ赤ver）-*/
.service_status_red{
	line-height:1.2em;
	padding:0 0 10px 0;
	margin:0px 5px 0 7px;
	background-color:#00007D;
}
.service_status_red .ss_title{
	background: #00007D; /* Old browsers */
	background: -moz-linear-gradient(top, #036EB8 0%, #00007D 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #00007D), color-stop(0.00, #036EB8)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #036EB8 0%, #00007D 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #036EB8 0%, #00007D 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #036EB8 0%, #00007D 100%); /* IE10+ */
	background: linear-gradient(to bottom, #036EB8 0%, #00007D 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#036EB8', endColorstr='#00007D', GradientType=0); /* IE7,8,9 */
}
.service_status_red .ss_img{
	height:35px;
	background-image: url(../img/u_title.png);
	background-repeat: no-repeat;
	background-position: 10px center;	
}
.service_status_red .ss_img span{
	display:none;
}

.service_status_red .ss_coment{
	font-size:14px;
	font-weight: bold;
	color:#C7332E;
	padding:5px 10px;
	margin:0 10px;
	background-color:#ffffff;
}

/*-緊急時-*/
/*.service_status_red{
	line-height:1.4em;
	padding:0 0 10px 0;
	margin:0px 5px 0 7px;
	background-color:#A80000;
}
.service_status_red .ss_title{
	background: #A80000;
	background: -moz-linear-gradient(top, #E63B36 0%, #A80000 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #A80000), color-stop(0.00, #E63B36)); 
	background: -webkit-linear-gradient(top, #E63B36 0%, #A80000 100%);
	background: -o-linear-gradient(top, #E63B36 0%, #A80000 100%); 
	background: -ms-linear-gradient(top, #E63B36 0%, #A80000 100%); 
	background: linear-gradient(to bottom, #E63B36 0%, #A80000 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E63B36', endColorstr='#A80000', GradientType=0);
}
.service_status_red .ss_img{
	height:35px;
	background-image: url(../img/u_title.png);
	background-repeat: no-repeat;
	background-position: 10px center;	
}
.service_status_red .ss_img span{
	display:none;
}
.service_status_red .ss_coment{
	font-size:14px;
	font-weight: bold;
	color:#C7332E;
	padding:5px 10px;
	margin:0 10px;
	background-color:#ffffff;
}*/

/*-緊急情報-*/
#kinkyu_container{
	width:670px;
	margin:15px 0px 15px 7px;
	background-image:url(../image/index/bg_kinkyu_middle.png);
	background-repeat:repeat-y;
	background-position:left top;
	overflow:hidden;
}
#kinkyu_container_ins{
	background-image:url(../image/index/bg_kinkyu_bottom.png);
	background-repeat:no-repeat;
	background-position:left bottom;
	overflow:hidden;
	padding:20px;
}
#kinkyu_container_ins ul{
	margin:0px;
	padding:0px;
}
#kinkyu_container_ins ul li{
	list-style-type:none;
	background-image:url(../image/index/li_kinkyu.png);
	background-repeat:no-repeat;
	background-position:left 0.3em;
	font-size:15px;
	font-weight:bold;
	padding-left:20px;
}
#kinkyu_container_ins ul li span {
	padding-left:220px;
}
#emergency{
	margin:15px 5px 15px 7px;
	border:1px solid #000000;
	padding:15px;
}
#emergency strong{
	font-size:114%;
	display:block;
	text-align:center;
	margin:0 0 5px;
	color:#FF0004;
}

/*-ISHIZAKIからのお知らせ-*/
#ishizaki_info{
	width:695px;
	margin:0 0px 15px 0;
}

#ishizaki_info ul{
	padding:20px 20px 9px;
    border: 1px solid #666666;
	border-radius: 5px;/* CSS3草案 */  
    -webkit-border-radius: 5px;/* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;/* Firefox用 */
	min-height:254px;
}
#ishizaki_info li{
	margin:0 0 6px 0;
	padding:0;
	list-style:none;
	list-style-type:none;
	display:table;
}

#ishizaki_info li p.day {
	font-size:14px;
    margin: 0 10px 0 0;
	line-height:1.5;
	vertical-align:top;
	display:table-cell;
	width:90px;
}
#ishizaki_info li a { color: #003399; }

#ishizaki_info li.press strong::after {
    background-color: #9ecc27;
    content: "プレス";
}
#ishizaki_info li.sjet strong::after {
    background-color:#4986d2;
    content: "Sジェット";
}
#ishizaki_info li.ferry strong::after {
    background-color: #00a6ff;
    content: "フェリー";
}
#ishizaki_info li.info strong::after {
    background-color: #ea6063;
    content: "お知らせ";
}

#ishizaki_info li strong::after {
	display:table-cell;
    background-color: #ccc;
    border-radius: 3px;
    color: #fff;
    font-size:12px;
    padding: 0 5px;
    text-align: center;
    width: 60px;
	font-weight:normal;
	line-height:1.5;
}
#ishizaki_info li .infotest{
	line-height:1.5;
	display:table-cell;
	width:486px;
	padding:0 0 0 7px;
	font-size:13px;
}

#ishizaki_info li .text_b{
	font-weight:bold;
}

/*-右バナー-*/
#top_sub_banner{
	width:220px;
}
#top_sub_banner ul li{
	margin:0 0 8px 0;
	padding:0;
	list-style:none;
	display:block;
}
#top_sub_banner ul li a{
	display:block;
	border:1px solid #666666;
	width:218px;
	height:53px;
	background-repeat:no-repeat;
	background-position: center center;
}
#top_sub_banner ul li.li1 a{ background-image:url(../image/index/banner03.png); }
#top_sub_banner ul li.li2 a{ background-image:url(../image/index/banner04.png); }
#top_sub_banner ul li.li3 a{ background-image:url(../image/index/banner05.png); }
#top_sub_banner ul li.li4 a{ background-image:url(../image/index/banner06.png); }
#top_sub_banner ul li.li5 a{ background-image:url(../image/index/banner07.png); }
#top_sub_banner ul li.li6 a{ background-image:url(../image/index/banner08.png); }
/*#top_sub_banner ul li.li7 a{ background-image:url(../image/index/banner09.png); }*/

#top_sub_banner ul li a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

/*----------------------------------------
	#top_content03
----------------------------------------*/

#top_content03{
	padding:20px 0 15px;
}

#facebook{
	width:500px;
}

#top_other_banner{
	width:417px;
}
#top_other_banner li{
	padding:0;
	list-style:none;
	display: inline-block;
	border:1px solid #cccccc;
	margin:0 0 7px 0;
	width:203px;
	height:73px;
	vertical-align:top;
}
#top_other_banner li:nth-child(odd){
	margin:0 2px 7px 0;
}
#top_other_banner li a{
	width:203px;
	height:73px;
	display: inline-block;
	background-color:#f0f0f0;
	background-repeat:no-repeat;
	background-position: center center;
}
#top_other_banner ul li.li1 a{ background-image:url(../image/index/banner10.png); }
#top_other_banner ul li.li2 a{ background-image:url(../image/index/banner11.png); }
#top_other_banner ul li.li3 a{ background-image:url(../image/index/banner12.png); }
#top_other_banner ul li.li4 a{ background-image:url(../image/index/banner13.png); }
#top_other_banner ul li.li5 a{ background-image:url(../image/index/banner14.png); }
#top_other_banner ul li.li6 a{ background-image:url(../image/index/banner15.png); }
#top_other_banner ul li.li7 a{ background-image:url(../image/index/banner22.png); }
#top_other_banner ul li.li8 a{ background-image:url(../image/index/banner17.png); }
#top_other_banner ul li.li9 a{ background-image:url(../image/index/banner18.png); }
#top_other_banner ul li.li10 a{ background-image:url(../image/index/banner19.png); }
#top_other_banner ul li.li11 a{ background-image:url(../image/index/banner20.png); }
#top_other_banner ul li.li12 a{ background-image:url(../image/index/banner21.png); }

#top_other_banner li.liNon{
	width:203px;
	height:73px;
	background-color:#cccccc;
}
#top_other_banner ul li a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

/* ぺージトップを非表示に */
.totop{
	/*display:none !important;*/
}

/* 住所 */
#top_footer {
	padding: 50px 0;
	background-color: #2d52aa;
	color:#FFFFFF;
}
#top_address {
	width: 950px;
	margin:0 auto;
}
#top_address .left{
	width: 650px;
}
#top_address .right{
	width: 230px;
}
#top_address h3{
	font-size:18px;
	font-weight:bold;
	margin:0 0 7px;
}
#top_address .address {
	line-height:25px;
	display:block;
}
#top_address h4{
	width:150px;
	display:inline-block;
	font-weight:bold;
	line-height:25px;
}
#top_address .tel{
	width:500px;
	display:inline-block;
	line-height:25px;
}
#top_address .left a{
	 pointer-events: none;
}
#top_footer a:link,  #top_footer a:active,  #top_footer a:visited,  #top_footer a:hover,  #top_footer a:focus {
	color : #FFF;
	text-decoration:none;
}

#top_address .left .agreement{
	margin:20px 0 0;
	font-size:90%;
}
#top_address .left .agreement a{
	 pointer-events: auto;
	 text-decoration:underline;
}
#top_address .left .agreement a:hover{
	 text-decoration:none;
}

/*　お問い合わせ　下部　*/
#top_address #inquery a{
	font-size:107%;
	width:230px;
	display:block;
	padding:12px 0;
	background:#FFFFFF;
	color: #2d52aa;
	text-decoration:none;
	font-weight:bold;
	text-align:center;
	margin:30px 0;
}
#top_address #inquery a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
}

/*　強調　*/
.link_y{
	background-color:#ebd156;
	color:#134aaa;
	padding:2px;
}

.link_y:hover {
	background-color:#f9f0b3;
}

/*混雑状況
---------------------------------------- -*/
#congestion{
	margin:14px 0 0;
	border:1px solid #CC0033;
	border-bottom:none;
}
#congestion dt{
	color:#CC0033;
	font-weight:bold;
	font-size:15px;
	padding:10px 13px;
	border-bottom:1px solid #CC0033;
	background-color:#fef1f1;
}
#congestion dd{
	font-size:15px;
	background-color:#ffffff;
	border-bottom:1px solid #CC0033;
	line-height:1.5;
}
#congestion dd #congestion_text{
	background-color:#ffffff;
	padding:0 0 20px;
}
#congestion dd #congestion_text #c_text1{
	color: #FF0000;
	padding:20px 20px 15px;
}
#congestion dd #congestion_text #c_text2,
#congestion dd #congestion_text #c_text3{
	font-size:14px;
	display:table-cell;
	width: 425px;
	padding:0 20px;
}
#congestion dd #congestion_text #c_text2 strong,
#congestion dd #congestion_text #c_text3 strong{
	font-size:15px;
	display:block;
	margin:0 0 5px;
}
#congestion dd #congestion_text #c_text2{
	/*border-right:1px solid #cccccc;
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;*/
	border-right:1px solid #cccccc;
}
#congestion dd #congestion_text #c_text3{
	/*border-right:1px solid #cccccc;
	border-top:1px solid #cccccc;
	border-bottom:1px solid #cccccc;*/
}
#congestion dt:after{
	color:#CC0033;
	 content: "∨";
	 float:right;
	 transform: scale( 1.2 , 0.5   ); /* B */
}
#congestion dt:hover{
	cursor:pointer;
}