body {
/*  background: url(../img/sp_index.jpg) center top no-repeat;*/
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Sogoe UI", Verdana, "メイリオ", Meiryo, sans-serif;
}


section {
  margin: 0;
  padding: 0;
}


img {
  max-width: 100%;
}


.onlyPC {
  display: none;
}




/*==================================================
  TOP - MV
==================================================*/
#top {
  position: relative;
  height: 184vw;
  overflow: hidden;
}


#top .logo {
  padding: 8.3vw 5.3vw;
}
#top .logo img {
  width: 32.4vw;
}


#top .mv {
  position: absolute;
  top: 52vw;
  left: 40vw;
  width: 60vw;
  height: 106.93vw;
  overflow: hidden;
}
#top .mv img {
  position: absolute;
  top: 0;
  left: 0;
  transition-duration: 1.25s;
  width: 100%;
  height: 106.93vw;
  object-fit: cover;
  object-position: center;
}
#top .mv img.__fade {
  transform: scale(1.08);
  opacity: 0;
}


#top .ttl {
  position: absolute;
  top: 28.4vw;
  left: 0.8vw;
}
#top .ttl img {
  width: 98.6vw;
}


#top .suit {
  position: absolute;
  bottom: 0;
  left: 3vw;
  width: 60vw;
}
#top .suit img {
  position: absolute;
  bottom: 0;
  left: 0;
  width: auto;
  height: 91.2vw;
  transition-duration: .75s;
}
#top .suit img.__fade {
  opacity: 0;
}


#top .catch {
  position: absolute;
  top: 59.6vw;
  left: 5.3vw;
}
#top .catch img {
  width: 29.2vw;
}


#top .spec {
  position: absolute;
  top: 173.7vw;
  left: 60.5vw;
  color: #cccccc;
  font-size: 1.9vw;
  line-height: 1.7;
}




/*==================================================
  MESSAGE
==================================================*/
#message {
  padding-top: 13.8vw;
  text-align: center;
}


#message h2 img {
  margin-left: -1vw;
  width: 60.27vw;
}


#message p {
  margin-top: 6vw;
  padding-bottom: 12.2vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: 500;
  letter-spacing: 0.5vw;
  line-height: 2.25;
}


#message > div {
  margin-top: 0;
  padding: 6vw 0 12vw;
  background: url(../img/bg_gray.png) left top repeat-y;
  background-size: 50%;
}
#message > div > div {
  margin: 6vw auto 0;
}
#message > div > div + div {
  margin-top: 12vw;
}
#message > div > div h3 {
  font-size: 3.73vw;
}
#message > div > div p {
  margin-top: 5.2vw;
  padding: 0 14vw;
  font-feature-settings: 'palt';
  font-size: 3.2vw;
  letter-spacing: 0.3vw;
  line-height: 1.75;
  text-align: justify;
}


/*==================================================
  ORDER SUIT
==================================================*/
#order {
  padding-top: 125.50vw;
  padding-bottom: 22vw;
  background:
    url(../img/kv_ordersuit_sp.jpg) center top no-repeat,
    url(../img/bg_gray.png) left top repeat-y;
  background-size: 100%, 50%;
  text-align: center;
}

#order h2 img {
  margin-left: 0;
  width: 84.67vw;
}


#order h3 {
  margin-top: 9.1vw;
  margin-left: 8px;
  font-size: 5.6vw;
  font-weight: normal;
  letter-spacing: 2px;
}


#order p {
  margin-top: 8.8vw;
  padding-bottom: 6.92vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: 500;
  letter-spacing: 2px;
  line-height: 2.22;
}




/*==================================================
  FABRIC
==================================================*/
#fabric {
  position: relative;
  background: url(../img/bg_gray.png) left top repeat-y;
  background-size: 50%;
}


#fabric .kv {
  text-align: center;
}
#fabric .kv img {
  width: 72.13vw;
}


#fabric .text-block {
  margin: 14vw auto 0;
  width: 90vw;
}

#fabric .text-block h2 img {
  width: 54.53vw;
}

#fabric .text-block h3 {
  margin: 8.7vw 0 0 0;
  font-feature-settings: 'palt';
  font-size: 7.73vw;
  font-weight: normal;
  letter-spacing: 0.8vw;
  line-height: 1.31;
}

#fabric .text-block p {
  margin: 7.3vw 2.4vw 0 0.4vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: normal;
  letter-spacing: 0.2vw;
  line-height: 1.95;
}

#fabric .text-block figure {
  margin-top: 6vw;
}
#fabric .text-block figure img {
  width: 54vw;
  height: 32vw;
  object-fit: cover;
}

#fabric .point {
  margin-top: 14vw;
  padding: 14vw 14vw;
  background-color: #e5e9ee;
}

