@charset "UTF-8";
@import url(//fonts.googleapis.com/css?family=Lato:400,700);
@import url(//fonts.googleapis.com/earlyaccess/notosansjp.css);
body {
  font-family: Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1.6;
  font-size: 1.5rem;
}

@media only screen and (min-width: 768px) {
  h1.page-heading {
    font-size: 24px !important;
    text-align: center;
    border-bottom: 3px double;
    padding-bottom: 5px;
    letter-spacing: 2px;
  }
}

.button {
  background: #CB4042;
  color: #fff;
  padding: 10px 15px;
  border-radius: 3px;
  display: inline-block;
}

.button:hover, .button:active {
  color: #fff;
  background: #b23032;
}

.button.primary {
  background: #CB4042;
}

.button.secondary {
  background: #0089A7;
}

.button.secondary:hover, .button.secondary:active {
  background: #00687e;
}

ul.button-group {
  text-align: center;
}

ul.button-group li {
  display: inline-block;
  margin-left: 6px;
}

ul.button-group li:first-child {
  margin-left: 0;
}

.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.mr5 {
  margin-right: 5px;
}

.mr10 {
  margin-right: 10px;
}

.mb10 {
  margin-bottom: 10px;
}

.mb20 {
  margin-bottom: 20px;
}

.mb30 {
  margin-bottom: 30px;
}

.mb60 {
  margin-bottom: 60px;
}

@media (max-width: 767px) {
  .hidden-sm {
    display: none;
  }
}

@media (min-width: 768px) {
  .hidden-md-up {
    display: none;
  }
}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}

ul.list-circle {
  list-style: circle;
  margin-left: 2rem;
}

#header {
  border-top: 7px solid #CB4042;
}

@media (min-width: 768px) {
  #header {
    padding-top: 50px;
  }
}

@media (max-width: 767px) {
  .header_logo_area {
    padding: 6px 15px 0 5px;
  }
}

@media (min-width: 768px) {
  .header_logo_area {
    float: none;
    margin: 0;
    margin-left: -80px;
    position: absolute;
    top: 0;
    left: 50%;
  }
}

.drawer_block.pc .search {
  width: 40%;
}

@media (min-width: 768px) {
  #main_visual {
    height: 448px;
    background: url("../img/top/main_visual.jpg");
    background-position: center center;
    margin-bottom: 20px;
  }
  #main_visual img {
    display: none;
  }
}

@media (min-width: 768px) {
  ul.member_link {
    margin-top: 30px;
  }
}

nav#category ul.category-nav li.instagram {
  display: none;
}

#drawer ul.category-nav li.instagram img {
  width: 20px;
  vertical-align: -4px;
  margin-right: 5px;
}

.fixed_button {
  position: fixed;
  right: 0;
  top: 210px;
  z-index: 3;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -o-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
  background: #fff;
}

@media (max-width: 767px) {
  .fixed_button {
    display: none;
  }
}

.fixed_button a {
  display: block;
  border: 1px solid #d00057;
  border-radius: 3px;
  border-right: none;
  padding: 12px 10px;
  background: #fff;
  color: #2e3233;
  font-size: 13px;
  letter-spacing: 1px;
}

.fixed_button a img {
  width: 25px;
  vertical-align: 0;
  margin-bottom: 6px;
}

.fixed_button a:hover {
  background: rgba(208, 0, 87, 0.05);
}

@media (min-width: 768px) {
  .footer_logo_area {
    margin-top: 40px;
  }
  .footer_logo_area .logo {
    margin-bottom: 10px;
  }
  .footer_logo_area .copyright {
    font-size: 1.1rem;
  }
}

#item_list > .row {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

#item_list > div {
  margin-bottom: 20px;
}

#item_list img {
  width: 100%;
}

@media (max-width: 767px) {
  #item_list a.button {
    font-size: 13px;
  }
}

.comment_area {
  padding-top: 15px;
}

.comment_area h4 {
  color: #CB4042;
  border-bottom: 3px double #CB4042;
  font-size: 22px !important;
  margin-bottom: 30px !important;
  padding-bottom: 5px;
  letter-spacing: 2px;
}

.comment_area h5 {
  color: #6d6e79;
  font-size: 18px !important;
}

.comment_area p {
  font-size: 14px !important;
}

.banner-area {
  width: 100%;
  max-width: 1150px;
  padding: 0 8px;
  margin: 24px auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

.banner-area .column-1 {
  max-width: 543px;
}

@media (min-width: 768px) {
  .banner-area {
    margin-bottom: 40px;
  }
}

#banner ul li {
  margin-bottom: 10px;
}

