@charset "utf-8";

@import url('css/reset.css');

body {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, sans-serif;
	font-size:16px;	line-height:1.5em; color:#333;
}

/***********************************************

	common

************************************************/
img { display:block; width:100%; }

a { color:#0066b6; text-decoration:none; }
a:hover { text-decoration:underline; }
a img:hover { filter: alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; }


@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}

/***********************************************

	header

************************************************/

.header {
	height:64px;
	-moz-box-shadow: 1px 1px 10px #cccccc;
	-webkit-box-shadow: 1px 1px 10px #cccccc;
	box-shadow: 1px 1px 10px #cccccc;
}
.header-inner { overflow:hidden;  }

.logo { float:left; margin:17px 0 17px 5%; }
.logo .site-title a { display:block; width:229px; height:30px; text-indent:-9999px; background:url(images/logo.png) no-repeat; background-size:229px 30px; }
.logo .site-title a:hover { filter: alpha(opacity=70); -moz-opacity:0.70; opacity:0.70; }
.contact-nav { display:none; }

.open-nav { float:right; padding:22px 5%; }
.icon-menu { display:block; width:29px; height:20px; text-indent:-9999px; background:url(images/icon-menu-blue.png) 50% 50% no-repeat; background-size:29px 20px; }

.nav-wrap { display:none; }


.header nav {}




@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}




/***********************************************

	footer

************************************************/


@media screen and (min-width: 768px) {
}
@media screen and (min-width: 1024px) {
}


/***********************************************

	content

************************************************/

section{margin-top:40px;}
.content-inner { width:90%; margin:0 auto; }

