@charset "UTF-8";
/*
開閉式セクション／.accordion_section
======================================================================
*/
.accordion_section {
  padding-top: 56px;
  margin-top: calc(-56px - 1px);
}
@media screen and (min-width: 1024px) {
  .accordion_section {
    padding-top: min(7.4vw, 100px);
    margin-top: calc(min(7.4vw, 100px) * -1 - 1px);
  }
}

.accordion_section--body {
  display: none;
  padding: 1.4em 0.8em 2em;
}

.accordion_section--heading .title {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #FFF2F9;
  padding: 7px 12px 6px;
  border: solid #FF008E;
  border-width: 1px 0;
  cursor: pointer;
  font-size: 0.18rem;
  font-weight: 600;
  line-height: 1.5;
}
.accordion_section--heading .title i {
  margin-left: 1em;
  font-size: 0.14rem;
}
@media screen and (min-width: 1280px) {
  .accordion_section--heading .title {
    font-size: 0.24rem;
  }
  .accordion_section--heading .title i {
    font-size: 0.18rem;
  }
}
.accordion_section--heading .fa-minus {
  display: none;
}

.accordion_section a {
  color: #0099EE;
  text-decoration: underline;
}
.accordion_section p + p {
  margin-top: 1em;
}
.accordion_section img {
  height: auto;
}

.accordion_section.is-open .accordion_section--heading .fa-minus {
  display: inline;
}
.accordion_section.is-open .accordion_section--heading .fa-plus {
  display: none;
}

/*
固定ページ系の見出し／.sub_title
======================================================================
　固定ページ等の管理画面内でコーディングされたコンテンツで使用されている
　（採用情報など）
*/
.sub_title {
  border-bottom: 2px solid #333;
  padding-bottom: 0.14rem;
  margin-bottom: 0.4rem;
}
.sub_title h2 {
  display: inline-block;
  font-weight: bold;
  font-size: 0.2rem;
  line-height: 1.3;
}
@media (min-width: 1280px) {
  .sub_title h2 {
    font-size: 0.27rem;
  }
}

/*
固定ページ系の見出し／.lead
======================================================================
　固定ページ等の管理画面内でコーディングされたコンテンツで使用されている
　（採用情報など）
*/
.lead_L {
  margin-bottom: 0.25rem;
  padding-bottom: 0.12rem;
  font-size: 0.18rem;
  font-weight: bold;
  border-bottom: 1px solid #333;
}
@media (min-width: 1280px) {
  .lead_L {
    font-size: 0.26rem;
  }
}

.lead_M {
  margin-bottom: 0.2rem;
  font-size: 0.16rem;
  font-weight: bold;
}
@media (min-width: 1280px) {
  .lead_M {
    font-size: 0.18rem;
  }
}

/*
固定ページ系のdl用／.page_content
======================================================================
　固定ページ等の管理画面内でコーディングされたコンテンツで使用されている
　（会社概要など）
*/
dl.page_content {
  padding-bottom: 1.4em;
  margin-bottom: 0;
}
dl.page_content dt {
  padding: 5px 12px 7px;
  position: relative;
  font-size: 0.18rem;
  font-weight: bold;
  line-height: 1.5;
}
@media screen and (min-width: 1280px) {
  dl.page_content dt {
    font-size: 0.24rem;
  }
}
dl.page_content dt::before {
  content: "";
  width: 2px;
  height: 100%;
  background-color: #FF008E;
  position: absolute;
  top: 0;
  left: 0;
}
dl.page_content dd {
  padding: 12px 12px 1.4em;
  border-bottom: 1px solid #DEDEDE;
}
dl.page_content dd a {
  color: #0099EE;
  text-decoration: underline;
}
dl.page_content dd + dt {
  margin-top: 1.4em;
}

/*
取り扱い店舗用／.shop-list
======================================================================
固定ページ「取り扱い店舗」の管理画面内でコーディングされたコンテンツに使用されている
旧システムから続く管理画面内の登録データなので、classの命名が古いままとなっている
*/
.shop-list thead {
  display: none;
}
.shop-list tbody {
  display: block;
}
.shop-list tbody tr {
  display: block;
  border-bottom: dotted 1px #ACA4A5;
  padding-bottom: 16px;
  margin-bottom: 31px;
}
@media (min-width: 1024px) {
  .shop-list tbody tr {
    padding-bottom: 16px;
    margin-bottom: 31px;
  }
}
.shop-list tbody tr:last-child {
  margin-bottom: 50px;
}
.shop-list tbody td {
  padding: 0 15px 9px 15px;
  display: list-item;
  list-style-type: none;
}
.shop-list tbody td:before {
  display: block;
  width: 100%;
  color: #DC5059;
  margin-bottom: 5px;
}
.shop-list tbody td:nth-of-type(1):before {
  content: "[都道府県]";
}
.shop-list tbody td:nth-of-type(2):before {
  content: "[ショップ名]";
}
.shop-list tbody td:nth-of-type(3):before {
  content: "[取扱い商品]";
}
.shop-list tbody td:nth-of-type(4):before {
  content: "[連絡先]";
}

