@charset "Shift_JIS";

@import "base.css";

#topBanner{
height:300px; 		/* flash スクリーンの高さ調整　315px  */
margin:2px;
padding:0;
background-image:url(../image/新年2020.jpg) ;   /* 旧版　東京01.jpg　*/
}


/* ----  スライドショー用      ------------------------------------------------------------- */

/* 表示画面 */
#stage {
	position: relative;	
	max-width: 700px;   		 /* 550　　*/
	/* top:0;	*/		 /*  追加　*/
	margin: 0 auto;		
	overflow: hidden;
}
/*全ての写真を水平一列に格納したdiv、#photosに,
スライドショーの animation を設定*/
#photos {
	position:absolute;
	top:0; 
	width:100%;
	animation: imgPassToLeft0 40s infinite;			/* 元は　30s　=　5枚  *  6sec   ⇒　40sec　=5枚　*　8secへ */
	-webkit-animation: imgPassToLeft0 40s infinite;
}
/*各写真の並び位置を設定
#photo1, #photo2, #photo3, #photo4, #photo5 */
#photo0 { left:  0%; opacity:0.8;}
#photo1 { left:100%; opacity:0.8;} 
#photo2 { left:200%; opacity:0.9;} 
#photo3 { left:300%; opacity:0.8;}
#photo4 { left:400%; opacity:0.8;}
#photo5 { left:500%; opacity:0.8;}
#photo6 { left:600%; }
.pic { position:absolute;top:0;width:100%; }
/*写真サイズを可変に*/
.pic img { width:100%; }

/* 全てのラジオボタンを非表示に */
#back1,#back2,#back3,#back4,#back5,#next1,#next2,#next3,#next4,#next5{
	display:none;
}
/*送りボタン文字（＜、＞）の設定*/
.b_left span, .b_right span {
	position: absolute;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 50px;
	font-weight: bold;
	opacity:0;		/*  0  */
	top: 40%;
	color:#ffffff;    	/* #EEE  */
}
.b_left span {
	left: 3%;		/* 3%  */	
}
.b_right span {
	left: 90%;		/* 90% */
}
/*ボタン文字hover時の設定*/
.pic:hover > label div span {
	opacity:1;
	color:#eee000;      /* #EEE  */
}
.pic label div span:hover {
	color:#f00000;      /* #f00  */
	cursor:pointer;
}

/* 各送りボタンクリック時のanimation設定 */
#next1:checked ~ #photos {
	animation: imgPassToLeft1 40s infinite;			/* 元は、30s  = 5 枚　*　6sec  　⇒　40sec　=　5枚　*　8sec間隔へ　以下同じ　*/	
	animation-delay: -6.4s;					/* -4.8s 　　ここは注意：微妙な調整必要　*/
	-webkit-animation: imgPassToLeft1 40s infinite;		/* 30s */
	-webkit-animation-delay: -6.4s;				/* -4.8s */
}
#next2:checked ~ #photos {
	animation: imgPassToLeft2 40s infinite;
	animation-delay: -14.4s;				/*  -10.8s */
	-webkit-animation: imgPassToLeft2 40s infinite;
	-webkit-animation-delay: -14.4s;			/*  -10.8s */
}
#next3:checked ~ #photos {
	animation: imgPassToLeft3 40s infinite;
	animation-delay: -22.4s;				/* -16.8s  */
	-webkit-animation: imgPassToLeft3 40s infinite;
	-webkit-animation-delay: -22.4s;			/* -16.8s  */
}
#next4:checked ~ #photos {
	animation: imgPassToLeft4 40s infinite;
	animation-delay: -30.4s;
	-webkit-animation: imgPassToLeft4 40s infinite;
	-webkit-animation-delay: -30.4s;
}
#next5:checked ~ #photos {
	animation: imgPassToLeft5 40s infinite;
	animation-delay: -38.4s;
	-webkit-animation: imgPassToLeft5 40s infinite;
	-webkit-animation-delay: -38.4s;
}
#back1:checked ~ #photos {
	animation: imgPassToRight1 40s infinite;
	animation-delay: -38.4s;
	-webkit-animation: imgPassToRight1 40s infinite;
	-webkit-animation-delay: -38.4s;
}
#back2:checked ~ #photos {
	animation: imgPassToRight2 40s infinite;
	animation-delay: -30.4s;
	-webkit-animation: imgPassToRight2 40s infinite;
	-webkit-animation-delay: -30.4s;
}
#back3:checked ~ #photos {
	animation: imgPassToRight3 40s infinite;
	animation-delay: -22.4s;
	-webkit-animation: imgPassToRight3 40s infinite;
	-webkit-animation-delay: -22.4s;
}
#back4:checked ~ #photos {
	animation: imgPassToRight4 40s infinite;
	animation-delay: -14.4s;
	-webkit-animation: imgPassToRight4 40s infinite;
	-webkit-animation-delay: -14.4s;
}
#back5:checked ~ #photos {
	animation: imgPassToRight5 40s infinite;
	animation-delay: -6.4s;
	-webkit-animation: imgPassToRight5 40s infinite;
	-webkit-animation-delay: -6.4s;
}
/* animation設定 */
@keyframes imgPassToLeft0 {
	0%  { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToLeft1 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToLeft2 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToLeft3 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToLeft4 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToLeft5 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@keyframes imgPassToRight1 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@keyframes imgPassToRight2 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@keyframes imgPassToRight3 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@keyframes imgPassToRight4 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@keyframes imgPassToRight5 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@-webkit-keyframes imgPassToLeft0 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft1 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft2 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft3 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft4 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToLeft5 {
	0% { left:-100%; }
	16% { left:-100%; }
	20% { left:-200%; }
	36% { left:-200%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-400%; }
	76% { left:-400%; }
	80% { left:-500%; }
	96% { left:-500%; }
	100% { left:-600%; }
}
@-webkit-keyframes imgPassToRight1 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@-webkit-keyframes imgPassToRight2 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@-webkit-keyframes imgPassToRight3 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@-webkit-keyframes imgPassToRight4 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}
@-webkit-keyframes imgPassToRight5 {
	0% { left:-500%; }
	16% { left:-500%; }
	20% { left:-400%; }
	36% { left:-400%; }
	40% { left:-300%; }
	56% { left:-300%; }
	60% { left:-200%; }
	76% { left:-200%; }
	80% { left:-100%; }
	96% { left:-100%; }
	100% { left:0%; }
}


/* ----  スライドショ―　修了　--------------------------------------------------------- */

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

#index_con{
color:#000000;
float:left;
/* background:url(../image/bg_center2.gif) top repeat-y #FFFFFF; */ 
width:800px;		/*   旧　760px　  */
}

