﻿@charset "UTF-8";

/* ヘッダ全体 */
#header_bd {
   border-top: solid 5px #1f38bf;
   z-index: 90;
   font-size: 14px;
}

#header_sp {
   z-index: 10;
   top: 0;
   left: 16px;
   border-bottom: solid 1px #1f38bf;
   margin-top: -10px;
}

h1, h2 {
   margin-top: 20px;
   margin-bottom: 10px;
   text-align:left;
}

/* ヘッダ上部 */
#header_top {
   position: relative;
   height: 80px;
}

/* ヘッダ画像 */
#header_image {
   top: 0;
   left: 0;
   position: absolute;
   width: 218px;
}

/* ヘッダ上部のコメント＆お問い合わせ*/
#title_info {
   width: 98%;
   top: 0;
   right: 0;
   position: absolute;
}

/* お問い合わせ */
a#ask_sp {
   text-indent: -9999px;
   display: block;
   width: 100px;
   height: 27px;
   background-image: url("../sp_obj/toiawase3.gif");
   position: absolute;
   top: 16px;
   color: #FFF;
   right: 0px;
}
/*
a#ask_sp:hover {
	background-image: url("../images/otoiawase_on.gif");
}
*/

/* コメント */
#title_comment {
   position: absolute;
   left: 25px;
   top: 35px;
}

/* ヘッダ下部 */
#header_bottom {
   height: 48px;
   width: 98%;
   position: relative;
}

/* メニュー部 */

/* メニューアンダーバー */
#menu_underbar_sp {
   z-index: 10;
   width: 100%;
   height: 10px;
   background: url("../images/line4.gif") repeat-x top left;
}


/* メニューボタン */

/* トップ */
#home {
   position:absolute;
   top:-2px;
   left:5px;
}


/* 東京発 */
#tokyo {
   background: transparent url("../images/btn_tokyo_off.gif") no-repeat;
   width: 150px;
}

   #tokyo:active, #tokyo:hover, em#tokyo {
      background: transparent url("../images/btn_tokyo_on.gif") no-repeat;
   }

/* 大阪発 */
#osaka {
   background: transparent url("../images/btn_osaka_off.gif") no-repeat;
   width: 150px;
}

   #osaka:active, #osaka:hover, em#osaka {
      background: transparent url("../images/btn_osaka_on.gif") no-repeat;
   }

/* 名古屋発 */
#nagoya {
   background: transparent url("../images/btn_nagoya_off.gif") no-repeat;
   width: 150px;
}

   #nagoya:active, #nagoya:hover, em#nagoya {
      background: transparent url("../images/btn_nagoya_on.gif") no-repeat;
   }

/* 九州発 */
#kyushu {
   background: transparent url("../images/btn_kyushu_off.gif") no-repeat;
   width: 150px;
}

   #kyushu:active, #kyushu:hover, em#kyushu {
      background: transparent url("../images/btn_kyushu_on.gif") no-repeat;
   }

/* 北海道発 */
#hokkaido {
   background: transparent url("../images/btn_hokkaido_off.gif") no-repeat;
   width: 150px;
}

   #hokkaido:active, a#hokkaido:hover, em#hokkaido {
      background: transparent url("../images/btn_hokkaido_on.gif") no-repeat;
   }

/* その他地域発 */
#sonota {
   width: 150px;
   background: transparent url("../images/btn_sonota_off.gif") no-repeat;
}

   #sonota:active, #sonota:hover, em#sonota {
      background: transparent url("../images/btn_sonota_on.gif") no-repeat;
   }

/* オプショナルツアー */
#optional {
   width: 150px;
   background: transparent url("../images/btn_optional_off.gif") no-repeat;
}

   #optional:active, #optional:hover, em#optional {
      background: transparent url("../images/btn_optional_on.gif") no-repeat;
   }

/* 格安ホテル */
#hotel {
   width: 85px;
   background: transparent url("../images/btn_hotel_off.gif") no-repeat;
}

   #hotel:active, #hotel:hover, em#hotel {
      background: transparent url("../images/btn_hotel_on.gif") no-repeat;
   }

