/*===============================================
●tablet.css 画面の横幅が768pxまで
===============================================*/
@media screen and (max-width: 768px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

〜以下、画面の横幅が768pxまでの場合のスタイル記入〜

html {
    overflow-y:scroll;
}

body {
    margin:0;
    padding:0;
    line-height:1.6;
    letter-spacing:1px;
    font-family: Meiryo,メイリオ,'Segoe UI',Arial,sans-serif;
    font-size:85%;
    color:#000;
	background-color: #eeeeee;
	}

#container {
    width:100%;
    margin: 0px;
	}

#contents {
    width:600px;
	margin: 10px auto;
    padding: 10px;
    background:#fff;
	border-radius:10px;
	border:1px solid #999999;
	}

ul.style { 
   padding: 0px;
   list-style-type: none;
   }
ul.style li {
   margin: 0px 0px 20px 0px;
   }
ul.style li.style {
   padding: 0px 0px 0px 8px;
   margin: 10px 0px 0px 0px;
   display: block;
   line-height: 1.7;
   }
ul.style li.cyu {
   padding: 0px 0px 0px 15px;
   margin: 0px;
   display: block;
   line-height: 1.7;
   }
	
span.need {
  border-radius: 2px;
  color: #fff;
  font-size: 80%;
  margin: 0 3px 0 0;
  padding: 0 5px;
  vertical-align:2px;
}

span.yes { background-color: #ff3333; }
span.no { background-color: #3366ff; }

input.send,
input.reset,
input.close {
   border:solid 1px #999;
   padding:5px;
   margin:0 0 20px;
   font-size:80%;
   color:#333;
   cursor:pointer;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   }
input.send { width: 80px; margin-right: 20px; margin-bottom: 20px; }
input.reset { width: 80px; margin-left: 20px; margin-bottom: 20px; }
input.close { width: 120px; margin-bottom: 20px; }

h1,h2,h3,h4,h5,h6 {
    margin:0;
}

p.midashi {
   clear:both;
   padding:5px 10px;
   margin:5px 0px;
   line-height:1.3;
   color:#fff;
   font-size:100%;
   font-weight:bold;
   background:#8b0000;
}

ul,ol,dl {
    margin:0;
    padding:0;
}

li {
    padding:0;
    margin:0;
}

dt {
    margin:0;
    padding:0;
}

hr {
   border:0;
   height: 30px;
   }
hr.b {
   border:0;
   height: 60px;
   }
hr.s {
   border:0;
   height: 10px;
   }
hr.border {
   border:0;
   height: 30px;
   background-image:  url(../../images/hr_line.png);
   background-repeat: repeat-x;
   background-position: center ;
   }
hr.border-s {
   border:0;
   height: 10px;
   background-image:  url(../../images/hr_line.png);
   background-repeat: repeat-x;
   background-position: center;
   }   
hr.line {
    clear:both;
	width: 100%;
	height: 8px;
    background:#770000;
    background: url(../../images/h2_back01.gif);
    background-repeat: no-repeat;
	background-position: bottom;
}
hr.line-s {
    clear:both;
	width: 100%;
	height: 1px;
    border-bottom: 1px solid #ddd;
}

/*==========================================================*/
/*  font-deco   */

.f-bold { font-weight:bold; }

.f-120 {
   font-size: 108%;
   line-height: 1.7;
   }

.f-12-bold {
   font-size: 108%;
   line-height: 1.7;
   font-weight:bold;
   }

.f-red {
   color: #CC0000;
   }
   
.f-red-bold {
   color: #CC0000;
   font-weight:bold;
   }

.f-12-red-bold {
   color: #CC0000;
   font-weight:bold;
   font-size: 12pt;
   line-height: 1.7;
   }
   
.f-int {
   display: inline-block;
   font-size: 138.5%;
   line-height: 1.5;
   color: #CC0000;
   background-image:  url(../../images/f-int_back.png);
   background-repeat: no-repeat;
   background-position: left bottom;
   color: #333333;
   }

.fsize10 { font-size:77%; }
.fsize11 { font-size:85%; }
.fsize12 { font-size:93%; }
.fsize13 { font-size:100%; }
.fsize14 { font-size:108%; }
.fsize15 { font-size:116%; }
.fsize16 { font-size:123.1%; }
.fsize17 { font-size:131%; }
.fsize18 { font-size:138.5%; }
.fsize19 { font-size:146.5%; }
.fsize20 { font-size:153.9%; }
.fsize21 { font-size:161.6%; }
.fsize22 { font-size:167%; }
.fsize23 { font-size:174%; }
.fsize24 { font-size:182%; }
.fsize25 { font-size:189%; }   

/*==========================================================*/
/*  position   */

.p-right {
   text-align:right;
   }

.p-center {
   text-align:center;
   }
   
.center {
  text-align: center;
  vertical-align:middle;
  }
  
}

/*==========================================================*/
/* form  */

#form-table table {
   width: 100%;
   border: 5px solid #cccccc;
   margin: 0;
   padding: 0;
   font-size: 90%;
   line-height: 1.5;
   }

#form-table .thead th {
   border-top: 1px solid #cccccc;
   border-left: 1px solid #cccccc;
   border-right: 1px solid #cccccc;
   border-bottom: 2px solid #cccccc;
   background-color:#dddddd;
   color: #555555;
   padding: 5px 3px;
   }

#form-table table, th, td {
   border-collapse: collapse;
   border: none;
   border-spacing: 0;
   font-weight: normal;
   }

#form-table th, td {
   padding: 3px;
   }

#form-table th { 
   border: 1px solid #cccccc;
   color: #555555;
   background-color: #dddddd;
   text-align: center;
   }

#form-table td { 
   border: 1px solid #cccccc;
   }
#form-table th.nowrap, 
#form-table td.nowrap {
   white-space: nowrap;
   }

#form-table tr.color td,
#form-table td.color {
   background-color: #eeeeee;
   }

#form-table tr.gray td { /* 普通のグレー */
   background-color: #eeeeee;
   padding: 2px;
   }
   
#form-table table caption {
   margin: 15px 0 5px 0;
   padding: 2px 0px 2px 10px;
   padding-bottom: 2px;
   border-left: 5px solid #CC0000;
   text-align: left;
   font-size: 126%;
   line-height: 1.5;
   font-weight: bold;
   }

.form {
   border:0;
   padding:3px;
   font-size:100%;
   color:#000;
   border:solid 1px #999;
   margin:5px;
   width: 300px;
   }
   
.radio {
    margin-left: 0px;
	}
   
.textarea {
   font-size:100%;
   color:#000;
   border:solid 1px #999;
   margin:5px;
   }
   
.select {
   font-size:100%;
   color:#000;
   border:solid 1px #999;
   margin:5px;
   }
   
input:focus {
    border:solid 1px #CC0000;
   }
   
input.mail {
   ime-mode:inactive;
   }
input.num {
   ime-mode:disabled;
   }
   
.need {
   color: #CC0000;
   }

/* メッセージ */
p.msg {
    font-weight: bold;
	color: #dd0000;
}
span.msg {
    font-weight: bold;
	color: #dd0000;
}