@charset "UTF-8";
/* --------------------------------------------------------
import
-------------------------------------------------------- */
@import url("reset.css");
/* --------------------------------------------------------
font
------------------------------------------------------- */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@300;400;500;600;700;800&display=swap);
body {
  /* notosansjp */
  font-family: "Noto Sans JP", "ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ Pro W3",
    "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", "Meiryo UI",
    "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  /* M PLUS 1p */
  /*  font-family: "M PLUS 1p", "ヒラギノ角ゴシック", "Hiragino Sans","ヒラギノ角ゴ Pro W3",
  "Hiragino Kaku Gothic Pro", "游ゴシック", "Yu Gothic","游ゴシック体", "YuGothic", "Meiryo UI",
  "メイリオ", Meiryo,"ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  */
  color: #000000;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
h1 {
  text-align: center;
}
h1 img {
  height: 2.6rem;
}
h2 {
  font-size: 1.8rem;
  font-weight: bold;
  color: #2e3192;
  text-align: center;
}
h3 {
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
}
h4 {
  font-size: 1.4rem;
  text-align: center;
}
p {
  font-size: 1.4rem;
  line-height: 1.4;
}
a {
  color: #2e3192;
}
a:hover,
li a:hover,
li.stay a {
  text-decoration: underline;
  opacity: 0.75;
  filter: alpha(opacity=75);
  -ms-filter: "alpha( opacity=75 )";
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
b {
  font-weight: bold;
}
.minchyo {
  font-family: "Noto Serif JP", serif;
}
ruby {
  -webkit-ruby-position: after;
  ruby-position: under;
}
rt {
  font-size: 50%;
  margin-top: 0.25rem;
}
small {
  font-size: 65%;
  font-weight: normal;
}
.btn01 a {
  width: 100%;
  padding: 1rem;
  border-radius: 1.25rem;
  display: block;
  border: none;
  text-decoration: none;
  -webkit-appearance: none;
  text-align: center;
  cursor: pointer;
  background: #2e3192;
  color: #ffffff;
  font-size: 1.6rem;
  margin: 0 auto 3rem;
}
.btn01:hover {
  opacity: 0.85;
  filter: alpha(opacity=85);
  -ms-filter: "alpha( opacity=85 )";
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
/* --------------------------------------------------------
bg
-------------------------------------------------------- */
body {
  position: relative;
  min-height: 100vh;
  margin: 0;
  z-index: 0;
}
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: linear-gradient(to bottom, #aed0ee, #ffffff);
  z-index: -1;
  pointer-events: none; /* 背景の上での操作をブロックしないように */
}
/* iOSでbackground-attachment: fixedが効かない対策
::before 擬似要素を使って、背景用の固定されたレイヤーを作る */
/* --------------------------------------------------------
header
--------------------------------------------------------*/
header h1 {
  text-align: center;
  width: 65%;
  padding: 2rem 0;
  margin: 0 auto 0 2rem;
}
header h1 img {
  vertical-align: middle;
}
/* nav-drawer */
#nav-drawer {
  font-size: 2.4rem;
  color: #2e3192;
}
/* nav-global */
#nav-global ul {
  /* sp非表示 */
  display: none;
  justify-content: center;
  padding: 2rem 0;
}
#nav-global ul li:not(:last-child) {
  margin-right: 2rem;
}
/* lang-switch */
.lang-switch {
  display: flex;
  justify-content: right;
  margin-right: 1.5rem;
}
.lang-switch a {
  color: #2e3192;
  text-decoration: none;
  font-size: 1.4rem;
  padding: 0 0.5rem;
}
.lang-switch a.active {
  font-weight: bold;
}
.lang-switch .separator {
  margin: 0 0.5rem;
  padding-top: 0.3rem;
}
/* --------------------------------------------------------
footer
-------------------------------------------------------- */
footer {
  padding: 0 2rem 2rem;
  text-align: center;
}
.ft-logo {
  display: block;
  width: 65%;
  margin: 0 auto;
}
.ft-pagetop {
  display: block;
  width: 20%;
  margin: 10rem auto 3rem;
}
p.copyright small {
  font-size: 1.1rem;
}
/* --------------------------------------------------------
section
-------------------------------------------------------- */
section {
  padding: 3rem 2.5rem;
}
section h1 {
  margin-bottom: 3rem;
}
section h2 {
  margin-bottom: 1rem;
}
section h1 + p,
section h2 + p {
  text-align: center;
  font-weight: bold;
  font-weight: 500;
}
section .layout-container {
  display: flex;
  flex-direction: column; /* 縦並び */
}
section .layout-container .card {
  margin-bottom: 3rem;
}
/* MV */
section#mv {
  padding: 0 4rem 4rem;
}
section#mv h1 img {
  height: inherit;
}
section#mv .layout-container {
  margin-top: -8.5rem;
  display: flex;
  flex-direction: row; /* 横並び */
  flex-wrap: wrap; /* 折り返しを有効にする */
  justify-content: center;
}
section#mv .layout-container .card {
  width: calc(25% - 1.75rem);
  /* 4列表示のため25%からマージンの調整分を引く */
  margin-right: 1.75rem;
  display: flex;
  flex-direction: column;
}
section#mv .layout-container .card:last-child {
  margin-right: 0;
}
section#mv .layout-container .card a img:hover,
section#mv .layout-container .card a:hover {
  opacity: 1;
  filter: alpha(opacity=100);
  -ms-filter: "alpha( opacity=100 )";
}
section#mv .layout-container .card a img:hover {
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  filter: brightness(108%);
}
section#mv h2 {
  width: calc(100% + 4rem);
  margin-bottom: 3rem;
  margin-left: -2rem;
}
section#mv figure.mv_box {
  padding: 0 3rem;
  margin-bottom: 2rem;
}
section#mv p {
  text-align: center;
  color: #2e3192;
}
section#mv a:hover {
  text-decoration: none;
}
/* NEWS */
section#section_news figure {
  width: 55%;
  margin: 2rem auto;
}
/* ABOUT */
section#section_about .card figure {
  width: 65%;
  margin: 0 auto 2rem;
}
section#section_about .card .subtitle {
  margin-bottom: 2rem;
}
section#section_about .card .description small {
  display: inline-block;
  margin-top: 1rem;
}
/* DESIGN */
section#section_design .layout-container {
  margin-top: 3rem;
}
section#section_design .layout-container .card figure {
  margin-bottom: 2rem;
}
section#section_design .layout-container .card figure img {
  border: 1px solid #d3d3d3;
}
section#section_design figure + p {
  font-size: 1.4rem;
  text-align: center;
  color: #2e3192;
}
section#section_design h3.title {
  font-size: 2.4rem;
  margin-bottom: 2rem;
  color: #000000;
}
section#section_design p {
  color: #000000;
}
section#section_design a:hover {
  text-decoration: none;
}
section#section_design a:hover h3.title {
  color: #2e3192;
}
/* PRODUCT */
section#section_product .layout-container {
  margin-top: 3rem;
}
section#section_product .layout-container .card figure {
  width: 50%;
  margin: 0 auto 2rem;
}
section#section_product .layout-container .card h3.title {
  margin-bottom: 1rem;
}
/* INTERVIEW */
section#section_interview figure {
  margin-top: 3rem;
}
section#section_interview h3 {
  margin-top: 2rem;
}
section#section_interview .text-q {
  color: #2e3192;
  margin-top: 1rem;
}
/* CONTACT */
section#section_contact h2 {
  color: #000;
  line-height: 1.4;
}
section#section_contact figure {
  width: 6rem;
  margin: 3rem auto;
}
/* 商品ページ */
section#section_item p:first-child,
section#section_item-list p {
  font-size: 1.4rem;
  text-align: center;
  color: #2e3192;
}
section#section_item h1.title {
  font-size: 2.4rem;
  font-weight: bold;
  margin-bottom: 4rem;
}
section#section_item .layout-container .card:first-child figure {
  width: 50%;
  margin: 0 auto;
}
section#section_item .layout-container .card:last-child figure {
  width: 100%;
}
section#section_item .layout-container .card:last-child figure img {
  border: 1px solid #d3d3d3;
}
section#section_item .btn01 a {
  width: 80%;
}
/* 商品ページ_リンク */
section#section_item-list .layout-container .card {
  margin-bottom: 4rem;
}
section#section_item-list a:hover {
  text-decoration: none;
}
section#section_item-list .layout-container .card figure {
  width: 40%;
  margin: 0 auto 2rem;
}
section#section_item-list .layout-container .card.boxset figure {
  width: calc(100% - 5rem);
  margin: 2rem auto;
}
section#section_item-list h3 {
  font-size: 2rem;
  font-weight: bold;
  color: #000;
}
section#section_item-list a:hover h3 {
  color: #2e3192;
}
section#section_item-list .boxset h3 {
  font-size: 1.8rem;
}
/* 商品ページ_ボックスセット */
.boxsetpage section#section_item h1.title {
  margin: 3rem 0;
  font-size: 2rem;
}
.boxsetpage section#section_item .layout-container .card:last-child figure img {
  border: none;
}
.boxsetpage section#section_item .layout-container .card {
  margin-bottom: 0;
}
/* enページ調整 */
.lang-en section h1 + p,
.lang-en section h2 + p {
  text-align: left;
}
.lang-en section#section_design figure + p,
.lang-en section#section_item p:first-child,
.lang-en section#section_item-list p {
  font-size: 1.6rem;
}
.lang-en section#section_design h3.title {
  font-size: 2rem;
  line-height: 1.4;
}
.lang-en section#section_item-list h3 {
  font-size: 1.8rem;
  line-height: 1.4;
}
/* ------------------------------------------------------------------------
@media START
------------------------------------------------------------------------ */
/* for iPad&Tablet 以上 */
@media only screen and (min-width: 768px) {
  body {
    background-size: 100% 75vh;
  }
  h4 {
    font-size: 1.2rem;
  }
  #container {
    width: 100%;
    padding: 0 8rem;
  }
  /* header */
  header h1 {
    text-align: left;
    margin: inherit;
  }
  header #nav-content {
    right: -30%;
    /* はじめは隠しておく */
    width: 30%;
    max-width: 30%;
  }
  .lang-switch {
    width: calc(100vw - 9.5rem);
  }
  /* footer */
  footer .ft-logo {
    width: 30rem;
  }
  footer .ft-pagetop {
    width: 8rem;
    margin: 12rem auto 5rem;
  }
  footer p.copyright small {
    font-size: 1.2rem;
  }
  /* section */
  section {
    padding: 4rem 0;
  }
  section h1 {
    margin-bottom: 2rem;
  }
  section .layout-container {
    margin-top: 5rem !important;
    display: flex;
    flex-direction: row; /* 横並び */
    flex-wrap: wrap; /* 折り返しを有効にする */
    justify-content: center;
  }
  section .layout-container .card {
    width: calc(50% - 4rem);
    /* 2列表示のため50%からマージンの調整分を引く */
    margin-right: 4rem;
    display: flex;
    flex-direction: column;
  }
  section .layout-container .card:nth-child(2n),
  section#section_about .layout-container .card:nth-child(3n) {
    margin-right: 0;
  }
  section .layout-container .card figure {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    margin: 0;
  }
  section .layout-container .card figure img {
    width: 100%;
    height: auto;
    object-fit: contain;
    /* 画像のアスペクト比を保持したまま収める */
  }
  /* MV */
  section#mv .layout-container {
    margin-top: -12rem !important;
  }
  section#mv h2 {
    margin-top: 2rem;
    margin-bottom: 5rem;
  }
  section#mv figure.mv_box {
    padding: 0 12rem;
  }
  /* NEWS */
  section#section_news h1 {
    margin-bottom: 3rem;
  }
  section#section_news figure {
    width: 45%;
    margin-top: 4rem;
  }
  /* ABOUT */
  section#section_about .layout-container .card figure img {
    height: 18rem;
  }
  /* DESIGN */
  section#section_design .layout-container .card figure + p {
    font-size: 1.2rem;
  }
  section#section_design .layout-container .card h3.title {
    font-size: 2rem;
  }
  /* PRODUCT */
  section#section_product .layout-container .card figure img {
    height: 12rem;
  }
  /* INTERVIEW */
  section#section_interview h1 {
    margin-bottom: 3rem;
  }
  section#section_interview h2 {
    margin-bottom: 2rem;
  }
  section#section_interview figure {
    width: 30rem;
    margin: 5rem auto 4rem;
  }
  section#section_interview h3 {
    text-align: left;
    font-size: 1.6rem;
  }
  section#section_interview h3 small {
    font-size: 80%;
  }
  /* CONTACT */
  section#section_contact h1 {
    margin-bottom: 3rem;
  }
  section#section_contact h2 {
    font-size: 1.6rem;
    font-weight: 500;
  }
  section#section_contact figure {
    width: 5rem;
    margin: 3 auto;
  }
  /* 商品ページ */
  section#section_item p:first-child,
  section#section_item-list p {
    font-size: 1.2rem;
  }
  section#section_item h1.title {
    font-size: 2rem;
    margin-bottom: 2rem;
  }
  section#section_item .layout-container .card:first-child {
    width: calc(33% - 4rem);
    margin-right: 4rem;
  }
  section#section_item .layout-container .card:last-child {
    width: 67%;
  }
  section#section_item .btn01 a {
    width: calc(100% - 4rem);
    margin-top: 3rem;
    padding: 0.75rem 0;
  }
  section#section_item p.description {
    width: calc(100% - 6rem);
    margin: 0 auto;
  }
  /* 商品ページ_リンク */
  section#section_item-list .layout-container .card,
  section#section_item-list .layout-container .card:nth-child(2n) {
    width: calc(33.33% - 5rem);
    /* 3列表示のため33.33%からマージンの調整分を引く */
    margin-right: 4rem;
  }
  section#section_item-list .layout-container .card:nth-child(3n) {
    margin-right: 0;
  }
  section#section_item-list .layout-container .card figure {
    padding: 0 2rem;
  }
  section#section_item-list .layout-container .card.boxset {
    width: 50%;
    margin: 3rem 0;
  }
  section#section_item-list h3 {
    font-size: 1.8rem;
  }
  /* 商品ページ_ボックスセット */
  .boxsetpage section#section_item h1.title {
    margin: 2rem 0;
    font-size: 1.8rem;
  }
  .boxsetpage section#section_item .layout-container .card {
    margin-right: 0;
  }
  .boxsetpage section#section_item .btn01 a {
    width: calc(70% - 4rem);
    margin-top: 1rem;
  }
  .boxsetpage section#section_item-list .layout-container .card {
    width: 50%;
    margin-right: 0;
  }
  .boxsetpage section#section_item-list .layout-container .card figure {
    padding: 0 7.5rem;
  }
  /* enページ調整 */
  .lang-en section#section_design h3.title,
  .lang-en section#section_design .layout-container .card h3.title,
  .lang-en section#section_item h1.title,
  .lang-en section#section_item-list h3 {
    font-size: 1.8rem;
    line-height: 1.4;
  }
}
/* for PC 以上 */
@media only screen and (min-width: 992px) {
  h1 img {
    height: 3.4rem;
  }
  h2 {
    font-size: 2.2rem;
    font-weight: bold;
  }
  h3 {
    font-size: 1.8rem;
  }
  h4 {
    font-size: 1.4rem;
  }
  p {
    font-size: 1.6rem;
    line-height: 1.6;
  }
  .layout-container p,
  #section_interview div p {
    font-size: 1.4rem;
  }
  #container {
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 2rem;
  }
  /* header */
  header h1 {
    width: 40%;
    margin: inherit;
    text-align: left;
    float: left;
  }
  header h1 img {
    height: 3.05rem;
  }
  #nav-drawer {
    display: none;
  }
  #nav-global {
    float: right;
  }
  #nav-global ul {
    display: flex;
  }
  #nav-global ul a {
    color: #000;
    font-weight: 200;
  }
  #nav-global ul a:hover {
    color: #2e3192;
    text-decoration: none;
  }
  #nav-global::after {
    content: "";
    display: block;
    clear: both;
  }
  .lang-switch {
    width: 100%;
  }
  /* section ALL */
  section,
  section#mv {
    padding: 2rem 10rem 4rem;
    /* 幅実質900px */
  }
  section#section_about,
  section#section_design {
    padding: 4rem 2rem;
  }
  section#section_interview {
    padding: 4rem 22rem;
  }
  section#mv h1 img {
    height: inherit;
    padding: 0 6rem;
    /* 幅実質780px */
  }
  section#mv .layout-container {
    margin-top: -22rem !important;
    padding: 0 2rem 2rem;
    /* 幅実質860px */
  }
  section#mv .layout-container .card {
    width: calc(25% - 4rem);
    /* 4列表示のため25%からマージンの調整分を引く */
    margin-right: 4rem;
  }
  section#mv h2 {
    width: calc(100% + 6rem);
    margin-top: inherit;
    margin-bottom: 5rem;
    margin-left: -3rem;
  }
  section#mv figure.mv_box {
    padding: 0 24rem;
    margin-bottom: 2rem;
    /* 幅実質420px */
  }
  section .layout-container .card,
  section .layout-container .card:nth-child(2n) {
    margin-right: 5rem;
  }
  section#section_about .layout-container .card {
    width: calc(33.33% - 5rem);
    /* 3列表示のため33.33%からマージンの調整分を引く */
  }
  section#section_about .layout-container .card:nth-child(3n),
  section#section_design .layout-container .card:nth-child(2n),
  section#section_product .layout-container .card:nth-child(2n) {
    margin-right: 0;
  }
  /* 商品ページ */
  section#section_item {
    padding: 5rem 14rem 8rem;
  }
  section#section_item .layout-container .card:first-child {
    width: calc(33% - 4rem);
    margin-right: 4rem;
  }
  section#section_item .layout-container .card:last-child {
    width: 67%;
    margin-right: 0;
  }
  /* 商品ページ_リンク */
  section#section_item-list .layout-container {
    margin-top: 0 !important;
  }
  section#section_item-list .layout-container .card,
  section#section_item-list .layout-container .card:nth-child(2n) {
    width: calc(25% - 3rem);
    /* 4列表示のため25%からマージンの調整分を引く */
    margin-right: 3rem;
  }
  section#section_item-list .layout-container .card.boxset {
    width: 45%;
    margin: 3rem 0;
  }
  /* 商品ページ_ボックスセット */
  .boxsetpage section#section_item-list {
    padding: 4rem 14rem;
  }
  .boxsetpage section#section_item-list .layout-container .card {
    width: 25%;
    margin-right: 0;
  }
  .boxsetpage section#section_item-list .layout-container .card figure {
    padding: 0 3rem;
  }
}
/* for  desktop PC */
@media screen and (max-width: 1980px) and (min-width: 1481px) {
}
/* for  note PC */
@media screen and (max-width: 1480px) and (min-width: 1200px) {
}
/* for small note PC */
@media screen and (max-width: 1199px) and (min-width: 992px) {
}
/* for 縦 iPad&Tablet */
@media screen and (max-width: 991px) and (min-width: 768px) {
}