/* ツアー検索 */
#kensaku {
   width: 150px;
   background: transparent url("../images/btn_kensaku_off.gif") no-repeat;
}

   #kensaku:active, #kensaku:hover, em#kensaku {
      background: transparent url("../images/btn_kensaku_on.gif") no-repeat;
   }

/*** 以下、その他発のサブメニュー表示対応分　（2010.05.10 追加）***/

/* IE6対策 */
.menu_list table {
   border-collapse: collapse;
   width: 0;
   height: 0;
   position: absolute;
   top: 0;
   left: 0;
}

/* IE6以下ならメインタブの a:hover でサブメニュー表示 */
.menu_list a:hover {
   visibility: visible;
   position: relative;
   z-index: 200;
}

/* IE7以上ならメインタブの li:hover でサブメニュー表示 */
.menu_list li:hover {
   position: relative;
   z-index: 200;
}

/* 非hover時はサブメニューを表示させない */
.menu_list ul {
   position: absolute;
   left: -9999px;
   top: -9999px;
   width: 0;
   height: 0;
   margin: 0;
   padding: 0;
   list-style: none;
}

   /* 以下はサブメニューのスタイル定義 */
   .menu_list ul.sub1 {
      width: 95px;
   }

.sub1 li a {
   text-indent: 0px;
}

.sub1 span {
   font-size: 13px;
   color: gray;
}

.sub1 :hover span {
   color: #2550B9;
   font-weight: bold;
}

.menu_list :hover ul {
   left: -23px;
   top: 28px;
   background: #fafafa;
   padding: 3px;
   border: 1px solid #3a93d2;
   border-width: 0 1px 1px;
   white-space: nowrap;
   height: auto;
   z-index: 300;
}

   .menu_list :hover ul li {
      display: block;
      height: 20px;
      position: relative;
      font-weight: normal;
      width: auto;
   }

      .menu_list :hover ul li a {
         display: block;
         font-size: 11px;
         height: 20px;
         line-height: 20px;
         width: auto;
         padding: 0 10px;
         color: #000;
         text-decoration: none;
      }

     .emp {
        background: #006699;
        color: #fff;
     }



html {
   height: 100%;
   width: 100%;
}


body {
   font-family: 'メイリオ';
   height: 100%;
   width: 100%;
   margin: 0;
   line-height:1.6; 
}

