@charset "UTF-8";
/*------------------------------------------------------------
共通
------------------------------------------------------------*/
* .none {
  display: none; }

html {
  font-size: 62.5%; }

body {
  -webkit-text-size-adjust: 100%;
  font-family: Verdana, Roboto, 'Droid Sans',  '游ゴシック体', "Yu Gothic", '游ゴシック', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
  font-weight: 500;
  font-size: 1.4rem;
  line-height: 2;
  color: #000;
  letter-spacing: 0.1em; }

img {
  vertical-align: bottom;
  border: none; }

a {
  color: #000;
  text-decoration: none; }
  a:hover {
    text-decoration: none;
    color: #ccc; }

li {
  list-style: none; }

h1, h2, h3, h4, h5 {
  font-weight: 500; }

@media screen and (max-width: 736px) {
  body {
    font-size: 1.3rem;
    line-height: 1.8;
    letter-spacing: 0.08em; } }
.error-message {
  color: #c00; }

/*------------------------------------------------------------
共通クラス
------------------------------------------------------------*/
.pc {
  display: block; }

.sp {
  display: none; }

@media screen and (max-width: 736px) {
  .pc {
    display: none; }

  .sp {
    display: block; } }
.inner {
  width: 1100px;
  box-sizing: border-box;
  margin: 0 auto;
  position: relative; }

@media screen and (max-width: 736px) {
  .inner {
    width: 92%;
    padding: 0 4%; } }
._font_mincho {
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  font-weight: 100; }

.web_font01 {
  font-family: 'Josefin Sans', sans-serif;
  font-weight: 400; }

.web_font02 {
  font-family: 'Roboto', sans-serif;
  font-weight: 400; }

.ttl_style01 {
  font-size: 3.6rem;
  margin-bottom: 45px;
  line-height: 1;
  letter-spacing: 0;
  font-weight: 300;
  text-transform: uppercase; }

@media screen and (max-width: 736px) {
  .ttl_style01 {
    font-size: calc(3.4rem * 0.8);
    margin-bottom: 30px; } }
.btn_box {
  width: 300px;
  height: 75px;
  background: #faf66f;
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .btn_box:before {
    content: "";
    width: 39px;
    height: 9px;
    background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_left.png") left top no-repeat;
    background-size: 39px 9px;
    top: 50%;
    right: 15px;
    margin-top: -6px;
    position: absolute;
    transition: 0.2s all ease 0s;
    z-index: 20; }
  .btn_box a {
    z-index: 30;
    color: #000; }
  .btn_box:hover:before {
    background-size: 29px 9px;
    right: -0px; }

@media screen and (max-width: 736px) {
  .btn_box {
    width: 100%;
    height: 60px; }
    .btn_box:before {
      content: "";
      width: 39px;
      height: 9px;
      background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_left.png") left top no-repeat;
      background-size: 39px 9px;
      top: 50%;
      right: 15px;
      margin-top: -6px;
      position: absolute;
      transition: 0.2s all ease 0s;
      z-index: 20; }
    .btn_box a {
      z-index: 30;
      color: #000; }
    .btn_box:hover:before {
      background-size: 29px 9px;
      right: -0px; } }
.btn {
  text-align: right;
  font-size: 1.3rem;
  position: absolute;
  padding-right: 47px;
  cursor: pointer;
  line-height: 1; }
  .btn:after {
    content: "";
    width: 22px;
    height: 22px;
    background: #faf66f;
    top: 50%;
    left: -15px;
    margin-top: -11px;
    position: absolute;
    transition: 0.2s all ease 0s;
    z-index: 10;
    border-radius: 50%;
    display: block; }
  .btn:before {
    content: "";
    width: 39px;
    height: 9px;
    background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_left.png") left top no-repeat;
    background-size: 39px 9px;
    top: 50%;
    right: 0;
    margin-top: -6px;
    position: absolute;
    transition: 0.2s all ease 0s;
    z-index: 20; }
  .btn:hover:after {
    transform: scale(1.4, 1.4); }
  .btn:hover:before {
    background-size: 29px 9px;
    right: -14px; }
  .btn a {
    position: relative;
    z-index: 20;
    color: #000; }
  .btn.white a {
    color: #FFF; }
  .btn.white:before {
    background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_left_w.png") left top no-repeat;
    background-size: 39px 9px; }
  .btn.white:hover a {
    color: #ccc; }
  .btn.white:hover:before {
    background-size: 29px 9px;
    right: -14px; }
  .btn.box {
    width: 230px;
    height: 60px;
    box-sizing: border-box;
    padding-right: 0;
    text-align: center;
    display: flex;
    line-height: 1;
    justify-content: center;
    align-items: center; }
    .btn.box:before {
      width: 29px;
      right: 15px; }
    .btn.box.white {
      border: 1px solid #000; }
      .btn.box.white a {
        color: #000; }
      .btn.box.white:before {
        background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_mini_left.png") left top no-repeat;
        background-size: 29px 9px; }
      .btn.box.white:hover a {
        color: #ccc; }
      .btn.box.white:hover:before {
        background-size: 20px 9px;
        right: -5px; }
    .btn.box.black {
      background: #000; }
      .btn.box.black a {
        color: #FFF; }
      .btn.box.black:before {
        background: url("https://gigaplus.makeshop.jp/emonostore/popful/common/images/icon_arrow_mini_left_w.png") left top no-repeat;
        background-size: 29px 9px; }
      .btn.box.black:hover a {
        color: #ccc; }
      .btn.box.black:hover:before {
        background-size: 20px 9px;
        right: -5px; }

.pagetop {
  display: none;
  position: fixed;
  bottom: 30px;
  right: 15px;
  z-index: 100000; }
  .pagetop a {
    display: block;
    background-color: #000;
    text-align: center;
    color: #FFF;
    font-size: 1rem;
    text-decoration: none;
    padding: 5px 10px; }
    .pagetop a:hover {
      filter: alpha(opacity=50);
      -moz-opacity: 0.5;
      opacity: 0.5; }

/*------------------------------------------------------------
ラッパー
------------------------------------------------------------*/
#wrapper {
  position: relative; }

/*------------------------------------------------------------
#header
------------------------------------------------------------*/
#header {
  position: fixed;
  height: 120px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 70px;
  z-index: 2000;
  background: #FFF;
  width: calc(100% - 140px);
  /*-----------スマホのトグルボタンのCSS-------------*/ }
  #header .wrap {
    display: flex; }
  #header #nav {
    display: flex;
    align-items: center; }
    #header #nav .nav {
      display: flex; }
      #header #nav .nav li {
        margin-right: 30px; }
  #header .sns {
    display: flex; }
    #header .sns li {
      margin-left: 15px;
      height: 100%; }
      #header .sns li a {
        height: 100%;
        display: flex;
        align-items: center; }
  #header .nav_shop {
    border-left: 1px solid #e5e5e5;
    padding-left: 25px;
    margin-left: 25px; }
    #header .nav_shop li {
      height: 100%; }
      #header .nav_shop li a {
        height: 100%;
        display: flex;
        align-items: center; }
  #header #nav-toggle {
    display: none;
    position: absolute;
    left: 20px;
    top: 16px;
    width: 25px;
    height: 23px;
    cursor: pointer;
    z-index: 2000; }
    #header #nav-toggle div {
      position: relative; }
    #header #nav-toggle span {
      display: block;
      position: absolute;
      height: 3px;
      width: 100%;
      background: #000;
      left: 0;
      -webkit-transition: .35s ease-in-out;
      -moz-transition: .35s ease-in-out;
      transition: .35s ease-in-out; }
      #header #nav-toggle span:nth-child(1) {
        top: 0; }
      #header #nav-toggle span:nth-child(2) {
        top: 11px; }
      #header #nav-toggle span:nth-child(3) {
        top: 22px; }