#bestselection h1, #yumeari_new_arrival h1 {
  font-size: 22px !important;
  color: #CB4042;
  text-align: center;
  border-bottom: 3px double #CB4042;
  padding-bottom: 5px;
  letter-spacing: 2px;
}

#bestselection h2, #yumeari_new_arrival h2 {
  text-align: center;
  font-size: 1.7rem;
}

#bestselection ul.cat_buttons, #yumeari_new_arrival ul.cat_buttons {
  text-align: center;
}

#bestselection ul.cat_buttons li, #yumeari_new_arrival ul.cat_buttons li {
  display: inline-block;
  width: 40%;
  margin: 0 4px 8px 4px;
}

#bestselection ul.cat_buttons li a, #yumeari_new_arrival ul.cat_buttons li a {
  display: block;
  color: #CB4042;
  border: 1px solid #CB4042;
  border-radius: 3px;
  padding: 3px;
}

#bestselection ul.cat_buttons li a:hover, #yumeari_new_arrival ul.cat_buttons li a:hover {
  color: #fff;
  background: #CB4042;
}

#news_area {
  background: none;
  border: 1px solid #ddd;
  border-radius: 3px;
}

#news_area h1 {
  font-size: 1.6rem;
  margin: 0;
  padding: 16px;
}

#payment_area {
  text-align: center;
}

#official_sns_area h1 {
  font-size: 22px !important;
  color: #CB4042;
  text-align: center;
  border-bottom: 3px double #CB4042;
  padding-bottom: 5px;
  letter-spacing: 2px;
}

#official_sns_area iframe {
  display: block;
  max-width: 880px;
  margin: 0 auto 20px;
}

#official_sns_area .official_sns_button {
  padding: 0 10px;
}

#official_sns_area .official_sns_button .official_sns_box {
  border: 1px solid;
  background: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 5px 30px;
  -webkit-transition: .3s;
  transition: .3s;
  margin-bottom: 10px;
}

#official_sns_area .official_sns_button .official_sns_box figure {
  width: 54px;
  margin: 0;
  padding: 6px;
}

#official_sns_area .official_sns_button .official_sns_box p {
  font-size: 13px;
  text-align: center;
  width: calc(100% - 54px);
  color: #2e3233;
  margin: 0;
}

#official_sns_area .official_sns_button .official_sns_box p span {
  font-size: 15px;
  font-weight: bold;
  display: block;
}

#official_sns_area .official_sns_button .official_sns_box.instagram {
  border-color: #d00057;
}

#official_sns_area .official_sns_button .official_sns_box.instagram p span {
  color: #d00057;
}

#official_sns_area .official_sns_button .official_sns_box.twitter {
  border-color: #1da1f2;
}

#official_sns_area .official_sns_button .official_sns_box.twitter p span {
  color: #1da1f2;
}

#official_sns_area .official_sns_button .official_sns_box.facebook {
  border-color: #1877f2;
}

#official_sns_area .official_sns_button .official_sns_box.facebook p span {
  color: #1877f2;
}

#official_sns_area .official_sns_button a {
  -webkit-transition-duration: .5s !important;
          transition-duration: .5s !important;
  display: block;
}

#official_sns_area .official_sns_button a img:hover {
  opacity: 1 !important;
}

#official_sns_area .official_sns_button a:hover {
  -webkit-transition: all .5s !important;
  transition: all .5s !important;
}

#official_sns_area .official_sns_button a:hover p {
  color: #2e3233;
}

#official_sns_area .official_sns_button a:hover .instagram {
  background: rgba(208, 0, 87, 0.05);
}

#official_sns_area .official_sns_button a:hover .twitter {
  background: rgba(29, 161, 242, 0.05);
}

#official_sns_area .official_sns_button a:hover .facebook {
  background: rgba(24, 119, 242, 0.05);
}

@media (min-width: 768px) {
  #official_sns_area .official_sns_button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  #official_sns_area .official_sns_button .official_sns_box {
    margin: 0 15px 10px;
  }
}

@media (min-width: 768px) {
  body.product_page #item_photo_area ul.slick-dots li {
    min-height: 185px;
  }
}

body.product_page table.price_list {
  width: 100%;
  margin-top: 20px;
  text-align: center;
}

body.product_page table.price_list th, body.product_page table.price_list td {
  border: 1px solid #ccc;
  padding: 5px 0;
}

