html {
  font-size: 62.5%; }

/*===========
inview
===========*/
.fadeIn {
  opacity: 0;
  transition: 2s; }

.fadeIn.is-show {
  opacity: 1; }

/* CSS Document */
body {
  font-size: 1.8rem;
  font-family: "a-otf-ryumin-pr6n", serif;
  font-weight: bold;
  font-style: normal;
  letter-spacing: 0.03em;
  font-family: "zen-old-mincho", sans-serif;
  font-weight: 900;
  font-style: normal; }

.pc {
  display: block; }

.sp {
  display: none; }

a {
  transition: 0.3s all; }
  a:hover {
    opacity: .7; }

/*common*/
.inner {
  max-width: 1024px;
  margin: 0 auto; }

/*mainvisual*/
#main_visual {
  position: relative; }
  #main_visual .visual img {
    width: 100%;
    height: auto; }
  #main_visual .maincopy {
    position: absolute;
    top: 10%;
    right: 7%; }
    #main_visual .maincopy img {
      width: 100%; }

/*concept*/
#concept {
  margin: 147px 0 157px; }
  #concept .inner {
    max-width: 1080px; }
  #concept .concept_wrapper .txtBox {
    margin-right: 40px;
    float: right;
    font-size: 2.2rem;
    line-height: 2em;
    writing-mode: horizontal-tb;
    writing-mode: vertical-rl;
    writing-mode: tb-rl;
    -webkit-writing-mode: horizontal-tb;
    -webkit-writing-mode: vertical-rl;
    -webkit-writing-mode: tb-rl;
    /*letter-spacing: -0.2em;*/
    font-family: "shippori-mincho-b1", sans-serif;
    font-weight: 700;
    font-style: normal; }
    #concept .concept_wrapper .txtBox h2 {
      margin-left: 65px; }
      #concept .concept_wrapper .txtBox h2 span.num {
        text-combine-upright: all;
        letter-spacing: normal;
        font-family: "hiragino-mincho-pron", sans-serif; }
      #concept .concept_wrapper .txtBox h2 span.name {
        font-size: 3.65rem;
        color: #C29020; }

/*subvisual*/
#sub_visual {
  position: relative; }
  #sub_visual img {
    width: 100%;
    height: auto; }
  #sub_visual::after {
    content: "";
    width: 115px;
    height: 204px;
    background-image: url(../img/ico_ippin.png);
    background-repeat: no-repeat;
    background-size: contain;
    bottom: -150px;
    right: 10%;
    position: absolute; }

/*lineup*/
#lineup {
  margin: 157px 0; }
  #lineup h2 {
    margin-bottom: 68px;
    color: #C29020;
    text-align: center;
    font-size: 4.6rem;
    letter-spacing: 0.2em;
    font-style: normal; }
  #lineup .item_wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    #lineup .item_wrapper .itemBox {
      width: 47%;
      display: flex;
      line-height: 1.5em;
      margin: 0 0 50px; }
      #lineup .item_wrapper .itemBox .pkg {
        margin-right: 5%; }
      #lineup .item_wrapper .itemBox .txt h3 {
        font-size: 2.2rem;
        margin-bottom: 18px;
        margin-left: 15px; }
        #lineup .item_wrapper .itemBox .txt h3 span.line {
          position: relative; }
          #lineup .item_wrapper .itemBox .txt h3 span.line::before {
            content: "";
            width: 11px;
            flex-grow: 1;
            height: 4px;
            display: block;
            margin-left: .4em;
            background: #C29020;
            margin: auto;
            top: 0;
            bottom: 0;
            left: -22px;
            position: absolute; }
      #lineup .item_wrapper .itemBox .txt p {
        font-family: "hiragino-mincho-pron", sans-serif;
        font-weight: 300;
        font-style: normal; }
  #lineup .caution {
    margin-top: 84px; }
    #lineup .caution img {
      margin: 0 auto;
      display: block; }

