@charset "utf-8";


/*====================================================================

CSS配置順
*-------------------------------------*
*-information　お知らせ・イベント情報
*-clubtosho　クラブトウショウとは
*-tsunagu　つなぐ
*-introduction　ご紹介
*-reform　リフォーム
*-contact　お問合せ
*-privacy　個人情報
*-------------------------------------*

======================================================================*/




/*====================================================================

共通formBox

=====================================================================*/
main .formBox {
 padding-bottom: 4em;
}

main .formBox h2 {
 font-size: 1.43em;
 padding-bottom: 0.6em;
 font-weight: 500;
 color: #0d3896;
}

main .formBox h2+p {
 font-size: 1.143em;
 padding-bottom: 2em;
}

main .formBox h2+p small {
 font-size: 0.7em;
}

main .formBox b {
 color: #e50012;
 font-weight: 400;
}

main .formBox form b {
 font-size: 0.89em;
}

main .formBox form b+table {
 margin-top: 0.6em;
}

main .formBox table {
 width: 100%;
 border-top: 1px dashed #282b8d;
}

main .formBox table tr {}

main .formBox table th,
main .formBox table td {
 padding: 1.5em 0;
 font-weight: 400;
 border-bottom: 1px dashed #282b8d;
 box-sizing: border-box;
}

main .formBox table th {
 width: 25%;
 color: #0d3896;
 font-size: 1.07em;
}

main .formBox table th[colspan="2"] {
 border-bottom: none;
 padding-bottom: 0;
}

main .formBox table th small {
 font-size: 0.7em;
}

main .formBox table td strong {
 display: inline-block;
 padding: 0.5em;
 font-size: 1.07em;
 font-weight: 500;
}

main .formBox table td {}

main .formBox table.table-check td {
 white-space: pre-line;
}

main .formBox table td dl {}

main .formBox table td dl dt,
main .formBox table td dl dd {
 padding: 0.4em 0;
}

main .formBox table td dl dt {
 float: left;
 width: 15%;
}

main .formBox table td dl dd {
 padding-left: 15%;
}

main .formBox table div {
 padding-top: 0.3em;
}

main .formBox table+h3 {
 padding: 1em 0;
}

main .formBox label {
 display: inline-block;
 padding: 0.3em 2em 0.3em 0;
 /* white-space: nowrap; */
 cursor: pointer;
}

main .formBox label input {
 display: inline-block;
 margin-right: 0.5em;
}

main .formBox input[type="text"],
main .formBox input[type="password"],
main .formBox select,
main .formBox textarea {
 border: 1px solid #b4b4b4;
 padding: 0.2em 0.5em;
}

main .formBox input[type="text"],
main .formBox input[type="password"] {
 width: 76%;
 height: 1.8em;
}

main .formBox select {
 width: 76%;
 height: 2.4em;
}

main .formBox select[name*="都道府県"] {
 width: 10em;
}

main .formBox textarea {
 width: 80%;
 height: 8em;
}

main .formBox input[placeholder="〒"] {
 width: 8em;
 margin-right: 1em;
}

main .formBox input[name*="年齢"] {
 width: 3em;
 margin-right: 1em;
}

main .formBox input[type="submit"],
main .formBox input[type="button"],
main .formBox a.submit {
 display: block;
 width: 15em;
 height: 3.4em;
 background: #0d3896;
 margin: 2em auto;
 border: none;
 border-radius: 0.5em;
 color: #fff;
 font-size: 1.07em;
 text-align: center;
 line-height: 3.4em;
 cursor: pointer;
}

main .formBox input[type="submit"]:hover,
main .formBox input[type="button"]:hover,
main .formBox a.submit:hover {
 background: #434dc4;
}


@media screen and (max-width:750px) {

 main .formBox table tr th,
 main .formBox table tr td {
  width: 100%;
  display: block;
 }

 main .formBox input[type="text"],
 main .formBox select,
 main .formBox textarea {
  width: 94%;
 }

 main .formBox input[placeholder="〒"] {
  width: 8em;
 }

 main .formBox table td dl dt,
 main .formBox table td dl dd {
  padding: 0.2em 0;
 }

 main .formBox table td dl dt {
  float: none;
  width: 1100%;
 }

 main .formBox table td dl dd {
  padding-left: 0%;
 }

}



