@charset "UTF-8";

html {
  font-size: 62.5%;
}
body {
  font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
  word-break: break-all;
  -webkit-text-size-adjust: none;
  -webkit-touch-callout: none;
  padding: 0;
  margin: 0;
  font-size: 15px; font-size: 1.5rem;
  line-height: 1.5;
}
input,
select,
textarea {
  font-family: Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
}

form,
p,
ul {
  padding: 0;
  margin: 0;
}
ul li {
  list-style: none;
}

/* common contents
--------------------*/
#wrapper {
  padding-bottom: 7em;
}

/* header */
.header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
}

/* main */
.main {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}
.main .wrap {
  margin: 5em 3%;
}

/* footer */
.footer {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
}

/* footer menu */
.menuUl ul {
  min-width: 320px;
  max-width: 960px;
  margin: 0 auto;
}
.menuUl li {
  float: left;
  width: 33.333%;
  list-style: none;
}
.nextBtnNone span,
.prevBtnNone span,
.menuUl li a {
  display: block;
  padding: 0.9em 0;
  text-decoration: none;
}

/* pageNavi */
/* infoNavi */


/* button Style
--------------------*/
/* btn */
.btn {
  margin: 20px 0;
  text-align: center;
  line-height: 1.2;
}
.btn input,
.btn a {
  display: block;
  width: 90%;
  max-width: 420px;
  padding: 0.8em 0;
  margin: 0 auto;
  text-align: center;
  text-decoration: none;
}

/* btnSelect */
.btnSelect {
  margin: 20px 0;
  text-align: center;
}
.btnSelect .btn1 {
  display: inline-block;
  width: 55%;
  max-width: 250px;
}
.btnSelect .btn2 {
  display: inline-block;
  width: 40%;
  max-width: 180px;
}
.btnSelect .btn2 input,
.btnSelect .btn2 a {
  padding: 0.7em 0;
}

/* btn Style */

/* toggleBtn */
.toggleBtn a {
  display: block;
  width: 100%;
  text-decoration: none;
}

/* table Style
--------------------*/
table {
  width: 100%;
  margin: 0 0 10px;
  border-collapse: collapse;
}
th, td {
  display: block;
  width: auto;
}
th {
  text-align: left;
  vertical-align: middle;
}

@media screen and (min-width: 480px) {
  td, th {
    display: table-cell;
  }
  th {
    text-align: center;
  }
}

/* style1 */
.tblStyle th {
  padding: 0.2em 0.5em;
  font-size: 13px; font-size: 1.3rem;
}
.tblStyle td {
  padding: 0.5em;
}

@media screen and (min-width: 480px) {
  .tblStyle th {
    width: 35%;
  }
}

/* style2 */
.tblStyle2 th {
  padding: 0.2em 0.5em;
  font-size: 13px; font-size: 1.3rem;
}
.tblStyle2 td {
  padding: 0.5em;
}
@media screen and (min-width: 480px) {
  .tblStyle2 th {
    width: 20%;
    padding: 0.2em 0.5em;
  }
  .tblStyle2 td {
    padding: 0.2em 0.5em;
  }
}

/* 1 */
/* 2 */

/* list Style
--------------------*/
.listStyle li {
  margin-left: 1.5em;
  list-style: disc;
}

/* box Style
--------------------*/
.box {
}

/* form Style
--------------------*/
input[type='text'], input[type='email'],
select,
textarea {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
input[type='text'], input[type='email'] {
  padding: 0.5em 0;
}
select {
  width: 100%;
  height: 2.8em;
}
textarea {
  height: 7em;
}
.btn input,
.btnSelect input,
input[type='radio'],
input[type='checkbox'] {
  cursor: pointer;
}

/* error Area
--------------------*/

/* banner Area
--------------------*/
.bannerArea {
  margin: 10px 0;
  text-align: center;
}
.bannerArea img {
  max-width: 320px;
  margin: 0 auto;
}

/* index Page
--------------------*/
.indexBox {
	 height: 700px;
 }
.indexBox form div {
  padding: 0 10px;
	margin-bottom: 10px;
}
.submitBtn {
  text-align: center;
}
input.frm {
	width: 100%;
	margin: 0 auto;
}

/* kiyaku Page
--------------------*/
.kiyaku .userBody ul,
.kiyaku .userBody p {
	margin-bottom: 1em;
}

/* list Page
--------------------*/
#thlist {
  width: 320px;
  margin: 0 auto;
}
@media screen and (min-width: 480px) {
  #thlist {
    width: 480px;
  }
}
@media screen and (min-width: 960px) {
  #thlist {
    width: 960px;
  }
}

#thlist ul {
  margin-top: 1px;
  padding: 0;
  position: relative;
}
#thlist li {
  float: left;
  width: 78px;
  height: 78px;
  margin: 1px;
  overflow: hidden;
  position: relative;
}
#thlist li:nth-child(1),
#thlist li:nth-child(10) {
  width: 158px;
  height: 158px;
}
#thlist li:nth-child(10) {
  float: right;
}	
#thlist li img {
  width: 100%;
  height: 100%;
  vertical-align: bottom;
}
#thlist li span {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
}
#thlist li a {
  display: block;
  width: 100%;
  height: 100%;
}
#thlist li a:hover:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}

/* profile Page
--------------------*/
.update {
}
.prfImg {
  vertical-align: middle;
  text-align: center;
}
.prfImg img {
  width: 100%;
  max-width: 180px;
  height: auto;
  margin: 0 auto;
  vertical-align: bottom;
}
.profile .tblStyle .tblStyle2,
.profile .tblStyle {
  margin-bottom: 0;
}
.tblStyle td.prfData { 
  padding: 10px 0 0 0;
}
.prfData form, 
.prfData input[type='submit'], 
.prfData input[type='text'] { 
  display: inline-block;
  vertical-align: middle;
}
.prfData input[type='text'] { 
  width: 5em;
  padding: 0.1em 0;
}

@media screen and (min-width: 480px) {
  .prfImg {
    width: 120px !important;
  }
  .tblStyle td.prfData { 
    padding: 0 10px 10px 10px;
  }
}

/* reportArea
--------------------*/
/* regist */
.noImg {
  margin-bottom: 10px;
  text-align: center;
}
.noImg img {
  width: 100%;
  min-width: 120px;
  max-width: 200px;
  height: auto;
  margin: 0 auto;
}

/* infomation */
.lisket-form-maker-form .btnSelect {
  margin: 0;
}

/*==================================================================
ClearFix
==================================================================*/
#thlist ul:after,
.menuUl:after,
.clearfix:after {
  content: "";
  display: block;
  clear: both;
}
#thlist ul,
.menuUl,
.clearfix {
  zoom: 1;
}

