﻿/*////////////////////////////////////////
共通
////////////////////////////////////////*/

/*--------------
マウスオーバー時のみ画像透明化
--------------*/
a:hover img{
	opacity:0.7;
	-webkit-transition:opacity 0.2s linear;
}

body{
	background:#fff;
}

#pagetop {
  display: none;
  position: fixed;
  bottom: 10px;
  right: 10px;
  padding: 5px;
  cursor: pointer;
}

/*--------------
クリアフィックス
--------------*/
/* For modern browsers用 */
.cf:after{
	content: "";
	display: block;
	clear: both;
}

/* For IE 6/7用 */
.cf { zoom: 1; }


/* ////////////////////////////////////////
スマートフォン向けのスタイル：479px以下 
////////////////////////////////////////*/
@media screen and (max-width: 479px) {

header{
	width:100%;
	background:#fff;
	opacity:0.9;
}

/*スマートフォン用コンテンツフォーマット*/
p.s-container{
	border:1px solid #ccc;
	border-radius:10px;
	padding:10px;
	margin-top:30px;
	margin-bottom:30px;
}

/*h1*/
h1{
	margin-top:50px;
	margin-left:5px;
	font-size:70%;
	border-bottom:1px dotted #ccc;
}


/*ロゴ・コピー・TEL*/
	#header-inner {
		width:94%;
		height:20px;
		padding: 15px 5px 10px;
	}

	p#tagline a{
		color:#729669;
	}

	p#tagline img {
		float:left;
		width:100px
	}

	div#menu{
		display:none;
	}



/*ヘッダー右コンテナ*/
div#header-r-container{
	display:none;
}

/*共通中央寄せ*/
.base-center{
	width: 100%;
}


/*アコーディオン*/
	#accordion{
	z-index: 9999; /*すべたの要素の一番上に表示するためレイヤーを9999とした*/
	position: fixed; /*絶対位置への配置となるのはabsoluteと同じだが、スクロールしても位置が固定できる*/
	top: 0;
	left: 0;
	width:100%;
	background:#fff;
	font-size:70%;
	}

	#accordion h2{
		cursor:pointer;
		background: url(../images/plus.png) no-repeat 90% center;
		font-size:90%;
		border:solid 1px #ccc;
		width:100%;
		margin-top:0px;
		margin-bottom:0px;
		padding:10px;
	}

	#accordion h2.active{
		background-image: url(../images/minus.png);
	}

	#accordion h2.over {
		background-color: #BEF3FC;
	}

	#accordion ul{
		display:none;
		margin:0; 
		font-size:90%;
		border:solid 1px #ccc;
		border-radius: 7px;
		width:90%;
		margin-left:auto;
		margin-right:auto;
		margin-top:20px;
		padding:10px;
	}

	#accordion ul li{
		border-bottom:1px dotted #ccc;
		padding:3px 3px 3px 7px;
	}

	li.accordion-title{
		background:#BEF3FC;
		padding-left:10px !important;
	}


/*----
メインのスライド画像はtop-mainvisual.css内のcssで調整している
---*/


/*leftペイン*/
div#right-container h3{
	margin-top:30px;
}

div#right-inner h4{
	color:#3FB3EA;
	margin-top:15px;
	margin-bottom:15px;
}

div#right-inner p{
	margin-bottom:20px;
}

p.more{
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid #ccc;
}

p#s-contact{
	width:246px;
	margin-left:auto;
	margin-right:auto;
	margin-top:20px;
}



/*フッター（下要素）*/

div#fnav{
	width:95%;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:50px;
	margin-top:30px;
}

div#fnav ul li{
	background:#fff;
	height: 47px;
	line-height: 47px;
	border-bottom:1px solid #ccc;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
	border-top:1px solid #fff;
}

div#fnav ul li a{
	text-decoration:none;
	font-weight:bold;
	display: block;
	background:url(../images/sub-arrow.png) no-repeat right center;
	padding-left:25px;
	margin-left:5px;
	margin-right:10px;
}

div#fnav ul li#content-top{
	border-top:1px solid #ccc;
	-webkit-border-top-left-radius: 15px;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-bottom-right-radius: 0px;
	-webkit-border-bottom-left-radius: 0px;
}

div#fnav ul li#content-bottom{
	-webkit-border-top-left-radius: 0px;
	-webkit-border-top-right-radius: 0px;
	-webkit-border-bottom-right-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
}



}