/*
フォーム系ページへのリンクボタン
=====================================================================*/
main .flBtn a {
 display: inline-block;
 border-radius: 0.5em;
 padding: 0.8em 2em;
 margin: 0 1em 0em 0;
 text-decoration: none;
 color: #fff;
 font-size: 1.07em;
 font-weight: 500;
 background: #0d3896;
 /* Old browsers */
 background: -moz-linear-gradient(top, #5472b5 0%, #0d3896 100%);
 /* FF3.6-15 */
 background: -webkit-linear-gradient(top, #5472b5 0%, #0d3896 100%);
 /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to bottom, #5472b5 0%, #0d3896 100%);
 /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5472b5', endColorstr='#0d3896', GradientType=0);
 /* IE6-9 */
}

main .flBtn a:hover {
 background: #0d3896;
 /* Old browsers */
 background: -moz-linear-gradient(top, #0d3896 0%, #5472b5 100%);
 /* FF3.6-15 */
 background: -webkit-linear-gradient(top, #0d3896 0%, #5472b5 100%);
 /* Chrome10-25,Safari5.1-6 */
 background: linear-gradient(to bottom, #0d3896 0%, #5472b5 100%);
 /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0d3896', endColorstr='#5472b5', GradientType=0);
 /* IE6-9 */
}

main .flBtn a:before {
 content: url(../img/share/formLinkBtn.png);
 display: inline-block;
 padding-right: 0.5em;
 vertical-align: middle;
}

main .flBtn>span {
 font-size: 0.76em;
}

@media screen and (max-width:750px) {
 main .flBtn>span {
  display: block;
 }

}









/*
各コンテンツ見出し共通
=====================================================================*/
main .main-title {
 position: relative;
 padding-bottom: 3em;
}

main .main-title h1 {
 margin-bottom: 1em;
 font-size: .857em;
 font-weight: normal;
 color: #0d3896;
}

main .main-title h1 img {
 padding-right: 2em;
 vertical-align: middle;
}

main .main-title h1 span {
 display: block;
 position: absolute;
 top: 0;
 left: 9999px;
}

/*-- 共通部分 --*/
main .main-title .sub-nav {}

main .main-title .sub-nav li {
 display: inline-block;
 overflow: hidden;
 margin: 0 .5% .5% 0;
 border-radius: 12px;
 background: #eef3ff;
}

main .main-title .sub-nav li a {
 display: block;
 padding: .25em .5em .25em 2.5em;
 font-size: .857em;
 text-decoration: none;
 color: #0d3896;
 background: url(../img/share/sub-nav_icon.png) 4% 50% no-repeat;
}

main .main-title .sub-nav li:hover {
 background: #c9d9ff;
}

@media screen and (max-width:750px) {
 main .main-title h1 img {
  display: block;
 }
}





/*====================================================================

clubtosho

=====================================================================*/
#clubtosho main {}

#clubtosho main #title {
 position: relative;
}

#clubtosho main #title img {
 position: absolute;
 top: -2em;
 right: 0;
 z-index: 1;
}

#clubtosho main #title h2 {
 font-size: 1.86em;
 font-weight: 400;
 color: #0d3896;
 position: relative;
 top: 0;
 left: 0;
 z-index: 3;
}

#clubtosho main #title h2 small {
 font-size: 0.46em;
}

#clubtosho main #title+p {
 padding: 2em 0 3em;
}

#clubtosho main #tokuten h2 {
 text-align: center;
}

#clubtosho main #tokuten div {
 float: left;
 width: 46.4%;
 padding: 3% 0 3% 3.5%;
 border-bottom: 1px solid #073888;
}

#clubtosho main #tokuten div:nth-child(even) {
 border-right: 1px solid #073888;
}

#clubtosho main #tokuten div h3 {
 padding-bottom: 0.5em;
 font-size: 1.14em;
 color: #0d3896;
}

#clubtosho main #tokuten div p {
 padding-bottom: 0.8em;
}

#clubtosho main #tokuten div p img {
 float: right;
 margin-top: -2.5em;
}

