@charset "utf-8";

/* TOP PAGE ===========================*/
/* Last Updated:2011.3.22

/* BACKGROUND
---------------------------------------------*/

#top {
	overflow-x : hidden;
	background: url(../img/bg_back03.jpg) left top repeat-x;}

#top #header {height: 168px;}

/* CONTENTS
---------------------------------------------*/

#top #contents {
	padding-top: 26px;}
	
/* NEW WORKS
---------------------------------------------*/

h2 {height: 34px;}

/* forIE6 */
* html h2 {padding-bottom: 10px;}

.ttlja {margin-top: 10px;}

.ttlen {
	float: left;
	margin-top: 11px;
	margin-left: 14px;}


/* CONTENTS WRAP LAYOUT
---------------------------------------------*/

#wrap {clear: both;
}

#onelayout {clear: both;
	margin: 0 auto;
	width: 960px;}
	
#vespanavibox {clear: both;
	margin: 0 auto;
	width: 960px;}
	
#leftbox {
	float: left;
	width: 360px;}

#rightbox {
	float: right;
	width: 600px;}
	
#eventbox {clear: both;
	margin: 0 auto;
	width: 960px;}
	
/* vespagnavi
---------------------------------------------*/

#venavi {clear: both;
	margin: 0 auto;
	z-index: 1000;}

#venavi li {
	float: left;
	width: 187px;
	text-indent: -9999px;}

#venavi li em a {
	display: block;
	overflow: hidden;
	height:0 !important;
	height /**/: 43px;
	padding-top: 43px;
	background-image: url(../img/vespanavi.jpg);}
	
.vegnv01 a {background-position: 0 0;}
.vegnv02 a {background-position: -187px 0;}
.vegnv03 a {background-position: -374px 0;}
.vegnv04 a {background-position: -561px 0;}
.vegnv05 a {background-position: -748px 0;}


.vegnv01 a:hover {background-position: 0 -43px;}
.vegnv02 a:hover {background-position: -187px -43px;}
.vegnv03 a:hover {background-position: -374px -43px;}
.vegnv04 a:hover {background-position: -561px -43px;}
.vegnv05 a:hover {background-position: -748px -43px;}


/* BREADCRUMBS
---------------------------------------------*/
/* パンくずリスト */

#breadcrumbs {
	font-weight: bold;
	color: #00000;
	line-height: 65px;
}
#breadcrumbs a:link,
#breadcrumbs a:visited {
	color: #00000;
	
}
#breadcrumbs a:hover,
#breadcrumbs a:active {
	color: #008bc0;
	
}

* greet LAYOUT
---------------------------------------------*/
/* あいさつ */

#greet_box {clear: both;
	margin: 0 auto;
	margin-top: 50px;
	width: 960px;
}

#greet_box h2{
	margin-bottom: 35px;
}
	
#greet_box a {
	text-decoration: underline;}

#greet_box a:hover {
	text-decoration: none;}


#greet_box p {
	margin: 0 5px 0.5em 2px;
	text-align:justify;
			text-justify:distribute;}

#greet_box p span{
	color: #086B37;}


.greet p strong {
	font-size: 16px;
	color: #086B37;
	padding: 0 0.5em;}

#greetwaku {
	margin: 25px 3px 40px 0;
	padding: 15px 10px 10px 15px;
	background-color: #e4e2dc; }

#greetwaku li {
	margin-bottom: 0.5em;}

#greetwaku li a {
	text-decoration: underline;}

#greetwaku li a:hover {	text-decoration: none;}


/* miryoku LAYOUT
---------------------------------------------*/
#miryoku_box {clear: both;
	margin: 0 auto;
	width: 960px; }
	
#miryoku_box p {
	margin: 0 5px 0.5em 2px;
	text-align:justify;
			text-justify:distribute;}
	
#miryoku_box01 {
	width: 960px;
	height: 445px;
	background-image: url(../img/miryoku_01.jpg) ;
	background-repeat: no-repeat; }
	
#miryoku_box02 {
	width: 960px;
	height: 326px;
	background-image: url(../img/miryoku_02.jpg) ;
	background-repeat: no-repeat; }
		
#miryoku_box03 {
	width: 960px;
	height: 267px;
	background-image: url(../img/miryoku_03.jpg) ;
	background-repeat: no-repeat; }
		
#miryoku_box04 {
	width: 960px;
	height: 331px;
	background-image: url(../img/miryoku_04.jpg) ;
	background-repeat: no-repeat; }
		
#miryoku_box05 {clear: both;
	width: 960px;
	height: 487px;
	background-image: url(../img/miryoku_05.jpg) ;
	background-repeat: no-repeat; }
	
