@import url("common.css");
@charset "utf-8";

section{
  padding: 0;
}


body{
  background-color: #faf8f3;
}
.flex,
.sp-flex{
  display: flex;
  justify-content: space-between;
}
.pc-left,
.pc-right{
  float:none;
  margin:0 0 2rem;
  width:100%;
}
.sp-w100p{
  width: 100%;
}
.sp-mt20{
  margin-top:20px;
}
.pink{
  color:#e4007f;
}
.blue{
  color:#036EB8;
}
.nodisc{
  text-align: left;
  list-style-type: none;;
}
/* _____ wrapper _____ */
div.wrapper,
div.main-wrapper{
  width:100%;
  margin:0 auto;
  position: relative;
}
/* _____ header _____ */
header{
  position: relative;
}
header h1.logo,
footer h1.logo{
  width:230px;
  height:52px;
  overflow: hidden;
  white-space: nowrap;
  text-indent: 105%;
  background-image:url("../img/logo.png");
  background-size:100%;
  background-repeat: no-repeat;
  margin:10px;
}
footer h1.logo{
  margin:30px auto;
}
.hamburger-menu {
  width: 50px;
  height: 50px;
  position: relative;
  border: none;
  background: transparent;
  appearance: none;
  padding: 0;
  cursor: pointer;
  margin: 10px 10px 0 0;
  border: 1px solid #ddd;
  background-color:#fff;
}
.hamburger-menu__bar {
  display: inline-block;
  width: 44%;
  height: 2px;
  background: #242424;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: .5s;
}
.hamburger-menu__bar:first-child {
  top: 16px;
}
.hamburger-menu__bar:nth-child(2) {
  top: 24px;
}
.hamburger-menu__bar:last-child {
  top: 32px;
}
.hamburger-menu--open .hamburger-menu__bar {
  top: 50%;
}
.hamburger-menu--open .hamburger-menu__bar:first-child {
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.hamburger-menu--open .hamburger-menu__bar:last-child {
  transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
.hamburger-menu--open .hamburger-menu__bar:nth-child(2) {
  display: none;
}
.navigation {
  display: none;
  background: #242424;
  position: absolute;
  top: 70px;
  width: 100%;
  z-index: 9999;
}
.navigation__list {
  text-align: center;
  list-style: none;
  padding: 0;
  margin: 0;
}
.navigation__list-item {
  border-bottom: solid 1px #474747;
}
.navigation__list-item:first-child {
  border-top: solid 1px #474747;
}
.navigation__link {
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  display: block;
  padding: 15px 0;
  transition: .5s;
}
@media (hover: hover) and (pointer: fine) {
  .navigation__link:hover {
    background: #333;
  }
}

#mainvisual{
  border-top:5px solid #9fa0a0;
  border-bottom:5px solid #9fa0a0;
  background-image:url("../img/mainvisual.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}/*
#mainvisual h1{
  width: 80%;
  text-indent: 105%;
  white-space: nowrap;
  overflow: hidden;
  background-image: url("../img/mainvisual_copy.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  height: 213px;
  margin: 10px 0 20px 15px;
}*/
#mainvisual h1{
  text-align:center;
}
#mainvisual h1 img{
  width:90%;

}
#globalnavi{
  border-bottom:5px solid #9fa0a0;
}
#globalnavi ul{
  list-style-type: none;
  display: flex;
  width:100%;
  flex-wrap: wrap;
}
#globalnavi ul li{
  border-right:1px solid #9e9a98;
  width:33%;
  border-bottom:1px solid #9e9a98;
}
#globalnavi ul li:nth-child(4){
  border-left:1px solid #9e9a98;
}
#globalnavi ul li:first-child{
  border-left:1px solid #9e9a98;
}
#globalnavi ul li a{
  display: block;
  width: 100%;
  color:#9e9a98;
  text-align: center;
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
#globalnavi ul li a span{
  display: block;
  border-top: 3px solid #9e9a98;
  font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  padding-top: 5px;
  font-weight: bold;
  font-size: 1rem;
  margin: 0px 5px 5px;
}
main{
  background-image:url("../img/bg_main.jpg");
  background-position: center top;
}
div.main{
  padding-top:20px;
}
div.main h2{
  font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
  font-size: 2rem;
  background-image: url("../img/bg_h2.png");
  background-repeat: no-repeat;
  background-position: left bottom;
  color: #595656;
  background-size: contain;
  text-indent: .7rem;
  letter-spacing: 1px;
  padding: 8px 0 8px 8px;
  font-weight: bold;
  position: relative;
  margin-bottom:20px;
}
div.main h2::after{
  content: "";
  width: 96%;
  height: 3px;
  background-color: #fff;
  position: relative;
  display: block;
  left: 4%;
}
div.main h3{
  border-left:4px solid #595757;
  padding-left:1rem;
  margin-bottom:2.5rem;
  letter-spacing: 1px;;
}
div.main h4{
  color:#036EB8;
  margin-top:3rem;
  margin-bottom:1.5rem;
  letter-spacing: 1px;
}
div.main div.section{
  padding-left:1rem;
  padding-right:1rem;
  margin-bottom:4rem;
}
table.businesstime{
  border: 1px solid #898989;
  width: 100%;
  margin:20px 0;
}
table.businesstime th,
table.businesstime td{
  border: 1px solid #898989;
  padding:10px;
  background-color:#fff;
  text-align: center;
}
table.businesstime th{
  background-color: #898989;
  color:#fff;
}
div.sub{
  padding-left:1rem;
  padding-right:1rem;
  background-color: #fff;
  padding-top: 2rem;
  padding-bottom:2rem;
  text-align: center;
}
div.sub section{
  padding-left:1rem;
  padding-right:1rem;
  margin-bottom:2rem;
}