#clubtosho main #tokuten div p small {
 display: block;
 font-size: 0.79em;
}

#clubtosho main #tokuten div a {
 display: inline-block;
 padding: 0.2em 1.5em;
 margin-bottom: 0.7em;
 background: #fbf3d2;
 border-radius: 2em;
 text-decoration: none;
 color: #0d3896;
}

#clubtosho main #tokuten div a:before {
 margin-right: 0.5em;
 content: "　";
 display: inline-block;
 width: 19px;
 background: url(../img/clubtosho/btnIcon.png) center no-repeat;
}

#clubtosho main #tokuten div:nth-last-child(2),
#clubtosho main #tokuten div:last-child {
 border-bottom: none;
}

#clubtosho main #tokuten div a:hover {
 background: #0d3896;
 color: #fbf3d2;
}

#clubtosho main #tokuten div a:hover:before {
 background: url(../img/clubtosho/btnIcon_on.png) center no-repeat;
}

@media screen and (max-width: 960px) {
 #clubtosho main #title {
  text-align: center;
 }

 #clubtosho main #title img {
  position: relative;
  top: -1em;
  right: auto;
 }

 #clubtosho main #title h2 {
  text-align: center;
 }
}

@media screen and (max-width: 750px) {
 #clubtosho main #tokuten div {
  float: none;
  width: 92.8%;
  height: auto !important;
  padding: 3% 0 3% 3.5%;
  border-bottom: 1px solid #073888;
 }

 #clubtosho main #tokuten div:nth-child(even) {
  border-right: none;
 }

 #clubtosho main #tokuten div:nth-last-child(2),
 #clubtosho main #tokuten div:last-child {
  border-bottom: 1px solid #073888;
 }

}


/*
point
=====================================================================*/
#clubtosho main#point {}

#clubtosho main#point h2 {
 padding-bottom: 1.4em;
}

#clubtosho main#point h2+p {
 font-size: 1.57em;
 font-weight: 400;
 padding-bottom: 0.5em;
}

#clubtosho main#point h2+p small {
 font-size: 0.55em;
}

#clubtosho main#point h2+p img {
 float: right;
 max-width: 381px;
 width: 40%;
 margin-top: -3%;
}

#clubtosho main#point img.pointCycle {
 width: 96%;
 max-width: 546px;
 display: block;
 margin: 3em auto;
}

#clubtosho main#point div.pointList {
 width: 50%;
 float: left;
 margin-bottom: 5%;
}

#clubtosho main#point div.pointList h3 {
 padding-bottom: 0.6em;
 color: #0d3896;
 font-weight: 500;
 font-size: 1.14em;
}

#clubtosho main#point div.pointList h3 small {
 font-size: 0.7em;
}

#clubtosho main#point div.pointList dl {
 width: 90%;
 padding-left: 2em;
 padding-bottom: 0.5em;
}

#clubtosho main#point div.pointList>p {
 padding-left: 2em;
}

#clubtosho main#point div.pointList dl dt,
#clubtosho main#point div.pointList dl dd {
 color: #70af58;
 padding: 0.4em 0;
 min-height: 1.6em;
}

#clubtosho main#point div.pointList dl dt {
 float: left;
 background: #fff;
 padding-right: 0.5em;
}

#clubtosho main#point div.pointList dl dd {
 background: url(../img/clubtosho/dotted.png) right bottom repeat-x;
 text-align: right;
}

#clubtosho main#point div.pointList dl dd span,
#clubtosho main#point div.pointList dl dt span.point {
 display: inline-block;
 padding: 0 1em;
 border-radius: 0.3em;
 border: 1px solid #d2d2d2;
 color: #3e3a39;
 background: #fbf3d2;
 font-size: 0.86em;
}

#clubtosho main#point div.pointList dl dd p {
 background: #fff;
 display: inline-block;
 padding: 0 0 0 1em;
 font-size: 1.14em;
}

#clubtosho main#point div.pointList dl+p {
 width: 90%;
 font-size: 0.86em;
}

#clubtosho main#point div.pointList dl+h3,
#clubtosho main#point div.pointList p+h3 {
 padding-top: 1.5em;
}

#clubtosho main#point div.pointList h3+p {
 padding-bottom: 0.6em;
}

