@charset "utf-8";

* { letter-spacing: 0; }
html { overflow-y: scroll; }
/* 要素のフォントサイズやマージン・パディングをリセットしています */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}
/* 新規追加要素のデフォルトはすべてインライン要素になっているので、section要素などをブロック要素へ変更しています */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block; }
/* マーカー（行頭記号）を表示しないようにしています */
ol, ul, li { list-style: none; }
/* 水平罫線のデフォルトである立体的な罫線を見えなくしています */
hr { border: none; border-top: solid 1px #e6e6e6; height: 1px; color: #FFFFFF; margin: 10px 0; }
/* 縦方向の揃え位置を中央揃えに指定しています */
input, select { vertical-align: middle; }
/* address斜体をクリア */
address { font-style: normal; }
/* 画像を並べた時に隙間が出来ないように指定しています */
img {
  vertical-align:top;
  font-size:0;
  line-height:0;
  border:0;
  -ms-interpolation-mode:bicubic;
  max-width:100%;
  height:auto;
  width:auto\9; /* ie8 */
}
textarea { font-size:100%; }
table {
  width: 100%;
  border-collapse:collapse;
  border-spacing:0;
  table-layout: fixed;
  word-break: break-all;
  word-wrap: break-word;
}
ul,ol,dl {
  font-size: 0;/* inline-block横並びの子要素の不意な余白を削除 */
}
select,button {
  cursor:pointer;
  border: none;
}
/* リンククリック時の枠を非表示 */
a:hover,
input[type=submit]:hover,
button:hover,
a:focus,
input[type=submit]:focus,
button:focus {
  outline: none;
}
/* 全てにborder-box */
*, *:before, *:after {
  box-sizing: border-box;
}
/* --------------------------------------------------------
表示/非表示
-------------------------------------------------------- */
/* PC */
@media only screen and (min-width : 768px) {
  .pc_only { display: block; }
  .sp_only { display: none; }
}
/* SP */
@media only screen and (max-width : 768px) {
  .pc_only { display: none; }
  .sp_only { display: block; }
}
/*--------------------------------------------------------
advance
--------------------------------------------------------*/
/* clear */
.clear,clearfix { zoom: 1; }
.clear:before, .clear:after, .clearfix:before, .clearfix:after { display: table; content: ""; }
.clear:after,.clearfix:after { clear: both; }
/* layout */
.db { display: block; }
.di { display: inline; }

.ar { display: block; text-align: right; }
.ac { display: block; text-align: center; }
.ac2 { display: block; width: 50%; margin: 0 auto; }

.al { display: block; text-align: left; }
.fl { display: block; float: left; }
.fr { display: block; float: right; }

.f36 { font-size:3.6rem; }
.f34 { font-size:3.4rem; }
.f32 { font-size:3.2rem; }
.f30 { font-size:3.0rem; }
.f28 { font-size:2.8rem; }
.f26 { font-size:2.6rem; }
.f24 { font-size:2.4rem; }
.f22 { font-size:2.2rem; }
.f20 { font-size:2.0rem; }
.f18 { font-size:1.8rem; }
.f17 { font-size:1.7rem; }
.f16 { font-size:1.6rem; }
.f15 { font-size:1.5rem; }
.f14 { font-size:1.4rem; }
.f13 { font-size:1.3rem; }
.f12 { font-size:1.2rem; }
.f11 { font-size:1.1rem; }
.f10 { font-size:1.0rem; }
.small { font-size: 85%; }
.large { font-size: 110%; }
/* font-weight */
.fn { font-weight:normal; }
.fb { font-weight:bold; }
.fi { font-style:italic; }
.fu { text-decoration:underline; }

.mb0 { margin-bottom: 0rem !important; }
.mb5 { margin-bottom: 0.5rem !important; }
.mb10 { margin-bottom: 1rem !important; }
.mb15 { margin-bottom: 1.5rem !important; }
.mb20 { margin-bottom: 2rem !important; }
.mb25 { margin-bottom: 2.5rem !important; }
.mb30 { margin-bottom: 3rem !important; }
.mb35 { margin-bottom: 3.5rem !important; }
.mb40 { margin-bottom: 4rem !important; }
.mb45 { margin-bottom: 4.5rem !important; }
.mb50 { margin-bottom: 5rem !important; }
.mb55 { margin-bottom: 5.5rem !important; }
.mb60 { margin-bottom: 6rem !important; }
.mb65 { margin-bottom: 6.5rem !important; }
.mb70 { margin-bottom: 7rem !important; }
.mb75 { margin-bottom: 7.5rem !important; }
.mb80 { margin-bottom: 8rem !important; }
.mb85 { margin-bottom: 8.5rem !important; }
.mb90 { margin-bottom: 9rem !important; }
.mb95 { margin-bottom: 9.5rem !important; }
.mb100 { margin-bottom: 10rem !important; }

/*--------------------------------------------------------
font
-------------------------------------------------------*/
/* 改行 */
body, h1, h2, h3, h4, h5, p, th, td, li, select, input, label, dt, dd ,time ,li { 
  font-weight: normal;
  word-break: break-all;
}
/* font-size */
html { font-size: 62.5%; }/* 1em=10px */
body { font-size: 1.0rem; font-style: normal; line-height: 2; }
a { text-decoration: none; }
input, select { vertical-align: middle; }
h1,h2,h3,h4,h5,h6,p,a { margin: 0; padding: 0; border: 0; line-height: 2; font-weight: normal; }
h1 { font-size: 1.6rem; }
h2 { font-size: 2.2rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.4rem; }
h5, h6, p { font-size: 1.6rem; line-height: 2; }
th, td, li, select, input, label, dt, dd, time, li { font-size: 1.2rem; text-decoration: none; line-height: 2; }
/*--------------------------------------------------------
基本設定
-------------------------------------------------------*/
html { width: 100%; }
body { overflow-x: hidden; }
main { font-size: 0;/* inline-block横並びの子要素の不意な余白を削除 */ }
iframe { border: none; }
.box-more { display: none;/* デフォルトは隠す */ }
/*画像リンク透過*/
a:hover img,
input[type=submit]:hover,
button:hover {
  opacity: 0.8;
  filter: alpha( opacity=80 );
  -ms-filter: "alpha( opacity=80 )";
}
.btn:hover {
  opacity: 0.8;
  filter: alpha( opacity=80 );
  -ms-filter: "alpha( opacity=80 )";
}
/* --------------------------------------------------------
slidenav
-------------------------------------------------------- */
#nav-drawer {
  position: fixed;
  right: 2rem;
  top: 2.4rem;
  z-index: 100;
}
.nav-unshown {
  display: none;
}
/*icon*/
#nav-open {
  display: inline-block;
  width: 18px;
  height: 16px;
  vertical-align: middle;
}
#nav-open span {
  position: absolute;
  display: block;
}
.ico-btn i { 
  font-size: 18px;
  color: rgba(0, 0, 0, 0.45);
  font-size: 20px\0;/*ie全般用ハック*/
}
/*close_bg*/
#nav-bg {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}
/*closebtn*/
.ico-close {
  position: fixed;
  top: 2.6rem;
  right: 2rem;
  z-index: 1000;
  width: 18px;
  height: 16px;
  padding-right: inherit;
}
#nav-input:checked ~ #nav-bg {
  display: block;
  opacity: .5;
}
/*content*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 999;
  width: 80%;
  max-width: 526px;
  height: 100%;
  background: #fff;
  transition: .3s ease-in-out;
  transform: translateX(105%);
  display: none\0;/*ie全般用ハック*//*はじめは隠しておく*/
}
#nav-input:checked ~ #nav-content {
  transform: translateX(0%);/*slied*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
  display: block\0;/*ie全般用ハック*//*表示させる*/
}
/*nav_design*/
#slide_nav {
  margin-top: 5rem;
}
#slide_nav li {
  display: inline-block;
  width: 100%;
  background: #FFF url(../img/ico_right01_c.png) right 2.5rem center / 8px 13px no-repeat ;
  margin: inherit;
}
#slide_nav li a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 1.5rem 2rem;
  font-weight: bold;
  text-align: left;
}
/*SNS*/
#slide_nav ul.social-nav {
  padding: 1em;
  background-color: #f1f1f1;
  text-align: center;
  margin-top: 3rem;
}
#slide_nav ul.social-nav li {
  background-color: inherit;
  margin-top: 0;
  width: inherit;
  display: inline-block;
  vertical-align: bottom;
  vertical-align: -webkit-baseline-middle;
}
#slide_nav ul.social-nav li a {
  color: #838383;
  font-size: 2.6rem;
  padding: 1.5rem;
}
/*--------------------------------------------------------
form
-------------------------------------------------------*/
input[type="text"], 
input[type="password"],
input[type="email"], 
input[type="tel"], 
input[type="number"], 
textarea,
select {
  box-sizing: border-box;
  border: 2px solid #cbcbcb;
  border-radius: 4px;
  background: #fbfbfb;
  padding: 0.7rem 1rem;
  width: 100%;
  font-size: 1.4rem;
}
select {
  background: #e7e7e7 url(../img/ico_dd.png) right 1rem center / 8px 14px no-repeat;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
input[type="radio"] {
  font-size: 3rem;
  padding: 0;
  margin: 0 1rem 0 0;
  position: inherit;
}
label {
  padding-right:1rem;
  font-size: 1.6rem;
  line-height: 2.5rem;
  display: inline-block;
  cursor: pointer;
  margin-bottom: 0;
  font-weight: normal;
}
.check label {
  padding-left:3rem;
  font-size: 1.4rem;
  line-height: 2.5rem;
  display: inline-block;
  cursor: pointer;
  position: relative;
  margin-bottom: 0;
}
/* form focus*/
input:focus,
textarea:focus,
select:focus {
  outline: none;
  background: #f2f2f2;
}
/* submit →デザインはbtnで設定 */
input[type=submit],
input[type=button] {
  text-align: center;
  cursor: pointer;
  border: none;
  text-decoration: none;
  -webkit-appearance: none;
  width: 100%;
}
/* form sample text*/
input::-webkit-input-placeholder {color: #bcbcbc; }
input::-ms-input-placeholder {color: #bcbcbc; }
input::-moz-placeholder { color: #bcbcbc; }
input::-moz-placeholder { color: #bcbcbc; }
textarea::-webkit-input-placeholder { color: #bcbcbc; }
textarea::-ms-input-placeholder { color: #bcbcbc; }
textarea::-moz-placeholder { color: #bcbcbc; }
textarea::-moz-placeholder { color: #bcbcbc; }
iframe { border: none; }
/* form layout */
.sec_form form dl {
  width: 100%;
  margin: 0 auto;
}
.sec_form form dt,
.sec_form form dd {
  margin-bottom: .5rem;
  float: none;
  width: 100%;
}
.sec_form form dd:after {
  content: '';
  display: block;
  clear: both;
  margin-bottom: 2rem;
  width: 100%;
  margin-left: 0;
}
.sec_form form dt {
  font-size: 1.3rem;
  text-align: left;
}
.sec_form form dt span {
  font-size: 80%;
  color: #b63c3c;
}
.sec_form form dd {
}
.sec_form form  span.note {
  color: #b63c3c;
  font-size: 1.2rem;
  display: block;
  text-align: right;
  margin: 0 0 1rem 0; 
}
.sec_form form label {
  padding-left: 1rem;
  padding-right: 1rem;
}
.kakunin table {
  width: 100%;
  margin-bottom: 3rem;
}
.kakunin p {
  font-size: 1.4rem;
}
.kakunin p.error_messe {
  margin-bottom: 0 !important;
}
.kakunin .btn01 {
  width: 41%;
  margin-left: 5%;
  margin-bottom: 3rem;
  float: left;
}
.kakunin .btn02 {
  width: 41%;
  margin-right: 5%;
  margin-bottom: 3rem;
  float: right;
}
/*--------------------------------------------------------
btn
--------------------------------------------------------*/
.btn,
input.btn {
  background: #230a10;
  color: #FFFFFF;
  width: 100%;
  font-size: 1.6rem;
  font-weight: bold;
  padding: 1rem;
  border-radius: 4px;
  display: block;
  border: none;
  text-decoration: none;
  -webkit-appearance: none;
  text-align: center;
  cursor: pointer;
  line-height: 1;
}
/* pagetop */
#pagetop {
  display: none;
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  text-align:center;
  padding-top: 1.4rem;
  background-color: rgba(0, 0, 0, 0.45);
}
#pagetop img {
  width: 18px;
  height: auto;
}
/*--------------------------------------------------------
table
--------------------------------------------------------*/
/*セルの縦積み*/
table {
  width: 100%;
  border-collapse: collapse;
  border: none;
  border-bottom: solid 1px #D4D4D4;
}
tbody {
  display: table-row-group;
  vertical-align: middle;
  border-color: inherit;
}
td, th {
  box-sizing: border-box;
  display: block;
  width: 100%;
  padding: 1rem 0.7rem;
  border: solid 1px #D4D4D4;
  font-size: 1.4rem;
  line-height: 130%;
  text-align: left;
  vertical-align: middle;
  border-bottom: none;
}
th {
  background-color: #efefef;
  color: #725748;
  font-weight: bold;
}
td {
  background-color: #fff;
}
table td input[type="text"],
table td input[type="password"],
table td input[type="email"] ,
table td input[type="tel"],
table td textarea,
table select {
  width: 100%;
  max-width: 100%;
  padding: 0.7rem;
}
th.tabletitle {
  width: 100% !important;
  background-color: #e5e5e5;
  font-size: 1.6rem;
  font-weight: bold;
  padding: 2rem;
}
/*--------------------------------------------------------
breadcrumb
--------------------------------------------------------*/
#breadcrumb {
  padding: 1rem 2rem;
  width: 100%;
  margin: 0 auto;
}
#breadcrumb ol >li {
  display: inline-block;
}
#breadcrumb ol > li + li:before {
  padding: 0 5px;
  content: ">";
}
#breadcrumb a {
}
#breadcrumb a:hover,
#breadcrumb li.active a {
  text-decoration: underline;
}