﻿table{
  position: relative;
  top: 60px;
  border-collapse:separate;
  border-spacing: 5px;
  width: 100%;
}

table th,table td{
  border-radius: 5px;
  text-align: center;
  padding: 10px 0;
}

table th{
  background-color: #c79852;
  color: white;
  width: 100px;
  border:solid 1px #927141;
}

table td{
  background-color: #e4d4bc;
  width: 100px;
  border:solid 1px #af9d85;
}


/*検索ボックス*/
#idbox{
  width:400px;
  border-radius:2px 0 0 2px;/*検索ボックスの角を丸める*/		
  background:#eee;/*検索ボックスの背景カラー*/		
}




/*フォーム全体*/
#form1{
  position:relative;/*フォームの相対位置*/
  top:130;	
  max-width:1270px;/*フォームのサイズ*/
  margin-bottom:15px;/*フォームの下に余白*/	 	
}
/*検索ボックス*/
#sbox{
  position:absolute;/*フォームの絶対位置*/	
  left:0;
  top:130; 	
  outline:0;/*クリック時の青い枠線消す*/	
  height:40px;/*検索ボックスの高さ*/	
  padding:0 10px;/*テキスト位置調整*/
width:800px;
  border-radius:2px 0 0 2px;/*検索ボックスの角を丸める*/		
  background:#eee;/*検索ボックスの背景カラー*/		
}
/*検索ボタン*/
#sbtn{
  width:90px;/*検索ボタンの横幅*/ 
  height:45px;/*検索ボタンの縦幅*/ 
  position:absolute;/*検索ボタンの絶対位置*/  
  left:835px;/*検索ボタンの位置調整*/  
  top:130;
  border-radius:0 2px 2px 0;/*検索ボタンの角を丸める*/ 
  background:#7fbfff;/*検索ボタンの背景カラー*/ 
  border:none;/*検索ボタンの枠線を消す*/ 
  color:#fff;/*検索ボタンのテキストカラー*/ 
  font-weight:bold;/*検索ボタンのテキスト太字*/ 
  font-size:16px;/*検索ボタンのフォントサイズ*/ 
}
/*検索ボタンマウスオーバー時*/
#sbtn:hover{
  color:#666;/*検索ボタンマウスオーバー時のフォントカラー*/ 
}


/*検索ボタン*/
#wfbtn{
  width:90px;/*検索ボタンの横幅*/ 
  height:55px;/*検索ボタンの縦幅*/ 
  position:absolute;/*検索ボタンの絶対位置*/  
  left:1650px;/*検索ボタンの位置調整*/  
  top:0;
  border-radius:0 2px 2px 0;/*検索ボタンの角を丸める*/ 
  background:#7fbfff;/*検索ボタンの背景カラー*/ 
  border:none;/*検索ボタンの枠線を消す*/ 
  color:#fff;/*検索ボタンのテキストカラー*/ 
  font-weight:bold;/*検索ボタンのテキスト太字*/ 
  font-size:16px;/*検索ボタンのフォントサイズ*/ 
}

.btn-square-shadow1 {
  display: inline-block;
  padding: 0.5em 1em;
  width: 150px;
  text-align: center;
  text-decoration: none;
  background: #c79852;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
}
.btn-square-shadow1:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

.btn-square-shadow2 {
  display: inline-block;
  padding: 0.5em 1em;
  width: 150px;
  text-align: center;
  text-decoration: none;
  background: #e4d4bc;/*ボタン色*/
  color: #000;
  border-bottom: solid 4px #e4d4bd;
  border-radius: 3px;
}
.btn-square-shadow2:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

.btn-square-shadow3 {
  display: inline-block;
  padding: 0.5em 1em;
  width: 150px;
  text-align: center;
  text-decoration: none;
  background: #668ad8;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
}
.btn-square-shadow3:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

.btn-square-shadow4 {
  display: inline-block;
  padding: 0.5em 1em;
  /*position:absolute;/*検索ボタンの絶対位置*/  
  /*left:790px;/*検索ボタンの位置調整*/  
  width: 150px;
  text-align: center;
  text-decoration: none;
  background: #263ad8;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #e4d4bd;
  border-radius: 3px;
}
.btn-square-shadow4:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

#tmp2nd {
  display: inline-block;
 _display: inline;
}



#n1 {

  border-left :solid 5px orange;
  border-bottom: solid 1px gray;
  /*余白をつけておきます*/
  padding: 10px;
  width: 150px;
  display: inline-block;
 _display: inline;
}

#n2 {

  border-left :solid 5px red;
  border-bottom: solid 1px gray;
  /*余白をつけておきます*/
  padding: 10px;
  width: 150px;
  display: inline-block;
 _display: inline;
}

#n3 {
  display: inline-block;
  padding: 0.7em 1em;
  text-decoration: none;
  border-radius: 8px;
  font-weight: bold;
  color: #000;
  width: 260px;
  background-image: linear-gradient(45deg, #709dff 0%, #b0c9ff 100%);
  transition: .4s;
}

#n3:hover {
  background-image: linear-gradient(45deg, #709dff 50%, #b0c9ff 100%);
}




#ul1 {
  text-decoration: underline;
  width: 350px;
}

input[type="text"],
textarea {
  outline: none;
  border: 1px solid #aaa;
  -webkit-transition: all .3s;
  transition: all .3s;
}
input[type="text"]:focus,
textarea:focus {
  box-shadow: 0 0 7px #1abc9c;
  border: 1px solid #1abc9c;
}








.btn-square-soft {
  display: inline-block;
  position:absolute;/*検索ボタンの絶対位置*/  
  left:780px;/*検索ボタンの位置調整*/  
  text-decoration: none;
  color: #f9a9ae;
  width: 120px;
  height: 50px;
  line-height: 50px;
  border-radius: 5px;
  text-align: center;
  overflow: hidden;
  font-weight: bold;
  background: linear-gradient(#fed6e3 0%, #ffaaaa 100%);
  text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.28);
}

.btn-square-soft:active {
  /*押したとき*/
  -webkit-transform: translateY(2px);
  transform: translateY(2px);/*沈むように*/
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.15);
  background-image: linear-gradient(#fed6e3 0%, #ffbcbc 100%);/*グラデーションを明るく*/
}