/*
店舗案内のセクション／.shpoinfo_section
======================================================================
店舗案内ページで使用
*/
.shopinfo_section + .shopinfo_section {
  margin-top: 3em;
}

.shopinfo_section--body {
  padding: 1.4em 0.8em 0;
}

.shopinfo_section a {
  color: #0099EE;
  text-decoration: underline;
}
.shopinfo_section p + p {
  margin-top: 1em;
}
@media (max-width: 600px) {
  .shopinfo_section .shop_link {
    text-align: center;
  }
}
.shopinfo_section .shop_link a {
  display: inline-block;
  width: 100%;
  max-width: 300px;
  height: 100%;
  line-height: 50px;
  background-color: #FDCFCF;
  border: 1px solid #FDCFCF;
  border-radius: 4px;
  color: #333;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
}
.shopinfo_section .image_column {
  text-align: center;
}
@media (max-width: 601px) {
  .shopinfo_section .txt_column {
    padding-top: 1em;
  }
}
@media (min-width: 600px) {
  .shopinfo_section .shop_top_column {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
  }
  .shopinfo_section .shop_top_column .image_column {
    width: 200px;
  }
  .shopinfo_section .shop_top_column .txt_column {
    flex: 1;
    padding-left: 1.6em;
  }
}

/*
メインバナー一覧／.main_banner_list
======================================================================
メインバナー一覧ページで使用
*/
@media (min-width: 600px) {
  .main_banner_list {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 0 2%;
  }
}

.main_banner_list .main_banner {
  margin-bottom: 1em;
}
.main_banner_list .main_banner .title {
  padding-top: 0.4em;
  font-weight: bold;
}
@media (min-width: 600px) {
  .main_banner_list .main_banner {
    width: 49%;
  }
}
@media (min-width: 768px) {
  .main_banner_list:after {
    content: "";
    display: block;
    width: 32%;
  }
  .main_banner_list .main_banner {
    width: 32%;
  }
}

/*
固定ページ用リスト／.page_list
======================================================================
固定ページ「ご利用規約」などの管理画面内でコーディングされたコンテンツに使用されている
旧システムから続く管理画面内の登録データなので、classの命名が古いままとなっている
*/
.page_list {
  list-style: disc;
  padding-left: 1.4em;
}

/*
固定ページ用記事セクション／.page_entry_section
======================================================================
固定ページ用テンプレート「default-list.tpl」内で記事一覧として使用されている
*/
.page_entry_section {
  padding-top: 2em;
}
.page_entry_section:first-child {
  padding-top: 0;
}

.page_entry_section--body {
  padding: 0.7em 0 0;
}

.page_entry_section .banner + .title {
  padding-top: 0.8em;
}
.page_entry_section .title a {
  display: block;
  color: #0099EE;
  font-size: 20px;
  line-height: 1.5;
  white-space: break-spaces;
}
.page_entry_section .title a:hover {
  text-decoration: underline;
}

/*
固定ページ詳細／.page_entry_detail
======================================================================
固定ページ詳細用テンプレート「page/category/pattern/default-list.tpl」内で特集詳細として使用されている
*/
/* 商品一覧のカタログ表示 */
.page_entry_detail--item_list .item-catalog {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 30px;
  font-size: 0;
}
.page_entry_detail--item_list .item-catalog .wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  width: 50%;
  margin-bottom: 7px;
  padding: 13px 7px;
  box-sizing: border-box;
  vertical-align: top;
}
.page_entry_detail--item_list .item-catalog .wrap .new-color {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.page_entry_detail--item_list .item-catalog .wrap .image {
  border: solid 6px #DDDDDD;
  text-align: center;
  margin-bottom: 10px;
}
.page_entry_detail--item_list .item-catalog .wrap .image img {
  width: 100%;
  height: auto;
}
.page_entry_detail--item_list .item-catalog .wrap .name {
  text-align: center;
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 0.13rem;
}
.page_entry_detail--item_list .item-catalog .wrap .btn-detail {
  width: 100%;
  margin: 0 auto;
  background: none;
}
.page_entry_detail--item_list .item-catalog .wrap .btn-detail a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 30px;
  margin: 0;
  padding: 0;
  background: #ffffff;
  border: 1px solid #c4c4c4;
  border-radius: 4px;
  color: #333;
  font-size: 0.12rem;
  text-align: center;
  text-decoration: none;
}
.page_entry_detail--item_list .newline-mb {
  display: block;
}