@media screen and (max-width: 1100px) {
  #header {
    height: 60px;
    padding: 0;
    width: 100%;
    /*-----------スマホのトグルボタンのCSS-------------*/ }
    #header h1 {
      position: absolute;
      width: 100%;
      text-align: center; }
      #header h1 img {
        height: 30px;
        width: auto; }
    #header .nav_shop {
      border-left: none;
      position: absolute;
      right: 20px;
      top: 12px; }
      #header .nav_shop img {
        width: 38px;
        height: auto; }
    #header #nav {
      display: none;
      width: 100%;
      z-index: 1990;
      position: absolute;
      background: #FFF;
      top: 60px;
      opacity: 0; }
      #header #nav .nav {
        display: block; }
        #header #nav .nav li {
          margin: 20px 0;
          text-align: center; }
      #header #nav .sns {
        border-top: 1px solid #e5e5e5;
        display: flex;
        justify-content: center;
        padding: 20px 0 40px;
        margin: 0 30px; }
        #header #nav .sns li {
          margin: 0 10px;
          height: 100%; }
          #header #nav .sns li a {
            height: 100%;
            display: flex;
            align-items: center; }
    #header #nav-toggle {
      display: block; }
    #header.open #nav {
      display: block;
      opacity: 1; }
    #header.open #nav-toggle span:nth-child(1) {
      top: 11px;
      -webkit-transform: rotate(315deg);
      -moz-transform: rotate(315deg);
      transform: rotate(315deg); }
    #header.open #nav-toggle span:nth-child(2) {
      width: 0;
      left: 50%; }
    #header.open #nav-toggle span:nth-child(3) {
      top: 11px;
      -webkit-transform: rotate(-315deg);
      -moz-transform: rotate(-315deg);
      transform: rotate(-315deg); } }