div.toggle{
  background-color:#9fa0a0;
  padding:18px;
}
div.toggle a{
  display: block;
  border:1px solid #fff;
  color:#fff;
  text-align: left;
  padding: 8px 20px;
  font-size: 3rem;
  position: relative;
}
div.toggle span{
  width: 44px;
  height: 44px;
  background-color: #fff;
  right: 10px;
  position: absolute;
  color: #9fa0a0;
  text-align: center;
  font-weight: bold;
  top: 10px;
}
div.exsample ul,
div.info ul {
  margin:2rem 0 2rem 2rem;
}
div.exsample ul li,
div.info ul li{
  margin-bottom:1.5rem;
}
div.exsample ul li a,
div.info ul li a{
  font-size:1.7rem;
  color:#595656;
  text-decoration: underline;
}
div.info ul {
  text-align: left;
  margin:2rem 0rem 0 3rem;
}
div.info ul li{
  font-weight: bold;
  font-size:1.9rem;
}
div.info ul li a{
  font-weight: normal;
  display: block;
}
div.toggle-info{
  background-color:#efaeb9;
  padding:18px;
}
.btn{
  display: block;
  background-color: #efaeb9;
  padding: 1.5rem 0;
  text-align: center;
  font-size: 2rem;
  color: #fff;
  font-weight: bold;
  border-radius: 13px;
}
nav.footer {
  padding-left:1rem;
  padding-right:1rem;
  padding-bottom:3rem;
}
nav.footer ul {
  margin-left:2.5rem;
  margin-bottom:2rem;
}
nav.footer ul li span{
  display: none;
}
ul.voice,
div.white-panel{
  background-color: #fff;
  padding:2rem;
  list-style-type: none;
  border-radius: 5px;
}
ul.voice li {
  margin-bottom:3rem;
}
ul.voice li strong{
  display:block;
  border-bottom:1px dotted #242424;
  padding-bottom: .5rem;
  margin-bottom: 1rem;
}
ul.voice li p.name{
  margin-top:1rem;
  text-align: right;
}
ul.voice li p.comment{
  border:1px solid #dfdfdf;
  padding:20px;
  margin-top:10px;
}
div.small-navi{
  margin-top:2rem;
}
div.small-navi a{
  display:block;
  background-image:url("../img/bg_arrow.png");
  background-position: left center;
  background-repeat: no-repeat;
  background-size: contain;
  text-indent: 3rem;
}
div.small-navi a:first-child{
  margin-bottom:.5rem;
}
div.white-panel dl{
 /* padding:2rem;*/
}
div.white-panel dl dt{
  text-align: center;
  background-color: #9FA0A0;
  color:#fff;
  padding:.5rem 0;
}
div.white-panel dl dd{
  text-align: center;
  margin-top:1rem;
  margin-bottom:2rem;
}
div.white-panel dl dd a{
  color:#E4007F;
  font-size:3rem;
  font-style:italic;
  font-weight: bold;
}
div.white-panel dl dd span{
  display: block;
  margin-bottom:2rem;
}