/*profile*/
#profile {
  background-color: #1E1E1E;
  padding: 100px 0;
  color: #fff;
  position: relative; }
  #profile::after {
    content: "";
    width: 115px;
    height: 204px;
    background-image: url(../img/ico_kansyu.png);
    background-repeat: no-repeat;
    background-size: contain;
    top: -49px;
    right: 10%;
    position: absolute; }
  #profile .profile_wrapper {
    display: flex; }
    #profile .profile_wrapper .photo {
      margin-right: 58px; }
    #profile .profile_wrapper .txtBox {
      line-height: 1.7em; }
      #profile .profile_wrapper .txtBox h2 {
        font-size: 2.4rem;
        margin-bottom: 42px; }
      #profile .profile_wrapper .txtBox h3 {
        font-size: 4rem;
        margin-bottom: 48px;
        letter-spacing: 0.12em;
        font-weight: 600; }
        #profile .profile_wrapper .txtBox h3 span.title {
          font-size: 2.2rem;
          line-height: 2em; }
        #profile .profile_wrapper .txtBox h3 span.en {
          font-size: 1.8rem;
          margin-left: 40px; }
      #profile .profile_wrapper .txtBox p {
        font-family: "hiragino-mincho-pron", sans-serif;
        font-weight: 300;
        font-style: normal; }

/*cart*/
#cart {
  margin: 65px 0 0; }
  #cart img {
    margin: 0 auto;
    display: block;
    height: auto; }

/*footer*/
footer {
  background-color: #C29020;
  color: #fff;
  font-size: 1.2rem;
  text-align: center;
  padding: 1.3% 0;
  letter-spacing: 1px;
  font-family: "hiragino-mincho-pron", sans-serif;
  font-style: normal;
  font-weight: 300; }

/* totop */
.totop {
  padding: 0 3% 2% 0;
  text-align: right; }
  .totop a {
    width: 85px;
    display: inline-block; }

/* float */
.float {
  bottom: inherit;
  right: 0;
  top: 4%;
  position: fixed; }
  .float ul {
    display: block; }
    .float ul li {
      width: 56px;
      height: auto;
      margin: 0 0 15px; }
      .float ul li:first-of-type {
        border: none; }
      .float ul li:nth-of-type(2) {
        border: none; }