/*------------------------------------------------------------
#footer
------------------------------------------------------------*/
#footer {
  border-top: 1px solid #e5e5e5; }
  #footer .top {
    border-bottom: 1px solid #e5e5e5; }
    #footer .top .inner {
      display: flex;
      justify-content: space-between;
      align-items: center;
      height: 205px; }
    #footer .top dt {
      margin-bottom: 10px; }
    #footer .top p {
      margin-bottom: 10px; }
    #footer .top ul {
      display: flex;
      width: 472px;
      justify-content: space-between; }
    #footer .top .btn {
      position: relative;
      border-radius: 100px; }
      #footer .top .btn:after {
        display: none; }
  #footer .bottom .inner {
    height: 80px;
    display: flex;
    justify-content: space-between;
    align-items: center; }
  #footer .bottom .nav {
    display: flex; }
    #footer .bottom .nav li {
      margin-right: 30px; }
  #footer .bottom .wrap {
    display: flex; }
  #footer .bottom .sns {
    display: flex; }
    #footer .bottom .sns li {
      margin-left: 15px;
      height: 100%; }
      #footer .bottom .sns li a {
        height: 100%;
        display: flex;
        align-items: center; }
  #footer .bottom .nav_shop {
    border-left: 1px solid #e5e5e5;
    padding-left: 25px;
    margin-left: 25px; }
    #footer .bottom .nav_shop li {
      height: 100%; }
      #footer .bottom .nav_shop li a {
        height: 100%;
        display: flex;
        align-items: center; }

@media screen and (max-width: 736px) {
  #footer .top {
    padding: 30px 0; }
    #footer .top .inner {
      display: block;
      height: auto; }
    #footer .top dt {
      margin-bottom: 5px;
      text-align: center; }
      #footer .top dt img {
        height: 35px;
        width: auto; }
    #footer .top p {
      margin-bottom: 10px; }
    #footer .top ul {
      display: flex;
      width: 100%;
      justify-content: space-between;
      margin-bottom: 15px; }
      #footer .top ul li {
        width: 49%; }
        #footer .top ul li .btn {
          width: 100%; }
          #footer .top ul li .btn:before {
            right: 5px; }
    #footer .top small {
      display: block;
      text-align: center; }
  #footer .bottom {
    padding: 30px 0; }
    #footer .bottom .inner {
      height: auto;
      display: block; }
    #footer .bottom .nav {
      display: flex;
      margin-bottom: 20px;
      justify-content: center; }
      #footer .bottom .nav li {
        margin: 0 15px; }
    #footer .bottom .wrap {
      display: flex;
      justify-content: center; }
    #footer .bottom .sns {
      display: flex; }
      #footer .bottom .sns li {
        margin: 0 15px 0 0; }
    #footer .bottom .nav_shop {
      padding-left: 15px;
      margin-left: 0; } }
