@charset "utf-8";
/* SP-First CSS */
/* --------------------------------------------------------
プリント箇所指定
-------------------------------------------------------- */
@media print {
  /* no-print */
  header,
  footer,
  #access,
  #pagetop,
  #pagetop img { display: none !important; }
    /*A4横*/
  .onepage-print p {
    width: 297mm;
    height: 200mm;
    page-break-after: always;
    font-size: 0 !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .onepage-print p img {
    width: 297mm;
    height: auto;
    margin: 0;
    padding: 0;
  }
  /*最後のページは改ページを入れない*/
  .onepage-print p.lastpage {
    page-break-after: auto;
  }
  /*safari用サイズ調整ハック*/
  _::-webkit-full-page-media, _:future, :root .onepage-print p {
    width: 267mm;
    height: 170mm;
  }
  _::-webkit-full-page-media, _:future, :root .onepage-print p img {
    width: 267mm;
  }
}
/* A4縦 */
/*  @page { size: A4; } */
/* A4横 */
@page { size: A4 landscape; } 
/* マージン設定 */
@page { margin: 0; }
/* --------------------------------------------------------
カラー
-------------------------------------------------------- */
html { background-color: #fff; }
body { /* border-top: #00427F 3px solid; */ }
/* font-color */
body { color: #231815; }
h1,h2 { color: #231815; }
/* link-highlight_SP */
a { color: #231815; }
/* link-color */
.btn,
a,
a:focus,
input[type=submit],
input[type=button],
input[type=reset],
button,
.ico-btn {
  -webkit-tap-highlight-color: rgba(255,255,255,0.3);
}
/* other-font-color */
.fc1 { color: #AB0000; }
.fc2 { color: #58361E; }
/* header */
header { background-color: #231815; }
/* footer */
footer { background-color: #231815; color: #fff; }
#box_ft_nav { background-color: #fff; }
footer .nav_ft li { border-right: 1px solid #fff; line-height: 1; }
footer .nav_ft li a,
footer ul.social-nav li a { color: #fff; line-height: 1; }
/* breadcrumb */
#breadcrumb { background-color: #ededed; }
/* contents */
section { background-color: #fff; }
section:nth-child(even) { background-color: #f2f2f2; }
/* btn */
#nav-drawer .ico-btn i { color: #cdcdcd; }
.btn,
input[type=submit] { background-color: #231815; }
.btn, .btn a { color: #fff; }
/* --------------------------------------------------------
font
-------------------------------------------------------- */
/* type */
body,
input[type="text"], input[type="password"], input[type="email"], input[type="tel"], input[type="number"], textarea, select, input[type=submit], input[type=reset], input[type=button] {
  font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  line-height: 2;
}
/* link */
a {cursor: pointer; font-weight: 600; }
a:link,
a:visited,
.btn a:hover,
a:active,
a:focus { text-decoration: none; }
a:hover,
li a:hover,
li.stay a { text-decoration: underline; }
/*画像リンク透過*/
a:hover img,
input[type=submit]:hover,
input[type=button]:hover,
input[type=reset]:hover,
button:hover,
.ico-btn:hover,
.social-nav a:hover {
  opacity: 0.85;
  filter: opacity(85%);
}
/* size */
th, td, li, select, input, label, dt, dd, time, li { font-size: 1.4rem; }
/* --------------------------------------------------------
レイアウト
-------------------------------------------------------- */
html { overflow: auto; }
body { overflow: hidden; }
section { padding: 3rem; }
section.onepage-print { padding: inherit; }
section.onepage-print p { margin-bottom: inherit !important; }
/* --------------------------------------------------------
header
-------------------------------------------------------- */
header h1 a {
  display: block;
  text-indent:100%;
  white-space: nowrap;
  overflow: hidden;
  width: 86px;
  height: 86px;
  background: url(../img/logo_hd.png) top left no-repeat;
  background-size:100% 100%;
  margin: 3rem auto;
}
/* --------------------------------------------------------
breadcrumb
-------------------------------------------------------- */
/* --------------------------------------------------------
access
-------------------------------------------------------- */
/* address */
address {
  padding: 5rem 3rem;
  text-align: center;
  background: #fbfbfb;
}
address h2 {
  line-height: 1.2;
  padding-bottom: 2rem;
}
address h2 span {
  display: block;
  margin-left: -1.5rem;
}
address p { text-align: left; }
address th,
address td {
  display: block;
  background-color: inherit;
  border: inherit;
  font-size:1.5rem;
  padding: 2rem 1rem 0;
  color: #231815;
}
address table th { width: 100%; }
address table td { width: 100%; }
address table {
  /* border-top: solid 1px #D4D4D4; */
  border-bottom: inherit;
}
address td {
  padding: 2rem 1rem 2rem;
}
/* map */
#map {
  width: 100vw;
  position: relative;
  font-size: 0;
}
#map .btn {
  position: absolute;
  bottom: 3rem;
  right: 6rem;
  padding: 1rem 2rem;
  width: auto;
  margin: inherit;
}
#map .btn:hover {
  opacity: 1;
  filter: opacity(100%);
  background-color: #423e3f;
}
/* --------------------------------------------------------
footer
-------------------------------------------------------- */
footer {
  font-size:1.3rem;
}
footer #logo {
  margin: 4rem auto 2rem;
  text-align: center;
}
footer a:hover {
  text-decoration: underline;
}
footer #logo img {
  width: 60px;
  height: auto;
}
/* footer-nav */
footer .nav_ft {
  margin-bottom: 2rem;
  text-align: center;
}
footer .nav_ft li {
  display: inline-block;
  padding-right: 1.2rem;
  border-right: 1px solid;
  margin-right: 1.2rem;
}
footer .nav_ft li:last-child {
  padding-right: inherit;
  border-right: inherit;
  margin-right: inherit;
}
#box_ft_nav {
  padding: 1.5rem 0 1rem;
}
/*SNS*/
footer ul.social-nav {
  text-align: center;
  margin-top: 3rem;
}
footer ul.social-nav li {
  display: inline-block;
  vertical-align: bottom;
  vertical-align: -webkit-baseline-middle;
}
footer ul.social-nav li a {
  padding: 1.5rem 1rem;
  font-size: 2.6rem;
}
/* copy */
footer p {
  text-align: center;
  padding: 1.5rem;
  font-size: 1.15rem;
}
/* --------------------------------------------------------
main
-------------------------------------------------------- */
main h2,
main p {
  text-align: center;
  margin-bottom: 3rem;
  max-width: 100%;
}
/* ----------------------------------------------------------------------------------------------
PC START
---------------------------------------------------------------------------------------------- */
/* --------------------------------------------------------
base layout
-------------------------------------------------------- */
@media screen and (min-width : 768px) {/* for all desktop PC */
  #wrapper {
    margin: 0 auto;
    width: 1024px;
    min-height: 100%;
  }
  #header-in,
  #breadcrumb ol,
  #footer-in,
  footer p {
    margin: 0 auto;
    width: 1024px;
  }
  main.w-all {
    width: 1024px;
    height: 100%;
    min-height: 100%;
    float: none;
  }
}
  @media screen and (max-width: 1980px) and (min-width: 1481px) {/* for  desktop PC */
  #wrapper,
  #header-in,
  #breadcrumb ol,
  #footer-in,
  footer p,
  main.w-all {
    width: 1300px;
    margin: 0 auto;
    display: block;
  }
}
  @media screen and (max-width: 1480px) and (min-width: 1200px) {/* for  note PC */
  #wrapper,
  #header-in,
  #breadcrumb ol,
  #footer-in,
  footer p,
  main.w-all {
    width: 1100px;
    margin: 0 auto;
    display: block;
  }
}
  @media screen and (max-width: 1199px) and (min-width: 992px) {/* for small note PC */
  #wrapper,
  #header-in,
  #breadcrumb ol,
  #footer-in,
  footer p,
  main.w-all {
    width: 900px;
    margin: 0 auto;
    display: block;
  }
}
@media screen and (max-width: 991px) and (min-width: 768px) {/* for 縦 ipad&tablet */
  #wrapper,
  #header-in,
  #breadcrumb ol,
  #footer-in,
  footer p,
  main.w-all {
    width: 730px;
    margin: 0 auto;
    display: block;
  }
}
@media screen and (min-width : 768px) {/* for PC 共通↓ */
  section,
  section.onepage-print {
    margin: 0px -500%;
    padding: 3rem 500%;
    display: block;
  }
/* --------------------------------------------------------
access
-------------------------------------------------------- */
  /* address */
  address h2 {
    padding-top: 2rem;
  }
  address p { text-align: center; }
  address table {
    width: 60%;
    margin: 0 auto;
  }
  address th,
  address td {
    display: inline-block;
    background-color: inherit;
    border: inherit;
    font-size:1.5rem;
    padding: 2rem;
  }
  address table th { width: 30%; }
  address table td { width: 70%; }
  address table.pain3 th { width: 25%; display: inline-block; }
  address table.pain3 td.td1 { width: 30%; display: inline-block; }
  address table.pain3 td.td2 { width: 44%; display: inline-block; }

/* --------------------------------------------------------
table
-------------------------------------------------------- */
  table th { width: 30%; }
  table td { width: 70%; }
/*--------------------------------------------------------
btn
--------------------------------------------------------*/
  .btn,
  input.btn {
    width: 40%;
    margin: 0 auto 3rem;
  }
/*--------------------------------------------------------
form
-------------------------------------------------------*/
.sec_form form {
   width: 80%;
   max-width: 880px;
   margin: 0 auto;
  } 
  .kakunin table th,
  .kakunin table td {
    width: 100%;
  }
  .kakunin .btn01 input.btn,
  .kakunin .btn02 input.btn  {
  width: 100%;
  }
/* ----------------------------------------------------------------------------------------------
PC END
---------------------------------------------------------------------------------------------- */
}
/* ----------------------------------------------------------------------------------------------------------------
hack
---------------------------------------------------------------------------------------------------------------- */
@media screen and (min-width : 768px) {/* for PC */
/*--------------------------------------------------------
//IE用のハックは下記の様に要素の最後に＼0を付ける（unicode）
CSSの文字コードがShift-JISの場合はバックスラッシュが円マークになるので¥0を付ける
------------------------------------------------------*/
  #body { background: none\9;/*ie8以下ハック*/}
  #body:not(:target) { background: none\9;/*ie9のみハック*/}
  #body { background: none\0;/*ie全般用ハック*/}
  address table th { width: 28%\0;/*ie全般用ハック*/}
}