h2.section-ttl{color:#333333; font-size:20px; font-weight:bold; background-image:url(images/icon-circle.png);
background-size:20px 20px; background-repeat:no-repeat; background-position:left top; padding-left:32px; padding-bottom:4px;
border-bottom:#0066b6 solid 2px;}
h3.sub-ttl{font-size:16px; color:#333333; font-weight:bold; border-bottom:#cccccc solid 1px; margin-top:24px; margin-bottom:16px; }
p.lead{font-size:14px; margin-top:24px; color:#666666;}
p.caution{font-size:12px; color:#666666; line-height:1.5em; margin-top:16px;}

ul.sub-navi {text-align:left; margin-top:16px;}
ul.sub-navi li{display:inline-block; line-height:1em; font-size:12px; padding-left:8px; border-left:#88b8dd solid 1px;}
ul.sub-navi li:last-child{padding-right:8px; border-right:#88b8dd solid 1px;}

div.two-column{overflow:hidden; }
div.two-column div.boxr{margin-top:24px;}

div.two-column div div.wrap {text-align:center;}

table{width:100%; table-layout:fixed;}
table,table td,table th{ border:#cccccc solid 1px; font-size:14px;} /* site table border */
table th{background-color:#f6f6f6; text-align:center;}

.mod {text-indent:-1em; padding-left:1em;}

/** privacy **/
div.pre-privacy{margin-top:16px;}
dl.privacy-list {margin-top:8px; line-height:1.5em;}
dl.privacy-list dt{ font-size:16px; font-weight:bold; border-bottom:#cccccc solid 1px;margin-top:32px;}
dl.privacy-list dd{font-size:14px; margin-top:16px; color:#666666;}
dl.privacy-list dd ul {margin-top:12px;}


/** sitemap **/
dl.sitemap-list.first{margin-top:32px;}
dl.sitemap-list.first dt{padding:0; border-top:none;}
dl.sitemap-list.first dt a{padding:20px 0;}
dl.sitemap-list dt{color:#cccccc;  font-size:24px; border-top:#cccccc solid 1px; padding:20px 0; }
dl.sitemap-list dt a {display:block;}
dl.sitemap-list dt span{color:#0066b6; background-image:url(images/icon-arrow-r-blue-02.png);
background-size:auto 24px; background-repeat:no-repeat; background-position:right; padding-right:24px;}
dl.sitemap-list dd{margin-left:32px; color:#0066b6; border-top:#cccccc solid 1px;
font-size:20px;}
dl.sitemap-list dd span{color:#0066b6; background-image:url(images/icon-arrow-r-blue-02.png);
background-size:auto 20px; background-repeat:no-repeat; background-position:right; padding-right:24px;}
dl.sitemap-list dd a{display:block; padding:20px 0; }

/** company **/

div.pre-company{margin-top:24px;}
div.pre-company h2 img{margin-top:16px;}
div.pre-company h3,div.pre-company h2{text-align:center; margin-left:auto; margin-right:auto;}
div.pre-company h3{width:215px;}
div.pre-company h2{width:90%; }

h2.section_ttl_company{padding:8px 0; background-color:#f6f6f6;  border:#cccccc solid 1px; font-size:20px; color:#0066b6; text-align:center; font-weight:bold;}

section.management p.lead{color:#333333; font-weight:bold;}

table.tbl-profile{margin:48px auto 24px; }
table.tbl-profile th{width:110px;}
table.tbl-profile td{padding:8px 0 8px 16px; overflow:hidden;}
table.tbl-profile td dt{float:left;}
table.tbl-profile td dd{padding-left:56px;}
dl.list-profile {color:#666666; font-size:14px; line-height:1.5em;}
dl.list-profile dt{margin-top:8px;}
dl.list-profile dd{padding-left:32px;}
iframe.map{margin-top:24px;}

/** service **/
section.route div.wrap img{ margin-left:auto; margin-right:auto;}
table.weekly-tbl th{width:80px;}
table.weekly-tbl td{font-size:12px;}
section.route div.two-column div.boxr ul{font-size:14px; line-height:2em;}
section.ship p.lead{margin-bottom:16px;}
ul.ship-dtl{font-size:12px; line-height:1.5em;}

section.types div.two-column,section.performance div.two-column{margin-top:16px; font-size:14px; line-height:1.5em;}


section.facility div.three-column div.box{margin-top:16px;}
dl.facility-list dt{font-weight:bold; text-decoration:underline;}
dl.facility-list dd{font-size:12px; line-height:1.5em; color:#666666;}
section.facility div.two-column{margin-top:16px; font-size:12px;}
section.facility div.three-column div dl.facility-list dt{margin-top:8px;}
section.facility div.two-column div.boxr{margin-top:0}
div.two-column div dl.facility-list dd{padding-left:0.5em;}

/** future **/
div.newport {margin-top:32px;}
div.newport h2 {font-size:20px; color:#0066b6; font-weight:bold; margin-bottom:24px;}
div.newport img{margin-bottom:24px;}
div.newport p{color:#666666; line-height:1.5em; font-size:14px;}

section.base img{margin-bottom:24px;}
section.base p{color:#666666; line-height:1.5em; font-size:14px}
section.base h4{font-weight:bold; line-height:1.5em; font-size:16px;  margin:24px 0 8px;}

table.table-bese td,table.table-bese th{text-align:center; font-size:14px; padding:6px 0;}
table.table-bese thead th,table.table-bese thead td{border-bottom:2px solid #999;}

section.base a.dtl-link{background:#0066b6; color:#ffffff; text-decoration:none; font-weight:bold; width:220px;
display:block; text-align:center; line-height:2.0em; border-radius:16px; margin:16px auto 0;
background-image:url(images/icon-arrow-white.png); background-size:auto 15px; 
 background-repeat:no-repeat; background-position:78% 47%;}
section.base a.dtl-link:hover{opacity:0.8;}

section.tourism div.two-column{margin-top:32px;}
section.tourism div.two-column p{color: #666666;line-height: 1.5em;font-size: 14px;}

section.environment div.two-column div.boxr{margin-top:0;}
section.environment div.two-column p{color: #666666;line-height: 1.5em;font-size: 14px;}
section.environment div.two-column div.boxl{margin-top:24px;}
section.environment div.two-column div.boxl h4{margin:24px 0 16px; font-weight:bold;}
section.environment div.two-column div.boxl p.dtl{font-size:12px;}
section.environment p.port-link{text-align:left; margin:16px auto 0;}
section.environment div.two-column div.boxl img{width:175px; margin:0 auto 8px;}
section.environment div.two-column div.boxl p.port-link{font-size:12px;}
section.environment div.two-column div.boxl img{margin:0; display:inline;}

/** index **/

div.section-inner{ width:90%; margin:0 auto; padding:40px 0;}
.section-ttl-top-wrap { position:relative; height:1px; border-top:1px solid #0066b6; border-bottom:1px solid #ccc; }
.section-ttl-top { position:absolute; top:-11px; width:100%; text-align:center; }
.section-ttl-top span { padding:0 24px; background-color:#fff; font-size:20px; line-height:1em; color:#0066b6; font-weight:bold; }
section.news,section.link,section.news .section-ttl-top span,section.link .section-ttl-top span{background-color:#f6f6f6;}

section.about h3 img {width:215px; margin:24px auto 0; }
section.about p.lead{font-weight:bold; text-align:center; font-size:14px;}
section.about div.wrap a{margin-top:32px; display:block; border-top:#0066b6 2px solid; padding-bottom:16px;
box-shadow:rgb(204, 204, 204) 0px 0px 5px 0px;
-webkit-box-shadow:rgb(204, 204, 204) 0px 0px 5px 0px;
-moz-box-shadow:rgb(204, 204, 204) 0px 0px 5px 0px;}
section.about div.wrap a:hover{text-decoration:none; opacity:0.8;}
section.about div.wrap a h3{text-align:center; font-weight:bold; font-size:18px; margin-top:16px; }
section.about div.wrap a p.lead{font-weight:normal; font-size:14px; padding:0 16px; margin-top:16px;}
section.about div.wrap a p.dtl-link{text-align:right;margin:16px 16px 0 0; }
section.about div.wrap a p.dtl-link span{ font-weight:bold;  background-image:url(images/icon-arrow-r-blue.png); background-size:auto 15px; 
 background-repeat:no-repeat; background-position:right; padding-right:16px;}

section.news a.dtl-link{background:#0066b6; color:#ffffff; text-decoration:none; font-weight:bold; font-size:14px;
width:104px;display:block; line-height:2.4em; border-radius:5px; margin:16px 0 0 auto; padding-left:16px; text-align:left;
background-image:url(images/icon-arrow-white.png); background-size:auto 12px; 
 background-repeat:no-repeat; background-position:83% 47%;}
section.news a.dtl-link:hover{opacity:0.8;}

section.contact p.lead{font-size:18px; font-weight:bold; text-align:center;} 
section.contact p.caution{text-align:center; margin-top:4px;}
section.contact div.two-column{margin-top:16px;}
section.contact div.boxr{margin-top:16px;}
section.contact div.tel{margin-left:auto; margin-right:auto;  width:251px; height:34px; 
background-color:#0066b6; color:#fff; border-radius:8px; text-align:right; font-size:20px; font-weight:bold;
padding-top:14px; padding-right:19px;  background-size:24px;  background-repeat:no-repeat; background-position:6% 46%;
background-image:url(images/icon-tel-wh.png);}
section.contact div.fax{margin-left:auto; margin-right:auto;  width:254px; height:34px; 
background-color:#0066b6; color:#fff; border-radius:8px; text-align:right; font-size:20px; font-weight:bold;
padding-top:14px; padding-right:16px;  background-size:24px;  background-repeat:no-repeat; background-position:6% 46%;
background-image:url(images/icon-fax-wh.png)}
section.link{font-size:14px;}
section.link h3{border-bottom:none; margin-bottom:0;}
section.link ul{width:100%; border-top:#cccccc solid 1px; font-size:14px; margin-top:8px; padding-top:16px;}

/*introduciton*/ 
section.title{margin-top:64px;}
section.title h3 {font-size:16px; color:#0066b6; font-weight:bold; border:#0066b6 solid 1px; text-align:center; margin:0 auto; width:224px;
padding:3px 0;} 
section.title h2{margin-top:32px;}
section.title h2 img{display:inline;}

section.location01{margin-top:60px;}
section.location01,section.location02,section.location03{background-color:#f6f6f6;
box-shadow:rgb(204, 204, 204) 0px 0px 10px 0px;
-webkit-box-shadow:rgb(204, 204, 204) 0px 0px 10px 0px;
-moz-box-shadow:rgb(204, 204, 204) 0px 0px 10px 0px;}
div.two-column.location{margin-top:16px; margin-bottom:16px;}
div.two-column.location h3{color:#0066b6; font-size:24px; font-weight:bold;}
div.two-column.location p.detail{font-size:16px; margin-top:8px; line-height:1.5em;}
div.two-column.location div.boxl{float:left; width:40%; padding-right:2.5%; padding-left:2.5%;} 
div.two-column.location div.boxl img{margin-bottom:16px;}
div.two-column.location div.boxr{float:left; width:55%; margin-top:0;}

@media screen and (min-width: 768px) {
ul.sub-navi {text-align:right;}
div.two-column div.boxl{width:49.2%; float:left;}
div.two-column div.boxr{width:49.2%; float:right; margin-top:0;}


/** sitemap **/
dl.sitemap-list {overflow:hidden;}
dl.sitemap-list.first dt{width:100%;}
dl.sitemap-list dt { float:left; width:320px;}
dl.sitemap-list dd { margin-left:320px;}

/** company **/
div.pre-company p.lead,section.management p.lead
{text-align:center; margin-left:auto; margin-right:auto;}

div.pre-company h2{width:480px; }
div.pre-company p.lead{width:600px;}
section.management p.lead{width:600px;}

table.tbl-profile{width:90%;}
table.tbl-profile th{width:220px;}


/** service **/
table.weekly-tbl tr{line-height:2em;}
div.three-column{overflow:hidden;}
div.three-column div.box{width:32%;  float:left; margin-right:2%;}
div.three-column div.box:last-child{margin-right:0;}
div.two-column dl.facility-list{line-height:1.5em;}
div.two-column dl.facility-list dt{font-size:16px;}
div.two-column div dl.facility-list dt{margin-top:8px; font-size:14px;}
div.two-column div dl.facility-list dd{padding-left:1.5em;}

/** future **/
div.newport img{float:right; margin-left:16px; margin-bottom:16px; width:50%;}
section.base div.two-column div.boxl {width:58.4%;}
section.base div.two-column div.boxr {width:40%; text-align:right;}
section.base div.two-column div.boxr img{width:100%;}

section.tourism div.two-column div.boxl{width:40%;}
section.tourism div.two-column div.boxr{width:58.4%;}

section.environment div.two-column div.boxl{width:58.4%;}
section.environment div.two-column div.boxr{width:40%;}

/** index **/
section.about p.lead{width:66%; margin:24px auto auto;}
section.about div.wrap a.mainbox{width:32%; height:308px; float:left; margin-right:2%; position:relative;}
section.about div.wrap a.mainbox p.lead{width:94%; padding:0}
section.about div.wrap a.mainbox.last{margin-right:0}
section.about div.wrap a.mainbox p.dtl-link{position:absolute; bottom:10px; right:10px; margin:0;}

section.news div.update{width:66%; float:left;}
section.news div.weather{width:33%; float:right;}

section.contact div.tel,section.contact div.fax{margin-left:auto; margin-right:auto;  width:260px; height:42px; 
background-color:#0066b6; color:#fff; border-radius:8px; text-align:right; font-size:24px; padding-top:22px; padding-right:0px;
padding-left:60px;  background-size:36px;  background-repeat:no-repeat; background-position:5% 46%;
text-align:left;}
section.contact div.two-column{margin-top:40px;}
section.contact div.tel{background-image:url(images/icon-tel-wh.png); margin-right:32px;}
section.contact div.fax{background-image:url(images/icon-fax-wh.png); margin-left:32px;}

section.link ul{width:auto; display:inline-block;}
section.link ul li{display:inline-block; padding-right:2em;}

/*introduciton*/ 
div.two-column.location p.detail{margin-top:24px;}
div.two-column.location div.boxl{width:146px; padding-left:32px; padding-left:24px;}

section.title h2{width:640px; text-align:center; margin-left:auto; margin-right:auto; }



@media screen and (min-width: 1024px) {
	
.content-inner { width:944px; }
	
/** company **/	
table.tbl-profile{width:780px;}	

/** future **/
section.base div.two-column div.boxr img{width:384px;}
section.base a.dtl-link{margin-right:0;}

section.tourism div.two-column div.boxl{width:384px;}
section.tourism div.two-column div.boxr{width:544px;}

div.section-inner{width:944px;}


}