/*
SALEの記事一覧／.sale_entry_list
======================================================================
固定ページ用テンプレート「sale-list.tpl」内で記事一覧として使用されている
一覧内の各項目は「SALEのセクション」として「_sale_entry_section.scss」に記述
*/
.sale_entry_list--body {
  padding: 3em 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0 2%;
}

/*
SALEのセクション／.sale_entry_section
======================================================================
固定ページ用テンプレート「sale-list.tpl」内で記事一覧内の各項目として使用されている
*/
.sale_entry_section {
  padding-top: 2em;
  width: 48%;
}
.sale_entry_section:first-child, .sale_entry_section:nth-child(2) {
  padding-top: 0;
}
@media (min-width: 600px) {
  .sale_entry_section {
    width: 46%;
  }
}

.sale_entry_section--body {
  padding: 0.7em 0 0;
}

.sale_entry_section .banner + .title {
  padding-top: 0.8em;
}
.sale_entry_section .title a {
  display: block;
  color: #0099EE;
  font-size: 20px;
  line-height: 1.5;
  white-space: break-spaces;
}
.sale_entry_section .title a:hover {
  text-decoration: underline;
}

/*
スタッフイチオシ！のカテゴリ一覧／.staff_recommend_category_list
======================================================================
固定ページ用テンプレート「staff_recommend-category_list.tpl」内でカテゴリ一覧として使用されている
一覧内の各項目は「スタッフイチオシ！カテゴリのセクション」として「_staff_recommend_category_section.scss」に記述
*/
.staff_recommend_category_list--body {
  padding: 3em 0;
}

/*
スタッフイチオシ！カテゴリのセクション／.staff_recommend_category_section
======================================================================
固定ページ用テンプレート「staff_recommend-category_list.tpl」内でカテゴリ一覧内の各項目として使用されている
*/
.staff_recommend_category_section {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0 1em;
}
.staff_recommend_category_section + .staff_recommend_category_section {
  margin-top: 3em;
  border-top: 1px solid #DEDEDE;
  padding-top: 3em;
}

.staff_recommend_category_section--image {
  width: 30%;
  max-width: 160px;
}

.staff_recommend_category_section--data {
  flex: 1;
}

.staff_recommend_category_section .title a {
  color: #0099EE;
  font-weight: bold;
  text-decoration: underline;
}

/*
スタッフイチオシ！の記事一覧／.staff_recommend_entry_list
======================================================================
固定ページ用テンプレート「staff_recommend-list.tpl」内で記事一覧として使用されている
一覧内の各項目は「スタッフイチオシ！のセクション」として「_staff_recommend_entry_section.scss」に記述
*/
.staff_recommend_entry_list--body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0 2%;
}

.staff_recommend_entry_list--footer {
  max-width: 715px;
  margin: 3em auto 0;
  text-align: center;
}

.staff_recommend_entry_list--inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0 2%;
  padding: 2em 0 3em;
}

.staff_recommend_entry_list--footer .btn {
  width: 600px;
  max-width: 100%;
}

/*
スタッフイチオシ！のセクション／.staff_recommend_entry_section
======================================================================
固定ページ用テンプレート「staff_recommend-list.tpl」内で記事一覧内の各項目として使用されている
*/
.staff_recommend_entry_section {
  padding-top: 2em;
  width: 48%;
}
.staff_recommend_entry_section:first-child, .staff_recommend_entry_section:nth-child(2) {
  padding-top: 0;
}
@media (min-width: 600px) {
  .staff_recommend_entry_section {
    width: 46%;
  }
}

.staff_recommend_entry_section--body {
  padding: 0.7em 0 0;
}

.staff_recommend_entry_section .banner + .title {
  padding-top: 0.8em;
}
.staff_recommend_entry_section .title a {
  display: block;
  color: #0099EE;
  font-weight: bold;
  line-height: 1.4;
  white-space: break-spaces;
}
.staff_recommend_entry_section .title a:hover {
  text-decoration: underline;
}

/*
デザインカット＆セットサービス（固定ページ）／.designcut_set_service
======================================================================
固定ページ「デザインカット＆セットサービス」の管理画面内でコーディングされたコンテンツ用
詳細ページのほうは _sass/contents/block/entry/_design-cs.scss に記述
Roots内部要素は旧システムから続く管理画面内の登録データなので、classの命名が古いままとなっている
*/
.designcut_set_service .lastone {
  margin-top: 10px;
}

