@charset "Shift_JIS";

/*============================================
全般的なスタイル
============================================*/

main {
    display: block; /* 追記 */
}

body {
 font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 line-height:25px;
 font-size:0.95em;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -o-text-size-adjust: 100%;
  text-size-adjust: 100%; 
  word-wrap : break-word;
  overflow-wrap : break-word;
	    }
 
html {box-sizing: border-box;}


hr {
 border-width: 5px 0px 0px 0px; /* 太さ */
border-style: solid; /* 線種 */
border-color: 00468c; /* 線色 */
height: 3px; /* 高さ */
 }
 
hr.style2 {
 border-width: 3px 0px 0px 0px; /* 太さ */
border-style: solid; /* 線種 */
border-color: 3973a6; /* 線色 */
height: 3px; /* 高さ */
 }

#wrapper {
	width: 100%;
min-width: 200px;
max-width: 1200px;
margin: 0 auto;
background-color:#ffffff;
overflow : hidden ;
}
 
*{
margin: 0;
padding: 3;
}

#pagebody{
margin-left:auto;
margin-right:auto;
min-width: 200px;
max-width: 1200px;
}

#topbn{
text-align: left;
margin: 0 auto;
}

#title{
text-align: left;
font-size:x-large;
width: 95%;
margin: 0 auto;
}

#cm{
text-align: left;
width: 95%;
margin: 0 auto;
padding: 10px 0px 0px 0px;
}

textarea {
 width:80%; max-width:150px; max-width:500px;
height: 7em;
line-height: 1.5em;
}




/*============================================
ヘッダ
============================================*/
div#header {
	height:20px;	/*背景画像のサイズに合わせてボックスの高さを指定*/
	background-color:#000000;		/*ヘッダ部分の背景色*/
    border : 5px solid #000000 ;
}


/*============================================
横幅で非表示
============================================*/
@media screen and (max-width: 750px){
.spNone {       display:none;}
}


@media screen and (min-width: 750px){
.pcNone {       display:none;}
}



/*============================================
フッタ
============================================*/
div#footer {
	height:25px; text-align:center;
	clear:both;					/*回り込みを解除する*/
	background-color:#000000;			/*フッタ部分の背景色*/
}


/*============================================
テーブル
============================================*/

table{
width:100%;
word-break: break-word;

}

.s-tbl {
	border-collapse: collapse;
	
}
.s-tbl th, .s-tbl td {
	border: 0px solid #e7e7e7;
}
.s-tbl tr:nth-child(odd) {
	background: #e7e7e7;
}
.s-tbl tr:nth-child(even) {
	background: #f2f2f2;
}
td, th {
padding: 10px 10px;

}


.s-tbl2 {
	border-collapse: collapse;
	
}
.s-tbl2 th, .s-tbl td {
	border: 0px solid #e7e7e7;
}

.s-tbl3 {
	background-color: #f2f2f2;
	border-collapse: collapse;
}
.s-tbl3 tr:hover {
	background: #a2c8ff;
}

table.s-tbl3 {
  border-collapse: collapse;
  width: 100%;
}
table.s-tbl3 th,
table.s-tbl3 td {
  padding: 10px;
  border: 0px solid #999;
}
table.s-tbl3 tr {
  background-color: #eee;
  text-align: center;
  width: 30%;
}

@media (min-width: 651px){
table.s-tbl2 th, table.s-tbl2 td {
	border: 0px solid #e7e7e7; 

}
table.s-tbl2 tr:nth-child(odd) {
	background: #e7e7e7;
}
table.s-tbl2 tr:nth-child(even) {
	background: #f2f2f2;
}

table.s-tbl2 tr:hover {
	background: #a2c8ff;
}

table.s-tbl2 td {
   border: 0px solid black;
   padding: 1em;
   vertical-align: top;
}

table.s-tbl2 td, th {
padding: 10px 50px 5px 10px;

}

}


@media (max-width: 750px){
table.s-tbl2 td {
   display: block;
   width: auto;
}
table.s-tbl2 td:nth-child(even) {
	background: #f2f2f2;
}
table.s-tbl2 td:nth-child(odd) {
	background: #e7e7e7;
}
table.s-tbl2 td:hover {
	background: #a2c8ff;
}

  table.s-tbl3 {
    border-top: 0px solid #999;
  }
  table.s-tbl3 td {
    display: block;
    text-align: center;
  }
  table.s-tbl3 th {
    display: block;
    border-top: none;
    border-bottom: none;
    width: 100%;
  }
}