#fabric .point > div {
  position: relative;
  width: 100%;
}
#fabric .point > div:nth-child(n+2) {
  margin-top: 12vw;
}
#fabric .point > div::before {
  position: absolute;
  top: -4vw;
  left: -4vw;
  content: '';
  display: inline-block;
  width: 13.46vw;
  height: 13.46vw;
  background: url(../img/fig_point1.png) no-repeat;
  background-size: contain;
  z-index: 2;
}
#fabric .point > div:nth-child(2)::before {
  background-image: url(../img/fig_point2.png)
}
#fabric .point > div:nth-child(3)::before {
  background-image: url(../img/fig_point3.png)
}


#fabric .point > div p {
  margin-top: 5.2vw;
  font-feature-settings: 'palt';
  font-size: 3.2vw;
  letter-spacing: 0.3vw;
  line-height: 1.75;
  text-align: justify;
}


#fabric p.spec {
  margin: 8vw 0 0 1vw;
  color: #b4b6b7;
  font-size: 2.93vw;
  letter-spacing: 1px;
  line-height: 1.64;
  word-wrap: break-all;
  overflow-wrap: break-all;
}


/*==================================================
  MANUFACTURING
==================================================*/
#manufacturing {
  position: relative;
  margin-top: 30.8vw;
  padding-bottom: 28vw;
}
#manufacturing::before {
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100vw;
  background: url(../img/bg_gray.png) right top repeat-y;
  background-size: 50%;
  z-index: -1;
}


#manufacturing h2 {
  text-align: center;
}
#manufacturing h2 img {
  margin-left: -4.1vw;
  width: 84.8vw;
}


#manufacturing .kv {
  margin: 10vw auto 0;
  width: 100%;
  height: 61.33vw;
  background: url(../img/kv_manufacturing_sp.jpg) center no-repeat;
  background-size: cover;
}



#manufacturing .text-block {
  margin: 9.6vw auto 0;
  width: 90vw;
}

#manufacturing .text-block h3 {
  margin: 8.7vw 0 0 0;
  font-feature-settings: 'palt';
  font-size: 7.73vw;
  font-weight: normal;
  letter-spacing: 0.8vw;
  line-height: 1.31;
}

#manufacturing .text-block p {
  margin: 7.3vw 2.4vw 0 0.4vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: normal;
  letter-spacing: 0.2vw;
  line-height: 1.95;
  text-align: justify;
}



#manufacturing .photo-block {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  margin: 12.4vw -3vw 0;
}
#manufacturing .photo-block img {
  margin: 3vw;
  width: 25.73vw;
}




/*==================================================
  SHOP
==================================================*/
#shop {
  background: url(../img/bg_gray.png) right top repeat-y;
  background-size: 50%;
}


#shop .kv {
  margin: 0 auto;
  width: 72vw;
  height: 104.8vw;
  background: url(../img/kv_shop.jpg) center no-repeat;
  background-size: cover;
  z-index: 10;
}


#shop .text-block {
  margin: 16.2vw auto 0;
  width: 90vw;
}

#shop .text-block h2 img {
  width: 40.13vw;
}

#shop .text-block h3 {
  margin: 8.7vw 0 0 -1vw;
  font-feature-settings: 'palt';
  font-size: 7.73vw;
  font-weight: normal;
  letter-spacing: 0;
  line-height: 1.31;
}

#shop .text-block p {
  margin: 7.3vw 2.4vw 0 0.4vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: normal;
  letter-spacing: 0.2vw;
  line-height: 1.95;
  text-align: justify;
}


#shop .flow {
  position: relative;
  margin-top: 17vw;
  width: 100vw;
  height: 111.33vw;
  background-color: #e5e9ee;
  overflow: hidden;
}

#shop .flow h3 {
  position: absolute;
  padding: 15.4vw 1vw 0 5.3vw;
  height: 100%;
  background: rgba(229, 233, 238, 0.75);
  z-index: 2;
}
#shop .flow h3 img {
  width: 3.6vw;
}

#shop .flow .flow-wrap {
  position: absolute;
  top: 16vw;
  left: 14.2vw;
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  transition-duration: .75s;
}
#shop .flow .flow-wrap.__flow1 { left: 14.2vw;}
#shop .flow .flow-wrap.__flow2 { left: -56.37vw;}
#shop .flow .flow-wrap.__flow3 { left: -126.94vw;}
#shop .flow .flow-wrap.__flow4 { left: -197.51vw;}
#shop .flow .flow-wrap.__flow5 { left: -268.08vw;}
#shop .flow .flow-wrap.__flow6 { left: -338.15vw;}