/*
リンクバナー一覧／.link_banner_list
======================================================================
https://www.assist-wig.com/page/link 専用
*/
.link_banner_list .link_banner + .link_banner {
  margin-top: 2em;
}
.link_banner_list .link_banner img {
  height: auto;
}
.link_banner_list .link_banner textarea {
  width: 100%;
  height: auto;
  margin-top: 0.4em;
  padding: 0.4em;
}

.dir-page .heading-pink + * {
  margin-top: 1em;
}

.page-design-cs .page_contents.l-width-contents, .page-design-cs .entry_contents.l-width-contents {
  max-width: 715px;
}
.page-design-cs .page_contents .required, .page-design-cs .page_contents .caution, .page-design-cs .page_contents .f-point, .page-design-cs .entry_contents .required, .page-design-cs .entry_contents .caution, .page-design-cs .entry_contents .f-point {
  color: #f00000;
}

.page-3dsecure .page_section {
  margin-top: 50px;
}
.page-3dsecure .page_section--body {
  margin-top: 20px;
}
.page-3dsecure .page_section--footer p {
  margin: 0;
}

.page-3dsecure .page_section-about_3dsecure .secure_card_brands {
  margin-top: 20px;
  padding: 30px 50px;
  background: #f2f2f2;
}
@media (max-width: 768px) {
  .page-3dsecure .page_section-about_3dsecure .secure_card_brands {
    padding: 30px 5%;
    margin-left: -5%;
    margin-right: -5%;
  }
}
.page-3dsecure .page_section-about_3dsecure .secure_card_brands--header .title {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.3;
  text-align: center;
}
.page-3dsecure .page_section-about_3dsecure .secure_card_brands--body {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1em 2%;
  margin: 20px auto 0;
}
@media (max-width: 1023px) {
  .page-3dsecure .page_section-about_3dsecure .secure_card_brands--body {
    justify-content: center;
    flex-wrap: wrap;
    gap: 1em 4%;
  }
}
@media (max-width: 414px) {
  .page-3dsecure .page_section-about_3dsecure .secure_card_brands--body {
    justify-content: space-between;
  }
}
.page-3dsecure .page_section-about_3dsecure .secure_card_brand {
  width: 164px;
  text-align: center;
}
@media (max-width: 1023px) {
  .page-3dsecure .page_section-about_3dsecure .secure_card_brand {
    max-width: 48%;
  }
}
.page-3dsecure .page_section-about_3dsecure .secure_card_brand--name {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.5;
}

.page-3dsecure .page_section-secure_how_to_use .secure_steps {
  margin-top: 20px;
}
.page-3dsecure .page_section-secure_how_to_use .secure_steps--header .title {
  font-size: 18px;
  font-weight: bold;
}
.page-3dsecure .page_section-secure_how_to_use .secure_steps--body {
  margin-top: 16px;
}
.page-3dsecure .page_section-secure_how_to_use .secure_step {
  border: 1px solid #dedede;
}
@media (min-width: 768px) {
  .page-3dsecure .page_section-secure_how_to_use .secure_step {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
  }
}
.page-3dsecure .page_section-secure_how_to_use .secure_step + .secure_step {
  margin-top: 20px;
}
.page-3dsecure .page_section-secure_how_to_use .secure_step--header {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 7px;
  background: #f7f7f7;
}
@media (min-width: 768px) {
  .page-3dsecure .page_section-secure_how_to_use .secure_step--header {
    width: 160px;
  }
}
.page-3dsecure .page_section-secure_how_to_use .secure_step--body {
  flex: 1;
  padding: 20px 30px;
}
.page-3dsecure .page_section-secure_how_to_use .secure_step--heading {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 3px;
  font-size: 16px;
  font-weight: bold;
  font-family: "Meiryo", "メイリオ", "Arial", "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro", sans-serif;
}
.page-3dsecure .page_section-secure_how_to_use .secure_step--heading .number {
  font-size: 24px;
  transform: translateY(2px);
}
.page-3dsecure .page_section-secure_flow .secure_flow--image {
  text-align: center;
}
@media (min-width: 1024px) {
  .page-3dsecure .page_section-secure_flow .secure_flow--image .secure_flow--image-sp {
    display: none;
  }
}
@media (max-width: 1023px) {
  .page-3dsecure .page_section-secure_flow .secure_flow--image .secure_flow--image-pc {
    display: none;
  }
}
.page-3dsecure .page_section-secure_flow .page_section--footer {
  margin-top: 30px;
}
.page-3dsecure .page_section-secure_how_to_use .page_section--footer {
  margin-top: 20px;
}

/*# sourceMappingURL=page.css.map */