body.product_page table.price_list tbody > tr:nth-child(even) {
  background: #f8f8f8;
}

body.product_page table.price_list th i {
  margin-right: 6px;
}

body.product_page .freearea pre {
  white-space: pre-wrap;
}

#modal_box .cart_area {
  padding: 8px 15px 0;
}

#modal_box .cart_area dl {
  margin-bottom: 8px;
}

#products h1 {
  font-size: 22px !important;
  color: #CB4042;
  text-align: center;
  border-bottom: 3px double #CB4042;
  padding-bottom: 5px;
  letter-spacing: 2px;
}

#products h2 {
  font-size: 18px;
  margin-bottom: 0;
}

#products > ul > li {
  margin-bottom: 20px;
}

#products > ul > li > a section {
  background: #f8f8f8;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 15px;
  text-align: center;
}

#products > ul > li > a h2 {
  color: #525263;
}

#products > ul > li > a:hover section {
  background: #ebebeb;
}

main.guide em, main.guide strong {
  color: #CB4042;
  font-style: normal;
}

#guide_index ul li {
  margin-bottom: 15px;
}

#guide_index ul li a {
  display: block;
  background: #f8f8f8;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 15px;
  text-align: center;
  color: #525263;
  position: relative;
}

@media (min-width: 768px) {
  #guide_index ul li a {
    font-size: 1.8rem;
  }
}

#guide_index ul li a:hover {
  background: #ebebeb;
  color: #525263;
}

#guide_index ul li a:after {
  font-family: FontAwesome;
  content: "\f138";
  position: absolute;
  right: 20px;
  color: #ccc;
}

#guide_paste iframe {
  width: 100%;
  height: 300px;
  margin-bottom: 20px;
}

#guide_paste #shouji > h1, #guide_paste #fusuma > h1 {
  font-size: 26px;
  font-weight: normal;
  color: #fff;
  background: #CB4042;
  padding: 6px;
  text-align: center;
}

#guide_paste #shouji ol li, #guide_paste #fusuma ol li {
  position: relative;
  text-align: center;
}

#guide_paste #shouji ol li i, #guide_paste #fusuma ol li i {
  position: absolute;
  display: inline-block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(203, 64, 66, 0.8);
  font-style: normal;
  font-size: 26px;
  color: #fff;
  top: 1%;
  left: 10%;
  padding-top: 8px;
}

#guide_paste #fusuma > h1 {
  background: #0089A7;
}

#guide_paste #fusuma ol li i {
  background: rgba(0, 137, 167, 0.8);
}

#guide_size #step > h1 {
  font-size: 26px;
  font-weight: normal;
  color: #fff;
  background: #CB4042;
  padding: 6px;
  text-align: center;
}

#guide_size #step > ol > li {
  border-bottom: 1px solid #ccc;
  padding-bottom: 20px;
  margin-bottom: 30px;
}

#guide_size #step > ol > li:last-child {
  border: none;
}

#guide_size #step > ol > li > section h1 {
  font-size: 22px;
  color: #CB4042;
  display: table;
}

#guide_size #step > ol > li > section h1 i, #guide_size #step > ol > li > section h1 span {
  display: table-cell;
  vertical-align: middle;
}

#guide_size #step > ol > li > section h1 i {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #CB4042;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  font-style: normal;
}

#guide_size #step > ol > li > section h1 i small {
  display: block;
  font-size: 15px;
  font-weight: normal;
}

#guide_size #step > ol > li > section h1 span {
  padding-left: 10px;
}

#guide_size #step > ol > li > section h2 {
  font-size: 1.8rem;
  border-bottom: 1px dotted;
}

@media (min-width: 768px) {
  #guide_size #step > ol > li > section h2 {
    font-size: 2.4rem;
  }
}

#guide_size #others > h1 {
  font-size: 26px;
  font-weight: normal;
  color: #fff;
  background: #0089A7;
  padding: 6px;
  text-align: center;
}

#guide_size #others > section {
  border-bottom: 1px solid #ccc;
  padding-bottom: 20px;
  margin-bottom: 30px;
}

#guide_size #others > section:last-child {
  border: none;
  padding-bottom: 0;
  margin-bottom: 0;
}

#guide_size #others > section h1 {
  font-size: 1.8rem;
  border-bottom: 1px dotted;
  color: #0089A7;
}

@media (min-width: 768px) {
  #guide_size #others > section h1 {
    font-size: 2.4rem;
  }
}

#guide_size #others > section h1 span {
  font-weight: normal;
}

