@charset "utf-8";

* { margin:0; padding:0; font-size:16px; color:#333333; }

.clearfix { zoom:1; }
.clearfix:after { content:""; display:block; clear:both; }
.hide { display:none; }

body {
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", arial, verdana, sans-serif;
	-webkit-text-size-adjust:100%;/* スマホ対応時 */
	/*-ms-text-size-adjust:100%;*//* 必要ない？ */
}

.fontBold { font-weight:bold; }

/*
基本14px			基本15px			基本16px
9px ｜64%			9px ｜60%			9px ｜56%
10px｜72%			10px｜67%			10px｜63%
11px｜79%			11px｜74%			11px｜69%
12px｜86%			12px｜80%			12px｜75%
13px｜93%			13px｜87%			13px｜82%
14px｜100%		14px｜94%			14px｜88%
15px｜108%		15px｜100%		15px｜94%
16px｜115%		16px｜107%		16px｜100%
17px｜122%		17px｜114%		17px｜107%
18px｜129%		18px｜120%		18px｜113%
19px｜136%		19px｜127%		19px｜119%
20px｜143%		20px｜134%		20px｜125%
21px｜150%		21px｜140%		21px｜132%
22px｜158%		22px｜147%		22px｜138%
23px｜165%		23px｜154%		23px｜144%
24px｜172%		24px｜160%		24px｜150%
25px｜179%		25px｜167%		25px｜157%
26px｜186%		26px｜174%		26px｜163%
*/
/* font-size */
h1 { font-size:157%; font-weight:bold; }
h2 { font-size:138%; font-weight:bold; }
h3 { font-size:125%; font-weight:bold; }
h4 { font-size:125%; font-weight:bold; }
h5 { font-size:113%; font-weight:bold; }
h6 { font-size:113%; font-weight:bold; }
sup { font-size:82% !important; }
#contents #main p { font-size:100%; }
#contents #main .text-s, #contents #main .text-s th, #contents #main .text-s td { font-size:88%; }
#contents p#pageToTop a { font-size:82%; }
#contents p#photoTextOpen a, #contents p#photoTextClose a { font-size:82%; }
.sectionOpen a, .sectionClose a { font-size:82%; }
#menu ul li.language a { font-size:75%; }
#menu ul li.language span { font-size:75%; }
#footer p { font-size:88%; }
span.nw { font-size:100%; }


/* tag */
body { position:relative; margin:0; padding:0; background:url(../img/bg.jpg) center top no-repeat #1C4E7B; text-align:center; }

h1 { display:block; background-color:#003366; margin-bottom:0.5em; padding:0 16px; color:#FFFFFF; line-height:50px; /*vertical-align:middle; border-radius:10px 0 60px 0;*/ }
h2 { display:block; border-left:16px solid #0066CC; margin-bottom:0.5em; padding:0 12px; }
h3 { display:block; border-top:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; background-color:#EEEEEE; margin-bottom:0.5em; padding:3px 16px; clear:both; }
h4 { display:block; border-left:16px solid #BBBBBB; margin-bottom:0.5em; padding:0 12px; clear:both; }
h5 { display:block; border-top:1px solid #DDDDDD; border-bottom:1px solid #DDDDDD; background-color:#EEEEEE; margin-bottom:0.5em; padding:3px 16px; }
h6 { display:block; border-left:16px solid #DDDDDD; margin-bottom:0.5em; padding:0 12px; }
a { color:#0066CC; }
a img { border:none; }
img.roBtn { border:none; }

span.sp-show { display:none; }

span.nw { white-space:nowrap; }
span.nwsp { display:inline-block; overflow:hidden; width:1px; }
a span.nw { color:#0066CC; }

/* container */
#container { margin:0 auto; width:980px; text-align:left; position:relative; }

/* header */
#header { padding:34px 0 12px; } /*padding-top: 54px -> padding-top: 34px*/
.home #header { padding:0; }

#title { padding-bottom:6px; }
#title a { display:inline-block; }
#title img { vertical-align:bottom; }
#homeBtn { text-align:right; padding-right:14px; /*position:relative;*/ }
.home #homeBtnBox { position:absolute; left:0; top:0; display:block; width:220px; height:34px; background-color:#003366; opacity:0.5; filter:alpha(opacity=50); } /*言語選択背景*/
.home #homeBtn { position:absolute; left:0; top:0; display:block; width:220px; height:34px; /*vertical-align:middle;*/ } /*言語選択*/
.home #title { position:absolute; left:0; top:440px; vertical-align:bottom; }
.home #title img { vertical-align:bottom; }
/* #title_2 { } */


/* home slide */
#slide { width:980px; height:560px; position:relative; }
#slideScreen { width:980px; height:560px; /*background-color:#000000;*/ overflow:hidden; }
#slideScreen table { border-collapse:collapse; }
#slideScreen table td { padding:0; }
#slidePrevBtn { position:absolute; left:0; top:520px; }
#slideNextBtn { position:absolute; left:944px; top:520px; }
#slidePageBox { position:absolute; left:36px; top:520px; width:908px; height:36px; text-align:center; }

#slidePageBox a { display:inline-block; background:url(../img/slide_current_page_btn.gif) center top no-repeat; }
#slidePageBox a.current img { visibility:hidden; }



/* contents */
#contents { position:relative; padding:18px 10px 18px 18px; background-color:#FFFFFF; border-radius:5px 5px 0 0; }
.home #contents { border-radius:0; }
#contents #main { float:left; width:700px; overflow: visible; }

#contents #main .section { margin:0; padding:0 0 2em; }
#contents #main .section p.date { border-top:1px solid #DDDDDD; padding:5px 0 0 28px; font-weight:bold; color:#999999; text-align:left; }
#contents #main .section p.date * { color:#999999; }

#contents #main .accordion { width:100%; }


#contents #main p { padding:0 0.5em 1em; line-height:1.6; text-align:justify; text-justify:inter-ideograph; } /*左右のpaddingを追加*/
#contents #main .al-left { text-align:left !important; }
#contents #main .al-center { text-align:center; }
#contents #main .al-right { text-align:right; }
#contents #main .img-border { text-align:center; padding:0 0 1em; font-size:88%; }　/*paddingの設定追加*/
#contents #main .img-border img { border:1px solid #DDDDDD; vertical-align:bottom; }
.img-border img { border:1px solid #DDDDDD; vertical-align:bottom; margin-bottom:5px; } /*一行上が効いていない*/
.img-border * { font-size:88%; }

#contents #main .txt-indent_1 { padding-left:1em !important; }
#contents #main .txt-indent_2 { padding-left:2em !important; }
#contents #main .pdg-btm_1 { padding-bottom:1em !important; }
#contents #main .pdg-btm_15 { padding-bottom:1.5em !important; }
#contents #main .pdg-btm_2 { padding-bottom:2em !important; }
#contents #main .pdg-btm_3 { padding-bottom:3em !important; }
#contents #main .pdg-top_1 { padding-top:1em !important; }
#contents #main .pdg-top_2 { padding-top:2em !important; }
#contents #main .pdg-top_3 { padding-top:3em !important; }
#contents #main .pdg-topBtm_1 { padding:1em 0 !important; }
#contents #main .pdg-topBtm_2 { padding:2em 0 !important; }
#contents #main .pdg-topBtm_3 { padding:3em 0 !important; }
#contents #main .pdg-btm_0 { padding-bottom:0 !important; }
#contents #main .mgn-btm_0 { margin-bottom:0 !important; }
#contents #main .mgn-btm_1 { margin-bottom:1em !important; }
#contents #main .mgn-btm_2 { margin-bottom:2em !important; }
#contents #main .mgn-btm_3 { margin-bottom:3em !important; }

#contents #main .box { margin:0 0 1em; padding:1em; background-color:#EEEEEE; border:1px solid #CCCCCC; border-radius:5px; }


/* table */
#contents #main table.blue { border-collapse:collapse; border:1px solid #006699; }
#contents #main table.blue th { border:1px solid #006699; padding:5px 8px; background-color:#B1DBEB; text-align:center; }
#contents #main table.blue td { border:1px solid #006699; padding:5px 8px;  }
#contents #main table#eventTable { border-collapse:collapse; }
#contents #main table.stripeTable { border-collapse:collapse; }

#contents #main #infoBox { padding-bottom:1250px; } /*130px -> 20px -> 480px*/
#contents #main #info { padding:16px 10px; }
#contents #main #info table { width:100%; border-collapse:collapse; border-bottom:1px dotted #DDDDDD; /*border-bottom:2px solid #003366;*/ }
/* #contents #main #info table tr { border:1px dotted #CCCCCCC; } */
#contents #main #info table td { padding:6px 2px 6px 6px; border-top:1px dotted #DDDDDD; }

#contents #main #allInfo { text-align:right; padding:20px 0 0; }
#contents #main #allInfo a { text-decoration:none; background:url(../img/all_display.gif) right center no-repeat; padding:0.5em 32px 0.5em 0; line-height:1em; }
#contents #main #subInfo { text-align:right; padding:20px 0 0; }
#contents #main #subInfo a { text-decoration:none; background:url(../img/sub_display.gif) right center no-repeat; padding:0.5em 32px 0.5em 0; line-height:1em; }

/* lightbox */
#contents #main .photo_thumbnail { padding:0 0 2em; }
#contents #main .photo_thumbnail td { padding:9px; }
#contents #main .photo_thumbnail td img { border:1px solid #DDDDDD; }
#contents #main .photo_thumbnail td a:hover img { opacity:0.6; filter:alpha(opacity=60); }
#contents #main .photo_thumbnail li { margin-bottom:1em; line-height:1.6; text-align:justify; text-justify:inter-ideograph; padding-left:110px; list-style:none; clear:both; }
#contents #main .photo_thumbnail li img { margin-left:-132px; margin-top:2px; margin-bottom:1.5em; float:left; border:1px solid #DDDDDD; }
#contents #main .photo_thumbnail li a { text-decoration:none; }
#contents #main .photo_thumbnail li a:hover { text-decoration:underline; }
#contents #main .photo_thumbnail li a:hover img { opacity:0.6; filter:alpha(opacity=60); }

/* image-boarder */
#contents #main img.border { border:1px solid #DDDDDD; }
#contents #main .img-top-left { margin:0 0 0 260px; }
#contents #main .img-top-left img { display:block; float:left; margin-left:-256px; margin-bottom:2em; width:240px; height:auto; border:1px solid #DDDDDD; }
#contents #main .img-top-left .h_pri { display:block; float:left; margin-left:-256px; width:256px; text-align:center; } /* 縦長の写真の場合 */
#contents #main .img-top-left .h_pri img { display:inline; float:none; margin:0 0 2em; /*width:auto; height:168px;*/ } /* 縦長の写真の場合 */

/* list */
#contents #main ul { margin:0 0 1em 2em; }
#contents #main ol { margin:0 0 1em 3em; }

/* btn_menu */
#contents #main .btn_menu { display:block; width:auto; }
#contents #main .btn_menu ul { height:auto; list-style-type:none; margin:0 1em 1em; }
#contents #main .btn_menu li { margin-bottom:5px; margin-left:0; list-style-type:none; }
#contents #main .btn_menu a { display:inline-block; } /*IE6,7対策*/
#contents #main .btn_menu a {
	display:block;
	text-decoration:none;
	border:1px solid #DDDDDD;
	line-height:2;
	padding-left:30px;
	color:#333333;
	background:url(../img/btn_arrow.gif) 10px center no-repeat #F6F6F6;
	
	clear:both;
	overflow:auto;
	
	border-radius:5px;
}
#contents #main .btn_menu a:hover { background-color:#FFDDAA; border-color:#CC9933; }

.colorBlue  { color:#0066CC; }
.colorGreen { color:#009900; }
.colorRed   { color:#CC0000; }

span.floatRightText_s { float:right; padding-top:5px; font-size:88%; }

#photoTextOpen, #photoTextClose { float:right; position:relative; top:-40px; margin:0; padding:0; }
#photoTextClose { display:none; }
#photoTextOpen a, #photoTextClose a { display:inline-block; padding:5px 10px 5px 26px; text-decoration:none; color:#333333; background:#F6F6F6 url(../img/btn_slide_down_arrow.gif) 8px center no-repeat; min-width:120px; border:1px solid #DDDDDD; border-radius:5px; }
#photoTextClose a { background-image:url(../img/btn_slide_up_arrow.gif); }
#photoTextOpen a:hover, #photoTextClose a:hover { background-color:#FFDDAA; border-color:#CC9933; }


.sectionOpen, .sectionClose { float:right; position:relative; top:10px; margin:0; padding:0; }
.sectionOpen a, .sectionClose a { display:inline-block; margin:0; padding:5px 10px 5px 26px; text-decoration:none; color:#333333; background:#F6F6F6 url(../img/btn_slide_down_arrow.gif) 8px center no-repeat; min-width:3em; border:1px solid #DDDDDD; border-radius:5px; line-height:30px; }
.sectionClose a { background-image:url(../img/btn_slide_up_arrow.gif); }
.sectionOpen a:hover, .sectionClose a:hover { background-color:#FFDDAA; border-color:#CC9933; }


/* menu */
#menu { float:right; width:234px; }
#menu ul { list-style:none; }
#menu ul li { padding-bottom:6px; }
#menu ul li img { vertical-align:bottom; border:none; }
#menu ul li.language { width:224px; padding:12px 10px 10px 0; text-align:right; /*display:none;*/ }
#menu ul li.language a { display:inline-block; line-height:20px; min-width:60px; padding:3px 20px; border:1px solid #6699CC; background-color:#DDEEFF; border-radius:5px; text-decoration:none; text-align:center; }
#menu ul li.language a:hover { background-color:#FFDDAA; border-color:#CC9933; color:#993300; }
#menu ul li.language span { display:inline-block; padding-right:10px; line-height:30px; font-family:Arial, Helvetica, sans-serif; }

/* extra_menu */
#extra_menu { width:234px; margin-top:20px; }
#extra_menu .img-border { text-align:center; padding:0 0 1em; font-size:88%; }
#extra_menu a { font-size:100%; font-weight:bold; text-decoration:none; color:#333333; }
#extra_menu a:hover { text-decoration:underline; }
#extra_menu a img { filter:alpha(opacity=100); opacity:1.0; }
#extra_menu a:hover img { filter:alpha(opacity=50); opacity:0.5; }

/* headerに移動 */
#homeBtn .language { font-size:88%; position:absolute; left:0; top:2px; }
#homeBtn .language * { font-size:88%; }
#homeBtn .language span { color:#FFFFFF; font-weight:bold; display:inline-block; padding:0 6px 0 20px; line-height:30px; font-family:Arial, Helvetica, sans-serif; }
#homeBtn .language a { display:inline-block; line-height:16px; min-width:60px; padding:2px 16px; border:1px solid #6699CC; background-color:#DDEEFF; border-radius:5px; text-decoration:none; text-align:center; }
#homeBtn .language a:hover { background-color:#FFDDAA; border-color:#CC9933; color:#993300; }
.home #homeBtn .language { top:0; padding-top:2px; }

/* pageToTop */
#contents p#pageToTop { position:fixed; margin:0 0 0 810px; padding:0; bottom:60px; text-align:right; display:none; }
#contents p#pageToTop a { display:inline-block; padding:5px 10px 5px 26px; text-decoration:none; color:#333333; background:#F6F6F6 url(../img/btn_page_top_arrow.gif) 8px center no-repeat; border:1px solid #DDDDDD; border-radius:5px; line-height:30px; min-width:95px; }
#contents p#pageToTop a:hover { background-color:#FFDDAA; border-color:#CC9933; }

/* footer */
#footer { background-color:#003366; }
#footer p { padding:0 16px; line-height:3; text-align:right; color:#FFFFFF; }

/* extra_area */
#extra_area { float:right; width:234px; margin-top:40px; }
#extra_area .img-border { text-align:center; padding:0 0 1em; font-size:88%; }

/* 子供用パンフレット */
#extra_home_bottom { position:absolute; left:1em; bottom:0; width:700px; }
#extra_home_bottom .img-border .pc { display: inline; }
#extra_home_bottom .img-border .sp { display: none; }

/* SNS Facebook */
#extra_home_bottom .sns { margin: 0 0 30px; width: 100%; text-align: center; }
#extra_home_bottom .sns .sp { display: none; }


/* print */
#title img.print { display:none; }
@media print {
	body { background:none; }
	#title img { display:none !important; }
	#title img.print { display:block !important; }
	.home #title img { display:block !important; }
	#homeBtn img { display:none; }
	#homeBtn .language { display:none; }
	h1 { background-color:#FFFFFF; color:#003366; border:1px solid #003366; }
	#contents #main p { line-height:1.4; }
	#contents #main .photo_thumbnail li { line-height:1.4; }
	#contents #main .img-border img { margin-bottom:5px; }
	#contents p#pageToTop { display:none !important; }
	#footer { background-color:#FFFFFF; color:#003366; border-top:1px solid #003366; }
	#footer p { color:#003366; }
}


/* SmartPhone */
#header img.smp { display:none; }
#title img.smp { display:none; }
#menu_bg { position: absolute; left:0; top:-176px; width:100%; height:100%; background-color:#FFFFFF; opacity:0.8; display:none; }
#menu_open_btn { position:absolute; right:0; top:0; }
#menu_open_btn a { display:inline-block; }
#menu_close_btn { position:absolute; right:0; top:-176px; display:none; }
#menu_close_btn a { display:inline-block; }
#menu_home_btn { position:absolute; left:0; top:-176px; display:none; }
#menu_home_btn a { display:inline-block; }



/* 旧軍港サイト記号表示 */
.kg .mark_blue { display:inline-block; padding:0 3px; line-height:1; color:#0059B2; font-weight:bold; min-width:20px; text-align:right; }
.kg .mark_red { display:inline-block; padding:0 3px; line-height:1; color:#B20000; font-weight:bold; min-width:20px; text-align:right; }
.kg .mark_green { display:inline-block; padding:0 3px; line-height:1; color:#008C00; font-weight:bold; min-width:20px; text-align:right; }
.kg .mark_gray { display:inline-block; padding:0 3px; line-height:1; color:#777777; font-weight:bold; min-width:20px; text-align:right; }



/* ------------------------------------------------------------------------------------------------------------------------------------------------------ */
/* 日本遺産サブサイト */

body.jh { background-color:#FFFFFF; background-image:none; border-top:5px solid #8C0000; border-bottom:5px solid #8C0000; }
.jh h1 { background-color:#8C0000; }
.jh h2 { border-left-color:#8C0000; }

.jh #header { padding:34px 0 22px; }
/*.jh .home #header { padding:0; }*/

.jh #jh_logo { position:absolute; left:70px; top:20px; }
.jh .home #jh_logo { left:40px; top:30px; }
.jh #jh_title { padding:0 20px 20px 0; text-align:right; }
/*.jh .home #jh_title { padding:34px 20px 20px 0; text-align:right; }*/
.jh #jh_title a { display:inline-block; }
.jh #jh_title img { vertical-align:bottom; }

.jh .jh_list li { padding-top:8px; padding-bottom:8px; border-top:1px dotted #DDDDDD; }
.jh .jh_list li:first-child { border-top:none; }
.jh .jh_list ul { list-style-type:disc; margin-bottom:0 !important; }
.jh .jh_list ul li { border-top:none; padding:0; }
.jh #contents #main ol.jh_list { margin:0 0 1em 2.5em; }
.jh #contents #main ol.jh_list li ol { margin:0 0 0 1.5em; list-style-type:lower-alpha; }
.jh .jh_list a { display:inline-block; width:600px; max-width:600px; vertical-align:top; font-size:113%; }
.jh .jh_list a:hover { text-decoration:none; background-color:#E1F4FA; }
.jh #contents #main ol.jh_list li ol li a { width:565px; max-width:565px; }

.jh .float_2 { float:left; width:349px; }

.jh .mark_blue { display:block; padding:0 3px; line-height:1; color:#0059B2; font-weight:bold; float:right; min-width:20px; text-align:right; }
.jh .mark_red { display:block; padding:0 3px; line-height:1; color:#B20000; font-weight:bold; float:right; min-width:20px; text-align:right; }
.jh .mark_green { display:block; padding:0 3px; line-height:1; color:#008C00; font-weight:bold; float:right; min-width:20px; text-align:right; }
.jh .mark_gray { display:block; padding:0 3px; line-height:1; color:#777777; font-weight:bold; float:right; min-width:20px; text-align:right; }
.jh .section .mark_blue, .jh .section .mark_red, .jh .section .mark_green, .jh .section .mark_gray { float:none; display: inline-block; padding-left:0; }

.jh .sns { margin: 0 0 30px; border: none; width: 100%; text-align: center; }
.jh .sns .sp { display: none; }

.jh a.btn {
	display:inline-block;
	margin-top:10px;
	padding:0 10px;
	text-decoration:none;
	border:2px solid #DDDDDD;
	line-height:2;
	color:#333333;
	background-color:#F6F6F6;
	
	clear:both;
	overflow:auto;
	
	border-radius:5px;
}
.jh a.btn:hover { background-color:#FFDDAA; border-color:#CC9933; }

.jh a.btn-red {
	display: inline-block;
    padding: 10px 30px;
    background-color: #8c0000;
    color: #FFFFFF;
    text-decoration: none;
    font-weight: bold;
	font-size: 130%;
	border-radius: 5px;
	opacity: 1;
}
.jh a.btn-red:hover { opacity: 0.7; }



.jh .map_box { margin:5px 0 0 10px; }
.jh .map_box iframe { border:1px solid #999999; margin:0 auto; }


.jh #footer { padding-top:20px; padding-bottom:0; background-color:#FFFFFF; width:auto; clear:both; }
.jh #footer p { padding-bottom:0; color:#8C0000; line-height:2 !important; }


/* SmartPhone */
.jh #jh_title img.smp { display:none; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------ */