.miryoku_box01 {
	float: right;
	width: 480px; }
	
.miryoku_box02 {clear: both;
	float: left;
	width: 433px; }

.miryoku_box03 {clear: both;
	float: right;
	width: 412px; }

.miryoku_box04 {clear: both;
	float: left;
	width: 545px; }
	
.miryoku_box05 {
	width: 860px;
	padding-top: 62px;
	padding-left: 45px;}
	
/* shiru LAYOUT
---------------------------------------------*/
#shiru_box {clear: both;
	margin: 0 auto;
	margin-top: 50px;
	width: 960px; }

#shiru_box p {
	margin: 0 5px 0.5em 2px;
	text-align:justify;
			text-justify:distribute;}

#shiru_box01 {
	width: 960px;
	height: 370px;
	background-image: url(../img/shiru_01.jpg) ;
	background-repeat: no-repeat; }	
	
.shiru_box01 {
	float: right;
	padding-top: 20px;
	width: 537px; }	

/* mentenance LAYOUT
---------------------------------------------*/
#mente_box {clear: both;
	margin: 0 auto;
	margin-top: 50px;
	width: 960px; }

#mente_box p {
	margin: 0 5px 0.5em 2px;
	text-align:justify;
			text-justify:distribute;}
			
.mente_mozi01 {
	padding-top: 20px;
	font-weight:bold;
	color: #0147a9;
	margin: 0 5px 0.5em 2px;
	font-size: 18px;}
#mente_box01 {
	width: 960px;
	height: 100%;
}	
	
.mente_box01 {
	float: right;
	padding-top: 20px;
	width: 537px; }	

.bar {
  display:block;
  width: 100%;
  height: 1px;
  border: 0;
  border-top: 1px dashed #cccccc;
}	

/* list LAYOUT
---------------------------------------------*/
#list_box {clear: both;
	margin: 0 auto;
	margin-top: 50px;
	width: 960px; }
	
#list_box p {
	margin: 0 5px 0.5em 2px;
	font-size: 12px;
	text-align:justify;
			text-justify:distribute;}
	
.list_box01 {
	float: left;
	width: 220px;
	height: 400px; 
	margin-top: 20px;}
	
.list_box02 {
	float: left;
	width: 220px;
	height: 400px; 
	margin-top: 20px;
	margin-left: 20px;}
	
/* CONTACT LAYOUT
---------------------------------------------*/
/* お問い合わせ */

#contact_box {clear: both;
	margin: 0 auto;
	margin-top: 50px;
	width: 960px;
}

#contact_box h2{
	margin-bottom: 35px;
}
	
#contact_box a {
	text-decoration: underline;}

#contact_box a:hover {
	text-decoration: none;}


#contact_box p {
	margin: 0 5px 0.5em 2px;
	text-align:justify;
			text-justify:distribute;}

#contact_box p span{
	color: #086B37;}


.contact p strong {
	font-size: 16px;
	color: #086B37;
	padding: 0 0.5em;}

#contatwaku {
	margin: 25px 3px 40px 0;
	padding: 15px 10px 10px 15px;
	background-color: #e4e2dc; }

#contatwaku li {
	margin-bottom: 0.5em;}

#contatwaku li a {
	text-decoration: underline;}

#contatwaku li a:hover {	text-decoration: none;}

.form {
	width: 672px;
	font-size: 12px;
	margin-top: 8px;
	letter-spacing: 1px;
	border-collapse: collapse;}

.form th,.form td {
	padding: 15px 10px 15px 10px;
	border-bottom: 1px solid #e4e2dc;}

.form th {
	width: 150px;
	text-align: left;
	vertical-align: top;
	font-size: 14px;
	font-weight: normal;
	background: url(../img/arrow.gif) left 20px no-repeat;}

.form th span {color: #086B37;}
.form td span {
	color: #333333;
	margin-left: 1em;
	font-size: 10px;}

.form td {line-height: 1.8em;}

.input,.input2,#msgarea {
	padding: 1px 2px;	font-size: 14px;
	line-height: 1.8em;
	border: 1px solid #ccc;
	background-color: #f2f1ee;
	font-family: Meiryo, "メイリオ", Verdana, "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴ Pro W3", Osaka, "MS P Gothic", "ＭＳ Ｐゴシック", sans-serif;
}

.input {width: 250px;}
.input2 {width: 400px;}


#msgarea {
	width: 540px;
	height: 128px;}

#submit {
	margin-top: 15px;
	padding-bottom: 25px;
	text-align: center;}

#submit img {
	margin-top: 1px;
	vertical-align: top;}