/*////////////////////////////////////////
PC向けのスタイル：769px～960px 
////////////////////////////////////////*/
@media only screen and (min-width: 481px) {

/*共通中央寄せ*/
.base-center{
	width: 950px;
	margin-left:auto;
	margin-right:auto;
}

body{
	background:url(../images/header-bg.png) repeat-x left top;
	font-size:90%;
}


div#h1-conatiner{
	background:#13B4EE;
	color:#fff;
	margin-bottom:10px;
}

h1{
	width: 950px;
	margin-left:auto;
	margin-right:auto;
	font-size:80%;
}

div#gnav nav ul li{
	width:160px;
}



header#head-container{
}


#gnav-btn {
	display :none;
}


#header-inner {
	height:70px;
}

/*ヘッダー左コンテナ*/
div#header-l-container{
	float:left;
	margin-top:0px;
}


/*ヘッダー右コンテナ*/
div#header-r-container{
	float:right;
}

div#header-r-container p{
	float:left;
	margin-left:15px;
}

div#header-r-container p a{
	background:url(../images/arrow.gif) no-repeat left center;
	padding-left:10px;
}

p#header-mail{
	float:left;
	margin-left:25px;
	margin-top:30px;
}

p#header-mail img{
	width:50px;
}

p#header-facebook{
	float:left;
	margin-left:20px;
	margin-top:30px;
}

p#header-facebook img{
	width:50px;
}

/*------------
グローバルメニュー
------------*/

/* =Menu
-------------------------------------------------------------- */

#menu { width: 950px; height: 51px; display: block; margin: 1em auto 0 auto ; }
#menu ul#nav { margin: 0; padding: 0;  }
#menu ul#nav li { list-style: none; display: block; margin: 0; padding: 0; float: left; text-indent: -99999px; height: 51px; }
#menu ul#nav li a { display: block; text-decoration: none; padding: 0; height: 51px; background-image: url("../images/menu.jpg"); background-repeat: no-repeat; }

#menu ul#nav li#bt01 { width: 56px; }
#menu ul#nav li#bt02 { width: 128px; }
#menu ul#nav li#bt03 { width: 128px; }
#menu ul#nav li#bt04 { width: 128px; }
#menu ul#nav li#bt05 { width: 127px; }
#menu ul#nav li#bt06 { width: 128px; }
#menu ul#nav li#bt07 { width: 128px; }
#menu ul#nav li#bt08 { width: 127px; }

#menu ul#nav li#bt01 a { background-position: 0 0; }
#menu ul#nav li#bt02 a { background-position: -56px 0; }
#menu ul#nav li#bt03 a { background-position: -184px 0; }
#menu ul#nav li#bt04 a { background-position: -312px 0; }
#menu ul#nav li#bt05 a { background-position: -440px 0; }
#menu ul#nav li#bt06 a { background-position: -567px 0; }
#menu ul#nav li#bt07 a { background-position: -695px 0; }
#menu ul#nav li#bt08 a { background-position: -823px 0; }

#menu ul#nav li#bt01 a:hover { background-position: 0 100%; }
#menu ul#nav li#bt02 a:hover { background-position: -56px 100%; }
#menu ul#nav li#bt03 a:hover { background-position: -184px 100%; }
#menu ul#nav li#bt04 a:hover { background-position: -312px 100%; }
#menu ul#nav li#bt05 a:hover { background-position: -440px 100%; }
#menu ul#nav li#bt06 a:hover { background-position: -567px 100%; }
#menu ul#nav li#bt07 a:hover { background-position: -695px 100%; }
#menu ul#nav li#bt08 a:hover { background-position: -823px 100%; }


div#accordion{
	display:none;
}

/*----
メインのスライド画像はtop-mainvisual.css内のcssで調整している
---*/

/*leftペイン*/
div#left-container{
	width:677px;
	float:left;
	margin-right:25px;
}


/*rightペイン*/
div#right-container h3{
	margin-top:30px;
}

div#right-inner h4{
	color:#3FB3EA;
	margin-top:15px;
	margin-bottom:15px;
}

div#right-inner p{
	margin-bottom:20px;
}

p.more{
	padding-bottom:20px;
	margin-bottom:20px;
	border-bottom:1px solid #ccc;
}


div#right-container{
	width:243px;
	float:left;
}


p#s-contact{
	width:246px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:20px;
}


/*footer*/

footer{
	background:url(../images/footerbkg.gif) repeat-x left top;
	width:100%;
	height:92px;
	padding-top:15px;
	margin-top:100px;
}

div#fnav{
	float:left;
	width:600px;
}

div#fnav ul li a{
	float:left;
	padding-right:15px;
	color:#333;
	font-size:60%;
}

p#footer{
	float:right;
	width:350px;
	font-size:60%;
}




}



