@charset "utf-8";
/* ***********************************
	Site Name	:	明石海峡大橋ブリッジワールド:世界最大級の吊橋を体験しよう！
	Description	:	スマートフォン用のCSS
	Version		:	1.1
	Author		:	Ai Nakai
	Creation	:	2011.12.6
	Updating	:	2012.03.23 h5設定

	************目次**************

		1. 初期設定
		2. リンク設定
		3. 全体構成
		4. header
		5. main
		6. menu
		7. footer
		8. カレンダー
		9. 共通設定
		
***************************************/

/* --------------------------------------------------
	1.初期設定
-------------------------------------------------- */


* {
	-webkit-transition: 0 !important; 
	margin: 0;
	padding: 0;
}

p,li,dt,dd,dl {
	line-height: 1.3;
	margin-bottom:0.5em;
}

img ,img a{
	border: 0;
	margin: 0;
	padding: 0;
	text-decoration:none;
	background:none;
}
html {overflow-y: scroll;}

.clearfix:after{
	content:".";
	height:0;
	display:block;
	clear:both;
	visibility:hidden;
}
.clearfix {display: inline-block;}
ol, ul{list-style: none;}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

h1 , h1 a{
	width:140px;
	height:55px;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
	display:block;
	background:url(../img/menu.png) no-repeat -320px 0;
	margin: 0;
}
	
h2{
	margin:20px 0;
	padding-left:30px;
	color:#005A8C;
	background:url(../img/menu.png) no-repeat -700px -645px;
	text-shadow:#E5E5E5 2px 2px 1px;
}
h3{
	color:#005A8C;
	font-size:14pt;
}
h4{
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	margin-top:20px;
	font-size:110%;
	line-height:1.5em;
	color:#005A8C;
	text-shadow:#E5E5E5 2px 2px 1px;
}
h5{
	margin-top:10px;
	padding-left:15px;
	font-size:15px;
	color:#005A8C;
	background:url(../../img/content_icon_h3.gif) no-repeat 0 5px;
	text-shadow:#E5E5E5 2px 2px 1px;
}
/* --------------------------------------------------
	2. リンク設定
-------------------------------------------------- */
a{
	text-decoration:underline;
	color:#1E95D4;
}
a:hover{
	text-decoration:underline;
	color:#1E95D4;
	background-image:url(../img/link.png);
}
/* --------------------------------------------------
	3. 全体構成
-------------------------------------------------- */
body {
	background-color:#FFF;
	text-align: center;
	color: #666;
    margin: 0px auto;
	height:100%;
}

#wrapper{
	background-color:#FFF;
	letter-spacing:0.5;
	font-size:12pt;
	font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif, Verdana, sans-serif;
	height:100%;
 	margin: 0 auto;
	padding: 0 5px;
	text-align:left;
}

/* --------------------------------------------------
	4. header
-------------------------------------------------- */

#contact{ display:none;}
#contact_s{
	margin:0;
	clear:both;
}