/*------------------------------------------------------------
input
------------------------------------------------------------*/
input[type="text"], input[type="email"], input[type="tel"], textarea {
  width: 96%;
  height: 40px;
  padding: 0 2%;
  border-width: 0;
  border-radius: 0;
  font-size: 1.5rem;
  background: #f6f6f6; }
  input[type="text"].size_m, input[type="email"].size_m, input[type="tel"].size_m, textarea.size_m {
    width: 26%; }

textarea {
  height: 150px;
  padding: 2%; }

label, input[type='checkbox'] {
  cursor: pointer; }

.submit_btn {
  margin: 0 auto;
  width: 180px;
  height: 50px;
  position: relative;
  cursor: pointer; }
  .submit_btn:before {
    content: "";
    position: absolute;
    width: 25px;
    height: 1px;
    right: 0;
    top: 50%;
    background: #FFF;
    transition: .3s all;
    opacity: 0.7;
    z-index: 50; }
  .submit_btn:hover:before {
    width: 0; }
  .submit_btn.white:before {
    background: #e5e5e5; }
  .submit_btn.white button[type="submit"], .submit_btn.white input[type="submit"], .submit_btn.white input[type="button"] {
    background: #FFF;
    color: #e5e5e5;
    border: 2px solid #e5e5e5;
    box-sizing: border-box; }

button[type="submit"], input[type="submit"], input[type="button"] {
  width: 180px;
  height: 50px;
  border: none;
  font-weight: bold;
  font-size: 1.4rem;
  border-radius: 0;
  position: relative;
  color: #FFF;
  background: #e5e5e5; }
  button[type="submit"]:hover, input[type="submit"]:hover, input[type="button"]:hover {
    opacity: 0.7; }

input::placeholder, textarea::placeholder {
  color: #CCC; }

/* IE */
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #CCC; }

/* Edge */
input::-ms-input-placeholder, textarea::-ms-input-placeholder {
  color: #CCC; }

@media screen and (max-width: 736px) {
  .submit_btn {
    width: 48%; }
    .submit_btn button[type="submit"], .submit_btn input[type="submit"], .submit_btn input[type="button"] {
      width: 100%; }

  input[type="text"], input[type="email"], input[type="tel"], textarea {
    width: 96%;
    height: 40px;
    padding: 0 2%;
    border-width: 0;
    border-radius: 0;
    font-size: 1.5rem;
    background: #f6f6f6; }
    input[type="text"].size_m, input[type="email"].size_m, input[type="tel"].size_m, textarea.size_m {
      width: 26%; }

  textarea {
    height: 150px;
    padding: 2%; }

  label, input[type='checkbox'] {
    cursor: pointer; }

  .submit_btn {
    margin: 0 auto;
    width: 180px;
    height: 50px;
    position: relative;
    cursor: pointer; }
    .submit_btn:before {
      content: "";
      position: absolute;
      width: 25px;
      height: 1px;
      right: 0;
      top: 50%;
      background: #FFF;
      transition: .3s all;
      opacity: 0.7;
      z-index: 50; }
    .submit_btn:hover:before {
      width: 0; }

  button[type="submit"], input[type="submit"], input[type="button"] {
    width: 180px;
    height: 50px;
    border: none;
    font-weight: bold;
    font-size: 1.4rem;
    border-radius: 0;
    position: relative;
    color: #FFF;
    background: #e5e5e5;
    -webkit-appearance: none;
    border-radius: 0; }
    button[type="submit"]:hover, input[type="submit"]:hover, input[type="button"]:hover {
      opacity: 0.7; } }