@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/**********************
**********************
ユーティリティ
**********************
**********************/
.u-sp-only {
  display: none;
}

@media screen and (max-width: 767px) {
  .u-sp-only {
    display: block;
  }
  .u-pc-only {
    display: none;
  }
}

/**********************
**********************
調整用CSS
**********************
**********************/
.page-id-1139 .p-breadcrumb,
.page-id-1139 .l-topTitleArea {
  display: none;
}

.page-id-1139 .l-content {
  padding-top: 0 !important;
}

.page-id-12 .p-breadcrumb,
.page-id-12 .l-topTitleArea {
  display: none;
}

.page-id-12 .l-content {
  padding-top: 0 !important;
}

/**********************
**********************
ヘッダー
**********************
**********************/
.l-header__bar {
  display: none;
}

.-parallel .l-header__logo {
  padding-left: 20px;
}

@media screen and (min-width: 960px) {
  .-parallel .l-header__logo {
    text-align: left;
    width: calc(58% - 10px);
    padding-left: 70px;
    position: relative;
    display: flex;
    align-items: center;
    gap: 24px;
  }

  .-parallel .l-header__inner {
    gap: 0 20px;
  }

  .-parallel .l-header__logo::after {
    content: "芦屋のダイヤ・ジュエリー・ブランド買取専門店　リライト";
    font-weight: 500;
    font-size: 16px;
    color: var(--color_main);
  }
}

