@charset "UTF-8";
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em,img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i,center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption,tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,figure, figcaption, footer, header, hgroup, menu, nav, output, ruby,section, summary, time, mark, audio, video, input {
  font-family: ryo-gothic-plusn, sans-serif;
}

.sp {
  display:block;
}

.pc {
  display: none;
}

img {width: 100%;}


/*header
---------------------------------------------------------- */
header .inr {
  position: relative;
  height: 70px;
}
header .logo {
  height: 30px;
  margin-left: 20px;
}
header .logo img {
  width: auto;
  height: 100%;
}

header .menu {
  position: fixed;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;;
  transition: .3s;
  z-index: 30;
}
header .menu div {
  position: relative;
  width: 24px;
  height: 17px;
  transition: all .4s;
}
header .menu div span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: #4e4641;
  border-radius: 3px;
  transition: all .4s;
}
header .menu div span:nth-child(1) { top:0;}
header .menu div span:nth-child(2) { top:7px;}
header .menu div span:nth-child(3) {top:14px;}

/* nav open */
header .close div span {background-color: #fff;}
header .close div span:nth-of-type(1) {
  -webkit-transform: translateY(8.5px) rotate(-45deg);
  transform: translateY(8.5px) rotate(-45deg);
}
header .close div span:nth-of-type(2) {  opacity: 0;}
header .close div span:nth-of-type(3) {
  -webkit-transform: translateY(-6px) rotate(45deg);
  transform: translateY(-6px) rotate(45deg);
}

header nav {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  overflow-y: scroll;
  background: rgba(78,70,65,0.9);
  z-index: 20;
}

header nav ul {
  flex-direction: column;
  justify-content: center;
  width: 100%;
  height: 100vh;
  margin: 0 ;
  text-align: center;
}
header nav ul li {
  margin: 10px 0;
}

header nav a {
  display: block;
  width: 100%;
  padding: 20px 0;
  color: #fff;
  font-size: 2.0rem;
}


/*main
---------------------------------------------------------- */
main {padding-top: 70px;}

.block {
  width: calc(100% - 40px);
}

.txt_area p {
  margin-bottom: 15px;
  line-height: 1.75;
  font-size: 1.3rem;
  font-weight: 400;
}
.btn a {
  font-weight: 400;
}


/*----------------------------------------
  title
----------------------------------------*/
.page_ttl {
  height: 100px;
  margin-bottom: 30px;
}
.page_ttl span {
  letter-spacing: 0.05em;
  font-size: 2.6rem;
}
.page_ttl:after {
  content: "";
  display: none;
}

.ttl01 {
  margin-bottom: 20px;
  line-height: 1.6;
  letter-spacing: 0.075em;
  font-size: 2.4rem;
}
.ttl01 span {font-size: 1.0rem}

.ttl02 {
  margin: 20px 0;
  padding-bottom: 5px;
  font-size: 2.0rem;
  background-size: 95.5px auto;
}


/*  top page
---------------------------------------------------------- */
.main_img {
  margin-top: 70px;
  height: auto;
}
.main_img .txt {
  margin:  50px 10px;
}
.main_img .txt h2 {
  margin-bottom: 20px;
  letter-spacing: 0;
  font-size: 2.6rem;
}
.main_img .txt p {
  line-height: 1.7;
  letter-spacing: 0.025em;
  font-size: 1.2rem;
  font-weight: 700;
}

.main_img:before {
  left: 10px;
  width: 87.5px;
  height: 108px;
  background-size: cover;
  opacity: 0.8;
}
.main_img:after {
  width: 115.5px;
  height: 76px;
  background-size: cover;
  opacity: 0.8;
}

/*----------------------------------------
  concept
----------------------------------------*/
.concept {
  padding: 50px 0 120px;
}
.concept:before {
  width: 108px;
  height: 277.5px;
  background-size: cover;
}
.concept:after {
  width: 110px;
  height: 86.5px;
  background-size: cover;
  bottom: 70px;
}

.concept .txt_area {
  text-align: left;
}
.concept .txt_area p br {display: none;}

/*----------------------------------------
  profile
----------------------------------------*/
.profile:before {
  width: 136px;
  height: 162px;
  background: url(../img/top/img_profile_sp.png) no-repeat center;
  background-size: cover;
  top: 100px;
  left: auto;
  right: 0;
  margin: 0;
}
.profile .block {
  overflow:inherit;
  padding: 0 0 30px;
}
.profile .ph {
  top: -70px;
  left: 50%;
  width:280px;
  margin-left: -140px;
}

.profile .txt_area {
  float: none;
  width: 100%;
  padding: 330px 0 20px;
  margin:0 0 0;
  background: transparent;
}
.profile .txt_area h2 {  text-align: center;}
.profile .txt_area p {
  font-size: 1.3rem;
  line-height: 2;
}

/*----------------------------------------
  about
----------------------------------------*/
.about {
  padding: 40px 0;
  background-size: 141.5px auto;
}
.about .inr {
  margin: 0 auto 20px;
  padding: 30px;
}
.about ul li {
  flex-wrap: wrap;
  margin-bottom: 8px;
  font-size: 1.5rem;
  line-height: 1.25em;
}
.about ul li span {
  display: block;
  font-size: 1.2rem;
}

.about p {
  text-align: center;
  font-size: 1.1rem;
}

/*  about page
---------------------------------------------------------- */
.cor .about_01 {
  margin-bottom: 40px;
}
.cor .about_01 [data-ruby]::before {
  display: none;
}
.cor .about_01 [data-ruby]::after {
  content: attr(data-ruby);
  margin: 0 2px;
  font-size: 7px;
  letter-spacing: 0;
  color: #888;
}

.cor .about_02 {
  padding: 20px 0 30px;
}
.cor .about_02 .img_block {
  margin-bottom: 20px;
  border: none;
}

.lum-close-button {display: none;}


/*  contact page
---------------------------------------------------------- */
.cor .contact p {
  margin-bottom: 15px;
  text-align: left;
  line-height: 1.7;
  font-size: 1.4rem;
  font-weight: 700;
}
.cor .contact p br {display: none;}

.cor .contact .notice {
  width: 100%;
  margin-bottom: 20px;
}
.cor .contact .notice li {
  margin-bottom: 10px;
  line-height: 1.5;
  font-size: 1.2rem;
  font-weight: 400;
}

.cor .contact .btn_area {
  flex-direction: column;
  align-items: center;
}
.cor .contact .btn_area li {
  width: 100%;
  height: 100px;
  margin: 0 0 15px;
  padding:0;
  box-sizing: border-box;
}
.cor .contact .btn_area li:nth-child(2) p {
  justify-content: center;
  text-align: center;
  font-size: 2.8rem;
}
.cor .contact .btn_area li:nth-child(2) p:before {
  width: 32px;
  height: 32px;
}


/*footer
---------------------------------------------------------- */
footer {
  background-position: 10px 0;
  background-size: 57.5px auto;
}
footer .inr {
  width: calc(100% - 40px);
  padding-top: 30px;
}

footer h3 {
  width: 11em;
  margin: 0 auto 20px;
  font-size: 2.4rem;
}
footer p {
  margin-bottom: 30px;
  font-size: 1.2rem;
}

footer ul {
  flex-direction: column;
  align-items: center;
  margin-bottom: 0;
}
footer ul li {
  display: block;
  max-width: 335px;
  width: 100%;
  margin-bottom: 15px;
}

footer ul li.sp p:before {
  content: "";
  background: url(../img/ico_tel_sp.png) no-repeat;
  background-size: cover;
}

footer p.sp {
  font-size: 1.4rem;
  font-family: fot-tsukubrdgothic-std, sans-serif;
  font-weight: 700;
  font-style: normal;
}

footer .txt { flex-direction:column;}
footer .txt .trade {
  padding: 0;
  margin-bottom: 15px;
}
footer .txt .copy {padding: 0;}