#shop .flow .flow-wrap > div {
  position: relative;
  width: 61.33vw;
}
#shop .flow .flow-wrap > div:not(:first-child) {
  margin-left: 9.2vw;
}
#shop .flow .flow-wrap > div::before {
  position: absolute;
  top: -3.2vw;
  left: -3.2vw;
  content: '';
  display: inline-block;
  width: 12.27vw;
  height: 12.27vw;
  background: url(../img/fig_num1.png) no-repeat;
  background-size: contain;
  z-index: 2
}
#shop .flow .flow-wrap > div:nth-child(2)::before { background-image: url(../img/fig_num2.png);}
#shop .flow .flow-wrap > div:nth-child(3)::before { background-image: url(../img/fig_num3.png);}
#shop .flow .flow-wrap > div:nth-child(4)::before { background-image: url(../img/fig_num4.png);}
#shop .flow .flow-wrap > div:nth-child(5)::before { background-image: url(../img/fig_num5.png);}
#shop .flow .flow-wrap > div:nth-child(6)::before { background-image: url(../img/fig_num6.png);}

#shop .flow .flow-wrap dl {
  margin-top: 5vw;
}
#shop .flow .flow-wrap dl dt {
  font-size: 3.73vw;
  font-weight: bold;
}
#shop .flow .flow-wrap dl dd {
  margin-top: 1vw;
  font-size: 3.2vw;
  line-height: 1.75;
  text-align: justify;
}


#shop .flow .flow-dot {
  position: absolute;
  top: 93vw;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 0;
}
#shop .flow .flow-dot li {
  display: inline-block;
  width: 1.87vw;
  height: 1.87vw;
  border-radius: 50%;
  background-color: #b7c3d0;
  cursor: pointer;
}
#shop .flow .flow-dot li:not(:first-child) {
  margin-left: 2vw;
}
#shop .flow .flow-dot li.__current {
  background-color: #002b56;
}




/*==================================================
  MODEL
==================================================*/
#model {
}


#model .title-block {
  margin: 0 auto;
  padding-top: 31.3vw;
  width: 90vw;
}

#model .title-block h2 {
}
#model .title-block h2 img {
  width: 56.93vw;
}

#model .title-block p {
  margin-top: 8vw;
  width: 89.6vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: normal;
  letter-spacing: 0.2vw;
  line-height: 1.95;
}


#model .photo-block {
  display: flex;
  flex-wrap: wrap;
  margin: 0 auto;
  padding-top: 14vw;
  width: 89.33vw;
}

#model .photo-block > div {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

#model .photo-block > div:not(:first-child) {
  margin-top: 6vw;
}

#model .photo-block > div figure {
  width: 42vw;
}

#model .photo-block > div dl {
  padding: 6.2vw 0 0 6.2vw;
  width: 46vw;
}

#model .photo-block > div dl dt {
  font-feature-settings: 'palt';
  font-size: 4.27vw;
  font-weight: bold;
  letter-spacing: 0.5vw;
  line-height: 1.31;
}

#model .photo-block > div dl dd {
  margin-top: 2.7vw;
  width: 34vw;
  font-feature-settings: 'palt';
  font-size: 3.2vw;
  font-weight: normal;
  letter-spacing: 0.1vw;
  line-height: 1.75;
  text-align: justify;
}

#model .photo-block > div:nth-child(even) figure {
  order: 2;
}
#model .photo-block > div:nth-child(even) dl {
  padding: 6.2vw 3.2vw;
}


/*==================================================
  FORMAL
==================================================*/
#formal {
  margin-top: 18vw;
  padding: 109.3vw 0 14.5vw;
  width: 100%;
  background: #000 url(../img/img_formal_sp.jpg) center top no-repeat;
  background-size: 100%;
}


#formal .text-block {
  margin: 0 auto;
  width: 90vw;
}

#formal .text-block h2 img {
  width: 65.2vw;
}

#formal .text-block h3 {
  margin: 9.5vw 0 0 0;
  color: #fff;
  font-feature-settings: 'palt';
  font-size: 7.73vw;
  font-weight: normal;
  letter-spacing: 0.8vw;
  line-height: 1.31;
}

#formal .text-block p {
  margin: 7.3vw 2.4vw 0 0.4vw;
  color: #fff;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  font-weight: normal;
  letter-spacing: 0.2vw;
  line-height: 1.95;
  text-align: justify;
}




/*==================================================
  RESERVE
==================================================*/
#reserve {
  padding: 16vw 0;
  background-color: #fff;
}


#reserve div {
  margin: 0 auto;
  padding: 16.4vw 8vw;
  width: 89.33vw;
  border: 8px solid #000;
}

#reserve div h2  {
  text-align: center;
}
#reserve div h2 img {
  margin-left: -1vw;
}

#reserve div p {
  margin-top: 6.6vw;
  font-feature-settings: 'palt';
  font-size: 3.73vw;
  letter-spacing: 0.8px;
  line-height: 2;
}