table.s-tblx {
  border-collapse: collapse;
  width: 100%;
}

table.s-tblx:hover tbody td {
  background-color: #a2c8ff;
}
table.s-tblx:hover tbody tr:hover td {
  background-color: #a2c8ff;
}
table.s-tblx:hover tbody tr:hover th {
  background-color: #a2c8ff;
}

table.s-tblx th,
table.s-tblx td {
  background-color: #e7e7e7;
  padding: 10px;
}
table.s-tblx th {
  background-color: #e7e7e7;
  text-align: left;
  width: 30%;
}



table.s-tblx2 {
  border-collapse: collapse;
  width: 100%;
}
table.s-tblx2:hover tbody td {
  background-color: #a2c8ff;
}
table.s-tblx2:hover tbody tr:hover td {
  background-color: #a2c8ff;
}
table.s-tblx2:hover tbody tr:hover th {
  background-color: #a2c8ff;
}

table.s-tblx2 th,
table.s-tblx2 td {
  background-color: #f2f2f2;
  padding: 10px;
}
table.s-tblx2 th {
  background-color: #f2f2f2;
  text-align: left;
  width: 30%;
}

table.s-tblx3 {
  border-collapse: collapse;
  width: 100%;
}
table.s-tblx3:hover tbody td {
  background-color: #a2c8ff;
}
table.s-tblx3:hover tbody tr:hover td {
  background-color: #a2c8ff;
}
table.s-tblx3:hover tbody tr:hover th {
  background-color: #a2c8ff;
}

table.s-tblx3 th,
table.s-tblx3 td {
  background-color: #f2f2f2;
  padding: 10px;
}
table.s-tblx3 th {
  background-color: #f2f2f2;
  text-align: left;
  width: 30%;
}

table.s-tblx4 {
  border-collapse: collapse;
  width: 100%;
}

table.s-tblx4 th,
table.s-tblx4 td {
  background-color: #e7e7e7;
  padding: 10px;
}
table.s-tblx4 th {
  background-color: #e7e7e7;
  text-align: left;
  width: 30%;
}

table.s-tblx5 {
  border-collapse: collapse;
  width: 100%;
}

table.s-tblx5 th,
table.s-tblx5 td {
  background-color: #f2f2f2;
  padding: 10px;
}
table.s-tblx5 th {
  background-color: #f2f2f2;
  text-align: left;
  width: 30%;
}


@media screen and (max-width: 750px) {
  table.s-tblx {
    border-top: 0px solid #e7e7e7;
  }
table.s-tblx:hover tbody td {
  background-color: #a2c8ff;
}
table.s-tblx:hover tbody tr:hover td {
  background-color: #a2c8ff;
}
table.s-tblx:hover tbody tr:hover th {
  background-color: #a2c8ff;
}

  table.s-tblx td {
  background-color: #f2f2f2;
    display: block;
    text-align: left;
  }
  table.s-tblx th {
    text-align: left;
  background-color: #e7e7e7;
    display: block;
    border-top: none;
    border-bottom: none;
    width: 96.5%;
  }
  
  table.s-tblx2 {
    border-top: 0px solid #e7e7e7;
  }
table.s-tblx2:hover tbody td {
  background-color: #a2c8ff;
}
table.s-tblx2:hover tbody tr:hover td {
  background-color: #a2c8ff;
}
table.s-tblx2:hover tbody tr:hover th {
  background-color: #a2c8ff;
}

  table.s-tblx2 td {
  background-color: #f2f2f2;
    display: block;
    text-align: left;
  }
  table.s-tblx2 th {
    text-align: left;
  background-color: #e7e7e7;
    display: block;
    border-top: none;
    border-bottom: none;
    width: 96.5%;
  }
  
  table.s-tblx4 {
    border-top: 0px solid #e7e7e7;
  }
  
  table.s-tblx4 th {
    text-align: left;
  background-color: #e7e7e7;
    display: block;
    border-top: none;
    border-bottom: none;
    width: 96.5%;
  }
  table.s-tblx4 td {
  background-color: #f2f2f2;
    display: block;
    text-align: left;
  }
  
  table.s-tblx5 {
    border-top: 0px solid #e7e7e7;
  }
  
  table.s-tblx5 th {
    text-align: left;
  background-color: #e7e7e7;
    display: block;
    border-top: none;
    border-bottom: none;
    width: 96.5%;
  }
  table.s-tblx5 td {
  background-color: #f2f2f2;
    display: block;
    text-align: left;
  }
  }