.errormsg {
	font-weight: bold;
	font-size: 14px;
	color: #900;
	margin: 40px 0 0 10px;
	padding-bottom: 40px;}

.backbtn {margin-left: 10px;}

.error {height: 663px;}

.backtop {margin: 40px 0 0 10px;}


/* LEFTBOX
---------------------------------------------*/

#topbnr li {margin-bottom: 4px;}

   /* バナー1 */

   ul.imagelinks a {
      display: block;
      width: 306px;
      height: 190px;
      text-indent: -5000px;
   }

   ul.imagelinks a:hover {
      background-position: top right;
   }

   /* (1) ベスパ */
   ul.imagelinks a.bunner01 {
      background-image: url(../img/btn01.jpg);
   }

   /* バナー2*/

   ul.imagelinks02 a {
      display: block;
      width: 306px;
      height: 95px;
      text-indent: -5000px;
   }

   ul.imagelinks02 a:hover {
      background-position: top right;
   }

   /* (1) トライアンフ広島 */
   ul.imagelinks02 a.bunner02 {
      background-image: url(../img/btn02.jpg);
   }


#underbnr li {margin-bottom: 4px;}


   /* バナー3 */

   ul.imagelinks03 a {
      display: block;
      width: 306px;
      height:310px;
      text-indent: -5000px;
   }

   ul.imagelinks03 a:hover {
      background-position: top right;
   }

   /* (1) th project */
   ul.imagelinks03 a.bunner03 {
      background-image: url(../img/btn03.jpg);
   }

	
/* RIGHTBOX
---------------------------------------------*/

#infobox {
	width: 600x;
}

#infobox h3{
	margin-bottom: 25px;
}

#newsbox {
	width: 600x;
}

#newsbox h3{
	margin-top: 15px;
	margin-bottom: 5px;
}



/* NEWS */
#newsbox ul{
	list-style:none;
	width:600px;
	font-size:12px;
	color:#88D6FB;
}

#newsbox ul li{
	list-style:none;
	width:590px;
	zoom:1;
	line-height:2.3em;
	margin: 0px;
	padding: 0px;
	text-align:left;
	color:#000000;
	font-family:"ＭＳ Ｐゴシック","Osaka","Arial,sans-serif","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3";
	border-color:#666666;
	border-style:dotted;
	border-width:0px;
	border-bottom-width:1px;
}

#newsbox ul li a{
	color:#666666;
	text-decoration:none;
}

#newsbox ul li a:hover{
	color:#ccc;
	text-decoration:underline;
}

/* VespaBOX
---------------------------------------------*/

.st-accordion{
    width:100%;
    min-width:270px;
    margin: 0 auto;
}
.st-accordion ul li{
    height: 36px;
    overflow: hidden;
}
.st-accordion ul li:first-child{
    border-top:none;
}
.st-accordion ul li > a{
    font-family: 'Josefin Slab',Georgia, serif;
    text-shadow: 1px 1px 1px #fff;
    font-size: 46px;
    display: block;
	position: relative;
    line-height: 100px;
	outline:none;
    -webkit-transition:  color 0.2s ease-in-out;
	-moz-transition:  color 0.2s ease-in-out;
	-o-transition:  color 0.2s ease-in-out;
	-ms-transition:  color 0.2s ease-in-out;
	transition:  color 0.2s ease-in-out;
}
.st-accordion ul li > a span{
	background: transparent url(vespa/img/down.png) no-repeat center center;
	text-indent:-9000px;
	width: 26px;
	height: 14px;
	position: absolute;
	top: 50%;
	right: -26px;
	margin-top: -7px;
	opacity:0;
	-webkit-transition:  all 0.2s ease-in-out;
	-moz-transition:  all 0.2s ease-in-out;
	-o-transition:  all 0.2s ease-in-out;
	-ms-transition:  all 0.2s ease-in-out;
	transition:  all 0.2s ease-in-out;
}
.st-accordion ul li > a:hover{
    color: #1693eb;
}
.st-accordion ul li > a:hover span{
	opacity:1;
	right: 10px;
}
.st-accordion ul li.st-open > a{
    color: #1693eb;
}
.st-accordion ul li.st-open > a span{
	-webkit-transform:rotate(180deg);
	-moz-transform:rotate(180deg);
    transform:rotate(180deg);
	right:10px;
	opacity:1;
}
.st-content{
    padding: 5px 0px 30px 0px;
}
.st-content p{
    font-size:  16px;
    font-family:  Georgia, serif;
    font-style: italic;
    line-height:  28px;
    padding: 0px 4px 15px 4px; 
}


/* AJAX
---------------------------------------------*/

/* forIE6 */
*html .sub-list li span { margin-left: -2em;}