#reserve div p a {
  color: #000;
  text-decoration: none;
  font-size: 2.93vw;
}

#reserve div nav {
  text-align: center;
}
#reserve div nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 6vw;
  width: 61.33vw;
  height: 13.33vw;
  background: #000 url(../img/ico_blank.png) right 4vw center no-repeat;
  background-size: 3.3vw;
  color: #fff;
  font-size: 3.2vw;
  font-weight: bold;
  letter-spacing: 1px;
  text-decoration: none;
}




/*==================================================
  BACK TO TOP
==================================================*/
.back-to-top a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 53.33vw;
  background: url(../img/bg_backtotop.png) center repeat;
  background-size: 150%;
}
.back-to-top a img {
  width: 61.33vw;
}




/*==================================================
  COPYRIGHT
==================================================*/
.copyright {
  padding: 5.47vw;
  text-align: center;
  background-color: #fff;
}
.copyright img {
  width: 72.27vw;
}




/*==================================================
  MENU
==================================================*/
footer {
  position: relative;
}



.nv-reserve {
  position: fixed;
  bottom: -200px;
  right: 0;
  width: 58.67vw;
  height: 16vw;
  background-size: 100%;
  z-index: 5;
  transition-duration: 0.75s;
}
.nv-reserve.__fix {
  bottom: 0;
}
.nv-reserve img {
  width: 100%;
  transition-duration: .3s;
}




#gnv a.nv-menu {
  position: fixed;
  top: 5vw;
  right: 4.8vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 52px;
  height: 52px;
  z-index: 10;
  cursor: pointer;
}

#gnv a.nv-menu span {
  display: block;
  width: 16px;
  height: 2px;
  margin-left: -4px;
  background: #666666;
  z-index: 100;
}
#gnv a.nv-menu::before {
  position: absolute;
  top: 19px;
  left: 16px;
  content: '';
  display: inline-block;
  width: 20px;
  height: 2px;
  background: #666666;
  transition-duration: .2s;
  z-index: 101;
}
#gnv a.nv-menu::after {
  position: absolute;
  bottom: 19px;
  left: 16px;
  content: '';
  display: inline-block;
  width: 20px;
  height: 2px;
  background: #666666;
  transition-duration: .2s;
  z-index: 101;
}

.__isMenu #gnv a.nv-menu {
 top: 6vw; 
}
.__isMenu #gnv a.nv-menu span {
  margin-left: 0;
  width: 52px;
  height: 52px;
  border: 2px solid #e2e2e2;
  border-radius: 50%;
  background: none;
  transition-duration: .2s;
}
.__isMenu #gnv a.nv-menu::before {
  transform: rotate(30deg) translate(4px, 4px);
}
.__isMenu #gnv a.nv-menu::after {
  transform: rotate(-30deg) translate(4px, -5px);
}

#gnv > div {
  z-index: 10;
  position: fixed;
  top: -100vh;
  left: 0;
  display: flex;
  align-items: center;
  width: 100vw;
  height: 100vh;
  background-color: #fff;
}
.__isMenu #gnv > div {
  top: 0;
}

.__isMenu #gnv > div .logo {
  position: absolute;
  top: 8.3vw;
  left: 5.3vw;
  z-index: 50;
}
.__isMenu #gnv > div .logo img {
  width: 32.4vw;
}

.__isMenu #gnv > div ul {
  margin-left: 10.4vw;
}
.__isMenu #gnv > div ul li {
  margin-top: 4vh;
}
.__isMenu #gnv > div ul li:nth-child(1) a img { width: 29.01vw}
.__isMenu #gnv > div ul li:nth-child(2) a img { width: 55.71vw}
.__isMenu #gnv > div ul li:nth-child(3) a img { width: 68.77vw}
.__isMenu #gnv > div ul li:nth-child(4) a img { width: 40.15vw}
.__isMenu #gnv > div ul li:nth-child(5) a img { width: 81.07vw}
.__isMenu #gnv > div ul li:nth-child(6) a img { width: 32.66vw}
.__isMenu #gnv > div ul li:nth-child(7) a img { width: 45.45vw}
.__isMenu #gnv > div ul li:nth-child(8) a img { width: 59.17vw}
.__isMenu #gnv > div ul li:nth-child(9) a img { width: 68.00vw}


@media (max-height: 700px) and (min-width: 500px) {
  #gnv .logo {
    display: none;
  }
}


body.__isMenu {
  height: 100vh;
  overflow: hidden;
}




/*==================================================
  BANNER
==================================================*/
#bnr {
  margin-top: 16vw;
  text-align: center;
}
#bnr a {
  transition-duration: .3s;
}
#bnr a img {
  width: 89.33vw;
}