/*----------------------------------------------------
  .btntb01
----------------------------------------------------*/
.btntb01 th  { width: 13%; }
.btntb01 td  { text-align: center; }
.btntb01 td:first-child  { text-align: left; }
@media only screen and (max-width: 700px) { 
  .btntb01 { 
    display: block; 
    width: 50%; 
    margin: 0 -10px;
  }
  .btntb01 thead{ 
    display: block; 
    float: left;
    overflow-x:scroll;
  }
  .btntb01 tbody{ 
    display: block; 
    width: auto; 
    overflow-x: auto; 
    white-space: nowrap;
  }
  .btntb01 th{ 
    display: block;
    width:auto;
  }
  .btntb01 tbody tr{ 
    display: inline-block; 
    margin: 0 -3px;
  }
  .btntb01 td{ 
    display: block;
  }
}

@media only screen and (max-width: 500px) { 
  .btntb01 { 
    display: block; 
    width: 100%; 
    margin: 0 -10px;
  }
  .btntb01 thead{ 
    display: block; 
    float: left;
    overflow-x:scroll;
  }
  .btntb01 tbody{ 
    display: block; 
    width: auto; 
    overflow-x: auto; 
    white-space: nowrap;
  }
  .btntb01 th{ 
    display: block;
    width:auto;
  }
  .btntb01 tbody tr{ 
    display: inline-block; 
    margin: 0 -3px;
  }
  .btntb01 td{ 
    display: block;
  }
}



/*============================================
画像サイズ
============================================*/
img.example1 {
width: 300px;
height: auto; 
}

img.example2 {
width: 600px;
height: auto; 
}

img { 
    max-width: 100%; 
    height: auto;
} 


/*============================================
送信ボタン
============================================*/



.btn1 {
	background: #00468c;
	border: 1px solid #00468c;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	color: #ffffff;
	width: 200px;
	height:70px;
	padding: 30px 0;
	margin: 4px 15px 4px 15px;
}

input[type="submit"], input[type="reset"], input[type="button"], button{
  cursor: pointer;
    padding: 15px 35px; 
	font-size: 1.2em; 
	-webkit-appearance: none;
	}
	
.btn1 {
	background: #00468c;
	border: 1px solid #00468c;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	color: #ffffff;
	width: 200px;
	height:70px;
	padding: 30px 0;
	margin: 4px 15px 4px 15px;
}