table.form th,
table.form td{
  display: block;
  font-size:1.7rem;
  font-weight: normal;
}
table.form th{
  letter-spacing: 1px;
}
table.form td{
  margin-bottom:1rem;
}
table.form td input[type="text"],
table.form td textarea{
  font-size:1.7rem;
  width: 94%;
  padding:1rem;
  border-radius: 5px;;
}
table.form td select{
  font-size:1.7rem;
  padding:1rem;
  border-radius: 5px;;
}
table.form td.preferred label{
  display: block;
  margin-bottom:.5rem;
}
table.form td input[type="submit"]{
  margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
  background-color:#efaeb9;
  color:#fff;
  padding:1rem 4rem;
  font-size:2rem;
  letter-spacing: 3px;
  border-radius: 5px;
}
/* 【スマートフォン横】 */
@media screen and (min-width: 481px) { }
/* 【タブレット縦以上】 */
@media screen and (min-width: 769px) {
  /*pc common*/
  .pc-left{
    float:left;
    margin:0 20px 20px 0;
    width:inherit;
  }
  .pc-right{
    float:right;
    margin:0 0 20px 20px;
    width:inherit;
  }
  .sp-mt20{
    margin-top:auto;
  }
  .sp-flex{
    display: block;
  }
  .pc-flex{
    display: flex;
    justify-content: space-between;
  }
  .sp-w100p{
    width: inherit;
  }
  div.wrapper{
    width:1140px;
  }
  header h1.logo,
  footer h1.logo{
    width:401px;
    height:89px;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 105%;
    background-image:url("../img/logo.png");
    background-size:100%;
    background-repeat: no-repeat;
    margin:10px;
  }
  footer h1.logo{
    margin-top:6rem;
    width:320px;
  }
  header address{
    font-size:5rem;
    text-align: right;
  }
  header address a{
    color:#595757;
    font-style: italic;
    font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;
    font-weight: bold;
  }
  header nav#headernavi ul{
    display: flex;
    list-style-type: none;
  }
  header nav#headernavi ul li{
    margin-left:1rem;
  }
  header nav#headernavi ul li a{
    color:#595757;
    text-decoration: underline;
    font-weight: bold;
  }
  #mainvisual{
    margin-top:10px;
  }
  #mainvisual h1{
    width: 1140px;
    background-size: 61%;
    background-position: left center;
    /*height: 403px;*/
    margin: 10px auto 60px;
    text-align: left;
  }
  #mainvisual h1 img {
    width: 60%;
  }
  #globalnavi ul{
    width: 1140px;
    margin:0 auto;
  }
  #globalnavi ul li a {
    font-size:1.8rem;
    padding:10px 0;
    box-sizing: border-box;
  }
  #globalnavi ul li a span{
    font-size:1.5rem;
    border-top: 5px solid #9e9a98;
    padding-top: 10px;
    margin: 0px 25px;
  }
  #globalnavi ul li a:hover,
  #globalnavi ul li.active a{
    background-color: #e6e6e7;
  }
  #globalnavi ul li{
  border-right:1px solid #9e9a98;
  width:16.5%;
  border-bottom:none;
}
#globalnavi ul li:nth-child(4){
  border-left:none;
}
  div.main-wrapper{
    width: 1140px;
    display: flex;
    justify-content: space-between;
  }
  div.main{
    width:765px;
  }
  div.main h2 {
    font-size: 2.5rem;
    text-indent: 2rem;
    letter-spacing: 1.2px;
    padding: 10px 0 10px 0;
    margin-top:30px;
    margin-bottom:20px;
  }
  div.main div.section{
    padding-left:2rem;
    padding-right:5rem;
  }
  div.sub{
    padding-left:0;
    padding-right:0;
    width:375px;
  }
  nav.footer {
    margin-top:4rem;
  }
  nav.footer ul {
    margin-left:0;
    margin-bottom:1rem;
    list-style-type: none;;
  }
  nav.footer ul li{
    font-size:1.4rem;
  }
  nav.footer ul li span{
    display: inline;
  }
  ul.voice,
  div.white-panel {
    padding:3rem;
  }
  ul.voice li {
    margin-bottom:4rem;
  }
  div.small-navi{
    display: flex;
    justify-content: end;
  }
  div.small-navi a:first-child{
    margin-right:2rem;
    margin-bottom:0;
  }
  div.white-panel dl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }
  div.white-panel dl dt {
    width:200px
  }
  div.white-panel dl dd {
    width:400px;
    margin-top:0;
    margin-bottom:0;
    text-align: left;
    text-indent: 3rem;
  }
  div.white-panel dl dd span{
    display: inline-block;
    margin-top:0;
    margin-bottom:0;
    text-indent: 1.5rem;
  }
  table.form{
    width: 100%;
  }
  table.form th,
  table.form td{
    display:table-cell;
    font-size:1.7rem;
    font-weight: normal;
    padding:1rem 1rem 1rem 0;
  }
  table.form td{
    padding:1rem 0 1rem 1rem;
  }
}