/*layout*/
@charset "utf-8";

.contents-width-m { width: 90%; max-width: 1200px;  margin: 0 auto; }
.contents-width { width: 90%; max-width: 940px;  margin: 0 auto; }
.contents-width-s { width: 90%; max-width: 960px;  margin: 0 auto; }


.conts-section { padding: 80px 0; }
.conts-section-t { padding-top: 80px; }

@media screen and (max-width: 900px) {
  .conts-section { padding: 50px 0; }
  .conts-section-t { padding-top: 50px; }
}

.header .inner { display: flex; justify-content: space-between; padding: 45px 0 55px; border-bottom: 1px solid #8E8E8E; align-items: flex-start; }
.header .sitename { font-size: 3.5rem; font-family: 'Cormorant Garamond', serif; text-transform: uppercase; font-weight: 500; line-height: 1; }
.header .sitename img { width: 200px; height: auto; }

.btn-hamburger { display: none; }
.g-navi { display: flex; }
.g-navi > li:not(:last-child) { margin-right: 4em; }
.g-navi .mainmenu { text-transform: uppercase; font-size: .85rem; }
.g-navi .submenu { font-size: .8375rem;   margin-top: .5em; line-height: 1.5; }


@media screen and (max-width: 900px) {
  .header .inner { padding: 20px 0; position: relative; }
  .header .sitename { font-size: 2.2rem; width: fit-content; display: block; margin: 0 auto; }
  .header .sitename img { width: 150px; }
  .g-navi-wrap {opacity: 0; position: fixed; inset: 0; margin: auto; background: #FFF; z-index: 9; display: block; pointer-events: none; }
  
  .btn-hamburger { display: block; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; width: 22px; height: 22px; background: none; border: none; white-space: nowrap; text-indent: 200%; overflow: hidden; z-index: 99; }
  .btn-hamburger::before,
  .btn-hamburger::after { content: ''; width: 100%; height: 2px; display: block; background: #000; position: absolute; inset: 0; margin: auto; }
  
  .btn-hamburger::before { transform: translateY(-8px); box-shadow: 0 8px 0 #000;  }
  .btn-hamburger::after { transform: translateY(8px); }
  
  .btn-hamburger.open::before { transform: rotate(45deg); box-shadow: none; }
  .btn-hamburger.open::after { transform: rotate(-45deg); }
  
  .open .g-navi-wrap { display: block; pointer-events: all; opacity: 1; }
  .g-navi { display: grid; grid-template-columns: 1fr; gap: 2rem;  padding: 8rem 8% 3em; ; }
}
.footer { margin-bottom: 120px; margin-top: 60px;  }
.footer .inner { display: flex; justify-content: space-between;  border-top: 1px solid #8E8E8E; border-bottom: 1px solid #8E8E8E; padding: 1.125rem 0; }


.footer .newsletter { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: 450px; max-width: 100%; font-size: 0.6875rem; }
.footer .newsletter .msg {  line-height: 1.3;  }
.footer .newsletter .title { font-size: 0.8125rem; margin-bottom: .5em; text-transform: uppercase; }

.footer .newsletter .label { display: block; }
.footer .newsletter .form input { width: 100%; display: block; border: 1px solid #DBDBDB; padding: .5em; margin-top: .5em; }


.foot-sns p { font-size: .825rem; }
.foot-sns .list { display: flex;}
.foot-sns .list > li:not(:last-child) { margin-right: 10px; }
.foot-sns .list img { width: 25px; height: 25px; display: block; filter: invert(1); }



.copyright { margin-top: 1em; font-size: .625rem; text-align: right; display: block; }

@media screen and (max-width: 900px) {
  .footer { margin-bottom: 30px; }
  .footer .inner { display: block; }
  
  .footer .newsletter { grid-template-columns: 1fr; margin-bottom: 2em; }
  
  .foot-sns .list > li:not(:last-child) { margin-right: 12px; }
  .foot-sns .list img { width: 30px; height: 30px; }

}