.-img .c-headLogo__link {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.l-header.-parallel .w-header {
  width: calc(42% - 10px);
  justify-content: flex-end;
  padding-right: 48px;
}

.l-header.-parallel .w-header__inner {
  width: 100%;
}

.-parallel-bottom .l-header__gnav {
  background-color: var(--color_main);
}

.l-fixHeader .c-gnav .ttl {
  color: var(--color_main);
}

.l-header .is-style-btn_line a {
  padding: 0.5em;
}

/* ヘッダー追従 */
.l-header {
  position: -webkit-sticky;
  position: sticky;
}

.l-fixHeader {
  display: none;
}

/**********************
**********************
ボタン全般
**********************
**********************/
.is-style-btn_line a {
  border: 3px solid;
}

/**********************
**********************
LINEボタン
**********************
**********************/
.is-style-btn_line.line-btn .swell-block-button__link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.is-style-btn_line.line-btn .swell-block-button__link::before {
  content: "";
  width: clamp(24px, 2.2vw, 32px);
  height: clamp(24px, 2.2vw, 32px);
  background: url(assets/images/line-icon.png) no-repeat center center / contain;
}

/**********************
**********************
TELボタン
**********************
**********************/
.is-style-btn_line.tel-btn .swell-block-button__link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.is-style-btn_line.tel-btn .swell-block-button__link::before {
  content: "";
  width: clamp(22px, 2vw, 30px);
  height: clamp(24px, 2.2vw, 32px);
  -webkit-mask-image: url(assets/images/tel-icon.png);
  mask-image: url(assets/images/tel-icon.png);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  background: var(--color_main);
  transition: background 0.25s;
}

.is-style-btn_line.tel-btn .swell-block-button__link:hover::before {
  background: #fff;
}

/**********************
**********************
TOPページ（買取実績を見る）
矢印ボタン
**********************
**********************/
.arrow-btn a {
  color: var(--color_main);
  font-size: 20px;
  position: relative;
  transition: opacity 0.25s;
}

.arrow-btn a::before {
  content: "";
  position: absolute;
  left: -10%;
  bottom: -12px;
  width: 140%;
  height: 25px;
  -webkit-mask-image: url(assets/images/arrow-btn-icon.png);
  mask-image: url(assets/images/arrow-btn-icon.png);
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center center;
  mask-position: center center;
  background: var(--color_main);
  transition: transform 0.25s;
}

.arrow-btn a:hover {
  opacity: 0.7;
}

.arrow-btn a:hover::before {
  transform: translateX(5px);
}

/**********************
**********************
余白調整
**********************
**********************/
.post_content h2 {
  margin: 2em 0 1em;
}

.post_content h3 {
  margin: 1.5em 0 1em;
}

/**********************
**********************
TOPページ
MVテキスト
**********************
**********************/
.post_content h2.mv-main-text {
  margin-bottom: 0.5em;
}

@media screen and (max-width: 480px) {
  .post_content h2.mv-main-text {
    font-size: 1.8em !important;
  }
  .post_content .mv-sub-text {
    font-size: 1.2em !important;
    text-align: left !important;
  }
}

/**********************
**********************
TOPページ
安心してご来店いただくために。
**********************
**********************/
.safe-block .wp-block-heading span {
  border-radius: 9999px;
  max-width: 80%;
  width: 100%;
  display: block;
  margin-inline: auto;
}

/**********************
**********************
お問い合わせCTAエリア
**********************
**********************/
.contact-cta h2 {
  margin-bottom: 0.5em;
}

.contact-cta .swell-block-button .swell-block-button__link {
  background: #fff;
}

.contact-cta .swell-block-button .swell-block-button__link:hover {
  background: var(--color_main);
}

/**********************
**********************
店舗情報
**********************
**********************/
.access-info-block iframe {
  display: block;
  aspect-ratio: 461 / 394;
  width: 100%;
  height: 100%;
}

.access-info-logo {
  width: 200px;
}

@media screen and (max-width: 768px) {
  .access-info-block iframe {
    aspect-ratio: 4 / 3;
  }

  .access-info-logo {
    width: 150px;
  }
}

/**********************
**********************
ギャラリースライダー
**********************
**********************/
.wp-block-image.swiper-slide {
  aspect-ratio: 258 / 300;
  width: 258px !important;
  overflow: hidden;
  border-radius: 20px;
}

@media screen and (max-width: 480px) {
  .wp-block-image.swiper-slide {
    width: 150px !important;
  }
}

.gallery-slider .swiper-wrapper {
  transition-timing-function: linear;
}

.wp-block-image.swiper-slide img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

/**********************
**********************
フッター
**********************
**********************/
.l-footer .textwidget.custom-html-widget {
  justify-content: center;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

/**********************
**********************
買取品目一覧（TOPパーツ）
**********************
**********************/
.top-items .swell-block-column {
  display: flex;
  flex-direction: column;
}
.top-items .swell-block-column .wp-block-image {
  flex: 1;
  place-content: center;
}

.top-items
  .is-style-clmn-border
  > .swell-block-columns__inner
  > .swell-block-column {
  border: 1px solid var(--color_main);
}

/**********************
**********************
インナー幅
**********************
**********************/
.inner--sm {
  max-width: 820px;
  width: 100%;
  margin-inline: auto;
}

/**********************
**********************
本日の金・貴金属買取相場レート
**********************
**********************/
.gold-rate-today-heading {
  margin-bottom: 0 !important;
}

/**********************
**********************
TOPへ戻るボタン
**********************
**********************/
.c-fixBtn {
  color: #fff;
  background: var(--color_main);
  opacity: 1;
}

.c-fixBtn__icon {
  font-size: 40px;
}

/**********************
**********************
買取方法
**********************
**********************/
h3.top-method-heading {
  margin: 0 0 0.5em;
}

.top-method.is-style-clmn-border
  > .swell-block-columns__inner
  > .swell-block-column {
  border: 1px solid var(--color_main);
  background: #fff;
}

.top-method-btn.swell-block-button .swell-block-button__link {
  background: #fff;
}

.top-method-btn.swell-block-button .swell-block-button__link:hover {
  background: var(--color_main);
}

/**********************
**********************
買取実績（5カラム）
**********************
**********************/
.results-list.p-postList.-type-thumb .p-postList__title {
  font-size: 14px;
}

.results-list .p-postList__price {
  font-size: 16px;
  margin-top: 0.25em;
  display: flex;
  font-weight: 700;
  line-height: 1.5;
}

.results-list .c-postThumb__figure:before {
  padding-top: 80%;
}

.results-list .-type-card .p-postList__link {
  height: 100%;
  border: 1px solid var(--color_main);
}
.results-list .p-pickupBanners__item .c-bannerLink,
.results-list .p-postList__thumb {
  box-shadow: none;
}

.results-list .-type-big .p-postList__body,
.results-list .-type-card .p-postList__body {
  display: flex;
  flex-direction: column;
  padding-top: 0;
  padding: 1em;
  border-top: 1px solid var(--color_main);
}

.results-list .-type-card .p-postList__item {
  margin-bottom: 1em;
}

@media (min-width: 1200px) {
  .-sidebar-off .results-col5 .-type-card.-pc-col3 .p-postList__item,
  .-sidebar-off .results-col5 .-type-thumb.-pc-col3 .p-postList__item {
    width: 20%;
  }

  .-sidebar-off .results-col4 .-type-card.-pc-col3 .p-postList__item,
  .-sidebar-off .results-col4 .-type-thumb.-pc-col3 .p-postList__item {
    width: 25%;
  }
}

/**********************
**********************
コラムスライダー（4カラム2段）
**********************
**********************/
.column-slider {
  margin-inline: 40px;
}

.column-slider.is-no-slider .p-postList .p-postList__item {
  width: 25%;
}

.column-slider .column-slide-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 24px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.column-slider .swiper-button-next,
.column-slider .swiper-button-prev {
  color: var(--color_main);
  margin-top: 0;
  top: 50%;
  transform: translateY(-50%);
}

.column-slider .swiper-button-next,
.column-slider .swiper-rtl .swiper-button-prev {
  right: -50px;
}

.column-slider .swiper-button-prev,
.column-slider .swiper-rtl .swiper-button-next {
  left: -50px;
}

.column-slider .p-postList__body {
  margin-top: 0.75em;
}

.column-slider h3.p-postList__title {
  font-size: 1.2em;
  margin-bottom: 0;
}

@media screen and (max-width: 1200px) {
  .column-slider .column-slide-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .column-slider.is-no-slider .p-postList .p-postList__item {
    width: 50%;
  }
}

@media screen and (max-width: 599px) {
  .column-slider .column-slide-grid {
    grid-template-columns: 1fr;
  }

  .column-slider.is-no-slider .p-postList .p-postList__item {
    width: 100%;
  }
}

/**********************
**********************
カテゴリーラベル
**********************
**********************/
.c-postThumb__cat {
  font-size: 0.9em;
}
@media (min-width: 600px) {
  .c-postThumb__cat {
    font-size: 0.8em;
  }
}
@media not all and (min-width: 600px) {
  .c-postThumb__cat {
    transform: scale(1);
  }
}

/**********************
**********************
下層ページ
メインビジュアル
**********************
**********************/
.l-topTitleArea.c-filterLayer::before,
.l-topTitleArea__img.c-filterLayer__img.u-obf-cover,
.c-filterLayer.-texture-dot:after {
  display: none;
}

.l-topTitleArea {
  min-height: initial;
  padding: 2.5em 0 0 0;
}

.l-topTitleArea__body {
  color: var(--color_main);
  text-shadow: none;
}

.c-pageTitle {
  font-size: 2em;
}

@media screen and (min-width: 600px) {
  .l-topTitleArea {
    padding: 5em 0 0 0;
  }

  .c-pageTitle {
    font-size: 2.5em;
  }
}

/**********************
**********************
下層ページ
会社概要ページ
**********************
**********************/
h3.mvv-value-sub-heading {
  margin: 1.5em 0 0.2em;
}

.company-table.wp-block-table td,
.company-table.wp-block-table th {
  padding: 1em 0;
}

.company-table a {
  color: var(--color_text);
}

@media screen and (min-width: 600px) {
  .company-table.wp-block-table td,
  .company-table.wp-block-table th {
    padding: 1.5em;
  }
}

/**********************
**********************
下層ページ
プライバシーポリシー
**********************
**********************/
.privacy-policy-wrapper {
  max-width: 1150px;
  border-radius: 8px;
  border: 1px solid var(--color_text);
  padding-block: 32px;
  padding-inline: 16px;
  box-sizing: content-box;
  margin-inline: auto;
}

.privacy-policy-wrapper h2 {
  margin: 1.5em 0 0.2em;
}

.privacy-policy-wrapper h3 {
  font-weight: 400;
  margin: 1.5em 0 0.2em;
  padding-inline: 4px;
}

.privacy-policy-text {
  padding-inline: 8px;
  margin-bottom: 0;
}

.privacy-policy-text-sub {
  padding-inline: 12px;
  margin-bottom: 0;
}

@media screen and (min-width: 600px) {
  .privacy-policy-wrapper {
    padding-block: 90px;
    padding-inline: 75px;
  }

  .privacy-policy-wrapper h2 {
    margin: 2em 0 0.2em;
  }

  .privacy-policy-wrapper h3 {
    margin: 2em 0 0.2em;
  }

  .privacy-policy-wrapper h3 {
    padding-inline: 10px;
  }

  .privacy-policy-text {
    padding-inline: 10px;
  }

  .privacy-policy-text-sub {
    padding-inline: 20px;
  }
}

/**********************
**********************
下層ページ
共通
**********************
**********************/
.page-top-heading {
  margin-bottom: 1em;
}

@media screen and (max-width: 599px) {
  .page-top-heading {
    font-size: 1.3em !important;
  }
}

/**********************
**********************
下層ページ
店舗情報ページ
**********************
**********************/
h3.shop-item-heading {
  margin: 1.5em 0 0.5em;
}

@media screen and (max-width: 599px) {
  .shop-item-heading {
    font-size: 1.3em !important;
  }
  .shop-page-top-heading .swl-fz {
    font-size: 0.8em !important;
  }
}

/**********************
**********************
下層ページ
買取方法ページ
**********************
**********************/
.how-to-sell-top-heading {
  margin-bottom: 0.5em;
}

.method-col2 .swell-block-column {
  background-color: #efefef;
  border-radius: 32px;
}

.method-col2 h3.is-style-section_ttl {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding-inline: 1em;
  padding-bottom: 0.2em;
  background-image: linear-gradient(transparent 60%, #ffffff 0);
}

.method-col2 .swell-block-button.is-style-btn_line .swell-block-button__link {
  background: #fff;
  border: 1px solid var(--color_main);
}

.method-col2
  .swell-block-button.is-style-btn_line
  .swell-block-button__link:hover {
  background: var(--color_main);
  color: #fff;
}

@media screen and (max-width: 599px) {
  .flow-item .flow-item-number {
    font-size: 1.2em !important;
  }
  .flow-item h3 {
    font-size: 1.3em !important;
  }
}

/**********************
**********************
下層ページ
買取品目一覧ページ
**********************
**********************/
.cat-list-icon-block .swell-block-box-menu__figure {
  background: #fff;
  border-radius: 50%;
}

.cat-list-icon-block .swell-block-box-menu__figure > img {
  -o-object-fit: contain;
  object-fit: contain;
  border-radius: 50%;
}

.cat-list-icon-block .swell-block-box-menu__link {
  padding: 0.5em 1em;
}

.cat-list-icon-block .swell-block-box-menu__item {
  border: 1px solid var(--color_text) !important;
}

.items-list .is-style-btn_line a {
  border: 1px solid;
}

/**********************
**********************
下層ページ
お問い合わせフォーム
**********************
**********************/
.wpforms-container {
  max-width: 1150px;
  border-radius: 8px !important;
  border: 1px solid var(--color_text) !important;
  margin-inline: auto;
  background-color: #f8f8f8 !important;
  margin: 0 !important;
}

.wpforms-container .wpforms-form {
  max-width: 820px;
  padding-block: 20px;
  padding-inline: 15px;
  margin-inline: auto;
  box-sizing: content-box;
}

.wpforms-container .wpforms-field {
  border-top: 1px solid #d5d5d5;
}

.wpforms-container .wpforms-field:first-child,
.wpforms-container .wpforms-field:last-child {
  border-top: none;
}

div.wpforms-container-full .wpforms-field-label,
.wp-core-ui div.wpforms-container-full .wpforms-field-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
}

.wpforms-container .wpforms-field,
.wp-core-ui div.wpforms-container .wpforms-field {
  padding: 24px 0;
}

.wpforms-required-label {
  color: transparent !important;
  position: relative !important;
}

.wpforms-required-label::after {
  content: "必須";
  font-size: 0.75em;
  color: #fff;
  background: #a7a7a7;
  padding-inline: 10px;
  padding-block: 1px;
}

.privacy-check {
  width: -webkit-fit-content !important;
  width: -moz-fit-content !important;
  width: fit-content !important;
  margin: 0 auto !important;
}

.privacy-check a {
  text-decoration: underline;
}

.wpforms-form .wpforms-submit-container {
  text-align: center;
}

.wpforms-submit {
  max-width: 294px;
  width: 100% !important;
  border-radius: 10px !important;
  margin-inline: auto;
  height: 52px !important;
}

div.wpforms-container-full .wpforms-confirmation-container-full,
div[submit-success]
  > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
  background: #f8f8f8;
  border: 1px solid var(--color_text);
}

@media screen and (min-width: 800px) {
  .wpforms-container .wpforms-form {
    padding-block: 80px;
    padding-inline: 20px;
  }

  .wpforms-container .wpforms-field {
    display: flex;
    align-items: center;
    gap: 90px;
  }

  div.wpforms-container-full .wpforms-field-label,
  .wp-core-ui div.wpforms-container-full .wpforms-field-label {
    margin-bottom: 0;
    min-width: 236px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 18px;
  }

  .wpforms-container .wpforms-field,
  .wp-core-ui div.wpforms-container .wpforms-field {
    padding: 32px 0;
  }
}

/**********************
**********************
下層ページ
タクソノミー一覧ページ
**********************
**********************/
.c-pageTitle__subTitle {
  font-style: normal;
  top: 0;
  font-size: 0.8em !important;
  opacity: 1;
}

@media screen and (max-width: 599px) {
  .c-pageTitle__subTitle {
    margin-left: 0;
  }

  .c-pageTitle {
    display: flex;
    flex-direction: column;
  }
}

/**********************
**********************
下層ページ
投稿ページ
**********************
**********************/
.c-postTitle__ttl {
  font-size: 2em;
}

.p-articleMetas {
  flex-direction: row-reverse;
  justify-content: space-between;
}

.p-articleMetas.-top .p-articleMetas__termList {
  font-size: 12px;
}

.c-taxList__link {
  background: var(--color_text);
  color: #fff;
  border-radius: 9999px;
  padding: 0.5em 1em;
}

.c-taxList:before {
  display: none;
}

.p-articleMetas.-bottom {
  display: none;
}

@media screen and (min-width: 600px) {
  .c-postTitle__ttl {
    font-size: 2.5em;
  }

  .p-articleMetas.-top .p-articleMetas__termList {
    font-size: 14px;
  }

  .c-taxList__link {
    padding: 1em 2em;
  }
}

/* 関連記事一覧スライダー（コラム） */
.p-relatedPosts-column-slider .p-postList {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 24px;
  margin-inline: 50px;
  margin-top: 50px;
}

.p-relatedPosts-column-slider.sp-slider {
  display: none;
}

.p-relatedPosts-column-slider .swiper-button-next,
.p-relatedPosts-column-slider .swiper-button-prev {
  color: var(--color_main);
  margin-top: 0;
  top: 50%;
  transform: translateY(-50%);
}

.p-relatedPosts-column-slider .swiper-button-next,
.p-relatedPosts-column-slider .swiper-rtl .swiper-button-prev {
  right: 0px;
}

.p-relatedPosts-column-slider .swiper-button-prev,
.p-relatedPosts-column-slider .swiper-rtl .swiper-button-next {
  left: 0px;
}

.p-relatedPosts-column-slider .p-postList__body {
  margin-top: 0.75em;
}

.p-relatedPosts-column-slider h3.p-postList__title {
  font-size: 1.2em;
  margin-bottom: 0;
}

.is-no-slider .swiper-button-next,
.is-no-slider .swiper-button-prev {
  display: none;
}

@media screen and (max-width: 1200px) {
  .p-relatedPosts-column-slider .p-postList {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 599px) {
  .p-relatedPosts-column-slider.sp-slider {
    display: block;
  }

  .p-relatedPosts-column-slider.pc-slider {
    display: none;
  }

  .p-relatedPosts-column-slider .p-postList {
    grid-template-columns: 1fr;
  }
}