#contact_s ul{
	height:30px;
	margin-left:-40px;
	width:300px;
	list-style:none;
}
#contact_s li{
	float:left;
}
.honshi , .honshi a{
	height:30px;
	display:block;
	width:125px;
	background-image:url(../img/menu.png);
	background-position:-455px -640px;
	background-repeat:no-repeat;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
.otoiawase , .otoiawase a{
	height:30px;
	display:block;
	width:80px;
	background-image:url(../img/menu.png);
	background-position:0 -610px;
	background-repeat:no-repeat;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
.english , .english a{
	height:28px;
	display:block;
	width:95px;
	background-image:url(../img/menu.png);
	background-position:-260px -610px;
	background-repeat:no-repeat;
	white-space: nowrap;
	text-indent: 100%;
	overflow: hidden;
}
.english a:hover{
	background-position:-260px -640px;
}

/* --------------------------------------------------
	5 .main
-------------------------------------------------- */

#main{
	float:none;
	margin:10px 0 ;
	overflow:hidden;
    _zoom:1;

}
.top_01{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 0;
}
.top_02{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -70px;
}
.top_03{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -140px;
}
.top_04{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -210px;
}
.top_05{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -280px;
}
.top_06{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -350px;
}
.top_07{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -420px;
}
.top_08{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -490px;
}
.top_09{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -560px;
}
.top_10{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -630px;
}
.top_11{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -700px;
}
.top_12{
	width:300px;
	height:70px;
	margin:0 auto;
	background:url(../img/top_s.png) no-repeat 0 -770px;
}

/* --------------------------------------------------
	6. menu
-------------------------------------------------- */
#menu{
	float:none;
	width:100%;
}
#menu ul{
	width:100%;
	font-weight:bold;
	list-style:none;
	margin: 0 auto;
	padding:0;
}
#menu li{
	float:left;
	font-size:11pt;
	width:35%;
	height:28px;
	border-radius: 5px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border: 1px #ccc solid;
   padding-top:12px;
   padding-left:35px;
   margin:2px;
}
.menu01{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -110px;
	background-repeat:no-repeat;
}
.menu02{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -150px;
	background-repeat:no-repeat;
}
.menu03{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -190px;
	background-repeat:no-repeat;
}
.menu04{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -230px;
	background-repeat:no-repeat;
}
.menu05{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -270px;
	background-repeat:no-repeat;
}
.menu06{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -310px;
	background-repeat:no-repeat;
}
.menu07{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -350px;
	background-repeat:no-repeat;
}
.menu08{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -390px;
	background-repeat:no-repeat;
}
.menu09{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -430px;
	background-repeat:no-repeat;
}
.menu10{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -470px;
	background-repeat:no-repeat;
}
.menu11{
	display:block;
	background-image:url(../img/menu.png);
	background-position:-640px -510px;
	background-repeat:no-repeat;
}

/* --------------------------------------------------
	7. footer
-------------------------------------------------- */

#pagetop{
	clear:both;
	text-align:right;
}
#footer{
	clear:both;
	margin-top:10px;
	height:100px;
	margin:0 auto;
}
#footer p{
	line-height:1;
	padding-top:8px;
	color:#005A8C;
	font-size:9pt;
}

/* --------------------------------------------------
	8.カレンダー
-------------------------------------------------- */

.calendar{
	overflow:hidden;
}
table.cal{
	margin:0 auto;
	border-collapse:collapse;
	border:none;
	text-align:center;
}

table.cal caption{
	font-weight:bold;
	color:#005A8C;
}

table.cal td{
	text-align:center;
}