@media screen and (max-width: 960px) {
 #clubtosho main#point h2+p br {
  display: none;
 }
}

@media screen and (max-width: 750px) {
 #clubtosho main#point h2+p img {
  display: block;
  float: none;
  margin: -3% auto 0;
 }

 #clubtosho main#point div.pointList {
  width: 100%;
  float: none;
 }

}

/*
rule
=====================================================================*/
#clubtosho main#rule h2 {}

#clubtosho main#rule h2+p {
 font-size: 1.07em;
 padding-bottom: 3em;
}

#clubtosho main#rule dl {
 font-size: 0.86em;
}

#clubtosho main#rule dl dt {
 font-weight: 500;
 padding-bottom: 1em;
}

#clubtosho main#rule dl dd {
 padding-bottom: 1.8em;
 padding-left: 1.5em;
}

#clubtosho main#rule dl dd {}






/*====================================================================

introduction

=====================================================================*/
#introduction main {}

#introduction main>p {
 font-size: 1.14em;
 padding-bottom: 1em;
}

#introduction main>h2 {
 text-align: center;
 padding: 2em 1em;
}

#introduction main>h2 img {
 width: 90%;
 max-width: 386px;
}

#introduction main ul {
 margin-bottom: 4em;
}

#introduction main ul li {
 float: left;
 position: relative;
 margin: 0 0 0 2%;
 width: 31.3%;
}

#introduction main ul li:last-child {
 width: 60%;
 padding-top: 7em;
}

#introduction main ul li>img {
 width: 85%;
 max-width: 260px;
}

#introduction main ul li:nth-child(2):before,
#introduction main ul li:nth-child(3):before {
 width: 15%;
 max-width: 40px;
 content: "　";
 background: url(../img/arrow1.png) center no-repeat;
 background-size: contain;
 position: absolute;
 top: 45%;
 left: -18%;
}

#introduction main ul li:nth-child(4):before {
 display: block;
 width: 220%;
 max-width: 664px;
 margin: 0 0 0 40%;
 height: 6em;
 content: "　";
 background: url(../img/arrow3.png) center no-repeat;
 background-size: contain;
}

#introduction main ul li div {
 width: 100%;
 padding: 1em 0;
 border: 1px solid #073888;
 border-radius: 1em;
}

#introduction main ul li div,
#introduction main ul li div * {
 text-align: center;
 margin-bottom: 0.5em;
}

#introduction main ul li div:before {
 content: url(../img/hukidashi.png);
 display: block;
 position: absolute;
 top: 47%;
 left: -30px;
}

#introduction main ul li div h2 {}

#introduction main ul li div h3 {
 display: inline-block;
 line-height: 1.2em;
 height: 24px;
 background: #ffea40;
 color: #073888;
 font-size: 1.14em;
}

#introduction main ul li div h3:before,
#introduction main ul li div h3:after {
 display: inline-block;
 vertical-align: middle;
}

#introduction main ul li div h3:before {
 content: url(../img/h3l.png);
}

#introduction main ul li div h3:after {
 content: url(../img/h3r.png);
}

#introduction main ul li div p {
 color: #073888;
}

#introduction main ul li div p:last-child {
 font-size: 0.86em;
}


@media screen and (max-width: 960px) {}

@media screen and (max-width: 750px) {
 #introduction main ul li {
  width: 42%;
  margin: 0% 4%;
 }

 #introduction main ul li:nth-child(4) {
  padding-top: 7em;
 }

 #introduction main ul li:nth-child(2):before,
 #introduction main ul li:nth-child(4):before {
  width: 15%;
  max-width: 40px;
  content: "　";
  background: url(../img/arrow1.png) center no-repeat;
  background-size: contain;
  position: absolute;
  top: 45%;
  left: -18%;
  margin: 0;
 }

 #introduction main ul li:nth-child(3):before {
  display: block;
  width: 170%;
  max-width: 664px;
  margin: 2em 0 2em 40%;
  height: 3em;
  content: "　";
  background: url(../img/arrow3.png) center no-repeat;
  background-size: contain;
  position: relative;
 }

 #introduction main ul li:last-child {
  width: 100%;
  margin: 0;
  padding: 2em 0;
 }

 #introduction main ul li>img,
 #introduction main ul li:last-child>img {
  float: none;
  width: 100%;
 }

 #introduction main ul li div {
  margin-left: 0;
 }

 #introduction main ul li div:before {
  display: none;
 }

 #introduction main ul li div h3 {
  font-size: 0.89em;
 }

}