#guide_faq dl dt {
  font-size: 1.6rem;
  font-weight: bold;
  margin-bottom: 6px;
}

@media (min-width: 768px) {
  #guide_faq dl dt {
    font-size: 1.8rem;
  }
}

#guide_faq dl dt:before {
  content: "Q";
  margin-right: 6px;
  color: #CB4042;
}

#guide_faq dl dd {
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 10px;
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  #guide_faq dl dd {
    padding: 20px;
    margin-bottom: 30px;
  }
}

#guide_upload #rendering h1 {
  font-size: 26px;
  border: 1px solid;
  padding: 6px;
  text-align: center;
}

#guide_upload #rendering section {
  margin-bottom: 30px;
}

@media (min-width: 768px) {
  #guide_upload #rendering section {
    text-align: center;
  }
}

#guide_upload #rendering section.shouji h1 {
  color: #CB4042;
}

#guide_upload #rendering section.fusuma h1 {
  color: #0089A7;
}

#guide_upload #tab_group > h1 {
  font-size: 26px;
  font-weight: normal;
  color: #fff;
  background: #666;
  padding: 6px;
  text-align: center;
}

#guide_upload #tab_group ul.tab {
  text-align: center;
  font-size: 0;
}

#guide_upload #tab_group ul.tab li {
  font-size: 14px;
  font-weight: bold;
  display: inline-block;
  width: 50%;
  background: #efefef;
  cursor: pointer;
  padding: 10px 3px;
  border-bottom: 1px solid #CB4042;
}

#guide_upload #tab_group ul.tab li:hover {
  background: #ddd;
}

#guide_upload #tab_group ul.tab li:after {
  font-family: FontAwesome;
  content: "\f13a";
  color: #CB4042;
  display: block;
}

#guide_upload #tab_group ul.tab li.active {
  background: #fff;
  border: 1px solid #CB4042;
  border-bottom: none;
  color: #CB4042;
}

@media (min-width: 768px) {
  #guide_upload #tab_group ul.tab {
    margin: 40px 0;
  }
  #guide_upload #tab_group ul.tab li {
    font-size: 18px;
  }
}

#guide_upload #step > h1 {
  font-size: 26px;
  font-weight: normal;
  color: #fff;
  background: #CB4042;
  padding: 6px;
  text-align: center;
}

#guide_upload #step > ol > li {
  border-bottom: 1px solid #ccc;
  padding-bottom: 20px;
  margin-bottom: 30px;
}

#guide_upload #step > ol > li:last-child {
  border: none;
}

#guide_upload #step > ol > li > section h1 {
  font-size: 22px;
  color: #CB4042;
  display: table;
}

#guide_upload #step > ol > li > section h1 i, #guide_upload #step > ol > li > section h1 span {
  display: table-cell;
  vertical-align: middle;
}

#guide_upload #step > ol > li > section h1 i {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: #CB4042;
  color: #fff;
  text-align: center;
  line-height: 1.2;
  font-style: normal;
}

#guide_upload #step > ol > li > section h1 i small {
  display: block;
  font-size: 15px;
  font-weight: normal;
}

#guide_upload #step > ol > li > section h1 span {
  padding-left: 10px;
}

#guide_upload #step > ol > li > section h2 {
  font-size: 1.8rem;
  border-bottom: 1px dotted #ddd;
  padding-bottom: 10px;
}

@media (min-width: 768px) {
  #guide_upload #step > ol > li > section h2 {
    font-size: 2.4rem;
  }
}

#guide_upload #step > ol > li > section h2.strong {
  color: #e3282a;
  border: 1px solid;
  padding: 20px;
}

#guide_upload #step.step_fusuma > ol > li > section h1 {
  color: #0089A7;
}

#guide_upload #step.step_fusuma > ol > li > section h1 i {
  background: #0089A7;
}

#guide_upload #step .box {
  border: 3px solid #efefef;
  padding: 15px;
  margin-bottom: 20px;
}

#guide_upload #step .box h3 {
  margin-top: 0;
}

main.page .container-fluid > .row > .col-md-10 > section:not(:last-child) {
  margin-bottom: 60px;
}

main.page h2 {
  border-bottom: 1px solid #ccc;
  padding-bottom: 6px;
}

main.page ul {
  list-style: square;
  padding-left: 1.5em;
}

main.page ul li:not(:last-child) {
  margin-bottom: 10px;
}

main.page dl dd:not(:last-child) {
  margin-bottom: 10px;
}