body {
/* font-family: "Noto Sans JP", sans-serif; */
font-family: "EB Garamond", "Zen Old Mincho", serif;
}
.u-desktop {
display: none;
}
/* リキッドレイアウト対応 */
html {
font-size: 16px;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
/* Remove default padding */
ul,
ol {
padding: 0;
}
/* Remove default margin */
/* // DOMが完全に読み込まれたら実行
window.addEventListener('DOMContentLoaded', () => {
// 既存のがあるか確認
let existingMetaTag = document.querySelector('meta[name="robots"]');
if (!existingMetaTag) {
// 新しいタグを作成
let metaTag = document.createElement('meta');
metaTag.name = "robots";
metaTag.content = "noindex, nofollow";
// 内に追加
document.head.appendChild(metaTag);
console.log(' を追加しました。');
} else {
// 既にが存在する場合、content属性を更新
existingMetaTag.content = "noindex, nofollow";
console.log('既存ののcontent属性を更新しました。');
}
}); */
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
margin: 0;
}
/* Set core root defaults */
html {
scroll-behavior: smooth;
}
/* Set core body defaults */
body {
line-height: 1.5;
min-height: 100vh;
text-rendering: optimizeLegibility;
}
/* Remove list styles on ul, ol elements with a class attribute */
ul,
ol {
list-style: none;
}
/* A elements that don't have a class get default styles */
a:not([class]) {
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
}
/* Make images easier to work with */
img {
display: block;
max-width: 100%;
width: 100%;
object-fit: contain;
}
/* Natural flow and rhythm in articles by default */
article > * + * {
margin-top: 1em;
}
/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
font: inherit;
}
/* Blur images when they have no alt attribute */
/* img:not([alt]) {
filter: blur(10px);
} */
/* フォームリセット */
input,
button,
select,
textarea {
background: transparent;
border: none;
border-radius: 0;
font: inherit;
outline: none;
}
textarea {
resize: vertical;
}
input[type="submit"],
input[type="button"],
label,
button,
select {
cursor: pointer;
}
select::-ms-expand {
display: none;
}
/* ホバー */
a {
-webkit-text-decoration: none;
color: inherit;
text-decoration: none;
transition: opacity 0.3s;
}
.clearfix:after {
content: "";
clear: both;
display: block;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* フォーム要素の基本レイアウト */
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
textarea {
margin-top: 0;
margin-bottom: 0;
padding-right: 5px;
padding-left: 5px;
min-height: 30px;
width: 100%;
background: #fff;
border: 1px solid #999999;
border-radius: 0;
}
input[type="radio"] {
margin: 0;
}
.sysFormField {
margin: 10px 0;
}
.sysFormField label {
margin-right: 20px;
font-size: 15px;
}
.sysFormField a {
display: inline-block;
color: #068acc;
border-bottom: 1px solid #068acc;
line-height: 15px;
margin: 0 3px;
}
select {
width: 100%;
height: 30px;
}
#sysItemCategory select {
width: 100%;
padding: 3px 5px;
}
/**
* Owl Carousel v2.2.1
* Copyright 2013-2017 David Deutsch
* Licensed under ()
*/
/*
* Owl Carousel - Core
*/
.owl-carousel {
display: none;
width: 100%;
-webkit-tap-highlight-color: transparent;
/* position relative and z-index fix webkit rendering fonts issue */
position: relative;
z-index: 1;
}
.owl-carousel .owl-stage {
position: relative;
-ms-touch-action: pan-Y;
touch-action: pan-Y;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
/* fix firefox animation glitch */
}
.owl-carousel .owl-stage:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.owl-carousel .owl-stage-outer {
position: relative;
overflow: hidden;
/* fix for flashing background */
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.owl-carousel .owl-item {
position: relative;
min-height: 1px;
float: left;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
}
.owl-carousel .owl-item img {
display: block;
width: 100%;
}
.owl-carousel .owl-nav .owl-prev,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-dot {
cursor: pointer;
cursor: hand;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.owl-carousel.owl-loaded {
display: block;
}
.owl-carousel.owl-loading {
opacity: 0;
display: block;
}
.owl-carousel.owl-hidden {
opacity: 0;
}
.owl-carousel.owl-refresh .owl-item {
visibility: hidden;
}
.owl-carousel.owl-drag .owl-item {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.owl-carousel.owl-grab {
cursor: move;
cursor: grab;
}
.owl-carousel.owl-rtl {
direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
float: right;
}
/* No Js */
.no-js .owl-carousel {
display: block;
}
/*
* Owl Carousel - Animate Plugin
*/
.owl-carousel .animated {
animation-duration: 1000ms;
animation-fill-mode: both;
}
.owl-carousel .owl-animated-in {
z-index: 0;
}
.owl-carousel .owl-animated-out {
z-index: 1;
}
.owl-carousel .fadeOut {
animation-name: fadeOut;
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/*
* Owl Carousel - Auto Height Plugin
*/
.owl-height {
transition: height 500ms ease-in-out;
}
/*
* Owl Carousel - Lazy Load Plugin
*/
.owl-carousel .owl-item .owl-lazy {
opacity: 0;
transition: opacity 400ms ease;
}
.owl-carousel .owl-item img.owl-lazy {
transform-style: preserve-3d;
}
/*
* Owl Carousel - Video Plugin
*/
.owl-carousel .owl-video-wrapper {
position: relative;
height: 100%;
background: #000;
}
.owl-carousel .owl-video-play-icon {
position: absolute;
height: 80px;
width: 80px;
left: 50%;
top: 50%;
margin-left: -40px;
margin-top: -40px;
/*background: url("owl.video.play.png") no-repeat;*/
cursor: pointer;
z-index: 1;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transition: transform 100ms ease;
}
.owl-carousel .owl-video-play-icon:hover {
-ms-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3);
}
.owl-carousel .owl-video-playing .owl-video-tn,
.owl-carousel .owl-video-playing .owl-video-play-icon {
display: none;
}
.owl-carousel .owl-video-tn {
opacity: 0;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
transition: opacity 400ms ease;
}
.owl-carousel .owl-video-frame {
position: relative;
z-index: 1;
height: 100%;
width: 100%;
}
.owl-controls {
margin-top: 10px;
text-align: center;
-webkit-tap-highlight-color: transparent;
}
.owl-controls .owl-nav [class*="owl-"] {
color: #fff;
font-size: 14px;
margin: 5px;
padding: 4px 7px;
background: #d6d6d6;
display: inline-block;
cursor: pointer;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.owl-controls .owl-nav [class*="owl-"]:hover {
background: #869791;
color: #fff;
text-decoration: none;
}
.owl-controls .owl-nav .disabled {
opacity: 0.5;
cursor: default;
}
.owl-dots {
text-align: center;
}
.owl-dots .owl-dot {
display: inline-block;
position: relative;
top: 10px;
}
.owl-dots .owl-dot span {
width: 20px;
height: 20px;
margin: 5px 12.5px;
background: #999;
display: block;
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-transition: opacity 200ms ease;
-moz-transition: opacity 200ms ease;
-ms-transition: opacity 200ms ease;
-o-transition: opacity 200ms ease;
transition: opacity 200ms ease;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
}
.owl-dots .owl-dot.active span,
.owl-dots .owl-dot:hover span {
background: #000;
}
.owl-nav {
margin-top: 10px;
text-align: center;
-webkit-tap-highlight-color: transparent;
}
.owl-nav [class*="owl-"] {
position: absolute;
top: 98%;
margin-top: -18.5px;
outline: 0;
width: 20px;
height: 37px;
padding: 0;
text-indent: -9999px;
z-index: 9999;
border: none;
border-radius: none;
cursor: pointer;
}
.owl-nav .owl-prev {
left: 35%;
background: url(/img/common/controls.png) no-repeat 0 0;
background-size: 40px;
}
.owl-nav .owl-next {
right: 35%;
background: url(/img/common/controls.png) no-repeat -20px 0;
background-size: 40px;
}
.owl-nav .owl-prev:hover {
background-position: 0 0;
}
.owl-nav .owl-next:hover {
background-position: -20px 0;
}
/* 検索ボックス */
.search_bx form {
overflow: hidden;
border: 1px solid #dddddd;
}
.search_bx .sysItemSearchFormWord {
float: left;
width: 70%;
}
.search_bx input[type="search"] {
height: 40px;
border: none;
padding: 5px;
width: 100%;
}
/* submitボタンの調整 */
#sysMypageReminder #sysMain input[type="submit"],
.sysBackButton,
.sysNextSubmit {
background: #666;
color: #fff;
display: block;
padding: 10px 15px;
text-shadow: none;
border-color: transparent;
border-radius: 3px;
width: 80%;
height: 50px;
margin: 0 auto;
margin-top: 40px;
}
/* お届け先の入力ページ */
.opcDeliveryAddress_edit div[class^="opcDeliveryAddress_"]:not(:first-child):not(:last-child) {
margin-top: 1em;
}
.opcDeliveryAddress_edit .opcCommonEditLabel {
margin-bottom: 0.5em;
}
.opcDeliveryAddress_openDialogButton_edit {
margin-left: 1em;
}
.opcDeliveryAddress_zipCode_edit[type="tel"],
.opcBillingAddress_zipCode_edit[type="tel"] {
margin-right: 0.5em;
width: 18em;
}
.opcPaymentMethod_buttonGroup_edit,
.opcDeliveryAddress_buttonGroup_edit,
.opcDeliveryMethod_buttonGroup_edit {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.opcCommonHeaderErrorMessage{
flex: 0 0 100%;
}
.opcPaymentMethod_buttonGroup_edit .opcCommonButtonEdit,
.opcDeliveryAddress_buttonGroup_edit .opcCommonButtonEdit,
.opcDeliveryMethod_buttonGroup_edit .opcCommonButtonEdit {
flex: 0 0 30%;
}
.opcPaymentMethod_buttonGroup_edit .opcPaymentMethod_completeButton_edit,
.opcDeliveryAddress_buttonGroup_edit .opcDeliveryAddress_completeButton_edit,
.opcDeliveryMethod_buttonGroup_edit .opcDeliveryMethod_completeButton_edit {
order: 2;
}
/* 商品カテゴリページ */
.sysFuncItemCategory a {
line-height: 1.75;
}
.sysFuncItemCategory a:hover {
background: #eee;
}
#sysItemCategory h1.itemCategory {
margin-left: 5px;
border-left: 5px solid #222222;
padding-left: 10px;
font-size: 18px;
margin: 20px 0 10px;
}
.sysSelectionDescription {
margin: 2px 0 10px;
}
/* 4-1-3 Category View Mode */
.sysItemCategoryCtl {
font-size: small;
}
.sysItemCategoryCtl a {
display: inline-block;
color: #777777;
text-decoration: none;
background-color: #f1f1f1;
border-radius: 25px;
padding: 6px 10px;
margin: 4px 0;
}
/* PRアイコン設定 */
.sysItemPr {
font-size: small;
padding: 0 5px;
background: #fff;
border: 1px solid #666;
border-radius: 3px;
display: inline-block;
font-weight: bold;
}
/*PRアイコン(商品詳細ページ)*/
.sysPr {
margin-bottom: 20px;
}
.sysPr span {
width: 100%;
padding: 8px 10px;
color: #222222;
font-weight: bold;
font-size: 13px;
border-radius: 15px;
margin: 0 0 5px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
}
.sysPr span:first-child {
display: none;
}
span.icon_online,
span.icon_kyobashi {
display: inline-block;
background: #ff1000;
border: 3px solid #ff1000;
color: #fff;
}
span.icon_book {
display: inline-block;
border: 3px solid #ff1000;
color: #ff1000;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
span.icon_chilled {
display: inline-block;
background: #4472c4;
border: 3px solid #4472c4;
color: #fff;
text-indent: 0.5em;
letter-spacing: 0.5em;
}
/* カートボタン */
.sysCartButton {
font-size: 0.75rem;
font-weight: 500;
color: #fff;
line-height: 1.35;
letter-spacing: 0.03em;
padding: 10px;
margin: 0;
border: none;
border-radius: 5px;
background-color: #9c793c;
cursor: pointer;
width: 100%;
}
.sysCartButton:hover {
background: #999;
}
/* 4-1-7 商品サムネイル画像 */
.sysItemList ul.sysThumbnail li {
display: flex;
flex-direction: column;
float: none;
vertical-align: top;
letter-spacing: normal;
width: 100%;
padding: 0;
}
.sysItemList ul.sysThumbnail input {
width: 100%;
padding: 10px 0;
margin-top: 0;
}
.sysItemList ul.sysList input {
margin-top: 0;
}
/* 商品ぺージ */
/* 商品画像 */
.sysThumbnailImage > span,
.sysThumbnailImage > br {
display: none;
}
.sysItemImages {
max-width: 600px;
}
.sysItemImages .sysImageList li {
width: 100%;
height: 100%;
float: unset;
margin: 0;
text-align: unset;
line-height: unset;
}
.sysItemImages .sysImageList li img {
max-width: 100%;
max-height: 100%;
width: 100%;
aspect-ratio: 100 / 100;
border: none;
}
/* 商品名 */
.sysItemName h1 {
font-size: x-large;
}
/* 注文エリア*/
/* 商品ページのタイトル */
.sysItemName,
.sysExplanation > div > span,
.sysReview > span {
display: block;
margin-bottom: 0px;
font-size: large;
}
/* 商品説明 */
.sysExplanation table {
width: 100%;
text-align: center;
border: 1px solid #999;
line-height: 2;
}
.sysExplanation thead {
text-align: center;
color: #fff;
background: #999;
}
.sysExplanation td {
font-size: small;
text-align: left;
padding-left: 10px;
}
/* 買い物フォーム */
#sysItemDetail .sysRetailPrice {
font-weight: bold;
color: inherit;
font-size: 1rem;
}
#sysItemDetail #sysVariation {
overflow: hidden;
margin: 5px auto;
}
#sysItemDetail #sysVariation > div {
margin: 10px auto;
overflow: hidden;
}
#sysItemDetail .sysNumArea button {
display: inline-block;
width: 48%;
background: #666;
padding: 10px;
border: 1px solid #999;
border-radius: 5px;
color: #fff;
}
#sysItemDetail .sysNumArea {
margin-top: 0.5rem;
margin-bottom: 0;
padding-top: 0;
}
#sysWishlist .sysButton,
#sysItemDetail .sysCartButton {
width: 100%;
margin-left: 0;
}
#sysItemDetail .sysShare {
padding: 5px 0 0 2%;
}
#sysCartInForm {
width: 100%;
}
/* ログインボタン */
.sysLoginButton,
.sysButton {
border: none;
padding: 10px;
margin: 5px 0;
border-radius: 5px;
background-color: #dddddd;
color: #000;
cursor: pointer;
}
.sysLoginButton {
/* display: inline-block; */
float: left;
width: 49%;
margin: 0;
font-size: 0.875rem;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.05em;
padding: 0.875rem 0;
background-color: #cbb993;
color: #fff;
border-radius: 0;
}
/* カートボタン */
.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit,
.sysCart #sysMain input[type="submit"],
.sysCart #sysMain button[type="submit"],
.sysCart #sysMain button {
background: #666;
color: #fff;
text-shadow: none;
}
.sysCartInDone {
margin: 0;
}
/* フォームページの基本レイアウト*/
#sysFormIndex #sysMain,
#sysFormConfirm #sysMain,
#sysFormThanks #sysMain,
.sysMemberRegister #sysMain,
.sysMypage #sysMain {
width: 1100px;
border: 1px solid #eee;
padding: 20px 150px;
margin: 30px auto;
}
#sysDestination #sysMain {
width: 1100px;
border: 1px solid #eee;
padding: 20px 150px !important;
margin: 30px auto;
}
#sysFormConfirm label,
#sysMemberRegisterConfirm label {
display: block;
margin: 15px 0 5px !important;
}
#sysFormConfirm .sysFormField #sysMemberRegisterConfirm .sysFormField {
margin: 10px 0 20px !important;
}
#sysFormConfirm button.sysButton {
width: 49%;
float: left;
margin: 0;
margin-right: 1%;
margin-top: 30px;
height: 50px;
border-radius: 3px;
background: #ccc;
color: #444;
}
#sysFormConfirm .sysNextSubmit {
width: 49%;
margin: 0;
margin-top: 50px;
margin-left: 1%;
}
#sysMemberRegisterConfirm .sysNextSubmit {
width: 49%;
margin: 0;
margin-top: 20px;
margin-right: 1%;
float: left;
}
#sysMemberRegisterConfirm .sysBackButton {
width: 49%;
float: left;
margin: 0;
margin-left: 1%;
margin-top: 0px;
height: 50px;
border-radius: 3px;
background: #ccc;
color: #444;
}
#sysFormThanks .completeText {
margin: 20px 0;
text-align: center;
font-size: 15px;
}
#sysFormThanks .completeText a {
color: #068acc;
text-decoration: underline;
}
#sysMemberRegisterRegister #sysMain h2,
#sysMemberRegisterConfirm #sysMain h2,
#sysMemberRegisterIndex #sysMain h2,
#sysFormThanks #sysMain h2,
#sysFormConfirm #sysMain h2,
#sysFormIndex #sysMain h2 {
display: none;
}
#sysFormIndex #sysMain input {
font-size: 15px;
}
#sysFormIndex .txtBlock {
text-align: center;
}
#sysMemberRegisterConfirm #sysMain > form,
#sysMemberRegisterIndex #sysMain > form,
#sysFormConfirm #sysMain > form,
#sysFormIndex #sysMain > form {
padding: 10px;
}
#sysMypageReminder #sysMain input[type="text"],
#sysMemberRegisterIndex #sysMain input[type="text"],
#sysFormIndex #sysMain input[type="text"],
#sysFormIndex #sysMain textarea {
background: #fff;
border-radius: 0;
margin: 10px 0 30px;
}
#sysMemberRegisterIndex #sysMain input[type="tel"],
#sysMemberRegisterIndex #sysMain input[type="email"],
#sysMemberRegisterIndex #sysMain input[type="password"] {
background: #fff;
border-radius: 0;
margin: 10px 0 30px;
}
#sysMain .sysFormLabel {
display: block;
padding-left: 5px;
line-height: 25px;
font-size: 15px;
margin-bottom: 5px;
}
#sysMain .sysRequired {
display: inline-block;
height: 25px;
line-height: 25px;
font-size: 15px;
margin-bottom: 5px;
}
#sysMain textarea {
min-height: 75px;
}
.sysZipcode button,
.sysZipcode .sysFormField {
display: inline-block;
}
.sysZipcode .sysFormLabel {
display: block;
}
.sysZipcode .sysFormField {
width: 200px;
}
.sysZipcode br {
display: none;
}
.sysBirthday input {
width: auto !important;
}
/* フォーム確認ぺージ */
#sysMypageEditConfirm #sysMain .sysFormField,
#sysMemberRegisterConfirm #sysMain .sysFormField,
#sysFormConfirm #sysMain .sysFormField {
border: 1px solid #999;
line-height: 2;
padding-left: 10px;
font-size: small;
border-radius: 3px;
margin: 5px auto;
min-height: 20px;
}
/* マイページ */
.sysMypageMajorHeadLine {
display: none;
}
.SysMypageMinorHeadLine {
font-size: 18px;
border-left: 5px solid #3d3d3d;
padding-left: 5px;
margin: 20px 0;
}
#sysMypageLogin .sysMypageMinorHeadLine {
display: none;
}
/* 購入履歴 */
.sysOrderList {
border: 1px solid rgb(212, 212, 212);
padding: 0.625rem;
max-height: 400px;
overflow-y: scroll;
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
margin-top: 1rem;
}
.sysOrderList li {
border-bottom: 1px dotted rgb(212, 212, 212);
margin-bottom: 5px;
padding-bottom: 5px;
}
/* Member Profile Editor */
#sysMypageEditDelivery #sysMain > form,
#sysMypageEditMember #sysMain > form {
padding: 10px;
}
#sysMypageEditDelivery #sysMain input,
#sysMypageEditMember #sysMain input {
line-height: 15px;
padding: 5px;
font-size: small;
margin: 5px auto;
border: 1px solid #dddddd;
}
#sysMypageEditConfirm #sysMain > form {
padding: 10px;
}
/* Special Point */
.sysSpecialPoint {
overflow: hidden;
letter-spacing: -0.4em;
}
.sysSpecialPoint > div:nth-child(2n) {
width: 60%;
}
.sysSpecialPoint > div {
display: inline-block;
letter-spacing: normal;
padding: 5px 10px;
border-bottom: 1px solid #d5d5d5;
}
.sysSpecialPoint > div:nth-child(2n + 1) {
width: 40%;
}
/* 4-5-4 Coupon List */
.sysCoupon {
border: 1px solid #d5d5d5;
margin: 10px;
}
/* マイページ（複数配送先編集画面）*/
.sysSelectAddress {
background: none;
}
.sysSelectAddress a {
display: block;
text-decoration: none;
border: 0px solid;
padding: 10px;
}
.sysSelectAddress {
margin: 10px 0;
}
.sysSelectAddress a:hover {
background: #eee;
}
/***********************************
商品詳細ページ
***********************************/
/*商品名*/
#sysItemDetail .sysItemName h1 {
font-size: 1.375rem;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0.05em;
padding-bottom: 2rem;
border-bottom: 1px solid #cbb993;
}
/*商品番号*/
#sysItemDetail .sysItemId {
text-align: left;
font-size: 0.75rem;
font-weight: 500;
color: #999999;
line-height: 1.3;
letter-spacing: 0.05em;
margin-top: 1.625rem;
}
/*価格表示*/
#sysItemDetail .sysRetailPrice {
display: inline-block;
width: 100%;
text-align: left;
margin-top: 0.5rem;
padding-top: 0;
}
#sysItemDetail .sysRetailPrice span.sysRetailPriceValue {
font-size: 1.125rem;
font-weight: 700;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
}
/*通常価格*/
#sysItemDetail .sysSuggestedRetailPrice {
margin-bottom: 5px;
text-align: right;
}
#sysItemDetail .sysSuggestedRetailPrice span {
font-size: 1.1rem;
}
/*送料区分*/
#sysItemDetail .sysShippingCost {
display: inline-block;
width: auto;
margin-left: auto;
margin-top: 5px;
padding: 0 5px;
color: #da4636;
font-weight: bold;
font-size: 1.1rem;
border: 1px solid #da4636;
border-radius: 3px;
}
/*PRアイコン(カテゴリーページ)*/
.sysAddSelection div {
margin-bottom: 10px;
}
.sysAddSelection {
clear: both;
}
.sysAddSelection input,
.sysAddSelection select {
margin: 5px 0;
}
.sysItemPrArea {
margin-top: 5px;
}
.sysItemPrArea span {
width: 49%;
height: 30px;
display: inline-block;
padding: 3px 0px;
font-size: 18px;
line-height: 18px;
border-radius: 20px;
font-weight: bold;
margin: 0;
text-align: center;
}
#sysItemDetail .sysForm select {
display: inline-block;
float: none !important;
margin: 0;
}
#sysItemDetail .sysForm select[name="num"] {
font-size: 0.75rem;
text-align: center;
font-weight: 500;
color: #000;
line-height: 1.57;
letter-spacing: 0.03em;
width: 4.625rem;
height: 38px;
min-width: unset;
border: 1px solid #dddddd;
border-radius: 5px;
margin: 0;
margin-left: 10px;
}
#sysItemDetail .sysForm input[type="text"] {
margin-top: 5px;
margin-bottom: 5px;
}
#sysSelections div {
margin-bottom: 10px;
}
#sysItemDetail .sysSelections {
line-height: 30px;
}
#sysItemDetail #sysVariation {
width: 100%;
max-width: 500px;
overflow: hidden;
margin-left: auto;
}
#sysItemDetail #sysVariation > div {
margin: 10px auto;
overflow: hidden;
}
#sysItemDetail .sysNumArea button {
display: inline-block;
width: 48%;
background: #000;
padding: 10px;
border: 1px solid #999;
border-radius: 5px;
color: #fff;
}
#sysWishlist .sysButton,
#sysItemDetail .sysCartButton {
width: 100%;
margin-left: 0;
}
#sysItemDetail .sysShare {
padding: 5px 0 0 2%;
}
#sysCartInForm {
width: 100%;
margin-left: auto;
}
/*バリエーション*/
#sysItemDetail .sysFormVariationName {
background-color: #fdf5f5;
}
#sysItemDetail .sysFormVariationTable {
width: 100%;
max-width: 500px;
}
/*下部フォーム*/
#sysItemDetail .order_bottom {
margin: 0 auto 40px;
text-align: right;
}
/*簡易商品説明*/
#sysItemDetail .sysDescription {
text-align: left;
}
/*商品詳細*/
.sysExplanation {
text-align: center;
}
.sysExplanation img {
height: auto;
}
#sysItemDetail .itempage_cap {
margin-bottom: 30px;
font-size: 12px;
}
#sysItemDetail .itempage_cap .i_ttl {
margin-bottom: 20px;
font-size: 120%;
font-weight: bold;
}
#sysItemDetail .itempage_detail h3 {
font-size: 18px;
font-weight: normal;
}
#sysItemDetail .itempage_detail table {
width: 100%;
margin-bottom: 10px;
border-top: 1px solid #ccc;
}
#sysItemDetail .itempage_detail table tr {
border-bottom: 1px solid #ccc;
}
#sysItemDetail .itempage_detail table th,
#sysItemDetail .itempage_detail table td {
padding: 10px;
font-size: 12px;
line-height: 1.6;
text-align: center;
}
#sysItemDetail .itempage_detail table th {
width: 30%;
border-right: 1px solid #ccc;
}
#sysItemDetail .itempage_detail table td {
width: 70%;
text-align: left;
background: #fff;
}
#sysItemDetail .itempage_detail_ttl {
position: relative;
margin-top: 40px;
padding: 5px 0;
font-weight: bold;
font-size: 18px;
}
#sysItemDetail .itempage_detail_ttl:after {
content: " ";
display: block;
position: absolute;
bottom: 0;
left: 50%;
margin-left: -30px;
width: 60px;
height: 2px;
background-color: #000;
}
#sysItemDetail .sysMainImage img {
aspect-ratio: 402 / 498;
}
/*数量増減*/
#sysItemDetail #sysNumber {
text-align: left;
}
#sysItemDetail .sysNumArea button {
overflow: hidden;
display: inline-block;
width: 25%;
padding: 10px;
text-indent: -999px;
border: 1px solid #b9b9b9;
border-radius: 5px;
background: #f1f1f1;
cursor: pointer;
}
#sysItemDetail .sysNumArea button:hover {
background-color: #efefef;
}
#sysItemDetail .sysNumArea .sysBtnPlus {
border-color: #dddddd;
background: #f1f1f1 url(/img/assets/add-volume.png) center center no-repeat;
background-size: 65px;
width: calc(175 / 360 * 100%);
}
#sysItemDetail .sysNumArea .sysBtnMinus {
border-color: #dddddd;
background: #f1f1f1 url(/img/assets/volume-decrease.png) center center no-repeat;
background-size: 90px;
width: calc(175 / 360 * 100%);
}
/*カートに入れる*/
#sysItemDetail .sysCartButton {
padding: 1.125rem;
}
#sysItemDetail .sysCartButton:hover {
opacity: 0.8;
}
#sysItemDetail .sysGoCartButton {
margin-top: 10px;
}
input.sysCartButton.sysGoCartButton {
background-color: #000;
}
.modaal-container {
max-width: 750px !important;
padding: 30px 8%;
box-shadow: none !important;
color: #333 !important;
}
.sysWishListButton {
font-size: 0.75rem;
font-weight: 500;
color: #777777;
line-height: 1.35;
letter-spacing: 0.03em;
background-color: #f1f1f1;
border-radius: 5px;
text-decoration: none;
width: 100%;
margin: 0;
}
/* お気に入り登録時の画面 */
/* バツボタン */
.modaal-close {
width: 50px;
height: 50px;
width: 22px !important;
height: 22px !important;
position: absolute !important;
right: 15px !important;
top: 15px !important;
border-radius: 0 !important;
border: 1px solid #da4636 !important;
background-color: #fff !important;
}
.modaal-close:after,
.modaal-close:before {
display: block;
content: " ";
position: absolute;
top: -1px !important;
left: 8px !important;
width: 4px;
height: 22px;
border-radius: 4px;
background: #da4636 !important;
-webkit-transition: background 0.2s ease-in-out;
transition: background 0.2s ease-in-out;
}
/* @media (min-width: 1024px) {
.modaal-close {
width: 44px !important;
height: 44px !important;
right: 30px !important;
top: 30px !important;
}
} */
button,
input,
optgroup,
select,
textarea {
font: inherit;
}
/* サンプルイメージ */
.mdl-dialog__image::before {
content: "お気に入り登録完了";
margin-bottom: 15px;
display: block;
text-align: center;
font-size: 1.3rem;
}
.mdl-dialog__image {
width: 88.81%;
max-width: 250px;
margin: auto;
}
.massage {
text-align: center;
}
/* ログインボタン */
.sysWishlistLoginButton {
width: 167px;
/* height: 35px; */
line-height: 35px;
position: relative;
background-color: #da4636;
text-align: center;
font-size: 1.3rem;
transition: 0.2s;
color: #fff;
}
.sysWishlistLoginGroup {
margin: auto auto 30px !important;
text-align: center;
}
:after,
:before {
text-decoration: inherit;
vertical-align: inherit;
background-repeat: no-repeat;
box-sizing: inherit;
}
@media (min-width: 1024px) {
.mdl-dialog__content {
padding: 0 0 30px !important;
font-size: 1.6rem !important;
}
}
/* 会員登録ボタン */
.sysWishlistMemberRegisterGroup::before {
content: "会員登録をされていないお客様はこちら";
margin-top: 12px;
display: block;
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
text-align: center;
}
.sysWishlistMemberRegisterGroup {
width: 80%;
text-align: center;
height: 100%;
border: 1px solid #bbb;
position: relative;
background-color: #fff;
margin: auto auto 30px !important;
}
.sysWishlistMemberRegistButton {
width: 167px;
/* height: 35px; */
line-height: 35px;
position: relative;
background-color: #da4636;
text-align: center;
font-size: 1.3rem;
transition: 0.2s;
color: #fff;
}
/* この画面を閉じるボタン */
.sysWishlistCloseBottomButtonGroup button {
border-bottom: 1px solid #da4636;
transition: 0.2s;
background-color: transparent;
border-radius: 0px;
font-size: 1rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
}
.sysWishlistCloseBottomButtonGroup {
margin-top: 30px;
text-align: right;
font-size: 1.3rem;
}
/*SNSボタン*/
#sysItemDetail .sysShare {
padding: 5px 0 0 2%;
text-align: right;
}
#sysItemDetail .sysShare .sysFacebook {
position: relative;
top: 2px;
}
#sysItemDetail .sysShare .sysGoogleplus {
width: 58px;
}
#sysItemDetail .sysShare .sysLine,
#sysItemDetail .sysShare .sysDisplayPcNone {
display: inline-block !important;
}
#sysItemDetail .sysShare .sysLine {
position: relative;
top: 0px;
}
/*.sysReview*/
#sysItemDetail .sysReview {
margin: 20px 0 40px;
}
/*テーブルデザイン*/
.sysExplanation table {
margin-bottom: 40px;
border: none;
border-top: 1px solid #ccc;
}
.sysExplanation table tr {
border-bottom: 1px solid #ccc;
}
.sysExplanation table th,
.sysExplanation table td {
padding: 3px 10px;
text-align: center;
border: none;
}
/*商品ページ用おすすめ商品*/
.itempage_recommend .sysItemBlock .sysHorizontal li {
width: 25%;
padding: 0 10px;
}
.itempage_recommend .sysItemName {
margin-bottom: 0;
font-size: 14px;
text-align: left;
}
.itempage_recommend .sysItemPrice {
text-align: left;
}
/*商品ページ成分表*/
#sysItemDetail .show_bx {
margin-bottom: 30px;
}
#sysItemDetail .show_bx_inner {
margin-bottom: 10px;
}
#sysItemDetail .btn_tr {
padding: 10px 0 10px 35px !important;
background: #e4e4e4 url(/img/layout/system/ico_plus.png) 10px center no-repeat !important;
background-size: 18px !important;
cursor: pointer;
}
/* #sysItemDetail .active {
background: #e4e4e4 url(/img/layout/system/ico_minus.png) 10px center no-repeat !important;
background-size: 18px !important;
} */
#sysItemDetail .contents_tr {
background-color: #f5f5f5;
}
#sysItemDetail .contents_tr td {
background-color: #f5f5f5 !important;
}
#sysItemDetail .contents_tr table {
margin-bottom: 0;
}
/***********************************
カートページ
***********************************/
/*カートページ内レイアウト調整*/
.sysCart .header_h1_under,
.sysOpcBody .header_h1_under {
float: none;
padding: 10px 0;
width: 100%;
height: auto;
background-color: #fff;
}
.sysCart .header_h1_under a,
.sysOpcBody .header_h1_under a {
display: block;
width: 160px;
margin: 0 auto;
}
.sysCart .header_h1_under .logo img,
.sysOpcBody .header_h1_under .logo img {
float: none;
margin-right: 0;
}
.sysCart .header_h1_under .head_title,
.sysOpcBody .header_h1_under .head_title {
text-align: center;
}
.sysCart .header_wrap {
border-bottom: none;
position: inherit;
}
.sysCart #sysWrap {
margin: 0 auto;
}
.sysCart #sysMain,
.sysOpcBody #sysMain {
max-width: 1100px;
border: 1px solid #eee;
padding: 20px 15px;
margin: 0 auto;
}
.sysCart #sysMain,
.sysCart #sysMain a {
color: #000;
}
.sysCart .sysBox,
.sysCart .sysSelectPaymentArea,
.sysCart .sysSelectDeliveryArea,
.sysCart .sysRemarksArea,
.sysCart .sysSelectOptionArea,
.sysCart .sysDetail,
.sysCart .sysOrder .nav,
.sysCart .sysAcceptDomainArea,
.sysCart .sysRepeatOrderSetting {
background-color: #ffffff;
border: 1px solid #cfcfcf;
border-radius: 0;
box-shadow: none;
margin: 1em auto 2em;
padding: 1em;
}
.sysCart .sysBox hr {
display: block;
border: 0;
height: 0;
border-bottom: 1px solid #cfcfcf;
margin: 5px 0;
padding: 0;
}
.sysCart #sysMain input[type="text"],
.sysCart #sysMain input[type="password"],
.sysCart #sysMain input[type="email"],
.sysCart #sysMain input[type="number"],
.sysCart #sysMain input[type="tel"],
.sysCart #sysMain input[type="search"],
.sysCart #sysMain textarea {
background: none;
border-radius: 0;
border: 1px solid #dddddd;
}
.sysCart .sysTotalTxt {
text-shadow: none;
}
.sysTotal .sysTotalTxt .sysCartAttention {
font-size: 2rem;
}
.sysCart .sysSubTotalArea {
margin: 10px 0;
}
.sysCart .sysNextSubmitArea {
margin-bottom: 20px;
}
.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit {
width: 100%;
padding: 10px;
margin: 5px 0;
font-size: 0.875rem;
font-weight: 700;
line-height: 1.3;
letter-spacing: 0.03em;
color: #fff;
text-shadow: none;
border-radius: 5px;
background: #da4636 !important;
border: none;
}
.sysCart .sysCartAttention,
.sysCart .sysRequired {
color: #da4636;
font-weight: bolder;
}
.sysCart .sysGetPoint {
color: #da4636;
font-weight: bolder;
}
.sysCart .sysCartNote {
color: #000;
font-size: 90%;
}
.sysCart .sysCartTitle {
color: #000;
font-size: large;
font-weight: bolder;
background-color: #fff;
padding: 0;
margin-bottom: 2-px;
}
.sysCart .sysCartTitle span {
font-size: 1.2rem;
}
.sysCart #sysMain input {
background: #fff !important;
}
.sysCart #sysMain input[type="submit"],
.sysCart #sysMain button[type="submit"],
.sysCart #sysMain button {
display: inline-block;
padding: 10px;
width: auto;
height: auto;
color: #000;
background: #fff;
border-radius: none;
border: 1px solid #999;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.sysCart #sysMain input[type="submit"] {
font-size: 0.875rem;
font-weight: 400;
color: #000;
line-height: 1.3;
letter-spacing: 0.03em;
margin-right: 20px;
}
.sysCart .sysDeleteArea,
.sysCart .sysConfirmButton {
text-align: right;
}
.sysCart .sysNavImg {
text-align: center;
margin-top: 10px;
margin-bottom: 20px;
}
.sysCart .sysFreeArea {
color: #000;
margin: 20px 0;
}
.sysSelectPayment li:last-child,
.sysSelectDelivery li:last-child,
.sysSelectOption li:last-child,
.sysCart .sysDetail li:last-child,
.sysRemarks,
.sysCart .sysOrder .nav li:last-child {
border-bottom: none;
}
.sysCart .sysAcceptDomainArea input {
padding: 0 10px !important;
}
.sysCart .cart_btn {
color: #000;
text-align: center;
margin-top: 40px;
}
.sysCart .cart_btn p {
margin: 0;
padding: 0;
}
.sysCart .cart_btn .btn {
margin-top: 5px;
}
.sysCart .cart_btn img {
width: 200px;
border: 1px solid #d0d0d0;
}
#sysBasket #sysMain {
padding-top: 10px;
}
.sysCart .cart_info .sysContent {
max-width: 300px;
color: #000;
text-align: center;
font-weight: bolder;
font-size: 13px;
border: 1px solid #d0d0d0;
border-radius: 5px;
margin: 1em auto 0 auto;
padding: 10px;
background-color: #fff;
}
.sysCart #sysMain .sysConfirmButton input[type="submit"] {
width: auto;
}
.sysCart #sysMain select {
display: inline-block;
}
.sysCart .sysBtnChange {
margin-bottom: 10px !important;
}
/*登録せずに購入*/
#sysBillingAddress .input-append input[type="text"] {
display: inline-block;
}
/*都道府県*/
#sysBillingAddress .sysPrefState select {
width: 200px;
}
/*性別*/
#sysBillingAddress .sysGender {
margin-bottom: 20px;
}
#sysBillingAddress .sysGender input {
vertical-align: middle;
}
#sysBillingAddress .sysGender label {
display: inline-block;
margin-right: 20px;
}
/*メルマガ*/
#sysBillingAddress .sysAcceptMailmagazine {
margin-bottom: 20px;
}
/*注文完了ページ*/
.cart_completion {
text-align: center;
}
/*ご注文番号*/
#sysThanks #sysMain .sysOrderNumber {
font-size: 1.5rem;
font-weight: bold;
}
/*お買い物を続ける*/
body#sysBasket .sysBackButton2 {
font-weight: bold;
background: #b4f4ff !important;
border-color: #000 !important;
}
/***********************************
ワンページカート
***********************************/
.mdl_btn_.opcDialog,
form.opcUseAmazon {
width: 100%;
padding-right: 0;
}
.sysCart #sysMain h3 {
font-size: 20px;
}
.sysCart #sysMain #show-dlg-1,
.sysCart #sysMain #show-dlg-1_low,
.sysCart #sysMain .sysOpcNextSubmit,
.sysCart #sysMain .sysNextSubmit {
display: block;
width: 100% !important;
padding: 15px 10px !important;
margin: 5px 0 !important;
color: #fff !important;
font-size: 1.2rem;
line-height: 1;
font-weight: bold;
text-shadow: none;
box-shadow: none;
border: none !important;
border-radius: 5px;
background: #da4636 !important;
}
.sysCart #sysMain #show-dlg-2,
.sysCart #sysMain #show-dlg-3 {
display: block;
width: 100% !important;
padding: 10px;
margin: 0 0 30px !important;
color: #fff !important;
font-size: 1.2rem;
line-height: 1;
text-shadow: none;
box-shadow: none;
border: none !important;
border-radius: 5px;
background: #000 !important;
}
.sysCart #sysMain #show-dlg-3 {
color: #fff !important;
background: #da4636 !important;
}
.sysCart #sysMain .next_btn {
color: #fff !important;
font-size: 1rem;
line-height: 1;
border: none !important;
background: #000 !important;
}
.sysCart #sysMain #order_price_confirm_btn {
color: #fff !important;
width: 100% !important;
box-shadow: none;
background: #000 !important;
}
.sysCart #sysMain .mdl-js-button {
box-shadow: none;
}
.sysCart #sysMain #change-to-billAddr,
.sysCart #sysMain #show-dlg-addrList,
.sysCart #sysMain #show-dlg-inputAddr {
line-height: 1;
border: none !important;
background: #000 !important;
}
.sysCart #sysMain p.user_type {
font-size: 1.2rem;
}
.sysOpcProduct .sysOpcItemName {
font-size: 1.2rem;
}
/*情報入力ページ調整*/
.sysOpcBody .header_wrap {
height: auto;
position: static;
border-bottom: none;
}
.sysOpcBody .header_h1_under a {
pointer-events: none;
}
.sysOpcBody .footer .f_gnav_all {
display: none;
}
input[type="button"],
select {
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
select {
padding: 0 0.5em;
}
.sysOpcBody img {
max-width: 100%;
}
.opcCommonInputText,
.opcCommonInputSelect,
.opcCommonInputRadio,
.opcCommonInputCheckbox {
margin-left: 0 !important;
}
.opcCommonEditModeBlock {
background: #fff !important;
padding: 20px;
}
.opcOrderSummaryTitle,
.opcBillingAddressTitle,
.opcDeliveryAddressTitle,
.opcItemTitle,
.opcPaymentMethodTitle {
font-size: large !important;
margin-bottom: 0.5em;
}
.opcItem {
/* padding: 3%; */
padding: 3% 0;
/* border: 1px solid #9b9b9b; */
border-bottom: 1px solid #cfcfcf;
margin-top: 10px;
}
/* .opcCommonInputSelect, */
.opcCommonButton {
/*width: 100px !important;*/
background: #fff !important;
}
.opcCommonButton {
padding: 0.375rem;
}
.opcCommonInputSelect {
/* background: #f1f1f1 !important; */
background: #ffffff;
margin-bottom: 1.25rem;
}
.opcBillingAddress_completeButton_edit,
.opcDeliveryMethod_completeButton_edit,
.opcPaymentMethod_completeButton_edit,
.opcItem_completeButton_edit,
.opcDeliveryAddress_completeButton_edit,
.opcPointAndCouponDialog_applyButton_edit,
.opcRemarks_completeButton_edit {
background: #da4636 !important;
border: 1px solid #da4636 !important;
color: #fff !important;
font-weight: bold;
}
.opcConfirm_inputStatus {
display: block !important;
width: 700px !important;
margin: 0 auto 1em;
background: #da4636 !important;
color: #fff !important;
border: 1px solid #da4636 !important;
font-weight: bold;
}
.opcConfirm_inputStatus_disable {
display: block !important;
width: 700px !important;
margin: 0 auto 1em;
background: #ccc !important;
color: #000 !important;
}
.opcConfirm_order {
display: block !important;
width: 100%;
margin: 0 auto;
background: #da4636 !important;
color: #fff !important;
border: 1px solid #da4636 !important;
font-weight: bold;
}
.opcConfirm_order_disable {
display: block !important;
width: 100%;
margin: 0 auto;
background: #ccc !important;
color: #000 !important;
}
/* .opcItem_increaseNumButton_edit,
.opcItem_decreaseNumButton_edit {
width: 2.5rem;
background: #f1f1f1 !important;
} */
.opcCommonButtonGroup {
margin-top: 1em;
}
.opcBillingAddress_edit span[class^="opcBillingAddress_"].opcCommonEditLabel {
display: flex;
align-items: center;
margin-top: 2em;
margin-bottom: 5px;
}
.opcBillingAddress_edit input[type="button"] {
margin-top: 5px;
}
.opcBillingAddress_genderMaleAndLabelGroup_edit,
.opcBillingAddress_genderFemaleAndLabelGroup_edit {
width: 20% !important;
}
.opcBillingAddress_acceptMailmagazineYesLabel_edit {
margin-top: 1em;
display: inline-block;
}
.opcOrderSummary_totalPriceAndLabelGroup {
padding-bottom: 10px !important;
}
.opcCommonEditLabel {
margin-top: 0;
margin-bottom: 0;
border-left: 0px;
padding-left: 0;
display: flex;
align-items: center;
line-height: inherit;
font-size: inherit;
}
.opcOrderSummary_priceBreakDownGroup {
padding-top: 1em;
padding-bottom: 1em;
}
.opcOrderSummary_feeAndLabelGroup,
.opcOrderSummary_usePointPriceAndLabelGroup {
padding-bottom: 1em;
margin-bottom: 1em;
}
.opcBillingAddress_prefState_edit {
margin: 5px 0;
}
.opcBillingAddressButtonGroup_edit,
.opcDeliveryAddress_buttonGroup,
.opcDeliveryMethod_buttonGroup_edit {
padding: 1em 0;
}
.opcDeliveryMethod_hopeDeliveryDateAndLabelGroup_edit,
.opcDeliveryMethod_hopeDeliveryTimeAndLabelGroup_edit {
margin-bottom: 1em;
}
.opcItem_itemSubTotalPriceAndLabelGroup {
padding-bottom: 1em;
margin-bottom: 1em;
}
.opcDeliveryAddressAndDeliveryMethodGroup,
.opcItemList {
margin-bottom: 0 !important;
border: none !important;
padding: 0 !important;
position: static !important;
}
.opcBillingAddress .opcCommonReferenceLabel {
width: 70px;
display: inline-block;
position: relative;
}
.opcBillingAddress .opcCommonReferenceLabel::after {
position: absolute;
right: 0;
}
.opcDeliveryMethod .opcCommonReferenceLabel {
width: 123px;
display: inline-block;
position: relative;
}
.opcDeliveryMethod .opcCommonReferenceLabel::after {
position: absolute;
right: 0;
}
.opcRemarks_remark_edit {
width: 100% !important;
}
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom: 2em;
}
.opcDeliveryAddressEditDialog_directChangeLabel {
width: 100%;
}
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup .opcCommonButton {
width: 2.5rem;
}
.opcDeliveryAddressEditDialog_directChangeButtonAndLabelGroup .opcCommonButton[value="ご注文者情報を反映する"] {
margin-top: 3px;
margin-left: 0;
width: fit-content;
}
.opcDeliveryAddressItem_buttonGroup_edit {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.opcDeliveryAddressItem_buttonGroup_edit .error-info {
margin-bottom: 5px;
flex: 0 0 100%;
}
.opcDeliveryAddressItem_buttonGroup_edit .opcDeliveryAddressItem_completeButton_edit {
order: 2;
flex: 0 0 30%;
}
.opcDeliveryAddressItem_buttonGroup_edit .opcDeliveryAddressItem_completeButton_edit:not(:disabled) {
background: #da4636;
border-color: #da4636;
color: #ffffff;
}
.opcDeliveryAddressItem_buttonGroup_edit .opcDeliveryAddressItem_backButton_edit {
margin-top: 0;
}
.opcItem_deliveryAddressItemGroup,
.opcItem_deliveryAddressItemGroup_edit {
padding-right: 0;
padding-left: 0;
border-top-color: #cfcfcf;
border-top-style: solid;
}
.opcItem_itemName {
font-weight: bold;
font-size: 15px;
}
.opcConfirm_headerErrorMessage {
width: 100% !important;
max-width: 800px;
}
.opcRemarks_remark,
.opcRemarks_cartOption {
margin-left: 0 !important;
width: 100% !important;
white-space: normal !important;
}
#sysOpc > form + div {
margin-bottom: 60px !important;
}
.opcDeliveryMethod_normalShippingDetailAndLabelGroup_edit {
padding-left: 0 !important;
margin-left: 0 !important;
border-bottom: none !important;
}
.opcDeliveryAddress {
border-bottom: 1px solid #9b9b9b;
margin-bottom: 1em;
}
.opcDeliveryMethod_hopeDeliveryDateLabel_edit {
width: 126px;
display: inline-block;
}
.opcItem_numAndLabelGroup_edit {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: baseline;
}
.opcItem_numLabel_edit.opcCommonEditLabel {
content: "：";
flex: 0 0 3em;
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
line-height: inherit;
}
.opcItem_numLabel_edit.opcCommonEditLabel::after {
content: "：";
}
.opcItem_num_edit.opcCommonInputSelect {
flex: 0 1 50%;
margin-right: auto;
}
.opcItem_deliveryAddressItemGroup_edit .opcItem_num_edit.opcCommonInputSelect {
background: #ffffff;
}
.opcItem_increaseNumButton_edit.opcCommonButton,
.opcItem_decreaseNumButton_edit.opcCommonButton {
width: 49%;
}
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit:has(input) {
flex-wrap: wrap;
padding-left: 0;
padding-bottom: 0;
border-bottom: none;
}
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit:has(input) .opcItem_itemCommonOptionTitleLabel_edit{
flex: 0 0 100%;
padding-left: 1rem;
padding-bottom: .5rem;
border-bottom: 1px solid;
border-bottom: 1px solid #cab993;
}
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit:has(input) .opcItem_itemCommonOptionUseOptionNameGroup_edit {
margin-top: 0.5rem;
display: flex;
gap: 20px;
}
.opcItem_itemCommonOptionSelectLabel_edit:has(+ .opcItem_itemCommonOptionOption_edit) {
margin-bottom: 0.625rem;
}
.option-required .opcItem_itemCommonOptionSelectLabel_edit {
display: flex;
align-items: center;
}
.option-required .opcItem_itemCommonOptionSelectLabel_edit::after {
content: "[必須]";
margin-left: 20px;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 20px;
font-size: 0.75rem;
font-weight: 700;
color: #ffffff;
background: #b80101;
}
.opcItem_purposeAndLabelGroup_edit,
.opcItem_itemCommonOptionAndLabelGroup_edit {
margin-top: 40px;
}
.opcItem_itemCommonOptionDetailAndLabelGroup_edit:not(:first-child) {
margin-top: 20px;
}
.opcItem_itemCommonOptionDetailAndLabelGroup_edit{
display: flex;
flex-direction: column;
}
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit,
.opcItem_itemCommonOptionSelectLabel_edit {
margin-bottom: 30px;
padding-bottom: 0.5rem;
border-bottom: 1px solid;
display: flex;
align-items: center;
font-size: 1.125rem;
font-weight: 700;
line-height: 1.444444;
}
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit {
padding-left: 1rem;
border-bottom-color: #cab993;
position: relative;
}
.opcItem_itemCommonOptionSelectLabel_edit {
border-bottom-color: #cfcfcf;
}
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel::before,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit::before,
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel::after,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit::after {
content: "";
display: block;
width: 6px;
position: absolute;
top: 0;
left: 0;
}
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel::before,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit::before {
height: 2rem;
background: #cab993;
}
.opcItem_purposeLabelGroup_edit.opcCommonEditLabel::after,
.opcItem_itemCommonOptionTitleAndOptionNameGroup_edit::after {
height: 6px;
background: #b80101;
}
.opcItem_itemCommonOptionSelectLabel_edit::before {
content: "";
margin-right: 4px;
display: block;
width: 12px;
height: 12px;
background: #cab993;
}
.opcItem_purposeDescription_edit,
.opcItem_itemCommonOptionDescription_edit,
.opcItem_itemCommonOptionSelectDescription_edit {
order: 2;
font-size: .875rem;
}
.opcItem_itemCommonOptionDetailGroup_edit {
display: flex;
flex-direction: column;
}
.empty .opcItem_itemCommonOptionDetailGroup_edit {
margin-bottom: -30px;
}
.opcItem_itemCommonOptionSelectLabel_edit + .opcItem_itemCommonOptionSelectDescription_edit {
margin-top: -20px;
margin-bottom: 10px;
}
.opcItem_itemCommonOptionDetailGroup_edit a {
padding-left: 0.25em;
padding-right: 0.25em;
display: inline-flex;
align-items: center;
border-bottom: 1px solid currentColor;
color: #967a45;
&:hover{
color: #cab993;
}
}
.opcItem_purposeAndLabelGroup,
.opcItem_itemCommonOptionAndLabelGroup,
.opcItem_itemCommonOptionSelectAndLabelGroup {
margin-top: 0.5em;
padding-left: 0;
}
.opcItem_itemCommonOptionDetailAndLabelGroup_edit.color {
margin-top: 1rem;
padding-bottom: 20px;
background-color: #fdfcf6;
}
.opcItem_itemCommonOptionSelectLabel_edit {
order: 1;
}
.color .opcItem_itemCommonOptionSelectLabel_edit {
padding-bottom: 0;
padding-left: 10px;
border-bottom-color: #ffffff;
height: 50px;
background-color: #fff6e2;
font-size: 1.375rem;
}
.color .opcItem_itemCommonOptionSelectLabel_edit::before,
.color .opcItem_itemCommonOptionSelectLabel_edit::after {
display: none;
}
.color .opcCommonInputText,
.color .opcItem_itemCommonOptionDescription_edit {
margin-right: 10px;
margin-left: 10px !important;
max-width: calc(100% - 20px);
}
.opcCommonInputText {
order: 3;
}
.opcCommonInputText + .opcItem_itemCommonOptionDescription_edit {
margin-bottom: 0.5rem;
}
.medium-common-options:has([type="text"]) {
position: relative;
}
.medium-common-options:has([type="text"])::before {
content: "";
display: block;
width: 100%;
height: 50px;
background-color: #fdfcf6;
position: absolute;
left: 0;
bottom: 0;
z-index: 0;
}
.medium-common-options:has([type="text"]) .opcCommonInputText {
margin-top: 0;
margin-left: 10px !important;
margin-bottom: 10px;
padding: 0 10px;
height: 30px;
max-width: calc(100% - 20px);
font-size: 1rem;
position: relative;
}
.opcCommonRequireLabel {
margin-left: 20px;
margin-right: auto;
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 20px;
font-size: 0.75rem;
font-weight: 700;
color: #ffffff;
background: #b80101;
}
.opcCommonInputSelect {
height: 48px;
background: #f1f1f1;
border-radius: 6px;
padding: 10px 16px;
font-size: 1rem;
position: relative;
}
.opcItem_itemCommonOptionOptionGroup_edit {
order: 4;
display: flex;
font-size: 1.125rem;
font-weight: 500;
}
.opcItem_itemCommonOptionOptionLabel_edit {
display: flex;
align-items: center;
position: relative;
}
.opcItem_itemCommonOptionImageGroup{
width: 30%;
}
.opcItem_itemCommonOptionOptionLabel_edit:has(.opcItem_itemCommonOptionImageGroup_edit:not([style="display: none;"])) {
margin-top: 30px;
}
.opcItem_itemCommonOptionOptionLabel_edit .opcCommonInputRadio {
flex: 0 0 auto;
margin-right: calc(10px + 0.25em);
transform: scale(1.25);
transform-origin: left center;
}
.opcItem_itemCommonOptionOptionLabel_edit:has(.opcItem_itemCommonOptionImageGroup_edit:not([style="display: none;"])) .opcCommonInputRadio {
display: none;
}
.opcItem_itemCommonOptionImageGroup_edit {
margin-top: 10px;
border: 2px solid #efefef;
padding: 10px;
background: #efefef;
}
.opcItem_itemCommonOptionOptionLabel_edit:has(input[type="radio"]:checked) .opcItem_itemCommonOptionImageGroup_edit {
border-color: #b80101;
}
.opcItem_itemCommonOptionImageGroup_edit img {
filter: none;
}
.other-requests .opcCommonInputText {
min-height: 200px;
border-color: #999999;
}
/*完了ページ調整*/
#sysThanks #sysMain {
border: none;
}
#sysThanks .sysNavImg {
display: none;
}
#sysThanks.sysCart .sysBox:nth-of-type(2) div:nth-of-type(1),
#sysThanks.sysCart .sysBox:nth-of-type(2) div:nth-of-type(2) {
margin-bottom: 1em;
}
/***********************************
検索ページ
***********************************/
#sysItemSearch div#sysMain {
max-width: 980px;
margin: 20px auto 40px;
}
#sysItemSearch .sysThumbnail .sysItemPrArea {
text-align: left;
margin-top: 5px;
}
#sysItemSearch #sysMain h2 {
font-size: 13px;
margin-bottom: 10px;
}
#sysItemSearch #sysMain .sysItemSearchForm {
font-size: 12px;
padding: 20px;
margin-bottom: 20px;
background-color: #ededed;
}
#sysItemSearch #sysMain .sysItemSearchFormWord {
margin-bottom: 5px;
}
#sysItemSearch #sysMain .sysItemSearchFormWord input {
height: 40px;
vertical-align: bottom;
border: 1px solid #d0d0d0;
}
#sysItemSearch #sysMain .sysSearchButton {
display: block;
margin: 10px auto;
padding: 10px;
width: 95%;
border: none;
background: #222222;
color: #fff;
font-size: 120%;
cursor: pointer;
border-radius: 3px;
}
#sysItemSearch #sysMain .sysItemSearchFormRange input {
border-radius: 0;
background: #fff;
box-shadow: none;
}
#sysItemSearch #sysMain .sysItemSearchFormRange,
#sysItemSearch #sysMain .sysItemSearchFormCategory,
#sysItemSearch #sysMain .sysItemSearchFormSort,
#sysItemSearch #sysMain .sysItemSearchFormLimit {
display: inline-block;
margin: 5px auto;
}
#sysItemSearch #sysMain .sysItemSearchFormRange input {
padding: 10px;
}
/***********************************
お問い合わせ
***********************************/
#sysFormConfirm .sysNextSubmit {
width: 100%;
margin: 20px 0 0 !important;
}
#sysFormConfirm button.sysButton {
width: 30%;
margin-bottom: 20px;
}
/***********************************
新規会員登録
***********************************/
.sysMemberRegister #sysWrap {
margin: 160px auto 0;
}
/***********************************
マイページ
***********************************/
.sysMypage #sysWrap {
margin: 160px auto 0;
}
.sysMypage input[type="submit"] {
width: 100%;
margin-top: 10px;
}
/* マイページボタン */
.sysMypageNav > form {
display: inline-block;
width: 49%;
vertical-align: top;
}
.sysMypageNav > form:nth-child(3) {
display: none;
}
.sysMypageNav > form:nth-child(4) {
display: none;
}
.sysMypageNav .sysButton {
width: 100%;
display: block;
font-size: 15px;
margin: 5px 0;
padding: 15px 0;
}
/***********************************
ヘッダー
***********************************/
body.fixed {
overflow: hidden;
}
.header_wrap {
/* position: fixed;
top: 0;
left: 0;
right: 0; */
margin: auto;
background: #fff;
z-index: 120;
}
.header_wrap_inner {
max-width: 100%;
margin: 0 auto;
}
.h_inner {
margin: 15px 0 0;
}
.header_h1_under,
.header_h1 {
width: 580px;
height: 80px;
float: left;
}
.logo img {
width: 180px;
margin-right: 15px;
float: left;
}
.head_title {
font-size: 11px;
font-weight: bold;
height: 32px;
line-height: 32px;
letter-spacing: 1px;
margin-top: 0 !important;
padding-top: 0 !important;
}
.header .g_navi li {
float: left;
text-align: center;
}
.header .g_navi li a {
display: block;
width: 120px;
margin: 15px 5px 0;
height: 30px;
line-height: 28px;
font-weight: bold;
font-size: 12px;
border: 1px solid #222222;
border-radius: 20px;
}
.header .g_navi li i {
margin-right: 5px;
}
/***********************************
カート情報
***********************************/
#cartInfo {
float: left;
position: relative;
margin-top: 15px;
margin-left: 5px;
width: 120px;
height: 30px;
line-height: 28px;
font-weight: bold;
font-size: 12px;
border-radius: 20px;
border: 1px solid #222222;
background: #222222;
color: #fff;
text-align: center;
cursor: pointer;
padding-top: -10px;
}
#cartInfo p.cartTxt {
margin: -2px;
line-height: 21px;
padding-top: 5px;
font-size: 10px;
}
#cartInfo p img {
width: 20px;
height: 20px;
display: inline-block;
margin-right: 5px;
}
#cartInfo i {
margin-right: 5px;
}
.h_cart {
display: none;
width: 280px;
height: 145px;
position: absolute;
top: 40px;
right: 5px;
border: 1px solid #aaa;
background: #fff;
color: #000;
z-index: 110;
padding: 10px 20px;
}
.h_cart dl {
font-size: 12px;
margin-bottom: 0px;
}
.h_cart dl:after {
display: block;
content: "";
clear: both;
}
.h_cart dt,
.h_cart dd {
float: left;
}
.h_cart dd span {
display: inline-block;
color: #da4636;
font-weight: bold;
padding: 0 5px;
}
.h_cart .sysCartInfoCartIn a {
display: block;
background: #000;
color: #fff;
width: 100%;
margin: 10px 0% 5px;
height: 50px;
padding: 12px 0 0;
font-size: 15px;
font-weight: bold;
text-align: center;
border-radius: 5px;
}
.h_cart .sysCartInfoCartIn a:hover {
background: #999;
}
.h_cart .sysCartInfoCartIn a img {
display: inline-block;
width: 25px;
height: 25px;
margin-right: 5px;
}
.h_cart .sysCartInfoCartIn a i {
margin-right: 5px;
}
/* カート内商品数表示 */
button.itemCount {
display: none;
border: none;
width: 20px;
height: 20px;
line-height: 20px;
text-align: center;
font-weight: bold;
margin-left: 5px;
color: #222222;
background: #fff;
border-radius: 10px;
}
/***********************************
ナビゲーション
***********************************/
.h_navi {
width: 100%;
height: 60px;
margin-bottom: 10px;
}
#headNavigation {
max-width: 1100px;
margin: 0 auto;
height: 60px;
}
#headNavigation .pcnone {
display: none;
}
#headNavigation li.tab1 {
width: 220px;
float: left;
text-align: center;
}
#headNavigation li a {
display: block;
font-weight: 700;
}
#headNavigation li a span {
display: block;
font-size: 10px;
}
.tabmenu .border:after {
background-color: #000;
content: " ";
height: 15px;
margin-top: -35px;
position: absolute;
right: 0;
top: 42px;
width: 1px;
}
/*ナビゲーショントグル*/
.tabmenu:before {
display: block;
content: "";
clear: both;
}
.tabmenu {
margin: 10px 0 0;
}
.toggleNav {
display: none;
width: 220px;
position: absolute;
height: 0px; /*heightはjs制御*/
top: 50px;
left: 0;
background: rgba(255, 255, 255, 1);
z-index: 110;
box-shadow: 2px 2px 4px 0px #ccc;
-moz-box-shadow: 2px 2px 4px 0px #ccc;
-webkit-box-shadow: 2px 2px 4px 0px #ccc;
}
.toggleNav:hover {
overflow: visible !important;
}
.tabmenu li.tab1 {
position: relative;
}
.tabmenu li.tab1 a {
font-size: 14px;
}
.tabmenu li.tab2 {
text-align: left;
height: 35px;
border-bottom: 1px dotted #ccc;
position: relative;
}
.tabmenu li.tab2:hover {
background: #ededed;
}
.tabmenu li.tab2 a {
display: block;
position: relative;
padding: 10px;
font-size: 12px !important;
line-height: 15px;
font-weight: bold;
}
.tabmenu li.tab2 a i {
position: absolute;
right: 10px;
top: 10px;
}
.tabmenu li.tab2 .subCategory {
position: absolute;
width: 200px;
left: 200px;
top: 0px;
background: rgba(255, 255, 255, 1);
visibility: hidden;
transition: all 0.1s ease;
z-index: 120;
box-shadow: 2px 2px 4px 0px #ccc;
-moz-box-shadow: 2px 2px 4px 0px #ccc;
-webkit-box-shadow: 2px 2px 4px 0px #ccc;
}
.tabmenu li.tab2:hover .subCategory {
visibility: visible;
}
.tabmenu li.tab3 {
font-size: 14px;
height: 35px;
border-bottom: 1px dotted #ccc;
font-weight: bold;
}
.tabmenu li.tab3:hover {
background: #ededed;
}
/***********************************
フッター
***********************************/
.footer {
width: 100%;
}
.footer .f_navi_all {
width: 1000px;
margin: 0 auto;
padding: 10px 0 0;
}
.footer .f_navi h3 {
margin: 10px 0 0;
font-size: 15px;
}
.footer .f_navi ul {
width: 671px;
text-align: left;
margin: 0 auto;
}
.footer .f_navi li {
display: inline-block;
padding: 0 15px 0 5px;
margin: 10px 5px 0;
font-size: 15px;
position: relative;
}
.footer .f_navi li:after {
background-color: #000;
content: " ";
height: 10px;
margin-top: -35px;
position: absolute;
right: 0;
top: 41px;
width: 1px;
}
.footer .f_navi .b_none {
border-right: 0px;
}
.footer .telephone {
margin: 20px 0 5px;
}
.footer .telephone .telephone01 {
width: 250px;
height: 32px;
line-height: 32px;
border: 1px solid #000;
border-radius: 15px;
display: inline-block;
font-size: 15px;
font-weight: bold;
margin-right: 10px;
}
.footer .telephone .telephone02 {
width: 300px;
display: inline-block;
margin-left: 10px;
font-weight: bold;
}
.footer .telephone .telephone02 a {
display: inline-block;
height: 32px;
line-height: 32px;
font-size: 25px;
}
.footer .telephone .telephone02 a img {
display: inline-block;
height: 30px;
margin-right: 10px;
}
.footer .telephone:after {
display: block;
content: "";
clear: both;
}
.footer .time {
font-size: 15px;
margin: 0 0 10px;
}
.footer .f_gnav_all {
background: #c3c3c3;
padding: 15px 0 10px;
letter-spacing: 2px;
}
.footer .f_gnav li {
display: inline-block;
padding: 0px 20px 0 15px;
font-size: 12px;
position: relative;
}
.footer .f_gnav li:after {
background-color: #000;
content: " ";
height: 10px;
margin-top: -35px;
position: absolute;
right: 0;
top: 40px;
width: 1px;
}
.footer .f_gnav li:last-child {
border-right: 0px;
}
.footer .f_gnav {
margin-bottom: 5px;
}
.footer .f_copy {
background: #fff;
padding: 10px;
font-size: 12px;
font-weight: bold;
}
/***********************************
フッター部分のご利用ガイド
***********************************/
.f_guide {
width: 100%;
border-top: 2px solid #222222;
margin-top: 50px;
}
.f_guide .sysContent {
width: 1100px;
margin: 0 auto;
}
.f_guide .Title {
font-size: 15px;
text-align: center;
font-weight: bold;
padding: 10px 0 30px;
}
.f_guide .clearfix {
font-size: 0;
}
.f_guide .guideBlock {
display: inline-block;
width: 550px;
font-size: 14px;
vertical-align: top;
}
.f_guide .guideBlock:after {
display: block;
content: "";
clear: both;
}
.f_guide .guide01 {
padding-right: 50px;
}
.f_guide .guide02 {
padding-left: 50px;
}
.f_guide .guideTitle {
width: 120px;
height: 30px;
line-height: 30px;
text-align: center;
border: 1px solid #000;
border-radius: 15px;
margin-bottom: 10px;
}
.f_guide p {
font-size: 15px;
line-height: 22px;
margin: 5px 0;
}
.f_guide .mt {
margin-top: 20px;
}
.f_guide .smaller {
font-size: 12px;
}
.f_guide .freedial {
background: rgba(0, 0, 0, 0) url("/img/common/dial.png") no-repeat scroll left center / 45px auto;
display: inline-block;
font-size: 40px;
font-weight: bold;
line-height: 1;
margin-bottom: 10px;
padding-left: 50px;
}
/*ボタン*/
.f_guide .common_btn {
margin: 10px auto;
}
.f_guide .common_btn a {
font-size: 13px;
padding: 10px 0;
}
/* ページトップに戻る*/
.pagetop {
/* position: fixed; */
bottom: 20px;
right: 20px;
width: 52px;
height: 52px;
text-align: center;
z-index: 999999;
}
.pagetop #page-top {
display: none;
color: #fff;
font-size: 11px;
line-height: 14px;
background: #000;
border-radius: 5px;
padding-top: 4px;
height: 51px;
}
.pagetop #page-top:hover {
background: #999;
}
/***********************************
サイド
***********************************/
/*検索ボックス*/
.side_search {
margin-bottom: 30px;
}
.side_search form {
border: none;
}
.side_search input[type="search"] {
height: 40px;
border: 1px solid #ddd;
margin-bottom: 5px;
}
.side_search .sysItemSearchFormWord {
float: none;
width: 100%;
}
.side_search .sysSearchButton {
float: none;
width: 100% !important;
height: 2.375rem;
color: #fff;
font-size: 0.875rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 400;
line-height: 1.6;
letter-spacing: 0.05em;
background-color: #9c793c;
cursor: pointer;
}
.side_navi .sysHeadline,
.side_navi_item .sysHeadline {
font-size: 14px;
margin: 0 !important;
text-align: left;
font-weight: bold;
width: auto;
padding: 0;
border-bottom: 1px solid #cbb993;
border-top: 1px solid #cbb993;
}
.side_navi .sysHeadline:before,
.side_navi_item .sysHeadline:before {
content: none;
}
/*商品別*/
.side_navi_item {
margin-top: 2.25rem;
margin-bottom: 0;
}
.side_navi_item li:last-child a {
border-bottom: none !important;
}
.side_navi_item .sysHeadline {
font-size: 13px;
padding: 0;
border-bottom: 1px solid #cbb993;
border-top: 1px solid #cbb993;
}
.side_navi_item .sysHeadline a {
display: block;
border-bottom: none !important;
font-size: 0.8rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 500;
color: #9c793c;
line-height: 1.3;
letter-spacing: 0.03em;
text-align: center;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
/*お買い物ガイド 最後2つ*/
.side_navi_guide li:last-child a {
border: none;
}
.side_navi_guide li:nth-last-child(1) a:hover,
.side_navi_guide li:nth-last-child(2) a:hover {
background-color: #fff;
}
/***********************************
共通パーツ
***********************************/
hr.style01 {
width: 100%;
height: 1px;
background: #222222;
margin: 50px auto;
padding: 0;
border: 0;
}
.sysTitle,
.sysHeadline {
max-width: 600px;
width: 100%;
margin: 30px auto !important;
position: relative;
text-align: center;
font-size: 23px;
letter-spacing: 3px;
}
.sysTitle b,
.sysHeadline b {
display: block;
font-size: 14px;
text-align: center;
}
.sysTitle::before,
.sysHeadline::before {
position: absolute;
top: 50%;
z-index: 1;
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #222222;
}
.contentsWrap {
width: 1100px;
margin: 0 auto;
}
/***********************************
特商法テーブルレイアウト
***********************************/
#main_tradelaw,
.main_tradelaw {
border: 1px solid #ddd;
margin: 0 auto 30px;
max-width: 1100px;
margin-top: 1.5rem;
margin-bottom: 0;
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
#main_tradelaw dl,
.main_tradelaw dl {
display: flex;
border-bottom: 1px dotted #bfbfbf;
}
#main_tradelaw dl:last-child,
.main_tradelaw dl:last-child {
border: 0px;
}
#main_tradelaw dt,
.main_tradelaw dt {
clear: both;
font-weight: bolder;
background-color: #ededed;
width: 40%;
}
#main_tradelaw dd,
.main_tradelaw dd {
margin-left: 0;
padding: 15px;
background: #fff;
width: 60%;
}
.shipFee {
max-width: 1100px;
margin: 20px auto;
}
.shipFee .tableTitle {
font-size: 16px;
height: 70px;
padding: 10px;
color: #424242;
margin: 2.5rem 0 0;
border: 0px !important;
text-align: leftr;
}
table.shipFeeTable {
border-collapse: collapse;
margin-bottom: 30px;
text-align: left;
line-height: 1.5;
text-align: center;
}
table.shipFeeTable .eyeCatch {
width: 120px;
display: block;
margin: 5px auto;
height: 25px;
line-height: 25px;
color: #000;
border-bottom: 1px solid #aaa;
padding-bottom: 5px;
}
table.shipFeeTable thead {
background: #555;
text-align: center;
}
.spThead {
display: none;
}
table.shipFeeTable thead th {
padding: 10px;
vertical-align: top;
color: #fff;
font-size: 0.8rem;
font-weight: 500;
line-height: 2;
letter-spacing: 0.03em;
}
table.shipFeeTable tbody .sum {
position: relative;
}
table.shipFeeTable tbody .sum i {
position: absolute;
color: #888;
font-size: 35px;
right: -15px;
bottom: 30px;
z-index: 20;
}
table.shipFeeTable tbody th {
width: 600px;
padding: 0.625rem;
vertical-align: middle;
background: #fff;
border-bottom: 1px solid #ddd;
border-left: 1px solid #ddd;
border-right: 1px solid #ddd;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
table.shipFeeTable td {
width: 500px;
padding: 10px;
vertical-align: middle;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #eee;
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
table.shipFeeTable b {
color: #d42e30;
display: inline-block;
padding: 0 3px;
font-size: 1.2em;
}
div#main_tradelaw a {
display: inline-block;
color: #068acc;
text-decoration: underline;
}
#main_tradelaw .paymentlist {
font-weight: bold;
}
/***********************************
2カラムレイアウト
***********************************/
.column2Wrap {
width: 1100px;
margin: 0 auto;
}
.column2Wrap:after {
display: block;
content: "";
clear: both;
}
.sideWrap {
width: 180px;
height: 1000px;
background: #aaa;
margin-right: 20px;
float: left;
}
.mainWrap {
width: 900px;
margin-left: 200px;
}
.col2Style h2.pattern01 {
font-size: 1rem;
font-weight: 600;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
border-left: 5px solid #9c793c;
padding-left: 5px;
margin: 15px 0;
}
.p-privacy.col2Style h2.pattern01 {
margin-top: 1.875rem;
}
.col2Style h2.pattern02 {
font-size: 18px;
border-bottom: 1px solid #3d3d3d;
padding-left: 5px;
padding-bottom: 5px;
margin: 15px 0;
}
.col2Style h2.pattern03 {
height: 35px;
line-height: 35px;
font-size: 18px;
padding: 0 0px 3px 30px;
margin: 0 0 15px;
border-bottom: 1px solid #6843ac;
}
.col2Style h3.pattern01 {
font-size: 14px;
border-bottom: 0px solid #aaa !important;
padding: 0px 0px 3px;
margin: 24px 0 5px;
padding-right: 2.5rem;
}
.col2Style h4.style01 {
font-size: 15px;
padding-bottom: 3px;
margin: 20px 0;
border-bottom: 0px solid #3d3d3d !important;
}
.p-privacy.col2Style .txtBlock {
margin: 0;
}
.col2Style .imgWrap {
margin: 30px 0;
}
.col2Style .txtBlock a,
#forbusiness .txtBlock a,
#relocation .txtBlock a,
#privacypolicy .txtBlock a {
color: #068acc;
height: 25px;
line-height: 25px;
padding-bottom: 1px;
border-bottom: 1px solid #068acc;
}
#shoplist td a,
#corporate dd a {
color: #068acc;
height: 25px;
line-height: 25px;
padding-bottom: 1px;
border-bottom: 1px solid #068acc;
}
.col2Style .txtBlock li {
margin: 5px 0;
}
.col2Style .txtBlock {
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
margin: 1.375rem 0;
}
.col2Style .txtBlock h5 {
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
margin-top: 1.25rem;
}
.col2Style .txtBlock font {
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
.col2Style .txtBlock li span {
width: 20px;
display: inline-block;
}
.col2Style .imgWrap img {
width: 40%;
margin: 10px 0;
}
.col2Style .floatWrap {
margin: 20px 0;
}
.col2Style .floatWrap:after {
display: block;
content: "";
clear: both;
}
.col2Style .floatWrap img {
width: 150px;
float: left;
}
.col2Style .floatWrap .txt {
padding-top: 5px;
margin-left: 170px;
}
.col2Style .floatImg {
text-align: center;
}
.col2Style .floatImg:after {
display: block;
content: "";
clear: both;
}
.col2Style .floatImg .imgWrap {
width: 50%;
float: left;
}
.col2Style .floatImg .imgWrap img {
width: 60%;
margin: 20px 10%;
}
/***********************************
お買い物ガイド
***********************************/
.indexList {
margin: 10px 0;
}
.indexList li {
display: inline-block;
text-align: center;
margin: 0 5px 10px;
border: 1px solid #aaa;
padding: 3px 10px;
border-radius: 5px;
font-size: 15px;
}
.guideBlock {
background-color: #ffffff;
border-radius: 5px;
padding: 2.25rem 0.625rem;
margin-top: 1.625rem;
margin-bottom: 0;
}
/*商品購入ステップ*/
.steps ul {
width: 700px;
margin: 0 auto;
}
.steps ul:after {
display: block;
content: "";
clear: both;
}
.steps li {
float: left;
padding: 0 6px;
height: 200px;
}
.steps li a {
display: block;
height: 100%;
height: 200px !important;
}
.steps li img {
height: 200px;
}
/***********************************
ボタンデザイン
***********************************/
.common_btn {
width: 250px;
margin: 20px auto 50px;
position: relative;
}
.common_btn a {
display: block;
padding: 15px 0;
font-size: 16px;
color: #fff;
text-align: center;
border-radius: 5px;
background: #000;
}
.common_btn a:hover {
background: #999;
}
.common_btn a i {
display: inline-block;
margin-left: 10px;
font-size: 20px;
}
/***********************************
TOPページ
***********************************/
/*スライダー*/
#slider {
display: none;
}
.top_slider {
padding-top: 130px;
margin: 0 0 40px;
}
.top_slider .owl-item {
opacity: 0.5;
filter: alpha(opacity=50);
-moz-filter: "alpha( opacity=50 )";
-webkit-filter: "alpha( opacity=50 )";
-o-filter: "alpha( opacity=50 )";
-ms-filter: "alpha( opacity=50 )";
}
.top_slider .center {
opacity: 1;
filter: alpha(opacity=100);
-moz-filter: "alpha( opacity=100 )";
-webkit-filter: "alpha( opacity=100 )";
-o-filter: "alpha( opacity=100 )";
-ms-filter: "alpha( opacity=100 )";
}
/*新着アイテム*/
.top_newarrival ul {
font-size: 0;
text-align: left;
}
.top_newarrival li {
float: none !important;
display: inline-block;
width: 23% !important;
margin: 5px 1% 20px !important;
padding: 10px;
font-size: 12px;
text-align: center;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.top_newarrival li img {
width: 100%;
}
.top_newarrival .sysItemName {
font-size: 16px;
font-weight: 500;
padding-top: 10px;
}
/*特集一覧*/
.top_features {
overflow: hidden;
}
.top_features ul {
font-size: 0;
text-align: left;
}
.top_features li {
float: none !important;
display: inline-block;
width: 30%;
margin: 1.66666666666667%;
font-size: 12px;
vertical-align: top;
}
.top_features li img {
width: 100%;
}
.top_features li a {
display: block;
position: relative;
}
.top_features li span {
display: block;
font-size: 14px;
font-weight: bold;
}
/*おすすめ商品、ランキング*/
.top_recommend_item li .sysItemName,
.top_ranking_item li .sysItemName {
font-size: 16px;
font-weight: 500;
padding-top: 10px;
}
top_recommend_item .sysItemPrice,
top_ranking_item .sysItemPrice {
font-size: 14px;
color: #ff0000;
font-weight: 600;
padding-top: 5px;
}
/*おすすめ商品*/
.top_recommend_item {
margin-bottom: 60px;
}
.top_recommend_item li {
width: 100% !important;
padding: 0 20px !important;
}
/*ランキング*/
.top_ranking_item ul {
font-size: 0;
text-align: left;
}
.top_ranking_item li {
float: none !important;
display: inline-block;
width: 30% !important;
margin: 0 1.5% 30px !important;
padding: 10px;
font-size: 12px;
text-align: center;
vertical-align: top;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
span.sysSubtotalPrice {
display: inline-block;
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
margin-top: 1.5rem;
}
/*クロネコペイボタン装飾調整*/
div#kuronekoPayFlex {
margin-right: 21px;
}
.sysCart #sysMain #kuronekoPayFlex button img {
margin-top: -11px;
}
.sysCart #sysMain button#kmid-login-subwindow-launch,
.sysCart #sysMain button[onclick="Sys('#kmid-login-subwindow-launch').click()"] {
padding: 10px 0px 0px 0px;
}
.sysConfirmButton input#open_dlg_edit_customer_info {
display: inline-block;
padding: 10px;
width: auto;
height: auto;
color: #000;
background: #fff;
border-radius: none;
border: 1px solid #999;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
/*ソーシャルギフト*/
.opcSocialGiftLetter_message_edit {
height: 200px;
}
.opcSocialGiftLetter_letterImagePreviewAndMessageGroup_edit {
width: 80%;
}
.opcSocialGiftLetter_letterImageAndTitleGroup_edit {
width: 20%;
float: left;
margin-right: 10px;
}
.opcSocialGiftLetter_messageTitleAndMessageGroup_edit {
clear: both;
}
input.opcSocialGiftLetter_letterImageId_edit.opcCommonInputRadio:checked ~ .opcSocialGiftLetter_imageUrlGroup_edit {
border: 3px solid #c03d3d;
}
.opcSocialGiftLetter_letterImageId_edit,
.opcSocialGiftLetter_letterImageIdTitle_edit {
display: none;
}
.sysSocialGiftReceiveUrlSendLineButton {
background: #00b900 !important;
color: #fff !important;
border: none !important;
}
.sysSocialGiftReceiveGiftLetterArea {
width: 70%;
border: 1px solid #999;
border-radius: 5px;
margin: 0 auto;
}
.sysSocialGiftReceiveGiftLetterMessage {
padding: 10px;
}
.opcSocialGiftLetter_messageTitleLabel {
display: none;
}
.sysSocialGiftReceiveGiftLetterMessage {
height: 200px;
}
.sysSocialGiftReceiveButton {
font-weight: bold;
width: 30% !important;
font-size: 20px;
width: 70% !important;
}
/*カレンダー調整*/
.sysNextCalendar {
z-index: 0;
}
.sysPrevCalendar {
z-index: 0;
}
.top-arrival {
margin-top: 4.8125rem;
}
.top-footerBlock {
margin-top: 1.3125rem;
}
.top-footerBlock--first {
margin-top: 2.5rem;
}
.top-recommend {
margin-top: 5.3125rem;
}
.arrival__cards {
margin-top: 3.9375rem;
}
.arrival__button {
margin-top: 2.875rem;
text-align: center;
}
a.button {
color: #9c793c;
}
.button {
background-color: #fff;
border: solid 1px #9c793c;
border-radius: 1.5625rem;
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
color: #9c793c;
display: inline-block;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.3;
padding-bottom: 0.75rem;
padding-top: 0.5625rem;
position: relative;
text-align: center;
transition: 0.3s;
width: 16rem;
z-index: 0;
}
.button--arrival {
background-color: #fdfcf7;
width: 11.75rem;
}
.button:before {
border-color: transparent transparent transparent #9c793c;
border-style: solid;
border-width: 0.25rem 0 0.25rem 0.25rem;
content: "";
height: 0;
position: absolute;
right: 1.0625rem;
top: 50%;
transform: translateY(-50%);
width: 0;
}
.button:hover {
opacity: 0.6;
}
.button--faq {
width: 10rem;
}
.card {
display: flex;
flex-direction: column;
height: 100%;
}
.card:hover {
opacity: 0.6;
}
.card__image {
aspect-ratio: 250/250;
width: 100%;
}
.card__image img {
height: 100%;
}
.card__header {
margin-top: 0.875rem;
}
.card__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.56;
}
.card__body {
text-align: center;
margin-top: auto;
padding-top: 0.8125rem;
}
.card__text {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 400;
letter-spacing: 0.05em;
line-height: 1.35;
}
.cards {
display: flex;
flex-direction: column;
gap: 1.75rem;
}
.category-item {
position: relative;
overflow: hidden;
}
.category-item__title {
/* font-family: "Zen Old Mincho", serif; */
font-weight: 700;
line-height: 1.2;
position: absolute;
top: 20px;
display: flex;
flex-direction: row-reverse;
align-items: flex-start;
justify-content: flex-start;
column-gap: 10px;
}
.category-item__title span {
writing-mode: vertical-rl;
/* background: #ffffff; */
/* background: #967a45;
color: #ffffff; */
/* background: #fdfcf7; */
/* background: #f4f5f7; */
background: rgba(253, 252, 247, 0.85);
color: #967a45;
}
.category-item__image {
overflow: hidden;
}
.category-item__image img {
object-fit: cover;
width: 100%;
height: 100%;
max-width: none;
}
.category {
padding-top: 3.1875rem;
position: relative;
}
.top-category {
padding-top: 0;
padding-bottom: 50px;
background-color: #fdfcf6;
}
.category::before {
background-color: #f4f5f7;
content: "";
height: 73%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.top-category::before {
display: none;
}
.contact-form__content {
align-items: center;
background-image: linear-gradient(to right, #000 3px, transparent 3px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 0.25rem 0.03125rem;
display: flex;
flex-direction: column;
margin-top: 1.5rem;
padding-bottom: 1.5rem;
}
.contact-form__content--top {
margin-top: 0;
}
.contact-form__content--textarea {
height: 15rem;
}
.contact-form__title {
align-items: flex-start;
color: #000;
display: flex;
font-weight: 700;
gap: 1.25rem;
width: 100%;
}
.contact-form__text {
border: solid 1px #000;
padding: 0.4375rem 1rem 0.4375rem 1rem;
width: 100%;
}
.contact-form__required {
background-color: #c94800;
color: #fff;
font-size: 0.75rem;
font-weight: 300;
letter-spacing: 0.4em;
margin-left: 0.5rem;
padding: 0.125rem 1rem;
padding-right: 0.6875rem;
}
.contact-form__check-box {
align-items: center;
background-image: linear-gradient(to right, #000 3px, transparent 3px);
background-position: left bottom;
background-repeat: repeat-x;
background-size: 0.25rem 0.03125rem;
display: flex;
flex-direction: column;
margin-top: 1.5rem;
padding-bottom: 1.5rem;
}
.contact-form__menu {
margin-top: 1rem;
position: relative;
width: 100%;
}
.contact-form__menu::before {
border: 6px solid transparent;
border-top: 10px solid #000;
content: "";
position: absolute;
right: 1rem;
top: 35%;
}
.contact-form__menu-item {
border: solid 1px #000;
font-size: 0.75rem;
line-height: 1.5;
padding: 0.625rem 0rem 0.625rem 0.5rem;
width: 100%;
}
.contact-form__content .wpcf7-form-control-wrap {
margin-top: 1rem;
width: 100%;
}
.contact-form__check-box .wpcf7-form-control-wrap {
margin-top: 1rem;
width: 100%;
}
.contact-form__acceptance {
margin-top: 2.5rem;
text-align: center;
}
.contact-form__acceptance .wpcf7-list-item input[type="checkbox"] {
border: 1px solid #000;
display: inline-block;
height: 1.375rem;
margin-right: 1rem;
position: relative;
vertical-align: -0.5rem;
width: 1.375rem;
}
.contact-form__acceptance .wpcf7-list-item input[type="checkbox"]:checked:before {
border-bottom: 2px solid #c94800;
border-right: 2px solid #c94800;
content: "";
display: inline-block;
height: 1rem;
left: 0.375rem;
position: absolute;
top: 0rem;
transform: rotate(50deg);
width: 0.5rem;
}
.contact-form__button {
margin-top: 1.5rem;
text-align: center;
}
.contact-form__textarea {
border: solid 1px #000;
height: 12.5rem;
padding: 0.5rem 1rem 0.5rem 1rem;
width: 100%;
}
.contact-form__check {
display: flex;
flex-direction: column;
width: 100%;
}
.contact-form__check .wpcf7-list-item {
line-height: 1.5;
margin-top: 0.5rem;
}
.contact-form__check .wpcf7-list-item.first {
margin-top: 0;
}
.contact-form__check .wpcf7-list-item input[type="checkbox"] {
border: 1px solid #000;
display: inline-block;
height: 0.875rem;
margin: 0;
margin-bottom: 0.25rem;
margin-right: 0.375rem;
margin-top: 0.125rem;
position: relative;
vertical-align: -0.3125rem;
width: 0.9375rem;
}
.contact-form__check .wpcf7-list-item input[type="checkbox"]:checked:before {
border-bottom: 2px solid #c94800;
border-right: 2px solid #c94800;
content: "";
display: inline-block;
height: 0.5625rem;
left: 0.3125rem;
position: absolute;
top: 0rem;
transform: rotate(50deg);
width: 0.3125rem;
}
.error__body {
padding-bottom: 5rem;
padding-top: 5rem;
}
.error__title {
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
text-align: center;
}
.error__button {
margin-top: 2.5rem;
text-align: center;
}
.footer-nav {
align-items: center;
display: flex;
flex-direction: column;
text-align: center;
}
.footer-nav__item {
margin-top: 0.875rem;
}
.footer-nav__menu {
color: #000;
/* font-family: "Zen Old Mincho", serif; */
font-size: 0.6875rem;
font-weight: 300;
letter-spacing: 0.01em;
line-height: 1.15;
padding: 0 max(0.25rem, min(0.9vw, 0.6875rem));
}
.footer {
padding-bottom: 1.25rem;
position: relative;
}
.footer::before {
background-color: #fdfcf7;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.footer__main {
display: flex;
flex-direction: column;
gap: 3.75rem;
}
.footer__left {
padding-top: 2.5rem;
text-align: center;
}
.footer__logo {
display: inline-block;
}
.footer__logo img {
aspect-ratio: 70/30;
width: 8.75rem;
}
.footer__address {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.8;
margin-top: 1.4375rem;
text-align: center;
}
.footer__tel {
align-items: center;
display: flex;
gap: 0.3125rem;
justify-content: center;
margin-top: 0.375rem;
}
.footer__tel-icon img {
aspect-ratio: 18/18;
width: 0.9375rem;
}
.footer__tel-number {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Barlow", serif; */
font-size: 1.625rem;
font-weight: 700;
letter-spacing: 0.02em;
line-height: 1.1;
text-align: center;
}
.footer__reception {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.85;
text-align: center;
}
.footer__button {
margin-top: 2.5rem;
text-align: center;
}
.footer__bottom {
border-top: solid 1px #dddddd;
display: flex;
flex-direction: column;
gap: 1.5rem;
margin-top: 3.75rem;
padding-top: 1.625rem;
}
.footer__copyright {
text-align: center;
}
.footer__copyright small {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Barlow", serif; */
font-size: 0.6875rem;
font-weight: 400;
letter-spacing: 0.001em;
line-height: 1.2;
}
.footerBlock__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #cbb993;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.875rem;
font-weight: 700;
letter-spacing: 0.03em;
line-height: 1.3;
}
.footerBlock__text {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.9;
margin-top: 1.0625rem;
}
.footerBlock__more {
margin-top: 0.125rem;
text-align: right;
}
.footerBlock__more-text {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
display: inline-block;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.35;
position: relative;
}
.footerBlock__more-text::before {
border: 1.5px solid #c00201;
border-bottom: 0;
border-left: 0;
box-sizing: border-box;
content: "";
height: 0.4375rem;
position: absolute;
right: -0.875rem;
top: 0.5625rem;
transform: rotate(45deg);
transform-origin: top right;
width: 0.4375rem;
}
.footerBlock__more-text::after {
background-color: #c00201;
content: "";
height: 1.5px;
position: absolute;
right: -0.78125rem;
top: 0.5rem;
width: 0.625rem;
}
.hamburger {
width: 42px;
height: 42px;
border-radius: 21px;
background: #967a45;
position: absolute;
top: 36px;
left: 15px;
z-index: 1000;
transform: translateY(-50%);
transform-origin: center center;
transition: opacity 0.5s;
}
.hamburger span {
width: 20px;
height: 2px;
background-color: #ffffff;
position: absolute;
left: 50%;
transform: translateX(-50%);
transform-origin: center center;
transition: all 0.5s;
}
.hamburger span:nth-child(1) {
top: 11px;
}
.hamburger span:nth-child(2) {
top: 50%;
transform: translate(-50%, -50%);
}
.hamburger span:nth-child(3) {
bottom: 11px;
}
.hamburger.active span:nth-of-type(1) {
width: 25px;
top: 50%;
transform: translate(-50%, -50%) rotate(37deg);
}
.hamburger.active span:nth-of-type(2) {
opacity: 0;
}
.hamburger.active span:nth-of-type(3) {
width: 25px;
bottom: 50%;
transform: translate(-50%, 50%) rotate(-37deg);
}
.header {
/* position: fixed; */
width: 100%;
z-index: 100;
background: #fdfcf7;
}
.header__main-contents {
align-items: center;
display: flex;
gap: max(46px, min(6.5vw, 88px));
height: 5rem;
justify-content: center;
position: relative;
}
.header__right {
display: none;
}
.header__rightBlock-search {
background-color: #fff;
border: 1px solid #dddddd;
border-radius: 1.25rem;
height: 1.8125rem;
margin-bottom: 0.25rem;
padding: 0.1875rem 0.625rem;
position: relative;
width: 11.3125rem;
}
.header__rightBlock-search input[type="search"] {
font-size: 0.75rem;
vertical-align: top;
width: 100%;
height: 100%;
border: none;
padding: 0.625rem 0.375rem;
padding-left: 1.5rem;
margin-top: -1px;
}
.header__rightBlock-search input[type="text"]:focus {
outline: 0;
}
.header__rightBlock-search input[type="submit"] {
background-image: url(/img/assets/search-icon.png);
background-size: cover;
content: "";
cursor: pointer;
height: 0.875rem;
left: 0.875rem;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 0.875rem;
margin-top: 0;
}
.header__rightBlock-info {
align-items: flex-end;
display: flex;
flex-direction: column;
}
.header__rightBlock-reception {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: sans-serif; */
font-size: 0.625rem;
font-weight: 300;
letter-spacing: 0.01em;
line-height: 1.3;
}
.header__rightBlock-tel {
align-items: center;
display: flex;
gap: 0.3125rem;
}
.header__rightBlock-icon img {
aspect-ratio: 18/18;
width: 0.9375rem;
}
.header__rightBlock-number {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: serif; */
font-size: 1.4375rem;
font-weight: 700;
letter-spacing: 0.02em;
line-height: 1.3;
}
.header__rightNav {
margin-top: 0.5rem;
}
.header__logo:hover {
opacity: 0.6;
}
.header__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
font-family: "EB Garamond", "Zen Old Mincho", serif;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.2;
position: relative;
}
.header__image img {
aspect-ratio: 130/55;
height: 3.4375rem;
width: 8.125rem;
}
/* .globalNav {
font-family: "Zen Old Mincho", serif;
} */
.header__search input[type="search"] {
border: 1px solid #e2c88c;
background: #ffffff;
color: #967a45;
padding-right: 30px;
padding-left: 8px;
font-size: 1rem;
line-height: 2;
position: relative;
}
.header__search input[type="submit"] {
width: 14px;
height: 14px;
position: absolute;
top: 50%;
right: 8px;
transform: translateY(-50%);
margin: 0;
background: url(/img/assets/pict_loupe.svg) no-repeat center center;
background-size: contain;
}
.header__utility {
display: flex;
flex-direction: column;
}
.header__utility .utilityNav a {
background-position: left center;
background-repeat: no-repeat;
padding-left: 21px;
}
.header__utility .utility--registration a {
background-image: url(/img/assets/pict_pencil.svg);
background-size: auto 16px;
}
.header__utility .utility--measuring a {
background-image: url(/img/assets/pict_measuring-stick.svg);
background-size: auto 16px;
}
.header__utility .utility--guide a {
background-image: url(/img/assets/pict_book.svg);
background-size: auto 16px;
padding-left: 26px;
}
.header__utility .utility--mypage a {
background-image: url(/img/assets/pict_person.svg);
background-size: auto 16px;
}
.header__utility .businessHours {
display: flex;
line-height: 1.5;
}
.header__utility .info {
display: flex;
flex-direction: column;
}
.header__utility .businessHours {
font-size: 0.6875rem;
}
.header__utility .businessHours dt::after {
content: "：";
}
.header__utility .tel {
padding-left: 22px;
/* font-family: "Zen Old Mincho", serif; */
font-size: 1.5rem;
line-height: 1.5;
font-weight: 700;
background: url(/img/assets/pict_phone.svg) no-repeat left center;
background-size: 20px 20px;
}
.header__top-sp {
background-color: #f4f5f7;
padding: 0.25rem 0;
text-align: center;
}
.header__cart-icon {
position: absolute;
right: 3.125rem;
top: 50%;
transform: translateY(-50%);
z-index: 1000;
}
.header__cart-icon img {
aspect-ratio: 18/18;
width: 1.125rem;
}
.inner {
margin-left: auto;
margin-right: auto;
max-width: 640px;
padding-left: 20px;
padding-right: 20px;
width: 100%;
}
.mv-header {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.mv-header__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #9c793c;
display: inline-block;
font-family: "EB Garamond", "Zen Old Mincho", serif;
font-size: 1.5625rem;
font-weight: 600;
letter-spacing: 0.08em;
line-height: 1.2;
position: relative;
}
.mv-header__title::before {
background-image: url(/img/assets/mv-title.png);
background-size: cover;
content: "";
height: 2.9375rem;
left: -36%;
position: absolute;
top: -1.1875rem;
width: 4.125rem;
}
.mv-header__title::after {
background-image: url(/img/assets/mv-title.png);
background-size: cover;
content: "";
height: 2.9375rem;
position: absolute;
right: -36%;
top: 0.25rem;
width: 4.125rem;
}
.mv-header__sub-title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
display: inline-block;
/* font-family: "Barlow", serif; */
font-size: 0.9375rem;
font-weight: 400;
letter-spacing: 0.1em;
line-height: 1.2;
margin-top: 0.5625rem;
position: relative;
}
.mv-sub {
overflow: hidden;
padding-top: 5rem;
}
.mv-sub__wrapper {
position: relative;
}
.mv-sub__image {
display: block;
position: relative;
}
.mv-sub__image::before {
background: rgba(64, 143, 149, 0.3);
content: "";
display: block;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.mv-sub__image img {
aspect-ratio: 1360/438;
height: 18.75rem;
}
.mv-sub__body {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
}
.mv-sub__title {
color: #fff;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 1.5rem;
font-weight: 700;
letter-spacing: 0.23em;
line-height: 1.2;
text-align: center;
}
.mv-sub__sub-title {
color: #fff;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 1rem;
font-weight: 700;
letter-spacing: 0.23em;
line-height: 1;
text-align: center;
}
.mv {
padding-bottom: 40px;
position: relative;
}
.mv::before {
background-color: #f4f5f7;
bottom: 0;
content: "";
height: 65%;
left: 0;
position: absolute;
width: 100%;
z-index: 0;
}
.mv__inner.inner {
max-width: 100%;
padding: 0;
}
.mv__wrapper {
position: relative;
}
.mv__image {
display: block;
width: 100%;
}
.mv__image img {
aspect-ratio: 750/500;
width: 100%;
}
.mv__header {
margin-top: 4.5rem;
}
.mv__block {
text-align: center;
position: relative;
}
.pcNav-sub {
display: none;
}
.pcNav-sub__items {
align-items: center;
display: flex;
height: inherit;
justify-content: flex-end;
margin-right: 0.625rem;
}
.pcNav-sub__item {
border-right: solid 1px #cbb993;
height: inherit;
}
.pcNav-sub__item:last-child {
border-right: none;
}
.pcNav-sub__menu {
align-items: center;
display: flex;
flex-direction: row;
gap: 0.25rem;
height: inherit;
padding: 0 0.5rem;
}
.pcNav-sub__sub-title::after {
background: #fff;
bottom: -0.1875rem;
content: "";
height: 0.0625rem;
left: 0;
position: absolute;
transform: scale(0, 1); /*X方向0、Y方向1*/
transform-origin: center top; /*上部中央基点*/ /*アニメーションの指定*/
transition: all 0.3s; /*線の形状*/
width: 100%;
}
.pcNav-sub__menu:hover {
opacity: 0.6;
}
/*現在地とhoverの設定*/
.pcNav-sub__menu:hover .pcNav-sub__sub-title::after {
transform: scale(1, 1); /*X方向にスケール拡大*/
}
.pcNav-sub__icon img {
aspect-ratio: 14/14;
width: 1rem;
}
.pcNav-sub__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: sans-serif; */
font-size: 0.75rem;
font-weight: 400;
letter-spacing: 0.05em;
line-height: 1.25;
text-align: center;
}
.pcNav-sub__title--font {
/* font-family: serif; */
font-weight: 400;
}
.pcNav {
display: none;
}
.pcNav__items {
align-items: center;
display: flex;
height: inherit;
}
.pcNav__item {
border-right: solid 1px #ede2ca;
height: inherit;
position: relative;
width: 18.1818181818%;
}
.pcNav__item::before {
border-right: 1px solid #ba9d58;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.pcNav__item--cart {
position: relative;
width: 9.0909090909%;
}
.pcNav__item--cart::before {
background-color: #fff;
}
.pcNav__item--first {
border-left: 1px solid #ba9d58;
}
.pcNav__item--first::before {
border-left: solid 1px #ede2ca;
}
.pcNav__item--borderReverse {
border-right: 1px solid #ba9d58;
}
.pcNav__item--borderReverse::before {
border-right: solid 1px #ede2ca;
}
.pcNav__menu {
align-items: center;
display: flex;
flex-direction: row;
height: inherit;
justify-content: center;
padding-bottom: 0.625rem;
padding-left: 0.5rem;
padding-right: 0.5rem;
padding-top: 0.8125rem;
}
.pcNav__item--cart .pcNav__menu {
gap: 0.3125rem;
}
.pcNav__sub-title::after {
background: #fff;
bottom: -0.1875rem;
content: "";
height: 0.0625rem;
left: 0;
position: absolute;
transform: scale(0, 1); /*X方向0、Y方向1*/
transform-origin: center top; /*上部中央基点*/ /*アニメーションの指定*/
transition: all 0.3s; /*線の形状*/
width: 100%;
}
.pcNav__menu:hover {
opacity: 0.6;
}
/*現在地とhoverの設定*/
.pcNav__menu:hover .pcNav__sub-title::after {
transform: scale(1, 1); /*X方向にスケール拡大*/
}
.pcNav__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #fff;
/* font-family: serif; */
font-size: 0.875rem;
font-weight: 600;
letter-spacing: 0.01em;
line-height: 1.5;
text-align: center;
}
.pcNav__item--cart .pcNav__title {
color: #9c793c;
/* font-family: serif; */
}
.pcNav__icon img {
aspect-ratio: 18/18;
width: 0.9375rem;
}
.ranking {
padding-bottom: 7.875rem;
padding-top: 3.75rem;
position: relative;
}
.ranking::before {
background-color: #f4f5f7;
content: "";
height: 57.2%;
left: 50%;
position: absolute;
top: 0;
transform: translateX(-50%);
width: 93.75%;
z-index: -1;
}
.ranking__cards {
margin-top: 3.9375rem;
}
.recommend {
padding-bottom: 7.9375rem;
}
.recommend__contents {
display: flex;
margin-top: 3.9375rem;
position: relative;
}
.section-header {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.section-header__title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #9c793c;
display: inline-block;
/* font-family: "Barlow", serif; */
font-size: 1.4375rem;
font-weight: 600;
letter-spacing: 0.1em;
line-height: 1.3;
position: relative;
}
.section-header__title::before {
background-image: url(/img/assets/section-title.png);
background-size: cover;
content: "";
height: 2.25rem;
left: -3.3125rem;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 2.25rem;
}
.section-header__title::after {
background-image: url(/img/assets/section-title.png);
background-size: cover;
content: "";
height: 2.25rem;
position: absolute;
right: -3.3125rem;
top: 50%;
transform: translateY(-50%);
width: 2.25rem;
}
.section-header__sub-title {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
display: inline-block;
padding-bottom: 55px;
/* font-family: "Zen Old Mincho", serif; */
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.08em;
line-height: 1.2;
margin-top: 0.1875rem;
position: relative;
}
.section-header__sub-title::before {
background-color: #cbb993;
bottom: 12px;
content: "";
height: 2.125rem;
left: 50%;
position: absolute;
transform: translateX(-50%);
width: 0.0625rem;
}
.section-header--noBorder .section-header__sub-title::before {
display: none;
}
.snsBlock {
display: flex;
gap: 0.625rem;
}
.snsBlock__icon img {
aspect-ratio: 24/24;
width: 1.5rem;
}
.sp-nav {
background-color: #fff;
display: none;
height: 100%;
left: 0;
overflow: scroll;
padding-top: 5rem;
position: fixed;
top: 0;
width: 100%;
z-index: 100;
}
.sp-nav__inner.inner {
max-width: 31.25rem;
}
.sp-nav__items--second {
margin-top: 3.75rem;
}
.sp-nav__item {
margin-top: 1.5rem;
text-align: center;
}
.sp-nav__item:first-child {
margin-top: 0;
}
.sp-nav__block {
align-items: center;
display: flex;
flex-direction: row;
gap: 0.375rem;
justify-content: center;
}
.sp-nav__icon img {
aspect-ratio: 18/18;
width: 0.9375rem;
}
.sp-nav__menu {
color: #000;
/* font-family: "Zen Old Mincho", serif; */
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.1em;
line-height: 1;
}
.sp-nav__info {
margin-top: 2.5rem;
}
.sp-nav__info-tel {
align-items: center;
display: flex;
gap: 0.625rem;
justify-content: center;
}
.sp-nav__info-number {
color: #000;
/* font-family: "Zen Old Mincho", serif; */
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.3em;
line-height: 1.5;
}
.sp-nav__info-icon img {
aspect-ratio: 15/15;
width: 0.9375rem;
}
.sp-nav__info-reception {
color: #000;
/* font-family: "Zen Old Mincho", serif; */
font-size: 1rem;
font-weight: 500;
letter-spacing: 0.03em;
line-height: 1.5;
margin-top: 1.25rem;
text-align: center;
}
.swiper-button-next {
display: none;
}
.swiper-button-prev {
display: none;
}
.swiper-button-next,
.swiper-button-prev {
background-color: #fff;
border: solid 1px #dddddd;
border-radius: 50%;
height: 3.1875rem;
width: 3.1875rem;
}
.swiper-button-next:after {
background-image: url(/img/assets/arrow-left.png);
background-size: cover;
content: "";
height: 0.625rem;
width: 0.625rem;
}
.swiper-button-prev:after {
background-image: url(/img/assets/arrow-right.png);
background-size: cover;
content: "";
height: 0.625rem;
width: 0.625rem;
}
.swiper-pagination.swiper-pagination--mv {
bottom: -3.125rem;
}
.swiper-pagination-bullet {
background: #dddddd;
border-radius: 0;
border-radius: initial;
display: inline-block;
height: 0.25rem;
opacity: 1;
opacity: initial;
width: 1.625rem;
}
.swiper-pagination-bullet-active {
background: #9c793c;
}
.swiper-button-next.swiper-button-next--recommend {
left: 0;
right: auto;
right: initial;
top: 6.25rem;
}
.swiper-button-prev.swiper-button-prev--recommend {
left: auto;
left: initial;
right: 0;
top: 6.25rem;
}
.swiper-pagination.swiper-pagination--recommend {
bottom: -3.125rem;
}
.thanks__body {
padding-bottom: 5rem;
padding-top: 5rem;
}
.thanks__title {
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 1.5rem;
font-weight: 700;
line-height: 1.5;
text-align: center;
}
.thanks__text {
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 1rem;
font-weight: 700;
line-height: 1.5;
margin-top: 2.5rem;
text-align: center;
}
@media screen and (min-width: 768px) {
.u-desktop {
display: block;
}
.u-mobile {
display: none;
}
html {
font-size: 1.4545454545vw;
}
.arrival__inner.inner {
max-width: 61.875rem;
}
.cards {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.category__inner.inner {
max-width: 83.125rem;
}
.contact-form__content {
flex-direction: row;
margin-top: 2.5rem;
padding-bottom: 2.5rem;
}
.contact-form__content--top {
margin-top: 0;
}
.contact-form__title {
width: 31.4%;
}
.contact-form__check-box {
flex-direction: row;
margin-top: 2.5rem;
padding-bottom: 2.625rem;
}
.contact-form__menu {
margin-top: 0;
width: 68.6%;
}
.contact-form__menu-item {
padding: 0.375rem 0rem 0.375rem 1rem;
}
.contact-form__content .wpcf7-form-control-wrap {
margin-top: 0;
width: 68.6%;
}
.contact-form__check-box .wpcf7-form-control-wrap {
margin-top: 0;
width: 68.6%;
}
.contact-form__acceptance {
margin-top: 5rem;
}
.contact-form__button {
margin-top: 2.25rem;
}
.contact-form__check .wpcf7-list-item input[type="checkbox"] {
margin-left: 0.25rem;
width: 1rem;
}
.footer-nav {
flex-direction: row;
justify-content: space-between;
}
.footer-nav__items {
display: flex;
}
.footer-nav__item {
margin-top: 0;
}
.footer {
padding-bottom: 4.6875rem;
padding-top: 3.75rem;
}
.footer__inner.inner {
max-width: 61.875rem;
}
.footer__main {
flex-direction: row;
gap: initial;
}
.footer__left {
border-right: solid 1px #dddddd;
padding-bottom: 0.6875rem;
padding-right: 6.25rem;
text-align: inherit;
width: 37.8181818182%;
}
.footer__logo img {
aspect-ratio: 193/82;
width: 10.3125rem;
}
.footer__address {
text-align: left;
}
.footer__tel {
justify-content: flex-start;
}
.footer__tel-number {
text-align: left;
}
.footer__reception {
text-align: left;
}
.footer__button {
margin-top: 1.5rem;
text-align: left;
}
.footer__right {
padding-left: 2.6875rem;
padding-top: 1.625rem;
width: 62.1818181818%;
}
.footer__bottom {
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: unset;
}
.footer__nav {
width: 59.2%;
}
.footer__copyright {
text-align: left;
width: 24%;
}
.footerBlock__text {
padding-right: 4.625rem;
}
.hamburger {
display: none;
}
/* .header {
height: 8.125rem;
} */
.header__main-inner.inner {
max-width: 61.875rem;
}
.header__main-contents {
height: auto;
height: initial;
justify-content: space-between;
}
.header__left {
align-items: center;
display: flex;
flex-direction: row;
gap: max(20px, min(3.5vw, 46px));
padding: 1rem 0;
}
.header__right {
display: block;
padding-bottom: 0.6875rem;
padding-top: 0.625rem;
}
.header__rightBlock {
align-items: flex-end;
display: flex;
flex-direction: row;
gap: 1rem;
justify-content: flex-end;
}
/* .header__title::before {
background-color: #cbb993;
content: "";
height: 1.25rem;
left: -1.375rem;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 0.0625rem;
} */
.header__hamburger {
display: none;
}
/* .header__nav {
background-color: #cbb993;
display: block;
position: relative;
z-index: -1;
} */
.header__nav-inner.inner {
max-width: 61.875rem;
}
.header__cart-icon {
display: none;
}
.header__search-sp {
display: none;
}
.inner {
max-width: 1150px;
padding-left: 25px;
padding-right: 25px;
}
.mv-header__title::before {
left: -5.6875rem;
}
.mv-header__title::after {
right: -5.875rem;
}
.mv-sub {
padding-top: 5.625rem;
}
.mv-sub__image img {
height: 27.375rem;
}
.mv-sub__title {
font-size: 2.25rem;
line-height: 1.25;
}
.mv-sub__sub-title {
font-size: 1.3125rem;
margin-top: 1.75rem;
}
.mv__inner.inner {
max-width: 85.375rem;
}
.mv__image img {
width: 40rem;
}
.pcNav-sub {
display: block;
height: inherit;
}
.pcNav {
display: block;
height: inherit;
}
.ranking__inner.inner {
max-width: 61.875rem;
}
.recommend__inner.inner {
max-width: 61.875rem;
}
.sp-nav__inner.inner {
max-width: 70.625rem;
}
.swiper-button-next {
display: flex;
left: max(10.875rem, min(23.5%, 20rem));
right: auto;
right: initial;
}
.swiper-button-prev {
display: flex;
left: auto;
left: initial;
right: max(10.875rem, min(23.5%, 20rem));
}
.swiper-button-next.swiper-button-next--recommend {
left: -4.8125rem;
}
.swiper-button-prev.swiper-button-prev--recommend {
right: -4.8125rem;
}
}
@media (min-width: 1100px) {
html {
font-size: 16px;
}
}
@media (max-width: 375px) {
html {
font-size: 4.2666666667vw;
}
}
/*# sourceMappingURL=style.css.map */
a:hover {
opacity: 0.5;
}
#sysAll {
max-width: 100%;
padding: 0;
position: absolute;
top: 0;
left: 0;
}
#sysHeader {
width: 100%;
padding: 0;
margin: 0 auto;
clear: both;
position: relative;
}
#sysMain {
width: 100%;
padding: 0;
margin: 0 auto;
}
#sysAside {
width: 100%;
padding: 0;
margin: 0 auto;
}
#sysFooter {
width: 100%;
padding: 0;
margin: 0 auto;
clear: both;
background-color: #fdfcf7;
}
.sysContent {
padding: 0;
}
.news-header .sysContent {
padding: 0;
}
.header-block .sysContent {
padding: 0;
}
.sysFuncInformation.news-block {
padding-bottom: 50px;
}
.news-block .sysContent {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
}
.news-block ul li {
margin-top: 0.625rem;
display: flex;
padding-right: 1.25rem;
padding-left: 1.25rem;
}
.news-block ul li:first-child {
margin-top: 0;
}
.news-block ul li a {
display: flex;
justify-content: center;
gap: 0.5rem;
flex-direction: column;
font-size: 0.875rem;
font-weight: 500;
}
.news-block time {
font-weight: 700;
}
.news-block ul li a br {
display: none;
}
.news-button .sysContent {
text-align: center;
padding: 0;
margin-top: 2.875rem;
}
.new .sysContent {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
}
.new .sysContent .sysHorizontal li {
display: flex;
flex-direction: column;
width: 100%;
padding: 0;
}
.mv-slider .sysContent {
padding: 0;
}
.recommend-list .sysContent {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
}
.sysVertical {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 1.75rem;
}
.sysFuncText.new-button {
padding-bottom: 50px;
}
.new-button .sysContent {
text-align: center;
padding: 0;
}
.category-parts .sysContent {
padding: 0;
}
.recommend-header .sysContent {
padding: 0;
background: #f4f5f7;
}
.sysFuncItemBlock.recommend-list {
background: #f4f5f7;
}
.recommend-list .sysContent .sysHorizontal li {
display: flex;
flex-direction: column;
width: 100%;
padding: 0;
}
.sysItemName {
text-align: left;
margin-top: 0.875rem;
}
.sysFuncText.ranking-header {
position: relative;
}
.ranking-header .sysContent {
padding: 0;
background: #fdfcf6;
}
.ranking-list .sysContent {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
}
.sysFuncItemBlock.ranking-list {
position: relative;
z-index: 0;
background: #fdfcf6;
}
.ranking-list .sysContent .sysHorizontal li {
width: 100%;
padding: 0;
}
.footer-block .sysContent {
padding: 0;
}
.sysItemName a {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.875rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.56;
}
.sysItemPrice {
text-align: left;
margin-top: auto;
padding-top: 0.8125rem;
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #000;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.75rem;
font-weight: 400;
letter-spacing: 0.05em;
line-height: 1.35;
}
.sysHorizontal .sysItemImage img {
aspect-ratio: 214/214;
}
.side_search .sysItemSearchFormWord {
position: relative;
}
.side_search input[type="search"] {
height: 38px;
border: 1px solid #ddd;
margin-bottom: 0;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.875rem;
line-height: 1.3;
letter-spacing: 0.05em;
font-weight: 400;
}
.side_search input[type="search"] {
height: 2.375rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.875rem;
font-weight: 400;
line-height: 1.3;
letter-spacing: 0.05em;
padding-top: 0.5rem;
padding-left: 2.375rem;
margin-bottom: 0;
border: 1px solid #ddd;
}
.side_search .sysItemSearchFormWord::before {
background-image: url(/img/assets/search-icon.png);
background-size: cover;
content: "";
cursor: pointer;
height: 1rem;
left: 0.875rem;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 1rem;
}
.side_search .sysContent {
padding: 0;
}
.side_search.search_bx {
margin-bottom: 0;
}
.sysText a {
font-size: 0.875rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 500;
color: #000000;
line-height: 1.3;
letter-spacing: 0.03em;
padding: 0;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.side_navi_guide {
margin-top: 2.25rem;
margin-bottom: 0;
}
.shopping-guide {
display: block;
border-bottom: none !important;
font-size: 0.8rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 500;
color: #9c793c;
line-height: 1.3;
letter-spacing: 0.03em;
text-align: center;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
.side_navi_item .sysContent .sysText a {
font-size: 0.8rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 500;
color: #000000;
line-height: 1.3;
letter-spacing: 0.03em;
padding: 0;
padding-top: 0.75rem;
padding-left: 1.25rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid #cdcdcd;
}
.side_navi_guide .sysContent .sysText a {
font-size: 0.8rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 500;
color: #000000;
line-height: 1.3;
letter-spacing: 0.03em;
padding: 0;
padding-top: 0.75rem;
padding-left: 1.25rem;
padding-bottom: 0.75rem;
border-bottom: 1px solid #cdcdcd;
}
.side_navi_guide .sysContent li:last-child a {
border-bottom: none;
}
.sysItemCategoryPankuzu {
font-size: 0.6875rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 400;
color: #999999;
line-height: 1.3;
letter-spacing: 0.05em;
}
.sysItemCategoryCtl {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
border: 1px solid #cbb993;
border-left: none;
border-right: none;
padding-top: 20px;
padding-bottom: 20px;
margin: 0;
}
.sysItemList {
margin-top: 2.5rem;
}
#sysMypageAshiato .sysMypageNav {
margin-top: 5rem;
}
.sysItemListDisp {
padding-top: 0.875rem;
}
#displayCount {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
}
.sysItemListDisp .sysItemListViewType {
display: flex;
gap: 1.125rem;
}
.sysItemListViewType label {
display: flex;
align-items: center;
gap: 0.25rem;
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
}
.sysItemListViewType input {
width: 1rem;
height: 1rem;
margin-top: -3px;
}
.category-title {
font-size: 1.875rem;
/* font-family: "Zen Old Mincho", serif; */
font-weight: 600;
color: #000;
line-height: 1.6;
letter-spacing: 0.05em;
}
.category-title br{
display: none;
}
.category-sub-title {
margin-top: 2.5rem;
}
.sysItemCategoryInfo {
margin-top: 47px;
margin-bottom: 43px;
}
.sysItemList ul.sysList li:first-child {
border: none;
padding-top: 0;
}
.sysItemList ul.sysList li:last-child {
border-bottom: none;
}
.sysRetailPrice {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
margin-top: auto;
padding-top: 0.8rem;
}
.itemDetailWrap {
height: 100% !important;
display: flex;
flex-direction: column;
}
.sysPagination {
margin-top: 3.75rem;
}
.sysPagination ul {
display: flex;
justify-content: center;
gap: 0.5rem;
}
.sysPagination ul li {
width: unset;
padding: 0;
display: inline-block;
}
.sysPagination a {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.35;
letter-spacing: 0.03em;
display: inline-block;
border: 1px solid #707070;
padding: 0.5rem 0.8125rem;
}
.sysPagination a.sysCurrent {
background-color: #000;
color: #fff;
}
#sysItemCategory #sysFooter {
margin-top: 6.375rem;
}
#sysItemDetail #sysFooter {
margin-top: 6.375rem;
}
#shopping-guide #sysFooter {
margin-top: 6.375rem;
}
#privacypolicy #sysFooter {
margin-top: 6.375rem;
}
#law #sysFooter {
margin-top: 6.375rem;
}
#sysMypagePoint #sysFooter {
margin-top: 6.375rem;
}
.sysItemList ul.sysList li .sysWishListButtonFormAjax form {
width: 100%;
}
.sysThumbnail .sysWishListButtonFormAjax form {
margin-top: 0.25rem;
}
.sysThumbnailImage img {
width: 100%;
aspect-ratio: 250 / 312;
}
.sysList li .itemDetailWrap {
margin-bottom: 1.5rem;
}
.sysThumbnail li .itemDetailWrap {
margin-bottom: 1.5rem;
}
.sysCategoryPankuzu br {
display: none;
}
.sysCategoryPankuzu span {
display: none;
}
.sysCategoryPankuzu {
font-size: 0.6875rem;
/* font-family: "Noto Sans JP", sans-serif; */
font-weight: 400;
color: #999999;
line-height: 1.3;
letter-spacing: 0.05em;
}
.sysItemName.sysDisplayMobileNone.sysDisplayTabletNone {
display: none;
}
.orderArea__block .sysItemName {
margin-top: 0;
}
.sysForm {
margin-top: 1.625rem;
}
#sysSelections {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
}
#sysSubmit {
margin-top: 1.125rem;
}
#sysWishlist {
margin-top: 0.6875rem;
}
#article-about {
margin-top: 2.625rem;
}
#sysExplanationPc p {
text-align: left;
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.8;
letter-spacing: 0.03em;
}
#orderArea .sysItemImages .sysImageList {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
gap: 6px;
margin-top: 1.0625rem;
}
.sysFuncMemberLogin .sysContent {
padding: 0;
}
.sysFuncMemberLogin .sysContent p {
display: none;
}
.sysFuncMemberLogin {
margin-top: 1.875rem;
}
.sysFuncText.logIn-button {
margin-top: 1.625rem;
}
.sysFuncMemberLogin ul {
display: inline-block;
width: 49%;
margin-left: 2%;
}
.sysFuncMemberLogin.log-in li:first-child {
display: none;
}
.sysFuncMemberLogin ul li a {
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
padding: 0.875rem 0;
text-align: center;
background-color: #dddddd;
display: inline-block;
width: 100%;
}
.logIn-button__submit {
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
padding: 0.875rem 0;
background-color: #cbb993;
color: #fff;
}
.logIn-button__forget {
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
padding: 0.875rem 0;
text-align: center;
background-color: #dddddd;
}
.sysFormItem .sysFormLabel {
font-size: 0.875rem;
font-weight: 500;
color: #000;
line-height: 1.3;
letter-spacing: 0.05em;
}
.s_guide .sysContent {
padding: 0;
}
.sysFuncText.s_guide.col2Style {
margin-top: 1.875rem;
}
#main_tradelaw dl.contentsWide {
flex-direction: column;
}
#main_tradelaw .contentsWide dt {
width: 100%;
}
#main_tradelaw .contentsWide dd {
width: 60%;
margin-left: 40%;
}
.col2Style .txtBlock p {
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
padding-right: 2.5rem;
margin-top: 1.25rem;
}
.col2Style .txtBlock p:first-of-type {
margin-top: 0;
}
.p-privacy.col2Style .txtBlock p {
padding-right: 0;
}
.accordion__title {
position: relative;
padding: 1rem;
cursor: pointer;
}
.accordion__title::before {
background-color: #000;
content: "";
height: 0.0625rem;
position: absolute;
right: 1rem;
top: 0.75rem;
width: 0.625rem;
}
.accordion__title::after {
background-color: #000;
content: "";
height: 0.0625rem;
position: absolute;
right: 1rem;
top: 0.75rem;
transform: rotate(180deg);
transition: 0.3s;
width: 0.625rem;
}
.accordion__title.active::after {
background-color: #000;
content: "";
height: 0.0625rem;
position: absolute;
right: 1rem;
top: 0.75rem;
transform: rotate(90deg);
transition: 0.3s;
width: 0.625rem;
}
.questions .pattern01.pattern01--question {
margin-top: 3.75rem;
}
#sysBasket .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageIndex .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysRegi .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageReminder .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
.sysOpcBody .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageEditMember .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageReview .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageWithdrawalConfirm .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageLogout .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysFormIndex .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageAshiato .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysBasket .button {
background-color: #fff;
border: solid 1px #9c793c;
border-radius: 1.5625rem;
box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.16);
color: #9c793c;
display: inline-block;
/* font-family: "Noto Sans JP", sans-serif; */
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.05em;
line-height: 1.3;
padding-bottom: 0.75rem;
padding-top: 0.5625rem;
position: relative;
text-align: center;
transition: 0.3s;
width: 16rem;
z-index: 0;
}
#sysBasket .button--faq {
width: 10rem;
}
#sysBasket #header {
padding: 0;
margin: 0;
}
label.sysFormLabel {
cursor: unset;
}
#sysMypageLogin .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMemberRegisterIndex .header__rightBlock-search input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
.sysOtherAddress {
margin-bottom: 3.75rem;
}
#sysMypageEditDelivery input#button2 {
width: 100%;
padding-top: 14px;
padding-bottom: 14px;
}
#sysMypageEditDelivery #sysMain input.sysButton {
padding-bottom: 14px;
padding-top: 14px;
width: 100%;
height: 50px;
}
.pcNav__item-block {
display: flex;
flex-direction: column;
justify-content: center;
height: inherit;
}
.pcNav__body {
display: none;
position: absolute;
top: 97%;
left: 0;
width: 100%;
z-index: 10;
}
.pcNav__body.active {
display: inline-block;
}
.pcNav-items {
display: flex;
flex-direction: column;
}
.pcNav-items__item {
background-color: #fff;
border-left: solid 1px #cbb993;
border-right: solid 1px #cbb993;
border-top: solid 1px #cbb993;
}
.pcNav-items__item:last-child {
border-bottom: solid 1px #dddddd;
}
.pcNav-items__link {
font-feature-settings: "palt";
-webkit-font-feature-settings: "palt";
-moz-font-feature-settings: "palt";
color: #cbb993;
display: block;
/* font-family: "Zen Old Mincho", serif; */
font-size: 0.875rem;
font-weight: 600;
letter-spacing: 0.01em;
line-height: 1.5;
padding-bottom: 0.625rem;
padding-top: 0.8125rem;
text-align: center;
}
.pcNav-items__link:hover {
background-color: rgba(221, 221, 221, 0.6);
}
#sysMypageAshiato .sysItemList ul.sysThumbnail li div {
display: flex;
flex-direction: column;
height: 100%;
margin-top: 1rem;
}
.sysItemList ul.sysThumbnail li div form {
padding-top: 1rem;
margin-top: auto;
}
.sysItemList ul.sysList li div form {
padding-top: 1rem;
margin-top: auto;
}
#sysMypageAshiato .sysItemList ul.sysThumbnail li div a {
margin-bottom: auto;
}
.sysFormItem.sysAcceptMailmagazine {
margin-bottom: 40px;
}
.sysWithdrawal form {
text-align: center;
margin-top: 40px;
}
.sysWithdrawal form:nth-of-type(2) {
margin-top: 0;
}
#sysMypageReview .sysMypageNav {
margin-top: 5rem;
}
#sysMypageIndex .sysMypageNav {
margin-top: 3.75rem;
}
#sysMypageReview .sysItemList ul.sysThumbnail li div:nth-child(2) {
display: flex;
flex-direction: column;
height: 100%;
margin-top: 1rem;
}
#sysMypageReview .sysItemList ul.sysThumbnail li div:nth-child(2) a {
margin-bottom: auto;
}
.sysWishlistMemberRegisterGroup {
padding: 10px;
}
.sysWishlistMemberRegisterGroup form {
margin-top: 10px;
}
.sysWishlistCloseBottomButtonGroup {
text-align: center;
}
.sysWishListButtonFormAjax button.sysButton {
font-size: 0.75rem;
font-weight: 500;
color: #777777;
line-height: 1.35;
letter-spacing: 0.03em;
background-color: #f1f1f1;
border-radius: 5px;
text-decoration: none;
width: 100%;
margin: 0;
}
.sysWishlistShowGroup form {
text-align: center;
}
.ranking-list .sysContent .sysIconRank {
margin-bottom: 10px;
}
#sysMypageAshiato .sysItemList ul.sysList li div:nth-child(2) {
margin-top: 1.5rem;
}
.header__search-sp {
background-color: #fff;
border: 1px solid #dddddd;
border-radius: 1.25rem;
height: 1.25rem;
margin-bottom: 0.25rem;
margin-left: auto;
margin-top: -1rem;
padding: 0.125rem 0.625rem;
position: relative;
width: 6.25rem;
}
.header__search-sp input[type="search"] {
font-size: 0.625rem;
vertical-align: top;
width: 100%;
height: 100%;
border: none;
padding: 0;
padding-left: 1.5rem;
margin-top: -1px;
}
.header__search-sp input[type="search"]:focus {
outline: 0;
}
.header__search-sp input[type="submit"] {
background-image: url(/img/assets/search-icon.png);
background-size: cover;
content: "";
cursor: pointer;
height: 0.625rem;
left: 0.875rem;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 0.625rem;
margin-top: 0;
}
#sysRegi .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageReminder .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageIndex .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageLogin .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageEditMember .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageReview .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageWithdrawalConfirm .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMypageLogout .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
margin-top: 0;
}
#sysMemberRegisterIndex .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysBasket .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
.sysOpcBody .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysFormIndex .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#sysMypageAshiato .header__search-sp input[type="submit"] {
background-image: url(../img/assets/search-icon.png);
}
#s_shipment p.larger {
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
.category-cards {
margin-top: 40px;
}
.category-cards .card__image img {
aspect-ratio: 250 /250;
}
.category-cards .card__body {
margin-top: unset;
}
#sysRegi #header {
margin: 0;
padding: 0;
}
.sysOpcBody #header {
margin: 0;
padding: 0;
}
#sysRegi .button {
color: #9c793c;
}
.sysOpcBody .button {
color: #9c793c;
}
.sysFormItem.sys_mailaddress {
margin-top: 40px;
}
.sysNextSubmitAreaForUseAmazon {
margin-bottom: 40px;
}
input.opcBillingAddress_completeButton_edit.opcCommonButtonEdit {
margin-bottom: 40px;
}
.sysOpcBody .opcPaymentMethod_edit {
margin-bottom: 10px;
}
div#amazonPayPaymentMethodLoginButton {
margin-top: 10px;
}
input.opcPaymentMethod_backButton_edit.opcCommonButtonEdit {
margin-top: 20px;
}
img#OffAmazonPaymentsWidgets1 {
width: 100% !important;
}
img#OffAmazonPaymentsWidgets0 {
width: 100% !important;
}
.opcRequestOrderArea {
margin-bottom: 20px;
}
input.opcDeliveryMethod_backButton_edit.opcCommonButtonEdit {
margin-top: 20px;
}
#upperAmazonPayButton,
#amazonPayTopLoginButton {
padding-left: 0;
}
#useAmazonSubmitButton {
text-align: center;
padding-right: 0;
}
.sysCart #sysMain input.sysAmazonNextSubmit {
margin-right: 0;
}
.sysFormItem.sysZipcode {
margin-bottom: 10px;
}
.sysFormItem.sysMemberPassword {
margin-top: 30px;
}
.sysMemberPasswordDescription {
margin-bottom: 20px;
}
.terms-wrapper {
font-size: 0.8rem;
font-weight: 500;
color: #000;
line-height: 2;
letter-spacing: 0.03em;
}
.sysItemList ul.sysThumbnail input.sysButton {
font-size: 0.75rem;
font-weight: 500;
line-height: 1.35;
letter-spacing: 0.03em;
}
.sysItemList ul.sysList li form input.sysButton {
font-size: 0.75rem;
font-weight: 500;
line-height: 1.35;
letter-spacing: 0.03em;
}
input.sysButton.sysWishlistMemberRegistButton {
font-size: 0.75rem;
font-weight: 500;
color: #fff;
line-height: 1.35;
letter-spacing: 0.03em;
}
input.mdl_dlg_submit.mdl-button.mdl-js-button.sysButton.sysWishlistLoginButton {
font-size: 0.75rem;
font-weight: 500;
color: #fff;
line-height: 1.35;
letter-spacing: 0.03em;
}
.sysFormItem.sys6 {
margin-top: 1.5rem;
}
.sysFuncCartInfo.cart-number {
width: 42px;
height: 42px;
border-radius: 21px;
background-repeat: no-repeat;
background-position: center center;
background-image: url(/img/assets/pict_cart--nega.svg);
background-color: #967a45;
background-size: 28px auto;
position: fixed;
right: 15px;
top: 36px;
transform: translateY(-50%);
z-index: 10000;
display: none;
}
.header__cart {
width: 42px;
height: 42px;
border-radius: 21px;
background-repeat: no-repeat;
background-position: center center;
background-image: url(/img/assets/pict_cart--nega.svg);
background-color: #967a45;
background-size: 28px auto;
position: fixed;
right: 15px;
top: 36px;
transform: translateY(-50%);
z-index: 10000;
display: flex;
align-items: center;
justify-content: center;
}
.sysCart .header__cart {
display: none;
}
dl.sysCartInfoItemCount dd {
display: flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
font-size: 0.625rem;
color: #fff;
border-radius: 50%;
background-color: #967a45;
border: 1px solid #ffffff;
position: absolute;
top: 0;
right: 0;
}
.header__cart__num {
display: flex;
align-items: center;
justify-content: center;
width: 15px;
height: 15px;
font-size: 0.625rem;
color: #fff;
border-radius: 50%;
background-color: #967a45;
border: 1px solid #ffffff;
position: absolute;
top: 0;
right: 0;
opacity: 0;
}
dl.sysCartInfoItemCount dt {
display: none;
}
/*20240321 追記*/
.sysIndicator {
display: none;
}
input[type="submit"] {
margin-top: 10px;
}
.sysWishListButtonFormAjax {
margin-top: 10px;
}
.sysItemList ul.sysThumbnail li form {
margin-top: 0.625rem;
}
.sysItemList .sysThumbnail li div:nth-child(2) {
display: flex;
flex-direction: column;
height: 100%;
margin-top: 1rem;
}
.sysItemList .sysThumbnail li div:nth-child(2) a {
margin-bottom: auto;
}
.news-block .sysContent nav {
margin-right: auto;
margin-left: auto;
width: calc(100% - 40px);
max-width: 940px;
}
.news-block .sysContent nav ul {
border-top: 1px solid #ede4d2;
border-bottom: 1px solid #ede4d2;
/* font-family: "Zen Old Mincho", serif; */
}
.news-block .sysContent nav li {
padding-top: 10px;
padding-bottom: 10px;
font-size: 0.875rem;
line-height: 1.5;
}
.news-block .sysContent nav li:not(:first-of-type) {
border-top: 1px solid #ede4d2;
}
.product-heading {
color: red;
}
.brackets {
font-size: inherit;
}
.brackets::before {
content: "（";
}
.brackets::after {
content: "）";
}
.note {
display: flex;
}
.note::before {
content: "※";
flex: 0 0 1em;
}
/* 採寸のしかた */
.measuring {
margin-right: auto;
margin-left: auto;
max-width: calc(100% - 40px);
}
.measuring .notes {
margin-top: 20px;
font-size: 0.875rem;
line-height: 1.5;
}
.measuring .sysHeadline,
.measuring .subsection__heading {
max-width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
border-radius: 6px;
font-size: 1.5rem;
font-weight: 700;
line-height: 2;
text-align: left;
color: #ffffff;
background: #cab993;
}
.measuring .sysHeadline {
margin: 0 !important;
}
.measuring .sysHeadline::before {
display: none;
}
.measuring .section__heading {
border-left: 6px solid #cab993;
padding-left: 10px;
font-weight: 400;
line-height: 2rem;
position: relative;
}
.measuring .section {
padding-bottom: 100px;
}
.measuring .section__heading::before {
content: "";
display: block;
width: 6px;
height: 6px;
background: #b80101;
position: absolute;
top: 0;
left: -6px;
}
.measuring .section__heading::after {
content: "";
display: block;
width: calc(100% + 6px);
height: 1px;
background: #cab993;
position: absolute;
left: -6px;
bottom: -2px;
}
.measuring .section p:first-of-type {
margin-top: 0;
}
.measuring .subsection {
margin-top: 50px;
}
.measuring .subsection__heading {
margin-bottom: 30px;
}
.measuring .body {
display: flex;
border: 1px solid #cab993;
border-radius: 6px;
padding-bottom: 30px;
background: #fdfcf6;
}
.measuring .body .subsection__heading {
order: 1;
}
.measuring .body .text {
order: 3;
}
.measuring .body .figure {
order: 2;
max-width: 269px;
}
.measuring .body dl {
margin-top: 30px;
}
.measuring .body dt {
padding-bottom: 5px;
border-bottom: 2px solid #cab993;
line-height: 1.45;
font-weight: 500;
}
.measuring .body dd {
margin-top: 15px;
line-height: 1.5;
}
.measuring .kimono {
padding-bottom: 50px;
}
.measuring .price__table {
width: 100%;
border-top: 2px solid #999999;
border-right: 2px solid #999999;
border-left: 2px solid #999999;
border-collapse: collapse;
line-height: 1.5;
text-align: center;
vertical-align: middle;
}
.measuring .price__table .name {
width: 60%;
}
.measuring .price__table .excldTax,
.measuring .price__table .incldTax {
width: 20%;
}
.measuring .price__table th,
.measuring .price__table td {
padding-top: 7px;
padding-right: 3px;
padding-bottom: 7px;
padding-left: 3px;
}
.measuring .price__table th,
.measuring .price__table td {
border: 1px solid #999999;
}
.measuring .price__table th {
font-weight: 400;
}
.measuring .price__table thead th {
border-bottom-width: 2px;
background: #f5f5f5;
}
.measuring .price__table thead th:first-child,
.measuring .price__table .part,
.measuring .price__table tbody th:last-of-type {
border-right-width: 2px;
}
.measuring .price__table tbody {
border-bottom: 2px solid #999999;
}
.measuring .price__table tbody:first-of-type .part {
background: #ffe3d6;
}
.measuring .price__table tbody:last-of-type .part {
background: #fff6e2;
}
.measuring .price__table td:nth-last-of-type(-n + 2) {
text-align: right;
white-space: nowrap;
}
/* お仕立て・加工料金価格表 */
.price {
margin-right: auto;
margin-left: auto;
max-width: calc(100% - 40px);
}
.price .notes {
margin-top: 20px;
font-size: 0.875rem;
line-height: 1.5;
}
.price .sysHeadline,
.price .subsection__heading {
max-width: 100%;
display: flex;
align-items: center;
padding-left: 20px;
border-radius: 6px;
font-size: 1.5rem;
font-weight: 700;
line-height: 2;
text-align: left;
color: #ffffff;
background: #cab993;
}
.price .sysHeadline {
margin: 0 !important;
}
.price .sysHeadline::before {
display: none;
}
.price .section__heading {
border-left: 6px solid #cab993;
padding-left: 10px;
font-weight: 400;
line-height: 2rem;
position: relative;
}
.price .section {
padding-bottom: 100px;
}
.price .section__heading::before {
content: "";
display: block;
width: 6px;
height: 6px;
background: #b80101;
position: absolute;
top: 0;
left: -6px;
}
.price .section__heading::after {
content: "";
display: block;
width: calc(100% + 6px);
height: 1px;
background: #cab993;
position: absolute;
left: -6px;
bottom: -2px;
}
.price .section p:first-of-type {
margin-top: 0;
}
.price .subsection {
margin-top: 50px;
}
.price .subsection__heading {
margin-bottom: 30px;
}
.price .body {
display: flex;
border: 1px solid #cab993;
border-radius: 6px;
padding-bottom: 30px;
background: #fdfcf6;
}
.price .body .subsection__heading {
order: 1;
}
.price .body .text {
order: 3;
}
.price .body .figure {
order: 2;
max-width: 269px;
}
.price .body dl {
margin-top: 30px;
}
.price .body dt {
padding-bottom: 5px;
border-bottom: 2px solid #cab993;
line-height: 1.45;
font-weight: 500;
}
.price .body dd {
margin-top: 15px;
line-height: 1.5;
}
.price .kimono {
padding-bottom: 50px;
}
.price .price__table {
margin-top: 30px;
width: 100%;
border-top: 2px solid #999999;
border-right: 2px solid #999999;
border-left: 2px solid #999999;
border-collapse: collapse;
line-height: 1.5;
text-align: center;
vertical-align: middle;
}
.price .price__table .name {
width: 60%;
}
.price .price__table .excldTax,
.price .price__table .incldTax {
width: 20%;
}
.price .price__table th,
.price .price__table td {
padding-top: 7px;
padding-right: 3px;
padding-bottom: 7px;
padding-left: 3px;
}
.price .price__table th,
.price .price__table td {
border: 1px solid #999999;
}
.price .price__table th {
font-weight: 400;
}
.price .price__table thead th {
border-bottom-width: 2px;
background: #f5f5f5;
}
.price .price__table thead th:first-child,
.price .price__table .part,
.price .price__table tbody th:last-of-type {
border-right-width: 2px;
}
.price .price__table tbody {
border-bottom: 2px solid #999999;
}
.price .price__table tbody:first-of-type .part {
background: #ffe3d6;
}
.price .price__table tbody:last-of-type .part {
background: #fff6e2;
}
.price .price__table td:nth-last-of-type(-n + 2) {
text-align: right;
white-space: nowrap;
}
.is-fixed {
position: fixed;
}
/*20250305_商品詳細ページの闇市価格の文言を変える*/
.sysYamiPriceName {
margin-top: 0.5rem;
display:block;
font-size: 0;
color: #cc0000;
}
.sysYamiPriceName:before {
font-size: 1rem;
content: "→スタジオアリス紹介価格：\A";
white-space:pre;
}
.sysYamiPriceValue {
color: #cc0000;
font-size: 1.125rem;
}
.sysYamiForm{
display: flex;
flex-wrap: wrap;
}
.sysYamiForm div:first-of-type{
flex: 0 0 100%;
}
.sysYamiForm div:nth-of-type(2){
flex: 1;
margin-top: 5px;
}
.sysYamiForm div:nth-of-type(3){
flex: 0 0 4em;
max-width: 4em;
margin-top: 5px;
margin-left: 5px;
}
input[name="yamiPassword"]{
font-size: 16px;
padding-right: .5em;
padding-left: .5em;
height: 2.5em;
display: flex;
align-item-center;
}
.sysYamiForm div:nth-of-type(3) input[type="submit"]{
margin-top: 0;
font-size: 16px;
height: 2.5em;
display: flex:
align-item: center;
justify-content: center;
text-align: center;
letter-spacing: .2em;
width:100%;
height: 100%;
border-radius: 4px;
background-color: #9c793c;
color: #fff;
transition: background-color .6s;
}
.sysYamiForm div:nth-of-type(3) input[type="submit"]:hover{
background-color:#cbb993;}
.sysFuncBanner.feature{
margin-right: auto;
margin-left: auto
}
.sysFuncBanner.feature li{
margin-bottom:0;
display: block;
}
.sysFuncBanner.feature a{
display: block;
}
@media screen and (max-width:767px){
#sysWrap{
overflow: hidden;
}
#sysMain,
#sysAside {
width: 100% !important;
}
#sysItemCategory #sysWrap {
padding-top: 1.5rem;
border-top: 1px solid #cbb993;
}
#sysItemDetail #sysWrap {
padding-top: 1.5rem;
border-top: 1px solid #cbb993;
}
#shopping-guide #sysWrap {
margin-top: 3.75rem;
}
#corporate #sysWrap {
margin-top: 3.75rem;
}
#sysInformation #sysWrap {
margin-top: 3.75rem;
}
#law #sysWrap {
margin-top: 3.75rem;
}
#privacypolicy #sysWrap {
margin-top: 3.75rem;
}
#questions #sysWrap {
margin-top: 3.75rem;
}
#sysMypageLogin #sysWrap {
margin-top: 0;
}
#sysMemberRegisterIndex #sysWrap {
margin-top: 3.75rem;
}
#sysMypageEditDelivery #sysWrap {
margin-top: 3.75rem;
}
#sysMypagePoint #sysWrap {
margin-top: 3.75rem;
}
#sysMypageIndex #sysWrap {
margin-top: 3.75rem;
}
#sysItemSearch #sysWrap {
margin-top: 3.75rem;
}
#sysMypageEditMember #sysWrap {
margin-top: 3.75rem;
}
#sysMypageReview #sysWrap {
margin-top: 3.75rem;
}
#sysMypageWithdrawalConfirm #sysWrap {
margin-top: 3.75rem;
}
#sysMypageLogout #sysWrap {
margin-top: 3.75rem;
}
#terms #sysWrap {
margin-top: 3.75rem;
}
#sysRegi #sysWrap {
margin-top: 3.75rem;
}
#sysMypageReminder #sysWrap {
margin-top: 3.75rem;
}
#sysBasket #sysWrap {
margin-top: 3.75rem;
}
.sysOpcBody #sysWrap {
margin-top: 3.75rem;
}
#sysFormIndex #sysWrap {
margin-top: 3.75rem;
}
#sysItemCategory #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysItemDetail #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysItemSearch #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#shopping-guide #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#corporate #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#law #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#privacypolicy #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#questions #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#terms #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 2.5rem 1.25rem;
float: unset;
border: 1px solid #cbb993;
border-radius: 5px;
background-color: #f4f5f7;
}
#log-in #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysBasket #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysInformation #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysMemberRegisterIndex #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
}
#sysMypageLogin #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-bottom: 40px;
}
#sysMypageLogin #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-bottom: 40px;
}
#sysMypageEditDelivery #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypagePoint #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageIndex #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageAshiato #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageEditMember #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageReview #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageWithdrawalConfirm #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageLogout #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysRegi #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysMypageReminder #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
.sysOpcBody #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
#sysFormIndex #sysMain {
max-width: 640px;
margin: 0 auto;
padding: 0 1.25rem;
float: unset;
padding-top: 40px;
padding-bottom: 40px;
}
.sysHorizontal {
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 2.5rem;
column-gap: 1.25rem;
}
.header_wrap {
height: 114px !important;
background-color: #fdfcf7;
}
.header {
display: flex;
flex-direction: column;
height: auto;
position: fixed;
top: 0;
left: 0;
}
.header.active {
height: 100vh;
height: 100dvh;
}
.header__title {
order: 2;
flex: 0 0 42px;
height: 42px;
padding-right: 20px;
padding-left: 20px;
display: flex;
align-items: center;
}
.header .logo {
order: 1;
flex: 0 0 72px;
height: 72px;
display: flex;
align-items: center;
justify-content: center;
background: #ffffff;
}
.header .logo img {
max-height: 52px;
width: auto;
}
.header__nav {
order: 3;
color: #967a45;
background: #ffffff;
flex: 1;
position: relative;
}
.globalNav {
display: grid;
grid-template-rows: 0fr;
opacity: 0;
overflow: auto;
height: 100%;
}
.active .globalNav {
/* display: block; */
grid-template-rows: 1fr;
opacity: 1;
transition: opacity 0.5s ease-in-out, grid-template-rows 0.5s ease-in-out;
}
.globalNav ul {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-around;
height: 100%;
}
.globalNav a {
display: flex;
align-items: center;
justify-content: center;
line-height: 0;
pointer-events: none;
}
.active .globalNav a {
line-height: 1.5;
pointer-events: auto;
}
.globalNav .submenu {
display: none;
}
.header__search {
width: calc(100% - 13.8125rem - 20px - 20px); /*タイトル1.0625rem*13文字+ 右余白20px + 左余白20px*/
position: absolute;
top: -21px;
right: 20px;
transform: translateY(-50%);
}
.header__search input[type="search"] {
height: 26px;
border-radius: 13px;
}
.header__utility {
order: 4;
flex: 0 0 auto;
display: grid;
grid-template-rows: 0fr 0fr;
align-items: center;
color: #967a45;
background: #ffffff;
opacity: 0;
/* transition: opacity 0.3s ease-in-out, grid-template-rows 0.3s ease-in-out; */
}
.active .header__utility {
opacity: 1;
grid-template-rows: auto auto;
padding-bottom: 20px;
}
.header__utility .utilityNav {
width: 100%;
}
.header__utility .utilityNav ul {
font-size: 0.75rem;
}
.active .header__utility .utilityNav ul {
margin-right: 20px;
margin-left: 20px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
row-gap: 10px;
column-gap: 20px;
}
.header__utility .utilityNav li{
flex: 0 0 calc((100% - 20px) / 2);
}
.header__utility .info {
align-items: center;
justify-content: center;
}
.header__utility .tel,
.header__utility .businessHours {
line-height: 0;
}
.active .header__utility .tel,
.active .header__utility .businessHours {
line-height: 1.5;
}
.active .header__utility .tel {
margin-top: 20px;
}
.header__utility .businessHours {
justify-content: center;
}
.header__utility a {
display: block;
line-height: 0;
pointer-events: none;
}
.active .header__utility a {
line-height: 1.5;
pointer-events: auto;
}
.active .header__utility .utilityNav a{
display: flex;
align-items: center;
line-height: 2;
}
.footer__rightTop {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
gap: 1.125rem;
}
.sysItemList ul.sysThumbnail {
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 2.5rem;
column-gap: 1.25rem;
}
.sysItemList ul.sysThumbnail:after {
display: none;
}
.sysItemList ul.sysList {
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 2.5rem;
column-gap: 1.25rem;
}
.sysItemList ul.sysList li {
display: flex;
flex-direction: column;
padding: 0;
}
.sysItemList ul.sysList li .sysThumbnailImage {
width: 100%;
max-width: 100%;
margin-right: 0;
}
.sysItemList ul.sysList li form {
display: inline-block;
width: 100%;
}
.sysItemList ul.sysList li .sysWishListButtonFormAjax {
display: inline-block;
width: 100%;
margin-top: 0.625rem;
}
.sysItemList ul.sysThumbnail li .sysWishListButtonFormAjax {
display: inline-block;
width: 100%;
margin-top: 0.625rem;
}
#orderArea {
margin-top: 2.5rem;
}
#orderArea__block {
margin-top: 2.5rem;
}
#sysExplanationMobile p {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.8;
letter-spacing: 0.03em;
}
#sysDescription p {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.8;
letter-spacing: 0.03em;
text-align: center;
}
.logIn-button .sysContent {
padding: 0;
display: flex;
gap: 10px;
flex-direction: column;
}
#log-in #sysWrap {
margin-top: 5rem;
}
#log-in #sysFooter {
margin-top: 5rem;
}
#corporate #sysFooter {
margin-top: 5rem;
}
#sysMemberRegisterIndex #sysFooter {
margin-top: 5rem;
}
#sysMypageLogin #sysFooter {
margin-top: 5rem;
}
#sysMypageEditDelivery #sysFooter {
margin-top: 5rem;
}
#sysMypageIndex #sysFooter {
margin-top: 5rem;
}
#sysBasket #sysFooter {
margin-top: 5rem;
}
#sysRegi #sysFooter {
margin-top: 5rem;
}
.sysOpcBody #sysFooter {
margin-top: 5rem;
}
#sysMypageEditMember #sysFooter {
margin-top: 5rem;
}
#sysMypageLogout #sysFooter {
margin-top: 5rem;
}
#sysMypageReminder #sysFooter {
margin-top: 5rem;
}
#sysMypageReview #sysFooter {
margin-top: 5rem;
}
#terms #sysFooter {
margin-top: 5rem;
}
#questions #sysFooter {
margin-top: 5rem;
}
#sysFormIndex #sysFooter {
margin-top: 5rem;
}
#sysMypageWithdrawalConfirm #sysFooter {
margin-top: 5rem;
}
.p-corporate.col2Style {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 20px;
padding-bottom: 2.875rem;
padding-left: 20px;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.p-law {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 0.625rem;
padding-bottom: 2.875rem;
padding-left: 0.625rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.p-privacy.col2Style {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 20px;
padding-bottom: 2.875rem;
padding-left: 20px;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.questions.col2Style {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 20px;
padding-bottom: 2.875rem;
padding-left: 20px;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.terms-of-use {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 20px;
padding-bottom: 2.875rem;
padding-left: 20px;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
#main_tradelaw dt,
.main_tradelaw dt {
padding: 1rem;
}
.sysTitle span,
.sysHeadline span {
position: relative;
z-index: 2;
display: inline-block;
padding: 20px;
background-color: #fff;
text-align: center;
}
#sysMemberRegisterIndex .sysNextSubmit {
width: 100%;
margin-right: 2%;
border-radius: 5px;
height: 50px;
font-size: 15px;
margin-top: 20px;
}
#sysMemberRegisterIndex .sysButton[type="submit"] {
width: 100%;
margin-right: 0;
border-radius: 5px;
height: 50px;
font-size: 15px;
margin-top: 0;
margin-bottom: 0;
}
#sysMypageLogin .sysLoginButton {
width: 100%;
margin-right: 0;
padding: 14px 0;
font-size: 15px;
margin-top: 1.625rem;
}
#sysMypageLogin .sysButton {
width: 100%;
margin-left: 0;
font-size: 15px;
margin-top: 1.625rem;
border-radius: 0;
margin-bottom: 0;
padding: 14px 0;
}
.sysMypageNav > form {
width: 100%;
}
.sysWithdrawal form input {
width: 100%;
}
.mv__block-text {
font-size: 0.75rem;
}
.sysExplanation {
text-align: left;
}
.sysPr.sysDisplayKeitaiNone {
text-align: center;
}
.category-cards.cards {
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 2.5rem;
column-gap: 1.25rem;
}
.sysFuncText.terms-block.sysDisplayKeitaiNone {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 1.25rem;
padding-bottom: 2.875rem;
padding-left: 1.25rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysItemList .sysList li div:nth-child(2) {
display: flex;
flex-direction: column;
height: 100%;
margin-top: 1rem;
}
.sysItemList .sysList li div:nth-child(2) a {
margin-bottom: auto;
}
.modaal-container .modaal-content-container {
padding: 1.25rem;
}
.modaal-container {
padding: 1.25rem;
}
.sysWishlistMemberRegisterGroup {
width: 100%;
}
.sysFormField label {
margin-right: 20px;
font-size: 15px;
display: block;
margin-top: 0.5rem;
}
.header {
background: #967a45;
color: #ffffff;
}
.header__title {
font-size: 1.0625rem;
color: #ffffff;
}
.section-header {
padding-top: 25px;
padding-bottom: 30px;
}
.section-header__sub-title {
padding-bottom: 0;
}
.section-header__sub-title::before {
display: none;
}
.category-items {
display: flex;
flex-direction: column;
row-gap: 40px;
}
.category-item {
border-radius: 20px;
aspect-ratio: 373 / 264;
}
.category-item:nth-of-type(even) {
transform: translateX(-40px);
}
.category-item:nth-of-type(odd) {
transform: translateX(40px);
}
.category-item__image {
aspect-ratio: 373 / 264;
}
.category-item__title span{
padding: 10px 8px 10px 5px;
font-size: 1.25rem;
}
.category-item:nth-of-type(1) .category-item__title {
left: 40px;
}
.category-item:nth-of-type(2) .category-item__title {
left: 80px;
}
.category-item:nth-of-type(3) .category-item__title {
left: 60px;
}
.category-item:nth-of-type(4) .category-item__title {
right: 40px;
}
.category-title{
font-size: 6vw;
}
.category-title br{
display: inline;
}
/* 採寸のしかた */
.measuring {
margin-top: 18px;
max-width: calc(100% - 40px);
}
.measuring .section {
margin-top: 26px;
}
.measuring .section__heading {
margin-bottom: 15px;
font-size: 1.375rem;
}
.measuring .section p {
font-size: 1rem;
line-height: 1.5;
}
.measuring .section p:not(:first-of-type) {
margin-top: 1.5rem;
}
.measuring .section > .notes {
margin-top: 30px;
}
.measuring .body {
flex-direction: column;
padding-right: 20px;
padding-left: 20px;
}
.measuring .body .subsection__heading {
margin-top: -1px;
margin-right: -21px;
margin-left: -21px;
width: calc(100% + 42px);
max-width: calc(100% + 42px);
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
/* .measuring .body .figure {
margin-left: auto;
width: 86%;
}*/
.measuring .body .text {
flex: 1;
}
.measuring .body dt {
font-size: 1.375rem;
}
.measuring .body dd {
font-size: 1rem;
}
.measuring .kimono .figure img:not(:first-child) {
margin-top: 30px;
}
.measuring .price__table {
font-size: 0.75rem;
}
.measuring .price__table thead th:first-child {
width: 60%;
}
.measuring .price__table thead th:not(:first-child) {
width: 20%;
}
.measuring .price__table thead .brackets {
display: inline-block;
}
.measuring .price__table th:nth-of-type(n + 3) {
white-space: nowrap;
}
/* お仕立て・加工料金価格表 */
.price {
margin-top: 18px;
max-width: calc(100% - 40px);
}
.price .section {
margin-top: 26px;
}
.price .section__heading {
margin-bottom: 15px;
font-size: 1.375rem;
}
.price .section p {
font-size: 1rem;
line-height: 1.5;
}
.price .section p:not(:first-of-type) {
margin-top: 1.5rem;
}
.price .section > .notes {
margin-top: 30px;
}
.price .body {
flex-direction: column;
padding-right: 20px;
padding-left: 20px;
}
.price .body .subsection__heading {
margin-top: -1px;
margin-right: -21px;
margin-left: -21px;
width: calc(100% + 42px);
max-width: calc(100% + 42px);
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.price .body .text {
flex: 1;
}
.price .body dt {
font-size: 1.375rem;
}
.price .body dd {
font-size: 1rem;
}
.price .kimono .figure img:not(:first-child) {
margin-top: 30px;
}
.price .price__table {
font-size: 0.75rem;
}
.price .price__table thead th:first-child {
width: 60%;
}
.price .price__table thead th:not(:first-child) {
width: 20%;
}
.price .price__table thead .brackets {
display: inline-block;
}
.price .price__table th:nth-of-type(n + 3) {
white-space: nowrap;
}
/* .opcItem_deliveryAddressItemGroup,
.opcItem_deliveryAddressItemGroup_edit {
margin-right: -3%;
margin-left: -3%;
padding-left: 0;
padding-right: 0;
} */
.opcItem_itemCommonOptionOptionGroup_edit {
flex-direction: column;
}
.sysFuncBanner.feature{
margin-top: 20px;
margin-bottom: 20px;
width: 100%;
max-width: calc(100% - 40px);
}
.sysFuncBanner.feature li:nth-child(1){
display:none;
}
}
@media screen and (min-width:768px) and (max-width:768px){
/* #sysHeader {
height: 8.125rem;
} */
#sysItemCategory #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#sysItemCategory #sysAside {
width: calc(250 / 1100 * 100%);
}
#sysItemCategory #sysMain {
width: calc(798 / 1100 * 100%);
padding-top: 1.1rem;
border-top: 1px solid #cbb993;
}
.sysHorizontal {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 1.75rem;
}
.header_wrap {
height: calc(4.40625rem + 76px);/* margin: 8px, 10px, 8px; nav: 50px; logo&info: 4.40625rem */
min-height: 135.99px; /* margin: 8px, 8px; nav: 50px; logo&info: 69.99px */
background-color: #fdfcf7;
}
#header {
margin: 0 auto;
padding-top: 8px;
display: grid;
grid-template-columns: 40px auto 1fr auto 40px;
grid-template-rows: auto auto;
align-items: center;
justify-content: space-between;
position: fixed;
top: 0;
left: 0;
}
.header__title {
font-size: 1.25rem;
font-weight: 700;
color: #967a45;
grid-area: 1/2/2/3;
}
.logo {
grid-area: 1/3/2/4;
display: flex;
align-items: center;
justify-content: center;
}
.logo img {
width: auto;
max-height: 70px;
}
.header__nav {
grid-area: 2/1/3/6;
margin-top: 8px;
padding-right: 40px;
padding-left: 40px;
display: flex;
align-items: center;
justify-content: space-between;
height: 50px;
background: #967a45;
}
.globalNav {
height: 50px;
position: relative;
z-index: 1000;
}
.globalNav ul {
height: 50px;
display: flex;
align-items: center;
justify-content: space-between;
color: #ffffff;
}
.globalNav li {
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.globalNav > ul > li > a {
border-right: 1px solid #e2c88c;
padding-right: 20px;
padding-left: 20px;
}
.globalNav > ul > li:first-of-type > a {
border-left: 1px solid #e2c88c;
}
.globalNav .submenu {
width: fit-content;
height: auto;
display: flex;
flex-direction: column;
position: absolute;
top: 100%;
left: 0;
padding-top: 13px;
grid-template-rows: 0fr;
transition: grid-template-rows 0.5s ease-in-out;
}
.globalNav .submenu.active {
grid-template-rows: 1fr;
}
.globalNav .submenu li {
width: 100%;
background: #ffffff;
}
.globalNav .submenu a {
display: grid;
width: 100%;
justify-content: start;
text-align: left;
grid-template-rows: 0fr;
padding-right: 20px;
padding-left: 20px;
line-height: 0;
white-space: nowrap;
transition: grid-template-rows 0.5s ease-in-out;
overflow: hidden;
color: #967a45;
}
.globalNav .submenu.active a {
grid-template-rows: 1fr;
line-height: 3;
border-right: 1px solid #967a45;
border-bottom: 1px solid #967a45;
border-left: 1px solid #967a45;
transition: opacity 0.5s;
}
.globalNav .submenu.active a:hover {
opacity: 1;
color: rgba(150, 122, 69, 0.5);
}
.header__search {
flex: 1;
margin-right: 62px;
margin-left: 20px;
position: relative;
}
.header__search input[type="search"] {
height: 30px;
border-radius: 15px;
}
.header__utility {
grid-area: 1/4/2/5;
align-items: flex-end;
}
.header__utility .utilityNav {
order: 2;
margin-top: 10px;
}
.header__utility .utilityNav ul {
display: flex;
justify-content: flex-end;
font-size: 0.75rem;
}
.header__utility .utilityNav li {
margin-left: 15px;
}
.header__utility .info {
order: 1;
align-items: flex-end;
}
.sysFuncCartInfo.cart-number {
background-color: #ffffff;
background-image: url(/img/assets/pict_cart.svg);
background-size: 28px auto;
right: 40px;
position: fixed;
transform: translateY(-50%);
}
.header__cart {
background-color: #ffffff;
background-image: url(/img/assets/pict_cart.svg);
background-size: 28px auto;
top:auto;
right: 40px;
bottom: 4px;
position: absolute;
transform: none;
}
.footer__rightTop {
display: flex;
align-items: center;
flex-direction: row;
gap: 1.125rem;
}
.section-header {
padding-top: 52px;
padding-bottom: 38px;
}
.category-items {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 20px;
}
.category-item {
aspect-ratio: 240/200;
overflow: hidden;
border-radius: 12px;
}
/*.category-item:nth-of-type(even) {
margin-top: 20px;
}*/
.category-item__image {
aspect-ratio: 240 / 200;
}
.category-item__title span {
padding: 6px 7px 6px 4px;
font-size: .875rem;
}
.category-item:nth-of-type(1) .category-item__title {
left: 22px;
}
.category-item:nth-of-type(2) .category-item__title {
left: 20px;
}
.category-item:nth-of-type(3) .category-item__title {
left: 28px;
}
.category-item:nth-of-type(4) .category-item__title {
right: 20px;
}
.mv{
margin-top: 30px;
}
.sysFuncItemBlock.new,
.recommend-list,
.ranking-list {
padding-bottom: 50px;
}
/* 採寸のしかた */
.measuring {
margin-top: 24px;
width: calc(100% - 40px);
max-width: 840px;
}
.measuring .section {
margin-top: 30px;
}
.measuring .section__heading {
margin-bottom: 20px;
font-size: 1.25rem;
}
.measuring .section p {
font-size: 0.875rem;
line-height: 1.4285714;
}
.measuring .section p:not(:first-of-type) {
margin-top: 1.4285714rem;
}
.measuring .section > .notes {
font-size: 0.75rem;
}
.measuring .body {
flex-wrap: wrap;
justify-content: space-between;
column-gap: 28px;
padding-top: 30px;
padding-right: 30px;
padding-left: 30px;
}
.measuring .body .subsection__heading {
flex: 0 0 100%;
}
.measuring .body .figure {
flex: 0 0 34.5%;
}
.measuring .body .text {
flex: 1;
}
.measuring .body dt {
font-size: 1.25rem;
}
.measuring .body dd {
font-size: 0.875rem;
}
.measuring .kimono .figure {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 14px;
}
.measuring .kimono .figure img {
flex: 0 0 calc(50% - 7px);
max-width: calc(50% - 7px);
}
.measuring .price__table {
font-size: 1.125rem;
}
/* お仕立て・加工料金価格表 */
.price {
margin-top: 24px;
width: calc(100% - 40px);
max-width: 840px;
}
.price .section {
margin-top: 30px;
}
.price .section__heading {
margin-bottom: 20px;
font-size: 1.25rem;
}
.price .section p {
font-size: 0.875rem;
line-height: 1.4285714;
}
.price .section p:not(:first-of-type) {
margin-top: 1.4285714rem;
}
.price .section > .notes {
font-size: 0.75rem;
}
.price .body {
flex-wrap: wrap;
justify-content: space-between;
column-gap: 28px;
padding-top: 30px;
padding-right: 30px;
padding-left: 30px;
}
.price .body .subsection__heading {
flex: 0 0 100%;
}
.price .body .figure {
flex: 0 0 34.5%;
}
.price .body .text {
flex: 1;
}
.price .body dt {
font-size: 1.25rem;
}
.price .body dd {
font-size: 0.875rem;
}
.price .kimono .figure {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 14px;
}
.price .kimono .figure img {
flex: 0 0 calc(50% - 7px);
max-width: calc(50% - 7px);
}
.price .price__table {
font-size: 1.125rem;
}
.opcItem_itemCommonOptionOptionGroup_edit {
gap: 20px;
}
.d-sp {
display: none !important;
}
.sysFuncBanner.feature{
margin-top: 30px;
margin-bottom: 30px;
width: calc(100% - 60px);
max-width: 940px;
}
.sysFuncBanner.feature li:nth-child(2){
display:none;
}
}
@media screen and (min-width:769px){
/* #sysHeader {
height: 8.125rem;
} */
#sysItemCategory #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#sysItemDetail #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#shopping-guide #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#corporate #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#law #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#privacypolicy #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#questions #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#sysInformation #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#terms #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#sysMypageLogin #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageEditDelivery #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMemberRegisterIndex #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypagePoint #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageAshiato #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageEditMember #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageReview #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageWithdrawalConfirm #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageLogout #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageIndex #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysRegi #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysMypageReminder #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
.sysOpcBody #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysFormIndex #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
}
#sysItemSearch #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
width: 100%;
display: flex;
flex-direction: row-reverse;
gap: calc(52 / 1100 * 100%);
}
#sysItemCategory #sysMain {
width: calc(798 / 1100 * 100%);
padding-top: 1.1rem;
border-top: 1px solid #cbb993;
}
#sysItemCategory #sysAside {
width: calc(250 / 1100 * 100%);
}
#sysItemDetail #sysMain {
width: calc(798 / 1100 * 100%);
padding-top: 1.1rem;
border-top: 1px solid #cbb993;
}
#sysItemDetail #sysAside {
width: calc(250 / 1100 * 100%);
}
#shopping-guide #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#shopping-guide #sysAside {
width: calc(250 / 1100 * 100%);
}
#corporate #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#corporate #sysAside {
width: calc(250 / 1100 * 100%);
}
#law #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#law #sysAside {
width: calc(250 / 1100 * 100%);
}
#privacypolicy #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#privacypolicy #sysAside {
width: calc(250 / 1100 * 100%);
}
#terms #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#terms #sysAside {
width: calc(250 / 1100 * 100%);
}
#questions #sysMain {
width: calc(798 / 1100 * 100%);
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
background-color: #f4f5f7;
}
#questions #sysAside {
width: calc(250 / 1100 * 100%);
}
#sysInformation #sysMain {
width: calc(798 / 1100 * 100%);
padding-top: 1.1rem;
border-top: 1px solid #cbb993;
}
#sysInformation #sysAside {
width: calc(250 / 1100 * 100%);
}
#sysMypageLogin #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
.sysOpcBody #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMemberRegisterIndex #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageEditDelivery #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypagePoint #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageIndex #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageAshiato #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageEditMember #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageReview #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageWithdrawalConfirm #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageLogout #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysRegi #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysMypageReminder #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysBasket #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysFormIndex #sysMain {
width: 100%;
border: 1px solid #cbb993;
border-radius: 5px;
padding-right: 2.625rem;
padding-left: 2.625rem;
padding-top: 4.625rem;
padding-bottom: 2.375rem;
margin: 0;
}
#sysItemSearch #sysMain {
width: calc(798 / 1100 * 100%);
padding-top: 1.1rem;
border-top: 1px solid #cbb993;
}
#sysItemSearch #sysAside {
width: calc(250 / 1100 * 100%);
}
.sysHorizontal {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 1.75rem;
}
.header_wrap {
height: calc(4.40625rem + 76px);/* margin: 8px, 10px, 8px; nav: 50px; logo&info: 4.40625rem */
min-height: 135.99px; /* margin: 8px, 8px; nav: 50px; logo&info: 69.99px */
background-color: #fdfcf7;
}
#header {
margin: 0 auto;
padding-top: 8px;
display: grid;
grid-template-columns: 40px auto 1fr auto 40px;
grid-template-rows: auto auto;
align-items: center;
justify-content: space-between;
position: fixed;
top: 0;
left: 0;
}
@media screen and (min-width: 1198px) {
#header {
grid-template-columns: calc((100vw - 1118px) / 2) auto 1fr auto calc((100vw - 1118px) / 2);
}
}
.header__title {
font-size: 1.25rem;
font-weight: 700;
color: #967a45;
grid-area: 1/2/2/3;
}
.logo {
grid-area: 1/3/2/4;
display: flex;
align-items: center;
justify-content: center;
}
.logo img {
width: auto;
max-height: 70px;
}
.header__nav {
grid-area: 2/1/3/6;
margin-top: 8px;
padding-right: 40px;
padding-left: 40px;
display: flex;
align-items: center;
justify-content: space-between;
height: 50px;
background: #967a45;
}
@media screen and (min-width: 1198px) {
.header__nav {
padding-right: calc((100vw - 1118px) / 2);
padding-left: calc((100vw - 1118px) / 2);
}
}
.globalNav {
height: 50px;
position: relative;
z-index: 1000;
}
.globalNav ul {
height: 50px;
display: flex;
align-items: center;
justify-content: space-between;
color: #ffffff;
}
.globalNav li {
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.globalNav > ul > li > a {
border-right: 1px solid #e2c88c;
padding-right: 20px;
padding-left: 20px;
}
.globalNav > ul > li:first-of-type > a {
border-left: 1px solid #e2c88c;
}
.globalNav .submenu {
width: fit-content;
height: auto;
display: flex;
flex-direction: column;
position: absolute;
top: 100%;
left: 0;
padding-top: 13px;
grid-template-rows: 0fr;
transition: grid-template-rows 0.5s ease-in-out;
}
.globalNav .submenu.active {
grid-template-rows: 1fr;
}
.globalNav .submenu li {
width: 100%;
background: #ffffff;
}
.globalNav .submenu a {
display: grid;
width: 100%;
justify-content: start;
text-align: left;
grid-template-rows: 0fr;
padding-right: 20px;
padding-left: 20px;
line-height: 0;
white-space: nowrap;
transition: grid-template-rows 0.5s ease-in-out;
overflow: hidden;
color: #967a45;
}
.globalNav .submenu.active a {
grid-template-rows: 1fr;
line-height: 3;
border-right: 1px solid #967a45;
border-bottom: 1px solid #967a45;
border-left: 1px solid #967a45;
transition: opacity 0.5s;
}
.globalNav .submenu.active a:hover {
opacity: 1;
color: rgba(150, 122, 69, 0.5);
}
.header__search {
flex: 1;
margin-right: 62px;
margin-left: 20px;
position: relative;
}
.header__search input[type="search"] {
height: 30px;
border-radius: 15px;
}
.header__utility {
grid-area: 1/4/2/5;
align-items: flex-end;
}
.header__utility .utilityNav {
order: 2;
margin-top: 10px;
}
.header__utility .utilityNav ul {
display: flex;
justify-content: flex-end;
font-size: 0.75rem;
}
.header__utility .utilityNav li {
margin-left: 15px;
}
.header__utility .info {
order: 1;
align-items: flex-end;
}
.sysFuncCartInfo.cart-number {
background-color: #ffffff;
background-image: url(/img/assets/pict_cart.svg);
background-size: 28px auto;
right: 40px;
position: fixed;
transform: translateY(-50%);
}
@media screen and (min-width: 1198px) {
.sysFuncCartInfo.cart-number {
right: calc((100vw - 1118px) / 2);
}
}
.header__cart {
background-color: #ffffff;
background-image: url(/img/assets/pict_cart.svg);
background-size: 28px auto;
top:auto;
right: 40px;
bottom: 4px;
position: absolute;
transform: none;
}
@media screen and (min-width: 1198px) {
.header__cart {
right: calc((100vw - 1118px) / 2);
}
}
.footer__rightTop {
display: flex;
align-items: center;
flex-direction: row;
gap: 1.125rem;
}
.sysItemList ul.sysThumbnail {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: 1.25rem;
}
.sysItemList ul.sysThumbnail li:nth-child(n + 4) {
margin-top: 3.75rem;
}
.sysItemList ul.sysList {
display: flex;
flex-direction: column;
gap: 2.625rem;
}
.sysItemList ul.sysList li {
padding: 0;
border-top: 1px solid #dddddd;
padding-top: 2.625rem;
}
/* アーカイブリスト */
.sysItemList ul.sysList li .sysThumbnailImage {
width: calc(250 / 798 * 100%);
max-width: 250px;
margin-right: calc(36 / 798 * 100%);
}
.sysItemList ul.sysList li form {
display: inline-block;
width: calc(250 / 798 * 100%);
}
.sysItemList ul.sysList li .sysWishListButtonFormAjax {
display: inline-block;
width: calc(250 / 798 * 100%);
}
.sysBlock.orderArea {
display: flex;
gap: calc(36 / 798 * 100%);
margin-top: 3.125rem;
}
.sysItemImages {
width: calc(402 / 798 * 100%);
}
#orderArea__block {
width: calc(360 / 798 * 100%);
}
#sysDescription p {
font-size: 0.75rem;
font-weight: 500;
color: #000;
line-height: 1.8;
letter-spacing: 0.03em;
text-align: left;
}
#log-in #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
}
#sysBasket #sysWrap {
max-width: 990px;
margin: 0 auto;
padding: 0 25px;
margin-top: 5.375rem;
}
#log-in #sysMain {
padding: 0 8rem;
background-color: #f4f5f7;
border: 1px solid #cbb993;
border-radius: 5px;
padding-top: 4.625rem;
padding-bottom: 5.875rem;
}
#log-in #sysFooter {
margin-top: 6.375rem;
}
#sysBasket #sysFooter {
margin-top: 6.375rem;
}
#corporate #sysFooter {
margin-top: 6.375rem;
}
#law #sysFooter {
margin-top: 6.375rem;
}
#privacypolicy #sysFooter {
margin-top: 6.375rem;
}
#questions #sysFooter {
margin-top: 6.375rem;
}
#sysMypageLogin #sysFooter {
margin-top: 6.375rem;
}
#sysMemberRegisterIndex #sysFooter {
margin-top: 6.375rem;
}
#sysMypageLogin #sysFooter {
margin-top: 6.375rem;
}
#sysMypageEditDelivery #sysFooter {
margin-top: 6.375rem;
}
#sysMypagePoint #sysFooter {
margin-top: 6.375rem;
}
#sysMypageIndex #sysFooter {
margin-top: 6.375rem;
}
#sysItemSearch #sysFooter {
margin-top: 6.375rem;
}
#sysMypageAshiato #sysFooter {
margin-top: 6.375rem;
}
#sysMypageEditMember #sysFooter {
margin-top: 6.375rem;
}
#sysMypageReview #sysFooter {
margin-top: 6.375rem;
}
#sysMypageWithdrawalConfirm #sysFooter {
margin-top: 6.375rem;
}
#sysMypageLogout #sysFooter {
margin-top: 6.375rem;
}
#terms #sysFooter {
margin-top: 6.375rem;
}
#sysRegi #sysFooter {
margin-top: 6.375rem;
}
#sysMypageReminder #sysFooter {
margin-top: 6.375rem;
}
.sysOpcBody #sysFooter {
margin-top: 6.375rem;
}
#sysFormIndex #sysFooter {
margin-top: 6.375rem;
}
.logIn-button .sysContent {
padding: 0;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 1rem;
}
.p-corporate.col2Style {
margin-top: 2.625rem;
padding-top: 1.5rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.p-law {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.p-privacy.col2Style {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.questions.col2Style {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.sysFuncText.terms-of-use {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
#main_tradelaw dt,
.main_tradelaw dt {
padding: 15px 0 15px 20px;
}
.sysTitle span,
.sysHeadline span {
position: relative;
z-index: 2;
display: inline-block;
margin: 0 2.5em;
padding: 0 40px;
background-color: #fff;
text-align: center;
}
#sysMemberRegisterIndex .sysNextSubmit {
width: 49%;
float: left;
margin-right: 2%;
border-radius: 5px;
height: 50px;
font-size: 15px;
margin-top: 20px;
}
#sysMemberRegisterIndex .sysButton[type="submit"] {
width: 49%;
margin-right: 0;
border-radius: 5px;
height: 50px;
font-size: 15px;
margin-top: 0;
margin-bottom: 0;
}
#sysMypageLogin .sysLoginButton {
width: 49%;
float: left;
margin-right: 1%;
padding: 14px 0;
font-size: 15px;
margin-top: 1.625rem;
}
#sysMypageLogin .sysButton {
width: 49%;
margin-left: 1%;
font-size: 15px;
margin-top: 1.625rem;
border-radius: 0;
margin-bottom: 0;
padding: 14px 0;
}
.guideBlock {
padding: 2.25rem 2.375rem;
}
.sysFuncText.terms-block.sysDisplayKeitaiNone {
margin-top: 2.625rem;
padding-top: 2.25rem;
padding-right: 2.375rem;
padding-bottom: 2.875rem;
padding-left: 2.375rem;
background-color: #fff;
border-radius: 5px;
margin-bottom: 0;
}
.section-header {
padding-top: 52px;
padding-bottom: 38px;
}
.category-items {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
column-gap: 20px;
}
.category-item {
aspect-ratio: 240/200;
overflow: hidden;
border-radius: 12px;
}
/*.category-item:nth-of-type(even) {
margin-top: 20px;
}*/
.category-item__image {
aspect-ratio: 240 / 200;
}
.category-item__title span {
padding: 6px 7px 6px 4px;
font-size: .875rem;
}
.category-item:nth-of-type(1) .category-item__title {
left: 22px;
}
.category-item:nth-of-type(2) .category-item__title {
left: 20px;
}
.category-item:nth-of-type(3) .category-item__title {
left: 28px;
}
.category-item:nth-of-type(4) .category-item__title {
right: 20px;
}
.mv{
margin-top: 30px;
}
.sysFuncItemBlock.new,
.recommend-list,
.ranking-list {
padding-bottom: 50px;
}
/* 採寸のしかた */
.measuring {
margin-top: 24px;
width: calc(100% - 40px);
max-width: 840px;
}
.measuring .section {
margin-top: 30px;
}
.measuring .section__heading {
margin-bottom: 20px;
font-size: 1.25rem;
}
.measuring .section p {
font-size: 0.875rem;
line-height: 1.4285714;
}
.measuring .section p:not(:first-of-type) {
margin-top: 1.4285714rem;
}
.measuring .section > .notes {
font-size: 0.75rem;
}
.measuring .body {
flex-wrap: wrap;
justify-content: space-between;
column-gap: 28px;
padding-top: 30px;
padding-right: 30px;
padding-left: 30px;
}
.measuring .body .subsection__heading {
flex: 0 0 100%;
}
.measuring .body .figure {
flex: 0 0 34.5%;
}
.measuring .body .text {
flex: 1;
}
.measuring .body dt {
font-size: 1.25rem;
}
.measuring .body dd {
font-size: 0.875rem;
}
.measuring .kimono .figure {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 14px;
}
.measuring .kimono .figure img {
flex: 0 0 calc(50% - 7px);
max-width: calc(50% - 7px);
}
.measuring .price__table {
font-size: 1.125rem;
}
/* お仕立て・加工料金価格表 */
.price {
margin-top: 24px;
width: calc(100% - 40px);
max-width: 840px;
}
.price .section {
margin-top: 30px;
}
.price .section__heading {
margin-bottom: 20px;
font-size: 1.25rem;
}
.price .section p {
font-size: 0.875rem;
line-height: 1.4285714;
}
.price .section p:not(:first-of-type) {
margin-top: 1.4285714rem;
}
.price .section > .notes {
font-size: 0.75rem;
}
.price .body {
flex-wrap: wrap;
justify-content: space-between;
column-gap: 28px;
padding-top: 30px;
padding-right: 30px;
padding-left: 30px;
}
.price .body .subsection__heading {
flex: 0 0 100%;
}
.price .body .figure {
flex: 0 0 34.5%;
}
.price .body .text {
flex: 1;
}
.price .body dt {
font-size: 1.25rem;
}
.price .body dd {
font-size: 0.875rem;
}
.price .kimono .figure {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 14px;
}
.price .kimono .figure img {
flex: 0 0 calc(50% - 7px);
max-width: calc(50% - 7px);
}
.price .price__table {
font-size: 1.125rem;
}
.opcItem_itemCommonOptionOptionGroup_edit {
gap: 20px;
}
.d-sp {
display: none !important;
}
.sysFuncBanner.feature{
margin-top: 30px;
margin-bottom: 30px;
width: calc(100% - 60px);
max-width: 940px;
}
.sysFuncBanner.feature li:nth-child(2){
display:none;
}
}
/* #END_OF_RESOURCE_FILE */