.btn3 {
	 	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #00468c;
	border: 1px solid #00468c;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	color: #ffffff;
	width: 200px;
	height:85px;
	padding: 8px 0;
	margin: 14px 14px 14px 14px;
}
a.btn3:hover, input.btn3:hover{
	background:#333;}

.btn4 {
	 	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #b31515;
	border: 1px solid #b31515;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	color: #ffffff;
	width: 200px;
	height:85px;
	padding: 8px 0;
	text-align: center;
	margin: 14px 14px 14px 14px;
	
}
a.btn4:hover, input.btn3:hover{
	background:#333;}

.btn5 {
	background: #00468c;
	border: 1px solid #00468c;
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	color: #ffffff;
	width: 200px;
	height:70px;
	padding: 10px 0;
	margin: 14px 15px 14px 15px;
	text-align: center;
        line-height: 50px;
vertical-align: middle;
}

/*============================================
入力フォーム
============================================*/


textarea {
 font-size: 16px ;
}

textarea:focus {
background-color: #f3d6d6;
}


input.in1{
 width:120px;
 height:30px;
 margin:2px;
 font-size: 16px ;

 }
input.in1:focus {
background-color: #f3d6d6;
}

input.in2{
 width:40px;
 height:30px;
 margin:2px;
 font-size: 16px ;
 }
 
input.in2:focus {
background-color: #f3d6d6;
}
input.in3{
 width:80%; max-width:150px; max-width:800px;
 height:30px;
 margin:2px;
 font-size: 16px ;
 }
 
 input.in3:focus {
background-color: #00468c;
}
 
input.in3:focus {
background-color: #f3d6d6;
}
input.in4{
 width:80%; max-width:150px; max-width:500px;
 height:30px;
 margin:2px;
 font-size: 16px ;
 }

 input.in4:focus {
background-color: #00468c;
}
input.in4:focus {
background-color: #f3d6d6;
}
input.in5{
 width:80px;
 height:30px;
 margin:2px;
 font-size: 16px ;
 }
input.in5:focus {
background-color: #f3d6d6;
} 
input.in6{
 width:80%; max-width:150px; max-width:200px;
 height:30px;
 margin:2px;
 font-size: 16px ;
 }
  
 select.in1{
 width:150px;
 height:30px;
 margin:2px;

 }
 
 

/*============================================
隙間
============================================*/
.sukima{
line-height:0.5em;/*1より小さくする*/
 }
 
.sukimatop{
margin-top:5px;
 }

.sukimatop2{
margin-top:10px;
 }
 
.sukimatop3{
margin-top:15px;
 } 
 
.sukimatop4{
margin-top:5px;
margin-left:10px;
 }
  
.sukimaleft{
margin-left:50px;
 } 
 
 .sukima5{
margin:8px;
 } 
 
/*============================================
配置
============================================*/
 	.haichi1 label {
    display: inline-block;
    width: 170px;
	}
	
 	.haichi2 label {
    display: inline-block;
    width: 100px;
	}
	
 	.haichi3 label {
    display: inline-block;
    width: auto;
	}
	
 	.haichi4 label {
    display: inline-block;
    width: 200px;
	}
 
 	.haichi5 label {
    display: inline-block;
    width: 160px;
	margin-left:10px;
	}
	
.L {
 width:100px;
 float:left;
 }
 .R {
 text-align:right;
 margin-left:100px;
 }
 
@media (min-width: 750px){
  .R2 {
 text-align:center;
 margin-left:100px;
 }
}
@media (max-width: 750px){
  .R2 {
 text-align:right;
 margin-left:100px;
 }
}
  
/*============================================
カーソルメッセージ
============================================*/ 
.message {
    position: relative;
}
.message span.remark {
    display: none;
}
.message a:hover span.remark {
    background: none repeat scroll 0 0 #EEFFEE;
    border: 1px solid #CCCCCC;
    color: #000000;
    display: block;
    line-height: 1.2em;
    margin: 0.5em;
    padding: 0.5em;
    position: absolute;
    top: 50px;
    width: 12em;
}

/*============================================
必須
============================================*/ 
.btn2 {
	background: #ff0000;
	border-radius: 3px;

	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	color: #ffffff;
	padding: 5px 8px;
}

/*============================================
文字装飾
============================================*/ 

.size10-red {
	color: rgb(255, 0, 0); font-size: 10px;
}
.size10-bak {
	color: rgb(0, 0, 0); font-size: 10px;
}
.size10-bak-bold {
	color: rgb(0, 0, 0); font-size: 10px; font-weight: bold;
}
.fuuter {
	color: rgb(255, 255, 255); font-size: 12px;
}
.size12-bold {
	font-size: 12px; font-weight: bold;
}
.size30-bold-red {
	color: rgb(255, 0, 0); font-size: 30px; font-weight: bold;
}
.size14 {
	font-size: 14px;
}
.size12-gray {
	color: rgb(102, 102, 102); font-size: 12px;
}

.size12-blue {
	color: #0033FF; font-size: 12px; text-decoration:underline;
}

.size12-bold-gray {
	color: rgb(102, 102, 102); font-size: 12px; font-weight: bold;
}
.size12-bold-white {
	color: rgb(255, 255, 255); font-size: 12px; font-weight: bold;
}
.size10-white {
	color: rgb(255, 255, 255); font-size: 10px;
}
.size12-bold-red {
	color: rgb(255, 0, 0); font-size: 12px; font-weight: bold;
}
.size12-red {
	color: rgb(255, 0, 0); font-size: 12px;
}
.size14-bold {
	font-size: 14px; font-weight: bold;
}
.size16-bold {
	font-size: 16px; font-weight: bold;
}

/*============================================
確認画面用
============================================*/ 
#ContactConfirm{
	display:none;}
	
a.Bt, input.Bt{
 	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	display:inline-block;
	background: #00468c;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	color: #ffffff;
	width: 200px;
	padding: 30px 0;
	margin: 4px 15px 4px 15px;	cursor:pointer;
	border:none;}
a.Bt:hover, input.Bt:hover{
	background:#333;}

a.Bts, input.Bts{
 	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	display:inline-block;
	background: #b31515;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
		color: #ffffff;
	width: 200px;
	padding: 30px 0;
	margin: 4px 15px 4px 15px;	cursor:pointer;
	border:none;}
a.Bts:hover, input.Bts:hover{
	background:#333;}