@media (max-width: 1020px) and (min-width: 768px) {
  #main_visual .maincopy {
    top: 3%;
    right: 3%; }
    #main_visual .maincopy img {
      width: 80%; }

  #main_visual .maincopy {
    position: initial;
    margin: 100px 0 0; }
    #main_visual .maincopy img {
      width: 50%;
      margin: 0 auto;
      display: block; }

  #concept .concept_wrapper {
    width: 80%;
    margin: 0 auto; }
    #concept .concept_wrapper .txtBox {
      margin: 0 auto 100px;
      float: initial; }

  #lineup .item_wrapper {
    padding: 0 30px; }
    #lineup .item_wrapper .itemBox {
      display: initial; }
      #lineup .item_wrapper .itemBox .pkg img {
        margin: 0 auto;
        display: block; }

  .float {
    position: fixed;
    bottom: 0;
    right: inherit;
    top: inherit; }
    .float img {
      width: 100%;
      height: auto; }
    .float ul {
      display: flex;
      justify-content: space-between; }
      .float ul li {
        width: 50%;
        margin: 0; }
        .float ul li:first-of-type {
          border-right: 1px solid #1E1E1E; }
        .float ul li:nth-of-type(2) {
          border-left: 1px solid #1E1E1E; } }
@media screen and (max-width: 767px) {
  .pc {
    display: none; }

  .sp {
    display: block; }

  #main_visual .maincopy {
    position: initial;
    margin: 0; }
    #main_visual .maincopy img {
      width: 50%;
      margin: 0 auto;
      display: block; }

  #sub_visual::after {
    width: 51px;
    height: 92px;
    bottom: -55px;
    right: 6%; }

  #concept {
    margin: 0 0 68px; }
    #concept .concept_wrapper {
      width: initial;
      display: flex;
      flex-direction: column-reverse; }
      #concept .concept_wrapper .txtBox {
        margin: 40px auto 0;
        font-size: 1.3rem; }
        #concept .concept_wrapper .txtBox h2 {
          margin-left: 49px; }
          #concept .concept_wrapper .txtBox h2 span.name {
            font-size: 2.03rem; }
      #concept .concept_wrapper .photo {
        position: relative;
        padding: 0 12px; }
        #concept .concept_wrapper .photo img {
          width: 100%;
          height: auto; }
        #concept .concept_wrapper .photo::before {
          content: "";
          background-image: url(../img/ico_cyuka.png);
          width: 51px;
          height: 92px;
          background-size: contain;
          background-repeat: no-repeat;
          top: -70px;
          right: 6%;
          position: absolute; }

  #lineup {
    padding: 0 25px;
    margin: 78px 0; }
    #lineup h2 {
      margin-bottom: 42px;
      font-size: 2.3rem; }
    #lineup .item_wrapper {
      display: initial;
      padding: 0; }
      #lineup .item_wrapper .itemBox {
        display: initial;
        line-height: 1.2em; }
        #lineup .item_wrapper .itemBox .pkg {
          margin-right: 0;
          margin-bottom: 13px; }
          #lineup .item_wrapper .itemBox .pkg img {
            max-width: 140px;
            height: auto;
            margin: 0 auto;
            display: block; }
        #lineup .item_wrapper .itemBox .txt {
          margin: 0 0 49px; }
          #lineup .item_wrapper .itemBox .txt h3 {
            font-size: 1.6rem;
            text-align: center; }
            #lineup .item_wrapper .itemBox .txt h3 span.line {
              width: 15px; }
          #lineup .item_wrapper .itemBox .txt p {
            font-size: 1.3rem; }
        #lineup .item_wrapper .itemBox:last-child .txt {
          margin: 0; }
    #lineup .caution {
      margin: 0; }
      #lineup .caution img {
        width: 100%;
        padding: 0 10px; }

  #profile {
    padding: 50px 33px;
    margin: -20px 0 0; }
    #profile .profile_wrapper {
      display: initial; }
      #profile .profile_wrapper .photo {
        margin-right: 0; }
        #profile .profile_wrapper .photo img {
          margin: 0 auto;
          display: block;
          max-width: 178px;
          height: auto; }
      #profile .profile_wrapper .txtBox {
        text-align: center; }
        #profile .profile_wrapper .txtBox h2 {
          font-size: 1.3rem;
          margin: 22px 0 25px;
          line-height: 1.6em; }
        #profile .profile_wrapper .txtBox h3 {
          font-size: 2.3rem;
          margin-bottom: 33px;
          line-height: 1em; }
          #profile .profile_wrapper .txtBox h3 span.title {
            font-size: 1.3rem; }
          #profile .profile_wrapper .txtBox h3 span.en {
            font-size: 1.2rem;
            margin-left: 0; }
        #profile .profile_wrapper .txtBox p {
          font-size: 1.3rem;
          line-height: 2em;
          text-align: left; }
    #profile::after {
      width: 51px;
      height: 92px;
      top: -49px;
      right: 6%; }

  #cart {
    margin: 50px 0 0; }
    #cart img {
      width: 100%;
      max-width: 270px; }

  .float {
    position: fixed;
    bottom: 0;
    right: inherit;
    top: inherit; }
    .float img {
      width: 100%;
      height: auto; }
    .float ul {
      display: flex;
      justify-content: space-between; }
      .float ul li {
        width: 50%;
        margin: 0; }
        .float ul li:first-of-type {
          border-right: 1px solid #1E1E1E; }
        .float ul li:nth-of-type(2) {
          border-left: 1px solid #1E1E1E; }

  .totop {
    text-align: right;
    padding: 0 5% 5% 0; }
    .totop img {
      width: 100%;
      margin: 0 auto; }
    .totop a {
      display: inline-block;
      width: 15%; }

  footer {
    font-size: 1rem;
    padding: 2% 0;
    letter-spacing: 1px;
    margin: 0 0 12%; } }
@media screen and (min-width: 1000px) {
  .totop {
    padding: 0 3% 2% 0; } }