/*====================================================================

reform

=====================================================================*/
#reform .main-title {
 margin-bottom: 2.5em;
}

#reform .main-title span {
 width: 165px;
 height: 36px;
 background: url(../img/reform/main-title.png) top left no-repeat;
}

#reform .description {
 margin-bottom: 1em;
}

#reform .banner {
 overflow: hidden;
 width: 100%;
 max-width: 776px;
 margin-bottom: 4.5em;
 border: 1px solid #ccc;
}

#reform .banner>img {
 float: left;
 width: auto;
 max-width: 490px;
 padding-right: 1em;
}

#reform .banner span {
 line-height: 52px;
}

#reform .banner span a {
 display: inline-block;
 width: 230px;
 height: 35px;
 padding-left: 25px;
 text-align: center;
 text-decoration: none;
 line-height: 35px;
 vertical-align: middle;
 color: #fff;
 border-radius: 16px;
 background: url(../img/reform/banner-btn_icon.png) 10% 50% no-repeat #1d2087;
}

#reform .category {
 margin-bottom: 2.5em;
}

#reform .category h2 {
 margin-bottom: 1.5em;
}

#reform .category h2>img {
 display: inline-block;
}

#reform .category h2 span {
 margin-left: 1.4em;
 padding: 0 1em;
 position: relative;
 background: #0d3896;
 border-radius: 6px;
}

#reform .category h2 span:after {
 content: "　";
 position: absolute;
 left: -13px;
 top: 8px;
 background: url(../img/reform/category-subBack.png) top left no-repeat;
}

#reform .category h2 span img {
 vertical-align: middle;
}

#reform .category ul {
 overflow: hidden;
 width: 100%;
}

#reform .category ul li {
 display: inline-block;
 overflow: hidden;
 width: 25%;
 min-width: 120px;
 margin: 0 2%;
 text-align: center;
}

#reform .category ul li img {
 display: block;
 width: 100%;
 padding-top: .5em;
}

#reform .category ul li br {
 display: none;
}

@media screen and (max-width: 960px) {
 #reform .banner {
  border: none;
 }

}


@media screen and (max-width: 750px) {
 #reform .description br {
  display: none;
 }

 #reform .banner>img {
  float: none;
  width: 90%;
 }

 #reform .category h2 {
  margin-bottom: 0em;
  text-align: center;
 }

 #reform .category h2>img {
  display: block;
  margin: 0 auto 0.5em;
 }

 #reform .category h2 span {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  margin-left: 0;
 }

 #reform .category h2 span img {
  width: 100%;
 }

 #reform .category h2 span:after {
  display: none;
 }

 #reform .category ul {
  text-align: center;
 }

 #reform .category ul li br {
  display: block;
 }
}






/*====================================================================

contact

=====================================================================*/





/*====================================================================

privacy

=====================================================================*/
#privacy .main-title {
 margin-bottom: 2.5em;
}

#privacy .main-title span {
 width: 266px;
 height: 36px;
 background: url(../img/privacy/main-title.png) top left no-repeat;
}

#privacy .inner>p {
 margin-bottom: 2.5em;
}

#privacy .detail {
 margin-bottom: 3em;
}

#privacy .detail h2 {
 margin-bottom: .5em;
 font-size: 1.2em;
 font-weight: 500;
 color: #282b8d;
 border-bottom: 1px solid #282b8d;
}

#privacy .detail p {
 padding-left: 1.6em;
}

#privacy .detail ul {
 padding: 1em 0 1em 2.2em;
}

#privacy .detail ul li {
 padding-bottom: .25em;
 text-indent: -1.2em;
 padding-left: 1.2em;
}

@media screen and (max-width: 960px) {
 #privacy .main-title {
  margin-bottom: 1.5em;
 }

 #privacy .detail ul {
  padding-left: 1.6em;
 }
}