@charset 'UTF-8';
html.swipebox-html.swipebox-touch{overflow:hidden!important}#swipebox-overlay img{border:none!important}#swipebox-overlay{width:100%;height:100%;position:fixed;top:0;left:0;z-index:99999!important;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.admin-bar #swipebox-overlay{top: 32px;}.admin-bar #swipebox-container {bottom: 32px;}#swipebox-container{position:relative;width:100%;height:100%}#swipebox-slider{-webkit-transition:-webkit-transform 0.4s ease;transition:transform 0.4s ease;height:100%;left:0;top:0;width:100%;white-space:nowrap;position:absolute;display:none;cursor:pointer}#swipebox-slider .slide{height:100%;width:100%;line-height:1px;text-align:center;display:inline-block}#swipebox-slider .slide:before{content:"";display:inline-block;height:50%;width:1px;margin-right:-1px}#swipebox-slider .slide img,#swipebox-slider .slide .swipebox-video-container,#swipebox-slider .slide .swipebox-inline-container{display:inline-block;max-height:100%;max-width:100%;margin:0;padding:0;width:auto;height:auto;vertical-align:middle}#swipebox-slider .slide .swipebox-video-container{background:none;max-width:1140px;max-height:100%;width:100%;padding:5%;-webkit-box-sizing:border-box;box-sizing:border-box}#swipebox-slider .slide .swipebox-video-container .swipebox-video{width:100%;height:0;padding-bottom:56.25%;overflow:hidden;position:relative}#swipebox-slider .slide .swipebox-video-container .swipebox-video iframe{width:100%!important;height:100%!important;position:absolute;top:0;left:0}#swipebox-slider .slide-loading{background:url(//www.motorimoda.com/wp-content/plugins/responsive-lightbox/assets/swipebox/img/loader.gif) no-repeat center center}#swipebox-bottom-bar,#swipebox-top-bar{-webkit-transition:0.5s;transition:0.5s;position:absolute;left:0;z-index:999;height:50px;width:100%}#swipebox-bottom-bar{bottom:-50px}#swipebox-bottom-bar.visible-bars{-webkit-transform:translate3d(0,-50px,0);transform:translate3d(0,-50px,0)}#swipebox-top-bar{top:-50px}#swipebox-top-bar.visible-bars{-webkit-transform:translate3d(0,50px,0);transform:translate3d(0,50px,0)}#swipebox-title{display:block;width:100%;text-align:center}#swipebox-prev,#swipebox-next,#swipebox-close{background-image:url(//www.motorimoda.com/wp-content/plugins/responsive-lightbox/assets/swipebox/img/icons.png);background-repeat:no-repeat;border:none!important;text-decoration:none!important;cursor:pointer;width:50px;height:50px;top:0}#swipebox-arrows{display:block;margin:0 auto;width:100%;height:50px}#swipebox-prev{background-position:-32px 13px;float:left}#swipebox-next{background-position:-78px 13px;float:right}#swipebox-close{top:0;right:0;position:absolute;z-index:9999;background-position:15px 12px}.swipebox-no-close-button #swipebox-close{display:none}#swipebox-prev.disabled,#swipebox-next.disabled{opacity:.3}.swipebox-no-touch #swipebox-overlay.rightSpring #swipebox-slider{-webkit-animation:rightSpring 0.3s;animation:rightSpring 0.3s}.swipebox-no-touch #swipebox-overlay.leftSpring #swipebox-slider{-webkit-animation:leftSpring 0.3s;animation:leftSpring 0.3s}.swipebox-touch #swipebox-container:before,.swipebox-touch #swipebox-container:after{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition:all .3s ease;transition:all .3s ease;content:' ';position:absolute;z-index:999;top:0;height:100%;width:20px;opacity:0}.swipebox-touch #swipebox-container:before{left:0;-webkit-box-shadow:inset 10px 0 10px -8px #656565;box-shadow:inset 10px 0 10px -8px #656565}.swipebox-touch #swipebox-container:after{right:0;-webkit-box-shadow:inset -10px 0 10px -8px #656565;box-shadow:inset -10px 0 10px -8px #656565}.swipebox-touch #swipebox-overlay.leftSpringTouch #swipebox-container:before{opacity:1}.swipebox-touch #swipebox-overlay.rightSpringTouch #swipebox-container:after{opacity:1}@-webkit-keyframes rightSpring{0%{left:0}50%{left:-30px}100%{left:0}}@keyframes rightSpring{0%{left:0}50%{left:-30px}100%{left:0}}@-webkit-keyframes leftSpring{0%{left:0}50%{left:30px}100%{left:0}}@keyframes leftSpring{0%{left:0}50%{left:30px}100%{left:0}}@media screen and (min-width:800px){#swipebox-close{right:10px}#swipebox-arrows{width:92%;max-width:800px}}#swipebox-overlay{background:#0d0d0d}#swipebox-bottom-bar,#swipebox-top-bar{text-shadow:1px 1px 1px black;background:#000;opacity:.95}#swipebox-top-bar{color:white!important;font-size:15px;line-height:43px;font-family:Helvetica,Arial,sans-serif}.wpp-no-data {
} .wpp-list { li {
overflow: hidden;
float: none;
clear: both;
margin-bottom: 1rem;
&:last-of-type {
margin-bottom: 0;
} &.current {
}
a {
&:has(.wpp-thumbnail) {
display: block;
float: left;
margin: 0 1rem 0 0;
.wpp-thumbnail {
display: block;
border: none;
&.wpp_def_no_src {
object-fit: contain;
}
}
}
} .wpp-post-title {
} .wpp-excerpt {
display: block;
} .wpp-meta, .post-stats {
display: block;
font-size: 0.8em;
} .wpp-comments {
} .wpp-views {
} .wpp-author {
} .wpp-date {
} .wpp-category {
} .wpp-rating {
}
}
}.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
 .slick-loading .slick-list
{
background: #fff url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/ajax-loader.gif) center center no-repeat;
} @font-face
{
font-family: 'slick';
font-weight: normal;
font-style: normal;
src: url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/slick.eot);
src: url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/slick.eot?#iefix) format('embedded-opentype'), url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/slick.woff) format('woff'), url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/slick.ttf) format('truetype'), url(https://www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/slick.svg#slick) format('svg');
} .slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}
.slick-prev:before,
.slick-next:before
{
font-family: 'slick';
font-size: 20px;
line-height: 1;
opacity: .75;
color: white;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-prev
{
left: -25px;
}
[dir='rtl'] .slick-prev
{
right: -25px;
left: auto;
}
.slick-prev:before
{
content: '←';
}
[dir='rtl'] .slick-prev:before
{
content: '→';
}
.slick-next
{
right: -25px;
}
[dir='rtl'] .slick-next
{
right: auto;
left: -25px;
}
.slick-next:before
{
content: '→';
}
[dir='rtl'] .slick-next:before
{
content: '←';
} .slick-dotted.slick-slider
{
margin-bottom: 30px;
}
.slick-dots
{
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.slick-dots li
{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before
{
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}@font-face {
font-family: 'icomoon';
src:  url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/icomoon-v1.0/fonts/icomoon.eot?jk9li5);
src:  url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/icomoon-v1.0/fonts/icomoon.eot?jk9li5#iefix) format('embedded-opentype'),
url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/icomoon-v1.0/fonts/icomoon.ttf?jk9li5) format('truetype'),
url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/icomoon-v1.0/fonts/icomoon.woff?jk9li5) format('woff'),
url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/icomoon-v1.0/fonts/icomoon.svg?jk9li5#icomoon) format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icon-"], [class*=" icon-"] { font-family: 'icomoon' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-concept_01_2riders:before {
content: "\e900";
}
.icon-concept_02_4drivers:before {
content: "\e901";
}
.icon-concept_03_motorsports:before {
content: "\e902";
}
.icon-common_01_helmets:before {
content: "\e904";
}
.icon-common_02_goggles:before {
content: "\e905";
}
.icon-common_03_wear:before {
content: "\e906";
}
.icon-common_04_gloves:before {
content: "\e907";
}
.icon-common_05_shoes:before {
content: "\e908";
}
.icon-common_06_bag:before {
content: "\e909";
}
.icon-common_07_accessories:before {
content: "\e90a";
}
.icon-common_08_watch:before {
content: "\e90b";
}
.icon-common_09_new:before {
content: "\e90c";
}
.icon-common_10_restock:before {
content: "\e90d";
}
.icon-common_11_balloon:before {
content: "\e90e";
}
.icon-common_12_ladies:before {
content: "\e90f";
}
.icon-common_13_kids:before {
content: "\e903";
}.keen-slider:not([data-keen-slider-disabled]) {
-webkit-touch-callout: none;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
align-content: flex-start;
display: flex;
overflow: hidden;
position: relative;
-ms-touch-action: pan-y;
touch-action: pan-y;
user-select: none;
-khtml-user-select: none;
width: 100%
}
.keen-slider:not([data-keen-slider-disabled]) .keen-slider__slide {
min-height: 100%;
overflow: hidden;
position: relative;
width: 100%
}
.keen-slider:not([data-keen-slider-disabled])[data-keen-slider-reverse] {
flex-direction: row-reverse
}
.keen-slider:not([data-keen-slider-disabled])[data-keen-slider-v] {
flex-wrap: wrap
}
.defalutFontStyle,
body {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 1.6rem;
letter-spacing: .1rem;
line-height: 2
}
.icon_fb:before {
color: #ddd;
content: "\f09a";
font-family: "Font Awesome 5 Brands"
}
.icon_fb.active:before {
color: #555
}
.icon_tw:before {
color: #ddd;
content: "\f099";
font-family: "Font Awesome 5 Brands"
}
.icon_tw.active:before {
color: #555
}
.icon_insta:before {
color: #ddd;
content: "\f16d";
font-family: "Font Awesome 5 Brands"
}
.icon_insta.active:before {
color: #555
}
.icon_pin:before {
color: #ddd;
content: "\f3c5";
font-family: "Font Awesome 5 Brands"
}
.icon_pin.active:before {
color: #555
}
.icon_tel:before {
color: #ddd;
content: "\f095";
font-family: "Font Awesome 5 Brands"
}
.icon_tel.active:before {
color: #555
}
@font-face {
font-family: fs-icon;
font-style: normal;
font-weight: 400;
src: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.ttf?4lt733) format("truetype"), url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.woff?4lt733) format("woff"), url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.svg?4lt733#fs-icon) format("svg")
}
* {
box-sizing: border-box
}
html {
font-size: 10px
}
body {
margin: 0;
padding: 0
}
a {
color: #231815;
text-decoration: none
}
ul {
list-style: none
}
button,
input,
select,
textarea {
font-family: "Noto Serif JP", serif;
font-size: inherit
}
[type=date],
[type=datetime-local],
[type=datetime],
[type=email],
[type=hidden],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week] {
-webkit-appearance: none;
border: 1px solid #ccc;
line-height: 1.4;
min-height: 1.8em;
padding: 3px 5px;
width: 100%
}
img {
height: auto;
width: auto
}
.c-scrollbar--onGray::-webkit-scrollbar,
.c-scrollbar--regular::-webkit-scrollbar {
border-radius: 1.5px;
height: 3px;
width: 3px
}
.c-scrollbar--onGray::-webkit-scrollbar-track,
.c-scrollbar--regular::-webkit-scrollbar-track {
background: #fafafa;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar-thumb,
.c-scrollbar--regular::-webkit-scrollbar-thumb {
background: #eaeaea;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar {
border-radius: 1.5px;
height: 3px;
width: 3px
}
.c-scrollbar--onGray::-webkit-scrollbar-track {
background: #eee;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar-thumb {
background: #ccc;
border-radius: 1.5px
}
table.sizechart {
border-collapse: collapse;
margin: 0 auto;
padding: 0;
table-layout: fixed;
width: 100%
}
table.sizechart tr {
background-color: #fff;
border: 1px solid #bbb;
padding: .35em
}
table.sizechart td,
table.sizechart th {
border-right: 1px solid #bbb;
padding: 1em 10px 1em 1em
}
table.sizechart th {
font-size: .75em
}
table.sizechart thead tr {
background-color: #eee
}
table.sizechart .size,
table.sizechart .txt {
font-size: .85em;
text-align: center
}
@media screen and (max-width:767px) {
table.sizechart thead {
display: none
}
table.sizechart tbody tr {
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap
}
table.sizechart tbody tr th {
border-right: none;
width: 100%
}
table.sizechart tbody tr td {
border-right: none;
margin-top: 30px;
padding: 1rem .5rem;
position: relative
}
table.sizechart tbody tr td:before {
border-bottom: 1px solid #ccc;
content: attr(data-label);
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
top: -15px
}
table.sizechart tbody tr:has(>td:first-child:last-child) td {
width: calc(100%/(1 - 1))
}
table.sizechart tbody tr:has(>td:nth-child(2):last-child) td {
width: 100%
}
table.sizechart tbody tr:has(>td:nth-child(3):last-child) td {
width: 50%
}
table.sizechart tbody tr:has(>td:nth-child(4):last-child) td {
width: 33.33333%
}
table.sizechart tbody tr:has(>td:nth-child(5):last-child) td {
width: 25%
}
table.sizechart tbody tr:has(>td:nth-child(6):last-child) td {
width: 20%
}
table.sizechart tbody tr:has(>td:nth-child(7):last-child) td {
width: 16.66667%
}
table.sizechart tbody tr:has(>td:nth-child(8):last-child) td {
width: 14.28571%
}
table.sizechart tbody tr:has(>td:nth-child(9):last-child) td {
width: 12.5%
}
table.sizechart tbody tr:has(>td:nth-child(10):last-child) td {
width: 11.11111%
}
}
.aspectFix {
position: relative;
width: 100%
}
.aspectFix:before {
content: "";
display: block;
padding-top: 75%
}
.aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.alinkText {
color: #a78000;
cursor: pointer;
text-decoration: underline
}
.alinkText:hover {
color: #c19400
}
.hidden {
display: none !important
}
@media screen and (max-width:767px) {
.sp {
display: block
}
}
frame-01 {
border: 10px solid #fafafa;
margin: 15px 0;
padding: 10px
}
@media screen and (max-width:767px) {
.layout__item__outer {
padding: 2px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__item__outer {
padding: 10px
}
}
@media screen and (min-width:1020px) {
.layout__item__outer {
padding: 10px
}
}
.layout__item__inner {
background: #fafafa
}
@media screen and (max-width:767px) {
.layout__item__inner {
padding: 5px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__item__inner {
padding: 10px
}
}
@media screen and (min-width:1020px) {
.layout__item__inner {
padding: 15px
}
}
.layout__list {
display: flex;
flex-direction: column
}
@media screen and (max-width:767px) {
.layout__list {
gap: 4px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__list {
gap: 20px
}
}
@media screen and (min-width:1020px) {
.layout__list {
gap: 20px
}
}
.fadeIn {
animation-duration: 1s;
animation-fill-mode: forwards;
animation-name: fadeInAnime;
opacity: 0
}
.scroll_bar {
background-color: #f0f0f0
}
.scroll_bar::-webkit-scrollbar {
height: 6px;
width: 6px
}
.scroll_bar::-webkit-scrollbar-track {
background-color: #ccc
}
.scroll_bar::-webkit-scrollbar-thumb {
background-color: #a38000
}
@media print {
#secondary,
.comment-edit-link,
.comment-metadata .edit-link,
.comment-reply-link,
.comment-respond,
.comments-pagination,
.content-bottom-widgets,
.edit-link,
.header-image,
.icon-thumb-tack,
.navigation-top,
.page-links,
.pagination.navigation,
.panel-image-prop,
.pingback .edit-link,
.post-navigation,
.site-footer aside.widget-area,
.site-info,
.social-navigation,
button,
form,
input,
select,
textarea {
display: none !important
}
#comments,
.entry-footer,
.single-featured-image-header,
.site-footer {
border: 0
}
body {
font-size: 12pt
}
h1 {
font-size: 24pt
}
h2 {
font-size: 22pt
}
h3 {
font-size: 17pt
}
h4 {
font-size: 12pt
}
h5 {
font-size: 11pt
}
h6 {
font-size: 12pt
}
.page .panel-content .entry-title,
.page-title,
body.page:not(.twentyseventeen-front-page) .entry-title {
font-size: 10pt
}
.wrap {
max-width: none;
padding-left: 5% !important;
padding-right: 5% !important
}
.site-header {
background: transparent;
padding: 0
}
.custom-header-media {
padding: 0
}
.home.blog.has-header-image .site-branding,
.home.blog.has-header-video .site-branding,
.twentyseventeen-front-page.has-header-image .site-branding,
.twentyseventeen-front-page.has-header-video .site-branding {
position: relative
}
.site-branding {
margin-bottom: 1.75em !important;
margin-top: 0
}
.site-title {
font-size: 25pt
}
.site-description {
font-size: 12pt;
opacity: 1
}
.single-featured-image-header {
background: transparent
}
.entry-meta {
font-size: 9pt
}
.site,
body {
background: none !important
}
.site-title a,
.twentyseventeen-front-page.has-header-image .site-title,
.twentyseventeen-front-page.has-header-image .site-title a,
.twentyseventeen-front-page.has-header-video .site-title,
.twentyseventeen-front-page.has-header-video .site-title a,
a,
body {
color: #222 !important
}
.entry-meta,
.entry-meta a,
.site-description,
.twentyseventeen-front-page.has-header-image .site-description,
.twentyseventeen-front-page.has-header-video .site-description,
blockquote,
h2,
h5 {
color: #777 !important
}
.entry-content blockquote.alignleft,
.entry-content blockquote.alignright {
font-size: 11pt;
width: 34%
}
.site-footer {
padding: 0
}
}
@media screen and (max-width:48.875em)and (min-width:48em) {
.admin-bar .site-navigation-fixed.navigation-top,
.admin-bar .site-navigation-hidden.navigation-top {
top: 46px
}
}
@media screen and (min-width:79em) {
.has-sidebar .entry-content blockquote.alignleft {
margin-left: -20%
}
.archive:not(.has-sidebar) .entry-content blockquote.alignright,
.blog:not(.has-sidebar) .entry-content blockquote.alignright,
.page-two-column .entry-content blockquote.alignright,
.twentyseventeen-front-page .entry-content blockquote.alignright {
margin-right: -20%
}
}
.admin-bar main {
min-height: calc(100vh - 302px)
}
.admin-bar main.menu_open {
height: calc(100vh - 302px)
}
.datepicker {
display: none
}
.datepicker.active {
display: block
}
.datepicker-dropdown {
left: 0;
padding-top: 4px;
position: absolute;
top: 0;
z-index: 20
}
.datepicker-dropdown.datepicker-orient-top {
padding-bottom: 4px;
padding-top: 0
}
.datepicker-picker {
background-color: #fff;
border-radius: 4px;
display: inline-block
}
.datepicker-dropdown .datepicker-picker {
box-shadow: 0 2px 3px hsla(0, 0%, 4%, .1), 0 0 0 1px hsla(0, 0%, 4%, .1)
}
.datepicker-picker span {
-webkit-touch-callout: none;
border: 0;
border-radius: 4px;
cursor: default;
display: block;
flex: 1;
text-align: center;
user-select: none
}
.datepicker-main {
padding: 2px
}
.datepicker-footer {
background-color: #f5f5f5;
box-shadow: inset 0 1px 1px hsla(0, 0%, 4%, .1)
}
.datepicker-controls,
.datepicker-grid,
.datepicker-view,
.datepicker-view .days-of-week {
display: flex
}
.datepicker-grid {
flex-wrap: wrap
}
.datepicker-view .days .datepicker-cell,
.datepicker-view .dow {
flex-basis: 14.2857142857%
}
.datepicker-view.datepicker-grid .datepicker-cell {
flex-basis: 25%
}
.datepicker-cell,
.datepicker-view .week {
height: 2.25rem;
line-height: 2.25rem
}
.datepicker-title {
background-color: #f5f5f5;
box-shadow: inset 0 -1px 1px hsla(0, 0%, 4%, .1);
font-weight: 700;
padding: .375rem .75rem;
text-align: center
}
.datepicker-header .datepicker-controls {
padding: 2px 2px 0
}
.datepicker-controls .button {
align-items: center;
background-color: #fff;
border: 1px solid #dbdbdb;
border-radius: 4px;
box-shadow: none;
color: #363636;
cursor: pointer;
display: inline-flex;
font-size: 1rem;
height: 2.25em;
justify-content: center;
line-height: 1.5;
margin: 0;
padding: calc(.375em - 1px) .75em;
position: relative;
text-align: center;
vertical-align: top;
white-space: nowrap
}
.datepicker-controls .button:active,
.datepicker-controls .button:focus {
outline: none
}
.datepicker-controls .button:hover {
border-color: #b5b5b5;
color: #363636
}
.datepicker-controls .button:focus {
border-color: #3273dc;
color: #363636
}
.datepicker-controls .button:focus:not(:active) {
box-shadow: 0 0 0 .125em rgba(50, 115, 220, .25)
}
.datepicker-controls .button:active {
border-color: #4a4a4a;
color: #363636
}
.datepicker-controls .button[disabled] {
cursor: not-allowed
}
.datepicker-header .datepicker-controls .button {
border-color: transparent;
font-weight: 700
}
.datepicker-header .datepicker-controls .button:hover {
background-color: #f9f9f9
}
.datepicker-header .datepicker-controls .button:focus:not(:active) {
box-shadow: 0 0 0 .125em hsla(0, 0%, 100%, .25)
}
.datepicker-header .datepicker-controls .button:active {
background-color: #f2f2f2
}
.datepicker-header .datepicker-controls .button[disabled] {
box-shadow: none
}
.datepicker-footer .datepicker-controls .button {
border-radius: 2px;
font-size: .75rem;
margin: calc(.375rem - 1px) .375rem;
width: 100%
}
.datepicker-controls .view-switch {
flex: auto
}
.datepicker-controls .next-btn,
.datepicker-controls .prev-btn {
padding-left: .375rem;
padding-right: .375rem;
width: 2.25rem
}
.datepicker-controls .next-btn.disabled,
.datepicker-controls .prev-btn.disabled {
visibility: hidden
}
.datepicker-view .dow {
font-size: .875rem;
font-weight: 700;
height: 1.5rem;
line-height: 1.5rem
}
.datepicker-view .week {
color: #b5b5b5;
font-size: .75rem;
width: 2.25rem
}
@media(max-width:22.5rem) {
.datepicker-view .week {
width: 1.96875rem
}
}
.datepicker-grid {
width: 15.75rem
}
@media(max-width:22.5rem) {
.calendar-weeks + .days .datepicker-grid {
width: 13.78125rem
}
}
.datepicker-cell:not(.disabled):hover {
background-color: #f9f9f9;
cursor: pointer
}
.datepicker-cell.focused:not(.selected) {
background-color: #e8e8e8
}
.datepicker-cell.selected,
.datepicker-cell.selected:hover {
background-color: #3273dc;
color: #fff;
font-weight: 600
}
.datepicker-cell.disabled {
color: #dbdbdb
}
.datepicker-cell.next:not(.disabled),
.datepicker-cell.prev:not(.disabled) {
color: #7a7a7a
}
.datepicker-cell.next.selected,
.datepicker-cell.prev.selected {
color: #e6e6e6
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today) {
background-color: #f5f5f5;
border-radius: 0
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today):not(.disabled):hover {
background-color: #eee
}
.datepicker-cell.highlighted:not(.selected):not(.range):not(.today).focused {
background-color: #e8e8e8
}
.datepicker-cell.today:not(.selected) {
background-color: #00d1b2
}
.datepicker-cell.today:not(.selected):not(.disabled) {
color: #fff
}
.datepicker-cell.today.focused:not(.selected) {
background-color: #00c4a7
}
.datepicker-cell.range-end:not(.selected),
.datepicker-cell.range-start:not(.selected) {
background-color: #b5b5b5;
color: #fff
}
.datepicker-cell.range-end.focused:not(.selected),
.datepicker-cell.range-start.focused:not(.selected) {
background-color: #afafaf
}
.datepicker-cell.range-start {
border-radius: 4px 0 0 4px
}
.datepicker-cell.range-end {
border-radius: 0 4px 4px 0
}
.datepicker-cell.range {
background-color: #dbdbdb;
border-radius: 0
}
.datepicker-cell.range:not(.disabled):not(.focused):not(.today):hover {
background-color: #d5d5d5
}
.datepicker-cell.range.disabled {
color: #c2c2c2
}
.datepicker-cell.range.focused {
background-color: #cfcfcf
}
.datepicker-view.datepicker-grid .datepicker-cell {
height: 4.5rem;
line-height: 4.5rem
}
.datepicker-input.in-edit {
border-color: #2366d1
}
.datepicker-input.in-edit:active,
.datepicker-input.in-edit:focus {
box-shadow: 0 0 .25em .25em rgba(35, 102, 209, .2)
}
.navigation-wrapper {
position: relative
}
.dots {
display: flex;
justify-content: center;
padding: 10px 0
}
.dot {
background: #e6e6e6;
border: none;
border-radius: 50%;
cursor: pointer;
height: 10px;
margin: 0 5px;
padding: 5px;
width: 10px
}
.dot:focus {
outline: none
}
.dot--active {
background: #a78000
}
.arrow {
fill: #fff;
border-radius: 3px;
cursor: pointer;
height: 40px;
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
width: 40px
}
.arrow--left {
fill: "#fff";
background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23A78000' viewBox='0 0 24 24'%3E%3Cpath d='m16.67 0 2.83 2.829-9.339 9.175 9.339 9.167L16.67 24 4.5 12.004z'/%3E%3C/svg%3E"), hsla(0, 0%, 94%, .8);
background-position: 50%;
background-repeat: no-repeat;
background-size: 16px;
left: 5px
}
.arrow--right {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23A78000' viewBox='0 0 24 24'%3E%3Cpath d='m5 3 3.057-3L20 12 8.057 24 5 21l9-9z'/%3E%3C/svg%3E"), hsla(0, 0%, 94%, .8);
background-position: 50%;
background-repeat: no-repeat;
background-size: 16px;
left: auto;
right: 5px
}
.arrow--disabled.arrow--left {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='gray' viewBox='0 0 24 24'%3E%3Cpath d='m16.67 0 2.83 2.829-9.339 9.175 9.339 9.167L16.67 24 4.5 12.004z'/%3E%3C/svg%3E"), hsla(0, 0%, 94%, .8);
background-position: 50%;
background-repeat: no-repeat;
background-size: 16px
}
.arrow--disabled.arrow--right {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='gray' viewBox='0 0 24 24'%3E%3Cpath d='m5 3 3.057-3L20 12 8.057 24 5 21l9-9z'/%3E%3C/svg%3E"), hsla(0, 0%, 94%, .8);
background-position: 50%;
background-repeat: no-repeat;
background-size: 16px
}
.fs-client-cart-count {
background: red;
border-radius: 9.5px;
color: #fff;
font-family: Yu Gothic, 游ゴシック, YuGothic, 游ゴシック体, ヒラギノ角ゴ Pro W3, メイリオ, sans-serif;
font-size: 12px;
font-weight: 700;
height: 19px;
line-height: 19px;
margin: 0;
padding: 0;
position: absolute;
right: 0;
text-align: center;
top: 0;
width: 19px;
z-index: 900
}
.fs-client-cart-count--0 {
display: none
}
#buttomNavigation .fs-client-cart-count {
right: 2px;
top: 2px
}
.c-goTopNavigation .fs-client-cart-count {
right: 15px;
top: 9px
}
.wp-cartButton {
position: relative
}
.fs-c-button--addToWishList--icon .fs-c-button__label,
.fs-c-button--removeFromWishList--icon .fs-c-button__label {
display: none
}
.fs-c-productQuantityAndWishlist__wishlist .fs-c-button__label {
color: #333;
font-size: 1.2rem;
line-height: 1.3;
text-align: left
}
.fs-c-button--particular.fs-c-button--addToWishList--detail:after,
.fs-c-button--particular.fs-c-button--addToWishList--icon:before,
.fs-c-button--particular.fs-c-button--displayPassword:before,
.fs-c-button--particular.fs-c-button--hidePassword:before,
.fs-c-button--particular.fs-c-button--removeFromWishList--detail:after,
.fs-c-button--particular.fs-c-button--removeFromWishList--icon:before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: fs-icon !important;
font-size: 2.2rem;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 1;
text-transform: none
}
.fs-c-button--addToWishList--icon .fs-c-button__label,
.fs-c-button--removeFromWishList--icon .fs-c-button__label,
.fs-l-productLayout .product_right .fs-c-button--addToWishList--detail {
background: transparent;
border-radius: 5px;
line-height: 1;
margin: 0;
padding: 8px;
width: auto
}
.fs-c-button--cancel--cart .fs-c-button--plain {
background: none;
border: none;
color: #123456
}
.fs-c-button,
.fs-c-button--buyItLater,
.fs-c-button--plain,
.fs-c-button--standard {
background: none;
border: none;
color: #231815;
cursor: pointer;
display: block;
font-size: 1.1rem;
font-weight: 400;
letter-spacing: .09rem;
line-height: 2.1rem;
max-width: none;
padding: 2px .5rem
}
.fs-c-button--buyItLater:active,
.fs-c-button--buyItLater:focus,
.fs-c-button--buyItLater:link,
.fs-c-button--buyItLater:visited,
.fs-c-button--plain:active,
.fs-c-button--plain:focus,
.fs-c-button--plain:link,
.fs-c-button--plain:visited,
.fs-c-button--standard:active,
.fs-c-button--standard:focus,
.fs-c-button--standard:link,
.fs-c-button--standard:visited,
.fs-c-button:active,
.fs-c-button:focus,
.fs-c-button:link,
.fs-c-button:visited {
color: #333
}
@media screen and (min-width:768px) {
.fs-c-button--buyItLater:hover,
.fs-c-button--plain:hover,
.fs-c-button--standard:hover,
.fs-c-button:hover {
opacity: .8
}
}
.fs-c-button__label {
letter-spacing: .03rem
}
.fs-c-button--plain {
padding: 2px .5rem
}
.fs-c-button--standard {
background: #efefef;
border: 1px solid #231815
}
.fs-c-button--addToCart--variation,
.fs-c-button--continueShopping,
.fs-c-button--primary,
.fs-c-button--subscribeToArrivalNotice {
background: #a78000;
border: none;
color: #fff;
cursor: pointer;
display: block;
margin: 0 auto;
max-width: 320px;
padding: 8px 30px;
width: 100%
}
.fs-c-button--addToCart--variation:active,
.fs-c-button--addToCart--variation:focus,
.fs-c-button--addToCart--variation:link,
.fs-c-button--addToCart--variation:visited,
.fs-c-button--continueShopping:active,
.fs-c-button--continueShopping:focus,
.fs-c-button--continueShopping:link,
.fs-c-button--continueShopping:visited,
.fs-c-button--primary:active,
.fs-c-button--primary:focus,
.fs-c-button--primary:link,
.fs-c-button--primary:visited,
.fs-c-button--subscribeToArrivalNotice:active,
.fs-c-button--subscribeToArrivalNotice:focus,
.fs-c-button--subscribeToArrivalNotice:link,
.fs-c-button--subscribeToArrivalNotice:visited {
color: #fff
}
@media screen and (min-width:768px) {
.fs-c-button--addToCart--variation:hover,
.fs-c-button--continueShopping:hover,
.fs-c-button--primary:hover,
.fs-c-button--subscribeToArrivalNotice:hover {
opacity: .8
}
}
.fs-c-button--image {
padding: 10px 0
}
.fs-c-button--image,
.fs-c-button--particular {
background: none;
border: none
}
.fs-c-button--buyItLater {
color: #a78000;
cursor: pointer
}
.fs-c-button--buyItLater:active,
.fs-c-button--buyItLater:focus,
.fs-c-button--buyItLater:link,
.fs-c-button--buyItLater:visited {
color: #a78000
}
@media screen and (min-width:768px) {
.fs-c-button--buyItLater:hover {
opacity: .8
}
}
.fs-c-button--continueShopping {
background: #231815;
color: #fff;
cursor: pointer
}
.fs-c-button--continueShopping:active,
.fs-c-button--continueShopping:focus,
.fs-c-button--continueShopping:link,
.fs-c-button--continueShopping:visited {
color: #fff
}
@media screen and (min-width:768px) {
.fs-c-button--continueShopping:hover {
opacity: .8
}
}
.fs-c-button--addToCart--variation {
background: #231815;
border: none;
border-radius: 4px;
color: #fff;
cursor: pointer;
padding: 5px 0
}
.fs-c-button--addToCart--variation:active,
.fs-c-button--addToCart--variation:focus,
.fs-c-button--addToCart--variation:link,
.fs-c-button--addToCart--variation:visited {
color: #fff
}
@media screen and (min-width:768px) {
.fs-c-button--addToCart--variation:hover {
opacity: .8
}
}
#allClear.fs-c-button--addToCart--variation,
#allClear.fs-c-button--continueShopping,
#allClear.fs-c-button--primary,
#allClear.fs-c-button--subscribeToArrivalNotice {
background: #fff;
border: 1px solid #241716;
color: #241716 !important;
font-size: 1.4rem
}
#brandSelectTrigger.fs-c-button--standard {
background: #fff;
color: #241716;
line-height: 1.3;
}
#execItemSearch.fs-c-button--addToCart--variation,
#execItemSearch.fs-c-button--continueShopping,
#execItemSearch.fs-c-button--primary,
#execItemSearch.fs-c-button--subscribeToArrivalNotice {
background: #241716
}
.c-singleSearch .fs-c-button,
.c-singleSearch .fs-c-button--buyItLater,
.c-singleSearch .fs-c-button--plain,
.c-singleSearch .fs-c-button--standard {
background: #ccc;
padding: 10px 0
}
.c-singleSearch .clear.fs-c-button--buyItLater,
.c-singleSearch .clear.fs-c-button--plain,
.c-singleSearch .clear.fs-c-button--standard,
.c-singleSearch .fs-c-button.clear {
background: none;
border: 1px solid #050302
}
.c-singleSearch .fs-c-button.submit,
.c-singleSearch .submit.fs-c-button--buyItLater,
.c-singleSearch .submit.fs-c-button--plain,
.c-singleSearch .submit.fs-c-button--standard {
background: #050302;
color: #fff
}
.fs-c-button--secondary {
background: #666;
border: none;
color: #fff !important;
display: block;
font-size: 1.4rem;
margin: 10px auto;
max-width: 300px;
padding-bottom: 5px;
padding-top: 5px;
text-align: center;
width: 100%
}
.fs-c-button--displayPassword,
.fs-c-button--hidePassword {
background: #f5f5f5;
border: none !important;
margin: 4px !important;
margin: auto
}
.fs-c-button--displayPassword:before,
.fs-c-button--hidePassword:before {
color: #666;
content: "パスワードマスク切替";
font-size: 10px;
white-space: nowrap
}
.fs-c-button--carousel .fs-c-button__label {
display: none;
text-indent: -9999px
}
.fs-c-productList__list .fs-c-button--viewMoreImage {
background: #231815;
color: #fff;
display: block;
font-size: 11px;
margin: 5px auto;
padding: 4px 30px;
width: 100%
}
#fs_MyPageTop .fs-c-button--addToWishList--icon,
#fs_MyPageTop .fs-c-button--removeFromWishList--icon {
position: absolute;
right: 0;
top: 0
}
.fs-c-button--plain.fs-c-button--addToCart--list:before {
content: ""
}
@media screen and (max-width:600px) {
.fs-c-button--plain.fs-c-button--addToCart--list:before {
display: inline
}
}
.fs-c-button--plain:before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-family: fs-icon !important;
font-style: normal;
font-variant: normal;
font-weight: 400;
line-height: 1;
text-transform: none
}
.fs-body-my-wishlist .fs-c-button--removeFromWishList--icon {
position: absolute;
right: 10px;
top: 10px
}
.fs-c-button--displayPassword,
.fs-c-button--hidePassword {
width: auto
}
.fs-c-button--particular.fs-c-button--displayPassword:before,
.fs-c-button--particular.fs-c-button--hidePassword:before {
color: #999;
margin: auto 4px
}
.fs-c-button--particular.fs-c-button--displayPassword:before {
content: ""
}
.fs-c-button--particular.fs-c-button--hidePassword:before {
content: ""
}
.fs-body-my-account-delete .fs-c-button--cancel {
background: #f5f5f5;
border: 1px solid #aaa;
color: #aaa !important;
display: block;
margin: 10px auto;
max-width: 300px;
padding: 8px 30px;
text-align: center;
width: 100%
}
.fs-c-button--contactAction {
background: #050302;
color: #fff;
display: block;
font-size: 1.2rem;
line-height: 1.2rem;
padding: 15px;
text-align: center;
width: 100%
}
.fs-c-button--contactAction:hover {
color: #a78000
}
.fs-c-button--routeSearch {
align-items: center;
background: rgba(0, 12, 89, .6);
border: 1.5px solid #ccc;
display: flex;
flex-direction: column;
height: 80px;
justify-content: center;
line-height: 0;
margin: 0;
padding: 0;
position: relative;
width: 80px;
z-index: 999
}
.fs-c-button--routeSearch .label {
color: #ddd;
font-size: 1.4rem;
font-size: 10px;
font-weight: 700;
line-height: 12px;
order: 2
}
.fs-c-button--routeSearch:before {
background: #ddd;
content: "";
display: block;
height: 40px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/icon/map-location-solid.svg) no-repeat center center/85%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/icon/map-location-solid.svg) no-repeat center center/85%;
width: 40px
}
@media screen and (max-width:767px) {
.fs-c-button--routeSearch {
height: 64px;
width: 64px
}
.fs-c-button--routeSearch .label {
font-size: 9px
}
.fs-c-button--routeSearch:before {
height: 25px;
width: 25px
}
}
.fs-c-buttonContainer {
text-align: center;
width: 100%
}
.fs-c-buttonContainer--changeSmall {
display: flex;
justify-content: flex-end;
padding-top: 15px
}
.fs-c-buttonContainer--chooseDestination {
margin-top: 0;
padding-top: 15px
}
.fs-c-continueShopping {
padding: 15px 0
}
.c-singleSearch .fs-c-buttonContainer {
display: flex;
flex-direction: row;
gap: 20px;
padding: 20px 0;
width: 100%
}
.c-singleSearch .fs-c-buttonContainer > * {
flex-grow: 1
}
@media screen and (min-width:769px) {
.fs-c-buttonContainer.fs-c-buttonContainer--myPageTop {
display: block;
text-align: right
}
.fs-c-buttonContainer--myPageTop a {
border: 1px solid #000;
padding: .5rem 1rem
}
}
.fs-c-buttonContainer--routeSearch {
bottom: 5px;
position: fixed;
right: 5px;
transition: .3s;
z-index: 300
}
@media screen and (min-width:1020px) {
.fs-c-buttonContainer--routeSearch {
bottom: 20px;
display: none;
left: 20px
}
}
.blog-footer {
display: flex;
display: -webkit-flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 1056px;
padding-bottom: 120px;
width: 100%
}
.blog-footer h2 {
border: 1px solid #b6b6b6;
font-size: 18px;
font-weight: 400;
letter-spacing: .025em;
line-height: 48px;
margin: 0;
padding: 0;
text-align: center;
text-transform: none
}
.blog-footer #text-5 {
max-width: 480px;
width: 100%
}
.blog-footer .damz_archive_calender_sec {
padding-top: 30px
}
.blog-footer #text-5 .damz_archive_calender_sec {
position: relative
}
.blog-footer #text-5 .damz_archive_calender {
display: flex;
display: -webkit-flex;
justify-content: space-between;
list-style: none;
margin: 0;
padding: 0
}
.blog-footer #text-5 .damz_archive_calender .year {
border: 1px solid #ccc;
padding: 9px 9px 3px;
width: 229px
}
.blog-footer #text-5 .damz_archive_calender .year .year_title {
background-color: #efefef;
color: #a38000;
font-family: Noto Sans, sans-serif;
font-size: 12px;
height: 48px;
line-height: 48px;
margin-bottom: 6px;
text-align: center;
width: 48px
}
.blog-footer #text-5 .damz_archive_calender .year > ul {
display: flex;
display: -webkit-flex;
flex-wrap: wrap;
justify-content: space-between;
list-style: none;
margin: 0;
padding: 0
}
.blog-footer #text-5 .damz_archive_calender .year > ul .month {
background-color: #efefef;
color: #666;
font-family: Noto Sans, sans-serif;
font-size: 12px;
height: 48px;
line-height: 48px;
margin-bottom: 6px;
padding: 0;
text-align: center;
width: 48px
}
.blog-footer #text-5 .damz_archive_calender .year > ul .month a {
background-color: #a38000;
color: #fff;
display: block;
text-decoration: none
}
.blog-footer .damz_archive_calender.slick-initialized .slick-next,
.blog-footer .damz_archive_calender.slick-initialized .slick-prev {
top: -15px
}
.blog-footer .damz_archive_calender.slick-initialized .slick-prev {
left: 0
}
.blog-footer .damz_archive_calender.slick-initialized .slick-next {
right: 0
}
.blog-footer .damz_archive_calender.slick-initialized .slick-next:before,
.blog-footer .damz_archive_calender.slick-initialized .slick-prev:before {
color: #ccc
}
.blog-footer #text-6 {
max-width: 270px;
width: 100%
}
.blog-footer #text-6 .damz_archive_tag {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
list-style: none;
padding: 0
}
.blog-footer #text-6 .damz_archive_tag li a {
background-color: #efefef;
color: #666;
display: block;
font-family: Noto Sans, sans-serif;
font-size: 12px;
line-height: 20px;
margin-bottom: 12px;
padding: 0 25px;
text-decoration: none
}
.blog-footer #text-6 .damz_archive_tag li a:hover {
background-color: #a38000;
color: #fff
}
.blog-footer #text-7 {
max-width: 270px;
width: 100%
}
.blog-footer #text-7 .damz_archive_category {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
list-style: none;
padding: 0
}
.blog-footer #text-7 .damz_archive_category li a {
background-color: #efefef;
color: #666;
display: block;
font-family: Noto Sans, sans-serif;
font-size: 12px;
line-height: 20px;
margin-bottom: 12px;
padding: 0 25px;
text-decoration: none
}
.blog-footer #text-7 .damz_archive_category li a:hover {
background-color: #a38000;
color: #fff
}
.damz_archive_category li a:hover {
background: #a38000;
color: #fff
}
@media screen and (max-width:1019px) {
.blog-footer {
padding: 0 4.1vw 20px
}
.blog-footer #text-5,
.blog-footer #text-6,
.blog-footer #text-7 {
margin: 0 auto;
max-width: none;
width: 100%
}
.blog-footer h2 {
font-size: 20px;
height: 58px;
line-height: 58px
}
.blog-footer #text-5 .damz_archive_calender {
padding-bottom: 34px
}
.blog-footer #text-5 .damz_archive_calender .year {
margin-bottom: 13px;
max-width: 345px;
padding: 10px 10px 7px;
width: 100%
}
.blog-footer #text-5 .damz_archive_calender .year .year_title {
color: #a38000;
font-size: 16px;
height: 65px;
line-height: 65px;
margin-bottom: 8px;
width: 100%
}
.blog-footer #text-5 .damz_archive_calender .year > ul .month {
font-size: 16px;
height: 65px;
line-height: 65px;
margin-bottom: 8px;
max-width: 65px;
width: calc(50% - 4px)
}
.blog-footer #text-6 .damz_archive_tag {
margin-bottom: 21px;
margin-top: 13px
}
.blog-footer #text-6 .damz_archive_tag li a {
border: 1px solid #cbcbcb;
border-radius: 3px;
font-size: 16px;
line-height: 28px;
padding: 0 24px
}
.blog-footer #text-7 .damz_archive_category li a {
border: 1px solid #cbcbcb;
border-radius: 6px;
font-size: 16px;
line-height: 28px;
padding: 0 24px
}
}
#relatedblog h2 {
color: #a38000;
font-size: 40px;
font-weight: 700;
letter-spacing: .1em;
margin: 0;
padding-bottom: 68px;
text-align: center
}
@media screen and (max-width:767px) {
#relatedblog h2 {
font-size: 2.4rem;
line-height: 1.2
}
}
#relatedblog .postlist,
#relatedblog .postlist--related {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 1000px;
padding-bottom: 53px;
width: 100%
}
#relatedblog .postlist a,
#relatedblog .postlist--related a {
color: #333
}
#relatedblog .postlist a article,
#relatedblog .postlist--related a article {
border-bottom: 2px solid #c9c9c9;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom: 61px;
padding-bottom: 17px;
width: 280px
}
#relatedblog .postlist a article .image,
#relatedblog .postlist--related a article .image {
background-color: #aaa;
height: 147px;
width: 100%
}
#relatedblog .postlist a article img,
#relatedblog .postlist--related a article img {
height: 100%;
object-fit: cover;
width: 100%
}
#relatedblog .postlist a article .title,
#relatedblog .postlist--related a article .title {
font-size: 18px;
font-weight: 700;
height: 80px;
letter-spacing: .1em;
line-height: 1.167;
padding-bottom: 21px;
padding-top: 17px;
width: 100%
}
#relatedblog .postlist a article .category,
#relatedblog .postlist a article .information,
#relatedblog .postlist--related a article .category,
#relatedblog .postlist--related a article .information {
font-family: Noto Sans, sans-serif;
font-size: 12px;
font-weight: 400
}
.privacy {
font-size: 18px;
padding: 0 10px
}
.home #main .information li.post img {
height: 100%;
object-fit: cover;
width: 100%
}
.c-paymentList {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 10px;
padding: 0
}
.c-paymentList__item {
width: 26px
}
.c-paymentList__item > span {
display: block;
position: relative;
width: 100%
}
.c-paymentList__item > span:before {
content: "";
display: block;
padding-top: 100%
}
.c-paymentList__item > span > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-paymentList__item > span .paymentCach {
align-items: center;
background: #050302;
border-radius: 5px;
color: #fff;
display: flex;
font-size: 1.2rem;
justify-content: center
}
.c-paymentList__item > span .paymentCach .label {
font-size: .9rem
}
.c-paymentList__item > span span img {
height: 100%;
width: 100%
}
.c-buttonContainer {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 6px
}
.c-button,
.c-button--border,
.c-button--filled {
align-items: center;
display: flex;
flex-grow: 1;
justify-content: center
}
.c-button--border > *,
.c-button--filled > *,
.c-button > * {
display: block
}
.c-button--border {
border: 1px solid #000;
box-sizing: border-box
}
.c-button--filled {
background: #000;
box-sizing: border-box;
color: #fff
}
#footerInfo,
#footerInfo .layoutInner {
height: 50px
}
#footerInfo {
background-color: #a78000
}
#footerInfo .layoutInner {
align-items: center;
display: flex;
justify-content: center;
padding: 0 20px
}
#footerInfo .contact {
color: #231815;
font-size: 2rem;
font-weight: 700;
height: 50px;
line-height: 50px;
padding-left: 33px;
position: relative
}
#footerInfo .contact:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_mail.svg);
content: "";
display: block;
height: 20px;
left: 0;
position: absolute;
top: 5px;
width: 26px
}
#footerInfo .tel {
color: #231815;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 700;
height: 50px;
line-height: 50px;
padding-left: 33px;
padding-right: 5px;
position: relative
}
#footerInfo .tel:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_tel.svg);
content: "";
display: block;
height: 20px;
left: 0;
position: absolute;
top: 5px;
width: 26px
}
#footerInfo .open {
color: #231815;
font-size: 1.2rem;
height: 50px;
line-height: 46px;
padding-top: 4px
}
@media screen and (max-width:768px) {
#footerInfo,
#footerInfo .layoutInner {
height: auto
}
#footerInfo .layoutInner {
display: block;
padding: 20px
}
#footerInfo span {
display: block;
margin: 0 auto
}
#footerInfo .contact {
height: 30px;
line-height: 30px;
margin: 0 auto;
padding-right: 0;
width: 132px
}
#footerInfo .contact:before {
top: 5px
}
#footerInfo .tel {
height: 30px;
line-height: 30px;
padding-right: 0;
width: 170px
}
#footerInfo .tel:before {
top: 5px
}
#footerInfo .open {
height: 15px;
line-height: 15px;
padding: 0;
width: 227px
}
}
#footerMain {
background-color: #231815;
height: 120px;
position: relative
}
#footerMain .layoutInner {
display: flex;
padding: 0 20px
}
#masthead .logo a,
#masthead .logo a img {
display: block;
margin: 0;
padding: 0
}
#footerMain .logo {
padding-top: 49px;
width: 184px
}
#footerMain .menus {
width: calc(100% - 184px)
}
#footerMain .menus .menu {
display: flex;
font-family: "Noto Serif JP", serif;
font-size: 1.2rem;
margin: 0;
padding: 0
}
#footerMain .menus #menu_footer-sns {
padding-top: 26px
}
#footerMain .menus .menu a {
color: #fff;
display: block;
padding-right: 21px;
text-decoration: none
}
#footerMain .menus #menu_footer-sns a:before {
background-repeat: no-repeat;
content: "";
display: inline-block;
height: 14px
}
#footerMain .menus #menu_footer-sns .facebook a:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg);
width: 16px
}
#footerMain .menus #menu_footer-sns .instagram a:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg);
width: 18px
}
#footerMain .menus #menu_footer-sns .twitter a:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg);
width: 22px
}
#footerMain .menus #menu_footer-sns .youtube a:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_youtube.svg);
width: 16px
}
#footerMain .menus #menu_footer {
font-size: 1.1rem;
padding-top: 13px
}
#footerMain .menus .copyright {
color: #fff;
font-family: Noto Sans, sans-serif;
font-size: 1rem;
padding-top: 12px;
text-align: right
}
#footerMain .gotop {
position: absolute;
right: 65px;
top: 15px
}
@media screen and (max-width:768px) {
#footerMain {
height: auto
}
#footerMain .layoutInner {
flex-wrap: wrap;
padding: 15px 0
}
#footerMain .logo {
padding: 0;
width: 100%
}
#footerMain .logo img {
display: block;
margin: 0 auto
}
#footerMain .menus {
width: 100%
}
#footerMain .menus .menu {
display: none
}
#footerMain .menus .copyright {
padding-top: 0;
text-align: center;
width: 100%
}
#footerMain .gotop {
right: 15px
}
body {
font-size: 12px;
font-size: 1.2rem
}
main .content .text1 {
padding: 0 5px
}
#relatedblog .postlist,
#relatedblog .postlist--related {
justify-content: space-around
}
}
#site {
position: relative
}
span.open {
display: block;
font-size: 14px;
text-align: center
}
main .content {
margin: 20px auto 0;
max-width: 1200px;
width: 100%
}
.svgOutline {
display: none
}
.isBlur {
animation: fadeInBlur 1s ease;
-webkit-filter: blur(3px);
filter: blur(3px)
}
.isOutBlur {
animation: fadeOutBlur 1s ease
}
.alignleft {
display: inline;
float: left;
margin-right: 1.5em
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em
}
.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto
}
.layoutInner,
.layoutOuter {
margin: 0 auto;
width: 100%
}
.layoutInner {
max-width: 1000px
}
.shoplist_wrap h2 {
text-align: center
}
.shoplist_wrap .subtitle {
font-size: 1.8rem;
line-height: 1.5;
position: relative;
text-align: center
}
.shoplist_wrap .subtitle:before {
background-color: #555;
bottom: 10px;
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%;
z-index: -2
}
.shoplist_wrap .subtitle:after {
background-color: #fff;
bottom: 5px;
content: "";
display: block;
height: 10px;
left: calc(50% - 150px);
position: absolute;
width: 300px;
z-index: -1
}
.shoplist {
color: #555
}
.shoplist.flex-container {
flex-wrap: wrap
}
.shoplist .flex-item {
margin: 30px;
width: calc(50% - 60px)
}
.shoplist .branch {
font-size: 24px
}
.shoplist .addr,
.shoplist .tel {
font-size: 14px;
margin-bottom: 10px
}
.shoplist .maplink a:before {
content: ""
}
.shoplist .maplink a:before,
.shoplist .tel .icon_tel:before {
font-family: Font Awesome\ 5 Free;
font-weight: 900;
margin-right: 5px
}
.shoplist .tel .icon_tel:before {
content: ""
}
.shoplist .sns .icon_fb:before {
content: "";
font-family: Font Awesome\ 5 Brands
}
.shoplist .sns .icon_ig:before {
content: "";
font-family: Font Awesome\ 5 Brands
}
.shoplist .sns .icon_tw:before {
content: "";
font-family: Font Awesome\ 5 Brands
}
.shoplist .sns {
color: #ddd
}
.shoplist .sns a {
color: #555
}
.shoplist .sns > * {
margin-left: 40px
}
.shoplist .sns > :first-child {
margin-left: 0
}
.shoplist .sns .icon_fb span,
.shoplist .sns .icon_ig span,
.shoplist .sns .icon_tw span {
display: inline-block;
height: 1px;
overflow: hidden;
text-indent: 100%;
width: 1px
}
@media screen and (max-width:600px) {
.shoplist.flex-container {
display: block
}
.shoplist .flex-item {
margin: 30px 0;
width: 100%
}
}
.c-shopListTitle h3 {
font-size: 3.6rem;
text-align: center
}
@media screen and (max-width:767px) {
.c-shopListTitle h3 {
font-size: 2rem
}
}
.c-shopList {
display: block;
padding: 10px 0;
width: 100%
}
.c-shopList .slick-arrow {
display: none
}
.c-shopList .slick-list .c-shopList__item {
padding: 6px
}
@media screen and (max-width:767px) {
.c-shopList .slick-list {
display: flex;
flex-direction: column;
padding: 0 10% 0 0 !important
}
.c-shopList .slick-prev {
left: 20px;
top: 0
}
.c-shopList .slick-prev:before {
color: #000
}
.c-shopList .slick-next {
left: 60px;
top: 0
}
.c-shopList .slick-next:before {
color: #000
}
.c-shopList__item {
padding: 5px 10px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopList .slick-arrow {
display: block;
top: 0
}
.c-shopList .slick-next {
right: 0
}
}
.c-otherShopList {
display: flex;
flex-direction: column;
width: 100%
}
.c-otherShopList__image {
order: 1
}
.c-otherShopList__image,
.c-otherShopList__image img {
height: auto;
line-height: 0;
margin: 0;
padding: 0;
width: 100%
}
.c-otherShopList__image img {
font-size: 0
}
.c-otherShopList__title {
font-size: 1.5rem;
line-height: 2.4rem;
margin-bottom: 0;
order: 2
}
.c-otherShopList__address {
font-size: 1.2rem;
line-height: 2.4rem;
order: 3
}
@media screen and (max-width:767px) {
.c-otherShopList__title {
font-size: 3.8vw;
line-height: 4.6vw
}
.c-otherShopList__address {
font-size: 3.2vw;
line-height: 4.6vw
}
}
@media screen and (max-width:1020px) {
.site-footer {
padding-bottom: 64px
}
}
.Go-online {
color: #333;
display: block;
font-size: 18px;
letter-spacing: .1em;
text-align: center;
width: 350px
}
.flex-container {
display: flex
}
.flex-justify-center {
justify-content: center
}
.flex-justify-spacebetween {
justify-content: space-between
}
.bg_gray {
background-color: #f8f8f8
}
.single .w1000 {
margin: 0 auto;
max-width: 1000px
}
.single .w800 {
margin: 0 auto;
max-width: 800px
}
.single .w700 {
margin: 0 auto;
max-width: 700px
}
.single .w660 {
margin: 0 auto;
max-width: 660px
}
.single .w580 {
margin: 0 auto;
max-width: 580px
}
.single .txt_caution {
color: darkred
}
.single .box_shadow {
box-shadow: 5px 5px 10px rgba(0, 0, 0, .2)
}
.single .box_wb {
background-color: #fff;
border: 1px solid #707070
}
.single .box_gw {
background-color: #f8f8f8;
border: 1px solid #fff
}
.single .flex-wrap {
flex-wrap: wrap
}
.single .flex1col {
margin: 0 auto;
width: 100%
}
.single .flex1col .flex-item {
width: 100%
}
.single .w800 .product_image img {
max-height: none;
max-width: none
}
.single .product1col .product_title {
color: #a78000;
font-size: 15px;
line-height: 20px;
margin: 0 auto;
max-width: 424px;
text-align: center
}
.single .product_content {
margin: 20px auto 0
}
.single .product_info.bg_gray {
padding: 30px 0
}
.single .product_spec {
margin-top: 60px
}
.single .product_spec.w580 {
margin-top: 0
}
.single .product_spec.box_gw {
color: initial;
font-size: 13px;
padding: 20px 10%
}
.single .product_spec.box_wb {
color: initial;
font-size: 13px;
padding: 20px 23%
}
.single .summary_point {
font-size: 12px;
margin-top: 60px;
padding: 0
}
.single .summary_point li {
border-top: 1px solid #aaa;
padding: 8px 2% 8px 20%
}
.single .summary_point li:last-child {
border-bottom: 1px solid #aaa
}
.single .summary_point li span.check:before {
content: "";
font-family: Font Awesome\ 5 Free;
font-weight: 900;
padding-right: 20px
}
.single .product_note {
margin-top: 60px
}
.single .product_note.box_gw {
font-size: 13px;
padding: 20px
}
.single .product1col .product_link {
margin-left: auto;
margin-right: auto;
max-width: 312px
}
.single .summary_title {
font-size: 36px;
text-align: center
}
.single .flex2col {
margin: 0 auto;
width: 100%
}
.single .flex2col .flex-item {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 36px;
max-width: 312px;
width: calc(50% - 18px)
}
.single .flex2col .flex-item:nth-child(odd) {
margin-left: 0
}
.single .flex3col {
margin: 0 auto;
width: 100%
}
.single .flex3col .flex-item {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 20px;
max-width: 312px;
width: calc(33.33333% - 13.33333px)
}
.single .flex3col .flex-item:nth-child(3n+1) {
margin-left: 0
}
.flex21w > .flex-container {
flex-direction: column;
margin-left: 20px
}
.flex21w > .flex-container .flex-item {
margin-top: 20px
}
.flex21w > .flex-container .flex-item:first-child {
margin-top: 0
}
.flex11w > div {
margin-left: 20px;
margin-top: 20px
}
.flex11w > div:nth-child(-n+2) {
margin-top: 0
}
.flex11w > div:nth-child(odd) {
margin-left: 0
}
.flex111w > div {
margin-left: 20px;
margin-top: 20px
}
.flex111w > div:nth-child(-n+3) {
margin-top: 0
}
.flex111w > div:nth-child(3n+1) {
margin-left: 0
}
.single .div_wrapper {
margin: 0 auto;
padding-bottom: 60px
}
.single .product_image {
text-align: center
}
.single .product_image img {
height: auto;
max-height: 312px;
max-width: 312px;
vertical-align: top;
width: 100%
}
.single .product_image img.w642 {
max-height: 642px;
max-width: 642px
}
.single .flex1col .product_image img {
max-height: 660px;
max-width: 660px
}
.single .product_info {
margin-top: 10px
}
.single .product_info .product_code {
border: 1px solid;
display: inline-block;
font-size: 12px;
padding: 5px 10px
}
.single .product_color {
font-size: 12px;
padding: 5px 0;
text-align: right
}
.single .product_summary {
color: #a78000;
font-size: 15px;
line-height: 20px;
margin-top: 10px
}
.single .product_price {
margin-top: 30px;
text-align: right
}
.single .product_price .product_price_value {
font-size: 17px
}
.single .product_price .product_price_addon {
font-size: 10px
}
.single .product_link {
margin-top: 20px
}
.single .product_link button {
background-color: #000;
border: none;
color: #fff;
cursor: pointer;
font-size: 18px;
line-height: 1;
outline: none;
padding: 20px;
text-align: center;
width: 100%
}
@media screen and (max-width:900px) {
.flex3col .flex-item .product_info {
flex-wrap: wrap
}
}
@media screen and (max-width:600px) {
.flex2col .flex-item .product_info {
flex-wrap: wrap
}
}
@media screen and (max-width:480px) {
.single .flex-container {
display: block
}
.single .flex-container.product_info {
display: flex
}
.single .flex2col .flex-item,
.single .flex3col .flex-item {
margin: 60px auto;
width: 100%
}
.single .flex2col .flex-item:nth-child(odd),
.single .flex3col .flex-item:nth-child(3n+1) {
margin-left: auto
}
.single .flex3col.w1000 .flex-item {
margin-bottom: 0;
margin-top: 0
}
.single .flex-container.flex2col.w660 {
display: flex
}
.single .flex-container.flex2col.w660 .flex-item {
margin: 0 0 0 20px
}
.single .flex-container.flex2col.w660 .flex-item:first-child {
margin-left: 0
}
.single .flex21w.w1000 .flex-container {
display: flex;
flex-direction: row;
margin-left: 0
}
.single .flex21w.w1000 .flex-item {
margin-left: 20px;
margin-top: 20px
}
.single .flex21w.w1000 .flex-item:first-child {
margin-left: 0
}
.single .flex-container.flex111w.w1000 .flex-item,
.single .flex-container.flex11w.w660 .flex-item {
margin: 0 auto 20px !important
}
}
.page h1 {
color: #a38000;
font-size: 4rem;
font-weight: 700;
padding-top: 87px
}
.page h1,
.page h2 {
letter-spacing: .1em;
margin: 0;
text-align: center
}
.page h2 {
color: #333;
font-size: 25px;
font-weight: 400;
line-height: 1.2; }
.page .table1 {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 800px;
padding-bottom: 150px;
padding-top: 80px;
width: 100%
}
.page .table1 .td,
.page .table1 .th {
border-top: 1.21px solid #efefef;
height: 54px;
line-height: 53px;
padding-left: 20px
}
.page .table1 .th {
max-width: 180px;
width: 100%
}
.page .table1 .td {
letter-spacing: .1em;
max-width: calc(100% - 200px);
width: 100%
}
.page .table1 div:last-of-type,
.page .table1 div:nth-last-of-type(2) {
border-bottom: 1.21px solid #efefef;
height: 55.2px
}
@media screen and (max-width:767px) {
.page .table1 {
padding-left: 10px;
padding-right: 10px
}
.page .table1 .td,
.page .table1 .th {
font-size: 1.2rem
}
.page .table1 .th {
max-width: 100px
}
.page .table1 .td {
max-width: calc(100% - 110px)
}
}
.page .text1 {
color: #333;
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 2;
padding-top: 75px;
text-align: center
}
.page .text2,
.page .text3 {
color: #333;
font-size: 2.5rem;
letter-spacing: .1em;
line-height: 1.2
}
.page .text2 {
text-align: center
}
.page .text3 {
text-align: left
}
.page .list1 {
margin: 0 auto;
max-width: 960px;
padding: 0 0 35px;
width: 100%
}
.page .list1 li {
border-top: 1px solid #c2c2c2;
padding-bottom: 60px;
padding-top: 38px
}
.page .list1 li h2 {
color: #333;
font-size: 2.5rem;
letter-spacing: .1em;
padding: 0;
text-align: left
}
.page .list1 li .fc_yellow {
color: #a38000
}
.page .list1 li .text {
font-size: 15px;
letter-spacing: .05em;
line-height: 1.5;
padding-top: 9px;
text-align: justify
}
.page .list1 li .text small {
font-size: 12px
}
.page .list1 li .text2,
.page .list1 li .text3 {
font-size: 1.4rem;
letter-spacing: .025em;
line-height: 1.71428571;
margin: 0 auto;
max-width: 725px;
width: 100%
}
.page .list1 li .flexbox {
display: flex;
flex-wrap: wrap;
justify-content: left;
padding-top: 13px
}
.page .list1 li .flexbox .col {
color: #333;
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75
}
.page .list1 li .flexbox .col a {
color: #333
}
.page .list1 li .flexbox .col1 {
width: 204px
}
.page .list1 li .flexbox .col2 {
width: 188px
}
.page .list1 li .flexbox .col3 {
font-family: "Noto Serif JP", serif;
text-align: center;
width: 142px
}
.page .list1 li .flexbox .col3 img {
vertical-align: bottom;
width: 100%
}
@media screen and (max-width:767px) {
.page .list1 li {
padding-left: 10px;
padding-right: 10px
}
}
.page .list_brand {
margin: 0 auto;
max-width: 660px;
padding: 106px 0 0;
width: 100%
}
.page .list_brand li {
padding-bottom: 49px
}
.page .list_brand li .country {
border: 1px solid #c2c2c2;
font-size: 1.8rem;
height: 50px;
letter-spacing: .1em;
line-height: 48px;
margin: 0 auto;
max-width: 270px;
text-align: center;
width: 100%
}
.page .list_brand li .brands {
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 1.4;
padding-top: 52px;
text-align: center
}
.page .list_shop .regions {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0;
padding: 26px 0 39px
}
.page .list_shop .regions li {
font-size: 1.5rem;
font-weight: 700;
height: 24px;
letter-spacing: .1em;
margin: 0 9px
}
.page .list_shop .regions li.current {
border-bottom: 1px solid #333
}
.page .list_shop .shops .shopname {
background-color: #efefef;
font-size: 1.5rem;
height: 40px;
line-height: 40px;
margin: 0 auto;
max-width: 1000px;
padding: 0;
width: 100%
}
.page .list_shop .shops .stores {
margin: 0 auto;
max-width: 1000px;
padding: 31px 0 24px;
width: 100%
}
.page .list_shop .shops .stores li {
border-bottom: 1px solid #efefef;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-bottom: 45px
}
.page .list_shop .shops .stores li .thumbnail {
max-width: 450px;
width: 100%
}
.page .list_shop .shops .stores li .thumbnail img {
width: 100%
}
.page .list_shop .shops .stores li:nth-child(n+2) {
padding-top: 48px
}
.page .list_shop .shops .stores li:last-child {
border-bottom: none
}
.page .list_shop .shops .stores li .information {
max-width: calc(100% - 450px);
padding-left: 3.3vw;
width: 100%
}
.page .list_shop .shops .stores li .information .storename {
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 1.4;
margin: 0
}
.page .list_shop .shops .stores li .information .info {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75
}
.page .list_shop .shops .stores li .information .access {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75;
padding-top: 29px
}
.page .list_shop .shops .stores li .information .access .parking {
display: inline-block;
height: 21px;
padding-left: 23px;
position: relative
}
.page .list_shop .shops .stores li .information .access .parking:before {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/img/page/list_shop/icon_pin.svg);
background-position-x: 3px;
background-repeat: no-repeat;
content: "";
display: block;
height: 21px;
left: 0;
position: absolute;
width: 21px
}
.page .list_shop .shops .stores li .information .sns {
display: flex;
padding-left: 6px;
padding-top: 23px
}
.page .list_shop .shops .stores li .information .sns .icon {
margin-right: 15px
}
.page .list_shop .shops .stores li .information .sns .facebook {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/img/page/list_shop/icon_facebook.svg);
height: 16px;
width: 12px
}
.page .list_shop .shops .stores li .information .sns .instagram {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/img/page/list_shop/icon_instagram.svg);
height: 16px;
width: 13px
}
.page .list_shop .shops .stores li .information .sns .twitter {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/img/page/list_shop/icon_twitter.svg);
height: 16px;
width: 16px
}
.page .list_shop .shops .stores li .information .sns .googlemap {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/img/page/list_shop/icon_googlemap.svg);
height: 16px;
width: 91px
}
.page .list_shop .shops .onlinestores {
border-bottom: 1px solid #efefef;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 auto 150px;
max-width: 1000px;
padding: 0;
width: 100%
}
.page .list_shop .shops .onlinestores li {
align-items: center;
border-right: 1px solid #efefef;
display: flex;
height: 80px;
margin-bottom: 15px;
margin-top: 11px;
max-width: 333px;
width: 33.3333333333%
}
.page .list_shop .shops .onlinestores li:nth-child(3n) {
border-right: none
}
.page .list_shop .shops .onlinestores li span {
font-size: 1.5rem;
font-weight: 700;
letter-spacing: .1em;
line-height: 1.4;
text-align: center;
width: 100%
}
@media screen and (max-width:768px) {
.page .list_shop .shops .stores li {
justify-content: center
}
.page .list_shop .shops .stores li .information {
max-width: none;
padding: 10px;
text-align: center
}
.page .list_shop .shops .stores li .information .sns {
justify-content: center;
padding-left: 0
}
.page .list_shop .shops .onlinestores {
border: none
}
.page .list_shop .shops .onlinestores li {
border: none;
border-bottom: 1px solid #efefef;
max-width: none;
width: 100%
}
}
.page .frame1 {
border: 6px solid #efefef;
margin: 48px auto 140px;
max-width: 1000px;
width: 100%
}
.page .frame1 h3 {
background-color: #efefef;
height: 34px;
line-height: 30px;
margin: 0
}
.page .frame1 .text,
.page .frame1 h3 {
color: #333;
font-size: 1.5rem;
text-align: center
}
.page .frame1 .text {
letter-spacing: .1em;
line-height: 2;
padding-top: 39px
}
.page .frame1 .table {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 800px;
padding: 34px 10px 39px;
width: 100%
}
.page .frame1 .table .td,
.page .frame1 .table .th {
border-top: 1.21px solid #efefef;
line-height: 21px;
min-height: 54px;
padding-bottom: 12px;
padding-left: 20px;
padding-top: 16px
}
.page .frame1 .table .th {
font-size: 2rem;
max-width: 180px;
width: 100%
}
.page .frame1 .table .td {
font-size: 2rem;
letter-spacing: .1em;
max-width: calc(100% - 200px);
width: 100%
}
.page .frame1 .table .td big {
font-size: 2.5rem;
font-weight: 700;
letter-spacing: .1em;
line-height: 33px
}
.page .frame1 .table .td a {
color: #333
}
@media screen and (max-width:768px) {
.page .frame1 .table .td,
.page .frame1 .table .th {
max-width: none;
text-align: center
}
}
.page .frame2 {
border-top: 1px solid #c2c2c2;
margin: 35px auto 0;
max-width: 960px;
width: 100%
}
.page .frame2 h2 {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 2.6rem;
font-weight: 700;
letter-spacing: .02em;
margin: 0 auto;
max-width: 860px;
padding-top: 38px;
text-align: left;
width: 100%
}
.page .frame2 h2 small {
font-size: 1.4rem;
font-weight: 400;
padding-left: 13px
}
.page .frame2 .description {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 1.4rem;
letter-spacing: .02em;
margin: 0 auto;
max-width: 860px;
padding-top: 4px;
width: 100%
}
.page .frame2 .f_list1 {
margin: 0 auto;
max-width: 860px;
padding: 33px 0 0;
width: 100%
}
.page .frame2 .f_list1,
.page .frame2 .f_list1 li {
display: flex;
flex-wrap: wrap;
justify-content: space-between
}
.page .frame2 .f_list1 li {
align-self: baseline;
width: 400px
}
.page .frame2 .f_list1 li:nth-child(2) {
padding-bottom: 59px
}
.page .frame2 .f_list1 li:nth-child(n+3) {
border-top: 1px solid #c2c2c2;
padding-bottom: 51px;
padding-top: 37px
}
.page .frame2 .f_list1 li:nth-child(6) .text {
margin-top: 11px
}
.page .frame2 .f_list1 li h3 {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 2rem;
font-weight: 300;
letter-spacing: .03em;
line-height: 46px;
margin: 0;
width: 100%
}
.page .frame2 .f_list1 li .text {
color: #333;
font-size: 1.4rem;
letter-spacing: .03em;
line-height: 1.72;
padding-top: 3px;
width: 100%
}
.page .frame2 .f_list1 li .text a {
color: #333
}
.page .frame2 .f_list1 li .text a.underline {
text-decoration: underline
}
.page .frame2 .f_list1 li .number {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 1.3rem;
width: 20px
}
.page .frame2 .f_list1 li .text2 {
padding-bottom: 12px
}
.page .frame2 .f_list1 li .text2,
.page .frame2 .f_list1 li .text3 {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 1.3rem;
line-height: 1.54;
width: calc(100% - 20px)
}
.page .frame2 .f_list1 li .text3 {
padding-bottom: 2px
}
.page .frame2 .f_list1 li .button {
padding-top: 13px
}
.page .frame2 .f_list1 li .button a {
align-items: center;
border: 1px solid #c2c2c2;
color: #333;
display: flex;
justify-content: center;
padding-bottom: 8px;
padding-top: 4px;
position: relative;
text-align: center;
width: 231px
}
.page .frame2 .f_list1 li .button a:after {
content: ">";
position: absolute;
right: 9px
}
.page .frame2 .f_list1 li .button a span {
font-size: 1.8rem;
letter-spacing: .1em;
line-height: 19px
}
.page .frame2 .f_list1 li .button a span small {
font-size: 1.4rem;
letter-spacing: .05em;
line-height: 22px
}
@media screen and (max-width:768px) {
.page .frame2 .description,
.page .frame2 h2 {
padding-left: 10px;
padding-right: 10px
}
.page .frame2 .f_list1 {
justify-content: space-around
}
.page .frame2 .f_list1 li {
padding: 0 10px;
width: 100%
}
}
.page .frame3 {
border: 6px solid #efefef;
margin: 0 auto;
max-width: 1000px;
width: 100%
}
.page .frame3 .head {
background-color: #efefef;
display: flex;
height: 48px
}
.page .frame3.open .head {
height: 54px
}
.page .frame3 .head h3 {
color: #333;
font-size: 18px;
font-weight: 700;
height: auto;
letter-spacing: .1em;
line-height: 48px;
margin: 0;
padding-left: 45px;
text-align: left;
width: calc(100% - 84px)
}
.page .frame3 .head .button {
height: 48px;
position: relative;
width: 50px
}
.page .frame3 .head .button span {
background-color: #333;
height: 2.579px;
left: 18px;
position: absolute;
top: 50%;
width: 19.341px
}
.page .frame3 .head .button span:after {
border-top: 2.579px solid #333;
content: "";
display: block;
left: 0;
position: absolute;
transform: rotate(-90deg);
transition: all .3s ease;
width: 19.341px
}
.page .frame3.open .head .button span:after {
transform: rotate(0)
}
.page .frame3 .body {
max-height: 0;
overflow: hidden;
transition: all 2s linear
}
.page .frame3.open .body {
max-height: 3000px
}
.page .frame3 .body .text {
color: #333;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: .1em;
text-align: center
}
.page .frame3 .body .table {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 800px;
padding: 48px 10px 23px;
width: 100%
}
.page .frame3 .body .table .td,
.page .frame3 .body .table .th {
border-top: 1.21px solid #efefef;
line-height: 2;
min-height: 54px;
padding-bottom: 10px;
padding-left: 20px;
padding-top: 12px
}
.page .frame3 .body .table .th {
max-width: 180px;
width: 100%
}
.page .frame3 .body .table .td {
font-size: 1.5rem;
letter-spacing: .05em;
max-width: calc(100% - 200px);
width: 100%
}
.page .frame3 .body .images {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto;
max-width: 800px;
width: 100%
}
.page .frame3 .body .images img {
height: 150px;
margin-bottom: 10px;
width: 152px
}
@media screen and (max-width:768px) {
.page .frame3 .head h3 {
font-size: 14px;
letter-spacing: 0;
padding-left: 5px;
width: calc(100% - 25px)
}
.page .frame3 .body .table .td,
.page .frame3 .body .table .th {
max-width: none;
text-align: center
}
}
.page .form1 {
margin: 0 auto;
max-width: 725px;
padding-left: 13px;
padding-top: 30px;
width: 100%
}
.page .form1 label {
display: block;
padding-bottom: 6px
}
.page .form1 input[type=email] {
background: none;
border: 1px solid #c2c2c2;
border-radius: 6px;
color: #b0b0b0;
display: block;
font-family: Playfair Display, "Noto Serif JP", serif;
font-size: 16px;
height: 31px;
margin-bottom: 21px;
max-width: 530px;
padding-left: 12px;
width: 100%
}
.page .form1 input[type=submit] {
background-color: #4a7cd3;
border: none;
border-radius: 6px;
color: #fff;
font-family: Playfair Display, "Noto Serif JP", serif;
font-size: 1.6rem;
height: 30px;
margin-top: 21px;
width: 160px
}
.page .form2 {
margin: 0 auto;
max-width: 530px;
padding: 10px 10px 130px;
width: 100%
}
.page .form2 .title {
font-size: 1.6rem;
letter-spacing: normal
}
.page .form2 .input input[type=email],
.page .form2 .input input[type=text] {
background: none;
border: 1px solid #c2c2c2;
border-radius: 6px;
font-family: Playfair Display, "Noto Serif JP", serif;
font-size: 1.6rem;
height: 32px;
margin-bottom: 21px;
margin-top: 6px;
padding-left: 11px;
width: 100%
}
.page .form2 .input_postalcode {
display: flex;
justify-content: flex-start
}
.page .form2 .input_postalcode input[type=text] {
width: 140px
}
.page .form2 .input_postalcode .button_zip2addr {
background-color: #c1c1c1;
border-radius: 12px;
color: #fff;
font-size: 1.2rem;
height: 25px;
line-height: 24px;
margin-left: 10px;
margin-top: 10px;
text-align: center;
width: 120px
}
.page .form2 .input_pref select {
font-family: Playfair Display, "Noto Serif JP", serif;
font-size: 1.8rem;
padding-bottom: 26px;
padding-left: 8px;
padding-top: 6px
}
.page .form2 .title_inquiry {
color: #333;
letter-spacing: .1em
}
.page .form2 .select {
padding-bottom: 17px
}
.page .form2 .select .horizontal-item {
display: block;
margin: 0
}
.page .form2 .select .horizontal-item input[type=checkbox] {
display: none
}
.page .form2 .select .horizontal-item span {
color: #333;
display: block;
font-size: 1.2rem;
letter-spacing: .1em;
padding-bottom: 1px;
padding-left: 21px;
padding-top: 3px;
position: relative
}
.page .form2 .select .horizontal-item span:after,
.page .form2 .select .horizontal-item span:before {
content: "";
display: block;
position: absolute
}
.page .form2 .select .horizontal-item span:before {
border-bottom: 2px solid #666;
border-right: 2px solid #666;
height: 7px;
left: 5px;
margin-top: -2px;
opacity: 0;
top: 9px;
transform: rotate(42deg);
width: 3px
}
.page .form2 .select .horizontal-item span:after {
border: 1px solid #c2c2c2;
border-radius: 2px;
height: 12px;
left: 0;
margin-top: -15px;
width: 12px
}
.page .form2 .select .horizontal-item input[type=checkbox]:checked + span:before {
opacity: 1
}
.page .form2 .input_others textarea {
background: none;
border: 1px solid #c2c2c2;
border-radius: 6px;
height: 128px;
margin-top: 6px;
width: 100%
}
.page .form2 .buttons input[type=submit] {
background-color: #000;
border: none;
border-radius: 15px;
color: #fff;
font-family: Playfair Display, "Noto Serif JP", serif;
font-size: 1.6rem;
height: 60px;
line-height: 30px;
margin-top: 36px;
max-width: 300px;
width: 100%
}
.mw_wp_form .mw_wp_form_confirm .mw_wp_form_preview {
font-size: 20px
}
.page-mailmagazine h1,
.page-notes h1 {
letter-spacing: .2em;
padding-top: 54px
}
.page-mailmagazine h1,
.page-notes h1,
.page-reassurance h1 {
color: #231815;
font-size: 2.4rem;
font-weight: 700;
margin: 0;
text-align: center
}
.page-reassurance h1 {
font-family: "Noto Serif JP", serif;
letter-spacing: .1em;
padding-top: 64px
}
.page-mailmagazine h1,
.page-notes h1 {
padding-bottom: 44px
}
.page-mailmagazine .list1 li {
padding-top: 47px
}
.page-staffwanted h2 {
padding-top: 78px
}
.page-staffwanted .text1 {
margin: 0 auto;
max-width: 730px;
padding-bottom: 43px;
padding-top: 16px;
width: 100%
}
.page-staffwanted .frame3 {
margin-bottom: 23px
}
.page-staffwanted .frame3 .body .text {
padding-top: 53px
}
.page-staffwanted .frame3 .body .images {
padding-bottom: 52px
}
.page-shopinfo h2 {
color: #a38000;
font-size: 4rem;
font-weight: 700;
letter-spacing: .1em;
padding-top: 112px
}
.page-shopinfo h2.shoplist {
padding-top: 90px
}
.page-shopinfo h3 {
font-size: 4rem;
font-weight: 700;
letter-spacing: .1em;
margin: 0;
padding-top: 16px;
text-align: center
}
.page-shopinfo .text1 {
padding-top: 21px
}
.page-contact h1 {
padding-bottom: 37px;
padding-top: 27px
}
.table {
margin-bottom: 20px;
max-width: 100%;
width: 100%
}
.table-hover > tbody > tr:hover {
background-color: #f5f5f5
}
dt {
display: block;
font-weight: 700
}
.page .description {
line-height: 26px;
margin-top: 100px;
overflow: hidden;
text-align: center
}
.request .mw_wp_form_input input {
border: 1px solid #b5b5b5;
border-radius: 15px;
font-size: 18px;
font-weight: 400;
height: 60px;
margin: 30px auto;
padding-left: 26px
}
.request .mw_wp_form_input .button {
background-color: #000;
border-radius: 45px;
color: #fff;
display: block;
font-size: .8em;
font-weight: 400;
line-height: 46px;
margin: 0 auto;
text-align: center;
text-decoration: none;
width: 50%
}
.page-contact-p {
font-size: .6em
}
.mw_wp_form .error {
color: #b70000;
display: block;
font-size: .7em;
margin-top: -20px
}
.page .entry-content #mw_wp_form_mw-wp-form-524.mw_wp_form_complete,
.page .entry-content #mw_wp_form_mw-wp-form-74.mw_wp_form_complete {
text-align: center
}
.page .entry-content #mw_wp_form_mw-wp-form-524.mw_wp_form_complete h2,
.page .entry-content #mw_wp_form_mw-wp-form-74.mw_wp_form_complete h2 {
font-size: 24px;
font-weight: 500;
line-height: 24px;
margin-bottom: 33px;
margin-top: 39px
}
.page .entry-content #mw_wp_form_mw-wp-form-524.mw_wp_form_complete h3,
.page .entry-content #mw_wp_form_mw-wp-form-74.mw_wp_form_complete h3 {
border: 1px solid #000;
font-size: 14px;
font-weight: 500;
height: 34px;
line-height: 34px;
margin: 58px auto 0;
width: 280px
}
.page .entry-content #mw_wp_form_mw-wp-form-524.mw_wp_form_complete .comments,
.page .entry-content #mw_wp_form_mw-wp-form-74.mw_wp_form_complete .comments {
font-size: 12px;
font-weight: 400
}
.page .entry-content #mw_wp_form_mw-wp-form-524.mw_wp_form_complete h3,
.page .entry-content #mw_wp_form_mw-wp-form-74.mw_wp_form_complete h3 {
font-size: 16px;
height: 40px;
line-height: 40px;
margin-top: 25px
}
.page .entry-content .mw_wp_form_complete {
text-align: center
}
.page .entry-content .mw_wp_form_complete h2 {
font-size: 24px;
font-weight: 500;
line-height: 24px;
margin-bottom: 33px;
margin-top: 39px
}
.page .entry-content .mw_wp_form_complete h3 {
border: 1px solid #000;
font-size: 14px;
font-weight: 500;
height: 34px;
line-height: 34px;
margin: 58px auto 0;
width: 280px
}
.page .entry-content .mw_wp_form_complete .comments {
font-size: 12px;
font-weight: 400
}
.mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline {
color: #411600;
padding-top: 10px
}
.panel-widget-style {
font-size: .8em;
max-width: 1020px
}
.onlineshop-item {
border-radius: 8px;
margin-bottom: 0;
padding: 15px
}
.so-panel {
margin-bottom: 10px;
padding: 5px
}
.panel-grid-cell .widget-title {
color: #a78000
}
#panel-3404-5-0-1 > .panel-widget-style {
border: 1px solid #411600;
border-radius: 8px;
margin-bottom: 0;
padding: 15px
}
.so-widget-sow-button-wire-cdd6d9afa56f .ow-button-base a {
display: none
}
@keyframes fadeInModal {
0% {
opacity: 0
}
to {
opacity: 1
}
}
@keyframes fadeOutModal {
0% {
opacity: 1
}
to {
display: none;
opacity: 0
}
}
@keyframes fadeInBlur {
0% {
filter: blur(0)
}
to {
filter: blur(3px)
}
}
@keyframes fadeOutBlur {
0% {
filter: blur(3px)
}
to {
filter: blur(0)
}
}
#advertisingModal.active {
animation: fadeInModal 1s ease;
display: block
}
.advertisingModal {
animation: fadeOutModal 1s ease;
display: none;
z-index: 999
}
.advertisingModal,
.advertisingModal__bg {
height: 100%;
position: fixed;
top: 0;
width: 100%
}
.advertisingModal__bg {
background: -webkit-linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, .8));
background: linear-gradient(180deg, rgba(0, 0, 0, .3) 0, rgba(0, 0, 0, .8));
display: block;
left: 0;
z-index: 998
}
.advertisingModal__inner {
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
width: 470px;
z-index: 999
}
@media screen and (max-width:768px) {
.advertisingModal__inner {
width: 270px
}
}
.advertisingModal__area {
background: hsla(0, 0%, 100%, .5);
height: auto;
padding: 0;
width: 100%
}
.advertisingModal__area__title {
padding-bottom: 20px;
padding-top: 40px
}
.advertisingModal__area__title h2 {
border-bottom: 1px solid #333;
border-top: 1px solid #333;
font-size: 2.6rem;
padding: 20px
}
@media screen and (max-width:768px) {
.advertisingModal__area__title h2 {
font-size: 2rem;
padding: 15px
}
}
.advertisingModal__area__img {
height: auto;
width: 100%
}
.advertisingModal__area__img a {
display: block;
font-size: 0;
line-height: 0;
margin: 0;
padding: 0
}
.advertisingModal__area__img img {
height: auto;
width: 100%
}
.advertisingModal__area__discount {
background: linear-gradient(-45deg, #a62721 25%, #99241e 0, #99241e 50%, #a62721 0, #a62721 75%, #99241e 0, #99241e);
background-size: 40px 40px;
padding: 15px
}
.advertisingModal__area__discount p {
align-items: center;
color: #fff;
display: flex;
flex-direction: column;
font-weight: 700;
justify-content: center
}
.advertisingModal__area__discount p span:first-child {
font-size: 2rem;
letter-spacing: .14rem;
line-height: 2.8rem
}
.advertisingModal__area__discount p span:nth-child(2),
.advertisingModal__area__discount p span:nth-child(3) {
font-size: 3rem;
line-height: 3.6rem
}
@media screen and (max-width:768px) {
.advertisingModal__area__discount p span:first-child {
font-size: 1.8rem;
line-height: 2.6rem
}
.advertisingModal__area__discount p span:nth-child(2),
.advertisingModal__area__discount p span:nth-child(3) {
font-size: 2.4rem;
line-height: 3rem
}
}
.advertisingModal__area__go {
align-items: center;
display: flex;
flex-direction: row;
justify-content: right;
padding: 10px 0
}
.advertisingModal__area__go span {
padding-left: 5px
}
.advertisingModal__area__go #rightArrow {
display: block;
height: 15px;
width: 15px
}
.advertisingModal__area__close {
background: #d8d8ed;
border-radius: 18px;
display: block;
height: 36px;
position: absolute;
right: -18px;
top: -18px;
width: 36px
}
@media screen and (max-width:768px) {
.advertisingModal__area__close {
background: #d8d8ed;
border-radius: 18px;
display: block;
height: 36px;
position: absolute;
right: -18px;
top: -18px;
width: 36px
}
}
.advertisingModal__area__close img {
height: 100%;
padding: 10px;
width: 100%
}
.home .event-banner {
background: #231815;
padding: 40px 0
}
.home .event-banner picture img {
display: block;
margin: 0 auto;
max-width: 880px;
overflow: hidden;
-webkit-transition: -webkit-transform .5s linear;
transition: transform .5s linear;
width: 100%
}
.home .event-banner picture img:hover {
-webkit-transform: scale(1.08);
transform: scale(1.08)
}
.page-shopinfo article,
.page-shopinfo aside,
.page-shopinfo section {
display: block
}
.page-shopinfo .lead h2 {
font-feature-settings: "palt";
color: #000;
margin-bottom: 2rem
}
.page-shopinfo .lead h2 span {
display: inline-block
}
.page-shopinfo .lead .text2 {
line-height: 1.4
}
.page-shopinfo .lead p span {
display: inline-block
}
.page-shopinfo .shop-list h2 {
margin-bottom: 50px
}
.page-shopinfo .shop-list .stores {
border-bottom: 1px solid #efefef;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-bottom: 45px
}
.page-shopinfo .shop-list .thumbnail {
max-width: 450px;
width: 100%
}
.page-shopinfo .shop-list .thumbnail img {
width: 100%
}
.page-shopinfo .shop-list .information {
max-width: calc(100% - 450px);
padding-left: 3.3vw;
width: 100%
}
.page-shopinfo .shop-list .storename {
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 1.4;
margin: 0
}
.page-shopinfo .shop-list .access,
.page-shopinfo .shop-list .info {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75
}
.page-shopinfo .shop-list .access {
padding-top: 29px
}
.page-shopinfo .shop-list .access ul {
list-style: disc;
margin-left: 0;
padding-left: 2rem
}
.page-shopinfo .shop-list .sns {
display: flex;
flex-direction: row;
padding-left: 0
}
.page-shopinfo .shop-list .sns li {
border-bottom: 0;
display: block;
margin-right: 15px;
padding-bottom: 0
}
.page-shopinfo .shop-list .sns li i {
display: inline-block;
height: auto;
height: 16px;
width: auto
}
.page-shopinfo .shop-list .sns i.facebook {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_facebook.svg);
height: 16px;
width: 12px
}
.page-shopinfo .shop-list .sns i.instagram {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_instagram.svg);
height: 16px;
width: 13px
}
.page-shopinfo .shop-list .sns i.twitter {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_twitter.svg);
height: 16px;
width: 16px
}
.page-shopinfo .shop-list .sns i.googlemap {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg);
height: 16px;
width: 91px
}
.page-shopinfo .shop-list .onlinestores a {
width: 100%
}
.page-shopinfo .shop-list .onlinestores span {
display: inline-block
}
.page-shopinfo .list_shop .shops .stores li {
border-bottom: 0;
display: list-item;
padding-bottom: 0
}
.page-shopinfo .list_shop .shops .stores .access li:nth-child(n+2),
.page-shopinfo .list_shop .shops .stores .sns li:nth-child(n+2) {
padding-top: 0
}
.archive-cpt_brand .layoutInner {
max-width: 1440px;
padding-left: 20px;
padding-right: 20px;
}
.archive-cpt_brand h1 {
color: #a38000;
font-size: 4rem;
font-weight: 700;
letter-spacing: .1em;
margin: 0;
padding-top: 47px;
text-align: center
}
.archive-cpt_brand.fixed h1 {
background-color: #fff;
left: 0;
position: fixed;
top: 32px;
top: 0;
width: 100%
}
.archive-cpt_brand.fixed .categories {
left: 0;
padding-top: 100px;
position: fixed;
top: 32px;
top: 0;
width: 100%
}
.archive-cpt_brand .categories .posts {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
margin: 0;
max-width: 1005px;
padding: 49px 0 29px;
width: 100%
}
.archive-cpt_brand.fixed .categories .posts {
background-color: #fff;
margin: 0 auto;
max-width: 1005px;
width: 100%
}
.archive-cpt_brand .categories .posts .post {
font-size: 1.8rem;
font-weight: 700;
height: 27px;
letter-spacing: .1em;
line-height: 25px;
text-align: center;
width: 20px
}
.archive-cpt_brand .categories .posts .post.initial_OTHER {
width: auto
}
.archive-cpt_brand .categories .posts .post.current {
border-bottom: 2px solid #333
}
.archive-cpt_brand .categories .posts .post a {
color: #333
}
.archive-cpt_brand.fixed .brands {
padding-top: 105px
}
.archive-cpt_brand .brands .brand .title {
color: #a38000;
font-size: 4rem;
font-weight: 700;
letter-spacing: .1em;
margin-top: -305px;
padding-top: 305px
}
.archive-cpt_brand.fixed .brands .title {
margin-top: -205px;
padding-top: 205px
}
.archive-cpt_brand .brands .brand .posts {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0;
padding: 0 0 9px
}
.archive-cpt_brand .brands .brand .posts .post {
padding-bottom: 18px;
width: 160px
}
.archive-cpt_brand .brands .posts .post.empty {
height: 0;
padding: 0
}
.archive-cpt_brand .brands .brand .posts .post a {
color: #333
}
.archive-cpt_brand .brands .brand .posts .post a .thumbnail,
.archive-cpt_brand .brands .brand .posts .post a .thumbnail img {
width: 100%
}
.archive-cpt_brand .brands .brand .posts .post a .title_en {
font-size: 1.2rem;
line-height: 1.667;
padding-top: 3px;
text-align: center
}
.archive-cpt_brand .brands .brand .posts .post a .title_jp {
font-size: 1.2rem;
line-height: 1.667;
margin: 0;
text-align: center
}
@media screen and (max-width:768px) {
.archive-cpt_brand .brands .brand .posts {
justify-content: space-around
}
}
.c-faq main {
padding-bottom: 120px
}
.c-faq h1 {
color: #a38000;
font-size: 4rem;
padding-bottom: 23px;
padding-top: 27px
}
.c-faq h1,
.c-faq h2 {
letter-spacing: .1em;
margin: 0;
text-align: center
}
.c-faq h2 {
color: #333;
font-size: 1.5rem;
padding-bottom: 25px;
padding-top: 16px
}
.c-faq .posts {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 auto;
max-width: 970px;
width: 100%
}
.c-faq .posts .post .content {
background-color: #efefef;
border: 1px solid #c2c2c2;
display: flex;
flex-wrap: wrap;
margin: 0 10px 21px;
max-width: 450px;
transition: all .3s ease;
width: calc(100% - 20px)
}
.c-faq .posts .post .content .question {
color: #333;
font-size: 1.2rem;
font-weight: 700;
letter-spacing: .1em;
line-height: 1.5;
min-height: 38px;
padding-bottom: 10px;
padding-left: 20px;
padding-top: 10px;
width: calc(100% - 50px)
}
.c-faq .posts .post .content .answer {
font-size: 12px;
height: auto;
line-height: 1.75;
max-height: 0;
overflow: hidden;
padding-bottom: 0;
padding-left: 20px;
transition: all .3s ease;
width: calc(100% - 50px)
}
.c-faq .posts .post .content .button {
height: 38px;
position: relative;
width: 50px
}
.c-faq .posts .post .content .button span {
background-color: #333;
height: 1.867px;
left: 18px;
position: absolute;
top: 50%;
width: 14px
}
.c-faq .posts .post .content .button span:after {
border-top: 1.867px solid #333;
content: "";
display: block;
left: 0;
position: absolute;
transform: rotate(-90deg);
transition: all .3s ease;
width: 14px
}
.c-faq .posts .post .content.faq_open {
background-color: #fff
}
.c-faq .posts .post .content.faq_open .answer {
max-height: 200px;
padding-bottom: 20px
}
.c-faq .posts .post .content.faq_open .button span:after {
transform: rotate(0)
}
.archive main,
.archive.date main,
.search main {
background-color: #fff;
}
@media screen and (max-width:768px) {
.archive main,
.archive.date main,
.search main {
padding-top: 60px;
}
main.archive {
padding-top: 60px;
}
}
.archive h1,
.archive.date h1,
.search h1,
.tag h1 {
font-size: 4rem;
font-weight: 700;
letter-spacing: .1em;
margin: 0 0 2rem;
padding-top: 90px;
text-align: center
}
.archive h2,
.archive.date h2,
.search h2,
.tag h2 {
color: #333;
font-size: 18px;
letter-spacing: .1em;
margin: 0
}
.categories .posts {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 5px;
margin: 0;
padding: 15px 0 15px;
width: 100%;
}
@media screen and (max-width:768px) {
.categories .posts {
border-bottom: 1px solid #333;
width: calc(100% - 20px);
margin-inline: auto;
}
}
.categories .posts .post {
font-family: "EB Garamond", serif;
height: 24px;
margin: 0;
}
.categories .posts .post.for-riders {
order: 1;
}
.categories .posts .post.for-drivers {
order: 2;
}
.categories .posts .post.for-fun {
order: 3;
}
.categories .posts .post a {
display: block;
padding: 0 10px;
border: 1px solid transparent;
color: #333;
font-size: 1.5rem;
font-weight: 700;
letter-spacing: .1em;
}
.categories .posts .post a:hover,
.categories .posts .post.current a {
border: 1px solid currentColor;
}
@media screen and (max-width:768px) {
.categories .posts .post {
font-size: 13px;
}
.categories .posts .post a {
font-size: 13px;
}
}
.postlist,
.postlist--related {
display: grid;
grid-template-columns: repeat(3, 1fr);
justify-content: space-between;
gap: 2rem;
margin: 20px auto;
max-width: 1060px;
width: 100%;
}
@media screen and (max-width:768px) {
.postlist,
.postlist--related {
grid-template-columns: repeat(1, 1fr);
}
}
.postlist a,
.postlist--related a {
color: #333
}
.postlist a article,
.postlist--related a article {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 510px;
padding-bottom: 47px;
width: 100%
}
.postlist a article .image,
.postlist--related a article .image {
height: 100%;
width: 100%;
}
.postlist a article .image img,
.postlist--related a article .image img {
background-color: #8f8f8f;
border: none;
height: 100%;
object-fit: cover;
width: 100%
}
.postlist a article .title,
.postlist--related a article .title {
padding: 0;
line-height: 1.5;
font-size: 14px;
width: 100%;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
margin: 1rem 0;
}
.postlist a article .description,
.postlist--related a article .description {
font-family: "Noto Sans JP", sans-serif;
font-size: 1.2rem;
height: 115px;
letter-spacing: .1em;
margin-top: 1rem;
line-height: 1.75;
width: 100%
}
.postlist a article .information,
.postlist--related a article .information {
font-family: "EB Garamond", serif;
font-size: 10px;
margin-top: 1rem;
display: inline-flex;
align-items: center;
}
.postlist a article .category,
.postlist--related a article .category {
font-family: "Noto Sans JP", sans-serif;
border: solid 1px #A27E24;
line-height: 1;
margin-top: 1rem;
padding: 0 5px;
display: inline-flex;
align-items: center;
justify-content: center;
color: #A27E24;
font-size: 8px;
height: 24px;
}
.postlist a article .address,
.postlist--related a article .address {
font-family: "Noto Sans JP", sans-serif;
font-size: 14px;
line-height: 1;
margin-top: 1rem;
padding: 0 5px;
display: inline-flex;
align-items: center;
justify-content: center;
}
.shop-group .shop-group__heading {
font-family: "EB Garamond", serif;
font-size: 26px;
line-height: 1;
margin-top: 1rem;
padding: 0 5px;
text-align: center;
}
.pagenations {
padding-bottom: 50px
}
.pagenations ul {
display: flex;
justify-content: center;
margin: 0;
padding: 0
}
.pagenations ul li {
font-size: 15px;
height: 41px;
line-height: 41px;
margin: 0 8px;
text-align: center;
width: 29px
}
.pagenations ul li a {
color: #333
}
.pagenations ul li.current {
border: 1px solid #333
}
.pagenations ul li :hover {
border-bottom: 1px solid #333
}
.search h2.search_keyword {
padding-bottom: 45px;
text-align: center
}
.postlist--related {
padding-bottom: 60px
}
.postlist--related h2 {
color: #a38000;
font-size: 40px;
font-weight: 700;
letter-spacing: .1em;
margin: 0;
padding-bottom: 68px;
text-align: center;
width: 100%
}
.postlist--related a {
color: #333
}
.postlist--related a article .image img {
max-height: 270px;
min-height: 270px;
vertical-align: middle
}
.postlist--related .btn_area {
text-align: center;
width: 100%
}
.postlist--related .btn_area button {
background: #000;
border: none;
color: #fff;
font-family: Playfair Display, "Noto Serif JP", serif;
padding: 10px 30px;
text-align: center
}
@media screen and (max-width:1019px) {
.postlist,
.postlist--related {
justify-content: space-around;
padding: 0 10px
}
.postlist a article .description,
.postlist--related a article .description {
padding-left: 10px;
padding-right: 10px
}
.postlist--related a article .title {
padding-left: 10px;
padding-right: 10px
}
.postlist--related a article .information {
padding-left: 10px
}
.postlist--related a article .category {
padding-right: 10px
}
}
.slick-dots {
bottom: -50px
}
.slick-dots li button:before {
border: 1px solid #ae9122;
content: "";
height: 10px;
width: 10px
}
.slick-dots li.slick-active button:before {
background-color: #231815;
border-color: #231815
}
main .content .mail-magazine-announcement {
color: #c00;
display: inline-block;
font-size: 12px;
line-height: 1.4
}
.Go-online {
border: 1px solid #a78000;
height: 70px;
line-height: 70px;
margin: 80px auto 100px;
min-width: 280px;
width: 30vw
}
.Go-online a {
background: rgba(167, 128, 0, .2);
display: inline-block;
height: 100%;
transition-duration: .5s;
width: 100%
}
.Go-online a:hover {
background: rgba(167, 128, 0, .8);
color: #fff
}
.sp {
display: none
}
@media screen and (max-width:768px) {
.sp {
display: inline
}
}
a:hover img {
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
opacity: .7
}
.single-cpt_brand .content .footer h2,
.single-cpt_brand .postlist h2,
.single-cpt_brand .postlist--related h2 {
font-size: 3.5rem
}
@media screen and (max-width:768px) {
.single-cpt_brand .content .footer h2,
.single-cpt_brand .postlist h2,
.single-cpt_brand .postlist--related h2 {
font-size: 3rem
}
}
.archive-cpt_brand .brands .brand .posts .post a .thumbnail {
padding-left: 10%;
padding-right: 10%
}
.single-cpt_brand .content .wrapper .flexbox .information .description {
text-align: left
}
.page-official_dealer article,
.page-official_dealer aside,
.page-official_dealer section,
.page-shopinfo article,
.page-shopinfo aside,
.page-shopinfo section {
display: block
}
.page-official_dealer .lead h2,
.page-shopinfo .lead h2 {
font-feature-settings: "palt";
color: #000;
margin-bottom: 2rem
}
.page-official_dealer .lead h2 span,
.page-shopinfo .lead h2 span {
display: inline-block
}
.page-official_dealer .lead .text2,
.page-shopinfo .lead .text2 {
line-height: 1.4
}
.page-official_dealer .lead p span,
.page-shopinfo .lead p span {
display: inline-block
}
.page-official_dealer .shop-list h2,
.page-shopinfo .shop-list h2 {
margin-bottom: 50px
}
.page-official_dealer .shop-list .stores,
.page-shopinfo .shop-list .stores {
border-bottom: 1px solid #efefef;
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-bottom: 45px
}
.page-official_dealer .shop-list .thumbnail,
.page-shopinfo .shop-list .thumbnail {
max-width: 450px;
width: 100%
}
.page-official_dealer .shop-list .thumbnail img,
.page-shopinfo .shop-list .thumbnail img {
width: 100%
}
.page-official_dealer .shop-list .information,
.page-shopinfo .shop-list .information {
max-width: calc(100% - 450px);
padding-left: 3.3vw;
width: 100%
}
.page-official_dealer .shop-list .storename,
.page-shopinfo .shop-list .storename {
font-size: 1.5rem;
letter-spacing: .1em;
line-height: 1.4;
margin: 0
}
.page-official_dealer .shop-list .info,
.page-shopinfo .shop-list .info {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75
}
.page-official_dealer .shop-list .access,
.page-shopinfo .shop-list .access {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.75;
padding-top: 29px
}
.page-official_dealer .shop-list .access ul,
.page-shopinfo .shop-list .access ul {
list-style: disc;
margin-left: 0;
padding-left: 2rem
}
.page-official_dealer .shop-list .sns,
.page-shopinfo .shop-list .sns {
display: flex;
flex-direction: row;
padding-left: 0
}
.page-official_dealer .shop-list .sns li,
.page-shopinfo .shop-list .sns li {
border-bottom: 0;
display: block;
margin-right: 15px;
padding-bottom: 0
}
.page-official_dealer .shop-list .sns li i,
.page-shopinfo .shop-list .sns li i {
display: inline-block;
height: auto;
height: 16px;
width: auto
}
.page-official_dealer .shop-list .sns li i.facebook,
.page-shopinfo .shop-list .sns li i.facebook {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_facebook.svg);
height: 16px;
width: 12px
}
.page-official_dealer .shop-list .sns li i.instagram,
.page-shopinfo .shop-list .sns li i.instagram {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_instagram.svg);
height: 16px;
width: 13px
}
.page-official_dealer .shop-list .sns li i.twitter,
.page-shopinfo .shop-list .sns li i.twitter {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_twitter.svg);
height: 16px;
width: 16px
}
.page-official_dealer .shop-list .sns li i.googlemap,
.page-shopinfo .shop-list .sns li i.googlemap {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg);
height: 16px;
width: 91px
}
.page-official_dealer .shop-list .onlinestores a,
.page-shopinfo .shop-list .onlinestores a {
width: 100%
}
.page-official_dealer .shop-list .onlinestores span,
.page-shopinfo .shop-list .onlinestores span {
display: inline-block
}
.page-official_dealer .list_shop .shops .stores li,
.page-shopinfo .list_shop .shops .stores li {
border-bottom: 0;
display: list-item;
padding-bottom: 0
}
.page-official_dealer .list_shop .shops .stores .access li:nth-child(n+2),
.page-official_dealer .list_shop .shops .stores .sns li:nth-child(n+2),
.page-shopinfo .list_shop .shops .stores .access li:nth-child(n+2),
.page-shopinfo .list_shop .shops .stores .sns li:nth-child(n+2) {
padding-top: 0
}
@media screen and (max-width:768px) {
.page-official_dealer .shop-list .information,
.page-shopinfo .shop-list .information {
max-width: none;
padding: 10px;
text-align: center
}
.page-official_dealer .shop-list .access ul,
.page-shopinfo .shop-list .access ul {
list-style: none
}
.page-official_dealer .shop-list .access ul li:before,
.page-shopinfo .shop-list .access ul li:before {
font-size: 5px;
margin-right: 5px
}
.page-official_dealer .shop-list .sns,
.page-shopinfo .shop-list .sns {
justify-content: center
}
.page-official_dealer .shop-list .sns li,
.page-shopinfo .shop-list .sns li {
list-style: none
}
.page-official_dealer h1,
.page-shopinfo h1 {
font-size: 3rem;
padding: 60px 0 40px
}
.page-official_dealer h2.shoplist,
.page-shopinfo h2.shoplist {
font-size: 3rem;
padding-top: 45px
}
.page-official_dealer .lead .text1,
.page-shopinfo .lead .text1 {
font-size: 3.4vw
}
.page-official_dealer .lead .text2,
.page-shopinfo .lead .text2 {
font-size: 4.4vw;
padding: 20px 10px
}
.page-official_dealer .lead h2,
.page-shopinfo .lead h2 {
font-size: 8vw;
line-height: 10vw;
padding-bottom: 0;
padding-top: 40px
}
.page-official_dealer .shop-list .storename,
.page-shopinfo .shop-list .storename {
font-size: 3.8vw;
margin: 0 auto;
padding: 15px 0 30px;
text-align: left;
width: 90%
}
.page-official_dealer .shop-list .info,
.page-shopinfo .shop-list .info {
letter-spacing: .1em
}
.page-official_dealer .shop-list .access,
.page-official_dealer .shop-list .info,
.page-shopinfo .shop-list .access,
.page-shopinfo .shop-list .info {
font-size: 3.4vw;
line-height: 4.6vw;
margin: 0 auto;
text-align: left;
width: 90%
}
.page-official_dealer .shop-list .access ul,
.page-shopinfo .shop-list .access ul {
margin-top: 0
}
.page-official_dealer .shop-list .access ul li:before,
.page-shopinfo .shop-list .access ul li:before {
bottom: 3px;
content: "●";
font-size: 3px;
margin-right: 3px;
position: relative
}
.page-official_dealer .shop-list .sns,
.page-shopinfo .shop-list .sns {
justify-content: flex-start;
margin: 0 auto;
width: 90%
}
.page-official_dealer .shop-list .sns .facebook,
.page-official_dealer .shop-list .sns .googlemap,
.page-official_dealer .shop-list .sns .instagram,
.page-official_dealer .shop-list .sns .twitter,
.page-shopinfo .shop-list .sns .facebook,
.page-shopinfo .shop-list .sns .googlemap,
.page-shopinfo .shop-list .sns .instagram,
.page-shopinfo .shop-list .sns .twitter {
background-image: none;
height: 0;
width: 0
}
.page-official_dealer .shop-list .sns .snslist.facebook,
.page-shopinfo .shop-list .sns .snslist.facebook {
display: block;
height: 25px;
width: 21px
}
.page-official_dealer .shop-list .sns .snslist.instagram,
.page-shopinfo .shop-list .sns .snslist.instagram {
display: block;
height: 25px;
width: 23px
}
.page-official_dealer .shop-list .sns .snslist.twitter,
.page-shopinfo .shop-list .sns .snslist.twitter {
display: block;
height: 25px;
width: 28px
}
.page-official_dealer .shop-list .sns .snslist.googlemap,
.page-shopinfo .shop-list .sns .snslist.googlemap {
display: block;
height: 25px;
width: 150px
}
.page-official_dealer .shop-list .sns .facebook i,
.page-shopinfo .shop-list .sns .facebook i {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_facebook.svg);
background-size: 100%;
height: 100%;
width: 100%
}
.page-official_dealer .shop-list .sns .instagram i,
.page-shopinfo .shop-list .sns .instagram i {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_instagram.svg);
background-size: 100%;
height: 100%;
width: 100%
}
.page-official_dealer .shop-list .sns .twitter i,
.page-shopinfo .shop-list .sns .twitter i {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_twitter.svg);
background-size: 100%;
height: 100%;
width: 100%
}
.page-official_dealer .shop-list .sns .googlemap i,
.page-shopinfo .shop-list .sns .googlemap i {
background-image: url(//www.motorimoda.com/wp-content/themes/motorimoda/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg);
background-size: 100%;
height: 100%;
width: 100%
}
.page-official_dealer .information > *,
.page-shopinfo .information > * {
padding: 5px 0
}
}
.siteorigin-panels img {
height: auto
}
.siteorigin-panels img[width="493"] {
max-width: 493px
}
.siteorigin-panels img[width="500"] {
max-width: 500px
}
.siteorigin-panels img[width="540"] {
max-width: 540px
}
.siteorigin-panels img[width="549"] {
max-width: 549px
}
.siteorigin-panels img[width="551"] {
max-width: 551px
}
.siteorigin-panels img[width="580"] {
max-width: 580px
}
.siteorigin-panels img[width="600"] {
max-width: 600px
}
.siteorigin-panels img[width="648"] {
max-width: 648px
}
.siteorigin-panels img[width="666"] {
max-width: 666px
}
.siteorigin-panels img[width="668"] {
max-width: 668px
}
.siteorigin-panels img[width="708"] {
max-width: 708px
}
.siteorigin-panels img[width="794"] {
max-width: 794px
}
.single-cpt_feature main .content .sow-video-wrapper iframe,
.single-post main .content .sow-video-wrapper iframe {
display: block;
height: 360px !important;
margin-left: auto;
margin-right: auto
}
.postid-17069 .sow-video-wrapper iframe {
max-width: 640px
}
.so-panel.widget.widget_sow-editor .so-widget-sow-editor.so-widget-sow-editor-base .siteorigin-widget-tinymce.textwidget div[id^=attachment_] {
width: auto !important
}
.shop-list-blr .decoration,
.shop-list-mm .decoration,
.shop-list-pp .decoration {
display: none;
margin-bottom: 0;
visibility: hidden
}
.shop-list-mm .mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline:before {
background-color: #411600;
color: #d8b530;
content: "M"
}
.shop-list-blr .mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline:before {
background-color: #006437;
color: #f39800;
content: "B"
}
.shop-list-pp .mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline:before {
background-color: #000;
color: #fff;
content: "P"
}
.mm-shop-list .panel-layout .so-panel.widget_sow-headline.panel-first-child {
margin-bottom: 0 !important
}
.mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline {
font-size: 16px;
padding-top: 0
}
.mm-shop-list .so-widget-sow-headline .sow-headline-container h3.sow-headline:before {
border-radius: 4px;
display: inline-block;
font-family: Times New Roman, serif;
font-size: 12px;
line-height: 1;
margin-right: 5px;
padding: 2px 3px;
position: relative;
text-align: center;
top: -2px;
width: 24px
}
@media screen and (max-width:768px) {
.mm-shop-list .so-widget-sow-headline .sow-headline-container {
font-size: 1.6rem
}
}
.mm-shop-list .panel-grid {
border-bottom: 1px dotted #411600;
padding-bottom: 10px
}
.mm-shop-list .panel-grid:last-of-type {
border-bottom-width: 0
}
.mm-shop-list .fa-phone-square:before {
color: #da4453
}
.mm-shop-list p {
font-size: 14px;
margin-bottom: 0;
margin-top: 0
}
.mm-shop-list p .broken_link,
.mm-shop-list p a.broken_link {
text-decoration: none
}
.c-singleSearch {
background: #efefef;
padding: 30px 0
}
.c-singleSearch__inner {
display: flex;
flex-direction: row
}
.c-singleSearch__box {
display: flex;
justify-content: center;
width: 50%
}
@media screen and (max-width:767px) {
.c-singleSearch__inner {
flex-direction: column
}
.c-singleSearch__box {
padding: 40px 0;
width: 100%
}
}
.c-singleSearch__title {
padding: 20px 0
}
.c-singleSearch__title__ja {
font-size: 2rem;
line-height: 2rem;
text-align: center
}
.c-singleSearch__title__ja .label {
font-size: inherit;
font-weight: 700;
line-height: inherit
}
@media screen and (max-width:767px) {
.c-refineSearch {
padding: 0 40px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-refineSearch {
padding: 0 40px
}
}
.c-monthlyArticleArchive {
width: 350px
}
.c-monthlyArticleArchive .c-monthlyArchive {
display: none
}
.c-monthlyArticleArchive .c-monthlyArchive.slick-initialized {
display: block
}
.c-monthlyArticleArchive .c-monthlyArchive .slick-arrow {
top: 22px;
z-index: 500
}
.c-monthlyArticleArchive .c-monthlyArchive .slick-prev {
left: 0
}
.c-monthlyArticleArchive .c-monthlyArchive .slick-next {
right: 0
}
.c-monthlyArticleArchive .c-monthlyArchive__year {
border-bottom: 1px solid #333;
font-size: 2rem;
line-height: 2rem;
padding: 10px 0;
text-align: center
}
.c-monthlyArticleArchive .c-monthlyArchive__year .label {
font-size: inherit;
font-weight: 700
}
.c-monthlyArticleArchive .c-monthlyArchive__monthly {
display: grid;
gap: 12px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-rows: 1fr 1fr;
margin: 0;
padding: 12px 0
}
.c-monthlyArticleArchive .c-monthlyArchive__month > * {
border: 1px solid #aaa;
color: #aaa;
display: block;
position: relative;
width: 100%
}
.c-monthlyArticleArchive .c-monthlyArchive__month > :before {
content: "";
display: block;
padding-top: 100%
}
.c-monthlyArticleArchive .c-monthlyArchive__month > * > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-monthlyArticleArchive .c-monthlyArchive__month > * > span {
align-items: center;
display: flex;
justify-content: center
}
.c-monthlyArticleArchive .c-monthlyArchive__month > * > span .label {
font-size: .9rem
}
.c-monthlyArticleArchive .c-monthlyArchive__month > a {
background: #fff;
border: none;
color: #333
}
.fs-c-inputField__field {
padding: 3px 0
}
.fs-c-inputField__label {
color: #888;
font-size: 1rem;
line-height: 2rem
}
.fs-c-inputTextGroup {
display: flex;
flex-direction: row;
gap: 20px
}
.fs-c-inputTextGroup__item {
flex-grow: 1
}
.fs-c-inputGroup > button {
border: none;
border-left: 1px solid #ccc
}
input,
select {
-webkit-appearance: none;
appearance: none;
border-radius: 0
}
input[type=text],
select {
background: #fff;
border: 1px solid #ccc;
color: #888;
min-width: 100px;
padding: 3px 5px;
width: 100%
}
@media screen and (max-width:767px) {
input[type=text],
select {
font-size: 1.8rem;
line-height: 2.4rem
}
}
.c-contactAction {
padding: 10px
}
.c-contactAction__inner {
display: flex;
flex-direction: row;
gap: 10px
}
.c-contactAction__inner > * {
flex-grow: 1
}
@keyframes fadeInAnimeClr {
to {
color: #a38000
}
}
@keyframes fadeInAnimeBorder {
0% {
border-bottom: .5px solid #999
}
to {
border-bottom: .5px solid #a38000
}
}
@keyframes fadeInAnime {
0% {
opacity: 0
}
to {
opacity: 1
}
}
.c-tab {
position: relative
}
.c-tab__head {
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(3px);
background: hsla(0, 0%, 100%, .6);
border-bottom: 2px solid #a38000;
margin-bottom: 2px !important
}
.c-tab__head__item {
cursor: pointer;
padding: 4px
}
.c-tab__head__item.active {
border-bottom: 4px solid #a38000;
padding-bottom: 0
}
.c-tab__head__item.active > span {
color: #a38000;
font-weight: 700
}
.c-tab__head__item:hover > span {
animation-duration: .5s;
animation-fill-mode: forwards;
animation-name: fadeInAnimeClr
}
.c-tab__head ul.layoutOuter {
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
padding: 0
}
.c-tab__head ul.layoutOuter li {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
width: 33.333%
}
.c-tab__head__en {
margin: 0
}
.c-tab__head__en,
.c-tab__head__ja {
color: #333;
display: block;
font-weight: 700;
text-align: center
}
.c-tab__body {
border-top: 3px solid #a38000;
position: relative;
z-index: 1
}
.c-tab__body__content {
display: none
}
.c-tab__body__content.active {
animation-duration: 1s;
animation-fill-mode: forwards;
animation-name: fadeInAnime;
display: block;
opacity: 0
}
.c-tab__body__content:first-child.active {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/toppage/tab_bg_01.webp) no-repeat 50%;
background-size: cover
}
.c-tab__body__content:nth-child(2).active {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/toppage/tab_bg_02.webp) no-repeat 50%;
background-size: cover
}
.c-tab__body__content:nth-child(3).active {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/toppage/tab_bg_03.webp) no-repeat 50%;
background-size: cover
}
.c-tab__body__categories {
display: flex;
flex-direction: row;
flex-wrap: wrap
}
.c-tab__body__categories__icon > div {
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(3px);
background: hsla(0, 0%, 100%, .6);
border-radius: 25%
}
.c-tab__body__categories__icon > div a {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center
}
.c-tab__body__categories__icon > div a .icoimg {
display: block
}
.c-tab__body__categories__icon > div a .ja {
color: #000;
display: block;
font-weight: 700;
text-align: center
}
.c-tab__body__categories__icon > div a .en {
color: #666;
display: block;
font-weight: 700;
text-align: center
}
@media screen and (max-width:767px) {
.c-tab__head ul.layoutOuter {
margin: 0 auto;
padding: 0;
width: 100%
}
.c-tab__head ul.layoutOuter li {
height: 50px
}
.c-tab__head__en {
font-size: 14px;
letter-spacing: .02em;
line-height: 1.8rem
}
.c-tab__head__ja {
font-size: .9rem;
letter-spacing: -.05em;
line-height: 1.2rem;
padding: 0
}
.c-tab__body__categories {
margin: 0 auto;
padding: 50px 12px 24px;
width: 360px
}
.c-tab__body__categories__icon {
padding: 6px;
width: 25%
}
.c-tab__body__categories__icon > div {
position: relative;
width: 100%
}
.c-tab__body__categories__icon > div:before {
content: "";
display: block;
padding-top: 100%
}
.c-tab__body__categories__icon > div > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-tab__body__categories__icon > div a .icoimg {
height: 40px;
width: 40px
}
.c-tab__body__categories__icon > div a .ja {
font-size: 10px;
letter-spacing: -.08em;
line-height: 10px;
padding: 0
}
.c-tab__body__categories__icon > div a .en {
font-size: 8.5px;
letter-spacing: .05em;
line-height: 8.5px;
margin: 0;
padding-top: 1px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-tab__head ul.layoutOuter {
width: 768px
}
.c-tab__head ul.layoutOuter li {
height: 70px
}
.c-tab__head__en {
font-size: 2rem;
letter-spacing: .02em;
line-height: 2rem
}
.c-tab__head__ja {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.2rem;
padding: 10px 0 0
}
.c-tab__body__categories {
margin: 0 auto;
max-width: 800px;
min-width: 400px;
padding: 90px 12px 24px;
width: 80%
}
.c-tab__body__categories__icon {
padding: 2%;
width: 25%
}
.c-tab__body__categories__icon > div {
position: relative;
width: 100%
}
.c-tab__body__categories__icon > div:before {
content: "";
display: block;
padding-top: 100%
}
.c-tab__body__categories__icon > div > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-tab__body__categories__icon > div a .icoimg {
height: 58%;
width: 58%
}
.c-tab__body__categories__icon > div a .ja {
font-size: 1.7vw;
letter-spacing: .08em;
line-height: 1.7vw;
padding: .5vw 0 0
}
.c-tab__body__categories__icon > div a .en {
font-size: 1.2vw;
letter-spacing: .05em;
line-height: 1.2vw;
margin: 0;
padding-top: .6vw
}
}
@media screen and (min-width:1020px) {
.c-tab__head ul.layoutOuter {
width: 768px
}
.c-tab__head ul.layoutOuter li {
height: 70px
}
.c-tab__head__en {
font-size: 2rem;
letter-spacing: .02em;
line-height: 2rem
}
.c-tab__head__ja {
font-size: 1.2rem;
letter-spacing: .1em;
line-height: 1.2rem;
padding: 10px 0 0
}
.c-tab__body__categories {
margin: 0 auto;
padding: 90px 12px 24px;
width: 800px
}
.c-tab__body__categories__icon {
padding: 2%;
width: 25%
}
.c-tab__body__categories__icon > div {
position: relative;
width: 100%
}
.c-tab__body__categories__icon > div:before {
content: "";
display: block;
padding-top: 100%
}
.c-tab__body__categories__icon > div > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-tab__body__categories__icon > div a .icoimg {
height: 94.52px;
width: 94.52px
}
.c-tab__body__categories__icon > div a .ja {
font-size: 17.3px;
letter-spacing: .08em;
line-height: 17.3px;
padding: 5.1px 0 0
}
.c-tab__body__categories__icon > div a .en {
font-size: 12.22px;
letter-spacing: .05em;
line-height: 12.22px;
margin: 0;
padding-top: 6.114px
}
}
.c-tab .rider .helmet {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%
}
.c-tab .rider .goggles {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%
}
.c-tab .rider .wears {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%
}
.c-tab .rider .gloves {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%
}
.c-tab .rider .shoes {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%
}
.c-tab .rider .bag {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%
}
.c-tab .rider .accessories {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/28%;
transform: rotate(35deg)
}
.c-tab .rider .watches {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%
}
.c-tab .driver .helmet {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%
}
.c-tab .driver .goggles {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%
}
.c-tab .driver .wears {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%
}
.c-tab .driver .gloves {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%
}
.c-tab .driver .shoes {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%
}
.c-tab .driver .bag {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%
}
.c-tab .driver .accessories {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/28%;
transform: rotate(35deg)
}
.c-tab .driver .watches {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%
}
.c-tab .ms .helmet {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%
}
.c-tab .ms .goggles {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%
}
.c-tab .ms .wears {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%
}
.c-tab .ms .gloves {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%
}
.c-tab .ms .shoes {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%
}
.c-tab .ms .bag {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%
}
.c-tab .ms .accessories {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 0/28%;
transform: rotate(35deg)
}
.c-tab .ms .watches {
background: #333;
margin: 0 auto;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%
}
.l-contSize {
width: 100%
}
@media screen and (min-width:1020px) {
.l-contSize {
margin: 0 auto;
max-width: 1200px
}
}
.c-column1 {
padding: 40px 0
}
.c-column1__area {
position: relative
}
.c-column1__area,
.c-column1__area img {
height: 100%;
width: 100%
}
.c-column1__area figure {
margin: 0;
padding: 0
}
.adviserArea {
background: #fdf9e6
}
.adviserArea .c-column2.adviserList {
justify-content: center
}
.adviserArea .c-column2.adviserList .c-column2__area {
width: 33.3%
}
@media screen and (max-width:767px) {
.adviserArea .c-column2.adviserList.adjust {
display: flex;
flex-direction: column
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 2;
padding: 20px
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 1
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserArea .c-column2.adviserList.adjust {
display: flex;
flex-direction: row
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 1;
width: 50%
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 2;
width: 35%
}
}
@media screen and (min-width:1020px) {
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 1;
width: 50%
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 2;
width: 35%
}
}
.adviserArea .adviserMessage {
padding-bottom: 110px
}
.adviserArea .adviserMessage .c-column2 {
border: 1px solid #333;
padding: 0
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea {
padding: 40px 20px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .title {
color: #a78000;
font-size: 2.6rem;
line-height: 3.4rem;
margin: 0;
padding: 40px;
text-align: center
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .message {
font-size: 1.6rem;
line-height: 3.4rem;
margin: 0;
padding: 0 40px 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area img {
font-size: 2rem;
line-height: 4.2rem;
padding: 20px 40px
}
@media screen and (max-width:767px) {
.adviserArea .c-column2.adviserList .c-column2__area {
width: 100%
}
.adviserArea .adviserMessage {
padding: 10px 10px 80px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea {
padding: 0 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .title {
font-size: 1.8rem;
line-height: 3rem;
padding: 40px 0
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .message {
font-size: 1.4rem;
line-height: 2.2rem;
padding: 0 0 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area img {
margin: 0;
padding: 20px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserArea .adviserMessage {
margin: 0 30px
}
}
.c-column2 {
padding: 40px 0
}
.c-column2__area {
position: relative
}
.c-column2__area img {
height: 100%;
width: 100%
}
.c-column2__area figure {
margin: 0;
padding: 0
}
@media screen and (min-width:1020px) {
.c-column2 {
align-items: center;
display: flex;
flex-direction: row
}
.c-column2__area {
width: 50%
}
}
.c-column3 {
padding: 40px 0
}
.c-column3__area {
position: relative
}
@media screen and (min-width:1020px) {
.c-column3 {
align-items: center;
display: flex;
flex-direction: row
}
.c-column3__area {
width: 33.33%
}
}
.page .c-contHead {
height: 250px;
position: relative;
width: 100%
}
.page .c-contHead__inner {
height: inherit;
position: relative;
width: inherit;
z-index: 200
}
.page .c-contHead__inner h1 {
border: 2px solid #fff;
color: #fff;
display: inline-block;
font-size: 32px;
left: 0;
line-height: 50px;
padding: 50px;
position: absolute;
text-align: left;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%)
}
.page .c-contHead__inner .c-snsList {
bottom: 10px;
position: absolute;
right: 10px
}
.page .c-contHead__inner .c-snsList__item a {
background: #fff
}
.page .c-contHead:before {
background: rgba(0, 0, 0, .5);
content: "";
display: block;
height: 250px;
position: absolute;
top: 0;
width: 100%;
z-index: 1
}
@media screen and (max-width:767px) {
.page .c-contHead {
height: 120px
}
.page .c-contHead__inner h1 {
border: unset;
font-size: 1.8rem;
left: 50%;
line-height: 3rem;
position: absolute;
text-align: center;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
width: 96%
}
.page .c-contHead:before {
height: 120px
}
}
.page .c-contHead.ginza {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/01_ginza/1.jpg);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.chofu {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/02_chofu/chofu-feature-01.jpg);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.koube {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/03_koube/koube-exterior-01.jpg);
background-position: 0 54%;
background-size: 100%
}
.page .c-contHead.fukuoka {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/04_fukuoka/fukuoka-exterior-01.jpg);
background-position: center 69%;
background-size: 100%
}
.page .c-contHead.shibuya {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/05_shibuya/shibuya-interior-01.jpg);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.shinonome {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/06_shinonome/shinonome-interior-03.jpg);
background-position: center 16%;
background-size: 100%
}
.page .c-contHead.kyoto {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/07_kyoto/20220916-DSC06410.jpg);
background-position: center 5%;
background-size: 100%
}
.c-snsList {
display: flex;
flex-direction: row
}
.c-snsList__item {
height: 20px;
margin: 5px;
width: 20px
}
.c-snsList__item a {
background: #333;
display: block;
height: 100%;
width: 100%
}
.c-snsList__item a span {
font-size: 0;
height: 0;
visibility: hidden;
width: 0
}
.c-snsList__item a.facebook {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%
}
.c-snsList__item a.instagram {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%
}
.c-snsList__item a.twitter {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%
}
.c-snsList__item a.googlemap {
height: 16px;
margin: 2px 0;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
width: 91px
}
.c-ancher {
align-items: center;
border: 1px solid #333;
border-radius: 34px;
bottom: 0;
display: flex;
height: 68px;
justify-content: center;
position: absolute;
right: 80px;
width: 68px
}
.c-ancher .label {
font-size: 12px
}
@media screen and (max-width:767px) {
.c-ancher {
bottom: unset;
margin: 0 auto;
position: relative;
right: unset
}
}
.columnText {
font-size: 20px;
line-height: 42px;
padding: 80px
}
@media screen and (max-width:767px) {
.columnText {
font-size: 1.6rem;
line-height: 3rem;
padding: 40px
}
}
.c-fv-exterior {
height: 100%;
margin: 0;
padding: 0;
width: 100%
}
.c-fv-exterior img {
display: block;
height: 100%;
width: 100%
}
@media screen and (max-width:767px) {
.c-firstView .c-column2 {
display: flex;
flex-direction: column
}
.c-firstView .c-column2__area:first-child {
order: 2
}
.c-firstView .c-column2__area:last-child {
order: 1
}
}
.c-hTitle {
position: relative
}
.c-hTitle .hTitle {
color: #a78000;
font-size: 36px;
font-weight: 700;
letter-spacing: .15rem;
margin: 0;
padding: 80px 0;
position: relative;
text-align: center
}
.c-hTitle .hTitle:after {
background: #a78000;
border-radius: 3px;
bottom: 50px;
content: "";
height: 6px;
left: 50%;
position: absolute;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: 100px
}
@media screen and (max-width:767px) {
.c-hTitle .hTitle {
font-size: 2rem;
line-height: 3.2rem;
padding: 50px 0
}
.c-hTitle .hTitle:after {
bottom: 30px
}
}
.c-adviserProfile {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
margin: 20px
}
@media screen and (max-width:767px) {
.c-adviserProfile {
margin: 10px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-adviserProfile {
margin: 10px
}
}
.c-adviserProfile__img img {
height: 100%;
width: 100%
}
.c-adviserProfile__title {
font-size: 2.6rem;
line-height: 4rem;
padding: 20px 0
}
@media screen and (max-width:767px) {
.c-adviserProfile__title {
padding: 10px 0
}
}
.c-adviserProfile__detail__inner dd,
.c-adviserProfile__detail__inner dt {
font-size: 1.3rem;
line-height: 2.2rem;
margin: 0;
padding: 0
}
.c-adviserProfile__detail__inner dd {
padding-bottom: 15px
}
@media screen and (max-width:767px) {
.c-adviserProfile__detail__inner {
display: flex;
flex-direction: row;
flex-wrap: wrap
}
.c-adviserProfile__detail .name {
font-size: 3vw;
line-height: 4.6vw;
width: 30%
}
.c-adviserProfile__detail .definition {
font-size: 3vw;
letter-spacing: .3vw;
line-height: 4.6vw;
width: 70%
}
}
.c-adviserProfile__message .title {
font-size: 1.3rem;
font-weight: 700;
line-height: 2.2rem;
margin: 0
}
.c-adviserProfile__message .message {
font-size: 1.3rem;
letter-spacing: .25vw;
line-height: 2rem;
margin: 0
}
@media screen and (max-width:767px) {
.c-adviserProfile__message .message,
.c-adviserProfile__message .title {
font-size: 3vw
}
}
.storeImageSlide .slick-slide {
padding: 9px
}
.storeImageSlide .slick-slide img {
object-fit: cover;
width: 100%
}
.c-shopMap__title {
font-size: 3.6rem;
font-weight: 700;
padding: 80px 0;
text-align: center
}
@media screen and (max-width:767px) {
.c-shopMap__title {
font-size: 2rem;
padding: 40px 0
}
}
.c-shopMap__area iframe {
height: 370px;
width: 100%
}
.c-shopParking__area {
background: #f7f7f7;
margin: 10px
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopParking {
display: flex;
flex-direction: row
}
.c-shopParking__area {
width: 50%
}
}
@media screen and (min-width:1020px) {
.c-shopParking {
display: flex;
flex-direction: row
}
.c-shopParking__area {
width: 50%
}
}
.c-parkingInfo {
padding: 25px
}
.c-parkingInfo__inner {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
padding: 40px
}
.c-parkingInfo__inner .name {
border-bottom: 1px solid #333;
font-size: 3rem;
line-height: 5rem;
margin: 0;
padding: 0
}
.c-parkingInfo__inner .name:before {
background: #231815;
content: "";
display: block;
height: 100px;
margin: 0 auto;
width: 100px
}
.c-parkingInfo__inner .name.riders:before {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%
}
.c-parkingInfo__inner .name.drivers:before {
height: 100px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
width: 120px
}
.c-parkingInfo__inner .definition {
font-size: 1.6rem;
line-height: 2.4rem;
margin: 0;
padding: 40px
}
@media screen and (max-width:767px) {
.c-parkingInfo {
padding: 10px 5px
}
.c-parkingInfo__inner {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center;
margin: 0;
padding: 0
}
.c-parkingInfo__inner .name {
border: none;
border-right: 1px solid #333;
font-size: 2.5vw;
line-height: 2.5vw;
margin: 0;
padding: 0 10px 0 0;
text-align: center;
width: 40%
}
.c-parkingInfo__inner .name:before {
background: #231815;
content: "";
display: block;
height: 50px;
margin: 0 auto;
width: 50px
}
.c-parkingInfo__inner .name.riders:before {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%
}
.c-parkingInfo__inner .name.drivers:before {
height: 50px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
width: 50px
}
.c-parkingInfo__inner .definition {
font-size: 2.5vw;
line-height: 4vw;
margin: 0;
padding: 0 0 0 10px;
width: 60%
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-parkingInfo {
padding: 0
}
.c-parkingInfo__inner {
padding: 20px
}
.c-parkingInfo__inner .name {
font-size: 2rem;
line-height: 3rem
}
}
.c-feed--instagram .c-feed__header {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/Instagram_logo.svg);
background-position: 50%;
background-repeat: no-repeat;
background-size: 80%;
display: block;
height: 50px;
margin: 0 auto;
padding: 110px 0;
width: 200px
}
.logoInstagram {
visibility: hidden
}
.c-carouselArea {
margin: 0 auto;
padding: 40px 0;
width: 100%
}
.c-feed--instagram {
background: #f7f7f7
}
.c-feed--instagram .c-feed__list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0;
padding: 0
}
.c-feed--instagram .c-feed__list__item {
padding: 2.5px;
width: 25%
}
.c-feed--instagram .c-feed__list__item a,
.c-feed--instagram .c-feed__list__item a img {
height: 100%;
width: 100%
}
@media screen and (max-width:767px) {
.c-feed--instagram .c-feed__list {
padding: 10px
}
.c-feed--instagram .c-feed__list__item {
padding: 0;
width: 50%
}
}
.c-feed--instagram .fs-c-buttonContainer {
padding: 100px 0
}
.c-feed--instagram .fs-c-button--addToCart--variation,
.c-feed--instagram .fs-c-button--continueShopping,
.c-feed--instagram .fs-c-button--primary,
.c-feed--instagram .fs-c-button--subscribeToArrivalNotice {
font-size: 2.5rem;
max-width: 500px;
padding: 3rem 0
}
@media screen and (max-width:767px) {
.c-feed--instagram .fs-c-buttonContainer {
margin: 0 10px;
padding: 50px 0;
width: calc(100% - 20px)
}
.c-feed--instagram .fs-c-button--addToCart--variation,
.c-feed--instagram .fs-c-button--continueShopping,
.c-feed--instagram .fs-c-button--primary,
.c-feed--instagram .fs-c-button--subscribeToArrivalNotice {
font-size: 1.6rem;
line-height: 2.6rem;
padding: 18px 0
}
.c-shopInfo .c-column2 {
display: flex;
flex-direction: column;
padding-bottom: 0
}
.c-shopInfo .c-column2__area {
width: 100%
}
.c-shopInfo .c-column2__area .c-snsList {
position: absolute;
right: 70px;
top: 0
}
.c-shopInfo .c-column2__area:first-child {
order: 2
}
.c-shopInfo .c-column2__area:last-child {
order: 1
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopInfo .c-column2 {
display: flex;
flex-direction: row;
padding: 10px
}
.c-shopInfo .c-column2__area {
width: 100%
}
}
.c-shopProfile {
padding: 20px
}
@media screen and (max-width:767px) {
.c-shopProfile {
padding-bottom: 0
}
}
.c-shopProfile__title .label {
font-size: 3.4rem;
font-weight: 700;
line-height: 4.6rem
}
.c-shopProfile__detail {
padding-right: 50px
}
.c-shopProfile__detail__inner {
display: flex;
flex-direction: row;
flex-wrap: wrap;
font-size: 1.4rem;
line-height: 3rem;
position: relative
}
.c-shopProfile__detail__inner .name {
font-size: 1.4rem;
line-height: 3rem;
margin: 0;
padding: 0;
text-align: left;
width: 20%
}
.c-shopProfile__detail__inner .definition {
font-size: 1.4rem;
justify-self: flex-start;
line-height: 3rem;
margin: 0;
padding: 0;
width: 80%
}
@media screen and (max-width:767px) {
.c-shopProfile__title {
padding: 20px 0
}
.c-shopProfile__title .label {
font-size: 2.2rem
}
.c-shopProfile__detail {
padding: 0
}
.c-shopProfile__detail__inner {
margin: 0;
padding: 20px 0 0
}
.c-shopProfile__detail__inner .definition,
.c-shopProfile__detail__inner .name {
font-size: 1.2rem;
line-height: 3rem
}
.c-shopProfile .c-snsList {
padding-left: 20px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopProfile__title {
padding: 20px 0 20px 20px
}
.c-shopProfile__title .label {
font-size: 2.2rem;
font-weight: 700;
line-height: 3rem
}
.c-shopProfile__detail {
padding: 0 20px
}
.c-shopProfile__detail__inner .definition,
.c-shopProfile__detail__inner .name {
font-size: 1.4rem;
line-height: 2.8rem
}
.c-shopProfile .c-snsList {
padding-left: 20px
}
}
.storeImageSlide {
display: none;
height: 100%;
overflow: hidden;
width: 100%
}
.storeImageSlide a.slick-slide {
display: block;
height: 100%;
margin: 10px;
padding: 0;
position: relative;
width: 100%
}
.storeImageSlide a.slick-slide figure {
margin: 0;
position: relative
}
.storeImageSlide a.slick-slide figure img {
height: 100%;
width: 100%
}
.storeImageSlide a.slick-slide figure figcaption {
background: rgba(0, 0, 0, .5);
bottom: 15px;
color: #fff;
font-size: 12px;
line-height: 20px;
position: absolute;
text-indent: 15px;
width: 100%
}
.storeImageSlide .slick-arrow {
z-index: 100
}
.storeImageSlide .slick-next {
right: 20px
}
.storeImageSlide .slick-prev {
left: 20px
}
.storeImageSlide.slick-initialized {
display: block
}
.adviserSlide {
height: 100%;
overflow: hidden;
width: 100%
}
.adviserSlide .slick-slide {
margin: 10px;
padding: 0;
position: relative
}
.adviserSlide .slick-arrow {
z-index: 100
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserSlide {
padding: 0 42px
}
.adviserSlide .slick-next,
.adviserSlide .slick-prev {
top: 36%
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000 !important
}
.adviserSlide .slick-prev {
left: 30px
}
.adviserSlide .slick-next {
right: 30px
}
}
@media screen and (min-width:1020px) {
.adviserSlide .slick-next,
.adviserSlide .slick-prev {
top: 36%
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000 !important
}
.adviserSlide .slick-prev {
left: 0
}
.adviserSlide .slick-next {
right: 0
}
}
@media screen and (max-width:767px) {
.adviserSlide {
padding-left: 20px
}
.adviserSlide .slick-prev {
left: 40px
}
.adviserSlide .slick-list {
padding: 0 10% 0 0 !important
}
.adviserSlide .slick-arrow {
top: 40px
}
.adviserSlide .slick-next {
left: 80px
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000
}
}
.shopListSlider .slick-next:before,
.shopListSlider .slick-prev:before {
color: #000
}
.single-post main .content iframe,
.single-post main .content img {
height: auto;
width: 100%
}
.single-post main .title {
margin: 0 auto;
max-width: 1000px;
padding-top: 100px;
width: 100%
}
.single-post main .title h1 {
font-size: 3rem
}
.editor-post-title .editor-post-title__input,
.single-post main .title h1 {
color: #333;
font-family: "Noto Serif JP", serif;
font-weight: 300;
line-height: 1.5;
margin: 0;
text-align: center
}
.editor-post-title .editor-post-title__input {
font-size: 1.9rem
}
strong {
border-bottom: 2px solid #ddd;
font-weight: 700
}
.has-small-font-size {
font-size: 1.3rem;
letter-spacing: .08rem;
line-height: 1.8
}
.has-normal-font-size {
font-size: 1.6rem;
letter-spacing: .08rem;
line-height: 1.8
}
.has-medium-font-size {
font-size: 2rem;
letter-spacing: .08rem;
line-height: 1.8
}
.has-large-font-size {
font-size: 3.6rem;
letter-spacing: .08rem;
line-height: 1.8
}
.has-huge-font-size {
font-size: 4.2rem;
letter-spacing: .08rem;
line-height: 1.8
}
#main {
min-height: calc(100vh - 270px)
} @media screen and (min-width:768px)and (max-width:1020px) {
#main {
padding-top: 100px
}
.c-noticeArea {
top: 104px !important
}
}
main.menu_open {
height: calc(100vh - 270px);
overflow: hidden
}
.page-id-284 .title {
font-size: 2.8rem;
padding: 40px 20px
}
.page-id-20977 .mw_wp_form_complete {
padding-bottom: 130px
}
.page-id-20977 .mw_wp_form_complete > p {
font-size: 1.6rem;
text-align: center
}
.page-id-20977 .mw_wp_form_complete > h3 {
font-size: 1.6rem;
margin-top: 30px;
text-align: center
}
.page-id-20977 .mw_wp_form_complete > h3 + p {
font-size: 1.2rem;
text-align: center
}
@media screen and (max-width:767px) {
.page-id-20977 .title {
font-size: 2.6rem;
padding: 40px 20px
}
.page-id-20977 .mw_wp_form_complete > p {
font-size: 1.4rem;
text-align: center
}
.page-id-20977 .mw_wp_form_complete > h2 {
font-size: 2rem;
padding-top: 0
}
.page-id-20977 .mw_wp_form_complete > h3 {
font-size: 1.6rem;
margin-top: 30px;
text-align: center
}
.page-id-20977 .mw_wp_form_complete > h3 + p {
font-size: 1.2rem;
text-align: center
}
}
.single-cpt_feature main .thumbnail {
margin: 0 auto;
max-width: 1123px;
width: 100%
}
.single-cpt_feature main .thumbnail img {
width: 100%
}
.single-cpt_feature main .title {
color: #333;
font-size: 3rem;
line-height: 1.5;
max-width: 1000px;
padding-top: 100px
}
.single-cpt_feature main .date,
.single-cpt_feature main .title {
font-family: "Noto Serif JP", serif;
font-weight: 300;
margin: 0 auto;
text-align: center;
width: 100%
}
.single-cpt_feature main .date {
color: #666;
font-size: 12px;
max-width: 1056px;
padding-bottom: 86px;
padding-top: 40px
}
.mmagazine {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/pat/ptn_bg_01.jpg) repeat 0 0
}
@media screen and (max-width:767px) {
.mmagazine {
margin-bottom: 120px
}
}
@media screen and (min-width:768px) {
.mmagazine {
margin-bottom: 200px
}
}
.mmagazine .content {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/tit_mmagazine_02.png) no-repeat top;
background-size: 100%;
padding: 1em;
text-align: center
}
.mmagazine .content .title {
font-size: 36px;
margin: 0 auto;
padding: 18px 0 9px
}
@media screen and (max-width:767px) {
.mmagazine .content .title {
font-size: 43px
}
}
.mmagazine .content .title span {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/tit_mmagazine_01.png) no-repeat 50%;
background-size: 72%
}
.mmagazine .content .title span span {
visibility: hidden
}
.mmagazine .content p {
line-height: 1.6 !important
}
.mmagazine .content .more {
padding: 9px 0 33px
}
.mmagazine .content .more a:hover {
opacity: .8
}
.mmagazine .content .more a.txt {
color: #a78000;
display: block;
font-weight: 700;
margin: 6px auto;
text-align: right;
text-decoration: underline
}
@media screen and (max-width:767px) {
.mmagazine .content .more a.txt {
margin: 24px auto 0
}
}
@media screen and (min-width:1020px) {
.mmagazine .content .more a.txt {
min-width: 400px;
width: 50%
}
}
.mmagazine .content .more a.btn {
background-color: #050302;
border: 1px solid #c2c2c2;
color: #fff;
display: block;
font-size: 18px;
height: 50px;
letter-spacing: .1em;
line-height: 48px;
margin: 0 auto;
text-align: center
}
@media screen and (max-width:767px) {
.mmagazine .content .more a.btn {
font-size: 14px
}
}
@media screen and (min-width:1020px) {
.mmagazine .content .more a.btn {
min-width: 400px;
width: 50%
}
}
.catalogue {
margin-bottom: 120px;
position: relative
}
@media screen and (min-width:768px) {
.catalogue {
margin-bottom: 200px
}
}
.catalogue .content {
display: flex;
flex-direction: row
}
.catalogue .content .title {
display: flex;
flex-direction: column;
justify-content: center
}
@media screen and (min-width:768px) {
.catalogue .content .title {
width: 40%
}
}
.catalogue .content .title > span {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/toppage/tit_catalogue_01.png) no-repeat 0 0;
background-size: contain;
display: block;
height: auto
}
.catalogue .content .title > span > span {
font-size: 3.8vw;
visibility: hidden
}
@media screen and (max-width:767px) {
.catalogue .content .title > span > span {
font-size: 32px
}
}
@media screen and (min-width:1020px) {
.catalogue .content .title > span > span {
font-size: 48px
}
}
.catalogue .content .caption {
border-left: 1px solid #000;
padding: 3% 6%
}
@media screen and (min-width:768px) {
.catalogue .content .caption {
width: 60%
}
}
.catalogue .content .for2,
.catalogue .content .for4 {
align-items: center;
display: flex;
flex-direction: column;
width: 50%
}
.catalogue .content .for2 > img,
.catalogue .content .for4 > img {
height: auto;
width: 80%
}
.catalogue .content .for2 > a,
.catalogue .content .for4 > a {
background: #050302;
color: #fff;
margin: 1.2em 0;
padding: .3em 1.2em;
text-align: center;
width: 80%
}
.catalogue .content .for2 > a:hover,
.catalogue .content .for4 > a:hover {
opacity: .8
}
@media screen and (max-width:767px) {
.catalogue .content .for2 > a,
.catalogue .content .for2 > img,
.catalogue .content .for4 > a,
.catalogue .content .for4 > img {
max-width: 200px
}
}
@media screen and (min-width:768px) {
.catalogue .content .for2,
.catalogue .content .for4 {
align-items: flex-end;
padding-right: 1.2em
}
.catalogue .content .for2 > img,
.catalogue .content .for4 > img {
height: auto;
width: 270px
}
.catalogue .content .for2 > a,
.catalogue .content .for4 > a {
width: 270px
}
}
.catalogue > div.content:first-child {
padding: 0 1em 30px
}
@media screen and (max-width:767px) {
.catalogue > div.content:first-child {
flex-direction: column
}
}
.catalogue .cat_main {
height: 500px;
position: relative
}
@media screen and (max-width:767px) {
.catalogue .cat_main {
height: 300px
}
}
.catalogue .cat_cnt {
bottom: 0;
position: absolute;
width: 100%;
z-index: 1
}
@media screen and (max-width:767px) {
.catalogue .cat_cnt {
height: 300px
}
}
.catalogue .cat_bk_inner {
bottom: 0;
display: flex;
flex-direction: row;
height: 400px;
justify-content: center;
position: absolute;
width: 100%;
z-index: 0
}
@media screen and (max-width:767px) {
.catalogue .cat_bk_inner {
height: 200px
}
}
.catalogue .cat_bk_inner > div {
height: auto;
overflow: hidden;
position: relative;
width: 50%
}
.catalogue .cat_bk_inner > div > span {
display: block;
left: 0;
position: absolute;
top: 0
}
.catalogue .cat_bk_inner > div > .bkimg {
filter: grayscale(100%);
height: 120%;
opacity: .25;
width: 120%
}
.catalogue .cat_bk_inner > div > .bkdrop {
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
height: 100%;
width: 100%
}
.catalogue .cat_bk_inner .for2_bk > .bkimg {
background: url(https://www.motorimoda.com/wp-content/uploads/2025/05/labyrinth_vol01_2025_0114_05-1.jpg) no-repeat;
background-size: 100%
}
@media screen and (min-width:768px) {
.catalogue .cat_bk_inner .for2_bk > .bkimg {
background-position-x: -50px;
background-position-y: -200px
}
}
.catalogue .cat_bk_inner .for4_bk > .bkimg {
background: url(https://www.motorimoda.com/wp-content/uploads/2023/11/MMXI_4Drivers_2023.jpg) no-repeat;
background-size: 100%
}
@media screen and (min-width:768px) {
.catalogue .cat_bk_inner .for4_bk > .bkimg {
background-position-x: -50px;
background-position-y: -200px
}
}
.linefriends .title {
font-size: 28px;
padding: 1em
}
@media screen and (max-width:767px) {
.linefriends .title {
font-size: 24px;
line-height: 1.2;
text-align: center
}
}
@media screen and (min-width:768px) {
.linefriends .title {
padding: 0 1em
}
.linefriends .title .spbr {
display: none
}
}
.linefriends .title .logo {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_logo.png);
background-position: 0;
background-repeat: no-repeat;
background-size: 100%
}
.linefriends .title .logo > span {
visibility: hidden
}
.linefriends .inner {
background: #57ab84;
position: relative
}
@media screen and (min-width:768px) {
.linefriends .inner {
height: 36vw;
max-height: 315px
}
}
.linefriends .inner .content {
color: #fff
}
@media screen and (max-width:767px) {
.linefriends .inner .content {
flex-direction: column;
height: 120vw;
overflow: hidden;
position: relative
}
.linefriends .inner .content > div:first-child {
margin-top: 4vw;
padding: 1em;
position: relative;
text-align: center;
width: 100%;
z-index: 2
}
.linefriends .inner .content > div:first-child img {
margin: 0 auto;
width: 35vw
}
.linefriends .inner .content > div:nth-child(2) {
margin-top: 8vw;
position: relative;
z-index: 1
}
.linefriends .inner .content > div:nth-child(2) img {
background: hsla(0, 0%, 100%, .5);
display: block;
height: 50%;
margin: 0 auto;
padding: 5%;
width: 50%
}
.linefriends .inner .content > div:last-child {
bottom: -90px;
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
z-index: 0
}
.linefriends .inner .content > div:last-child img {
display: block;
height: auto;
margin: 0 auto;
padding: 0;
width: 75vw
}
}
@media screen and (min-width:768px) {
.linefriends .inner .content {
align-items: flex-end;
bottom: 0;
display: flex;
flex-direction: row;
left: 0;
margin: 0 auto;
padding: 0 1em;
position: absolute;
right: 0
}
.linefriends .inner .content > div:first-child {
width: 55%
}
.linefriends .inner .content > div:first-child img {
height: auto;
max-width: 300px;
width: 60%
}
.linefriends .inner .content > div:first-child,
.linefriends .inner .content > div:nth-child(2) {
padding: 1em
}
.linefriends .inner .content > div:nth-child(2) {
display: flex;
flex-direction: row;
justify-content: flex-end;
width: 15%
}
.linefriends .inner .content > div:nth-child(2) img {
display: block;
height: auto;
width: 100%
}
.linefriends .inner .content > div:last-child {
width: 30%
}
.linefriends .inner .content > div:last-child img {
display: block;
height: auto;
margin: 0;
padding: 0;
width: 100%
}
}
.linefriends .inner .content p {
line-height: 1.4
}
.linefriends .inner .content .btn {
background: #050302;
color: #ededed;
max-width: 250px;
padding: .6em 2em;
width: 100%
}
.linefriends .inner .content .btn:hover {
background: #170f0a;
filter: brightness(120%)
}
@media screen and (max-width:767px) {
.linefriends .inner .content .btn {
font-size: 4vw
}
}@font-face {
font-family: fs-icon;
font-style: normal;
font-weight: 400;
src: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.ttf?4lt733) format("truetype"), url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.woff?4lt733) format("woff"), url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/css/fonts/fs-icon.svg?4lt733#fs-icon) format("svg")
}
* {
box-sizing: border-box
}
html {
font-size: 10px
}
body {
margin: 0;
padding: 0
}
a {
color: #231815;
text-decoration: none
}
ul {
list-style: none
}
.admin-bar main {
min-height: calc(100vh - 302px)
}
.admin-bar main.menu_open {
height: calc(100vh - 302px)
}
button,
input,
select,
textarea {
font-family: "Noto Serif JP", serif;
font-size: inherit
}
[type=date],
[type=datetime-local],
[type=datetime],
[type=email],
[type=hidden],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week] {
-webkit-appearance: none;
border: 1px solid #ccc;
line-height: 1.4;
min-height: 1.8em;
padding: 3px 5px;
width: 100%
}
img {
height: auto;
width: auto
}
.c-scrollbar--onGray::-webkit-scrollbar,
.c-scrollbar--regular::-webkit-scrollbar {
border-radius: 1.5px;
height: 3px;
width: 3px
}
.c-scrollbar--onGray::-webkit-scrollbar-track,
.c-scrollbar--regular::-webkit-scrollbar-track {
background: #fafafa;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar-thumb,
.c-scrollbar--regular::-webkit-scrollbar-thumb {
background: #eaeaea;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar {
border-radius: 1.5px;
height: 3px;
width: 3px
}
.c-scrollbar--onGray::-webkit-scrollbar-track {
background: #eee;
border-radius: 1.5px
}
.c-scrollbar--onGray::-webkit-scrollbar-thumb {
background: #ccc;
border-radius: 1.5px
}
table.sizechart {
border-collapse: collapse;
margin: 0 auto;
padding: 0;
table-layout: fixed;
width: 100%
}
table.sizechart tr {
background-color: #fff;
border: 1px solid #bbb;
padding: .35em
}
table.sizechart td,
table.sizechart th {
border-right: 1px solid #bbb;
padding: 1em 10px 1em 1em
}
table.sizechart th {
font-size: .75em
}
table.sizechart thead tr {
background-color: #eee
}
table.sizechart .size,
table.sizechart .txt {
font-size: .85em;
text-align: center
}
@media screen and (max-width:767px) {
table.sizechart thead {
display: none
}
table.sizechart tbody tr {
border: none;
display: flex;
flex-direction: row;
flex-wrap: wrap
}
table.sizechart tbody tr th {
border-right: none;
width: 100%
}
table.sizechart tbody tr td {
border-right: none;
margin-top: 30px;
padding: 1rem .5rem;
position: relative
}
table.sizechart tbody tr td:before {
border-bottom: 1px solid #ccc;
content: attr(data-label);
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
top: -15px
}
table.sizechart tbody tr:has(>td:first-child:last-child) td {
width: calc(100%/(1 - 1))
}
table.sizechart tbody tr:has(>td:nth-child(2):last-child) td {
width: 100%
}
table.sizechart tbody tr:has(>td:nth-child(3):last-child) td {
width: 50%
}
table.sizechart tbody tr:has(>td:nth-child(4):last-child) td {
width: 33.33333%
}
table.sizechart tbody tr:has(>td:nth-child(5):last-child) td {
width: 25%
}
table.sizechart tbody tr:has(>td:nth-child(6):last-child) td {
width: 20%
}
table.sizechart tbody tr:has(>td:nth-child(7):last-child) td {
width: 16.66667%
}
table.sizechart tbody tr:has(>td:nth-child(8):last-child) td {
width: 14.28571%
}
table.sizechart tbody tr:has(>td:nth-child(9):last-child) td {
width: 12.5%
}
table.sizechart tbody tr:has(>td:nth-child(10):last-child) td {
width: 11.11111%
}
}
frame-01 {
border: 10px solid #fafafa;
margin: 15px 0;
padding: 10px
}
@media screen and (max-width:767px) {
.layout__item__outer {
padding: 2px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__item__outer {
padding: 10px
}
}
@media screen and (min-width:1020px) {
.layout__item__outer {
padding: 10px
}
}
.layout__item__inner {
background: #fafafa
}
@media screen and (max-width:767px) {
.layout__item__inner {
padding: 5px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__item__inner {
padding: 10px
}
}
@media screen and (min-width:1020px) {
.layout__item__inner {
padding: 15px
}
}
.layout__list {
display: flex;
flex-direction: column
}
@media screen and (max-width:767px) {
.layout__list {
gap: 4px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.layout__list {
gap: 20px
}
}
@media screen and (min-width:1020px) {
.layout__list {
gap: 20px
}
}
.fadeIn {
animation-duration: 1s;
animation-fill-mode: forwards;
animation-name: fadeInAnime;
opacity: 0
}
@keyframes fadeInAnime {
0% {
opacity: 0
}
to {
opacity: 1
}
}
.scroll_bar {
background-color: #f0f0f0
}
.scroll_bar::-webkit-scrollbar {
height: 6px;
width: 6px
}
.scroll_bar::-webkit-scrollbar-track {
background-color: #ccc
}
.scroll_bar::-webkit-scrollbar-thumb {
background-color: #a38000
}
.defalutFontStyle,
body {
color: #333;
font-family: "Noto Serif JP", serif;
font-size: 1.6rem;
letter-spacing: .1rem;
line-height: 2
}
.icon_fb:before {
color: #ddd;
content: "\f09a";
font-family: "Font Awesome 5 Brands"
}
.icon_fb.active:before {
color: #555
}
.icon_tw:before {
color: #ddd;
content: "\f099";
font-family: "Font Awesome 5 Brands"
}
.icon_tw.active:before {
color: #555
}
.icon_insta:before {
color: #ddd;
content: "\f16d";
font-family: "Font Awesome 5 Brands"
}
.icon_insta.active:before {
color: #555
}
.icon_pin:before {
color: #ddd;
content: "\f3c5";
font-family: "Font Awesome 5 Brands"
}
.icon_pin.active:before {
color: #555
}
.icon_tel:before {
color: #ddd;
content: "\f095";
font-family: "Font Awesome 5 Brands"
}
.icon_tel.active:before {
color: #555
}
.aspectFix {
position: relative;
width: 100%
}
.aspectFix:before {
content: "";
display: block;
padding-top: 75%
}
.aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.alinkText {
color: #a78000;
cursor: pointer;
text-decoration: underline
}
.alinkText:hover {
color: #c19400
}
.flex-container {
display: flex
}
.hidden {
display: none !important
}
.sp {
display: none
}
@media screen and (max-width:767px) {
.sp {
display: block
}
}
.c-bottomNavigation {
background: #050302;
bottom: -80px;
height: 65px;
position: fixed;
transition: .4s;
width: 100%;
z-index: 999
}
.c-bottomNavigation__inner {
background: #050302;
height: 50px
}
.c-bottomNavigation.active {
bottom: 0
}
@media screen and (min-width:1020px) {
.c-bottomNavigation.active {
bottom: -65px
}
.c-bottomNavigation .c-bottomNavigation__inner {
display: none
}
}
.c-navigationList {
display: flex;
flex-direction: row;
height: inherit;
justify-content: space-between;
margin: 0;
padding: 0 10px;
width: 100%
}
.c-navigationList__item {
height: 55px;
height: inherit;
width: 55px
}
.c-navigationList__item__inner {
align-items: center;
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-start;
padding-top: 5px;
position: relative;
width: 100%
}
.c-navigationList__item__label {
color: #fff;
font-size: 8px;
line-height: 10px;
order: 2
}
.c-navigationList__item__icon {
display: block;
height: 25px;
order: 1;
width: 25px
}
.c-navigationList__item__icon img {
height: 100%;
line-height: 0;
margin: 0;
padding: 0;
width: 100%
}
.c-navigationList__item:nth-child(3) {
background: #a78000;
border: 4px solid #050302;
border-radius: 33px;
bottom: 9px;
height: 62px;
position: relative;
width: 62px
}
.c-navigationList__item:nth-child(3) .c-navigationList__item__icon {
height: 25px;
width: 25px
}
.c-navigationList__item:first-child .c-navigationList__item__icon img {
padding: 5px
}
.c-navigationList__item:nth-child(2) .c-navigationList__item__icon img,
.c-navigationList__item:nth-child(3) .c-navigationList__item__icon img {
padding: 3px
}
.c-navigationList__item:nth-child(4) .c-navigationList__item__icon img {
padding: 2px
}
.c-navigationList__item:nth-child(5) .c-navigationList__item__icon img {
padding: 4px
}
.c-goTopNavigation {
bottom: 0;
margin: 4px 20px;
opacity: 0;
position: fixed;
right: 0;
transition: .4s;
z-index: 999
}
.c-goTopNavigation.active {
bottom: -10px;
opacity: 1
}
.c-goTopNavigation__list {
align-items: center;
display: flex;
flex-direction: row;
justify-content: flex-end;
text-align: center
}
.c-goTopNavigation__list__item {
height: 70px;
margin: 10px;
width: 70px
}
.c-goTopNavigation__list__item__inner {
align-items: center;
background: rgba(0, 0, 0, .6);
border: 1.5px solid #ccc;
border-radius: 40px;
display: flex;
flex-direction: column;
height: inherit;
justify-content: center;
line-height: 0;
margin: 0;
padding: 0;
position: relative;
width: inherit;
z-index: 999
}
.c-goTopNavigation__list__item:first-child {
height: 80px;
width: 80px
}
.c-goTopNavigation__list__item #pcSearchBtn {
background: rgba(0, 12, 89, .6)
}
.c-goTopNavigation__list__item__label {
color: #ccc;
font-size: 10px;
line-height: 12px;
order: 2
}
.c-goTopNavigation__list__item__icon {
order: 1
}
.c-goTopNavigation__list__item__icon img {
height: 40px;
padding: 5px;
width: 40px
}
@media screen and (max-width:767px) {
.c-goTopNavigation {
display: none
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-goTopNavigation {
display: none
}
}
.c-noticeArea {
line-height: 0;
margin: 0;
padding: 0;
position: fixed;
top: 50px;
width: 100%;
z-index: 100
}
@media screen and (max-width:767px) {
.c-noticeArea.active {
position: fixed;
top: 0
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-noticeArea.active {
position: fixed;
top: 0
}
}
@media screen and (min-width:1020px) {
.c-noticeArea,
.c-noticeArea.active {
position: fixed;
top: 100px
}
}
.c-noticeBannerList {
margin: 0;
overflow: hidden;
padding: 0;
width: 100%
}
.c-noticeBannerList__item {
height: inherit
}
.c-noticeBannerList__item a {
display: flex;
height: inherit;
position: relative;
width: auto
}
.c-noticeBannerList__item a img {
height: 100%;
width: auto
}
@media screen and (max-width:767px) {
.c-noticeBannerList {
height: 60px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-noticeBannerList {
height: 60px
}
}
@media screen and (min-width:1020px) {
.c-noticeBannerList {
height: 120px
}
}
.c-loopBanner__inner {
background: #b7ab00;
display: flex;
height: inherit;
position: relative;
width: 100%
}
.c-loopBanner__inner__item {
height: 100%;
width: auto
}
@media screen and (max-width:767px) {
.c-loopBanner {
height: 60px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-loopBanner {
height: 60px
}
}
@media screen and (min-width:1020px) {
.c-loopBanner {
height: 60px
}
}
.salebanner-slider {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/tmp_sale/20230731_time_sale_bunner_08.webp) 50%;
background-repeat: repeat-x;
margin: 0;
opacity: 0;
padding: 0;
transition: opacity .3s linear
}
.salebanner-slider .slick-slide {
width: 774px
}
.salebanner-slider .slick-slide a {
text-align: center
}
.salebanner-slider.slick-initialized {
opacity: 1
}
.l-contSize {
width: 100%
}
@media screen and (min-width:1020px) {
.l-contSize {
margin: 0 auto;
max-width: 1200px
}
}
.c-column1 {
padding: 40px 0
}
.c-column1__area {
position: relative
}
.c-column1__area,
.c-column1__area img {
height: 100%;
width: 100%
}
.c-column1__area figure {
margin: 0;
padding: 0
}
.adviserArea {
background: #fdf9e6
}
.adviserArea .c-column2.adviserList {
justify-content: center
}
.adviserArea .c-column2.adviserList .c-column2__area {
width: 33.3%
}
@media screen and (max-width:767px) {
.adviserArea .c-column2.adviserList.adjust {
display: flex;
flex-direction: column
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 2;
padding: 20px
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 1
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserArea .c-column2.adviserList.adjust {
display: flex;
flex-direction: row
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 1;
width: 50%
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 2;
width: 35%
}
}
@media screen and (min-width:1020px) {
.adviserArea .c-column2.adviserList.adjust .c-column2__area:first-child {
order: 1;
width: 50%
}
.adviserArea .c-column2.adviserList.adjust .c-column2__area:last-child {
order: 2;
width: 35%
}
}
.adviserArea .adviserMessage {
padding-bottom: 110px
}
.adviserArea .adviserMessage .c-column2 {
border: 1px solid #333;
padding: 0
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea {
padding: 40px 20px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .title {
color: #a78000;
font-size: 2.6rem;
line-height: 3.4rem;
margin: 0;
padding: 40px;
text-align: center
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .message {
font-size: 1.6rem;
line-height: 3.4rem;
margin: 0;
padding: 0 40px 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area img {
font-size: 2rem;
line-height: 4.2rem;
padding: 20px 40px
}
@media screen and (max-width:767px) {
.adviserArea .c-column2.adviserList .c-column2__area {
width: 100%
}
.adviserArea .adviserMessage {
padding: 10px 10px 80px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea {
padding: 0 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .title {
font-size: 1.8rem;
line-height: 3rem;
padding: 40px 0
}
.adviserArea .adviserMessage .c-column2 .c-column2__area.messageArea .message {
font-size: 1.4rem;
line-height: 2.2rem;
padding: 0 0 40px
}
.adviserArea .adviserMessage .c-column2 .c-column2__area img {
margin: 0;
padding: 20px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserArea .adviserMessage {
margin: 0 30px
}
}
.c-column2 {
padding: 40px 0
}
.c-column2__area {
position: relative
}
.c-column2__area img {
height: 100%;
width: 100%
}
.c-column2__area figure {
margin: 0;
padding: 0
}
@media screen and (min-width:1020px) {
.c-column2 {
align-items: center;
display: flex;
flex-direction: row
}
.c-column2__area {
width: 50%
}
}
.c-column3 {
padding: 40px 0
}
.c-column3__area {
position: relative
}
@media screen and (min-width:1020px) {
.c-column3 {
align-items: center;
display: flex;
flex-direction: row
}
.c-column3__area {
width: 33.33%
}
}
.page .c-contHead {
height: 250px;
position: relative;
width: 100%
}
.page .c-contHead__inner {
height: inherit;
position: relative;
width: inherit;
z-index: 200
}
.page .c-contHead__inner h1 {
border: 2px solid #fff;
color: #fff;
display: inline-block;
font-size: 32px;
left: 0;
line-height: 50px;
padding: 50px;
position: absolute;
text-align: left;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%)
}
.page .c-contHead__inner .c-snsList {
bottom: 10px;
position: absolute;
right: 10px
}
.page .c-contHead__inner .c-snsList__item a {
background: #fff
}
.page .c-contHead:before {
background: rgba(0, 0, 0, .5);
content: "";
display: block;
height: 250px;
position: absolute;
top: 0;
width: 100%;
z-index: 1
}
@media screen and (max-width:767px) {
.page .c-contHead {
height: 120px
}
.page .c-contHead__inner h1 {
border: unset;
font-size: 1.8rem;
left: 50%;
line-height: 3rem;
position: absolute;
text-align: center;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
width: 96%
}
.page .c-contHead:before {
height: 120px
}
}
.page .c-contHead.ginza {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/01_ginza/1.jpg);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.chofu {
background: url(https://www.motorimoda.com/wp-content/uploads/2024/03/luce-facade-1.webp);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.koube {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/03_koube/koube-exterior-01.jpg);
background-position: 0 54%;
background-size: 100%
}
.page .c-contHead.fukuoka {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/04_fukuoka/fukuoka-exterior-01.jpg);
background-position: center 69%;
background-size: 100%
}
.page .c-contHead.shibuya {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/05_shibuya/shibuya-interior-01.jpg);
background-position: 50%;
background-size: 100%
}
.page .c-contHead.shinonome {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/06_shinonome/shinonome-interior-03.jpg);
background-position: center 16%;
background-size: 100%
}
.page .c-contHead.kyoto {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/store/07_kyoto/20220916-DSC06410.jpg);
background-position: center 5%;
background-size: 100%
}
.page .c-contHead.nagoya {
background: url(https://www.motorimoda.com/wp-content/uploads/2025/11/nagoya_store-fs.jpg);
background-position: center 50%;
background-size: 100%
}
.c-snsList {
display: flex;
flex-direction: row
}
.c-snsList__item {
height: 20px;
margin: 5px;
width: 20px
}
.c-snsList__item a {
background: #333;
display: block;
height: 100%;
width: 100%
}
.c-snsList__item a span {
font-size: 0;
height: 0;
visibility: hidden;
width: 0
}
.c-snsList__item a.facebook {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%
}
.c-snsList__item a.instagram {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%
}
.c-snsList__item a.twitter {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%
}
.c-snsList__item a.googlemap {
height: 16px;
margin: 2px 0;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
width: 91px
}
.c-ancher {
align-items: center;
border: 1px solid #333;
border-radius: 34px;
bottom: 0;
display: flex;
height: 68px;
justify-content: center;
position: absolute;
right: 80px;
width: 68px
}
.c-ancher .label {
font-size: 12px
}
@media screen and (max-width:767px) {
.c-ancher {
bottom: unset;
margin: 0 auto;
position: relative;
right: unset
}
}
.columnText {
font-size: 20px;
line-height: 42px;
padding: 80px
}
@media screen and (max-width:767px) {
.columnText {
font-size: 1.6rem;
line-height: 3rem;
padding: 40px
}
}
.c-fv-exterior {
height: 100%;
margin: 0;
padding: 0;
width: 100%
}
.c-fv-exterior img {
display: block;
height: 100%;
width: 100%
}
@media screen and (max-width:767px) {
.c-firstView .c-column2 {
display: flex;
flex-direction: column
}
.c-firstView .c-column2__area:first-child {
order: 2
}
.c-firstView .c-column2__area:last-child {
order: 1
}
}
.c-hTitle {
position: relative
}
.c-hTitle .hTitle {
color: #a78000;
font-size: 36px;
font-weight: 700;
letter-spacing: .15rem;
margin: 0;
padding: 80px 0;
position: relative;
text-align: center
}
.c-hTitle .hTitle:after {
background: #a78000;
border-radius: 3px;
bottom: 50px;
content: "";
height: 6px;
left: 50%;
position: absolute;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
width: 100px
}
@media screen and (max-width:767px) {
.c-hTitle .hTitle {
font-size: 2rem;
line-height: 3.2rem;
padding: 50px 0
}
.c-hTitle .hTitle:after {
bottom: 30px
}
}
.c-adviserProfile {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
margin: 20px
}
@media screen and (max-width:767px) {
.c-adviserProfile {
margin: 10px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-adviserProfile {
margin: 10px
}
}
.c-adviserProfile__img img {
height: 100%;
width: 100%
}
.c-adviserProfile__title {
font-size: 2.6rem;
line-height: 4rem;
padding: 20px 0
}
@media screen and (max-width:767px) {
.c-adviserProfile__title {
padding: 10px 0
}
}
.c-adviserProfile__detail__inner dd,
.c-adviserProfile__detail__inner dt {
font-size: 1.3rem;
line-height: 2.2rem;
margin: 0;
padding: 0
}
.c-adviserProfile__detail__inner dd {
padding-bottom: 15px
}
@media screen and (max-width:767px) {
.c-adviserProfile__detail__inner {
display: flex;
flex-direction: row;
flex-wrap: wrap
}
.c-adviserProfile__detail .name {
font-size: 3vw;
line-height: 4.6vw;
width: 30%
}
.c-adviserProfile__detail .definition {
font-size: 3vw;
letter-spacing: .3vw;
line-height: 4.6vw;
width: 70%
}
}
.c-adviserProfile__message .title {
font-size: 1.3rem;
font-weight: 700;
line-height: 2.2rem;
margin: 0
}
.c-adviserProfile__message .message {
font-size: 1.3rem;
letter-spacing: .25vw;
line-height: 2rem;
margin: 0
}
@media screen and (max-width:767px) {
.c-adviserProfile__message .message,
.c-adviserProfile__message .title {
font-size: 3vw
}
}
.storeImageSlide .slick-slide {
padding: 9px
}
.storeImageSlide .slick-slide img {
object-fit: cover;
width: 100%
}
.c-shopMap__title {
font-size: 3.6rem;
font-weight: 700;
padding: 80px 0;
text-align: center
}
@media screen and (max-width:767px) {
.c-shopMap__title {
font-size: 2rem;
padding: 40px 0
}
}
.c-shopMap__area iframe {
height: 370px;
width: 100%
}
.c-shopParking__area {
background: #f7f7f7;
margin: 10px
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopParking {
display: flex;
flex-direction: row
}
.c-shopParking__area {
width: 50%
}
}
@media screen and (min-width:1020px) {
.c-shopParking {
display: flex;
flex-direction: row
}
.c-shopParking__area {
width: 50%
}
}
.c-parkingInfo {
padding: 25px
}
.c-parkingInfo__inner {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
padding: 40px
}
.c-parkingInfo__inner .name {
border-bottom: 1px solid #333;
font-size: 3rem;
line-height: 5rem;
margin: 0;
padding: 0
}
.c-parkingInfo__inner .name:before {
background: #231815;
content: "";
display: block;
height: 100px;
margin: 0 auto;
width: 100px
}
.c-parkingInfo__inner .name.riders:before {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%
}
.c-parkingInfo__inner .name.drivers:before {
height: 100px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
width: 120px
}
.c-parkingInfo__inner .definition {
font-size: 1.6rem;
line-height: 2.4rem;
margin: 0;
padding: 40px
}
@media screen and (max-width:767px) {
.c-parkingInfo {
padding: 10px 5px
}
.c-parkingInfo__inner {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center;
margin: 0;
padding: 0
}
.c-parkingInfo__inner .name {
border: none;
border-right: 1px solid #333;
font-size: 2.5vw;
line-height: 2.5vw;
margin: 0;
padding: 0 10px 0 0;
text-align: center;
width: 40%
}
.c-parkingInfo__inner .name:before {
background: #231815;
content: "";
display: block;
height: 50px;
margin: 0 auto;
width: 50px
}
.c-parkingInfo__inner .name.riders:before {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%
}
.c-parkingInfo__inner .name.drivers:before {
height: 50px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
width: 50px
}
.c-parkingInfo__inner .definition {
font-size: 2.5vw;
line-height: 4vw;
margin: 0;
padding: 0 0 0 10px;
width: 60%
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-parkingInfo {
padding: 0
}
.c-parkingInfo__inner {
padding: 20px
}
.c-parkingInfo__inner .name {
font-size: 2rem;
line-height: 3rem
}
}
.c-feed--instagram .c-feed__header {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/Instagram_logo.svg);
background-position: 50%;
background-repeat: no-repeat;
background-size: 80%;
display: block;
height: 50px;
margin: 0 auto;
padding: 110px 0;
width: 200px
}
.logoInstagram {
visibility: hidden
}
.c-carouselArea {
margin: 0 auto;
padding: 40px 0;
width: 100%
}
.c-feed--instagram {
background: #f7f7f7
}
.c-feed--instagram .c-feed__list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0;
padding: 0
}
.c-feed--instagram .c-feed__list__item {
padding: 2.5px;
width: 25%
}
.c-feed--instagram .c-feed__list__item a,
.c-feed--instagram .c-feed__list__item a img {
height: 100%;
width: 100%
}
@media screen and (max-width:767px) {
.c-feed--instagram .c-feed__list {
padding: 10px
}
.c-feed--instagram .c-feed__list__item {
padding: 0;
width: 50%
}
}
.c-feed--instagram .fs-c-buttonContainer {
padding: 100px 0
}
.c-feed--instagram .fs-c-button--primary {
font-size: 2.5rem;
max-width: 500px;
padding: 3rem 0
}
@media screen and (max-width:767px) {
.c-feed--instagram .fs-c-buttonContainer {
margin: 0 10px;
padding: 50px 0;
width: calc(100% - 20px)
}
.c-feed--instagram .fs-c-button--primary {
font-size: 1.6rem;
line-height: 2.6rem;
padding: 18px 0
}
.c-shopInfo .c-column2 {
display: flex;
flex-direction: column;
padding-bottom: 0
}
.c-shopInfo .c-column2__area {
width: 100%
}
.c-shopInfo .c-column2__area .c-snsList {
position: absolute;
right: 70px;
top: 0
}
.c-shopInfo .c-column2__area:first-child {
order: 2
}
.c-shopInfo .c-column2__area:last-child {
order: 1
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopInfo .c-column2 {
display: flex;
flex-direction: row;
padding: 10px
}
.c-shopInfo .c-column2__area {
width: 100%
}
}
.c-shopProfile {
padding: 20px
}
@media screen and (max-width:767px) {
.c-shopProfile {
padding-bottom: 0
}
}
.c-shopProfile__title .label {
font-size: 3.4rem;
font-weight: 700;
line-height: 4.6rem
}
.c-shopProfile__detail {
padding-right: 50px
}
.c-shopProfile__detail__inner {
display: flex;
flex-direction: row;
flex-wrap: wrap;
font-size: 1.4rem;
line-height: 3rem;
position: relative
}
.c-shopProfile__detail__inner .name {
font-size: 1.4rem;
line-height: 3rem;
margin: 0;
padding: 0;
text-align: left;
width: 20%
}
.c-shopProfile__detail__inner .definition {
font-size: 1.4rem;
justify-self: flex-start;
line-height: 3rem;
margin: 0;
padding: 0;
width: 80%
}
@media screen and (max-width:767px) {
.c-shopProfile__title {
padding: 20px 0
}
.c-shopProfile__title .label {
font-size: 2.2rem
}
.c-shopProfile__detail {
padding: 0
}
.c-shopProfile__detail__inner {
margin: 0;
padding: 20px 0 0
}
.c-shopProfile__detail__inner .definition,
.c-shopProfile__detail__inner .name {
font-size: 1.2rem;
line-height: 3rem
}
.c-shopProfile .c-snsList {
padding-left: 20px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-shopProfile__title {
padding: 20px 0 20px 20px
}
.c-shopProfile__title .label {
font-size: 2.2rem;
font-weight: 700;
line-height: 3rem
}
.c-shopProfile__detail {
padding: 0 20px
}
.c-shopProfile__detail__inner .definition,
.c-shopProfile__detail__inner .name {
font-size: 1.4rem;
line-height: 2.8rem
}
.c-shopProfile .c-snsList {
padding-left: 20px
}
}
.storeImageSlide {
display: none;
height: 100%;
overflow: hidden;
width: 100%
}
.storeImageSlide a.slick-slide {
display: block;
height: 100%;
margin: 10px;
padding: 0;
position: relative;
width: 100%
}
.storeImageSlide a.slick-slide figure {
margin: 0;
position: relative
}
.storeImageSlide a.slick-slide figure img {
height: 100%;
width: 100%
}
.storeImageSlide a.slick-slide figure figcaption {
background: rgba(0, 0, 0, .5);
bottom: 15px;
color: #fff;
font-size: 12px;
line-height: 20px;
position: absolute;
text-indent: 15px;
width: 100%
}
.storeImageSlide .slick-arrow {
z-index: 100
}
.storeImageSlide .slick-next {
right: 20px
}
.storeImageSlide .slick-prev {
left: 20px
}
.storeImageSlide.slick-initialized {
display: block
}
.adviserSlide {
height: 100%;
overflow: hidden;
width: 100%
}
.adviserSlide .slick-slide {
margin: 10px;
padding: 0;
position: relative
}
.adviserSlide .slick-arrow {
z-index: 100
}
@media screen and (min-width:768px)and (max-width:1019px) {
.adviserSlide {
padding: 0 42px
}
.adviserSlide .slick-next,
.adviserSlide .slick-prev {
top: 36%
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000 !important
}
.adviserSlide .slick-prev {
left: 30px
}
.adviserSlide .slick-next {
right: 30px
}
}
@media screen and (min-width:1020px) {
.adviserSlide .slick-next,
.adviserSlide .slick-prev {
top: 36%
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000 !important
}
.adviserSlide .slick-prev {
left: 0
}
.adviserSlide .slick-next {
right: 0
}
}
@media screen and (max-width:767px) {
.adviserSlide {
padding-left: 20px
}
.adviserSlide .slick-prev {
left: 40px
}
.adviserSlide .slick-list {
padding: 0 10% 0 0 !important
}
.adviserSlide .slick-arrow {
top: 40px
}
.adviserSlide .slick-next {
left: 80px
}
.adviserSlide .slick-next:before,
.adviserSlide .slick-prev:before {
color: #000
}
}
.shopListSlider .slick-next:before,
.shopListSlider .slick-prev:before {
color: #000
}
.c-searchItemModal {
height: 100vh;
padding-bottom: 150px;
position: fixed;
top: 0;
transition: .5s;
width: 100%;
z-index: 900
}
.c-searchItemModal * {
min-height: unset;
min-width: unset
}
.c-searchItemModal__inner {
background: #efefef;
height: 100vh;
overflow: hidden;
padding: 0 30px 150px;
position: relative
}
@media screen and (min-width:1020px) {
.c-searchItemModal__inner {
padding: 0
}
}
.c-searchItemModal__header {
color: #555 !important;
font-size: 2.4rem !important;
font-weight: 700 !important;
letter-spacing: .04rem !important;
line-height: 3rem !important;
margin: 0;
padding: 15px 0 !important;
position: relative !important;
text-align: center !important
}
@media screen and (min-width:1020px) {
.c-searchItemModal__header {
border-bottom: 1px solid #555;
text-align: left !important;
text-indent: 30px
}
}
.c-searchItemModal__style__list {
column-gap: 5px;
display: flex;
flex-direction: row;
flex-wrap: wrap
}
.c-searchItemModal__style__list__item {
width: calc(33.33333% - 3.33333px)
}
.c-searchItemModal__style__list__item .aspectFix {
position: relative;
width: 100%
}
.c-searchItemModal__style__list__item .aspectFix:before {
content: "";
display: block;
padding-top: 61.8%
}
.c-searchItemModal__style__list__item .aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-searchItemModal__category__header {
font-weight: 700
}
.c-searchItemModal__category__list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 5px
}
.c-searchItemModal__category__list__item {
width: calc(25% - 3.75px)
}
.c-searchItemModal__category__list__item .aspectFix {
position: relative;
width: 100%
}
.c-searchItemModal__category__list__item .aspectFix:before {
content: "";
display: block;
padding-top: 61.8%
}
.c-searchItemModal__category__list__item .aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-searchItemModal__category__sub .c-subSelect {
border-bottom: 1px solid #555;
margin-top: 5px;
padding: 10px 0
}
.c-searchItemModal__shipping__list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 5px
}
.c-searchItemModal__shipping__list__item {
width: calc(33.33333% - 3.33333px)
}
.c-searchItemModal__shipping__list__item .aspectFix {
position: relative;
width: 100%
}
.c-searchItemModal__shipping__list__item .aspectFix:before {
content: "";
display: block;
padding-top: 43.4%
}
.c-searchItemModal__shipping__list__item .aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-searchItemModal__discount__list,
.c-searchItemModal__itemType__list,
.c-searchItemModal__shape__list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 5px
}
.c-searchItemModal__discount__list__item,
.c-searchItemModal__itemType__list__item,
.c-searchItemModal__shape__list__item {
width: calc(50% - 2.5px)
}
.c-searchItemModal__discount__list__item .aspectFix,
.c-searchItemModal__itemType__list__item .aspectFix,
.c-searchItemModal__shape__list__item .aspectFix {
position: relative;
width: 100%
}
.c-searchItemModal__discount__list__item .aspectFix:before,
.c-searchItemModal__itemType__list__item .aspectFix:before,
.c-searchItemModal__shape__list__item .aspectFix:before {
content: "";
display: block;
padding-top: 29.3%
}
.c-searchItemModal__discount__list__item .aspectFix > :first-child,
.c-searchItemModal__itemType__list__item .aspectFix > :first-child,
.c-searchItemModal__shape__list__item .aspectFix > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-searchItemModal__brand .c-subSelect__label {
width: 22%
}
.c-searchItemModal__brand .c-subSelect__name {
width: 60%
}
.c-searchItemModal__brand .c-subSelect__button {
width: 18%
}
.c-searchItemModal__priceRange {
width: 100%
}
.c-searchItemModal__priceRange__range {
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center
}
.c-searchItemModal__priceRange__range label {
align-items: center;
display: flex;
flex-direction: row;
width: 100%
}
.c-searchItemModal__priceRange__range label > span {
border-right: 1px solid #241716;
height: 100%;
line-height: 2rem;
padding: 0 3px
}
.c-searchItemModal__priceRange__range > span {
font-size: 1.6rem;
line-height: 1.6rem;
padding: 5px 10px
}
.c-searchItemModal__stock__inner {
align-items: center;
border: 1px solid #555;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
margin: 15px auto;
padding: 9px 0;
width: 100%
}
@media screen and (max-width:767px) {
.c-searchItemModal__stock__inner {
flex-direction: column;
padding: 0 0 15px
}
}
.c-searchItemModal__stock__inner > * {
padding: 10px
}
.c-searchItemModal__stock__label {
font-size: 1.6rem
}
.c-searchItemModal__submit__inner {
align-items: center;
column-gap: 10px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0 auto;
padding: 20px 0;
width: 100%
}
@media screen and (min-width:1020px) {
.c-searchItemModal__submit__inner {
flex-wrap: nowrap;
padding: 20px 140px
}
}
.c-searchItemModal__submit .fs-c-buttonContainer:first-child {
width: 36%
}
.c-searchItemModal__submit .fs-c-buttonContainer:nth-child(2) {
width: 60%
}
.c-searchItemModal__submit .fs-c-buttonContainer:last-child {
position: relative
}
@media screen and (min-width:1020px) {
.c-searchItemModal__submit .fs-c-buttonContainer:last-child {
position: unset;
width: auto
}
.c-searchItemModal__submit .fs-c-buttonContainer:last-child .closeWindowBtn--bottom {
right: 15px;
top: 24px
}
}
@media screen and (max-width:767px) {
.c-searchItemModal__submit {
padding-bottom: 170px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-searchItemModal__submit {
padding-bottom: 170px
}
}
.c-searchItemModal__subWindow__inner::-webkit-scrollbar {
position: absolute;
right: 3px;
width: 4px
}
.c-searchItemModal__subWindow__inner::-webkit-scrollbar-track {
background-color: rgba(36, 23, 22, .5)
}
.c-searchItemModal__subWindow__inner::-webkit-scrollbar-thumb {
background-color: #241716;
width: 5px
}
.c-searchItemModal__title {
font-weight: 700
}
.c-searchItemModal__closeButton {
position: relative
}
@media screen and (max-width:767px) {
.c-searchItemModal {
right: -100%
}
.c-searchItemModal .c-searchItemModal__inner {
overflow-y: scroll;
padding-bottom: 100px;
padding-top: 50px
}
.c-searchItemModal .c-searchItemModal__subWindow {
background: #c1bdb3;
bottom: -300px;
display: block;
height: 300px;
overflow-y: scroll;
position: fixed;
right: 0;
transition: .3s;
width: 100vw;
z-index: 998
}
.c-searchItemModal .c-searchItemModal__subWindow__inner {
height: 250px;
margin: 0 auto;
overflow-y: scroll;
padding: 25px 30px
}
.c-searchItemModal .c-searchItemModal__subWindow__closeButton a {
display: block;
height: 30px;
position: absolute;
right: 0;
top: 0;
width: 30px
}
.c-searchItemModal .c-searchItemModal__subWindow__closeButton a img {
height: 100%;
padding: 6px;
width: 100%
}
.c-searchItemModal .c-searchItemModal__subWindow.active {
bottom: 0
}
.c-searchItemModal.active {
right: 0
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-searchItemModal.active {
right: 0
}
.c-searchItemModal {
right: -100%
}
.c-searchItemModal .c-searchItemModal__inner {
overflow-y: scroll;
padding-top: 50px
}
.c-searchItemModal .c-searchItemModal__subWindow {
background: #c1bdb3;
bottom: -500px;
display: block;
height: 500px;
overflow-y: scroll;
position: fixed;
right: 0;
transition: .3s;
width: 100vw;
z-index: 998
}
.c-searchItemModal .c-searchItemModal__subWindow__inner {
height: 450px;
margin: 0 auto;
overflow-y: scroll;
padding: 25px 30px
}
.c-searchItemModal .c-searchItemModal__subWindow__closeButton a {
display: block;
height: 30px;
position: absolute;
right: 8px;
top: 8px;
width: 30px
}
.c-searchItemModal .c-searchItemModal__subWindow__closeButton a img {
height: 100%;
padding: 6px;
width: 100%
}
.c-searchItemModal .c-searchItemModal__subWindow.active {
bottom: 0
}
.c-searchItemModal {
background: #efefef
}
.c-searchItemModal__inner {
overflow-y: scroll
}
}
body.inactive {
height: 100vh;
left: 0;
overflow-y: hidden;
position: fixed;
right: 0
}
html.inactive {
height: 100vh;
overflow: auto
}
.c-subSelect {
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between
}
.c-subSelect__label {
display: block;
font-size: .9rem;
font-weight: 700;
text-align: left
}
.c-subSelect__name {
display: block;
font-size: 1.2rem;
font-weight: 700;
height: 100%;
line-height: 1.4rem;
padding: 0 5px 0 0;
text-align: right
}
.c-subSelect__button {
display: block;
width: 18%
}
.c-subSelect__button .fs-c-button--standard {
width: 100%
}
@media screen and (min-width:1020px) {
.c-subSelect {
padding: 10px 0
}
}
.c-searchItemModal__title {
background: #efefef !important;
color: #555 !important;
font-size: 1.6rem !important;
line-height: 2rem !important;
margin: 15px 0 0 !important;
padding: 10px 0 !important;
position: relative !important;
text-align: left !important
}
.c-searchItemModal__title span {
background: #efefef;
display: inline;
letter-spacing: .1rem;
padding: 0 10px 0 0;
position: relative
}
.c-searchItemModal__title:before {
border-bottom: 1px solid #555;
content: "";
display: block;
height: 1px;
position: absolute;
top: 65%;
width: 100%
}
@media screen and (max-width:767px) {
.c-searchItemModal__form > div:first-child .c-searchItemModal__title {
margin-top: 0
}
}
.closeWindowBtn,
.closeWindowBtn--bottom {
height: 30px;
position: absolute;
width: 30px;
z-index: 500
}
@media screen and (max-width:767px) {
.closeWindowBtn,
.closeWindowBtn--bottom {
right: 0;
top: 17px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.closeWindowBtn,
.closeWindowBtn--bottom {
right: 0;
top: 17px
}
}
@media screen and (min-width:1020px) {
.closeWindowBtn,
.closeWindowBtn--bottom {
right: 15px;
top: 15px
}
}
.closeWindowBtn img,
.closeWindowBtn--bottom img {
height: 100%;
padding: 6px;
width: 100%
}
.closeWindowBtn--bottom {
display: block;
height: 30px;
position: absolute;
right: 0;
width: 30px
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-searchItemModal .c-searchItemModal__inner {
padding: 130px 20% 150px
}
}
@media screen and (min-width:1020px) {
.c-searchItemModal {
width: 0
}
.c-searchItemModal .c-searchItemModal__wrap {
background: rgba(0, 0, 0, .7);
display: flex;
height: 100%;
justify-content: center;
left: 0;
opacity: 0;
overflow: unset;
position: fixed;
top: 0;
transform: scale(0);
transition: opacity .5s, transform 0s .5s;
width: 100%;
z-index: 999
}
.c-searchItemModal .c-searchItemModal__inner {
bottom: 0;
height: 69%;
left: 0;
margin: auto;
max-height: 860px;
position: fixed;
right: 0;
top: 100px;
top: 0;
transform: scale(1.2);
transition: .5s;
width: 900px
}
.c-searchItemModal .c-searchItemModal__inner::-webkit-scrollbar {
display: none
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form {
align-items: flex-start;
column-gap: 15px;
display: flex;
flex-wrap: wrap;
min-height: 50px;
overflow-y: scroll;
padding: 0 10px 31px;
width: 685px
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form > * {
width: calc(50% - 7.5px)
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form::-webkit-scrollbar {
position: absolute;
right: 3px;
width: 4px
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form::-webkit-scrollbar-track {
background-color: rgba(36, 23, 22, .5)
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form::-webkit-scrollbar-thumb {
background-color: #241716;
width: 5px
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__keyword {
order: 1
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__brand {
order: 2
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__style {
order: 3
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__category {
order: 4
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__itemType {
order: 6
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__shipping {
order: 7
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__discount {
order: 5
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__shape {
order: 8
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__stock {
order: 9;
width: 100%
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__form .c-searchItemModal__submit {
background: #efefef;
border-top: 1px solid #555;
bottom: 0;
left: 0;
position: absolute;
width: 100%;
z-index: 100
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__subWindow {
background: #c1bdb3;
height: 100%;
position: relative;
right: 0;
width: 215px
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__subWindow__inner {
overflow-y: scroll;
width: inherit
}
.c-searchItemModal .c-searchItemModal__inner .c-searchItemModal__subWindow__closeButton {
display: none
}
.c-searchItemModal .devide {
display: flex;
flex-direction: row
}
.c-searchItemModal.active .c-searchItemModal__wrap {
opacity: 1;
transform: scale(1);
transition: opacity .5s
}
.c-searchItemModal.active .c-searchItemModal__inner {
transform: scale(1)
}
}
.c-subWindow__head {
align-self: flex-start;
font-size: 1.6rem;
padding: 20px 0 10px
}
.c-inputTextContainer {
background: #fff;
border: 1px solid #241716;
border-radius: 3px;
display: block;
font-size: 1.6rem;
line-height: 1.6rem;
padding: 2px
}
input[type=search].c-inputText,
input[type=text].c-inputText {
border: none;
outline: 0;
padding: 3px 6px;
text-align: left
}
.subSelectItemList {
align-items: flex-end;
display: none;
flex-direction: column;
font-weight: 700;
padding: 10px
}
.subSelectItemList span {
border-bottom: 1px solid #241716;
display: block;
padding: .4rem 5px .4rem 0;
text-align: right;
width: 100%
}
.subSelectItemList span.active,
.subSelectItemList span:first-child {
background: #241716;
border-radius: 3px;
color: #fff
}
@media screen and (max-width:767px) {
.subSelectItemList {
font-size: 1.3rem;
line-height: 2.4rem
}
}
@media screen and (min-width:1020px) {
.subSelectItemList {
font-size: 1rem;
line-height: 2.2rem
}
}
#brandBox.active,
#categoryBox--accessory.active,
#categoryBox--bag.active,
#categoryBox--gloves.active,
#categoryBox--goggles.active,
#categoryBox--helmet.active,
#categoryBox--shoes.active,
#categoryBox--watch.active,
#categoryBox--wear.active {
animation: fadeIn .7s cubic-bezier(.33, 1, .68, 1) 1 forwards;
display: flex
}
@keyframes fadeIn {
0% {
opacity: 0
}
to {
opacity: 1
}
}
@keyframes fadeOut {
0% {
opacity: 1
}
to {
opacity: 0
}
}
html {
-webkit-appearance: none
}
.c-articleSearch {
border: 1px solid #241716;
border-radius: 3px;
padding: 20px
}
.c-articleSearch__header {
color: #555;
font-size: 1.6rem;
line-height: 2rem;
margin: 0 0 15px;
padding: 0 0 10px;
position: relative;
text-align: center
}
@media screen and (max-width:767px) {
.c-articleSearch__inner {
align-items: flex-end;
display: flex;
flex-direction: column
}
.c-articleSearch > *,
.c-articleSearch__input,
.c-articleSearch__input .c-inputText {
width: 100%
}
.c-articleSearch__button {
padding: 4px 0
}
}
.c-searchItemModalButton,
.c-searchItemModalButton--row {
align-items: center;
background: #fff;
border: 1px solid #555;
border-radius: 3px;
cursor: pointer;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
overflow: hidden;
padding: 2px;
transition: .3s;
width: 100%
}
.c-searchItemModalButton .input,
.c-searchItemModalButton--row .input {
display: none;
order: 3
}
.c-searchItemModalButton .label,
.c-searchItemModalButton--row .label {
font-size: .9rem;
font-weight: 700;
line-height: 1.4rem;
min-height: unset;
min-width: unset;
order: 2;
text-align: center
}
.c-searchItemModalButton .image,
.c-searchItemModalButton--row .image {
display: block;
height: 100%;
order: 1;
width: 100%
}
.c-searchItemModalButton .image span,
.c-searchItemModalButton--row .image span {
background: #241716;
display: block;
height: 100%;
width: 100%
}
.c-searchItemModalButton .image .riders,
.c-searchItemModalButton--row .image .riders {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/60%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/60%
}
.c-searchItemModalButton .image .drivers,
.c-searchItemModalButton--row .image .drivers {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center 70%/75%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center 70%/75%
}
.c-searchItemModalButton .image .motersports,
.c-searchItemModalButton--row .image .motersports {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-motersports.svg) no-repeat center 70%/80%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-motersports.svg) no-repeat center 70%/80%
}
.c-searchItemModalButton .image .helmet,
.c-searchItemModalButton--row .image .helmet {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/44%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/44%
}
.c-searchItemModalButton .image .goggles,
.c-searchItemModalButton--row .image .goggles {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 25%/50%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 25%/50%
}
.c-searchItemModalButton .image .wear,
.c-searchItemModalButton--row .image .wear {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/45%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/45%
}
.c-searchItemModalButton .image .gloves,
.c-searchItemModalButton--row .image .gloves {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 25%/44%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 25%/44%
}
.c-searchItemModalButton .image .shoes,
.c-searchItemModalButton--row .image .shoes {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 25%/49%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 25%/49%
}
.c-searchItemModalButton .image .bag,
.c-searchItemModalButton--row .image .bag {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 35%/46%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 35%/46%
}
.c-searchItemModalButton .image .mask,
.c-searchItemModalButton--row .image .mask {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat07-mask.svg) no-repeat center 70%/34%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat07-mask.svg) no-repeat center 70%/34%
}
.c-searchItemModalButton .image .accessories,
.c-searchItemModalButton--row .image .accessories {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 52%/11%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center 52%/11%
}
.c-searchItemModalButton .image .watch,
.c-searchItemModalButton--row .image .watch {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 70%/40%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 70%/40%
}
.c-searchItemModalButton .image .new,
.c-searchItemModalButton--row .image .new {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center 70%/40%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center 70%/40%
}
.c-searchItemModalButton .image .b-outlet,
.c-searchItemModalButton--row .image .b-outlet {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center 70%/40%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center 70%/40%
}
.c-searchItemModalButton .image .ladies,
.c-searchItemModalButton--row .image .ladies {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-redies.svg) no-repeat center 70%/40%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-redies.svg) no-repeat center 70%/40%
}
.c-searchItemModalButton .image .kids,
.c-searchItemModalButton--row .image .kids {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center 70%/40%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center 70%/40%
}
.c-searchItemModalButton .image .restock,
.c-searchItemModalButton--row .image .restock {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype05-restock.svg) no-repeat center 50%/70%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype05-restock.svg) no-repeat center 50%/70%
}
.active.c-searchItemModalButton--row .accessories,
.active.c-searchItemModalButton--row .b-outlet,
.active.c-searchItemModalButton--row .bag,
.active.c-searchItemModalButton--row .booking,
.active.c-searchItemModalButton--row .drivers,
.active.c-searchItemModalButton--row .gloves,
.active.c-searchItemModalButton--row .goggles,
.active.c-searchItemModalButton--row .helmet,
.active.c-searchItemModalButton--row .kids,
.active.c-searchItemModalButton--row .ladies,
.active.c-searchItemModalButton--row .mask,
.active.c-searchItemModalButton--row .motersports,
.active.c-searchItemModalButton--row .new,
.active.c-searchItemModalButton--row .order,
.active.c-searchItemModalButton--row .outlet,
.active.c-searchItemModalButton--row .restock,
.active.c-searchItemModalButton--row .riders,
.active.c-searchItemModalButton--row .shoes,
.active.c-searchItemModalButton--row .somedayDeli,
.active.c-searchItemModalButton--row .watch,
.active.c-searchItemModalButton--row .wear,
.c-searchItemModalButton.active .accessories,
.c-searchItemModalButton.active .b-outlet,
.c-searchItemModalButton.active .bag,
.c-searchItemModalButton.active .booking,
.c-searchItemModalButton.active .drivers,
.c-searchItemModalButton.active .gloves,
.c-searchItemModalButton.active .goggles,
.c-searchItemModalButton.active .helmet,
.c-searchItemModalButton.active .kids,
.c-searchItemModalButton.active .ladies,
.c-searchItemModalButton.active .mask,
.c-searchItemModalButton.active .motersports,
.c-searchItemModalButton.active .new,
.c-searchItemModalButton.active .order,
.c-searchItemModalButton.active .outlet,
.c-searchItemModalButton.active .restock,
.c-searchItemModalButton.active .riders,
.c-searchItemModalButton.active .shoes,
.c-searchItemModalButton.active .somedayDeli,
.c-searchItemModalButton.active .watch,
.c-searchItemModalButton.active .wear {
background: #fff
}
.active.c-searchItemModalButton--row,
.c-searchItemModalButton.active {
background: #241716;
color: #fff
}
.c-searchItemModalButton--row {
flex-direction: row
}
.c-searchItemModalButton--row .image {
height: 36px;
width: 36px
}
.c-searchItemModalButton--row .image .new {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center center/66%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center center/66%
}
.c-searchItemModalButton--row .image .b-outlet {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center center/66%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center center/66%
}
.c-searchItemModalButton--row .image .ladies {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-ladies.svg) no-repeat center center/56%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-ladies.svg) no-repeat center center/56%
}
.c-searchItemModalButton--row .image .kids {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center center/66%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center center/66%
}
.c-searchItemModalButton--row .image .somedayDeli {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M112 0C85.5 0 64 21.5 64 48v48H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h256c8.8 0 16 7.2 16 16s-7.2 16-16 16H48c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zm432 237.3V256H416v-96h50.7l77.3 77.3zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm272 48a48 48 0 1 1 96 0 48 48 0 1 1-96 0z"/></svg>') no-repeat center center/64%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M112 0C85.5 0 64 21.5 64 48v48H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h256c8.8 0 16 7.2 16 16s-7.2 16-16 16H48c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zm432 237.3V256H416v-96h50.7l77.3 77.3zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm272 48a48 48 0 1 1 96 0 48 48 0 1 1-96 0z"/></svg>') no-repeat center center/64%;
transform: scaleX(-1)
}
.c-searchItemModalButton--row .image .order {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M58.9 42.1c3-6.1 9.6-9.6 16.3-8.7L320 64l244.8-30.6c6.7-.8 13.3 2.7 16.3 8.7l41.7 83.4c9 17.9-.6 39.6-19.8 45.1l-163.4 46.7c-13.9 4-28.8-1.9-36.2-14.3L320 64l-83.4 139c-7.4 12.4-22.3 18.3-36.2 14.3L37.1 170.6c-19.3-5.5-28.8-27.2-19.8-45.1l41.6-83.4zM321.1 128l54.9 91.4c14.9 24.8 44.6 36.6 72.5 28.6L576 211.6v167c0 22-15 41.2-36.4 46.6l-204.1 51c-10.2 2.6-20.9 2.6-31 0l-204.1-51C79 419.7 64 400.5 64 378.5v-167L191.6 248c27.8 8 57.6-3.8 72.5-28.6l54.8-91.4h2.2z"/></svg>') no-repeat center center/68%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M58.9 42.1c3-6.1 9.6-9.6 16.3-8.7L320 64l244.8-30.6c6.7-.8 13.3 2.7 16.3 8.7l41.7 83.4c9 17.9-.6 39.6-19.8 45.1l-163.4 46.7c-13.9 4-28.8-1.9-36.2-14.3L320 64l-83.4 139c-7.4 12.4-22.3 18.3-36.2 14.3L37.1 170.6c-19.3-5.5-28.8-27.2-19.8-45.1l41.6-83.4zM321.1 128l54.9 91.4c14.9 24.8 44.6 36.6 72.5 28.6L576 211.6v167c0 22-15 41.2-36.4 46.6l-204.1 51c-10.2 2.6-20.9 2.6-31 0l-204.1-51C79 419.7 64 400.5 64 378.5v-167L191.6 248c27.8 8 57.6-3.8 72.5-28.6l54.8-91.4h2.2z"/></svg>') no-repeat center center/68%
}
.c-searchItemModalButton--row .image .booking {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M96 0C43 0 0 43 0 96v320c0 53 43 96 96 96h320c17.7 0 32-14.3 32-32s-14.3-32-32-32v-64c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H96zm0 384h256v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/></svg>') no-repeat center center/50%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M96 0C43 0 0 43 0 96v320c0 53 43 96 96 96h320c17.7 0 32-14.3 32-32s-14.3-32-32-32v-64c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H96zm0 384h256v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/></svg>') no-repeat center center/50%
}
.c-searchItemModalButton--row .image .outlet {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M211 7.3C205 1 196-1.4 187.6.8s-14.9 8.9-17.1 17.3l-15.8 62.5-62-17.5c-8.4-2.4-17.4 0-23.5 6.1s-8.5 15.1-6.1 23.5l17.5 62-62.5 15.9c-8.4 2.1-15 8.7-17.3 17.1S1 205 7.3 211l46.2 45-46.2 45c-6.3 6-8.7 15-6.5 23.4s8.9 14.9 17.3 17.1l62.5 15.8-17.5 62c-2.4 8.4 0 17.4 6.1 23.5s15.1 8.5 23.5 6.1l62-17.5 15.8 62.5c2.1 8.4 8.7 15 17.1 17.3s17.3-.2 23.4-6.4l45-46.2 45 46.2c6.1 6.2 15 8.7 23.4 6.4s14.9-8.9 17.1-17.3l15.8-62.5 62 17.5c8.4 2.4 17.4 0 23.5-6.1s8.5-15.1 6.1-23.5l-17.5-62 62.5-15.8c8.4-2.1 15-8.7 17.3-17.1s-.2-17.3-6.4-23.4l-46.2-45 46.2-45c6.2-6.1 8.7-15 6.4-23.4s-8.9-14.9-17.3-17.1l-62.5-15.8 17.5-62c2.4-8.4 0-17.4-6.1-23.5s-15.1-8.5-23.5-6.1l-62 17.5-15.9-62.5c-2.1-8.4-8.7-15-17.1-17.3S307 1 301 7.3l-45 46.2-45-46.2z"/></svg>') no-repeat center center/50%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M211 7.3C205 1 196-1.4 187.6.8s-14.9 8.9-17.1 17.3l-15.8 62.5-62-17.5c-8.4-2.4-17.4 0-23.5 6.1s-8.5 15.1-6.1 23.5l17.5 62-62.5 15.9c-8.4 2.1-15 8.7-17.3 17.1S1 205 7.3 211l46.2 45-46.2 45c-6.3 6-8.7 15-6.5 23.4s8.9 14.9 17.3 17.1l62.5 15.8-17.5 62c-2.4 8.4 0 17.4 6.1 23.5s15.1 8.5 23.5 6.1l62-17.5 15.8 62.5c2.1 8.4 8.7 15 17.1 17.3s17.3-.2 23.4-6.4l45-46.2 45 46.2c6.1 6.2 15 8.7 23.4 6.4s14.9-8.9 17.1-17.3l15.8-62.5 62 17.5c8.4 2.4 17.4 0 23.5-6.1s8.5-15.1 6.1-23.5l-17.5-62 62.5-15.8c8.4-2.1 15-8.7 17.3-17.1s-.2-17.3-6.4-23.4l-46.2-45 46.2-45c6.2-6.1 8.7-15 6.4-23.4s-8.9-14.9-17.3-17.1l-62.5-15.8 17.5-62c2.4-8.4 0-17.4-6.1-23.5s-15.1-8.5-23.5-6.1l-62 17.5-15.9-62.5c-2.1-8.4-8.7-15-17.1-17.3S307 1 301 7.3l-45 46.2-45-46.2z"/></svg>') no-repeat center center/50%
}
.btnshine {
outline: none;
overflow: hidden;
position: relative;
text-decoration: none
}
.btnshine:before {
background: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, hsla(0, 0%, 100%, .3));
content: "";
height: 100%;
left: -75%;
position: absolute;
top: 0;
transform: skewX(-25deg);
width: 50%
}
.btnshine.active:before {
animation: shine .7s
}
@keyframes shine {
to {
left: 125%
}
}
.c-switch {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
cursor: pointer;
height: 30px;
margin: 0;
outline: none;
position: relative;
width: 60px
}
.c-switch input[type=checkbox] {
display: none
}
.c-switch:before {
border: 1px solid #241716;
border-radius: 20px;
content: "";
height: 25%;
left: 0;
left: 50%;
top: 53%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: .2s ease-in-out;
transition: .2s ease-in-out;
width: 50%
}
.c-switch:after,
.c-switch:before {
display: block;
outline: none;
position: absolute
}
.c-switch:after {
background: #fff;
border: 1px solid #241716;
border-radius: 16.14px;
box-shadow: 0 3px 12px -4px rgba(0, 0, 0, .3);
content: "OFF";
font-family: Yu Gothic, 貂ｸ繧ｴ繧ｷ繝�け, YuGothic, 貂ｸ繧ｴ繧ｷ繝�け菴�, 繝偵Λ繧ｮ繝手ｧ偵ざ Pro W3, 繝｡繧､繝ｪ繧ｪ, sans-serif;
font-size: .8rem;
font-weight: 700;
height: 30px;
left: 0;
letter-spacing: .01rem;
line-height: 32px;
padding: 0;
text-align: center;
top: 0;
-webkit-transition: .2s ease-out;
transition: .2s ease-out;
width: 30px
}
.c-switch.active:before {
background: #241716;
outline: none
}
.c-switch.active:after {
content: "ON";
left: 48%;
outline: none
}
:focus {
outline: none
}
.fs-c-leftNavigation__stock__inner > .c-switch,
a {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
cursor: pointer
}
.fs-c-leftNavigation__stock__inner > .c-switch {
height: 23px;
margin: 0;
outline: none;
position: relative;
width: 46px
}
.fs-c-leftNavigation__stock__inner > .c-switch input[type=checkbox] {
display: none
}
.fs-c-leftNavigation__stock__inner > .c-switch:before {
border: 1px solid #666;
border-radius: 20px;
content: "";
display: block;
height: 25%;
left: 0;
left: 50%;
outline: none;
position: absolute;
top: 53%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: .2s ease-in-out;
transition: .2s ease-in-out;
width: 50%
}
.fs-c-leftNavigation__stock__inner > .c-switch:after {
background: #fff;
border: 1px solid #666;
border-radius: 12.374px;
box-shadow: 0 3px 12px -4px rgba(0, 0, 0, .3);
color: #666;
content: "OFF";
display: block;
font-family: Yu Gothic, 貂ｸ繧ｴ繧ｷ繝�け, YuGothic, 貂ｸ繧ｴ繧ｷ繝�け菴�, 繝偵Λ繧ｮ繝手ｧ偵ざ Pro W3, 繝｡繧､繝ｪ繧ｪ, sans-serif;
font-size: .8rem;
font-weight: 700;
height: 23px;
left: 0;
letter-spacing: .01rem;
line-height: 26px;
outline: none;
padding: 0;
position: absolute;
text-align: center;
top: 0;
-webkit-transition: .2s ease-out;
transition: .2s ease-out;
width: 23px
}
.fs-c-leftNavigation__stock__inner > .c-switch.active:before {
background: #8f8f8f;
outline: none
}
.fs-c-leftNavigation__stock__inner > .c-switch.active:after {
content: "ON";
left: 48%;
outline: none
}
.c-searchSelectedWindow {
background: rgba(0, 0, 0, .6);
bottom: -51px;
display: block;
height: 51px;
opacity: 0;
position: fixed;
transition: .3s;
width: auto;
z-index: 500
}
.c-searchSelectedWindow__inner {
align-items: flex-start;
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center
}
.c-searchSelectedWindow__header {
color: #fff;
font-size: 1.8vw;
margin: 0 5px;
order: 2;
padding: 3px 5px;
width: calc(100% - 10px)
}
.c-searchSelectedWindow__list {
column-gap: 5px;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
order: 1;
overflow-x: scroll;
overflow-y: hidden;
padding: 3px 5px;
white-space: nowrap;
width: 100vw
}
.c-searchSelectedWindow__list::-webkit-scrollbar {
height: 3px;
position: absolute;
right: 1px;
width: 3px
}
.c-searchSelectedWindow__list::-webkit-scrollbar-track {
background-color: rgba(36, 23, 22, .5)
}
.c-searchSelectedWindow__list::-webkit-scrollbar-thumb {
background-color: #241716;
width: 5px
}
.c-searchSelectedWindow__item {
align-items: center;
border: 1px solid #fff;
color: #fff;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
font-size: 1rem;
height: 20px;
line-height: 1rem;
min-height: unset;
min-width: unset;
padding: 3px 5px
}
.c-searchSelectedWindow.active {
display: block;
opacity: 1
}
@media screen and (max-width:767px) {
.c-searchSelectedWindow {
left: 0
}
.c-searchSelectedWindow__header {
border-top: 1px solid #fff;
font-size: 2.6vw
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-searchSelectedWindow {
left: 0;
width: 100vw
}
.c-searchSelectedWindow__header {
border-top: 1px solid #fff;
font-size: 1rem;
width: 180px;
width: 100%
}
.c-searchSelectedWindow__list {
width: 100%
}
}
@media screen and (min-width:1020px) {
.c-searchSelectedWindow {
border: 1.5px solid #ccc;
border-radius: 5px;
bottom: 115px;
height: auto;
right: 20px;
width: 280px
}
.c-searchSelectedWindow__header {
border-bottom: 1px solid #fff;
color: #fff;
font-size: 1.3rem;
font-weight: 700;
margin: 0;
padding: 10px 5px;
text-align: center;
width: 100%
}
.c-searchSelectedWindow__inner {
align-items: center;
display: block;
flex-direction: unset;
flex-wrap: unset
}
.c-searchSelectedWindow__list {
column-gap: 5px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
overflow-x: unset;
overflow-y: unset;
padding: 5px;
row-gap: 5px;
white-space: unset;
width: 100%
}
.c-searchSelectedWindow__item {
height: 34px;
padding: 3px 5px
}
.c-searchSelectedWindow__item .image {
display: block;
height: 40px;
margin-left: 10px;
width: 40px
}
.c-searchSelectedWindow__item .image span {
background: #fff;
display: block;
height: 100%;
width: 100%
}
.c-searchSelectedWindow__item .image .none {
display: none
}
.c-searchSelectedWindow__item .image .riders {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-2riders.svg) no-repeat center center/100%
}
.c-searchSelectedWindow__item .image .drivers {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-4drivers.svg) no-repeat center center/100%
}
.c-searchSelectedWindow__item .image .motersports {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-motersports.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/img-motersports.svg) no-repeat center center/100%
}
.c-searchSelectedWindow__item .image .helmet {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat01-helmet.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .goggles {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat02-goggle.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .wear {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat03-wear.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .gloves {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat04-gloves.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .shoes {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat05-shoes.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .bag {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat06-bag.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .accessory {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center center/22%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat08-accessories.svg) no-repeat center center/22%
}
.c-searchSelectedWindow__item .image .watch {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-cat09-watch.svg) no-repeat center 0/100%
}
.c-searchSelectedWindow__item .image .new {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center center/70%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype01-new.svg) no-repeat center center/70%
}
.c-searchSelectedWindow__item .image .b-outlet {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center center/70%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype02-reason.svg) no-repeat center center/70%
}
.c-searchSelectedWindow__item .image .ladies {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-ladies.svg) no-repeat center center/55%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype03-ladies.svg) no-repeat center center/55%
}
.c-searchSelectedWindow__item .image .kids {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center center/65%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype04-kids.svg) no-repeat center center/65%
}
.c-searchSelectedWindow__item .image .restock {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype05-restock.svg) no-repeat center center/70%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/search-ico-itemtype05-restock.svg) no-repeat center center/70%
}
.c-searchSelectedWindow__item .image .somedayDeli {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M112 0C85.5 0 64 21.5 64 48v48H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h256c8.8 0 16 7.2 16 16s-7.2 16-16 16H48c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zm432 237.3V256H416v-96h50.7l77.3 77.3zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm272 48a48 48 0 1 1 96 0 48 48 0 1 1-96 0z"/></svg>') no-repeat center center/64%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M112 0C85.5 0 64 21.5 64 48v48H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h256c8.8 0 16 7.2 16 16s-7.2 16-16 16H48c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H16c-8.8 0-16 7.2-16 16s7.2 16 16 16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H64v128c0 53 43 96 96 96s96-43 96-96h128c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H112zm432 237.3V256H416v-96h50.7l77.3 77.3zM160 368a48 48 0 1 1 0 96 48 48 0 1 1 0-96zm272 48a48 48 0 1 1 96 0 48 48 0 1 1-96 0z"/></svg>') no-repeat center center/64%;
transform: scaleX(-1)
}
.c-searchSelectedWindow__item .image .order {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M58.9 42.1c3-6.1 9.6-9.6 16.3-8.7L320 64l244.8-30.6c6.7-.8 13.3 2.7 16.3 8.7l41.7 83.4c9 17.9-.6 39.6-19.8 45.1l-163.4 46.7c-13.9 4-28.8-1.9-36.2-14.3L320 64l-83.4 139c-7.4 12.4-22.3 18.3-36.2 14.3L37.1 170.6c-19.3-5.5-28.8-27.2-19.8-45.1l41.6-83.4zM321.1 128l54.9 91.4c14.9 24.8 44.6 36.6 72.5 28.6L576 211.6v167c0 22-15 41.2-36.4 46.6l-204.1 51c-10.2 2.6-20.9 2.6-31 0l-204.1-51C79 419.7 64 400.5 64 378.5v-167L191.6 248c27.8 8 57.6-3.8 72.5-28.6l54.8-91.4h2.2z"/></svg>') no-repeat center center/68%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M58.9 42.1c3-6.1 9.6-9.6 16.3-8.7L320 64l244.8-30.6c6.7-.8 13.3 2.7 16.3 8.7l41.7 83.4c9 17.9-.6 39.6-19.8 45.1l-163.4 46.7c-13.9 4-28.8-1.9-36.2-14.3L320 64l-83.4 139c-7.4 12.4-22.3 18.3-36.2 14.3L37.1 170.6c-19.3-5.5-28.8-27.2-19.8-45.1l41.6-83.4zM321.1 128l54.9 91.4c14.9 24.8 44.6 36.6 72.5 28.6L576 211.6v167c0 22-15 41.2-36.4 46.6l-204.1 51c-10.2 2.6-20.9 2.6-31 0l-204.1-51C79 419.7 64 400.5 64 378.5v-167L191.6 248c27.8 8 57.6-3.8 72.5-28.6l54.8-91.4h2.2z"/></svg>') no-repeat center center/68%
}
.c-searchSelectedWindow__item .image .booking {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M96 0C43 0 0 43 0 96v320c0 53 43 96 96 96h320c17.7 0 32-14.3 32-32s-14.3-32-32-32v-64c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H96zm0 384h256v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/></svg>') no-repeat center center/50%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M96 0C43 0 0 43 0 96v320c0 53 43 96 96 96h320c17.7 0 32-14.3 32-32s-14.3-32-32-32v-64c17.7 0 32-14.3 32-32V32c0-17.7-14.3-32-32-32H96zm0 384h256v64H96c-17.7 0-32-14.3-32-32s14.3-32 32-32zm32-240c0-8.8 7.2-16 16-16h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16zm16 48h192c8.8 0 16 7.2 16 16s-7.2 16-16 16H144c-8.8 0-16-7.2-16-16s7.2-16 16-16z"/></svg>') no-repeat center center/50%
}
.c-searchSelectedWindow__item .image .outlet {
mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M211 7.3C205 1 196-1.4 187.6.8s-14.9 8.9-17.1 17.3l-15.8 62.5-62-17.5c-8.4-2.4-17.4 0-23.5 6.1s-8.5 15.1-6.1 23.5l17.5 62-62.5 15.9c-8.4 2.1-15 8.7-17.3 17.1S1 205 7.3 211l46.2 45-46.2 45c-6.3 6-8.7 15-6.5 23.4s8.9 14.9 17.3 17.1l62.5 15.8-17.5 62c-2.4 8.4 0 17.4 6.1 23.5s15.1 8.5 23.5 6.1l62-17.5 15.8 62.5c2.1 8.4 8.7 15 17.1 17.3s17.3-.2 23.4-6.4l45-46.2 45 46.2c6.1 6.2 15 8.7 23.4 6.4s14.9-8.9 17.1-17.3l15.8-62.5 62 17.5c8.4 2.4 17.4 0 23.5-6.1s8.5-15.1 6.1-23.5l-17.5-62 62.5-15.8c8.4-2.1 15-8.7 17.3-17.1s-.2-17.3-6.4-23.4l-46.2-45 46.2-45c6.2-6.1 8.7-15 6.4-23.4s-8.9-14.9-17.3-17.1l-62.5-15.8 17.5-62c2.4-8.4 0-17.4-6.1-23.5s-15.1-8.5-23.5-6.1l-62 17.5-15.9-62.5c-2.1-8.4-8.7-15-17.1-17.3S307 1 301 7.3l-45 46.2-45-46.2z"/></svg>') no-repeat center center/50%;
-webkit-mask: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc.--><path d="M211 7.3C205 1 196-1.4 187.6.8s-14.9 8.9-17.1 17.3l-15.8 62.5-62-17.5c-8.4-2.4-17.4 0-23.5 6.1s-8.5 15.1-6.1 23.5l17.5 62-62.5 15.9c-8.4 2.1-15 8.7-17.3 17.1S1 205 7.3 211l46.2 45-46.2 45c-6.3 6-8.7 15-6.5 23.4s8.9 14.9 17.3 17.1l62.5 15.8-17.5 62c-2.4 8.4 0 17.4 6.1 23.5s15.1 8.5 23.5 6.1l62-17.5 15.8 62.5c2.1 8.4 8.7 15 17.1 17.3s17.3-.2 23.4-6.4l45-46.2 45 46.2c6.1 6.2 15 8.7 23.4 6.4s14.9-8.9 17.1-17.3l15.8-62.5 62 17.5c8.4 2.4 17.4 0 23.5-6.1s8.5-15.1 6.1-23.5l-17.5-62 62.5-15.8c8.4-2.1 15-8.7 17.3-17.1s-.2-17.3-6.4-23.4l-46.2-45 46.2-45c6.2-6.1 8.7-15 6.4-23.4s-8.9-14.9-17.3-17.1l-62.5-15.8 17.5-62c2.4-8.4 0-17.4-6.1-23.5s-15.1-8.5-23.5-6.1l-62 17.5-15.9-62.5c-2.1-8.4-8.7-15-17.1-17.3S307 1 301 7.3l-45 46.2-45-46.2z"/></svg>') no-repeat center center/50%
}
}
.c-header {
background: #050302;
color: #fff;
position: fixed;
width: 100%;
z-index: 800
}
.c-header ul {
padding: 0
}
@media screen and (max-width:767px) {
.c-header {
position: relative
}
}
.c-header__inner {
display: flex;
flex-direction: column
}
.c-header__common {
align-items: center;
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0 10px
}
@media screen and (max-width:767px) {
.c-header__common {
height: 50px;
position: relative;
z-index: 300
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-header__common {
height: 70px
}
}
@media screen and (min-width:1020px) {
.c-header__common {
height: 70px
}
}
.c-header__logo__img {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_logo.png) no-repeat 50%;
background-size: 100%;
display: block
}
@media screen and (max-width:767px) {
.c-header__logo__img {
width: 110px
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-header__logo__img {
height: 22px;
width: 148px
}
}
@media screen and (min-width:1020px) {
.c-header__logo__img {
height: 22px;
width: 148px
}
}
.c-header__logo__img span {
visibility: hidden
}
.c-header__searchBox {
align-items: center;
background: #fff;
border: 1px solid #666;
border-radius: 5px;
display: flex;
flex-direction: row
}
.c-header__searchBox__keyword {
background: none;
border: none !important;
border-radius: unset;
border-right: .5px solid #444;
font-size: 1.2rem;
line-height: 1.6rem;
margin-left: 3px !important;
width: 150px
}
.c-header__searchBox__submit {
background: none;
border: none;
font-size: .5rem;
margin: 0;
padding: 0;
position: relative;
visibility: hidden;
width: 30px
}
.c-header__searchBox__submit:after {
color: #333;
content: "釥ｲ";
display: inline-block;
font-family: fs-icon !important;
font-size: 2rem;
left: 50%;
position: absolute;
text-indent: 0;
top: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
visibility: visible
}
@media screen and (max-width:767px) {
.c-header .sp {
display: block
}
.c-header .etc {
display: none
}
.c-header__sub {
background: rgba(0, 0, 0, .5);
display: block;
height: 100vh;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: .5s;
visibility: hidden;
width: 100vw
}
.c-header__sub__inner {
position: relative
}
.c-header__sub__inner > .menuTrigger {
right: 14px;
top: 13px
}
.c-header__sub__inner {
background: #050302;
height: 100vh;
overflow-y: scroll;
padding-top: 50px;
position: fixed;
right: -65%;
top: 0;
transition: .4s;
width: 65%;
z-index: 500
}
.c-header__sub.active .c-header__sub__inner {
right: 0;
transition: .4s;
z-index: 500
}
.c-header__sub.active {
opacity: 1;
transition: .4s;
visibility: visible;
z-index: 500
}
}
@media screen and (min-width:768px) {
.c-header .sp {
display: none
}
.c-header .etc {
align-items: center;
column-gap: 8px;
display: flex;
justify-content: center
}
}
.c-dropDownList {
align-items: center;
display: flex;
justify-content: space-between;
position: relative
}
@media screen and (max-width:767px) {
.c-dropDownList {
flex-direction: column;
margin: 0
}
.c-dropDownList__item {
border-bottom: .5px solid #333;
position: relative;
text-align: center;
width: 100%
}
.c-dropDownList__item > a,
.c-dropDownList__item > span {
display: inline-block;
padding: 20px 0;
width: 100%
}
.c-dropDownList .drop {
list-style: none;
overflow: hidden;
position: relative
}
.c-dropDownList .drop div {
background: #222;
height: auto;
margin: 0 5px;
max-height: 0;
position: relative;
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-out
}
.c-dropDownList .drop div li a {
align-items: center;
display: flex;
flex-direction: row;
font-size: 1.2rem;
justify-content: center
}
.c-dropDownList .drop div li a .label {
padding-left: 5px
}
.c-dropDownList .drop div li a.dealer {
color: #aaa
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList {
flex-direction: row;
margin: 0 auto;
padding: 0 20px;
width: 750px
}
.c-dropDownList__item {
align-items: center;
border-right: 1px solid #333;
color: #fff;
display: flex;
font-size: 1.2rem;
font-weight: 700;
height: inherit;
justify-content: center;
position: relative;
text-align: center;
transition: .5s;
width: 150px;
z-index: 300
}
.c-dropDownList__item:hover > a,
.c-dropDownList__item:hover > span {
color: #a78000;
transition: .5s
}
.c-dropDownList__item:hover > a.label > .fbIcon,
.c-dropDownList__item:hover > a.label > .instaIcon,
.c-dropDownList__item:hover > a.label > .lineIcon,
.c-dropDownList__item:hover > a.label > .twIcon,
.c-dropDownList__item:hover > a.label > .ytIcon {
background: #a78000;
transition: .5s
}
.c-dropDownList__item:first-child {
border-left: 1px solid #333
}
.c-dropDownList__item .drop {
left: 0;
list-style: none;
overflow: hidden;
padding: 0;
position: absolute;
top: 30px;
transform: scaleY(0);
transform-origin: top center;
transition: .5s;
width: 100%
}
.c-dropDownList__item .drop div {
position: relative
}
.c-dropDownList__item .drop li {
background: rgba(0, 0, 0, .9) !important;
border-bottom: .5px solid #999;
display: block;
font-size: .9rem;
line-height: 1.4rem;
padding: 10px 5px;
width: 100%
}
.c-dropDownList__item .drop li a {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center
}
.c-dropDownList__item .drop li a .label {
padding-left: 5px
}
.c-dropDownList #marker {
background: #a78000;
bottom: 0;
content: "";
height: 0;
left: 0;
position: absolute;
-webkit-transition: all .35s;
-moz-transition: all .35s;
-ms-transition: all .35s;
transition: all .35s;
width: 150px;
z-index: 2
}
}
@media screen and (min-width:768px)and (max-width:1019px)and (min-width:768px)and (max-width:1019px) {
.c-dropDownList {
height: 30px
}
}
@media screen and (min-width:768px)and (max-width:1019px)and (min-width:1020px) {
.c-dropDownList {
height: 30px
}
}
@media screen and (min-width:1020px) {
.c-dropDownList {
flex-direction: row;
justify-content: space-between;
margin: 0 auto;
padding: 0 20px;
width: 900px
}
.c-dropDownList,
.c-dropDownList__item {
align-items: center;
display: flex;
position: relative
}
.c-dropDownList__item {
border-right: 1px solid #333;
color: #fff;
font-size: 1.2rem;
font-weight: 700;
height: inherit;
justify-content: center;
text-align: center;
width: 180px;
z-index: 300
}
.c-dropDownList__item .dealer {
color: #aaa
}
.c-dropDownList__item:hover > a,
.c-dropDownList__item:hover > a.dealer,
.c-dropDownList__item:hover > span {
color: #a78000;
transition: .5s
}
.c-dropDownList__item:hover > a.label > .fbIcon,
.c-dropDownList__item:hover > a.label > .instaIcon,
.c-dropDownList__item:hover > a.label > .lineIcon,
.c-dropDownList__item:hover > a.label > .twIcon,
.c-dropDownList__item:hover > a.label > .ytIcon {
background: #a78000;
transition: .5s
}
.c-dropDownList__item:first-child {
border-left: 1px solid #333
}
.c-dropDownList__item .drop {
left: 0;
list-style: none;
overflow: hidden;
padding: 0;
position: absolute;
top: 30px;
transform: scaleY(0);
transform-origin: top center;
transition: .5s;
width: 100%
}
.c-dropDownList__item .drop div {
position: relative
}
.c-dropDownList__item .drop li {
background: rgba(0, 0, 0, .9) !important;
border-bottom: .5px solid #999;
display: block;
font-size: 1rem;
line-height: 1.4rem;
padding: 10px 5px;
width: 100%
}
.c-dropDownList__item .drop li a {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center
}
.c-dropDownList__item .drop li a .label {
padding-left: 5px
}
.c-dropDownList #marker {
background: #a78000;
bottom: 0;
content: "";
height: 0;
left: 0;
position: absolute;
-webkit-transition: all .35s;
-moz-transition: all .35s;
-ms-transition: all .35s;
transition: all .35s;
width: 180px;
z-index: 2
}
}
@media screen and (min-width:1020px)and (min-width:768px)and (max-width:1019px) {
.c-dropDownList {
height: 30px
}
}
@media screen and (min-width:1020px)and (min-width:1020px) {
.c-dropDownList {
height: 30px
}
}
@media screen and (max-width:767px) {
.c-dropDownList li:first-child.active ul div {
max-height: 100vh;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0);
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-in
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList li:first-child.active ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:first-child:hover ~ #marker {
height: 2px;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0)
}
}
@media screen and (min-width:1020px) {
.c-dropDownList li:first-child:hover ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:first-child:hover ~ #marker {
height: 2px;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0)
}
}
@media screen and (max-width:767px) {
.c-dropDownList li:nth-child(2).active ul div {
max-height: 100vh;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0);
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-in
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList li:nth-child(2).active ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(2):hover ~ #marker {
height: 2px;
-webkit-transform: translate(150px);
-moz-transform: translate(150px);
-ms-transform: translate(150px);
transform: translate(150px)
}
}
@media screen and (min-width:1020px) {
.c-dropDownList li:nth-child(2):hover ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(2):hover ~ #marker {
height: 2px;
-webkit-transform: translate(180px);
-moz-transform: translate(180px);
-ms-transform: translate(180px);
transform: translate(180px)
}
}
@media screen and (max-width:767px) {
.c-dropDownList li:nth-child(3).active ul div {
max-height: 100vh;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0);
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-in
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList li:nth-child(3).active ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(3):hover ~ #marker {
height: 2px;
-webkit-transform: translate(300px);
-moz-transform: translate(300px);
-ms-transform: translate(300px);
transform: translate(300px)
}
}
@media screen and (min-width:1020px) {
.c-dropDownList li:nth-child(3):hover ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(3):hover ~ #marker {
height: 2px;
-webkit-transform: translate(360px);
-moz-transform: translate(360px);
-ms-transform: translate(360px);
transform: translate(360px)
}
}
@media screen and (max-width:767px) {
.c-dropDownList li:nth-child(4).active ul div {
max-height: 100vh;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0);
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-in
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList li:nth-child(4).active ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(4):hover ~ #marker {
height: 2px;
-webkit-transform: translate(450px);
-moz-transform: translate(450px);
-ms-transform: translate(450px);
transform: translate(450px)
}
}
@media screen and (min-width:1020px) {
.c-dropDownList li:nth-child(4):hover ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(4):hover ~ #marker {
height: 2px;
-webkit-transform: translate(540px);
-moz-transform: translate(540px);
-ms-transform: translate(540px);
transform: translate(540px)
}
}
@media screen and (max-width:767px) {
.c-dropDownList li:nth-child(5).active ul div {
max-height: 100vh;
-webkit-transform: translate(0);
-moz-transform: translate(0);
-ms-transform: translate(0);
transform: translate(0);
-webkit-transition: all .5s .1s;
-moz-transition: all .5s .1s;
-ms-transition: all .5s .1s;
transition: all .5s .1s;
transition: max-height .5s ease-in
}
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-dropDownList li:nth-child(5).active ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(5):hover ~ #marker {
height: 2px;
-webkit-transform: translate(600px);
-moz-transform: translate(600px);
-ms-transform: translate(600px);
transform: translate(600px)
}
}
@media screen and (min-width:1020px) {
.c-dropDownList li:nth-child(5):hover ul {
max-height: 100vh;
transform: scaleY(1);
transition: .5s
}
.c-dropDownList li:nth-child(5):hover ~ #marker {
height: 2px;
-webkit-transform: translate(720px);
-moz-transform: translate(720px);
-ms-transform: translate(720px);
transform: translate(720px)
}
}
.fbIcon {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_facebook.svg) no-repeat center center/100%
}
.fbIcon,
.instaIcon {
background: #fff;
display: block;
height: 20px;
width: 20px
}
.instaIcon {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_instagram.svg) no-repeat center center/100%
}
.twIcon {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_twitter.svg) no-repeat center center/100%
}
.twIcon,
.ytIcon {
background: #fff;
display: block;
height: 20px;
width: 20px
}
.ytIcon {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_youtube.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_youtube.svg) no-repeat center center/100%
}
.lineIcon {
height: 20px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_line.svg) no-repeat center center/80%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_line.svg) no-repeat center center/80%;
width: 20px
}
.gmap,
.lineIcon {
background: #fff;
display: block
}
.gmap {
height: 16px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/page/list_shop/icon_googlemap.svg) no-repeat center center/100%;
width: 91px
}
.headerNavToggle {
background: #fff;
display: block;
display: none;
height: 25px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/xmark-solid.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/xmark-solid.svg) no-repeat center center/100%;
position: absolute;
right: 12.5px;
top: -37.5px;
width: 25px
}
@media screen and (max-width:767px) {
.headerNavToggle {
display: block
}
}
@media screen and (min-width:1020px) {
.adviserSlide {
margin: 0 auto;
width: 75%
}
}
.c-header__itemList {
align-items: center;
column-gap: 8px;
display: flex;
flex-direction: row
}
.c-header__itemList__item__icon .label {
color: #fff;
font-size: 11px
}
.c-header__itemList__item.headerSearch .etc {
align-items: center;
column-gap: 12px;
justify-content: center
}
.c-header__itemList__item.headerMenu .sp .c-header__itemList__item__icon {
background: #fff;
display: block
}
.c-header__itemList__item.headerCart a,
.c-header__itemList__item.headerFavorite a {
background: #fff;
display: block;
height: inherit;
width: inherit
}
.naviIcon {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative
}
@media screen and (max-width:767px) {
.naviIcon {
height: 45px;
width: 45px
}
}
@media screen and (min-width:768px) {
.naviIcon {
height: 50px;
width: 50px
}
}
.naviIcon .ico {
background: #fff;
display: block;
height: 18px;
position: relative;
width: 18px
}
.naviIcon .label {
display: inline-block;
font-size: 8px;
letter-spacing: 0;
line-height: 12px
}
.naviIcon .ico.headerSearch {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_search.svg) no-repeat center center/95%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_search.svg) no-repeat center center/95%
}
.naviIcon .ico.headerFavorite {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_favorite.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_favorite.svg) no-repeat center center/100%
}
.naviIcon .ico.headerCart {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_store.svg);
background-position: 50%;
background-repeat: no-repeat;
position: relative
}
.naviIcon .ico.headerMenu {
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/icon-menu01.svg) no-repeat center center/100%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/icon-menu01.svg) no-repeat center center/100%
}
.etc .naviIcon .ico.headerSearch {
height: 25px;
mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/filter_white.svg) no-repeat center center/95%;
-webkit-mask: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/filter_white.svg) no-repeat center center/95%;
width: 25px
}
.c-mainNaviDropDown a.outlet {
color: red !important;
font-weight: 700
}
.c-mainNaviDropDown__wrap {
background: none;
color: #fff;
text-align: center
}
.c-mainNaviDropDown__wrap > ul {
display: flex;
justify-content: center;
list-style: none;
margin: 0
}
.c-mainNaviDropDown__wrap > ul li {
position: relative
}
.c-mainNaviDropDown__wrap > ul li a,
.c-mainNaviDropDown__wrap > ul li span {
color: #fff;
display: block;
padding: 20px 35px;
text-decoration: none;
transition: all .3s
}
.c-mainNaviDropDown__wrap > ul li a:hover,
.c-mainNaviDropDown__wrap > ul li span:hover {
color: #fff
}
.c-mainNaviDropDown__wrap > ul li a,
.c-mainNaviDropDown__wrap > ul li span {
padding: 10px 30px
}
.c-mainNaviDropDown__wrap > ul li ul {
background: rgba(0, 0, 0, .8);
display: block
}
.c-mainNaviDropDown__wrap > ul li.has-child ul li:active > ul,
.c-mainNaviDropDown__wrap > ul li.has-child ul li:hover > ul,
.c-mainNaviDropDown__wrap > ul li.has-child:active > ul,
.c-mainNaviDropDown__wrap > ul li.has-child:hover > ul {
opacity: 1;
visibility: visible
}
.c-mainNaviDropDown__wrap > ul li.has-child ul {
left: 0;
opacity: 0;
position: absolute;
top: 30px;
transform-origin: top;
transition: all .3s;
visibility: hidden;
width: 220px;
z-index: 4
}
.c-mainNaviDropDown__wrap > ul li.has-child ul ul {
background: rgba(0, 0, 0, .8);
left: 222px;
top: 0
}
.c-mainNaviDropDown__wrap > ul li.has-child > ul > li a,
.c-mainNaviDropDown__wrap > ul li.has-child > ul > li span {
border-bottom: 1px solid hsla(0, 0%, 100%, .6);
color: #fff
}
.c-mainNaviDropDown__wrap > ul li.has-child > ul > li:last-child > a,
.c-mainNaviDropDown__wrap > ul li.has-child > ul > li:last-child > span {
border-bottom: none
}
.c-mainNaviDropDown__wrap > ul li.has-child:before {
border-right: 2px solid #999;
border-top: 2px solid #999;
content: "";
height: 6px;
left: 15px;
position: absolute;
top: 10px;
transform: rotate(135deg);
width: 6px
}
.c-mainNaviDropDown__wrap > ul li.has-child ul li.has-child:before {
border-right: 2px solid #fff;
border-top: 2px solid #fff;
content: "";
height: 6px;
left: 20px;
position: absolute;
top: 10px;
transform: rotate(45deg);
transform: rotate(135deg);
width: 6px
}
@media screen and (max-width:767px) {
.c-mainNaviDropDown__wrap {
padding: 0
}
.c-mainNaviDropDown__wrap > ul > li > a,
.c-mainNaviDropDown__wrap > ul > li > span {
padding: 20px 35px
}
.c-mainNaviDropDown__wrap > ul li.has-child:before {
top: 27px
}
.c-mainNaviDropDown__wrap > ul li.has-child li.has-child:before {
top: 17px !important
}
.c-mainNaviDropDown__wrap ul {
display: block
}
.c-mainNaviDropDown__wrap ul ul li a,
.c-mainNaviDropDown__wrap ul ul li span {
font-size: 12px;
padding: 14px 10px
}
.c-mainNaviDropDown__wrap ul li.has-child > ul {
background: #222
}
.c-mainNaviDropDown__wrap ul li.has-child > ul li.has-child > ul {
background: #444
}
.c-mainNaviDropDown__wrap ul li.has-child > ul li.has-child > ul li.has-child > ul {
background: #666
}
.c-mainNaviDropDown__wrap ul li.has-child > ul li.has-child > ul li.has-child > ul li.has-child > ul {
background: #888
}
.c-mainNaviDropDown__wrap ul li a,
.c-mainNaviDropDown__wrap ul li span {
border-bottom: .5px solid #333
}
.c-mainNaviDropDown__wrap ul li.has-child ul,
.c-mainNaviDropDown__wrap ul li.has-child ul ul {
display: none;
left: 0;
opacity: 1;
position: relative;
top: 0;
transition: none;
visibility: visible;
width: 100%
}
.c-mainNaviDropDown__wrap ul li.has-child ul li a,
.c-mainNaviDropDown__wrap ul li.has-child ul ul li a {
border-bottom: .5px solid #333
}
.c-mainNaviDropDown__wrap ul li.has-child.active li.has-child.active:before,
.c-mainNaviDropDown__wrap ul li.has-child.active:before {
transform: rotate(-45deg)
}
}
@media screen and (min-width:768px) {
.c-mainNaviDropDown__wrap > ul > li > a {
font-size: 1.2rem;
line-height: 1.2rem;
padding: 9px 50px
}
.c-mainNaviDropDown__wrap > ul span,
.c-mainNaviDropDown__wrap > ul > li a {
font-size: 1.6rem;
line-height: 1.6rem
}
.c-mainNaviDropDown__wrap > ul {
margin: 0 auto
}
.c-mainNaviDropDown__wrap > ul li.has-child li a,
.c-mainNaviDropDown__wrap > ul li.has-child li span {
font-size: 1.2rem;
line-height: 1.2rem
}
.c-mainNaviDropDown__wrap > ul li.has-child li a:active,
.c-mainNaviDropDown__wrap > ul li.has-child li a:hover,
.c-mainNaviDropDown__wrap > ul li.has-child li span:active,
.c-mainNaviDropDown__wrap > ul li.has-child li span:hover {
background: #a78000
}
.c-mainNaviDropDown__wrap > ul li.has-child ul li:active > ul,
.c-mainNaviDropDown__wrap > ul li.has-child ul li:hover > ul,
.c-mainNaviDropDown__wrap > ul li.has-child:active > ul,
.c-mainNaviDropDown__wrap > ul li.has-child:hover > ul {
opacity: 1;
transform: scaleY(100%);
visibility: visible
}
.c-mainNaviDropDown__wrap > ul li.has-child ul {
left: 0;
opacity: 0;
position: absolute;
top: 30px;
transform: scaleY(0);
transform-origin: top;
transition: all .3s;
visibility: hidden;
width: 220px;
z-index: 4
}
.c-mainNaviDropDown__wrap > ul li.has-child ul ul {
background: rgba(0, 0, 0, .8);
left: 222px;
top: 0
}
.c-mainNaviDropDown__wrap > ul li.has-child ul ul li:first-child {
display: none
}
.c-mainNaviDropDown__wrap > ul > li.headerBrand li:first-child {
display: block !important
}
}
@media screen and (max-width:767px) {
.c-footer__base {
padding-bottom: 120px
}
}
@media screen and (min-width:768px) {
.c-footer__base {
padding-bottom: 120px
}
}
.c-footer {
background: #050302
}
@media screen and (min-width:768px)and (max-width:1019px) {
.c-footer__base {
padding-bottom: 120px
}
}
.c-footer__base__list {
column-gap: 30px;
display: flex;
flex-direction: row;
justify-content: center;
margin: 0;
padding: 15px 0
}
.c-footer__base__list__item a {
color: #888;
font-size: 1.2rem;
letter-spacing: .05rem
}
.c-footer__base__list__item a:hover {
color: #a78000
}
@media screen and (max-width:767px) {
.c-footer__base__list {
column-gap: 0;
flex-wrap: wrap;
padding: 35px 20px
}
.c-footer__base__list__item {
border: .5px solid #333;
width: 33.3333333333%
}
.c-footer__base__list__item > a {
display: block
}
.c-footer__base__list__item > a:before {
padding-top: 100%
}
.c-footer__base__list__item > a span {
align-items: center;
display: flex;
justify-content: center
}
.c-footer__base__list__item > a span .label {
text-align: center
}
.c-footer__base__list__item {
border: 1px solid #333;
width: 50%
}
.c-footer__base__list__item > a {
position: relative;
width: 100%
}
.c-footer__base__list__item > a:before {
content: "";
display: block;
padding-top: 50%
}
.c-footer__base__list__item > a > :first-child {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0
}
.c-footer__base__list__item:first-child,
.c-footer__base__list__item:nth-child(2) {
border-bottom: .5px solid #333
}
.c-footer__base__list__item:nth-child(3),
.c-footer__base__list__item:nth-child(4) {
border-top: .5px solid #333
}
.c-footer__base__list__item:first-child,
.c-footer__base__list__item:nth-child(3) {
border-right: .5px solid #333
}
.c-footer__base__list__item:nth-child(2),
.c-footer__base__list__item:nth-child(4) {
border-left: .5px solid #333
}
}
.c-footer__base__logo {
display: block;
margin: 0 auto;
padding: 5px;
width: 148px
}
.c-footer__base__logo > a {
background: url(//www.motorimoda.com/wp-content/themes/motorimoda/assets/img/public/ico_logo.svg);
background-position: 50%;
background-repeat: no-repeat;
display: block;
height: 22px;
margin: 0 auto;
padding: 0;
width: inherit
}
.c-footer__base__logo > a span {
visibility: hidden
}
.c-footer__base__logo > small {
color: #888;
display: inline-block;
font-size: .8rem;
letter-spacing: .05rem;
text-align: center;
width: 100%
}
.c-featureArea {
padding-top: 10px
}
.c-featureArea__list {
display: flex;
margin: 0
}
.c-featureArea__list__item div {
background: #a78000;
padding: 3px
}
.c-featureArea__list__item a {
align-items: center;
border: .5px solid hsla(0, 0%, 100%, .65) !important;
color: #fff;
display: flex;
flex-wrap: nowrap;
font-size: 0;
font-size: 1.8rem;
height: 50px;
justify-content: center;
letter-spacing: .08rem;
line-height: 2rem;
margin: 0;
padding: 0;
position: relative;
text-align: center;
width: 100%
}
.c-featureArea__list__item a span.mailmagagine {
border-bottom: 1px solid #fff;
line-height: 2.4rem;
margin-left: 10px
}
.c-featureArea__list__item a .icon_mail:before {
content: "��";
font-family: Font Awesome\ 5 Free;
font-size: 3.2rem;
line-height: 3.2rem;
right: 10px
}
@media screen and (max-width:767px) {
.c-featureArea {
padding-bottom: 140px;
position: relative
}
.c-featureArea.layoutInner {
padding-left: 0;
padding-right: 0
}
.c-featureArea__list {
align-items: center;
flex-direction: column;
justify-content: left
}
.c-featureArea__list__item {
padding: 2.5px 5px;
width: 100%
}
.c-featureArea__list__item div a {
font-size: 1.6rem;
line-height: 2rem
}
.c-footer .c-featureArea {
display: none
}
}
@media screen and (min-width:768px) {
.c-header .c-featureArea {
display: none
}
.c-featureArea__list {
align-items: center;
flex-direction: row;
flex-wrap: wrap;
justify-content: left
}
.c-featureArea__list__item {
padding: 5px;
width: 33.33%
}
.c-featureArea__list__item:first-child,
.c-featureArea__list__item:nth-child(2) {
width: 50%
}
}