/* =========================================
Instagramライブ商品 購入ガイド
Thida Stone
========================================= */
.thida-guide {
width: 100%;
max-width: 920px;
margin: 0 auto;
padding: 24px 16px 60px;
background: #ffffff;
color: #333333;
font-family:
-apple-system,
BlinkMacSystemFont,
"Helvetica Neue",
"Hiragino Kaku Gothic ProN",
"Yu Gothic",
Meiryo,
sans-serif;
line-height: 1.9;
box-sizing: border-box;
}
.thida-guide *,
.thida-guide *::before,
.thida-guide *::after {
box-sizing: border-box;
}
/* =========================================
タイトル
========================================= */
.thida-guide__header {
text-align: center;
margin-bottom: 28px;
}
.thida-guide__title {
margin: 0;
font-size: 32px;
font-weight: 700;
line-height: 1.45;
letter-spacing: 0.02em;
color: #222222;
}
.thida-guide__title::after {
content: "";
display: block;
width: 70px;
height: 2px;
margin: 18px auto 0;
background: #c5a34a;
}
.thida-guide__lead {
margin: 18px 0 0;
font-size: 18px;
line-height: 1.9;
color: #555555;
}
/* =========================================
公開日案内
========================================= */
.thida-guide__notice {
margin: 20px auto 0;
padding: 16px 20px;
max-width: 720px;
background: #faf8f3;
border: 1px solid #e6dfcf;
border-radius: 8px;
font-size: 17px;
line-height: 1.8;
color: #444444;
}
.thida-guide__notice strong {
color: #8d691b;
}
/* =========================================
全体STEP画像（000）
========================================= */
.thida-guide__overview {
margin: 30px auto 40px;
text-align: center;
}
.thida-guide__overview-title {
margin: 0 0 14px;
font-size: 22px;
font-weight: 700;
color: #333333;
}
.thida-guide__overview img {
display: block;
width: 100%;
max-width: 880px;
height: auto;
margin: 0 auto;
border-radius: 8px;
}
/* =========================================
STEP共通
========================================= */
.thida-guide__steps {
position: relative;
}
.thida-guide__step {
position: relative;
margin-bottom: 28px;
padding: 28px;
background: #ffffff;
border: 1px solid #dddddd;
border-radius: 10px;
}
.thida-guide__step:not(:last-child)::after {
content: "";
position: absolute;
left: 50%;
bottom: -22px;
width: 14px;
height: 14px;
border-right: 3px solid #c5a34a;
border-bottom: 3px solid #c5a34a;
transform: translateX(-50%) rotate(45deg);
background: #ffffff;
}
.thida-guide__step-inner {
display: grid;
grid-template-columns: 110px minmax(0, 1fr);
gap: 24px;
align-items: flex-start;
}
/* =========================================
STEP番号
========================================= */
.thida-guide__number {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 96px;
height: 96px;
margin: 0 !important;
border-radius: 50%;
background: #c5a34a;
color: #ffffff;
flex-shrink: 0;
}
.thida-guide__number-label {
display: block;
font-size: 15px;
font-weight: 700;
letter-spacing: 0.08em;
line-height: 1;
}
.thida-guide__number-value {
display: block;
margin-top: 4px;
font-size: 42px;
font-weight: 700;
line-height: 1;
}
/* =========================================
STEP本文
========================================= */
.thida-guide__content {
min-width: 0;
}
.thida-guide__content h2 {
margin: 0 0 14px;
font-size: 18px;
line-height: 1.55;
font-weight: 700;
color: #222222;
}
.thida-guide__content p {
margin: 0 0 14px;
font-size: 18px;
line-height: 1.9;
color: #444444;
}
.thida-guide__content p:last-child {
margin-bottom: 0;
}
.thida-guide__content strong {
color: #111111;
font-weight: 700;
}
.thida-guide__button-text {
display: inline-block;
padding: 1px 7px;
background: #fff3b0;
border-radius: 3px;
font-weight: 700;
color: #222222;
}
/* =========================================
各STEP画像
========================================= */
.thida-guide__image {
margin: 18px 0 22px;
text-align: center;
}
.thida-guide__image img {
display: block;
width: 100%;
max-width: 560px;
height: auto;
margin: 0 auto;
border: 2px solid #666;
border-radius: 8px;
}
/* =========================================
補足
========================================= */
.thida-guide__point {
margin-top: 18px;
padding: 14px 16px;
background: #f7f7f7;
border-left: 4px solid #c5a34a;
font-size: 16px;
line-height: 1.8;
color: #555555;
}
/* =========================================
完了
========================================= */
.thida-guide__complete {
margin-top: 42px;
padding: 32px 24px;
text-align: center;
background: #faf8f3;
border: 1px solid #e4dcc9;
border-radius: 10px;
}
.thida-guide__complete h2 {
margin: 0 0 16px;
font-size: 28px;
line-height: 1.5;
color: #8d691b;
}
.thida-guide__complete p {
margin: 8px 0;
font-size: 17px;
line-height: 1.9;
color: #444444;
}
/* =========================================
商品が見つからない場合
========================================= */
.thida-guide__help {
margin-top: 28px;
padding: 24px;
background: #ffffff;
border: 1px solid #dddddd;
border-radius: 10px;
}
.thida-guide__help h2 {
margin: 0 0 14px;
font-size: 22px;
color: #333333;
}
.thida-guide__help p,
.thida-guide__help li {
font-size: 17px;
line-height: 1.8;
color: #555555;
}
.thida-guide__help ul {
margin: 14px 0;
padding-left: 1.4em;
}
/* =========================================
お問い合わせリンク
========================================= */
.thida-guide__contact-link {
color: #8d691b;
font-weight: 700;
text-decoration: underline;
text-underline-offset: 3px;
}
.thida-guide__contact-link:hover {
color: #6f5215;
text-decoration: none;
}
/* =========================================
タブレット・スマホ
========================================= */
@media screen and (max-width: 767px) {
.thida-guide {
padding: 16px 10px 44px;
line-height: 1.8;
}
/* タイトル */
.thida-guide__header {
margin-bottom: 20px;
}
.thida-guide__title {
font-size: 26px;
line-height: 1.45;
}
.thida-guide__title::after {
width: 54px;
margin-top: 12px;
}
.thida-guide__lead {
margin-top: 14px;
font-size: 16px;
line-height: 1.75;
}
/* 公開日の案内 */
.thida-guide__notice {
margin-top: 16px;
padding: 13px 12px;
font-size: 15px;
line-height: 1.75;
}
/* 全体図 */
.thida-guide__overview {
margin: 22px -2px 30px;
}
.thida-guide__overview-title {
margin-bottom: 10px;
font-size: 19px;
}
.thida-guide__overview img {
width: 100%;
max-width: none;
border-radius: 4px;
}
/* STEP */
.thida-guide__step {
margin-bottom: 26px;
padding: 20px 14px 22px;
border-radius: 8px;
}
.thida-guide__step-inner {
display: block;
}
.thida-guide__number {
width: 72px;
height: 72px;
margin: 0 auto 16px !important;
}
.thida-guide__number-label {
font-size: 12px;
}
.thida-guide__number-value {
margin-top: 3px;
font-size: 32px;
}
.thida-guide__content h2 {
margin: 0 0 14px;
font-size: 18px;
line-height: 1.5;
text-align: center;
}
.thida-guide__content p {
margin-bottom: 12px;
font-size: 16px;
line-height: 1.8;
}
/* STEP画像 */
.thida-guide__image {
margin: 14px -2px 18px;
}
.thida-guide__image img {
width: 100%;
max-width: 100%;
border: 2px solid #666;
border-radius: 5px;
}
/* STEP1補足 */
.thida-guide__point {
margin-top: 14px;
padding: 12px 13px;
font-size: 15px;
line-height: 1.75;
}
/* 完了 */
.thida-guide__complete {
margin-top: 34px;
padding: 24px 14px;
}
.thida-guide__complete h2 {
margin-bottom: 12px;
font-size: 23px;
}
.thida-guide__complete p {
font-size: 15px;
line-height: 1.75;
}
/* HELP */
.thida-guide__help {
margin-top: 22px;
padding: 20px 15px;
}
.thida-guide__help h2 {
font-size: 20px;
}
.thida-guide__help p,
.thida-guide__help li {
font-size: 15px;
line-height: 1.75;
}
}
/* =========================================
小さいスマホ
========================================= */
@media screen and (max-width: 480px) {
.thida-guide {
padding-left: 8px;
padding-right: 8px;
}
.thida-guide__title {
font-size: 23px;
}
.thida-guide__lead {
font-size: 15px;
}
.thida-guide__notice {
font-size: 14px;
}
.thida-guide__overview-title {
font-size: 18px;
}
.thida-guide__step {
padding: 18px 12px 20px;
}
.thida-guide__content h2 {
font-size: 18px;
}
.thida-guide__content p {
font-size: 16px;
}
}
Instagramライブ商品の
ご購入方法
専用ページ公開後、下記の手順でご購入いただけます。
ライブで購入が確定した商品は、
翌週の月曜日20時以降を目安に
お客様専用の商品ページへ公開されます。
ご購入までの流れ
STEP
1
Instagramのアカウント名で検索
サイト内の検索窓に、
ご自身のInstagramのアカウント名
を入力して検索してください。
例：Instagramのアカウント名が
thidastone123
の場合、そのまま「thidastone123」と入力します。
STEP
2
商品内容を確認して
「カートに入れる」をタップ
表示された商品ページで、
商品内容と金額
をご確認ください。
内容に間違いがなければ、
「カートに入れる」
をタップします。
STEP
3
カート内容を確認して
「レジに進む」をタップ
カートに入っている
商品と金額
に間違いがないかご確認ください。
確認後、
「レジに進む」
をタップします。
STEP
4
ログイン後、送り先情報を確認して
決済方法を選択
ログイン後、
お名前・住所などのお届け先情報
に間違いがないかご確認ください。
続いて、ご希望の
決済方法
を選択してください。
STEP
5
ページ下部の
「決済する」をタップして完了
最後に注文内容をご確認ください。
内容に間違いがなければ、ページ下部にある
「決済する」
をタップします。
これでご購入手続きは完了です。
決済確認後、
1週間以内を目安に発送
いたします。
発送完了後、ヤマト運輸の追跡番号を記載したメールをお送りします。
商品が見つからない場合
検索しても商品が表示されない場合は、
以下をご確認ください。
Instagramのアカウント名に間違いがないか
専用ページ公開日の月曜日20時以降になっているか
それでも商品が見つからない場合は、
お問い合わせページ
よりご連絡ください。
もっと読む
