@charset "UTF-8";
.wpp-no-data {
} .wpp-list {
} .wpp-list li {
overflow: hidden;
float: none;
clear: both;
margin-bottom: 1rem;
}
.wpp-list li:last-of-type {
margin-bottom: 0;
} .wpp-list li.current {
} .wpp-thumbnail {
display: inline;
float: left;
margin: 0 1rem 0 0;
border: none;
}
.wpp_def_no_src {
object-fit: contain;
} .wpp-post-title {
} .wpp-excerpt {
} .wpp-meta, .post-stats {
display: block;
font-size: 0.8em;
} .wpp-comments {
} .wpp-views {
} .wpp-author {
} .wpp-date {
} .wpp-category {
} .wpp-rating {
}
 @layer reset, base, components, pages, utilities; :root {  --text-color: #413233;
--body-bg: #ffffff;
--border-color: #dcdcdc; --loud-color: #fd7c23;
--link-color: #2561b1; --grey-1: #f5f5f5;
--grey-sub: #f3f4f5;
--grey-card: #faf9f7; --color-error: #ff0000;
--color-express: #5085e8;
--color-value: #e85050;
--color-highlight: #f1f358;
--color-orange-accent: #fd8836; --base-font-family: "Lato", sans-serif;
--base-font-size: 1.7rem;
--base-line-height: 2.6rem;
--base-font-weight: 400;
--heading-font-family: "Lato", sans-serif;
--heading-font-weight: 700;
--weight-bold: 700; --font-xs: 1rem;
--font-sm: 1.2rem;
--font-md: 1.4rem;
--font-lg: 1.6rem;
--font-xl: 1.8rem;
--font-2xl: 2rem;
--font-3xl: 2.4rem; --font-4xl: 3.5rem;  --lh-none: 1; --lh-tight: 1.3; --lh-normal: 1.5; --lh-relaxed: 1.7;  --space-xs: 0.5rem;
--space-sm: 1rem;
--space-md: 1.5rem;
--space-lg: 2rem;
--space-xl: 3rem; --container-width: 1290px;
--radius-sm: 3px;
--radius-md: 10px;
--radius-lg: 26px;
}@layer reset {
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: var(--lh-none);
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
content: "";
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
button {
background-color: transparent;
outline: none;
border: 0;
cursor: pointer;
}
} .flex {
display: flex;
}
.flex-wrap {
flex-wrap: wrap;
}
.justify-content-between {
justify-content: space-between !important;
}
.row {
display: flex;
flex-wrap: wrap;
margin-right: -10px;
margin-left: -10px;
}
.flex-20 {
flex: 20%;
max-width: 20%;
padding: 0 var(--space-sm);
}
.flex-30 {
flex: 30%;
max-width: 30%;
padding: 0 var(--space-sm);
}
.flex-40 {
flex: 40%;
max-width: 40%;
padding: 0 var(--space-sm);
}
.flex-50 {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-sm);
}
.flex-60 {
flex: 60%;
max-width: 60%;
padding: 0 var(--space-sm);
}
.flex-70 {
flex: 70%;
max-width: 70%;
padding: 0 var(--space-sm);
}
.flex-80 {
flex: 80%;
max-width: 80%;
padding: 0 var(--space-sm);
}
.flex-100 {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}
.col-1 {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}
.order-1 {
order: 1;
}
.col-2 {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-sm);
}
.order-2 {
order: 2;
}
.col-3 {
flex: 33.3333333333%;
max-width: 33.3333333333%;
padding: 0 var(--space-sm);
}
.col-4 {
flex: 25%;
max-width: 25%;
padding: 0 var(--space-sm);
}
.col-5 {
flex: 20%;
max-width: 20%;
padding: 0 var(--space-sm);
}
.col-6 {
flex: 16.6666666667%;
max-width: 16.6666666667%;
padding: 0 var(--space-sm);
} .mb0 {
margin-bottom: 0px !important;
}
.ma0 {
margin: 0px !important;
}
.pa0 {
padding: 0px !important;
}
.px5 {
padding-left: var(--space-xs) !important;
padding-right: var(--space-xs) !important;
}
.py5 {
padding-top: var(--space-xs) !important;
padding-bottom: var(--space-xs) !important;
}
.mt10 {
margin-top: var(--space-sm) !important;
}
.pt10 {
padding-top: var(--space-sm) !important;
}
.mb10 {
margin-bottom: var(--space-sm) !important;
}
.py10 {
padding-top: var(--space-sm) !important;
padding-bottom: var(--space-sm) !important;
}
.mt20 {
margin-top: var(--space-lg) !important;
}
.mb20 {
margin-bottom: var(--space-lg) !important;
}
.pb20 {
padding-bottom: var(--space-lg) !important;
}
.py20 {
padding-top: var(--space-lg) !important;
padding-bottom: var(--space-lg) !important;
}
.mt30 {
margin-top: var(--space-xl) !important;
}
.pt30 {
padding-top: var(--space-xl) !important;
}
.mb30 {
margin-bottom: var(--space-xl) !important;
}
.pb30 {
padding-bottom: var(--space-xl) !important;
}
.pl30 {
padding-left: var(--space-xl) !important;
}
.mx-auto {
margin-right: auto !important;
margin-left: auto !important;
} h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--heading-font-family);
font-weight: var(--heading-font-weight);
}
h1 {
font-size: var(--font-4xl);
}
h2 {
font-size: var(--font-3xl);
}
h3 {
font-size: var(--font-xl);
}
hr {
border-color: var(--border-color) -moz-use-text-color -moz-use-text-color;
border-image: none;
border-style: solid none none;
border-width: 2px 0 0 0;
margin: 0;
}
p {
margin-bottom: var(--space-lg);
}
a {
color: var(--link-color);
text-decoration: none;
}
a:visited {
color: var(--link-color);
text-decoration: none;
}
a:hover, a:visited:hover {
color: var(--border-color);
text-decoration: none;
}
a:focus {
outline: none;
text-decoration: none;
}
a img {
transition: all 400ms ease-in-out;
}
a img:hover {
opacity: 0.6;
}
.small,
small {
font-size: 80%;
font-weight: 400;
}
.bold {
font-weight: 700;
}
.red {
color: #DE2C0C;
}
.text-left {
text-align: left !important;
}
.text-right {
text-align: right !important;
}
.text-right {
text-align: right !important;
}
.text-center {
text-align: center !important;
}
.btn {
display: inline-block;
font-weight: 400;
color: #212529;
cursor: pointer;
text-align: center;
vertical-align: middle;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
padding: 0.375rem 0.75rem;
font-size: var(--font-xs);
line-height: var(--lh-normal);
border-radius: 0.25rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.btn-block {
display: block;
width: 100%;
}
.btn-lg {
padding: var(--space-xs) var(--space-sm);
font-size: 1.25rem;
line-height: var(--lh-normal);
border-radius: 0.3rem;
}
.btn-warning {
color: #212529;
background-color: #ffc107;
border-color: #ffc107;
}
.btn-warning.btn-warning:hover {
color: #212529;
background-color: #e0a800;
border-color: #d39e00;
}
.btn-info {
color: #fff;
background-color: #17a2b8;
border-color: #17a2b8;
}
.btn-info:hover {
color: #fff;
background-color: #138496;
border-color: #117a8b;
}
.more-box {
text-align: center;
}
body .more, body .more:visited {
transition: all 300ms ease-in-out;
display: inline-block;
line-height: 4.4rem;
border: 2px solid #aaa;
background: #f6f6f6;
text-align: center;
font-size: var(--font-lg);
font-weight: 700;
color: var(--text-color);
border-radius: 30px;
padding: 0 2.5rem;
}
body .more::after, body .more:visited::after {
font-family: "Font Awesome 5 Pro";
content: "\f054";
display: inline-block;
padding-left: var(--space-xs);
}
body .more:hover, body .more:visited:hover {
background: var(--border-color);
color: var(--text-color);
cursor: pointer;
}
body .more + .more, body .more:visited + .more {
margin-left: var(--space-md);
}
body .more.btn-contact, body .more.btn-contact:visited {
background: #F38F00;
color: #fff;
border: 2px solid var(--loud-color);
}
body .more.btn-contact:hover, body .more.btn-contact:visited:hover {
background: #F40D07;
color: #fff;
}
body .more.btn-contact-half, body .more.btn-contact-half:visited {
background: #F38F00;
color: #fff;
border: 2px solid var(--loud-color);
}
@media (min-width: 768px) {
body .more.btn-contact-half, body .more.btn-contact-half:visited {
width: 50%;
}
}
body .more.btn-contact-half:hover, body .more.btn-contact-half:visited:hover {
background: #F40D07;
color: #fff;
}
body.page-naire .more.btn-onepoint, body.page-naire .more.btn-onepoint:visited {
background: #F38F00;
color: #fff;
border: 2px solid var(--loud-color);
}
body.page-naire .more.btn-onepoint:hover, body.page-naire .more.btn-onepoint:visited:hover {
background: #F40D07;
color: #fff;
}
body.page-naire .more.btn-onepoint + .more.btn-contact, body.page-naire .more.btn-onepoint:visited + .more.btn-contact {
margin-left: var(--space-md);
}
body.page-onepoint .more.btn-onepoint, body.page-onepoint .more.btn-onepoint:visited {
background: #F38F00;
color: #fff;
border: 2px solid var(--loud-color);
}
body.page-onepoint .more.btn-onepoint:hover, body.page-onepoint .more.btn-onepoint:visited:hover {
background: #F40D07;
color: #fff;
}
body.page-onepoint .more.btn-onepoint + .more.btn-contact, body.page-onepoint .more.btn-onepoint:visited + .more.btn-contact {
margin-left: var(--space-md);
}
body.single-product .more.btn-onepoint, body.single-product .more.btn-onepoint:visited {
background: #F38F00;
color: #fff;
border: 2px solid var(--loud-color);
}
body.single-product .more.btn-onepoint:hover, body.single-product .more.btn-onepoint:visited:hover {
background: #F40D07;
color: #fff;
}
body.single-product .more.btn-onepoint + .more.btn-contact, body.single-product .more.btn-onepoint:visited + .more.btn-contact {
margin-left: var(--space-md);
}
body .more.btn-next, body .more.btn-next:visited {
font-size: 1.3rem;
line-height: 2.2rem;
color: var(--loud-color);
font-weight: 700;
border: none;
background: transparent;
padding: 0;
}
body .more.btn-next:hover, body .more.btn-next:visited:hover {
color: #fff;
}
body .more.btn-detail, body .more.btn-detail:visited {
font-size: 1.3rem;
line-height: 2rem;
color: var(--text-color);
font-weight: 700;
border: 1px solid var(--border-color);
padding: var(--space-xs) var(--space-md);
background: transparent;
border-radius: 0.5rem;
}
body .more.btn-detail:hover, body .more.btn-detail:visited:hover {
background: var(--border-color);
}
body .more.btn-detail::after, body .more.btn-detail:visited::after {
display: none;
}
body .more.btn-detail::before, body .more.btn-detail:visited::before {
font-family: "Font Awesome 5 Pro";
content: "\f302";
display: inline-block;
padding-right: var(--space-xs);
}
input,
textarea,
select {
font-size: var(--font-lg);
}
.form-control {
display: block;
width: 100%;
height: calc(1.5em + 0.75rem + 2px);
padding: 0.375rem 0.75rem;
font-size: var(--font-lg);
font-weight: 400;
line-height: var(--lh-normal);
color: #495057;
background-color: #fff;
background-clip: padding-box;
border: 1px solid #ced4da;
border-radius: 0.25rem;
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.table-est {
background-color: #fff !important;
margin-bottom: var(--space-lg) !important;
}
.form {
background: var(--grey-card);
padding: 2.5rem var(--space-xl);
border-radius: var(--radius-md);
}
.form fieldset {
margin-bottom: var(--space-xl);
}
.form .alert {
margin-top: var(--space-xl);
}
.form .form-group {
border-bottom: 1px var(--border-color) dotted;
padding: var(--space-sm) 0;
margin-bottom: 0;
}
.form .form-group .circle_con {
position: relative;
}
.form .form-group .circle_con .circle {
position: absolute;
top: 4rem;
right: 1.2rem;
font-size: 1.3rem;
line-height: var(--lh-none);
background: #DE2C0C;
border-color: #DE2C0C;
}
.form .form-group .row > label {
padding: var(--space-sm) !important;
}
.form .form-group .row > label span {
font-size: var(--font-sm);
background-color: #DE2C0C;
padding: 2px 3px;
border-radius: 4px;
color: #FFF;
}
.form .form-group#address ul {
margin: 0 -10px;
}
.form .form-group li {
margin-bottom: var(--space-md);
}
.form .form-group .more.btn-next {
line-height: 2rem;
color: var(--text-color);
background: var(--border-color);
padding: var(--space-xs);
border-radius: 0 0 var(--radius-sm) var(--radius-sm);
margin: 0;
}
.form .form-group .more.btn-next:hover {
background: #565656;
}
.form .form-group input.form-control,
.form .form-group textarea.form-control,
.form .form-group select.form-control {
font-size: inherit;
height: auto;
padding: var(--space-sm);
}
.form .form-group input.form-control::-webkit-input-placeholder,
.form .form-group textarea.form-control::-webkit-input-placeholder,
.form .form-group select.form-control::-webkit-input-placeholder {
color: #aaa;
}
.form .form-group input[type=checkbox],
.form .form-group input[type=radio] {
width: auto;
display: inline-block;
}
.form .form-group input[type=checkbox] > label,
.form .form-group input[type=radio] > label {
padding-left: var(--space-xs);
}
.form .form-group input[type=radio i] {
margin: 3px 0.5ex;
}
.form .form-group .form-contents {
flex: 75%;
padding: 0 var(--space-sm);
}
.form .form-group .check {
padding: 7px;
border-radius: var(--radius-sm);
background-color: #fff;
border: solid 1px var(--border-color);
}
.form .form-group .check img {
padding: var(--space-xs);
}
.form .form-group .check input {
padding-left: var(--space-lg);
}
.form .more-box {
padding-top: var(--space-sm);
text-align: center;
}
.form .more-box .more {
display: inline-block;
width: 100%;
max-width: calc(24.9rem - 4px);
line-height: 4.4rem;
border: 2px solid #F38F00;
background: #F38F00;
text-align: center;
font-size: var(--font-lg);
font-weight: 700;
color: #fff;
border-radius: 30px;
}
.form .more-box .more:hover {
background: #fff;
color: #F38F00;
}
.form .form-group input.form-control,
.form .form-group textarea.form-control,
.form .form-group select.form-control {
font-size: inherit;
height: auto;
padding: var(--space-sm);
}
.label {
padding: var(--space-xs);
border-radius: var(--radius-sm);
color: #fff;
}
input:focus {
outline: none;
}
.text-unit {
padding: var(--space-sm);
}
.header-nav {
height: 100%;
}
.header-nav ul li {
position: relative;
}
.header-nav ul li ul {
flex-wrap: wrap;
display: flex;
position: absolute;
z-index: 999;
right: 0;
top: 3rem;
width: 600px;
background: #eee;
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
transform: scaleY(0);
transform-origin: 50% 0;
transition-property: transform;
transition-duration: 0.2s;
transition-timing-function: ease-out;
padding: var(--space-sm);
border-radius: 0 0 5px 5px;
border: 1px var(--border-color) solid;
border-top: none;
}
.header-nav ul li ul li {
width: 33.33%;
padding: var(--space-xs);
}
.header-nav ul li ul li a {
border: 1px solid #e9e9e9;
background-color: #fff;
display: block;
font-size: 1.3rem;
padding: var(--space-xs);
color: var(--text-color);
font-weight: 700;
line-height: 3.5rem;
position: relative;
transition: all 300ms ease-in-out;
}
.header-nav ul li ul li a img {
padding-right: var(--space-sm);
width: 50px;
height: auto;
}
.header-nav ul li ul li a i {
position: absolute;
right: 0;
top: 0;
color: #999;
line-height: 50px;
}
.header-nav ul li ul li:hover a {
background-color: #fff;
color: var(--link-color);
opacity: 0.6;
}
.header-nav ul li:hover > ul {
transform: scaleY(1);
}
.main-nav {
display: flex;
justify-content: flex-start;
}
.main-nav > ul {
display: flex;
align-items: center;
}
.main-nav > ul > li {
position: relative;
display: block;
color: #F40E08;
padding: var(--space-xs) 1.3rem var(--space-xs) 5rem;
border-left: 1px solid var(--border-color);
transition: all 300ms ease-in-out;
}
.main-nav > ul > li .sm {
display: block;
font-size: var(--font-sm);
line-height: 1.5rem;
font-weight: 700;
}
.main-nav > ul > li .lg {
font-size: var(--font-lg);
font-weight: 700;
line-height: 1.8rem;
display: block;
}
.main-nav > ul > li:last-child {
border-right: none;
}
.main-nav > ul > li:nth-child(1) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/header-icon1.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 1.5rem center;
border-left: none;
}
.main-nav > ul > li:nth-child(2) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/header-icon2.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 1.5rem center;
}
.main-nav > ul > li:nth-child(3) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/header-icon4.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 1.5rem center;
}
.main-nav > ul > li:nth-child(4) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/header-icon5.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 1.2rem center;
}
.main-nav > ul > li:nth-child(5) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/header-icon3.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 1.3rem center;
}
.main-nav-sp {
transition: all 300ms ease-in-out;
opacity: 0;
height: 0;
position: fixed;
z-index: 9999;
left: 0;
width: 100%;
overflow-y: auto;
}
.main-nav-sp.is_active {
opacity: 0.98;
height: calc(100vh - 4rem);
}
.main-nav-sp ul li {
position: relative;
}
.main-nav-sp ul li a {
display: block;
font-size: 1.5rem;
line-height: 6rem;
color: #fff;
padding: 0 var(--space-md);
background: #565656;
border-bottom: 1px solid var(--border-color);
}
.main-nav-sp ul li span {
position: absolute;
z-index: 999;
right: 0;
left: 0;
top: 0;
bottom: 0;
height: 6rem;
font-family: "Font Awesome 5 Pro";
font-weight: 900;
text-align: right;
}
.main-nav-sp ul li span::before {
content: "\f078";
display: inline-block;
line-height: 5rem;
margin-right: var(--space-lg);
color: #fff;
}
.main-nav-sp ul li span.is-active::before {
content: "\f077";
}
.main-nav-sp ul li span.first::before {
content: "\f054";
display: inline-block;
line-height: 5rem;
margin-right: var(--space-lg);
color: #fff;
}
.main-nav-sp ul li ul {
display: none;
}
.main-nav-sp ul li ul li a {
background: #F6F6F6;
color: var(--text-color);
}
.main-nav-sp2 {
transition: all 300ms ease-in-out;
opacity: 0;
height: 0;
position: fixed;
z-index: 9999;
left: 0;
width: 100%;
overflow-y: auto;
}
.main-nav-sp2.is_active {
opacity: 0.98;
height: calc(100vh - 4rem);
}
.main-nav-sp2 ul li {
position: relative;
}
.main-nav-sp2 ul li a {
display: block;
font-size: 1.5rem;
line-height: 6rem;
color: #fff;
padding: 0 var(--space-md);
background: #565656;
border-bottom: 1px solid var(--border-color);
}
.main-nav-sp2 ul li span {
position: absolute;
z-index: 999;
right: 0;
left: 0;
top: 0;
bottom: 0;
height: 6rem;
font-family: "Font Awesome 5 Pro";
font-weight: 900;
text-align: right;
}
.main-nav-sp2 ul li span::before {
content: "\f078";
display: inline-block;
line-height: 5rem;
margin-right: var(--space-lg);
color: #fff;
}
.main-nav-sp2 ul li span.is-active::before {
content: "\f077";
}
.main-nav-sp2 ul li ul {
display: none;
}
.main-nav-sp2 ul li ul li a {
background: #F6F6F6;
color: var(--text-color);
}
.navbar-global {
background: #F6F6F6;
border-top: 1px solid var(--border-color);
border-bottom: 1px solid var(--border-color);
padding: 0;
margin: 0;
}
.navbar-global .navbar-nav {
width: 100%;
display: flex;
}
.navbar-global .navbar-nav li {
padding: var(--space-md) 0;
border-left: 1px solid #ddd;
width: 100%;
height: 50px;
position: relative;
}
.navbar-global .navbar-nav li:last-child {
border-right: 1px solid #ddd;
}
.navbar-global .navbar-nav li a {
color: var(--text-color);
font-weight: 700;
display: block;
text-align: center;
font-size: var(--font-lg);
line-height: 50px;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 0 2.5rem;
}
.navbar-global .navbar-nav li a:hover {
color: #fff;
background: #565656;
}
div#background {
display: none;
width: 100%;
height: 100%;
text-align: center;
position: absolute;
left: 0;
z-index: 100;
background: rgba(0, 0, 0, 0.7);
}
.sidenav {
display: none;
}
.sidenav.is_active {
display: block;
border: 1px solid var(--border-color);
position: fixed;
z-index: 10;
top: 50%;
right: 0;
transform: translate(0, -50%);
margin-right: var(--space-xl);
padding: 1.25rem;
background: #f8f7f3;
text-align: center;
border-radius: 7px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.sidenav ul.sidenav-menu li {
margin-top: 7px;
border-radius: 5px;
height: 85px;
width: 100px;
line-height: 1.8rem;
position: relative;
}
.sidenav ul.sidenav-menu li a, .sidenav ul.sidenav-menu li a:hover, .sidenav ul.sidenav-menu li a:visited {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
color: #fff;
}
.sidenav ul.sidenav-menu li a:hover {
opacity: 0.7;
}
.sidenav ul.sidenav-menu li img {
display: block;
margin: 0 auto;
}
.sidenav ul.sidenav-menu li span {
font-size: var(--font-sm);
}
.sidenav ul.sidenav-menu li.sidenav-sample {
background: #3ca232;
}
.sidenav ul.sidenav-menu li.sidenav-help {
background: #f40e08;
}
.sidenav ul.sidenav-menu li.sidenav-est {
background: #91AA04;
}
.sidenav ul.sidenav-menu li.sidenav-home {
background: #666666;
}
.page-template-page-est .sidenav, .single-design .sidenav, .page-clearcase .sidenav, .page-package .sidenav {
display: none !important;
}
.page-template-page-est .sidenav.is_active, .single-design .sidenav.is_active, .page-clearcase .sidenav.is_active, .page-package .sidenav.is_active {
display: none !important;
}
.sub-menu {
background: var(--loud-color);
border-bottom: 1px solid var(--border-color);
border-top: 1px solid var(--grey-card);
}
.sub-menu ul {
display: flex;
align-items: center;
}
.sub-menu ul li {
width: 100%;
border-left: 1px solid #fff;
}
.sub-menu ul li:last-child {
border-right: 1px solid #fff;
}
.sub-menu ul li a {
display: block;
font-size: var(--font-2xl);
line-height: 2.5rem;
color: #fff;
font-weight: 700;
background: var(--loud-color);
text-align: center;
padding: var(--space-md) var(--space-sm);
transition: all 300ms ease-in-out;
font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
}
.sub-menu ul li a:hover {
color: #fff;
background: var(--text-color);
}
.sub-menu ul li a i {
color: #fff;
}
.sub-menu ul li.active a {
background: var(--text-color);
color: #fff;
}
.sub-menu ul li.active a i {
display: none;
}
.sub-menu.is_active {
position: fixed;
z-index: 20;
width: 100%;
top: 11.5rem;
left: 0;
}
.draft-nav {
margin-bottom: var(--space-xl);
display: flex;
gap: var(--space-sm);
justify-content: center;
}
.draft-nav li {
border-radius: 4px;
text-align: center;
padding: var(--space-md);
font-size: var(--font-xl);
width: 49%;
}
.draft-nav li.icon_ai, .draft-nav li.icon_ai:visited {
border: 2px solid #FF982D;
color: #FF982D;
}
.draft-nav li.icon_ai:hover, .draft-nav li.icon_ai:visited:hover {
background: #FF982D;
}
.draft-nav li.icon_ai.icon_ai.active, .draft-nav li.icon_ai:visited.icon_ai.active {
background: #FF982D;
color: #fff;
}
.draft-nav li.icon_psd, .draft-nav li.icon_psd:visited {
border: 2px solid #4093CC;
color: #4093CC;
}
.draft-nav li.icon_psd:hover, .draft-nav li.icon_psd:visited:hover {
background: #4093CC;
}
.draft-nav li.icon_psd.icon_psd.active, .draft-nav li.icon_psd:visited.icon_psd.active {
background: #4093CC;
color: #fff;
}
.draft-nav li:hover {
opacity: 0.7;
filter: alpha(opacity=70);
transition: all 0.5s ease;
color: #fff;
}
.table {
width: 100%;
margin-bottom: var(--space-sm);
background-color: transparent;
}
.table th,
.table td {
padding: 0.75rem;
vertical-align: top;
border-top: 1px solid #dee2e6;
text-align: left;
}
.table thead th {
vertical-align: bottom;
border-bottom: 2px solid #dee2e6;
}
.table tbody + tbody {
border-top: 2px solid #dee2e6;
}
.table .table {
background-color: #fff;
}
.table-bordered {
border: 1px solid #dee2e6;
}
.table-bordered th,
.table-bordered td {
border: 1px solid #dee2e6;
}
.table-bordered thead th,
.table-bordered thead td {
border-bottom-width: 2px;
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: rgba(0, 0, 0, 0.05);
}
.table-hover tbody tr:hover {
background-color: rgba(0, 0, 0, 0.075);
}
.card {
margin-bottom: var(--space-xl);
}
.card .card-header {
padding: 1.25rem;
font-size: var(--font-2xl);
font-weight: 700;
line-height: var(--lh-normal);
}
.card {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: #fff;
background-clip: border-box;
border: 1px solid rgba(0, 0, 0, 0.125);
border-radius: 0.25rem;
}
.card > hr {
margin-right: 0;
margin-left: 0;
}
.card > .list-group:first-child .list-group-item:first-child {
border-radius: 0.25rem;
}
.card > .list-group:last-child .list-group-item:last-child {
border-radius: 0.25rem;
}
.card-body {
flex: 1 1 auto;
padding: 1.25rem;
}
.card-title {
margin-bottom: 0.75rem;
}
.card-text:last-child {
margin-bottom: 0;
}
.card-header {
padding: 0.75rem 1.25rem;
margin-bottom: 0;
background-color: rgba(0, 0, 0, 0.03);
border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.card-header:first-child {
border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
}
.card-header + .list-group .list-group-item:first-child {
border-top: 0;
}
.card-footer {
padding: 0.75rem 1.25rem;
background-color: rgba(0, 0, 0, 0.03);
border-top: 1px solid rgba(0, 0, 0, 0.125);
}
.card-footer:last-child {
border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
}
.card-img {
width: 100%;
border-radius: calc(0.25rem - 1px);
}
.card-img-top {
width: 100%;
border-top-left-radius: calc(0.25rem - 1px);
border-top-right-radius: calc(0.25rem - 1px);
}
.circle {
display: inline-flex;
justify-content: center;
align-items: center;
border-radius: 50%;
flex-flow: column wrap;
vertical-align: top;
color: #fff;
border: 4px solid var(--text-color);
background: var(--text-color);
width: 4rem;
height: 4rem;
}
.alert {
position: relative;
padding: 0.75rem 1.25rem;
margin-bottom: var(--space-sm);
border: 1px solid transparent;
border-radius: 0.25rem;
}
.alert-success {
color: #155724;
background-color: #d4edda;
border-color: #c3e6cb;
}
.badge {
display: inline-block;
padding: 0.25em 0.4em;
font-size: 75%;
font-weight: 700;
line-height: var(--lh-none);
text-align: center;
white-space: nowrap;
vertical-align: baseline;
border-radius: 0.25rem;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.hamburger {
padding: 0.9rem 1.1rem;
display: inline-block;
cursor: pointer;
transition-property: opacity, filter;
transition-duration: 0.15s;
transition-timing-function: linear;
font: inherit;
color: inherit;
text-transform: none;
background-color: transparent;
border: 0;
margin: 0;
overflow: visible;
}
.hamburger:hover {
opacity: 0.7;
}
.hamburger.is-active:hover {
opacity: 0.7;
}
.hamburger.is-active .hamburger-inner {
background-color: #fff;
}
.hamburger.is-active .hamburger-inner::before {
background-color: #fff;
}
.hamburger.is-active .hamburger-inner::after {
background-color: #fff;
}
.hamburger-inner {
display: block;
top: 50%;
margin-top: -0.1rem;
width: 2rem;
height: 0.2rem;
background-color: #fff;
border-radius: 0;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease;
}
.hamburger-inner::before {
width: 2rem;
height: 0.2rem;
background-color: #fff;
border-radius: 0;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease;
content: "";
display: block;
top: -0.6rem;
}
.hamburger-inner::after {
width: 2rem;
height: 0.2rem;
background-color: #fff;
border-radius: 0;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease;
content: "";
display: block;
bottom: -0.6rem;
}
.hamburger--squeeze .hamburger-inner {
transition-duration: 0.075s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger--squeeze .hamburger-inner::before {
transition: top 0.075s 0.12s ease, opacity 0.075s ease;
}
.hamburger--squeeze .hamburger-inner::after {
transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger--squeeze.is-active .hamburger-inner {
transform: rotate(45deg);
transition-delay: 0.12s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
.hamburger--squeeze.is-active .hamburger-inner::before {
top: 0;
opacity: 0;
transition: top 0.075s ease, opacity 0.075s 0.12s ease;
}
.hamburger--squeeze.is-active .hamburger-inner::after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.tab-content > .tab-pane {
display: none;
}
.tab-content > .active {
display: block;
} * {
box-sizing: border-box;
}
html {
font-size: 10px;
scroll-behavior: smooth;
}
@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 400;
src: url(//original-pb.net/wp-content/themes/original-pb/webfonts/Lato-400.woff) format("woff"), url(//original-pb.net/wp-content/themes/original-pb/webfonts/Lato-400.woff2) format("woff2");
font-display: swap;
}
body {
background: var(--body-bg);
font-family: var(--base-font-family);
color: var(--text-color);
font-size: var(--base-font-size);
line-height: var(--base-line-height);
overflow-x: hidden;
font-weight: var(--base-font-weight);
letter-spacing: 0.05rem;
}
body.is_active {
height: 100%;
overflow: hidden;
}
.container {
width: 100%;
max-width: var(--container-width);
margin-right: auto;
margin-left: auto;
padding-right: var(--space-md);
padding-left: var(--space-md);
}
.contents-wrap {
padding: 5rem 0;
}
.side-main-warp {
display: flex;
flex-direction: row-reverse;
justify-content: space-between;
}
.side-main-warp .side-contents {
flex: 25%;
padding-right: 25px;
}
.side-main-warp .main-contents {
flex: 75%;
}
.contents {
padding: 0 0 6rem 0;
}
.contents.contents-bg {
background: #f8f7f3;
}
.contents .head-box {
text-align: left;
margin-bottom: var(--space-xl);
}
.contents .head-box h2 {
font-size: 2.5rem;
line-height: 4rem;
padding-left: 2.5rem;
position: relative;
border-bottom: none;
}
.contents .head-box h2::before {
content: "";
width: 0.7rem;
height: 4rem;
border-radius: var(--radius-sm);
background: var(--loud-color);
position: absolute;
left: 0;
top: 0;
}
.contents .main-box {
width: 100%;
margin: 0 auto;
}
.contents .main-box h3 {
padding: var(--space-sm) var(--space-md);
background: #F4F4F4;
margin-bottom: var(--space-md);
line-height: 3rem;
}
.contents .main-box section {
padding-bottom: var(--space-xl);
}
.contents header {
padding-bottom: var(--space-xl);
}
.contents header .main-box {
max-width: 87.5rem;
} .scroll {
margin-top: -22rem !important;
padding-top: 22rem !important;
} .list-group-flush > .list-group-item {
border-width: 0 0 1px;
}
.list-group-flush > .list-group-item:last-child {
border-bottom-width: 0;
}
.list-group-item {
position: relative;
display: block;
padding: 0.75rem 1.25rem;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.125);
}
.list-group-item + .list-group-item {
border-top-width: 0;
}
.list-group-item:last-child {
border-bottom-right-radius: inherit;
border-bottom-left-radius: inherit;
} img {
max-width: 100%;
max-height: 100%;
height: auto;
vertical-align: middle;
}
.img-thumbnail {
padding: 0.25rem;
background-color: #fff;
border: 1px solid #dee2e6;
border-radius: 0.25rem;
max-width: 100%;
height: auto;
}
i {
padding: 0 var(--space-xs);
} .page-template-page-one .read,
.page-template-page-est .read,
.page-template-page-orderguide .read,
.post-type-archive-design .read,
.single-design .read,
.single-product .read,
.single-product-standard .read,
.single-product-hakuoshi .read,
.single-product-naire .read,
.single-product-ofj .read {
padding: 4.5rem 0 0 0;
}
.page-template-page-one .read .main-box,
.page-template-page-est .read .main-box,
.page-template-page-orderguide .read .main-box,
.post-type-archive-design .read .main-box,
.single-design .read .main-box,
.single-product .read .main-box,
.single-product-standard .read .main-box,
.single-product-hakuoshi .read .main-box,
.single-product-naire .read .main-box,
.single-product-ofj .read .main-box {
width: 100%;
max-width: 100rem;
margin: 0 auto;
}
.page-template-page-one .contents,
.page-template-page-est .contents,
.page-template-page-orderguide .contents,
.post-type-archive-design .contents,
.single-design .contents,
.single-product .contents,
.single-product-standard .contents,
.single-product-hakuoshi .contents,
.single-product-naire .contents,
.single-product-ofj .contents {
padding: 6rem 0;
}
.page-template-page-one .contents .main-box,
.page-template-page-est .contents .main-box,
.page-template-page-orderguide .contents .main-box,
.post-type-archive-design .contents .main-box,
.single-design .contents .main-box,
.single-product .contents .main-box,
.single-product-standard .contents .main-box,
.single-product-hakuoshi .contents .main-box,
.single-product-naire .contents .main-box,
.single-product-ofj .contents .main-box {
max-width: 100rem;
}
.page-template-page-one .contents .head-box,
.page-template-page-est .contents .head-box,
.page-template-page-orderguide .contents .head-box,
.post-type-archive-design .contents .head-box,
.single-design .contents .head-box,
.single-product .contents .head-box,
.single-product-standard .contents .head-box,
.single-product-hakuoshi .contents .head-box,
.single-product-naire .contents .head-box,
.single-product-ofj .contents .head-box {
text-align: center;
margin-bottom: var(--space-xl);
}
.page-template-page-one .contents .head-box h2,
.page-template-page-est .contents .head-box h2,
.page-template-page-orderguide .contents .head-box h2,
.post-type-archive-design .contents .head-box h2,
.single-design .contents .head-box h2,
.single-product .contents .head-box h2,
.single-product-standard .contents .head-box h2,
.single-product-hakuoshi .contents .head-box h2,
.single-product-naire .contents .head-box h2,
.single-product-ofj .contents .head-box h2 {
display: inline-block;
font-size: 2.5rem;
line-height: 3.5rem;
text-align: center;
padding: var(--space-xs);
border-bottom: 5px solid var(--loud-color);
border-radius: 2px;
}
.page-template-page-one .contents .head-box h2::before,
.page-template-page-est .contents .head-box h2::before,
.page-template-page-orderguide .contents .head-box h2::before,
.post-type-archive-design .contents .head-box h2::before,
.single-design .contents .head-box h2::before,
.single-product .contents .head-box h2::before,
.single-product-standard .contents .head-box h2::before,
.single-product-hakuoshi .contents .head-box h2::before,
.single-product-naire .contents .head-box h2::before,
.single-product-ofj .contents .head-box h2::before {
background: none;
}
.page-template-page-est .page-end-box,
.single-design .page-end-box,
.page-sample .page-end-box,
.page-contact .page-end-box,
.page-cost .page-end-box {
display: none !important;
}@font-face {
font-family: "Lato";
font-style: normal;
font-weight: 700;
src: url(//original-pb.net/wp-content/themes/original-pb/webfonts/Lato-700.woff) format("woff"), url(//original-pb.net/wp-content/themes/original-pb/webfonts/Lato-700.woff2) format("woff2");
font-display: swap;
}
.title {
font-size: var(--font-3xl);
line-height: 4.5rem;
color: var(--text-color);
font-family: "Lato";
font-weight: 700;
}
.read {
padding-bottom: 6rem;
}
legend {
display: block;
width: 100%;
max-width: 100%;
padding: 0;
margin-bottom: var(--space-xs);
font-size: 1.5rem;
line-height: inherit;
color: inherit;
white-space: normal;
}
fieldset {
margin-bottom: var(--space-xl);
}
.page-title {
background-color: #f8f7f3;
}
.page-title__main {
text-align: center;
padding: 4rem;
}
.price {
padding: var(--space-xs);
& .red {
font-size: 110%;
}
}
.page_top {
position: fixed;
bottom: 85px;
right: 10px;
width: 45px;
height: 45px;
& i {
font-size: var(--font-2xl);
font-weight: 700;
}
}
.page-end-box {
& .card {
border: 0.3rem solid var(--text-color);
& .card-header {
text-align: center;
font-weight: 400;
font-size: 2.5rem;
background: var(--text-color);
color: #fff;
}
& .card-body {
padding: var(--space-lg);
& a + a {
margin-left: 0;
margin-top: var(--space-sm);
}
& p {
margin-bottom: 0;
}
& .more,
& .more:visited {
line-height: 4.5rem;
font-size: var(--font-2xl);
padding: 0 2.5rem;
font-weight: 400;
}
}
&::before {
display: none;
}
}
}
.main-breadcrumb {
padding: var(--space-sm);
& .breadcrumb {
background: none;
padding: 0;
font-size: 1.3rem;
line-height: 2.4rem;
margin-bottom: 0;
& a {
color: #3B4043;
}
}
} #point h3 {
line-height: 4rem;
& .circle {
margin-right: var(--space-xs);
}
}
#lineup {
& ul {
display: flex;
flex-wrap: wrap;
& li {
width: 25%;
padding: 0 var(--space-sm);
}
}
& .card {
position: relative;
& .card-body {
padding: 0.25rem;
}
& .card-title {
margin-bottom: 0;
& h3 {
padding: var(--space-xs);
margin-bottom: 0;
line-height: 2.5rem;
}
}
& .circle {
width: 5rem;
height: 5rem;
background-color: #F40E08;
border-color: #F40E08;
font-weight: 700;
position: absolute;
right: 0.5rem;
top: 0.5rem;
z-index: 1;
}
& .detail {
display: none;
border-radius: var(--radius-sm);
z-index: 10;
}
&:hover .detail {
position: absolute;
top: 0;
left: 0;
right: 0;
display: block;
padding: var(--space-md) var(--space-xs);
background: #333;
opacity: 0.9;
& .more-box {
padding: 0.25em;
& .more + .more {
margin-top: var(--space-sm);
}
}
}
}
}
.example-box .main-box ul li {
margin-bottom: var(--space-xl);
& .card {
margin: 0;
}
& a .card-text {
font-size: var(--font-md);
line-height: 2.5rem;
display: none;
}
& a:hover .card-text {
display: block;
}
}
.example-box .columns {
column-count: 4;
column-gap: var(--space-md);
column-fill: auto;
display: flex;
& .pin {
display: inline-block;
background: #FEFEFE;
border: 1px solid #f6f6f6;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
margin: 0 2px var(--space-md);
padding: var(--space-xs);
background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
opacity: 1;
transition: all 0.2s ease;
width: 23%;
& .pc {
position: relative;
& p {
font-size: var(--font-sm);
line-height: 2rem;
margin-bottom: 0;
}
}
& > a {
display: none;
}
& img {
width: 100%;
margin-bottom: var(--space-xs);
}
& > p {
border-top: 1px dotted #f6f6f6;
padding: var(--space-sm) var(--space-xs) var(--space-xs);
font-size: var(--font-sm);
line-height: 1.4rem;
margin-bottom: 0;
}
& .detail {
display: none;
border-radius: var(--radius-sm);
z-index: 10;
& p {
font-size: 0.8rem;
line-height: 1.4rem;
color: #fff;
margin-bottom: var(--space-sm);
}
& .more-box {
margin-top: var(--space-sm);
& .more,
& .more:visited,
& .more:hover {
font-size: var(--font-md);
border-radius: var(--radius-sm);
padding: var(--space-sm);
line-height: 1.5rem;
opacity: 1;
}
}
}
&:hover > p {
opacity: 0.2;
}
&:hover .detail {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: block;
padding: var(--space-sm);
background: #333;
opacity: 0.9;
}
}
}
.scene-box .card {
& h3.card-title {
text-align: center;
margin-bottom: 0;
line-height: 2.5rem;
}
& .card-text {
margin: var(--space-xs);
}
}
.pickup-box .main-box ul li {
padding-bottom: var(--space-lg);
& a:hover {
color: var(--border-color);
}
& h3 {
padding: var(--space-xs) 0;
background: none;
border-bottom: none;
line-height: 3rem;
margin-bottom: 0;
}
}
.column-box ul {
margin-bottom: var(--space-xl);
}
.strength-box {
& .card .card-body {
display: inline-block;
padding: var(--space-lg);
}
& .card ol li {
font-size: var(--font-xl);
font-weight: 700;
padding-left: 5rem;
&:nth-child(1) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/strength1.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 0 center;
}
&:nth-child(2) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/strength2.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 0 center;
}
&:nth-child(3) {
background-image: url(//original-pb.net/wp-content/themes/original-pb/img/common/strength3.webp);
background-position: 0 0;
background-repeat: no-repeat;
background-position: 0 center;
}
}
& ul li h3 {
font-size: var(--font-md);
line-height: 3rem;
& .circle {
background: #57C0C8;
border-color: #57C0C8;
margin-right: var(--space-xs);
width: 3rem;
height: 3rem;
}
}
& ul li + li {
margin-top: var(--space-lg);
}
} header {
& .pagetop {
background: #565656;
}
& .pagetop--wrap {
display: flex;
justify-content: space-between;
& h1 {
font-size: 1.3rem;
line-height: 3rem;
color: #fff;
font-weight: 400;
}
& p {
font-size: 1.3rem;
line-height: 3rem;
color: #fff;
font-weight: 400;
margin-bottom: 0rem;
}
}
& .pagetop--right {
display: flex !important;
& li {
padding-left: var(--space-lg);
font-size: 1.3rem;
line-height: 3rem;
& a {
color: #fff;
&:hover {
color: var(--border-color);
}
& i {
padding-right: var(--space-xs);
}
&.more.btn-detail,
&.more.btn-detail:visited {
line-height: 1rem;
padding: 0.4rem 0.1rem;
background: #eee;
border-radius: 0.2rem;
}
&.more.btn-detail::before,
&.more.btn-detail:visited::before {
display: none;
}
}
&:hover .more.btn-detail,
&:hover .more.btn-detail:visited {
padding-bottom: 0.8rem;
border-bottom: none;
border-radius: 0.2rem 0.2rem 0 0;
}
}
}
& .header {
border-bottom: 0.5rem solid var(--border-color);
background: #fff;
&.is_active {
position: fixed;
z-index: 99;
width: 100%;
top: 0;
left: 0;
}
}
& .header__main {
display: flex;
align-items: center; }
& .header__main__nomal {
justify-content: space-between;
}
& .header__main--left {
width: 23rem;
display: flex;
justify-content: center;
align-items: center;
& img {
width: auto;
height: 80px;
}
}
& .header__main--center {
display: flex;
justify-content: center;
align-items: center;
}
& .header__main--right {
display: flex;
justify-content: flex-end;
align-items: center;
& .header-contact {
align-items: center;
display: flex;
& .tel {
width: 20rem;
vertical-align: middle;
}
& .more-box {
width: 12rem;
& .more {
color: #fff;
background: #F38F00;
border-radius: 5px;
padding: 0;
width: 100%;
border: 2px solid var(--loud-color);
&:hover {
color: #fff;
background: #F40D07;
}
&::after {
display: none;
}
}
&.btn-repeat {
width: 10rem !important;
margin-right: var(--space-sm);
& .more,
& .more:visited {
color: #fff;
font-weight: 700;
border: 2px solid #12A73B;
background: #12A73B;
border-radius: 0.3rem;
& i {
padding: 0 var(--space-xs) 0 0;
}
&:hover {
background: #008000;
}
&::after {
display: none;
}
}
}
}
}
}
} .header-info-box {
background: #f8f7f3;
color: #DE2C0C;
font-size: var(--font-md);
padding: var(--space-sm) 0;
text-align: center;
font-weight: 700;
& p {
margin-bottom: 0;
}
}
.dropdown {
position: relative;
display: inline-block;
&:hover .dropdown-content {
display: block;
}
& .dropbtn {
cursor: pointer; }
& .dropdown-container {
position: relative;
}
& .dropdown-content {
display: none;
position: absolute;
background-color: #FDF3E5;
min-width: 100%;
width: 290px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 999999;
left: -105%;
padding: var(--space-md);
&:before {
content: "";
position: absolute;
top: -25px;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-bottom: 15px solid #FDF3E5;
}
& li + li {
margin-top: 0.8rem;
}
& a:hover {
background-color: #fff;
border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-lg);
box-sizing: border-box;
color: var(--loud-color); }
& .btn_3 {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
border: 1px solid #ccc;
border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-lg);
background-color: #fff;
display: block;
font-size: 1.3rem;
padding: var(--space-xs);
color: var(--text-color);
font-weight: 700;
line-height: 3.5rem;
position: relative;
transition: all 300ms ease-in-out;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
overflow: hidden;
}
& a:hover .btn_3 {
border: 1px solid var(--loud-color);
border-radius: var(--radius-lg) var(--radius-lg) var(--radius-lg) var(--radius-lg);
box-sizing: border-box;
color: var(--loud-color);
}
}
}
.page-onepoint .sub-menu .dropdown-content,
.page-naire .sub-menu .dropdown-content {
left: -20%;
}
.main-nav-sp .sp_h1 {
line-height: 3rem !important;
color: #fff !important;
padding: 0 8px !important;
background: #565656 !important;
border-bottom: 1px solid var(--border-color) !important;
text-align: center !important;
& h1 {
font-size: 1.1rem !important;
font-weight: normal !important;
}
} .footer {
border-top: 7px solid var(--border-color);
padding-top: 4.5rem;
background: var(--grey-card);
& .copyright {
border-top: 1px solid var(--border-color);
background: #565656;
text-align: center;
padding: var(--space-xs) 0;
& p {
font-size: var(--font-md);
color: #fff;
margin-bottom: 0;
}
}
}
.footer__menu {
margin-bottom: 4.5rem;
& .container {
max-width: 105rem;
}
& .list-menu {
border-right: 1px solid var(--border-color);
padding: 0 var(--space-xl);
& h3 {
font-size: var(--font-lg);
line-height: 2.8rem;
color: #333333;
margin-bottom: var(--space-md);
}
& ul li a {
font-size: var(--font-md);
color: #1f1f1f;
line-height: 2.5rem;
transition: all 300ms ease-in-out;
&:hover {
color: var(--border-color);
}
}
&:last-child {
border: none;
}
}
}
.footer__list {
border-top: 1px solid var(--border-color);
background: #fff;
& .container {
padding: 0 var(--space-xl);
}
& .footer__list-contents {
border-right: 1px solid var(--border-color);
display: flex;
flex-wrap: wrap;
& .items {
border-left: 1px solid var(--border-color);
border-bottom: 1px solid var(--border-color);
width: 20%;
& a {
font-size: var(--font-md);
line-height: 2.4rem;
padding: var(--space-xs);
display: flex;
align-items: center;
font-weight: 700;
vertical-align: middle;
color: #333;
& img {
margin-right: var(--space-md);
max-width: 5rem;
height: auto;
}
}
&:hover {
background: #565656;
& a {
color: #fff;
}
}
}
}
} .sideblogContent {
padding-bottom: var(--space-xl);
& dt {
padding: var(--space-sm);
border: 1px var(--border-color) solid;
border-left: 7px var(--border-color) solid;
margin-bottom: var(--space-sm);
font-size: var(--font-2xl);
}
& dl ul {
padding-left: var(--space-sm);
& li {
width: 100%;
display: block;
padding: var(--space-sm) 0;
}
}
& .badge {
color: #fff;
background-color: var(--link-color);
margin-left: var(--space-xs);
}
& div {
margin-bottom: var(--space-lg);
text-align: center;
}
& .list-group-item.active {
background: #f6f6f6;
color: var(--text-color);
border-color: var(--border-color);
margin-bottom: 0;
}
}
.sidebar {
margin-bottom: var(--space-xl);
& h3 {
font-size: var(--font-2xl);
color: #fff;
line-height: 2.4rem;
padding: var(--space-md) var(--space-md);
background-color: #37beec;
background-position: 0 0;
background-repeat: no-repeat;
background-repeat: repeat-x;
background-size: auto 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
& .bl_accordionTitle {
background-color: #fcfcfc;
padding: var(--space-sm);
transition: 0.3s;
cursor: pointer;
position: relative;
color: var(--link-color);
&::before {
content: "";
width: 5px;
height: 5px;
border-right: 2px solid #000;
border-bottom: 2px solid #000;
position: absolute;
top: 35%;
transform: rotate(45deg);
right: 20px;
transition: 0.3s;
}
&.active::before {
transform: rotate(225deg);
top: 45%;
}
&:hover::before,
&.active::before {
border-right: 2px solid #249caa;
border-bottom: 2px solid #249caa;
}
&:hover,
&.active {
background-color: #bde1e5;
color: #249caa;
font-weight: bold;
}
}
}  セクションの同名ルールを
* Index ページ用に部分的に上書きする。ルール定義順による cascade で後勝ち（later wins）を維持。 */
.example-box .main-box ul li {
margin-bottom: var(--space-xl);
& .card {
margin: 0;
}
& a .card-text {
font-size: var(--font-md);
line-height: 2.5rem;
display: none;
}
& a:hover .card-text {
display: block;
}
}
.example-box .columns {
display: flex;
flex-wrap: wrap;
gap: var(--space-md);
justify-content: center;
& .pin {
display: inline-block;
background: #FEFEFE;
border: 1px solid #f6f6f6;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
margin: 0 2px var(--space-md);
break-inside: avoid;
padding: var(--space-xs);
background: -webkit-linear-gradient(45deg, #FFF, #F9F9F9);
opacity: 1;
transition: all 0.2s ease;
width: 22%;
& .pc {
position: relative;
}
& > a {
display: none;
}
& img {
width: 100%;
margin-bottom: var(--space-xs);
}
& > p {
border-top: 1px dotted #f6f6f6;
padding: var(--space-sm) var(--space-xs) var(--space-xs);
font-size: var(--font-md);
line-height: 2rem;
margin-bottom: 0;
}
& .detail {
display: none;
border-radius: var(--radius-sm);
z-index: 10;
& p {
font-size: var(--font-md);
line-height: 2.5rem;
color: #fff;
margin-bottom: var(--space-sm);
}
& .more-box {
margin-top: var(--space-sm);
& .more,
& .more:visited,
& .more:hover {
font-size: var(--font-md);
border-radius: var(--radius-sm);
padding: var(--space-xs);
line-height: 1.5rem;
opacity: 1;
&::after {
font-size: var(--font-xs);
}
}
}
}
&:hover > p {
opacity: 0.2;
}
&:hover .detail {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: block;
padding: var(--space-sm);
background: #333;
opacity: 0.9;
}
}
}
.scene-box .main-box {
max-width: 85.5rem;
& ul li + li {
padding-top: var(--space-lg);
}
}
.pickup-box .main-box ul li {
padding-bottom: var(--space-lg);
& a:hover {
color: var(--border-color);
}
& h3 {
padding: var(--space-xs) 0;
background: none;
border-bottom: none;
line-height: 3rem;
margin-bottom: 0;
}
}
.top-orerguide-box ul {
display: flex;
& li {
flex: 25%;
& dl {
padding: var(--space-sm);
padding-right: 0;
text-align: left;
display: flex;
align-items: center;
& dt {
margin-right: 0.8rem;
}
& dd {
font-weight: bolder;
&:after {
font-family: "Font Awesome 5 Pro";
content: "\f054";
display: inline-block;
padding-left: var(--space-xs);
font-size: var(--font-md);
color: #F7C045;
}
}
&.top-orerguide-step {
background: #F7C045;
position: relative;
height: 70px;
width: 90%;
border-radius: 2px;
&::after {
content: "";
position: absolute;
right: -30px;
border-left: 15px solid;
border-top: 35px solid transparent;
border-right: 15px solid transparent;
border-bottom: 35px solid transparent;
color: #F7C045;
}
&:hover {
background: var(--border-color);
&::after {
color: var(--border-color);
}
}
& dd {
font-size: var(--font-xl);
color: #333;
line-height: var(--lh-tight);
& span {
color: #fff;
font-size: var(--font-md);
}
&::after {
content: none;
}
}
}
}
}
}:is(.page-wooden, .page-acrylic, .page-acrylicstand, .page-acryliccard) {
& .page-title {
background-color: var(--text-color);
}
& .page-title__main {
padding: 0;
}
& .strength-box .card ul li p {
margin: var(--space-xs) 0 0 0;
}
& .strength-box .card ul li + li {
margin-top: 0;
}
} #price ul {
margin-right: -5px;
margin-left: -5px;
& li.item {
flex: 0 0 20%;
max-width: 20%;
padding-right: var(--space-xs);
padding-left: var(--space-xs);
}
}
.price-box {
& table {
background-color: #fff;
}
& .main-box h3 {
background: #565656;
color: #fff;
}
}
table.table-price {
background-color: #fff;
& th,
& td {
text-align: center;
vertical-align: middle;
padding: 1.2rem;
}
& td {
font-size: var(--font-xl);
font-weight: 700;
}
} .page-draft ul.draft-btn li {
margin: var(--space-md);
& a {
width: 100%;
text-align: left;
& i {
line-height: 4.4rem;
}
}
}
.page-template-page-draft-guide {
& .table-draft {
& th {
background-color: #f8f7f3;
}
& td {
vertical-align: middle;
width: 60%;
}
}
& .draft-guide-box .card {
margin-bottom: 4rem;
& .card-body {
padding: var(--space-xl);
& img {
display: block;
margin: var(--space-sm) auto;
}
}
&:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin: 1px -15rem;
border: 15rem solid transparent;
border-top: 3rem solid #f8f7f3;
}
& dl {
margin-bottom: var(--space-lg);
& dt {
background: #f6f6f6;
padding: var(--space-sm);
text-align: center;
}
}
&:last-child {
margin-bottom: 0;
&:before {
display: none;
}
}
}
} .page-sample table.table-size {
margin-bottom: 0;
& th,
& td {
vertical-align: middle;
}
& thead th:first-child {
width: 40%;
}
& thead th:nth-child(2) {
width: 30%;
}
& thead th:nth-child(3) {
width: 15%;
}
& thead th:nth-child(4) {
width: 15%;
}
& tbody td:nth-child(3),
& tbody td:nth-child(4) {
text-align: center;
}
& tbody td,
& tbody th {
background: #fff;
}
} .page-est .card a:hover .more.btn-contact,
.page-est .card a:hover body .more.btn-contact:visited {
background: #F40D07;
color: #fff;
} .page-faq .read nav ul li,
.page-faq .contents nav ul li {
border-bottom: 1px dotted var(--border-color);
padding: var(--space-xs);
} .page-sitemap .main-box .sitemapーcontents {
display: flex;
flex-wrap: wrap;
& .sitemapーsection {
width: 50%;
padding: var(--space-sm);
& ul li {
padding: var(--space-xs) var(--space-md);
}
}
} .page-payment #payment1 p {
padding-top: var(--space-lg);
margin-bottom: var(--space-lg);
&:nth-child(1) {
padding-top: 0;
}
} .page-flow .contents .flex {
padding: 0 var(--space-md);
}
#lineup .card {
position: relative;
& .card-body {
padding: 0.25rem;
}
& .card-title h3 {
padding: var(--space-xs);
margin-bottom: 0;
line-height: 2.5rem;
}
& .circle {
width: 5rem;
height: 5rem;
background-color: #0C8CCF;
border-color: #0C8CCF;
font-weight: 700;
position: absolute;
right: 0.5rem;
top: 0.5rem;
z-index: 1;
}
& .detail {
display: none;
border-radius: var(--radius-sm);
z-index: 10;
}
&:hover .detail {
position: absolute;
top: 0;
left: 0;
right: 0;
display: block;
padding: var(--space-md) var(--space-xs);
background: #333;
opacity: 0.9;
& .more-box {
padding: 0.25em;
}
}
}
:is(.page-onepoint, .page-naire, .single-product) {
& .read {
padding: 7rem 0 0;
& ul li {
opacity: 0.7;
& a {
border: 5px var(--border-color) solid;
display: block;
}
&:hover,
&:hover a img:hover {
opacity: 1;
}
}
}
& .card .card-header {
padding: 1.25rem;
font-size: var(--font-lg);
font-weight: 700;
line-height: var(--lh-normal);
}
& .onepoint-size-box .card span.red {
font-size: var(--font-2xl);
font-weight: 700;
}
}
:is(.page-onepoint-size, .page-naire-size) .contents .main-box ul li {
margin-bottom: var(--space-md);
}
:is(.page-scene-event, .page-scene-house, .page-scene-apparel) .read {
padding-bottom: 0;
& p {
margin: var(--space-sm) 0 0 0;
}
}
:is(.page-scene-house, .page-scene-apparel) .scene-rerca .main-box {
max-width: 100rem;
}
.scene-specification {
& h2 {
border-bottom: none;
margin-bottom: var(--space-xl);
text-align: center;
}
& h3 {
font-size: var(--font-xl);
}
& .card {
border: 5px var(--border-color) solid;
background: #F9F9F9;
border-radius: var(--radius-md);
& .card-body {
padding: var(--space-xl);
& dl {
border: 1px var(--border-color) solid;
font-size: var(--font-xl);
background: #333;
&.row {
margin: 0 0 var(--space-xs) 0;
}
& dt {
background: #333;
color: #fff;
padding: var(--space-sm) var(--space-md);
}
& dd {
padding: var(--space-sm) var(--space-md);
color: #ff3456;
background: #fff;
font-weight: 700;
}
}
}
}
&.scene-specification-mini .main-box {
max-width: 70rem;
}
}
@media (max-width: 768px) {
.scene-specification h2 {
font-size: 0.8rem;
}
}
.scene-rerca {
& .head-box h2 {
border-bottom: none !important;
}
& .card .card-body {
padding: var(--space-xl);
& .row div {
margin: var(--space-md) auto;
}
& .row p {
margin-bottom: 0;
text-align: left;
}
}
}
.scene-sample {
& .scene-slider .card {
margin: 0 var(--space-sm) var(--space-lg);
& span {
font-size: var(--font-md);
line-height: 0.5rem;
}
}
& h3 {
font-weight: bold;
}
}
.scene-point {
& .panel {
border: 1px var(--border-color) solid;
}
& h3 {
line-height: 3rem;
}
& .label {
background-color: #333;
margin-right: var(--space-sm);
color: #fff;
font-size: var(--font-md);
padding: var(--space-xs);
border-radius: var(--radius-sm);
}
}
.scene-custom .card .card-header {
text-align: center;
font-weight: 700;
font-size: var(--font-xl);
}
.scene-link {
& li div p {
text-align: center;
}
& h4 {
text-align: center;
margin-bottom: var(--space-lg);
font-size: 2.2rem;
}
& span.label {
position: relative;
top: -15px;
}
}
.page-orderguide .contents {
& .main-box ul li {
margin-bottom: var(--space-lg);
& p {
margin: var(--space-sm) 0 0 0;
}
}
& .main-box h3 {
margin-bottom: 0;
}
}
table.table-size {
margin-bottom: 0;
& th,
& td {
vertical-align: middle;
}
& thead th:first-child {
width: 35%;
}
& thead th:nth-child(2) {
width: 25%;
}
& tbody td,
& tbody th {
background: #fff;
}
& tbody span {
padding: 0.4rem;
border-radius: 0.4rem;
margin-right: var(--space-sm);
font-size: 1.3rem;
font-weight: 400;
&.size-square {
border: 1px solid #16a085;
color: #16a085;
}
&.size-tate {
border: 1px solid #e74c3c;
color: #e74c3c;
}
&.size-yoko {
border: 1px solid #2980b9;
color: #2980b9;
}
}
}
.form-group {
& label {
cursor: pointer;
}
& table.table-size {
& tbody tr:hover th,
& tbody tr:hover td {
background: var(--border-color);
}
& tbody tr:hover td.first {
background: #fff;
}
& tbody tr.active th,
& tbody tr.active td {
background: #FFCD36;
}
& tbody tr.active td.first {
background: #fff;
}
& tbody .check {
background-color: transparent;
border: none;
padding: var(--space-xs);
border-radius: 0;
}
& tbody th {
padding: 0;
}
& tbody td {
padding: 0 var(--space-xs);
&:first-child {
background: #fff;
}
}
}
&#address ul {
margin: 0 -15px;
}
}
.post-type-archive-logo_template {
& .read {
padding-bottom: 4.5rem;
}
& .logo-point-box {
& .card {
border-radius: 0.7rem;
text-align: center;
margin-bottom: var(--space-lg);
& .card-title {
font-weight: bold;
font-size: var(--font-xl);
& .circle {
margin-bottom: var(--space-xs);
font-size: var(--font-2xl);
}
}
}
& .small {
color: #999;
line-height: 1.4rem;
}
& .more::after {
content: "\f107" !important;
}
}
& .logolist-box {
& ul li.item {
flex: 0 0 20%;
max-width: 20%;
padding-right: 25px;
padding-left: 25px;
margin-bottom: var(--space-xl);
& .popup {
display: none;
text-align: center;
}
& dl {
text-align: center;
& dd {
line-height: 10;
}
& dt {
color: #666;
}
}
&:hover {
position: relative;
& .popup.is_active {
display: none;
}
& .popup {
transition: all 400ms ease-in-out;
position: absolute;
display: block;
color: var(--loud-color);
font-size: var(--font-md);
font-weight: 700;
background: #f8f7f3;
bottom: 20%;
left: -30%;
text-align: center;
border-radius: 5px;
z-index: 15;
padding: var(--space-md) var(--space-lg);
border: 2px solid var(--border-color);
width: 350px;
& img {
background: #fff;
&.logo-img {
max-width: 100%;
display: block;
margin: 0 auto;
height: auto;
}
}
& ul li {
padding: 0 var(--space-xs);
margin-top: var(--space-sm);
}
& .more.btn-contact,
& .more.btn-contact:visited {
margin-top: var(--space-sm);
border-radius: 5px;
padding: 0 var(--space-sm);
line-height: 3.5rem;
}
&::before {
content: "";
position: absolute;
top: 100%;
left: 45%;
border: 7px solid transparent;
border-top: 7px solid var(--border-color);
}
& span.close {
width: 2.5rem;
height: 2.5rem;
border-radius: 100%;
background: #565656;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
right: 5px;
top: 5px;
cursor: pointer;
z-index: 10;
&::after {
content: "\f00d";
font-family: "Font Awesome 5 Pro";
font-weight: 900;
display: inline-block;
}
}
}
}
}
& #logo3-5 {
& div {
padding: var(--space-md);
}
& h4 {
padding: var(--space-sm);
margin-bottom: var(--space-sm);
border-top: 2px solid var(--border-color);
border-bottom: 2px solid var(--border-color);
}
& ul li.item {
flex: 0 0 20%;
max-width: 100%;
padding: 0;
margin-bottom: var(--space-md);
& a {
padding: 0 var(--space-md);
}
& img {
padding-left: var(--space-lg);
}
&:hover .popup {
bottom: 100%;
left: 40px;
}
}
}
}
& .logo-flow-box ul li {
& .card::before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin: 1px -15rem;
border: 15rem solid transparent;
border-top: 3rem solid #f8f7f3;
}
&:last-child .card::before {
display: none;
}
}
& .logo-faq-box h3 {
font-size: var(--font-xl);
line-height: 4rem;
& .circle {
margin-right: var(--space-xs);
}
}
}
:is(.page-standard, .single-product) {
& .page-title .container {
padding: 0;
}
& .page-title__main {
padding: 0;
}
& .read {
padding: 4.5rem 0;
background-color: #F8F7F3;
& .card a {
color: var(--text-color);
}
& .card .card-title {
font-size: var(--font-3xl);
text-align: center;
font-weight: 700;
}
& .card img {
margin: var(--space-xs) 0 var(--space-sm);
}
}
& #lineup {
& .table-size .more {
line-height: 3.4rem;
border-radius: 5px;
padding: 0 var(--space-sm);
font-size: var(--font-md);
}
& .lineup-group {
background-color: #565656;
color: #fff;
padding: var(--space-sm) var(--space-md);
margin-bottom: var(--space-md);
line-height: 3rem;
font-size: var(--font-xl);
}
& .card {
& span.size-mark {
position: absolute;
top: 0.5rem;
left: 0.5rem;
padding: 0.4rem;
border-radius: 0.4rem;
margin-right: var(--space-sm);
font-size: 1.3rem;
font-weight: 400;
line-height: var(--lh-tight);
color: #fff;
&.size-square {
background-color: #16a085;
}
&.size-tate {
background-color: #e74c3c;
}
&.size-yoko {
background-color: #2980b9;
}
}
& .circle {
background-color: #F40E08;
border-color: #F40E08;
line-height: var(--lh-none);
}
& .card-title {
margin-bottom: 0;
}
& p {
font-size: 80%;
padding: var(--space-xs);
line-height: var(--lh-normal);
margin-bottom: 0;
}
& ul li + li {
margin-left: var(--space-xs);
}
& .more {
line-height: 3.4rem;
border-radius: 5px;
padding: 0 var(--space-sm);
font-size: 80%;
margin-bottom: var(--space-xs);
position: relative;
z-index: 5;
}
}
}
} :is(.single-product-standard, .single-product) #lineup {
& .table-size .more {
line-height: 3.4rem;
border-radius: 5px;
padding: 0 var(--space-sm);
font-size: var(--font-md);
}
& .lineup-group {
background-color: #565656;
color: #fff;
padding: var(--space-sm) var(--space-md);
margin-bottom: var(--space-md);
line-height: 3rem;
font-size: var(--font-xl);
}
& .card {
& span.size-mark {
position: absolute;
top: 0.5rem;
left: 0.5rem;
padding: 0.4rem;
border-radius: 0.4rem;
margin-right: var(--space-sm);
font-size: 1.3rem;
font-weight: 400;
line-height: var(--lh-tight);
color: #fff;
&.size-square {
background-color: #16a085;
}
&.size-tate {
background-color: #e74c3c;
}
&.size-yoko {
background-color: #2980b9;
}
}
& .circle {
background-color: #F40E08;
border-color: #F40E08;
line-height: var(--lh-none);
}
& .card-title {
margin-bottom: 0;
}
& p {
font-size: 80%;
padding: var(--space-xs);
line-height: var(--lh-normal);
margin-bottom: 0;
}
& ul li + li {
margin-left: var(--space-xs);
}
& .more {
line-height: 3.4rem;
border-radius: 5px;
padding: 0 var(--space-sm);
font-size: 80%;
margin-bottom: var(--space-xs);
position: relative;
z-index: 5;
}
}
}
:is(.page-template-page-one, .single-product) #orderguide {
& h3 {
line-height: 3.5rem;
background: #565656;
border-radius: var(--radius-sm);
color: #fff;
font-weight: 400;
& .circle {
margin-right: var(--space-sm);
border: 2px solid #fff;
background: none;
width: 3.5rem;
height: 3.5rem;
}
}
& h4 {
background: #f4f4f4;
padding: var(--space-sm);
text-align: center;
}
& ul.row {
padding: 0 var(--space-md);
& img {
width: 100%;
height: auto;
}
}
}
} .top-omparison {  }
.top-omparison .table-area {
width: 100%;
margin: 0 auto;
overflow-x: scroll;
}
.top-omparison table {
table-layout: fixed;
}
.top-omparison table.sp-table {
width: 100%;
min-width: 900px;
margin: 1em auto 2em;
}
.top-omparison table.sp-table,
.top-omparison table.sp-table td,
.top-omparison table.sp-table th {
border: 1px solid var(--border-color);
border-collapse: collapse;
}
.top-omparison table.sp-table td,
.top-omparison table.sp-table th {
color: #423233;
font-weight: 500;
font-size: 14px;
text-align: center;
padding: 0.5em;
box-sizing: border-box;
letter-spacing: 0.56px;
font-weight: 600;
text-align: center;
vertical-align: middle;
}
.top-omparison table.sp-table th {
width: 8%;
}
.top-omparison table.sp-table td {
width: 22%;
}
.top-omparison table.sp-table th {
color: #333;
font-size: 13px;
background-color: #ececec;
font-weight: 600;
line-height: 18px;
}
.top-omparison .table_tit {
color: #423233;
font-size: 20px;
font-weight: 700;
line-height: 28px;
letter-spacing: 1.1px;
margin: 0.6em;
}
.top-omparison .table_tit_s {
font-size: 18px;
font-weight: 700;
color: #423233;
border-radius: 8px 8px 0px 0px;
background: #E3E3E3;
padding: 12px 0px 8px 0px;
line-height: 16px;
letter-spacing: 0.2px;
max-width: 266px;
margin: var(--space-sm) auto -4px auto;
}
.top-omparison .table_explanatory {
color: #423233;
font-size: 14px;
font-weight: 600;
line-height: 22px;
letter-spacing: 0.7px;
margin: 0.8em;
}
.top-omparison .table_number {
text-align: right;
font-family: Oswald;
font-size: 36px;
font-style: normal;
font-weight: 700;
line-height: 110%;
letter-spacing: 0.4px;
}
.top-omparison .table_conditions {
background-color: #fff;
width: 80%;
margin: 4px auto;
border-radius: 6px;
line-height: 18px;
padding: 0.3em;
font-size: 12px;
}.top-omparison .sp-table tr td:nth-child(2) {
background: #ECFEFF;
}
.top-omparison .sp-table tr td:nth-child(3) {
background: #FFFAD0;
}
.top-omparison .sp-table tr td:nth-child(4) {
background: #FFE9D0;
}
.top-omparison .sp-table tr td:nth-child(5) {
background: #EEFFE9;
}
.top-omparison p {
margin-bottom: 0px;
}
.top-omparison .p_s {
font-size: 14px;
font-weight: 500;
line-height: 20px;
letter-spacing: 0.8px;
}
.top-omparison ul {
font-size: 16px;
list-style-type: disc;
line-height: 20px;
text-align: left;
padding: 0 1.5em;
}
.top-omparison li {
border-top: 0;
border-bottom: 0;
}
.top-omparison .center {
text-align: center;
}
.top-omparison .plan-box {
padding: 5.5rem 0 0rem;
}.top-omparison .td_price .price {
display: flex;
align-items: flex-end;
justify-content: center;
}
.top-omparison .td_price .table_number2 {
line-height: 16px;
margin-left: 4px;
}
.top-omparison .td_price .price {
display: flex;
align-items: flex-end;
justify-content: center;
}
.top-omparison .td_price .table_number2 {
line-height: 16px;
margin-left: 4px;
}.top-omparison .table_btn {
margin: 0 auto;
color: #fff;
display: block;
width: 80%;
padding: 0.2em 0.2em 0.3em 0.2em;
text-align: center;
background-color: var(--loud-color);
border: 1px solid var(--loud-color);
border-radius: 30px;
font-size: 18px;
font-weight: 700;
transition: 0.3s;
margin-bottom: 0.5em;
}
.top-omparison .table_btn:hover {
background-color: #FFFDEA;
color: var(--loud-color);
border: 1px solid var(--loud-color);
}
@media screen and (min-width: 992px) {
.top-omparison .table-area {
overflow-x: auto;
}
.top-omparison table.sp-table {
width: 100%;
}
.top-omparison .s_none {
display: none;
}
}
@media screen and (max-width: 991px) {
.top-omparison .table_tit {
font-size: 19px;
line-height: 24px;
}
.top-omparison .table_tit_s {
font-size: 16px;
}
.top-omparison .table_btn {
font-size: 16px;
}
.top-omparison .table_number {
font-size: 30px;
}
.top-omparison .h_none {
display: none;
}
.top-omparison .table_number2 {
line-height: 12px;
margin-left: 2px;
font-size: 10px;
}
}
.top-omparison .cp_box *, .top-omparison .cp_box *:before, .top-omparison .cp_box *:after {
box-sizing: border-box;
}
.top-omparison .cp_box {
position: relative;
}
.top-omparison .cp_box label {
position: absolute;
z-index: 1;
bottom: 0;
width: 100%;
height: 140px; cursor: pointer;
text-align: center; background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
}
.top-omparison .cp_box input:checked + label {
background: inherit; }
.top-omparison .cp_box label:after {
line-height: 2.5rem;
position: absolute;
padding: 0.5em;
z-index: 2;
bottom: 20px;
left: 50%;
width: 30rem;
font-family: "Font Awesome 5 Pro";
content: "\f13a" " すべての比較情報を表示する";
transform: translate(-50%, 0);
letter-spacing: 0.05em;
color: var(--text-color);
border-radius: 30px;
background-color: #f6f6f6;
border: solid 2px #aaa;
}
.top-omparison .cp_box input {
display: none;
}
.top-omparison .cp_box .cp_container {
overflow: hidden;
height: 750px; transition: all 0.5s;
}
.top-omparison .cp_box input:checked + label { }
.top-omparison .cp_box input:checked + label:after {
font-family: "Font Awesome 5 Pro";
content: "\f139" " 閉じる";
}
.top-omparison .cp_box input:checked ~ .cp_container {
height: auto;
padding-bottom: 80px; transition: all 0.5s;
}
@media screen and (min-width: 750px) {
#cta_btn {
display: none;
}
}
.page-template-page-one #onepoint-feature .contents, .page-template-page-one #naire-feature .contents {
padding: 3.5rem 0;
}
.page-template-page-one #onepoint-feature h2, .page-template-page-one #naire-feature h2 {
color: var(--loud-color);
margin-bottom: var(--space-sm);
}@media (min-width: 992px) {}
@media (max-width: 991px) {}
@media (max-width: 767px) {}@media (min-width: 768px) {
.onepoint-thumbnail ul {
display: flex;
flex-wrap: wrap;
gap: var(--space-md);
justify-content: center;
}
.onepoint-thumbnail ul li img {
border: solid 2px #cfcfcf;
width: 50px;
height: auto;
}
}
@media (max-width: 767px) {
.onepoint-thumbnail ul {
text-align: center;
}
.onepoint-thumbnail ul li img {
width: 80%;
height: auto;
border: solid 2px #cfcfcf;
}
.onepoint-thumbnail ul li + li {
margin-top: var(--space-xs);
}
}
#naire-size .card-body .card-text, #onepoint-size .card-body .card-text {
margin-bottom: 0px;
padding: var(--space-xs) 0rem;
}
.guide-list ul {
display: flex;
flex-wrap: wrap;
gap: var(--space-md);
justify-content: center;
}
.form {
background: none;
padding: initial;
border-radius: none;
}
.wq-Form {
background-color: initial !important;
}
.wq-Form .wq-Option {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq-Option > .wq--label > .wq--main, .wq-Form .wq-Option > .wq--label > .wq--media {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq-Quantity > .wq--head > .wq--media {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq-Selector > .wq--body, .wq-Form .wq-Selector > .wq--head > .wq--media {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq-Slider > .wq--head > .wq--media {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq-Selector > .wq--body {
padding: var(--space-sm);
display: flex !important;
flex-wrap: wrap !important;
background-color: initial !important;
padding: 0px !important;
}
.wq-Form .wq--required {
font-size: var(--font-xs) !important;
line-height: 1.8rem !important;
background-color: #fff;
padding: 1px 2px;
border-radius: 4px;
border: solid 1px #de2c0c;
color: #de2c0c !important;
}
.wq-Form .wq-Control.wq-for-action {
order: 40;
}
#wq-action {
padding: var(--space-lg) 4rem 4em 4rem;
}
.wq-Form .wq-Control {
background: #fbfaf8;
}
.form .wq-HNavigator {
background: var(--grey-card);
padding: 2.5rem var(--space-xl);
border-radius: var(--radius-md);
}
.form .wq-Attributes {
padding: 0rem var(--space-xl);
background: var(--grey-card);
padding: 2.5rem var(--space-xl);
border-radius: var(--radius-md);
margin-top: var(--space-lg);
margin-bottom: 0px !important;
}
.wq--title {
color: #de2c0c !important;
font-waight: bold;
}
.annotation {
background: #fbfaf8;
padding: var(--space-lg) 50px 50px;
}
.example {
background: #fff;
padding: var(--space-lg);
}
.wq--label {
padding: 7px;
border-radius: var(--radius-sm);
background-color: #fff;
border: solid 1px var(--border-color) !important;
}
.wq-Form .wq-Quantity, .wq-Form .wq-Selector, .wq-Form .wq-Slider {
border: none !important;
}
.annotation {
padding: var(--space-lg) 50px;
background-color: #fff;
}
.annotation dt {
margin-top: 0;
text-align: center;
font-size: var(--font-2xl);
font-weight: 600;
letter-spacing: 0.08em;
padding: var(--space-sm) 0px;
}
.annotation .example dd {
list-style: none;
padding-left: 1.5em;
margin-left: 0.5em;
text-indent: -1em;
}
@media (min-width: 768px) {
div.wq-Option + div.wq-Option {
margin-left: var(--space-sm);
}
.wq-Form .wq-Quantity, .wq-Form .wq-Selector, .wq-Form .wq-Slider {
flex-direction: initial !important;
}
.wq-Form .wq-Quantity > .wq--head, .wq-Form .wq-Selector > .wq--head, .wq-Form .wq-Slider > .wq--head {
align-items: left;
background-color: initial !important;
border-bottom: initial !important;
color: #121212;
display: flex;
flex-direction: row;
font-size: 16px;
padding: var(--space-sm);
position: relative;
}
.wq--head {
flex: 20%;
max-width: 20%;
padding: 0 var(--space-sm);
}
.wq--body {
flex: 80%;
max-width: 80%;
padding: 0 var(--space-sm);
}
#wq-selector-detail-3 .wq--input, #wq-selector-detail-5 .wq--input, #wq-selector-detail-6 .wq--input, #wq-selector-detail-7 .wq--input {
position: absolute !important;
top: 0 !important;
}
#wq-selector-detail-3 .wq-Option, #wq-selector-detail-7 .wq-Option {
width: initial !important;
}
.wq-Attributes .wq--label {
padding: initial !important;
border-radius: initial !important;
background-color: initial !important;
border: initial !important;
}
#wq-action .wq--body {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}
}
@media (max-width: 767px) {
.wq--name {
font-size: var(--font-xs) !important;
font-weight: 700;
}
.wq-Form .wq-Checkbox > label, .wq-Form .wq-Radio > label {
font-size: var(--font-xs) !important;
font-weight: 700;
}
.wq-Form .wq-Quantity > .wq--head, .wq-Form .wq-Selector > .wq--head, .wq-Form .wq-Slider > .wq--head {
align-items: center;
background-color: initial !important;
border-bottom: initial !important;
color: #121212;
display: flex;
flex-direction: row;
font-size: 16px;
padding: var(--space-sm);
position: relative;
}
.form .wq-HNavigator {
background: var(--grey-card);
padding: 2.5rem var(--space-sm);
border-radius: var(--radius-md);
}
.form .wq-Attributes {
background: var(--grey-card);
padding: 2.5rem var(--space-md);
border-radius: var(--radius-md);
}
#wq-selector-detail-7 div.wq-Option {
flex: 33.3333333333%;
max-width: 33.3333333333%;
padding: 0 var(--space-xs);
margin-bottom: var(--space-md);
}
#wq-selector-detail-3 div.wq-Option {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-xs);
margin-bottom: var(--space-md);
}
.wq-Form .wq-TextInput.wq-size-normal, .wq-Form .wq-TextInput.wq-size-small#wq-text-tel-6 {
width: 100% !important;
}
}
#wq-selector-detail-3 .wq--media, #wq-selector-detail-5 .wq--media, #wq-selector-detail-6 .wq--media, #wq-selector-detail-7 .wq--media {
display: none !important;
}
#wq-selector-detail-3 .wq--input, #wq-selector-detail-5 .wq--input, #wq-selector-detail-6 .wq--input, #wq-selector-detail-7 .wq--input {
top: 0px !important;
}
.wq-for-unitPrice, .wq-for-quantity, .wq-for-taxClass, .wq-for-normalUnitPrice {
display: none !important;
}
@media (hover: hover), screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
.wq-Form .wq-Option > .wq--label:hover {
background-color: rgba(255, 205, 54, 0.2) !important;
}
}
.wq-Form .wq-Option > .wq--input:checked + .wq--label, .wq-Form .wq-Option > .wq--select.wq-is-selected + .wq--label　 {
background-color: rgb(255, 205, 54) !important;
}
.wq-content-empty {
display: none !important;
}
button.wq-Button.wq-type-primary.wq-belongs-action.wq-for-submit {
margin: 0 auto;
}
.wq-Form .wq-Button.wq-type-primary {
background-color: #eb4266;
color: #fff;
min-width: 180px;
padding: var(--space-lg) 40px !important;
border-radius: 40px;
font-size: var(--font-lg);
font-weight: bold;
}
.wq-Form .wq-Button.wq-type-primary:after {
font-family: "Font Awesome 5 Pro";
content: "\f054";
display: inline-block;
padding-left: var(--space-xs);
font-size: var(--font-lg);
color: #FFFFFF;
font-weight: bold;
}
@media screen and (max-width: 1390px) {
.wq-Form > :not(:last-child) {
margin-bottom: 0px !important;
}
.wq-Form .wq-Monitor > .wq--header {
background: #F3F3F3 !important;
border: solid 1px #ccc !important;
display: block !important;
font-size: var(--font-lg);
}
.wq-Form .wq-Monitor > .wq--header > .wq--title {
color: #333 !important;
font-size: var(--font-xl) !important;
font-weight: 700;
line-height: var(--lh-tight);
padding: var(--space-sm) var(--space-lg) !important;
}
.wq--head .wq--main .wq--name {
font-size: var(--font-lg) !important;
}
.wq-Attributes .wq--label {
padding: 0px;
border-radius: 0;
background-color: initial !important;
border: none !important;
}
}
@media screen and (min-width: 1400px) {
.wq-Form {
flex-direction: row;
}
.wq-Form .wq-HNavigator {
flex-grow: 1;
min-width: 0;
margin-bottom: 0;
}
.wq-Monitor {
position: sticky;
top: 0;
max-width: 260px;
}
#wq-monitor {
display: block;
width: 100%;
border: 1px solid var(--border-color);
position: fixed;
z-index: 100;
top: 55%;
right: -50px;
transform: translate(0, -50%);
margin-right: 60px;
background: #f8f7f3;
text-align: center;
border-radius: 7px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
#wq-monitor .wq-for-taxClass {
display: none;
}
#wq-monitor .wq-for-header .wq-for-category, #wq-monitor .wq-for-header .wq-for-unitPrice, #wq-monitor .wq-for-header .wq-for-quantity {
display: none;
}
#wq-monitor .wq-for-entry {
padding: var(--space-xs) 18px var(--space-xs) var(--space-sm);
flex-wrap: wrap;
}
#wq-monitor .wq-for-entry > .wq--prop {
padding: 0;
}
#wq-monitor .wq-for-entry .wq-for-category, #wq-monitor .wq-for-entry .wq-for-unitPrice, #wq-monitor .wq-for-entry .wq-for-quantity {
color: hsla(0deg, 0%, 7%, 0.6);
font-size: 12px;
line-height: var(--lh-none);
}
#wq-monitor .wq-for-entry .wq-for-entry {
flex-basis: 100%;
}
#wq-monitor .wq-for-entry .wq-for-unitPrice {
flex-grow: 8;
text-align: left;
}
#wq-monitor .wq-for-entry .wq-for-quantity {
position: relative;
flex-basis: auto;
text-align: right;
}
#wq-monitor .wq-for-entry .wq-for-quantity:before {
content: "x";
font-size: 10px;
}
#wq-monitor .wq-for-entry .wq-for-price {
flex-basis: 50%;
line-height: var(--lh-normal);
}
.wq-Form .wq-Monitor > .wq--header {
background: #F3F3F3 !important;
border: solid 1px #ccc !important;
display: block !important;
font-size: var(--font-lg);
}
.wq-Form .wq-Monitor > .wq--header > .wq--title {
color: #121212;
font-size: var(--font-lg) !important;
font-weight: 700;
line-height: var(--lh-tight);
padding: var(--space-sm) 0;
}
.wq-Monitor {
background: #fcfcfc !important;
}
.wq--label {
padding: 7px;
border-radius: var(--radius-sm);
background-color: none !important;
border: solid 1px var(--border-color) !important;
}
#wq-monitor .wq-for-entry .wq-for-entry {
flex-basis: initial;
}
.wq--prop.wq-for-entry {
font-size: 1.3rem;
}
#wq-monitor .wq-for-entry .wq-for-price {
flex-basis: 50%;
text-align: left;
line-height: var(--lh-normal);
}
}
#wq-monitor .wq--entries .wq-for-category, #wq-monitor .wq--entries .wq-for-entry {
display: flex;
}
@media screen and (min-width: 1400px) {
.wq-for-header {
display: none !important;
}
}
.wq-Form .wq-Monitor > .wq--footer > .wq--entry > .wq--prop.wq-for-value {
box-sizing: border-box;
flex: 1 1 7em;
line-height: 1.5em;
overflow: hidden;
text-align: right;
}
.wq-Form .wq-Monitor > .wq--footer > .wq--entry > .wq--prop.wq-for-value span {
display: inline-block;
height: initial;
max-height: initial;
position: initial;
}
.wq-Form .wq-Monitor > .wq--footer > .wq--entry.wq-for-total > .wq-for-value {
color: #eb4266;
font-size: var(--font-xl) !important;
}
.wq--prop.wq-for-name {
font-size: var(--font-md) !important;
}
@media screen and (max-width: 782px) {
.wq-Form #wq-selector-detail-7 .wq-Monitor > .wq--entries > .wq--entry {
padding: var(--space-sm) var(--space-sm) !important;
}
.wq-Form .wq-Monitor > .wq--entries > .wq--entry > .wq-for-entry {
flex: none !important;
}
.wq-Form .wq-Monitor > .wq--entries > .wq--entry > .wq-for-category {
flex: 1 1 31% !important;
}
}
.wq-Form #wq-selector-detail-7 .wq-Option {
align-items: stretch;
display: initial !important;
flex-wrap: nowrap;
justify-content: flex-start;
}
.wq-Form #wq-selector-detail-7 .wq-Option > .wq--label > .wq--main {
align-items: stretch;
display: initial !important;
flex-wrap: nowrap;
justify-content: flex-start;
}
@media screen and (min-width: 1400px) {
#wq-monitor .wq-for-entry .wq-for-entry {
flex-basis: initial !important;
}
.wq-Form .wq-Monitor > .wq--entries > .wq--entry > .wq-for-category {
display: block;
flex: initial !important;
order: 30;
}
.wq--prop.wq-for-entry {
margin-left: var(--space-sm);
}
.wq-Form .wq-Monitor > .wq--footer > .wq--entry > .wq--prop {
padding: var(--space-xs) var(--space-sm) !important;
}
}
@media screen and (min-width: 768px) {
.wq-Form .wq-Option > .wq--label > .wq--main > .wq--note {
font-size: 1.1rem !important;
}
}
.page-aes-naire #wq-selector-detail-1 .wq--head .wq--main .wq--name::after, .page-aes-naire #wq-selector-detail-3 .wq--head .wq--main .wq--name::after, .page-aes-naire #wq-selector-detail-7 .wq--head .wq--main .wq--name::after {
content: "必須";
font-size: var(--font-xs) !important;
line-height: 1.8rem !important;
background-color: #fff;
padding: 2px 2px;
border-radius: 4px;
border: solid 1px #de2c0c;
color: #de2c0c !important;
margin-left: var(--space-xs);
}
@media (min-width: 768px) {
.wq--head .wq--main .wq--note {
padding-right: var(--space-sm) !important;
}
}
.page-aes-hakuoshi #wq-selector-detail-1 .wq--head .wq--main .wq--name::after, .page-aes-hakuoshi #wq-selector-detail-2 .wq--head .wq--main .wq--name::after, .page-aes-hakuoshi #wq-selector-detail-3 .wq--head .wq--main .wq--name::after, .page-aes-hakuoshi #wq-selector-detail-4 .wq--head .wq--main .wq--name::after, .page-aes-hakuoshi #wq-selector-detail-7 .wq--head .wq--main .wq--name::after {
content: "必須";
font-size: var(--font-xs) !important;
line-height: 1.8rem !important;
background-color: #fff;
padding: 2px 2px;
border-radius: 4px;
border: solid 1px #de2c0c;
color: #de2c0c !important;
margin-left: var(--space-xs);
}
@media (min-width: 768px) {
.page-aes-hakuoshi .wq--main {
display: initial;
}
.page-aes-hakuoshi #wq-selector-detail-4 .wq-Option:nth-child(n+5) {
margin-top: var(--space-sm);
}
.page-aes-hakuoshi #wq-selector-detail-4 .wq-Option:nth-child(5), .page-aes-hakuoshi #wq-selector-detail-4 .wq-Option:nth-child(9) {
margin-left: 0px;
}
}
@media (max-width: 893px) {
#wq-selector-detail-1 .wq-Option {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-xs);
margin-bottom: var(--space-md);
}
.page-aes-hakuoshi #wq-selector-detail-2 .wq-Option {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-xs);
margin-bottom: var(--space-md);
}
#wq-selector-detail-4 .wq-Option {
flex: 30%;
max-width: 50%;
padding: 0 var(--space-xs);
margin-bottom: var(--space-md);
}
.wq-Form .wq-Option > .wq--label > .wq--main > .wq--note {
font-size: 12px !important;
}
.form {
padding: var(--space-md) !important;
border-radius: 0;
margin-left: calc((100vw - 100%) / 2 * -1);
margin-right: calc((100vw - 100%) / 2 * -1);
}
}
@media screen and (min-width: 768px) and (max-width: 894px) {
#wq-selector-detail-1 div.wq-Option + div.wq-Option {
margin-left: 0px !important;
}
}
@media (min-width: 768px) {
.page-aes-hakuoshi .wq-Form > :not(:last-child), .page-aes-naire .wq-Form > :not(:last-child) {
margin-bottom: 0px;
}
.page-aes-hakuoshi .form .wq-Attributes, .page-aes-naire .form .wq-Attributes {
margin-top: 0px;
}
.page-aes-hakuoshi .wq-Form .wq-Quantity > .wq--head, .page-aes-naire .wq-Form .wq-Quantity > .wq--head, .page-aes-hakuoshi .wq-Form .wq-Selector > .wq--head, .page-aes-naire .wq-Form .wq-Selector > .wq--head, .page-aes-hakuoshi .wq-Form .wq-Slider > .wq--head, .page-aes-naire .wq-Form .wq-Slider > .wq--head {
padding: 0px !important;
font-size: 14px;
font-weight: 700;
line-height: 24px;
}
}
@media (max-width: 893px) {
#wq-selector-detail-2 div.wq-Option + div.wq-Option {
margin-left: 0px !important;
}
#wq-selector-detail-4 div.wq-Option + div.wq-Option {
margin-left: 0px !important;
}
}.standard-omparison { }
.standard-omparison .cp_box *, .standard-omparison .cp_box *:before, .standard-omparison .cp_box *:after {
box-sizing: border-box;
}
.standard-omparison .cp_box {
position: relative;
}
.standard-omparison .cp_box label {
position: absolute;
z-index: 1;
bottom: 0;
width: 100%;
height: 140px; cursor: pointer;
text-align: center; background: linear-gradient(to bottom, rgba(250, 252, 252, 0) 0%, rgba(250, 252, 252, 0.95) 90%);
}
.standard-omparison .cp_box input:checked + label {
background: inherit; }
.standard-omparison .cp_box label:after {
line-height: 2.5rem;
position: absolute;
padding: 0.5em;
z-index: 2;
bottom: 20px;
left: 50%;
width: 30rem;
font-family: "Font Awesome 5 Pro";
content: "\f13a" " すべてのサイズ情報を表示する";
transform: translate(-50%, 0);
letter-spacing: 0.05em;
color: var(--text-color);
border-radius: 30px;
background-color: #f6f6f6;
border: solid 2px #aaa;
}
.standard-omparison .cp_box input {
display: none;
}
.standard-omparison .cp_box .cp_container {
overflow: hidden;
height: 750px; transition: all 0.5s;
}
.standard-omparison .cp_box input:checked + label { }
.standard-omparison .cp_box input:checked + label:after {
font-family: "Font Awesome 5 Pro";
content: "\f139" " 閉じる";
}
.standard-omparison .cp_box input:checked ~ .cp_container {
height: auto;
padding-bottom: 80px; transition: all 0.5s;
}
.mv_bk_bk {
display: block;
width: 100%;
background: url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bk_bk.png) repeat-x center;
}
.mv_bk {
display: block;
width: 100%;
background: #FFF8A8 url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bk.png) no-repeat center center;
}
.mv_bk_back {
display: block;
background: url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bana_back.png) repeat-x;
background-size: contain;
} .mv_container {
background-color: #fff8aa;
}
.mv_contents {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
align-items: center;
max-width: 1240px;
margin: 0 auto;
}
.Nav {
padding: 1em;
background: url(//original-pb.net/towel/img/info/nav_bg.png), #FDB322;
}
.Nav .towelCategoryNav {
max-width: 1240px;
}.Nav .nav_batch {
margin-top: 4px;
}.towelCategoryNav {
max-width: 1020px;
margin: 0 auto;
display: flex;
}
.towelCategoryNav > * {
width: 100%;
margin-right: var(--space-sm);
}
.towelCategoryNav > *:last-child {
margin-right: 0;
}
@media (max-width: 479px) {
.towelCategoryNav {
display: block;
padding: var(--space-sm);
}
}
@media (max-width: 479px) {
.towelCategoryNav > * {
margin-right: 0;
margin-bottom: var(--space-xs);
}
.towelCategoryNav > *:last-child {
margin-bottom: 0;
}
}
.page-standard-est .contents .main-box {
max-width: 110rem;
}
.page-template-page-est .d-md-table-cell img {
width: 100%;
}
.page-template-page-est .size-icon li {
border: 1px solid var(--loud-color);
color: var(--loud-color);
padding: 0.2rem var(--space-sm);
border-radius: 1.6rem;
font-size: 1.3rem;
font-weight: 400;
}
.page-template-page-est .size-icon li + li {
margin-left: var(--space-xs);
}
.page-template-page-est .inline-block {
text-align: center;
padding: var(--space-sm);
}
.page-template-page-est .inline-block li {
margin-bottom: 0px !important;
display: inline-block;
}
@media screen and (max-width: 640px) {
.page-template-page-est table.table-size .first {
display: none;
}
.page-template-page-est table.table-size tbody th {
width: 40%;
}
.page-template-page-est table.table-size tbody span {
padding: 0.4rem;
border-radius: 0.4rem;
margin-right: 0.8rem;
font-size: 0.8rem;
font-weight: 400;
}
.page-template-page-est .size-image-sp {
background-color: #ffffff;
text-align: center;
}
.page-template-page-est .size-image-sp .small {
line-height: 1.5rem;
}
.page-template-page-est .contents .main-box .size-image-sp h3 {
background-color: #ddd;
color: #333;
}
.page-template-page-est .thead-dark {
font-size: var(--font-xs);
line-height: 1.5rem;
}
}
@media (max-width: 767px) {
.page-template-page-est .contents .size-image-sp h3 {
font-size: var(--font-sm);
line-height: 1rem;
}
}
.page-aes-hakuoshi .form .wq-HNavigator2 {
background: var(--grey-card);
padding: var(--space-xl) var(--space-xl) var(--space-sm) var(--space-xl);
border-radius: var(--radius-md);
}
.page-aes-hakuoshi .form .wq-HNavigator2 table {
background: #fdfcfb;
}
.page-aes-hakuoshi .form .wq-HNavigator2 table th {
width: 20%;
text-align: center;
}
@media (max-width: 768px) {
.page-aes-hakuoshi .d-none {
display: none;
}
}
@media (min-width: 769px) {
.d-block {
display: none;
}
}
@media screen and (min-width: 768px) {
.page-aes-hakuoshi .wq-Form .wq-Option > .wq--label > .wq--main > .wq--note {
font-size: 0.9rem !important;
}
}
.form {
background: none;
padding: initial;
border-radius: none;
}
.form .wq-HNavigator,
.form .wq-HNavigator2 {
background: var(--grey-card);
border-radius: var(--radius-md);
padding: 2.5rem var(--space-xl);
}
.form .wq-HNavigator table,
.form .wq-HNavigator2 table {
background: #fdfcfb;
}
.form .wq-HNavigator table th,
.form .wq-HNavigator2 table th {
width: 20%;
text-align: center;
}
.form .wq-Attributes {
background: var(--grey-card);
padding: 2.5rem var(--space-xl);
border-radius: var(--radius-md);
margin-top: var(--space-lg);
margin-bottom: 0 !important;
}
.wq-Form {
background-color: initial !important;
}
.wq-Form .wq-Control {
background: #fbfaf8;
}
.wq-Form .wq-Control.wq-for-action {
order: 40;
}
.wq-Form .wq-Option,
.wq-Form .wq-Option > .wq--label > .wq--main,
.wq-Form .wq-Option > .wq--label > .wq--media,
.wq-Form .wq-Quantity > .wq--head > .wq--media,
.wq-Form .wq-Selector > .wq--body,
.wq-Form .wq-Selector > .wq--head > .wq--media,
.wq-Form .wq-Slider > .wq--head > .wq--media {
display: initial;
flex-wrap: wrap;
justify-content: flex-start;
}
.wq-Form .wq--required {
font-size: var(--font-xs) !important;
line-height: 1.8rem !important;
background-color: #fff;
padding: 1px 2px;
border-radius: 4px;
border: 1px solid #de2c0c;
color: #de2c0c !important;
}
.wq-Form .wq-Quantity,
.wq-Form .wq-Selector,
.wq-Form .wq-Slider {
border: none !important;
}
.wq-Form .wq-Button.wq-type-primary {
background-color: #eb4266;
color: #fff;
min-width: 180px;
padding: var(--space-lg) 40px !important;
border-radius: 40px;
font-size: var(--font-lg);
font-weight: bold;
}
.wq-Form .wq-Button.wq-type-primary:after {
font-family: "Font Awesome 5 Pro";
content: "\f054";
padding-left: var(--space-xs);
font-size: var(--font-lg);
color: #fff;
font-weight: bold;
}
@media (hover: hover), screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
.wq-Form .wq-Option > .wq--label:hover {
background-color: rgba(255, 205, 54, 0.2) !important;
}
}
.wq-Form .wq-Option > .wq--input:checked + .wq--label,
.wq-Form .wq-Option > .wq--select.wq-is-selected + .wq--label {
background-color: rgb(255, 205, 54) !important;
}
.wq-Form .wq-Monitor {
background: #fcfcfc !important;
}
.wq-Form .wq-Monitor > .wq--header {
background: #f3f3f3 !important;
border: 1px solid #ccc !important;
display: block !important;
font-size: var(--font-lg);
}
.wq-Form .wq-Monitor > .wq--header .wq--title {
color: #121212;
font-size: var(--font-lg) !important;
font-weight: 700;
padding: var(--space-sm) 0;
}
.wq-Form .wq-Monitor > .wq--footer .wq--entry .wq--prop.wq-for-value {
box-sizing: border-box;
flex: 1 1 7em;
text-align: right;
}
.wq-Form .wq-Monitor > .wq--footer .wq--entry .wq--prop.wq-for-value span {
display: inline-block;
height: initial;
max-height: initial;
}
.wq-Form .wq-Monitor > .wq--footer .wq--entry.wq-for-total .wq-for-value {
color: #eb4266;
font-size: var(--font-xl) !important;
}
.wq--label {
padding: 7px;
border-radius: var(--radius-sm);
background-color: #fff;
border: 1px solid var(--border-color) !important;
}
.annotation {
background: #fff;
padding: var(--space-lg) 50px;
}
.annotation dt {
margin-top: 0;
text-align: center;
font-size: var(--font-2xl);
font-weight: 600;
padding: var(--space-sm) 0;
}
.annotation .example dd {
list-style: none;
padding-left: 1.5em;
margin-left: 0.5em;
text-indent: -1em;
}
.wq-for-unitPrice,
.wq-for-quantity,
.wq-for-taxClass,
.wq-for-normalUnitPrice {
display: none !important;
}
.wq-content-empty {
display: none !important;
}
button.wq-Button.wq-type-primary.wq-belongs-action.wq-for-submit {
margin: 0 auto;
}
#wq-selector-detail-3 .wq--media,
#wq-selector-detail-5 .wq--media,
#wq-selector-detail-6 .wq--media,
#wq-selector-detail-7 .wq--media {
display: none !important;
}
#wq-selector-detail-3 .wq--input,
#wq-selector-detail-5 .wq--input,
#wq-selector-detail-6 .wq--input,
#wq-selector-detail-7 .wq--input {
top: 0 !important;
}
@media (min-width: 768px) {
.wq-Form .wq-Option + .wq-Option {
margin-left: var(--space-sm);
}
.wq-Form .wq-Quantity,
.wq-Form .wq-Selector,
.wq-Form .wq-Slider {
flex-direction: initial !important;
}
.wq-Form .wq-Quantity > .wq--head,
.wq-Form .wq-Selector > .wq--head,
.wq-Form .wq-Slider > .wq--head {
align-items: left;
background-color: initial !important;
display: flex;
flex-direction: row;
font-size: 16px;
padding: var(--space-sm);
}
.wq-Form .wq-Option > .wq--label > .wq--main > .wq--note {
font-size: 1.1rem !important;
}
.wq--head {
flex: 20%;
max-width: 20%;
padding: 0 var(--space-sm);
}
.wq--body {
flex: 80%;
max-width: 80%;
padding: 0 var(--space-sm);
}
}
@media (max-width: 767px) {
.wq--name {
font-size: var(--font-xs) !important;
font-weight: 700;
}
.wq-Form .wq-Checkbox > label,
.wq-Form .wq-Radio > label {
font-size: var(--font-xs) !important;
font-weight: 700;
}
.wq-Form .wq-TextInput.wq-size-normal,
.wq-Form .wq-TextInput.wq-size-small#wq-text-tel-6 {
width: 100% !important;
}
}
@media (min-width: 1400px) {
.wq-Form {
flex-direction: row;
}
.wq-Form .wq-HNavigator {
flex-grow: 1;
min-width: 0;
}
#wq-monitor {
position: fixed;
top: 55%;
right: -50px;
transform: translate(0, -50%);
border: 1px solid var(--border-color);
border-radius: 7px;
background: #f8f7f3;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
#wq-monitor .wq-for-header {
display: none !important;
}
}
body.post-type-archive-column, body.tax-column_cat {
counter-reset: rank_number;
}
body.post-type-archive-column .list-active, body.tax-column_cat .list-active {
background-color: #fcfcfc;
}
body.post-type-archive-column .wpp_thumb_wrapper, body.tax-column_cat .wpp_thumb_wrapper {
position: relative;
}
body.post-type-archive-column .popular-list .wpp_thumb_wrapper:after, body.tax-column_cat .popular-list .wpp_thumb_wrapper:after {
counter-increment: rank_number;
content: counter(rank_number);
position: absolute;
top: -0.125em;
left: -0.125em;
padding: 0.125em 0.5em;
color: #fff;
background: rgba(66, 66, 66, 0.85);
}
body.post-type-archive-column .popular-list .list-group li:nth-child(1) .wpp_thumb_wrapper:after, body.tax-column_cat .popular-list .list-group li:nth-child(1) .wpp_thumb_wrapper:after {
background: rgba(189, 161, 82, 0.9);
}
body.post-type-archive-column .popular-list .list-group li:nth-child(2) .wpp_thumb_wrapper:after, body.tax-column_cat .popular-list .list-group li:nth-child(2) .wpp_thumb_wrapper:after {
background: rgba(152, 153, 173, 0.9);
}
body.post-type-archive-column .popular-list .list-group li:nth-child(3) .wpp_thumb_wrapper:after, body.tax-column_cat .popular-list .list-group li:nth-child(3) .wpp_thumb_wrapper:after {
background: rgba(156, 85, 34, 0.9);
}
body.post-type-archive-column ul.list-group.list-group-flush, body.tax-column_cat ul.list-group.list-group-flush {
display: flex;
flex-wrap: wrap;
flex-flow: column;
justify-content: space-around;
}
body.post-type-archive-column a.wpp-post-title, body.tax-column_cat a.wpp-post-title {
font-size: var(--font-md);
line-height: 2rem;
font-weight: 700;
}
body.post-type-archive-column .list-group-flush > .list-group-item, body.tax-column_cat .list-group-flush > .list-group-item {
border-width: 1px;
}
body.post-type-archive-column .list-group-flush > .list-group-item:last-child, body.tax-column_cat .list-group-flush > .list-group-item:last-child {
border-bottom-width: 1px;
}
body.post-type-archive-column .list-group-item + .list-group-item, body.tax-column_cat .list-group-item + .list-group-item {
border-top-width: 0;
}
body.post-type-archive-column .list-group-item a, body.tax-column_cat .list-group-item a {
display: block;
}
body.post-type-archive-column img.attachment-yarpp-thumbnail.size-yarpp-thumbnail.wp-post-image,
body.post-type-archive-column img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image, body.tax-column_cat img.attachment-yarpp-thumbnail.size-yarpp-thumbnail.wp-post-image,
body.tax-column_cat img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
width: 70px;
height: 70px;
object-fit: cover;
}
body.post-type-archive-column .sidebar-column div, body.tax-column_cat .sidebar-column div {
text-align: left;
margin-bottom: initial;
}
body.post-type-archive-column .sidebar-column .right, body.tax-column_cat .sidebar-column .right {
font-size: var(--font-md);
line-height: 2rem;
}
body.post-type-archive-column .sidebar-column .right p, body.tax-column_cat .sidebar-column .right p {
font-weight: 700;
}
body.single-column {
counter-reset: rank_number;
}
body.single-column .wpp_thumb_wrapper {
position: relative;
}
body.single-column .popular-list .wpp_thumb_wrapper:after {
counter-increment: rank_number;
content: counter(rank_number);
position: absolute;
top: -0.125em;
left: -0.125em;
padding: 0.125em 0.5em;
color: #fff;
background: rgba(66, 66, 66, 0.85);
}
body.single-column .popular-list .list-group li:nth-child(1) .wpp_thumb_wrapper:after {
background: rgba(189, 161, 82, 0.9);
}
body.single-column .popular-list .list-group li:nth-child(2) .wpp_thumb_wrapper:after {
background: rgba(152, 153, 173, 0.9);
}
body.single-column .popular-list .list-group li:nth-child(3) .wpp_thumb_wrapper:after {
background: rgba(156, 85, 34, 0.9);
}
body.single-column ul.list-group.list-group-flush {
display: flex;
flex-wrap: wrap;
flex-flow: column;
justify-content: space-around;
}
body.single-column a.wpp-post-title {
font-size: var(--font-md);
line-height: 2rem;
font-weight: 700;
}
body.single-column .list-group-flush > .list-group-item {
border-width: 1px;
}
body.single-column .list-group-flush > .list-group-item:last-child {
border-bottom-width: 1px;
}
body.single-column .list-group-item + .list-group-item {
border-top-width: 0px;
}
body.single-column .list-group-item a {
display: block;
}
body.single-column img.attachment-yarpp-thumbnail.size-yarpp-thumbnail.wp-post-image,
body.single-column img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
width: 70px;
height: 70px;
object-fit: cover;
}
body.single-column .sidebar-column div {
text-align: left;
margin-bottom: initial;
}
body.single-column .sidebar-column .right {
font-size: var(--font-md);
line-height: 2rem;
}
body.single-column .sidebar-column .right p {
font-weight: 700;
}body.single-post {
counter-reset: rank_number;     }
body.single-post img.attachment-yarpp-thumbnail.size-yarpp-thumbnail.wp-post-image,
body.single-post img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
width: 70px;
height: 70px;
object-fit: cover;
}
body.single-post .wpp_thumb_wrapper {
position: relative;
}
body.single-post .wpp_thumb_wrapper:after {
counter-increment: rank_number;
content: counter(rank_number);
position: absolute;
top: -0.125em;
left: -0.125em;
padding: 0.125em 0.5em;
color: #fff;
background: rgba(66, 66, 66, 0.85);
}
body.single-post .popular-list .list-group li:nth-child(1) .wpp_thumb_wrapper:after {
background: rgba(189, 161, 82, 0.9);
}
body.single-post .popular-list .list-group li:nth-child(2) .wpp_thumb_wrapper:after {
background: rgba(152, 153, 173, 0.9);
}
body.single-post .popular-list .list-group li:nth-child(3) .wpp_thumb_wrapper:after {
background: rgba(156, 85, 34, 0.9);
}
body.single-post .popular-list a.wpp-post-title {
font-size: var(--font-md);
line-height: 2rem;
font-weight: 700;
}
body.single-post ul.list-group.list-group-flush {
display: flex;
flex-wrap: wrap;
flex-flow: column;
justify-content: space-around;
}
body.single-post .list-group-flush > .list-group-item {
border-width: 1px;
}
body.single-post .list-group-item + .list-group-item {
border-top-width: 0;
}
body.single-post .list-group-flush > .list-group-item:last-child {
border-bottom-width: 1px;
}
body.single-post .list-group-item a {
display: block;
}
body.single-post .sidebar-column div {
text-align: left;
margin-bottom: initial;
}
body.single-post .sidebar-column .right {
font-size: var(--font-md);
line-height: 2rem;
}
body.single-post .sidebar-column .right p {
font-weight: 700;
}
.single-product ul.carousel-img {
justify-content: space-around;
margin-top: 10ox;
padding: var(--space-xs);
}
.single-product #lineup ul.carousel-img li {
width: 25%;
padding: initial !important;
}
.single-product .single #lineup .card .card-body h3 {
margin: 0rem !important;
padding: 0rem var(--space-xs) !important;
border-bottom: none !important;
background-color: initial !important;
font-size: initial !important;
line-height: 2rem;
}
@media (max-width: 767px) {
.single-product .single #lineup .card .card-body span.small {
font-size: var(--font-xs) !important;
}
.single-product .single-product #orderguide div.row {
padding: 1.4rem 0;
}
}
.single-product .product-price .price {
color: #FF3456;
font-size: 20px;
font-weight: bold;
}
.single-product .product-price span.big {
font-size: 30px;
}
.single-product .product-price span.middle {
font-size: 30px;
}
.single-product table.product-info th,
.single-product table.product-info td {
font-size: var(--font-md);
}
@media (max-width: 767px) {
.single-product .unit-price {
font-size: var(--font-xl);
color: red;
font-weight: 700;
}
.single-product .unit-price-tax,
.single-product .unit-price-yen {
font-size: var(--font-sm);
color: red;
font-weight: 700;
}
.single-product .product-price .price {
color: #ff3456;
font-size: 20px;
font-weight: 700;
}
.single-product .product-price span.big {
font-size: 2.2rem;
}
.single-product .product-price span.middle {
font-size: var(--font-lg);
}
.single-product table.product-info th {
width: 35% !important;
}
}
.page-cost h1.cost:before {
content: "";
width: 0.7rem;
height: 4rem;
border-radius: var(--radius-sm);
background: var(--loud-color);
position: absolute;
left: 0;
top: 0;
}
.page-cost h1.cost {
font-size: 2.5rem;
line-height: 4rem;
padding-left: 2.5rem;
position: relative;
border-bottom: none;
}
.page-draft-full #target .card {
padding: var(--space-lg);
}
@media (min-width: 768px) {
.page-onepoint .onepoint-thumbnail ul li img {
border: solid 2px #cfcfcf;
width: 40px !important;
height: auto;
}
}
.mv_bk_bk {
display: block;
width: 100%;
background: url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bk_bk.png) repeat-x center;
}
.mv_bk {
display: block;
width: 100%;
background: #fff8a8 url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bk.png) no-repeat center center;
}
.mv_bk_back {
display: block;
background: url(https://original-pb.net/wp-content/themes/original_pb2023/img/mv_bana_back.png) repeat-x;
background-size: contain;
}
.mv_container {
background-color: #fff8aa;
}
.mv_container .mv_contents {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
align-items: center;
max-width: 1240px;
margin: 0 auto;
}
.Nav {
padding: 1em;
background: url(//original-pb.net/towel/img/info/nav_bg.png), #fdb322;
}
.Nav .towelCategoryNav {
max-width: 1240px;
}.Nav .nav_batch {
margin-top: 4px;
}.towelCategoryNav {
max-width: 1020px;
margin: 0 auto;
display: flex;
}
.towelCategoryNav > * {
width: 100%;
margin-right: var(--space-sm);
}
.towelCategoryNav > *:last-child {
margin-right: 0;
}
@media (max-width: 479px) {
.towelCategoryNav {
display: block;
padding: var(--space-sm);
}
.towelCategoryNav > * {
margin-right: 0;
margin-bottom: var(--space-xs);
}
.towelCategoryNav > *:last-child {
margin-bottom: 0;
}
}
.page-template-list .read {
padding: 4.5rem 0 0 0;
}
.page-template-list .read .main-box {
width: 100%;
max-width: 100rem;
margin: 0 auto;
}
.page-template-list .contents .main-box {
max-width: 100rem;
}
.page-template-list .contents .main-box h3 {
font-size: 18px;
padding: 0rem;
margin-bottom: 0;
line-height: 2.5rem;
background: none;
}.page-template-list .contents .head-box {
text-align: center;
margin-bottom: var(--space-xl);
}
.page-template-list .contents .head-box h2 {
display: inline-block;
text-align: center;
padding: var(--space-xs);
border-bottom: 5px solid var(--loud-color);
border-radius: 2px;
}
@media only screen and (min-width: 601px) {
.page-template-list .contents .head-box h2 {
font-size: 2.5rem;
line-height: 3.5rem;
}
}
@media only screen and (max-width: 600px) {
.page-template-list .contents .head-box h2 {
font-size: 1.5rem;
line-height: 2.5rem;
}
}
.page-template-list .contents .head-box h2::before {
background: none;
}
.single-product .read {
padding: 4.5rem 0 0 0;
}
.single-product .read .main-box {
width: 100%;
max-width: 100rem;
margin: 0 auto;
}
.single-product .contents {
padding: 6rem 0;
}
.single-product .contents .main-box {
max-width: 100rem;
}
.single-product .contents .head-box {
text-align: center;
margin-bottom: var(--space-xl);
}
.single-product .contents .head-box h2 {
display: inline-block;
font-size: 2.5rem;
line-height: 3.5rem;
text-align: center;
padding: var(--space-xs);
border-bottom: 5px solid var(--loud-color);
border-radius: 2px;
}
.single-product .contents .head-box h2::before {
background: none;
}
.page-template-list .page-title__main {
text-align: center;
padding: var(--space-xl);
}
.page-template-list .read {
padding: 4.5rem 0 0 0;
}
.page-template-list .read .main-box {
width: 100%;
max-width: 100rem;
margin: 0 auto;
}
.page-template-list .contents .main-box {
max-width: 100rem;
}
.page-template-list .contents .head-box {
text-align: center;
margin-bottom: var(--space-xl);
}
.page-template-list .contents .head-box h2 {
display: inline-block;
text-align: center;
padding: var(--space-xs);
border-bottom: 5px solid var(--loud-color);
border-radius: 2px;
}
@media only screen and (min-width: 601px) {
.page-template-list .contents .head-box h2 {
font-size: 2.5rem;
line-height: 3.5rem;
}
}
@media only screen and (max-width: 600px) {
.page-template-list .contents .head-box h2 {
font-size: var(--font-xl);
line-height: 2.8rem;
background: none;
border-top: none;
}
}
.page-template-list .contents .head-box h2::before {
background: none;
}@media only screen and (max-width: 600px) {}@media only screen and (max-width: 600px) {}#jquery-form input[type=radio] {
position: relative;
margin-right: var(--space-xs);
}
#jquery-form .check {
padding: var(--space-xs);
text-align: center;
border-radius: var(--radius-sm);
background-color: #FFFFFF;
border: solid 1px #CDCDCD;
margin-bottom: var(--space-sm);
}.list_icon .icon-left {
position: absolute;
}
.list_icon .icon-left .category .category-name {
font-weight: bold;
text-shadow: white 1px 1px 0, white -1px -1px 0, white -1px 1px 0, white 1px -1px 0, white 0px 1px 0, white -1px 0, white -1px 0 0, white 1px 0 0;
}
.list_icon .icon-left .category .category-name.category-quick {
color: #FE004F;
}
.list_icon .icon-left .category .category-name.category-standard {
color: #51B82C;
}
.list_icon .icon-left .category .category-name.category-onepoint {
color: #369AB7;
}
.list_icon .icon-left .category .category-name.category-flexo {
color: #BA192E;
}
.list_icon .icon-right {
position: absolute;
right: 15px;
width: 17%;
}
.list_icon .icon-right .material {
background: #999;
border: 1px solid #777;
border-radius: var(--radius-sm);
padding: var(--space-xs) 0;
text-align: center;
line-height: 1.2 !important;
}
.list_icon .icon-right .material .material-name {
color: #fff;
font-size: 12px;
font-weight: bold;
}
.list_icon .icon-right .material .material-name.material-opp, .list_icon .icon-right .material .material-name.material-nashiji, .list_icon .icon-right .material .material-name.material-ldpe {
font-size: 14px;
}
.list_icon .icon-right .print {
margin-top: var(--space-xs);
}
.list_icon .icon-right .print .print-1, .list_icon .icon-right .print .print-4 {
color: #fff;
font-weight: bold;
border-radius: var(--radius-sm);
padding: var(--space-xs) 0;
text-align: center;
line-height: 1.2 !important;
}
.list_icon .icon-right .print .print-1 {
border: 1px solid #389bb9;
background: #30b4d0;
}
.list_icon .icon-right .print .print-4 {
border: 1px solid #aaa;
background: #ff5654;
background: -moz-linear-gradient(left, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
background: -webkit-linear-gradient(left, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
background: linear-gradient(to right, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e4ca07", endColorstr="#29a1d8",GradientType=1 );
}
.list_icon .icon-right .print .print_color {
margin-top: var(--space-xs);
font-size: 10px;
line-height: 1.1 !important;
}.product_info .slick-slide .color img {
display: inline;
}
.product_info .price {
color: #FF3456;
font-size: 20px;
font-weight: bold;
}
.product_info .price strong {
font-size: 20px;
}
.product_info label {
font-size: 14px;
}.slick-prev, .slick-next {
top: 35%;
z-index: 1;
}#suggest {
position: absolute;
background-color: #FFFFFF;
border: 1px solid #CCCCFF;
font-size: 90%;
width: 200px;
}
#suggest div {
display: block;
width: 200px;
overflow: hidden;
white-space: nowrap;
}
#suggest div.select { color: #FFFFFF;
background-color: #3366FF;
}
#suggest div.over { background-color: #99CCFF;
}
.lastChild label {
display: inline-block;
padding: 11px var(--space-lg);
background: #f2dede;
border: 1px solid #ddd;
font-size: 100%;
border-radius: 4px;
box-shadow: 1px 0px 8px 1px rgba(0, 0, 0, 0.1);
}
input[type=checkbox] {
margin: var(--space-xs) var(--space-xs) 0px 0px;
line-height: normal;
}.tooltip {
padding: var(--space-sm) !important;
}
.list-group-item > .badge {
margin-top: var(--space-xs);
}@media screen and (max-width: 714px) {}#sidebar a {
font-size: 14px;
}
@media only screen and (max-width: 760px) {  #jquery-form .check {
font-size: 11px;
}}.list_icon .icon-left {
position: absolute;
}
.list_icon .icon-left .category .category-name {
font-weight: bold;
text-shadow: white 1px 1px 0, white -1px -1px 0, white -1px 1px 0, white 1px -1px 0, white 0px 1px 0, white -1px 0, white -1px 0 0, white 1px 0 0; }
.list_icon .icon-left .category .category-name.category-standard {
color: #51B82C;
}
.list_icon .icon-left .category .category-name.category-onepoint {
color: #369AB7;
}
.list_icon .icon-right {
position: absolute;
right: 15px;
width: 20%;
}
.list_icon .icon-right .material {
background: #999;
border: 1px solid #777;
border-radius: var(--radius-sm);
padding: var(--space-xs) 0;
text-align: center;
line-height: 1.2 !important;
}
.list_icon .icon-right .material .material-name {
color: #fff;
font-size: 12px;
font-weight: bold;
}
.list_icon .icon-right .material .material-name.material-opp, .list_icon .icon-right .material .material-name.material-nashiji, .list_icon .icon-right .material .material-name.material-ldpe {
font-size: 14px;
}
.list_icon .icon-right .print {
margin-top: var(--space-xs);
}
.list_icon .icon-right .print .print-1, .list_icon .icon-right .print .print-4 {
color: #fff;
font-weight: bold;
border-radius: var(--radius-sm);
padding: var(--space-xs) 0;
text-align: center;
line-height: 1.2 !important;
}
.list_icon .icon-right .print .print-1 {
border: 1px solid #389bb9;
background: #30b4d0;
}
.list_icon .icon-right .print .print-4 {
border: 1px solid #aaa;
background: #ff5654;
background: -moz-linear-gradient(left, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
background: -webkit-linear-gradient(left, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
background: linear-gradient(to right, #ff5654 5%, #e4ca07 45%, #29a1d8 75%, #52b152 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e4ca07", endColorstr="#29a1d8",GradientType=1 );
}
.list_icon .icon-right .print .print_color {
margin-top: var(--space-xs);
font-size: 10px;
line-height: 1.1 !important;
}@media only screen and (max-width: 600px) {}
.list_icon {
flex: 1 1 auto;
padding: 0 1.25rem;
}.product_info .slick-slide .color img {
display: inline;
}
.product_info .price {
color: #FF3456;
font-size: 20px;
font-weight: bold;
}
.product_info .price strong {
font-size: 20px;
}
.product_info label {
font-size: 14px;
}.slick-prev, .slick-next {
top: 35%;
z-index: 1;
} #suggest {
position: absolute;
background-color: #FFFFFF;
border: 1px solid #CCCCFF;
font-size: 90%;
width: 200px;
}
#suggest div {
display: block;
width: 200px;
overflow: hidden;
white-space: nowrap;
}
#suggest div.select { color: #FFFFFF;
background-color: #3366FF;
}
#suggest div.over { background-color: #99CCFF;
} .lastChild label {
display: inline-block;
padding: 11px var(--space-lg);
background: #f2dede;
border: 1px solid #ddd;
font-size: 100%;
border-radius: 4px;
box-shadow: 1px 0px 8px 1px rgba(0, 0, 0, 0.1);
}
input[type=checkbox] {
margin: var(--space-xs) var(--space-xs) 0px 0px;
line-height: normal;
}.tooltip {
padding: var(--space-sm) !important;
}
.list-group-item > .badge {
margin-top: var(--space-xs);
}@media screen and (max-width: 714px) {}#sidebar a {
font-size: 14px;
}@media only screen and (max-width: 760px) {
#jquery-form .check {
font-size: 11px;
}
} .archive-contents {
padding: 4.5rem 0;
& .contents {
padding: var(--space-xl) 0;
}
& .head-box h2 {
font-size: 3rem;
line-height: 4rem;
position: relative;
display: block;
text-align: left;
padding: 0 0 0 var(--space-xl);
border-bottom: none;
&::before {
content: "";
width: 0.7rem;
height: 4rem;
border-radius: var(--radius-sm);
background: #F38F00;
position: absolute;
left: 0;
top: 0;
}
}
& .main-box {
max-width: 87.5rem;
}
}
.single .card {
& .card-title h1 {
background-color: var(--grey-sub);
font-size: 4rem;
line-height: 6rem;
padding: var(--space-xl) 5rem;
}
& h2 {
font-size: 3rem;
line-height: 4rem;
margin: 2.5rem 0;
padding-left: var(--space-xl);
position: relative;
&::before {
content: "";
width: 0.7rem;
height: 4rem;
border-radius: var(--radius-sm);
background: #F38F00;
position: absolute;
left: 0;
top: 0;
}
}
& .card-body {
padding: var(--space-xl) 5rem;
& h3 {
padding: 1.7rem 0;
margin: var(--space-xl) 0 var(--space-md);
border-bottom: 4px solid var(--loud-color);
font-size: var(--font-2xl);
}
& h4 {
margin-top: var(--space-xl);
background: #eee;
padding: var(--space-sm) var(--space-md);
border-radius: var(--radius-sm);
line-height: 3rem;
}
& .card-text {
margin-top: var(--space-lg);
}
& section {
margin-bottom: var(--space-xl);
}
}
} .post-type-archive-column .main-box ul li {
margin-bottom: var(--space-xl);
& dt {
margin-top: var(--space-sm);
}
}
.single-column .card .the_content {
& img {
margin: var(--space-lg) auto;
display: block;
max-width: 100%;
height: auto;
padding: 0.4rem;
line-height: var(--lh-normal);
background-color: #fff;
border: 1px solid var(--border-color);
border-radius: 4px;
transition: all 0.2s ease-in-out;
&.aligncenter {
display: block;
margin: var(--space-sm) auto;
}
}
& p {
line-height: 2;
}
& h2 {
border-top: 0.5rem double var(--loud-color);
border-bottom: 0.5rem double var(--loud-color);
font-size: 2.2rem;
margin-top: 6rem;
margin-bottom: var(--space-lg);
padding: var(--space-md) var(--space-sm);
font-weight: 700;
line-height: var(--lh-normal);
padding-left: 0;
&::before {
background: none !important;
}
}
& dl {
padding: var(--space-lg) var(--space-lg) 0;
line-height: 1.9;
border: 1px solid #ccc !important;
box-shadow: 0 3px 0 rgba(8, 1, 2, 0.03);
font-size: 16px;
margin: 35px var(--space-lg);
& dt {
background: #fff;
padding: 0 var(--space-sm);
font-weight: bold;
position: relative;
top: -30px;
width: max-content;
}
& dd {
position: relative;
top: -25px;
padding: var(--space-md) var(--space-sm) 0;
line-height: var(--lh-relaxed);
}
&.point {
padding: var(--space-lg) var(--space-lg) var(--space-sm);
background-color: var(--grey-1);
border: none !important;
border-radius: 4px;
& dt {
padding-left: var(--space-xl);
position: relative;
top: 0px;
background: none;
&:before {
position: absolute;
top: auto;
left: 10px;
display: block;
width: 10px;
height: 10px;
content: "\f005";
font-family: FontAwesome;
}
}
& dd {
position: relative;
top: -5px;
}
}
}
& .panel {
padding: 0 !important;
margin: var(--space-lg) var(--space-lg);
border-color: #ccc !important;
box-shadow: 0 3px 0 rgba(8, 1, 2, 0.03);
& .panel-body {
padding: var(--space-md);
}
& .panel-footer {
border: 1px solid #ccc !important;
}
& table {
width: -webkit-fill-available;
margin: 0 var(--space-xs) var(--space-xs) var(--space-xs);
}
& p {
margin: var(--space-sm) 0;
}
& img {
border-radius: 4px;
padding: 0;
border: 0;
margin: 0 auto;
display: block;
}
& .table > tbody > tr > td,
& .table > tbody > tr > th,
& .table > tfoot > tr > td,
& .table > tfoot > tr > th,
& .table > thead > tr > td,
& .table > thead > tr > th {
border-top: none;
border-bottom: 1px solid #ddd;
}
}
& pre {
line-height: var(--lh-relaxed);
margin: var(--space-lg);
padding: var(--space-lg) var(--space-xl);
}
& blockquote {
margin-top: var(--space-lg);
line-height: var(--lh-relaxed);
margin-left: var(--space-lg);
& p {
margin: 0;
}
}
& table {
width: -webkit-fill-available;
margin: var(--space-lg);
}
& ul {
line-height: var(--lh-relaxed);
margin: var(--space-lg) var(--space-sm) var(--space-lg) var(--space-md);
&.list-group {
margin: 0 var(--space-lg);
}
&.check {
list-style-type: none;
position: relative;
& li:before {
position: absolute;
top: auto;
left: 20px;
display: block;
line-height: 1.8;
width: 10px;
height: 10px;
content: "\f046";
font-family: FontAwesome;
}
}
}
& ol li {
line-height: var(--lh-relaxed);
}
& iframe {
display: block;
margin: var(--space-lg) auto;
}
& a {
color: var(--link-color);
text-decoration: underline;
&.btn {
text-decoration: none !important;
margin: var(--space-sm) 0;
}
&:visited {
color: var(--link-color);
}
&:hover {
color: #666;
cursor: pointer;
}
}
& hr {
border-color: #ccc !important;
}
}
.single-column .card .column-box {
padding-bottom: 0;
& ul {
margin-bottom: 0;
}
}
@media screen and (min-width: 750px) {
#cta_btn {
display: none;
}
}@media screen and (max-width: 1630px) {
.sidenav .tel img {
height: auto;
width: 75px;
}
.sidenav ul.sidenav-menu li {
height: 60px;
width: 75px;
font-size: 1.3rem;
}
.sidenav ul.sidenav-menu li span, .sidenav ul.sidenav-menu li br {
display: none;
}
.sidenav ul.sidenav-menu li.sidenav-sample br {
display: inline-block;
}
.sidenav ul.sidenav-menu li.sidenav-sample img {
display: none;
}
}
@media screen and (max-width: 1535px) {
.sidenav {
display: none !important;
}
.sidenav.is_active {
display: none !important;
}
}
@media screen and (max-width: 1290px) {}
@media screen and (max-width: 1274px) {
.main-nav > ul > li {
padding: var(--space-xs) var(--space-md);
background: none !important;
}
}
@media screen and (max-width: 1096px) {
header .header__main--left {
width: 20rem;
}
header .header__main--left img {
height: 60px;
}
header .header__main .main-nav > ul {
display: flex;
align-items: center;
}
header .header__main .main-nav > ul > li .sm {
font-size: var(--font-sm);
}
header .header__main .main-nav > ul > li .lg {
font-size: var(--font-md);
line-height: 1.6rem;
}
.sub-menu.is_active {
top: 9rem;
}
}
@media (min-width: 992px) {
.sp {
display: none;
}
.pc {
display: block;
}
.lineup-sp {
display: none;
}
.footer__list .row .items {
flex: 0 0 20%;
max-width: 20%;
}
} @media (max-width: 991px) {  .flex-tab-30 {
flex: 30%;
max-width: 30%;
padding: 0 var(--space-sm);
}  .flex-tab-70 {
flex: 70%;
max-width: 70%;
padding: 0 var(--space-sm);
}  .flex-tab-100 {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}  .col-tab-3 {
flex: 33.3333333333%;
max-width: 33.3333333333%;
padding: 0 var(--space-sm);
}  .pa0 {
padding: 0px !important;
}  .sp {
display: block;
}
.pc {
display: none;
}
.lineup-sp {
display: none;
}
.side-contents {
display: none;
}
.contents-wrap > article.container {
padding-right: 0;
padding-left: 0;
}
.page-title .container {
padding-right: 0;
padding-left: 0;
}
.header {
background: #fff;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
}
.header .logo {
background: var(--loud-color);
padding: 0;
}
.header .logo img {
width: initial !important;
max-width: 100% !important;
vertical-align: text-top;
}
.header .head-sp {
padding: 0;
font-size: var(--font-sm);
}
.header .head-sp ul {
display: flex;
justify-content: space-between;
height: 100%;
}
.header .head-sp ul li {
padding: var(--space-sm) 0;
text-align: center;
border-right: 1px solid #dddddd;
display: flex;
align-items: center;
justify-content: center;
}
.header .head-sp ul li a {
display: block;
line-height: var(--lh-none);
}
.header .head-sp ul li i {
display: block;
margin: 0 auto var(--space-xs);
}
.header .head-sp__phone i {
content: url(//original-pb.net/wp-content/themes/original-pb/img/common/icon-phone.webp);
}
.header .head-sp__estimate i {
content: url(//original-pb.net/wp-content/themes/original-pb/img/common/icon-estimate.webp);
}
.header .head-sp__company i {
content: url(//original-pb.net/wp-content/themes/original-pb/img/common/icon-company.webp);
}
.header .head-sp .hamburger {
padding: 1.4rem 0;
color: var(--link-color);
position: relative;
}
.header .head-sp .hamburger span {
position: relative;
top: 2rem;
}
.header .head-sp .hamburger-inner,
.header .head-sp .hamburger-inner::before,
.header .head-sp .hamburger-inner::after {
background-color: var(--loud-color);
width: 3rem;
height: 0.3rem;
}
.header .head-sp .hamburger-inner {
top: 40%;
}
.sub-menu.is_active {
display: none;
}
.contents-wrap {
padding: 0;
}  .plan-box .card .plan-box .card .card-title {
font-size: var(--font-2xl);
line-height: 2rem;
}
.plan-box .card dl dt {
font-size: var(--font-sm);
line-height: 2.2rem;
}
.plan-box .card a::after {
display: none;
}
.plan-box .card .popup {
display: none;
}  .page-onepoint .read {
padding: 0;
}
.sub-menu .container {
padding: 0;
}
.sub-menu ul {
flex-wrap: wrap;
}
.sub-menu ul li {
width: 50%;
border: 1px solid #fff;
}
.sub-menu.sub-menu-onepoint ul li {
width: 100%;
}
.sub-menu.sub-menu-onepoint ul li:nth-child(2), .sub-menu.sub-menu-onepoint ul li:nth-child(3), .sub-menu.sub-menu-onepoint ul li:nth-child(4), .sub-menu.sub-menu-onepoint ul li:nth-child(5) {
width: 50%;
}  .footer {
padding-top: 0;
}
.footer__list .container {
padding-right: var(--space-md);
padding-left: var(--space-md);
}
} .sp-fixed-cta {
display: none;
} @media (max-width: 767px) {  .flex-sp-20 {
flex: 20%;
max-width: 20%;
padding: 0 var(--space-sm);
}  .flex-sp-40 {
flex: 40%;
max-width: 40%;
padding: 0 var(--space-sm);
}
.flex-sp-50 {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-sm);
}
.flex-sp-60 {
flex: 60%;
max-width: 60%;
padding: 0 var(--space-sm);
}  .flex-sp-80 {
flex: 80%;
max-width: 80%;
padding: 0 var(--space-sm);
}  .flex-sp-100 {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}
.col-sp-1 {
flex: 100%;
max-width: 100%;
padding: 0 var(--space-sm);
}
.col-sp-2 {
flex: 50%;
max-width: 50%;
padding: 0 var(--space-sm);
}
.col-sp-3 {
flex: 33.3333333333%;
max-width: 33.3333333333%;
padding: 0 var(--space-sm);
}  .pa0 {
padding: 0px !important;
}  .mb-sp-10 {
margin-bottom: var(--space-sm) !important;
} .lineup-pc {
display: none;
}
.lineup-sp {
display: block;
}  body {
font-size: var(--font-md);
}
h1 {
font-size: var(--font-2xl);
}
.page-cost h1.cost {
font-size: 1.5rem;
line-height: 2.4rem;
padding-left: 1.5rem;
}
.page-cost h1.cost:before {
height: 2.4rem;
}
header .header {
border-bottom: 0.1rem solid var(--loud-color);
}
header .header .head-sp {
font-size: 1.1rem;
}
header .header .head-sp ul li {
padding: 0;
}
header .header .head-sp i {
height: 2rem;
width: auto;
}
header .header .head-sp .hamburger span {
top: 1.3rem;
}
header .header .head-sp .hamburger-inner,
header .header .head-sp .hamburger-inner::before,
header .header .head-sp .hamburger-inner::after {
width: 2rem;
height: 0.2rem;
}
header .header .head-sp .hamburger-inner {
top: 35%;
}
.banner .container {
padding: 0;
}
.footer .row {
margin-right: -15px;
margin-left: -15px;
}
.footer .row .items a {
font-size: var(--font-md);
}
.footer .row .items a img {
margin-right: var(--space-sm);
max-width: 3.5rem;
}
.footer .copyright {
padding: var(--space-xs) var(--space-md);
text-align: center;
}
.footer .copyright p {
font-size: var(--font-sm);
font-weight: 400;
}
.main-breadcrumb {
display: block;
}  .plan-box {
padding: 0 !important;
margin-bottom: 0;
background: #fff;
}
.plan-box .container {
padding-right: var(--space-sm);
padding-left: var(--space-sm);
}
.plan-box .head-box {
margin-bottom: 0;
}
.plan-box li {
border-top: 0.1rem var(--border-color) solid;
border-bottom: 0.1rem var(--border-color) solid;
padding: 0;
}
.plan-box li .card {
margin-bottom: 0;
border-radius: 0;
border: none;
}
.plan-box li .card img {
margin: 0;
}
.plan-box li .card a {
color: var(--text-color);
}
.plan-box li .card .row div:nth-child(2) {
padding-top: 0;
}
.plan-box li .card .card-title {
font-size: var(--font-xl);
color: var(--loud-color);
margin-bottom: 0;
line-height: var(--lh-tight);
text-align: left;
}
.plan-box li .card .popup {
display: none;
}
.plan-box li .card dl dt {
text-align: left;
margin-bottom: var(--space-xs);
}
.plan-box li .card dl dt span {
font-size: 1.3rem;
}
.plan-box li .card dl dd {
line-height: var(--lh-none);
}  .sub-menu .container {
padding: 0;
}
.sub-menu ul li a {
line-height: 1.5rem;
font-size: var(--font-md);
}
body .container .more,
body .container .more:visited {
display: block;
font-size: var(--font-md);
}
body .container .more + .more,
body .container .more:visited + .more {
margin: var(--space-sm) 0 0 0;
}  .page-end-box .card p {
margin-bottom: var(--space-lg);
}
.page-end-box .card .card-header {
font-size: var(--font-2xl);
}
.pickup-box .main-box ul li {
padding-bottom: var(--space-sm);
}
.pickup-box .main-box ul li p {
display: none;
}
.pickup-box .main-box ul li h3 {
line-height: 2rem;
font-size: var(--font-sm);
}
table.table-price td {
font-size: 1.5rem;
padding: 0.75rem;
}
.strength-box .card {
display: none;
}
.page-orderguide .contents .main-box ul li p {
margin: 0;
}
.page-orderguide .contents .main-box ul li .row p {
padding-left: 0;
}
.archive-contents .head-box h2 {
display: block;
font-size: var(--font-2xl);
line-height: 2.7rem;
padding-left: var(--space-lg);
text-align: left;
}
.archive-contents .head-box h2::before {
height: 2.5rem;
}
.contents .head-box h2 {
font-size: var(--font-xl);
line-height: 2.7rem;
padding-left: var(--space-lg);
}
.contents .head-box h2::before {
height: 2.7rem;
}
.scene-link h4 {
font-size: var(--font-xl);
}
.single .card-body-blog-single h2 {
font-size: var(--font-xl);
}
.scene-rerca .card .card-body .row p {
text-align: center;
}
.scene-specification h1, .scene-specification h2 {
font-size: var(--font-xl);
}
.scene-specification h1 img, .scene-specification h2 img {
width: 2rem;
}
.scene-specification dl {
font-size: 1.5rem;
}
input.more {
margin: var(--space-sm) auto;
}
.page-draft ul.draft-btn li {
margin: var(--space-md) 0;
}
.page-draft ul.draft-btn li .more, .page-draft ul.draft-btn li body .container .more:visited {
line-height: inherit;
padding: var(--space-sm) var(--space-lg) !important;
border-radius: var(--radius-md);
}  .table-responsive {
display: block;
width: 95vw;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive > .table-bordered {
border: 0;
}
.form {
padding: 2.5rem;
border-radius: 0;
margin-left: calc((100vw - 100%) / 2 * -1);
margin-right: calc((100vw - 100%) / 2 * -1);
}
.form .form-group {
border-bottom: 1px #ccc dotted;
}  .form .form-group .control-label {
padding: var(--space-sm) 0 var(--space-sm) var(--space-sm) !important;
font-weight: 700;
}
.single .card .card-title h1 {
font-size: var(--font-2xl);
line-height: 3rem;
padding: var(--space-md) 2.5rem;
}
.single .card h2 {
display: block;
font-size: var(--font-xl);
line-height: 2.5rem;
padding: var(--space-md) 2.5rem;
text-align: left;
background: #f6f6f6;
border-top: 0.5rem var(--border-color) solid;
border-bottom: 0.1rem var(--border-color) solid;
}
.single .card h2::before {
display: none;
}
.single .card .card-body {
padding: var(--space-md) 2.5rem;
}
.single .card .card-body h3 {
padding: 1.7rem 0 var(--space-sm) 0;
}
.single.single-column .card .the_content h2 {
background: #fff;
} .lineup-sp {
background: #f5f4ef;
border-radius: 12px;
padding: 16px 12px;
max-width: 400px;
margin: 0 auto;
}
.lineup-sp__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
}
.lineup-card {
background: #fff;
border: 2px solid var(--border-color);
border-radius: 12px;
padding: 12px 10px;
position: relative;
text-align: center;
box-sizing: border-box;
}
.lineup-card--standard { border-color: #a0faff; }
.lineup-card--naire    { border-color: #fff284; }
.lineup-card--hakuoshi { border-color: #ffc584; }
.lineup-card--full     { border-color: #b3ff9d; }
.lineup-card__badge {
position: absolute;
top: -10px;
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
background: #a0faff;
color: #0a6166;
font-size: 11px;
font-weight: 700;
padding: 2px 10px;
border-radius: 8px;
}
.lineup-card__name {
min-height: 44px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 6px;
}
.lineup-card__pre {
font-size: 11px;
font-weight: 400;
color: #5f5e5a;
line-height: 1.2;
}
.lineup-card__name-main {
font-size: 14px;
font-weight: 700;
line-height: 1.4;
color: var(--text-color);
}
.lineup-card__img {
margin: 6px 0 8px;
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
background: #f5f4ef;
border-radius: 8px;
display: block;
}
.lineup-card__catch {
font-size: 11px;
color: #5f5e5a;
margin: 0 0 8px;
line-height: 1.4;
}
.lineup-card__price {
display: flex;
align-items: baseline;
justify-content: center;
gap: 2px;
margin-bottom: 8px;
}
.lineup-card__price-num {
font-size: 24px;
font-weight: 700;
color: var(--text-color);
}
.lineup-card__price-num--sm { font-size: 17px; }
.lineup-card__price-unit {
font-size: 11px;
color: #5f5e5a;
}
.lineup-card__spec {
font-size: 11px;
color: #5f5e5a;
line-height: 1.7;
margin-bottom: 10px;
}
.lineup-card__spec strong {
color: var(--text-color);
font-weight: 700;
}
.lineup-card__btn,
.lineup-card__btn:visited {
display: block;
width: 100%;
background: var(--text-color);
color: #fff;
text-decoration: none;
border: none;
border-radius: 8px;
padding: 9px;
font-size: 13px;
text-align: center;
box-sizing: border-box;
}
.towelCategoryNav {
display: none;
} .sp-fixed-cta {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 98;
padding: 10px var(--space-sm) calc(16px + env(safe-area-inset-bottom, 0px));
background: rgba(240, 240, 240, 0.92);
box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
display: none;
text-align: center;
}
.sp-fixed-cta__btn {
display: block;
position: relative;
padding: 2.4rem 2rem 1.2rem;
margin-top: 10px;
background: #e94919;
color: #fff;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: 0.1em;
line-height: 1.5;
border-radius: 0.5rem;
text-decoration: none;
box-shadow: 0 5px 0 #d44114;
}
.sp-fixed-cta__btn:visited,
.sp-fixed-cta__btn:hover {
color: #fff;
}
.sp-fixed-cta__btn:active {
color: #fff;
transform: translateY(3px);
box-shadow: 0 2px 0 #d44114;
}
.sp-fixed-cta__btn i {
margin-right: 0.5rem;
}
.sp-fixed-cta__badge {
position: absolute;
top: -10px;
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
display: block;
font-size: 1.2rem;
padding: 0.2rem 1.5rem;
color: #d44114;
background: #fff;
border: 2px solid #d44114;
border-radius: 100vh;
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
}
.sp-fixed-cta__badge::before,
.sp-fixed-cta__badge::after {
content: "";
position: absolute;
left: calc(50% - 6px);
}
.sp-fixed-cta__badge::before {
bottom: -8px;
border-width: 8px 6px 0 6px;
border-style: solid;
border-color: #d44114 transparent transparent transparent;
}
.sp-fixed-cta__badge::after {
bottom: -5px;
border-width: 8px 6px 0 6px;
border-style: solid;
border-color: #fff transparent transparent transparent;
}
.sp-fixed-cta.is_active ~ .page_top {
bottom: 100px;
}
}.archive-contents dt {
font-size: var(--font-md);
line-height: 1.8rem;
}
.archive-contents dd {
font-size: var(--font-sm);
} body {
counter-reset: rank_number;
}
.wpp_thumb_wrapper {
position: relative;
}
.popular-list .wpp_thumb_wrapper::after {
counter-increment: rank_number;
content: counter(rank_number);
position: absolute;
top: -0.125em;
left: -0.125em;
padding: 0.125em 0.5em;
color: #fff;
background: rgba(66, 66, 66, 0.85);
}
.popular-list .list-group li:nth-child(1) .wpp_thumb_wrapper::after {
background: rgba(189, 161, 82, 0.9);
}
.popular-list .list-group li:nth-child(2) .wpp_thumb_wrapper::after {
background: rgba(152, 153, 173, 0.9);
}
.popular-list .list-group li:nth-child(3) .wpp_thumb_wrapper::after {
background: rgba(156, 85, 34, 0.9);
}
ul.list-group.list-group-flush {
display: flex;
flex-wrap: wrap;
flex-flow: column;
justify-content: space-around;
}
a.wpp-post-title {
font-size: var(--font-md);
line-height: 2rem;
font-weight: 700;
}
.list-group-flush > .list-group-item {
border-width: 0 0 1px;
}
.list-group-item + .list-group-item {
border-top-width: 0;
}
.list-group-flush > .list-group-item:last-child {
border-bottom-width: 1px;
}
.list-group-item a {
display: block;
}
img.attachment-yarpp-thumbnail.size-yarpp-thumbnail.wp-post-image,
img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
width: 70px;
height: 70px;
object-fit: cover;
} .sidebar-column div {
text-align: left;
margin-bottom: initial;
}
.sidebar-column .right {
font-size: var(--font-md);
line-height: 2rem;
}
.sidebar-column .right p {
font-weight: 700;
}
.sidebar-column .right h5 {
font-size: var(--font-sm);
line-height: 1.6rem;
}
.sidebar-column .date {
margin-bottom: 0;
font-size: var(--font-xs);
} .yarpp-related {
margin-bottom: 0 !important;
margin-top: 0 !important;
}
.tag_area06 ul {
margin: 0;
padding: 0;
list-style: none;
}
.tag_area06 ul li {
display: inline-block;
margin: 0 0.5em 0.3em 1em;
padding: 0;
}
.tag_area06 ul li a {
position: relative;
display: inline-block;
height: 2rem;
line-height: 2rem;
padding: 0 1em;
background-color: #2196F3;
border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
color: #fff;
font-size: 0.8rem;
text-decoration: none;
transition: 0.2s;
}
.tag_area06 ul li a::before {
position: absolute;
top: 0;
left: -1rem;
content: '';
width: 0;
height: 0;
border-color: transparent #2196F3 transparent transparent;
border-style: solid;
border-width: 1rem 1rem 1rem 0;
transition: 0.2s;
}
.tag_area06 ul li a::after {
position: absolute;
top: 50%;
left: 0;
z-index: 2;
display: block;
content: '';
width: 6px;
height: 6px;
margin-top: -3px;
background-color: #fff;
border-radius: 100%;
}
.tag_area06 ul li a:hover {
background-color: #555;
color: #fff;
}
.tag_area06 ul li a:hover::before {
border-right-color: #555;
}
.side-thumnail {
flex: 25%;
max-width: 25%;
padding: 0 var(--space-sm);
}
.side-title {
flex: 75%;
max-width: 75%;
padding: 0 var(--space-xs);
} .single .card .card-title h1 {
background-color: var(--grey-sub);
font-size: 3rem;
line-height: 5rem;
padding: var(--space-xl);
}
.single button {
font-size: 12px;
color: #ccc;
}
.single li {
font-size: 12px;
} .single #pending-content.active {
display: block;
}  .tax-note {
color: var(--color-error);
font-size: 0.5rem;
} .tax-note-inline {
font-size: 10px;
} .notice-emphasis {
font-weight: var(--weight-bold);
font-size: var(--font-lg);
} .size-new-badge {
font-size: 14px;
} .size-desc {
font-size: var(--font-xs);
line-height: 1.8rem;
} .highlight-yellow {
background-color: var(--color-highlight);
} .label-express {
background-color: var(--color-express);
}
.txt-express {
color: var(--color-express);
} .label-value {
background-color: var(--color-value);
}
.txt-value {
color: var(--color-value);
} .footer-copyright-link {
color: #fff;
} .wq-Form .wq-Selector > .wq--body {
display: flex !important;
flex-wrap: wrap !important;
}
@media (max-width: 767px) {
.wq-Form .wq-Option {
width: 105px !important;
}
.wq--name,
.wq--price {
font-size: var(--font-xs) !important;
}
}
#wq-selector-detail-2 .wq--media,
#wq-selector-detail-12 .wq--media {
display: none !important;
}
#wq-selector-detail-2 .wq--input,
#wq-selector-detail-12 .wq--input {
position: initial !important;
top: 0 !important;
}.fa,.fas,.far,.fal,.fad,.fab{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-star-half-alt:before{content:"\f5c0"}.fa-line:before{content:"\f3c0"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-facebook-f:before{content:"\f39e"}.fa-instagram:before{content:"\f16d"}.fa-youtube:before{content:"\f167"}.fa-rss:before{content:"\f09e"}.fa-line:before{content:"\f3c0"}.fa-check-circle:before{content:"\f058"}.fa-search:before{content:"\f002"}.fa-tag:before{content:"\f02b"}.fa-tint:before{content:"\f043"}.fa-home:before{content:"\f015"}.fa-get-pocket:before{content:"\f265"}.fa-caret-right:before{content:"\f0da"}.fa-bars:before{content:"\f0c9"}.fa-share-alt:before{content:"\f1e0"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-chevron-up:before{content:"\f077"}.fa-star:before{content:"\f005"}.fa-star-half-alt:before{content:"\f5c0"}.fa-code:before{content:"\f121"}.fa-list-ul:before{content:"\f0ca"}.fa-arrow-up:before{content:"\f062"}.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}.fa-chevron-circle-right:before{content:"\f138"}.fa-pencil-alt:before{content:"\f303"}.fa-hourglass-half:before{content:"\f252"}.fa-star-half:before{content:"f089"}.fa-repeat:before{content:"\f363"}.fa-calculator:before{content:"\f1ec"}.fa-sitemap:before{content:"\f0e8"}.fa-question-circle:before{content:"\f059"}.fa-envelope:before{content:"\f0e0"}.fa-info-circle:before{content:"\f05a"}.fa-shopping-bag:before{content:"\f290"}.fa-chevron-right:before{content:"\f290"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-chevron-circle-down:before{content:"\f139"}.fa-chevron-circle-down:after{content:"\f13a"}.fa-chevron-circle-down:after{content:"\f139"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-down:before{content:"\f107"}.sr-only{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.sr-only-focusable:active,.sr-only-focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}@font-face{font-family:'Font Awesome 5 Brands';font-style:normal;font-weight:400;src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.eot);src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.woff2) format("woff2"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.woff) format("woff"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.ttf) format("truetype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-brands-400.svg#fontawesome) format("svg");font-display:swap}.fab{font-family:'Font Awesome 5 Brands'}@font-face{font-family:'Font Awesome 5 Pro';font-style:normal;font-weight:300;src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.eot);src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.eot?#iefix) format("embedded-opentype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.woff2) format("woff2"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.woff) format("woff"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.ttf) format("truetype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-light-300.svg#fontawesome) format("svg");font-display:swap}.fal{font-family:'Font Awesome 5 Pro';font-weight:300}@font-face{font-family:'Font Awesome 5 Pro';font-style:normal;font-weight:400;src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.eot);src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.woff2) format("woff2"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.woff) format("woff"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.ttf) format("truetype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-regular-400.svg#fontawesome) format("svg");font-display:swap}.far{font-family:'Font Awesome 5 Pro';font-weight:400}@font-face{font-family:'Font Awesome 5 Pro';font-style:normal;font-weight:900;src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.eot);src:url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.woff2) format("woff2"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.woff) format("woff"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.ttf) format("truetype"),url(//original-pb.net/wp-content/themes/original-pb/webfonts/fa-solid-900.svg#fontawesome) format("svg");font-display:swap}.fa,.fas{font-family:'Font Awesome 5 Pro';font-weight:900}.contents .head-box {
margin-bottom: var(--space-lg);
}
.shipping_info_item {
padding: 1.75rem 0;
border-bottom: 1px dotted #98A6B5;
display: flex;
}
.shipping_info_item_date {
width: 15rem;
line-height: 3rem;
background: var(--color-orange-accent);
border-radius: var(--radius-sm);
text-align: center;
font-size: 1.3rem;
color: #fff;
font-weight: 700;
margin-right: var(--space-lg);
}
.shipping_info_item_price {
margin-right: var(--space-sm);
font-size: 1.7rem;
line-height: 2.6rem;
font-weight: 400;
}
@media (max-width: 640px) {
.shipping_info_item_date {
width: 10rem;
font-size: 0.8rem;
line-height: 1.6rem;
color: var(--color-orange-accent);
background: none;
}
.shipping_info_item_price {
margin-right: 0;
font-size: 0.9rem;
line-height: 2rem;
font-weight: 400;
}
}
.shipping_info {
max-height: 265px;
overflow-y: auto;
grid-template-columns: max-content 1fr;
gap: var(--space-lg);
background-color: var(--grey-1);
padding: var(--space-xs) var(--space-lg);
}
.orderBox {
border: solid 0.15rem #ccc;
}
.orderNew {
background: #fffbf9;
}
@media (max-width: 767px) {
.contents-wrap {
padding-top: var(--space-xl);
}
.contents .head-box {
text-align: center;
}
.contents .head-box h2 {
display: inline-block;
font-size: var(--font-lg);
line-height: 3rem;
text-align: center;
padding-left: 0;
padding: var(--space-xs);
border-bottom: 5px solid var(--loud-color);
border-radius: 2px;
}
.contents .head-box h2::before {
background: none;
}
.strength-box .main-box > ul > li.row {
display: grid;
grid-template-columns: 30% 1fr;
gap: 0 var(--space-sm);
}
.strength-box .main-box > ul > li.row > .flex-sp-100:first-child {
grid-column: 1;
grid-row: 2;
max-width: 100%;
}
.strength-box .main-box > ul > li.row > .flex-sp-100:nth-child(2) {
display: contents;
max-width: 100%;
}
.strength-box .main-box > ul > li.row > .flex-sp-100:nth-child(2) > h3 {
grid-column: 1 / -1;
grid-row: 1;
}
.strength-box .main-box > ul > li.row > .flex-sp-100:nth-child(2) > p {
grid-column: 2;
grid-row: 2;
}
}.wp-pagenavi {
clear: both;
}
.wp-pagenavi a, .wp-pagenavi span {
text-decoration: none;
border: 1px solid #BFBFBF;
padding: 3px 5px;
margin: 2px;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
border-color: #000;
}
.wp-pagenavi span.current {
font-weight: bold;
}