h1, h2 {
   padding: .5em .75em .3em .74em;
   background: -webkit-linear-gradient(top, #2278bf 0%, #0059a8 100%);
   background: linear-gradient(to bottom, #2278bf 0%, #0059a8 100%); 
   /* background: linear-gradient(to bottom, #69b4e6 0%, #3498db 100%); */
   color: #fff;
   text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
   font-size: 16px;
}

h3 {
   font-size: 12px;
   font-weight:normal;
   display:inline;
}

h4 {
   font-size: 12px;
   font-weight:normal;
   display:inline;
}

.menu {
   width: 100%;
   padding: 0;
   margin: 0;
   list-style-type: none;
}

   .menu li {
      float: left;
      padding: 0;
      margin: 0;
      text-align: center;
   }

   .div2 {
      width:50%;
   }

   .div3 {
      width:33.33%;
   }

      .menu li a {
         width: auto;
         color: #006699;
         Font-size: 14px;
         font-weight: bold;
         padding: 10px 0;
         text-decoration: none;
         display: block;
         background: #666;
         background-image: -moz-linear-gradient(top, #F2F9FE 0%, #d6f0fd 50%, #c3e3fa 50%, #d6f0fd 100%);
         background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #F2F9FE), color-stop(0.50, #d6f0fd), color-stop(0.50, #d6f0fd), color-stop(1, #d6f0fd));
         border-left: 1px solid #444;
         box-shadow: 1px 0px 0px rgba(120,120,120,0.3) inset, -1px 0px 0px rgba(120,120,120,0.3) inset, 0px 1px 1px rgba(0,0,0,0.1) inset, 0px -1px 1px rgba(0,0,0,0.3) inset, 0px 1px 3px #666;
      }

      #emp {
         background: #006699;
         color: #ffffff;
      }

      .menu li ul {
         list-style: none;
         position: relative;
         top: 100%;
         left: 0;
         margin: 0;
         padding: 0;
         border-radius: 0 0 3px 3px;
      }



.menu2 {
   width: 100%;
   padding: 0;
   margin: 0;
   list-style-type: none;
   text-align: center;
}

   .menu2 li {
      width: 100%;
      float: left;
      padding: 0;
      margin: 0;
      text-align: center;
   }

   .sbt_1{
	width:100%;
	height:40px;
	background-color:#e83f22;
	border:none;
	color:#fff;
	font-size:13px;
	font-weight:700;
	text-align:center;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	
}
.sbt_1:hover{
	background-color:#761c0c !important;
	color:#fff;
}

.css_btn_class {
	font-size:18px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	border:1px solid #eeb44f;
	padding:3px 6px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #ffc477 5%, #fb9e25 100% );
	background:-ms-linear-gradient( top, #ffc477 5%, #fb9e25 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc477', endColorstr='#fb9e25');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #ffc477), color-stop(100%, #fb9e25) );
	background-color:#ffc477;
	color:#ffffff;
	display:inline-block;
	text-shadow:0px 0px 0px #cc9f52;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #fce2c1;
 	-moz-box-shadow:inset 1px 1px 0px 0px #fce2c1;
 	box-shadow:inset 1px 1px 0px 0px #fce2c1;
}.css_btn_class:hover {
	background:-moz-linear-gradient( center top, #fb9e25 5%, #ffc477 100% );
	background:-ms-linear-gradient( top, #fb9e25 5%, #ffc477 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fb9e25', endColorstr='#ffc477');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #fb9e25), color-stop(100%, #ffc477) );
	background-color:#fb9e25;
}.css_btn_class:active {
	position:relative;
	top:1px;
}
/* This css button was generated by css-button-generator.com */



/* エラーメッセージ */
.err_msg {
    font-size: 13px;
    color: #ff0000
}

/* 入力制限等 */
.inNum {
    ime-mode: disabled;
}


/* フライトコメント */
.flight_comment {
    font-size:14px;
}

/* 移動日 非活性 */
.order_text_date_disabled  {
    font-family: "メイリオ", "MS PGothic", sans-serif;
    font-size:16px;
    border: 0;
    background-color:transparent;
    text-align: left;
    background:none;
    color:deeppink;
}


	.flow02 {
	    margin: 0 auto 10px;
	    width: 95%;
	}

	/* floatを使うのでclearfixの指定 */

	.flow02:after {
	    height: 0;
	    visibility: hidden;
	    content: ".";
	    display: block;
	    clear: both;
	}
	 
	.flow02 .box {
	    padding-top: 5px; /* テキストの位置調整 */
	    width: 33%; /* ウィンドウの幅が広くなった時のために％で指定 */
	    height: 24px;
	    background: #9B78FE; /* １番目のボックスの色指定 */
	    float: left; /* 横並び */
	    position: relative;
	 
	    font-size: 14px; /* テキストの指定 */
	    line-height: 1.4; /* テキストの指定 */
	}
	 
	.flow02 .box02 { background: #789DFE; } /* ２番目のボックスの色指定*/
	.flow02 .box03 { background: #78E4FE; } /* ３番目のボックスの色指定*/
	.flow02 .box04 { background: #78FED1; } /* ４番目のボックスの色指定*/
	 
	/* ボックスの左側に三角形を作る */
	.flow02 .box:before {
	    border-left: 7px solid #FFFFFF; /* １番目の三角形は背景色と同じ色を指定 */
	    border-top: 14px solid transparent;
	    border-bottom: 14px solid transparent;
	    content: "";
	    position: absolute;
	    left: 0; /* ボックスの左に合わせて三角形を作る */
	    top: 0;
	}
	 
	.flow02 .box02:before { border-left-color: #9B78FE; } /* ２番目の三角形は１番目のボックスと同じ色を指定 */
	.flow02 .box03:before { border-left-color: #789DFE; } /* ３番目の三角形は２番目のボックスと同じ色を指定 */
	.flow02 .box04:before { border-left-color: #78E4FE; } /* ４番目の三角形は３番目のボックスと同じ色を指定 */
	 
	/* 最後のボックスにだけ、右側に付ける三角形を作成する */
	.flow02 .box03:after {
	    border-left: 7px solid #78FED1; /* 最後の三角形は最後のボックスと同じ色を指定 */
	    border-top: 14px solid transparent;
	    border-bottom: 14px solid transparent;
	    content: "";
	    position: absolute;
	    right: -7px; /* 三角形の幅の分だけ右にずらす */
	    top: 0;
	}

	 
	.flow02 .box span {
	    padding-left: 15px; /* テキストの位置調整 */
	}

   .al {
      text-align:left;
      padding-left:10px;
   }
   .ac {
      text-align:center;
   }
   .at {
      vertical-align:top;
   }

   .ma {
      margin-left:auto;
      margin-right:auto;
   }

  .fl {
     float:left;
  }

  .clr {
     clear:both;
  }

   select {
      padding:3px;
   }

   .btn {
   font-family: 'メイリオ';
	font-size: 14px;
   width:96%;
	color: #ffffff;
	padding: 10px 20px;
	background: -moz-linear-gradient(
		top,
		#ffc477 0%,
		#fa7025);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ffc477),
		to(#fa7025));
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	border: 0px solid #ffc477;
	-moz-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	-webkit-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	text-shadow:
		0px -1px 1px rgba(000,000,000,0.2),
		0px 1px 0px rgba(255,255,255,0.3);
}

   .btn_gray {
   font-family: 'メイリオ';
	font-size: 14px;
   width:96%;
	color: #ffffff;
	padding: 10px 20px;
	background: -moz-linear-gradient(
		top,
		#cccccc 0%,
		#bbbbbb);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#cccccc),
		to(#bbbbbb));
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	border: 0px solid #cccccc;
	-moz-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	-webkit-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	text-shadow:
		0px -1px 1px rgba(000,000,000,0.2),
		0px 1px 0px rgba(255,255,255,0.3);
}


.btTel2 {
   text-align:center;
   width:100%;
}

.btTel2 a {
   width:90%;
   display:table;
   margin: 0 auto;
	font-size: 16px;
	color: #ffffff;
	padding: 8px 10px;
	background: -moz-linear-gradient(
		top,
		#ffc477 0%,
		#fa7025);
	background: -webkit-gradient(
		linear, left top, left bottom,
		from(#ffc477),
		to(#fa7025));
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid #ffc477;
	-moz-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	-webkit-box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	box-shadow:
		0px 1px 0px rgba(000,000,000,0.5),
		inset 0px 1px 0px rgba(255,255,255,0.7);
	text-shadow:
		0px -1px 1px rgba(000,000,000,0.2),
		0px 1px 0px rgba(255,255,255,0.3);
}

 .msg {
    position: relative;
    z-index: 99;
    opacity: 1;

    text-align:left;
    color:deeppink;
    height:0px;
    padding-left: 30px;

    animation: fadeout 1s linear 3s 1;
    animation-fill-mode: forwards;
    -webkit-animation: fadeout 1s linear 3s 1;
    -webkit-animation-fill-mode: forwards;
}
@keyframes fadeout {
    0%   {  opacity:1;height:0px;margin:0 auto;padding-left: 30px;  }
    99%  {  opacity:0;height:0px;margin:0 auto;padding-left: 30px;  }
    100% {  opacity:0;height:0;margin:0;padding:0;  }
}
@-webkit-keyframes fadeout {
    0%   {  opacity:1;height:0px;margin:0 auto;padding-left: 30px;  }
    99%  {  opacity:0;height:0px;margin:0 auto;padding-left: 30px;  }
    100% {  opacity:0;height:0;margin:0;padding:0;  }
}

.doukou {
   height:35px;
   vertical-align:bottom;
}

.order_edit_data {
   padding-left:10px;
   font-size:13px;
}

.order_air_list {
   height:27px;
}

.order_list {
   height:27px;
}

.dateInput {
   height:27px;
}

.hr {
   background: orange !important;
   background-color:orange !important;
   z-index:9999;
   line-height:1.0;
}

a:link.lk { color: blue; }

a:visited.lk { color: blue; }