/* -------------------------------------------- */
#LeftColumn{
float:left;
width:380px;		/*    旧 460px    */
padding:0px 4px 0px 0px;  /*  5 - 4 - 0 -10  */ 
}

#LeftColumn h2{
margin-top:0;		/* 10px  */
margin-bottom:0;	/* 10px  */

}

dl.topics{
margin-bottom:2em;
margin-right:10px;
font-size:80%;
}

dl.topics dt{
background-image:url(../image/r_arrow.gif);
background-repeat:no-repeat;
padding-left:20px;
padding-top:2px;
margin-top:0.3em;
margin-left:8px;
background-position:left;
vertical-align:middle;
margin-bottom:1px;
}

dl.topics dd{
margin-left:22px;
padding-bottom:3px;
border-bottom:1px dotted #330066;
}


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

#RightColumn{
float:right;
width:380px;		/*    旧 460px    */
padding:0px 4px 0px 0px;  /*  5 - 4 - 0 -10  */ 
}

#RightColumn h2{
margin-top:0;		/* 10px  */
margin-bottom:0;	/* 10px  */

}



/*  -----------------------ドロップダウンメニュー　（　Product照会の部分　）---------    */

.dropmenu{
     *zoom: 1;
      list-style-type: none;
      width: 800px;
      margin: 2px auto 5px;	/* 旧 5px auto 10px  */	
      padding: 0;
  }

   .dropmenu:before, .dropmenu:after{
         content: "";
         display: table;
  }

  .dropmenu:after{
        clear: both;
  }

  .dropmenu li{
       position: relative;
       width: 24.5%;		/* 分割数 5 * 19.6% = 98%  ⇒　分割数　4　へ */			
       float: left;
       margin: 0;		/* 0  */	
       padding: 1px;		/* 旧　0　*/
       text-align: center;
  }

  .dropmenu li a{
       display: block;
       margin: 0;
       padding: 15px 0 11px;
       background: #87ceeb;		/*  旧#8a9b0f  */
       color: #fff;
       font-size: 14px;
       line-height: 1;	
       text-decoration: none;
  }

.dropmenu li ul{
          list-style: none;
          position: absolute;
          z-index: 9999;
          top: 100%;
          left: 0;
          margin: 0;
          padding: 0;
  }

  .dropmenu li ul li{
         width: 100%;
  }

  .dropmenu li ul li a{
        padding: 13px 15px;
        border-top: 1px solid #f0ffff;  /*   旧7c8c0e */
        background: #4682b4;		/*   旧6e7c0e  */
        text-align: left;
  }

  .dropmenu li:hover > a{
        background: #4682b4;		/*   旧#6e7c0c   */
  }
  .dropmenu li a:hover{
        background: #0000ff;		/*   旧#616d0b   */
  }


  #normal li ul{
       display: none;
  }
  #normal li:hover ul{
        display: block;
  }

/*  -----------------------ドロップダウンメニュー　(会社概要　ほか)------------------    */

.dropmenu2{
     *zoom: 1;
      list-style-type: none;
      width: 800px;
      margin: 5px auto 0px ;   /*  5px auto 10px   */
      padding: 0;
      float:left;
  }

   .dropmenu2:before, .dropmenu2:after{
         content: "";
         display: table;
  }

  .dropmenu2:after{
        clear: both;
  }

  .dropmenu2 li{
       position: relative;
       width: 24.5%;		/* 分割数4で　本来は25％    */
       float: left;
       margin: 0;
       padding: 1px;		/*  旧　0　　*/
       text-align: center;
  }

  .dropmenu2 li a{
       display: block;
       margin: 0;
       padding: 15px 0 11px;			
       background: #dda0dd;			/*  #8a9b0f */
       color: #fff;
       font-size: 14px;
       line-height: 1;
       text-decoration: none;
  }

.dropmenu2 li ul{
          list-style: none;
          position: absolute;
          z-index: 9999;
          top: 100%;
          left: 0;
          margin: 0;
          padding: 0;
  }

  .dropmenu2 li ul li{
         width: 100%;
  }

  .dropmenu2 li ul li a{
        padding:  13px 15px;			/*  13px 15px   */
        border-top: 1px solid #f0ffff;		/* #7c8c0e  */
        background: #9370db;			/* #6e7c0c  */
        text-align: center;
  }

  .dropmenu2 li:hover > a{
        background: #9370db;			/* #6e7c0c  	*/
  }
  .dropmenu1 li a:hover{
        background: #8a2be2;			/* #616d0b  */
  }


  #normal2 li ul{
       display: none;
  }
  #normal2 li:hover ul{
        display: block;
  }