table.cal th.sun,
table.cal th.hol,
table.cal td.sun,
table.cal td.hol{color:#C1272D;}

table.cal th.sat,
table.cal td.sat{color:#009FE8;}

table.cal td.light{background-color:#BEDCDC;}
table.cal td.closed{background-color:#DDDDDD;}


/* --------------------------------------------------
	9. 共通設定
-------------------------------------------------- */

table.hyo {
	border:#437BB4 solid 2px;
	width:100%;
}

.hyo td{
	border:#ccc solid 1px;
	padding:0px 8px;
}
.hyo th{
	border-bottom:#ccc solid 1px;
	padding:0px 8px;
	background:#437BB4;
	color:#FFF;
	text-align:center;
}

ul.b_maru{
	border:none;
}

ul.b_maru li{
	list-style:none;
	background-image:url(../../img/content_icon01.gif);
	background-repeat:no-repeat;
	background-position: 2px 6px;
	padding-left: 1em;

}



ul.arrow li{
	list-style:none;
	background-image:url(../../../img/arror.gif);
	background-repeat:no-repeat;
	background-position:70px 3px;
}
ol.nini{
	list-style:none;
	text-indent:-2em;
	margin-left:2em;
}
dl.hyo60 dt ,dl.hyo80 dt , dl.hyo100 dt , dl.hyo120 dt{float:left;clear:both;}
dl.hyo60 dd{padding-left:60px;}
dl.hyo80 dd{padding-left:80px;}
dl.hyo100 dd{padding-left:100px;}
dl.hyo120 dd{padding-left:120px;}

dl.footnote dt{float:left;clear:left;}
dl.footnote dd{padding-left:1.5em;}

.floatleft{	float:left;}
.floatright{float:right;}
.aligncenter{margin:0 auto;}
.floatleft10{float:left;margin-left:10px;}
.clear{	clear:both;}

.ml5{margin-left:5px;}
.ml10{margin-left:10px;}
.ml15{margin-left:15px;}
.ml20{margin-left:20px;}
.ml30{margin-left:30px;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.mr15{margin-right:15px;}
.mr20{margin-right:20px;}
.mr30{margin-right:30px;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.border{border:1px solid #666;}

.kadomaru {
   border-radius: 5px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border: 1px #666 solid;
   padding:3px;
   margin:10px;
}
.kadomarub {
   border-radius: 10px;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border: 2px #005A8C solid;
   padding:15px;
}
.kadomarud {
   border-radius: 1px;
   -moz-border-radius: 20px;
   -webkit-border-radius: 20px;
   border: 1px #666 solid;
   padding:10px;
   margin-top:20px;
   box-shadow: 3px 2px 3px rgba(0, 0, 0, .4);
}

.u_line{text-decoration:underline;}
.u_line2{line-height:150%;border-bottom:double #666 3px;}
.u_lined{border-bottom: 3px dotted #E5E5E5; margin-bottom:10px;}

.indent{text-indent:1em;}
.m_indent{text-indent:-1.0em; padding-left:1.0em}
.m2_indent{text-indent:-1.5em; padding-left:1.5em;}
.m3_indent{text-indent:-2.0em; padding-left:2.0em;}

.right{text-align: right;}
.left{text-align:left;}
.center{text-align:center;}
.aligncenter{margin:0 auto;width:300px;}
.let{letter-spacing:1em;}
.lets{letter-spacing:-2px;}
.bold{font-weight:bold;}
.smartimg{width:100%}
.delete{display:none;}

/* color */
.red{color:#f00;}
.green{color:#080;}
.blue{color: #0646b1;}
.white{color:#FFF;}

/* font size */
.small{font-size: 70%;}
.large{font-size: 120%;}
.small2{font-size: 90%;}

table.yoyakutable{display: block;
		width: auto;
		overflow-x: auto;
	white-space: nowrap;
border: none !important;}

/* -------------- THE button -------------- */
.button {
    position: relative;
    display: inline-block;
	text-decoration: none;
    width: 220px;
	padding:5px 10px;
	margin: 5px;
    cursor: pointer;
	border:#2166EF 1.5px solid;
    
    color:#FFF;
	background: #1a94d3;
	font-size:20px;
    text-decoration: none;
    font-weight: bold;
    border-radius: 10px;
	cursor: pointer;
    -webkit-box-shadow: 1px 3px 0 #005785,
						inset 0 1px 0 rgba(255, 255, 255, 0.8),
                    	inset 1px 0 0 rgba(255, 255, 255, 0.3),
                   	 	inset -1px 0 0 rgba(255, 255, 255, 0.3),
                   		 inset 0 -1px 0 rgba(255, 255, 255, 0.2);
	-moz-box-shadow: 1px 3px 0 #005785,
						inset 0 1px 0 rgba(255, 255, 255, 0.8),
                    	inset 1px 0 0 rgba(255, 255, 255, 0.3),
                   	 	inset -1px 0 0 rgba(255, 255, 255, 0.3),
                   		 inset 0 -1px 0 rgba(255, 255, 255, 0.2);
	box-shadow: 1px 3px 0 #005785,
						inset 0 1px 0 rgba(255, 255, 255, 0.8),
                    	inset 1px 0 0 rgba(255, 255, 255, 0.3),
                   	 	inset -1px 0 0 rgba(255, 255, 255, 0.3),
                   		 inset 0 -1px 0 rgba(255, 255, 255, 0.2);
	
	border: 1px solid #005785;
	

  }
.button:hover { 
	background-color: #bddbdb;
	background-image:none;
	text-decoration:none;
}
.button:active {
    box-shadow: none;
    top: 2px;
	background-color: #bddbd;
  }
.button_s{
	width:150px;
	height:30px;
	font:15px/1em ;
	font-weight: bold;
	text-align:center;
	padding:3px 0;
	margin:10px;
	}
