@charset "euc-jp";
.yamazen-sale-banner {
display: grid;
grid-template-columns: 29% minmax(0, 1fr) 145px;
width: 100%;
max-width: 100%;
margin: 24px auto;
background: #ffffff;
border: 1px solid #d2d6dc;
color: #17345d;
overflow: hidden;
box-sizing: border-box;
font-family:
"Yu Mincho",
"Hiragino Mincho ProN",
"Hiragino Mincho Pro",
"Noto Serif JP",
serif;
}
.yamazen-sale-banner *,
.yamazen-sale-banner *::before,
.yamazen-sale-banner *::after {
box-sizing: border-box;
}
.yamazen-sale-off {
min-width: 0;
min-height: 172px;
padding: 18px 12px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #1b3b67;
color: #ffffff;
text-align: center;
}
.yamazen-sale-label {
margin-bottom: 8px;
font-size: 22px;
line-height: 1.3;
letter-spacing: 0.08em;
}
.yamazen-sale-rate {
max-width: 100%;
font-size: clamp(46px, 4.8vw, 64px);
line-height: 1;
white-space: nowrap;
}
.yamazen-sale-price-area {
min-width: 0;
min-height: 172px;
padding: 20px 20px;
display: grid;
grid-template-columns: 175px 28px minmax(0, 1fr);
align-items: center;
justify-items: center;
column-gap: 10px;
}
.yamazen-regular-price {
min-width: 0;
display: flex;
flex-direction: column;
align-items: center;
white-space: nowrap;
}
.yamazen-regular-label {
margin-bottom: 5px;
font-size: 18px;
line-height: 1.3;
}
.yamazen-regular-value {
position: relative;
display: inline-block;
font-size: 27px;
line-height: 1.3;
}
.yamazen-regular-value::after {
content: "";
position: absolute;
left: 0;
top: 53%;
width: 100%;
height: 2px;
background-color: #c83a3a;
transform: rotate(-5deg);
transform-origin: center;
}
.yamazen-sale-arrow {
font-size: 31px;
line-height: 1;
color: #17345d;
}
.yamazen-discount-price {
min-width: 0;
font-size: clamp(46px, 4.5vw, 59px);
line-height: 1;
white-space: nowrap;
text-align: center;
}
.yamazen-regular-value small,
.yamazen-discount-price small {
margin-left: 3px;
font-size: 13px;
white-space: nowrap;
}
.yamazen-sale-saving {
align-self: center;
justify-self: center;
width: 108px;
height: 108px;
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 50%;
background-color: #1b3b67;
color: #ffffff;
text-align: center;
}
.yamazen-saving-price {
font-size: 23px;
line-height: 1.25;
white-space: nowrap;
}
.yamazen-saving-text {
margin-top: 2px;
font-size: 18px;
line-height: 1.3;
}
@media screen and (max-width: 900px) and (min-width: 701px) {
.yamazen-sale-banner {
grid-template-columns: 27% minmax(0, 1fr) 125px;
}
.yamazen-sale-price-area {
padding: 18px 12px;
grid-template-columns: 145px 22px minmax(0, 1fr);
column-gap: 7px;
}
.yamazen-sale-rate {
font-size: 48px;
}
.yamazen-regular-value {
font-size: 23px;
}
.yamazen-discount-price {
font-size: 44px;
}
.yamazen-sale-saving {
width: 96px;
height: 96px;
}
.yamazen-saving-price {
font-size: 20px;
}
}
@media screen and (max-width: 700px) {
.yamazen-sale-banner {
display: block;
margin: 18px auto;
}
.yamazen-sale-off {
min-height: auto;
padding: 13px 12px;
flex-direction: row;
gap: 12px;
}
.yamazen-sale-label {
margin: 0;
font-size: 16px;
}
.yamazen-sale-rate {
font-size: 35px;
}
.yamazen-sale-price-area {
min-height: auto;
padding: 22px 12px 14px;
display: flex;
flex-direction: column;
gap: 7px;
}
.yamazen-regular-price {
flex-direction: row;
gap: 7px;
}
.yamazen-regular-label {
margin: 0;
font-size: 15px;
}
.yamazen-regular-value {
font-size: 22px;
}
.yamazen-sale-arrow {
font-size: 19px;
transform: rotate(90deg);
}
.yamazen-discount-price {
font-size: clamp(39px, 13vw, 48px);
}
.yamazen-regular-value small,
.yamazen-discount-price small {
font-size: 11px;
}
.yamazen-sale-saving {
width: auto;
height: auto;
margin: 0 auto 20px;
padding: 8px 22px;
flex-direction: row;
gap: 5px;
border-radius: 999px;
}
.yamazen-saving-price {
font-size: 21px;
}
.yamazen-saving-text {
margin: 0;
font-size: 17px;
}
}
.recommend-list{
display:inline-block;
text-align:left;
margin:0 auto;
padding-left:1.2em;
font-size:16px;
}
main10 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main10 div.oni01 {
width: calc(25% - 20px);
margin: 10px;
text-align: center;
}
@media (max-width: 500px) {
main10 div.oni01 {
width: calc(33.3% - 10px);
margin: 5px;
}
}
main09 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main09 div.ani01 {
width: calc(33.3% - 20px);
margin: 10px;
text-align: center;
}
@media (max-width: 500px) {
main09 div.ani01 {
width: calc(50% - 10px);
margin: 5px;
}
}
main08 {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 10px;
border: 2px solid orange;
border-radius: 10px;
margin: 15px;
}
main08 div.anpmo {
width: calc(50% - 20px);
margin: 10px;
}
@media (max-width: 500px) {
main08 div.anpmo {
width: calc(100% - 10px);
margin: 5px;
}
}
main07 {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding: 15px;
}
main07 div.anpme {
width: calc(50% - 20px);
margin: 10px;
}
@media (max-width: 500px) {
main07 div.anpme {
width: calc(100% - 10px);
margin: 5px;
}
}
main06 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main06 div.animo {
width: calc(50% - 20px);
margin: 10px;
text-align: center;
}
@media (max-width: 500px) {
main06 div.animo {
width: calc(50% - 10px);
margin: 5px;
}
}
main05 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main05 div.animal01 {
width: calc(33.3% - 20px);
margin: 10px;
}
.inner{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
line-height: 18px;
max-height: calc(18px*5);
}
@media (max-width: 500px) {
main05 div.animal01 {
width: calc(50% - 10px);
margin: 5px;
}
}
.kakomu{
padding:1px 3px;
margin:0 1px;
background-color:#f9f9f9;
border:1px solid #777;
border-radius:2px;
box-shadow: 1px 2px 2px #ddd;
font-family:inherit;
font-size:0.85em;
}
main04 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main04 div.oanime {
width: calc(33.3% - 20px);
margin: 10px;
}
main03 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main03 div.nimal {
width: calc(25% - 20px);
margin: 10px;
}
@media (max-width: 500px) {
main03 div.nimal {
width: calc(33.3% - 10px);
margin: 5px;
}
}
main02 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main02 div.anime {
width: calc(50% - 20px);
margin: 10px;
}
@media (max-width: 500px) {
main02 div.anime {
width: calc(100% - 10px);
margin: 5px;
}
}
main01 {
display: flex;
flex-wrap: wrap;
padding: 5px;
}
main01 div.animal {
width: calc(33.3% - 20px);
margin: 10px;
}
@media (max-width: 500px) {
main01 div.animal {
width: calc(50% - 10px);
margin: 5px;
}
}
.icon-lg-b.icon-instagram {
background-position: -168px -288px;
}
body {
background-color: #FFF;
background-image: url(https://img.shop-pro.jp/tmpl_img/76/bg.gif);
color: #333;
-webkit-font-smoothing: antialiased;
}
a {
color: #333;
}
a:hover {
color: #ccc;
text-decoration: none;
}
form {
margin: 0;
}
#wrapper {
position: relative;
}
.heading {
font-size: 18px;
font-weight: normal;
margin: 0;
padding-bottom: 20px;
letter-spacing: 0.1em;
border-bottom: 1px solid #333;
}
.lists {
margin: 0;
border-bottom: 1px solid #333;
}
.list {
border-top: 1px solid #ccc;
font-weight: normal;
}
.list:first-child {
border-top: none;
}
.list_link {
padding: 20px 0;
}
.list_link_name {
display: block;
padding-right: 30px;
}
.list_link_img {
margin-bottom: 5px;
}
.list_icon_arrow {
float: right;
margin-right: 10px;
}
.item_img {
margin: 0 auto;
}
.item_img:hover {
opacity: 0.8;
}
.item_name {
padding-top: 5px;
}
.item_regular_price {
text-decoration: line-through;
}
.item_price {
color: #cf0400;
font-weight: bold;
}
.item_price_discount {
color: #cf0400;
}
.item_discount_rate {
color: #cf0400;
}
.item_soldout {
color: #cf0400;
}
.rank_box {
position: absolute;
width: 25px;
height: 25px;
background-color: #333;
display: block;
z-index: 5;
}
.rank_box_color_1 {
background-color: #dccc18;
}
.rank_box_color_2 {
background-color: #bab9c1;
}
.rank_box_color_3 {
background-color: #e18961;
}
.rank_number {
color: #fff;
display: block;
padding-top: 1px;
font-size: 14px;
}
.btn-more {
width: 96%;
margin: 0 auto 60px;
padding: 10px 12px;
}
#header {
margin-bottom: 30px;
}
.header_top {
width: 100%;
height: 50px;
border-bottom: 1px solid #eee;
position: absolute;
top: 0;
background-color: #333;
z-index: 10;
}
.header_top_cmspbar {
position: fixed;
}
.header_top_inner {
max-width: 980px;
margin: 0 auto;
}
.search_form {
margin: 0;
padding-top: 10px;
float: left;
}
.search_select {
width: 150px;
border: 1px solid #101010;
font-size: 12px;
}
.search_box {
width: 260px;
}
.btn_search {
padding: 2px 5px 3px 5px;
border: 1px solid #101010;
}
.btn_search i {
vertical-align: -35%;
}
.header_nav_headline {
text-align: right;
font-size: 12px;
margin-top: 14px;
letter-spacing: 0.1em;
float: right;
}
.header_nav_headline li a i {
vertical-align: -40%;
}
.header_nav_headline li a {
color: #fff;
margin-right: 5px;
}
.header_nav_headline li a:hover {
color: #ccc;
text-decoration: none;
}
.header_nav_headline .headline_viewcart {
padding-left: 15px;
border-left: 1px solid #000;
}
.header_mid {
width: 100%;
height: 50px;
border-bottom: 1px solid #333;
position: absolute;
top: 51px;
background-color: #fff;
z-index: 9;
}
.header_mid_cmspbar {
position: fixed;
}
.header_mid_inner {
max-width: 980px;
margin: 0 auto;
position: relative;
}
.header_nav_global {
font-size: 12px;
margin-top: 14px;
}
ul.header_nav_global > li {
padding: 0 5px 0 0;
}
.header_nav_global li a i {
vertical-align: -40%;
}
.header_nav_global li a:hover {
text-decoration: none;
}
.header_nav_global_box {
display: none;
width: 100%;
height: auto;
background-color: #333;
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
position: absolute;
top: 37px;
left: -1px;
padding: 0;
}
.header_nav_global_box_heading {
color: #fff;
font-size: 12px;
margin: 0;
padding-top: 30px;
text-align: center;
letter-spacing: 0.1em;
}
.header_nav_global_box_detail {
background-color: #fff;
padding: 30px 20px 20px;
}
.header_nav_global_left {
float: left;
margin: 0;
}
.header_nav_global_left li {
padding-bottom: 15px;
}
.header_nav_global_right {
float: right;
}
.header_nav_global_social {
padding-left: 5px;
}
ul.header_nav_global_social > li {
padding: 0;
}
.header_nav_global_social li a i {
vertical-align: -40%;
}
.header_btm {
max-width: 980px;
padding-top: 101px;
margin: 0 auto;
}
.header_logo {
margin: 0 auto;
padding-top: 30px;
float: left;
}
.header_lead {
padding-top: 40px;
font-size: 18px;
color: #aaa;
letter-spacing: 0.1em;
float: right;
}
.header_nav_phone {
z-index: 99;
float: right;
height: 50px;
}
.header_nav_lst_phone {
position: absolute;
left: 55%;
display: none;
margin-left: -50%;
width: 90%;
border: 1px solid #ccc;
background: #fff;
}
.header_nav_lst_phone ul {
margin: 0;
}
.header_nav_lst_phone li {
padding: 0;
border-bottom: 1px solid #ccc;
text-align: center;
font-size: 12px;
}
.header_nav_lst_phone li:last-child {
border-bottom: none;
}
.header_nav_lst_phone a {
display: block;
padding: 6px 0;
}
.header_nav_lst_phone a:hover {
background: #333;
text-decoration: none;
color: #fff;
}
.nav_btn_phone {
font-size: 12px;
font-weight: bold;
color: #fff;
}
.nav_btn_phone i {
vertical-align: -40%;
}
.main {
max-width: 980px;
}
.contents {
padding: 0;
float: right;
}
.pankuzu_lists {
font-size: 10px;
}
ul.pankuzu_lists > li {
padding: 0;
}
.info {
margin-bottom: 60px;
}
.info_detail {
margin: 20px 0 0;
font-size: 13px;
}
.info_detail_list_dt {
padding: 20px 0 5px;
}
.info_detail_list_dt:first-child {
padding: 0 0 5px;
}
.info_detail_list_dd {
margin: 0;
}
.seller {
margin-bottom: 20px;
}
.seller_lists {
margin-top: 20px;
font-size: 12px;
}
.seller_list {
margin-bottom: 40px;
text-align: center;
position: relative;
}
.recommend {
margin-bottom: 20px;
}
.recommend_lists {
margin-top: 20px;
font-size: 12px;
}
.recommend_list {
margin-bottom: 40px;
text-align: center;
position: relative;
}
.side {
padding: 0;
}
.side .unstyled img {
display: block;
margin-bottom: 5px;
}
.side_banner {
margin: 0 0 40px;
}
.side_banner_list {
margin-top: 19px;
}
.side_banner_list:first-child {
margin-top: 0;
}
.side_category {
margin: 0;
}
.side_category_list {
position: relative;
}
.side_subcategory_lists {
width: 80%;
padding: 15px 20px;
position: absolute;
top: -21px;
right: -180px;
border: 1px solid #ccc;
background-color: #fff;
z-index: 7;
display: none;
}
.side_subcategory_list {
border-top: none;
}
.side_subcategory_lists li a {
padding: 5px 0;
}
.side_group {
margin-top: 60px;
}
.side_freepage {
margin-top: 60px;
}
.side_freepage_heading {
margin-bottom: 20px;
}
.side_freepage_list {
padding-top: 0;
border: none;
}
.side_freepage_list a {
padding: 0 0 20px 0;
}
.side_mobile_shop {
margin-top: 60px;
}
.side_mobile_shop_heading {
margin-bottom: 20px;
}
.side_mobile_shop_img {
text-align: center;
}
.side_banner_long {
margin-top: 19px;
}
.footer {
width: 100%;
margin-top: 40px;
}
.footer_inner {
max-width: 980px;
margin: 0 auto;
}
.footer_lists {
margin-top: 20px;
}
.footer_list {
padding: 0 10px;
text-align: center;
}
.footer_list_img {
margin: 0 auto;
}
.footer_seller,
.footer_recommend,
.footer_checked {
margin-bottom: 40px;
}
.footer_seller_lists,
.footer_recommend_lists,
.footer_checked_lists {
font-size: 10px;
}
.footer_seller_list,
.footer_recommend_list,
.footer_checked_list{
margin-bottom: 10px;
}
.footer_banner {
padding-bottom: 60px;
margin: 0 auto;
}
.footer_pagetop {
text-align: center;
background-color: #333;
}
.footer_pagetop a {
display: block;
width: 100%;
height: 40px;
}
.footer_pagetop_icon {
margin-top: 8px;
}
.footer_notice {
padding: 60px 0;
background-color: #eee;
}
h3.footer_notice_heading {
padding-bottom: 40px;
border-bottom: none;
}
.footer_notice_lists {
margin: 0;
}
.footer_notice_list_dt {
padding: 20px 0 10px;
}
.footer_notice_list_dt:first-child {
padding: 0 0 10px;
}
.footer_notice_list_dd {
margin: 0;
line-height: 1.8;
}
.tbl_calendar {
margin-bottom: 20px;
max-width: 260px;
width: 100%;
font-size: 84.615%;
}
.tbl_calendar caption {
text-align: center;
}
.tbl_calendar th {
padding: .3em 0;
border-bottom: 1px solid #ccc;
text-align: center;
}
.tbl_calendar td {
padding: .5em 0;
width: 14.2%;
border-bottom: 1px solid #ccc;
text-align: center;
}
.cal_memo {
margin-top: 1em;
font-size: 84.615%;
}
.footer_nav {
padding: 60px 0;
background-color: #333;
}
.footer_nav_shopinfo {
color: #fff;
}
.footer_nav_shopinfo_img {
padding: 0;
text-align: left;
}
.footer_nav_shopinfo_img img {
width: 180px;
}
.footer_nav_shopinfo_caption {
padding: 0 2%;
}
.footer_nav_shopinfo_name {
font-size: 18px;
padding-left: 5px;
}
.footer_nav_shopinfo_memo {
padding-left: 5px;
}
.footer_nav_list {
color: #fff;
padding-top: 15px;
}
.footer_nav_list:first-child {
padding-top: 0;
}
.footer_nav_list_link {
color: #fff;
}
.footer_nav_list_link:hover {
color: #ccc;
text-decoration: none;
}
.footer_copyright {
text-align: center;
padding: 2em 0;
}
.footer_powered {
display: block;
padding: 10px 0;
line-height: 18px;
}
.footer_powered a {
color: #a1a19f;
text-decoration: none;
font-size: 11px;
}
.footer_powered img {
margin-bottom: 10px;
margin-left: 4px;
width: 200px;
height: 18px;
}
.slider {
position: relative;
margin-bottom: 40px;
}
.bx-wrapper {
z-index: 0;
}
.bx-wrapper img {
width: 100%;
height: auto;
}
.slider .bx-wrapper .bx-viewport {
-moz-box-shadow: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
left: 0 !important;
border: none !important;
}
.slider .bx-wrapper .bx-caption {
background: #000\9;
background: rgba(0, 0, 0, 0.60);
}
.slider .bx-wrapper .bx-caption span {
font-size: 14px;
padding: 10px 10px 10px 20px;
}
.skpr_box {
padding-top: 120px;
margin-top: -60px
}
.skpr_box:first-child {
padding-top: 0;
margin-top: 0;
}
.skpr_detail,
.privacy_lead {
margin: 20px 0 0;
font-size: 13px;
}
.skpr_detail_list_dt {
padding: 20px 0 5px;
}
.skpr_detail_list_dt:first-child {
padding: 0 0 5px;
}
.skpr_detail_list_dd {
margin: 0;
}
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
border: 1px solid #101010;
background-color: #fff;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
outline: 0;
outline: thin dotted \9;
border-color: rgba(82, 168, 236, 0.8);
}
.icon-b.icon-user { background-position: -208px -0px; }
.icon-w.icon-user { background-position: -208px -0px; }
.icon-lg-b.icon-user { background-position: -312px -0px; }
.icon-lg-w.icon-user { background-position: -312px -0px; }
.icon-b.icon-adduser { background-position: -240px -0px; }
.icon-w.icon-adduser { background-position: -240px -0px; }
.icon-lg-b.icon-adduser { background-position: -360px -0px; }
.icon-lg-w.icon-adduser { background-position: -360px -0px; }
.icon-b.icon-login { background-position: -48px -80px; }
.icon-w.icon-login { background-position: -48px -80px; }
.icon-lg-b.icon-login { background-position: -72px -120px; }
.icon-lg-w.icon-login { background-position: -72px -120px; }
.icon-b.icon-logout { background-position: -32px -80px; }
.icon-w.icon-logout { background-position: -32px -80px; }
.icon-lg-b.icon-logout { background-position: -48px -120px; }
.icon-lg-w.icon-logout { background-position: -48px -120px; }
.icon-b.icon-cart { background-position: -176px -64px; }
.icon-w.icon-cart { background-position: -176px -64px; }
.icon-lg-b.icon-cart { background-position: -264px -96px; }
.icon-lg-w.icon-cart { background-position: -264px -96px; }
.icon-b.icon-search { background-position: -208px -16px; }
.icon-w.icon-search { background-position: -208px -16px; }
.icon-lg-b.icon-search { background-position: -312px -24px; }
.icon-lg-w.icon-search { background-position: -312px -24px; }
.icon-b.icon-mail { background-position: -64px -0px; }
.icon-w.icon-mail { background-position: -64px -0px; }
.icon-lg-b.icon-mail { background-position: -96px -0px; }
.icon-lg-w.icon-mail { background-position: -96px -0px; }
.icon-b.icon-book { background-position: -144px -32px; }
.icon-w.icon-book { background-position: -144px -32px; }
.icon-lg-b.icon-book { background-position: -216px -48px; }
.icon-lg-w.icon-book { background-position: -216px -48px; }
.icon-b.icon-help { background-position: -288px -80px; }
.icon-w.icon-help { background-position: -288px -80px; }
.icon-lg-b.icon-help { background-position: -432px -120px; }
.icon-lg-w.icon-help { background-position: -432px -120px; }
.icon-b.icon-c_twitter { background-position: -112px -176px; }
.icon-w.icon-c_twitter { background-position: -112px -176px; }
.icon-lg-b.icon-c_twitter { background-position: -168px -264px; }
.icon-lg-w.icon-c_twitter { background-position: -168px -264px; }
.icon-b.icon-c_facebook { background-position: -144px -176px; }
.icon-w.icon-c_facebook { background-position: -144px -176px; }
.icon-lg-b.icon-c_facebook { background-position: -216px -264px; }
.icon-lg-w.icon-c_facebook { background-position: -216px -264px; }
.icon-b.icon-c_google { background-position: -192px -176px; }
.icon-w.icon-c_google { background-position: -192px -176px; }
.icon-lg-b.icon-c_google { background-position: -288px -264px; }
.icon-lg-w.icon-c_google { background-position: -288px -264px; }
.icon-b.icon-c_pinterest { background-position: -224px -176px; }
.icon-w.icon-c_pinterest { background-position: -224px -176px; }
.icon-lg-b.icon-c_pinterest { background-position: -336px -264px; }
.icon-lg-w.icon-c_pinterest { background-position: -336px -264px; }
.icon-b.icon-chevron_right { background-position: -16px -144px; }
.icon-w.icon-chevron_right { background-position: -16px -144px; }
.icon-lg-b.icon-chevron_right { background-position: -24px -216px; }
.icon-lg-w.icon-chevron_right { background-position: -24px -216px; }
.icon-b.icon-chevron_down { background-position: -352px -128px; }
.icon-w.icon-chevron_down { background-position: -352px -128px; }
.icon-lg-b.icon-chevron_down { background-position: -528px -192px; }
.icon-lg-w.icon-chevron_down { background-position: -528px -192px; }
.icon-b.icon-chevron_up { background-position: -0px -144px; }
.icon-w.icon-chevron_up { background-position: -0px -144px; }
.icon-lg-b.icon-chevron_up { background-position: -0px -216px; }
.icon-lg-w.icon-chevron_up { background-position: -0px -216px; }
.icon-b.icon-chevron_left { background-position: -336px -128px; }
.icon-w.icon-chevron_left { background-position: -336px -128px; }
.icon-lg-b.icon-chevron_left { background-position: -504px -192px; }
.icon-lg-w.icon-chevron_left { background-position: -504px -192px; }
.icon-b.icon-list { background-position: -192px -96px; }
.icon-w.icon-list { background-position: -192px -96px; }
.icon-lg-b.icon-list { background-position: -288px -144px; }
.icon-lg-w.icon-list { background-position: -288px -144px; }
.icon-b.icon-pencil { background-position: -96px -0px; }
.icon-w.icon-pencil { background-position: -96px -0px; }
.icon-lg-b.icon-pencil { background-position: -144px -0px; }
.icon-lg-w.icon-pencil { background-position: -144px -0px; }
.icon-b,
.icon-w {
width: 16px;
height: 16px;
display: inline-block;
*display: inline;
*zoom: 1;
}
.icon-lg-b,
.icon-lg-w {
width: 24px;
height: 24px;
display: inline-block;
*display: inline;
*zoom: 1;
}
.icon-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon16_b.png); }
.icon-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon16_w.png); }
.icon-lg-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_b.png); }
.icon-lg-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_w.png); }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.icon-b,
.icon-w {
-webkit-background-size: 368px 320px;
background-size: 368px 320px;
}
.icon-lg-b,
.icon-lg-w {
-webkit-background-size: 552px 480px;
background-size: 552px 480px;
}
.icon-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon16_2x_b.png); }
.icon-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon16_2x_w.png); }
.icon-lg-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_2x_b.png); }
.icon-lg-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_2x_w.png); }
}
@media (max-width: 768px) {
.icon-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_b.png); }
.icon-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_w.png); }
}
@media only screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 2), only screen and (max-width: 768px) and (min--moz-device-pixel-ratio: 2), only screen and (max-width: 768px) and (-o-min-device-pixel-ratio: 2 / 1), only screen and (max-width: 768px) and (min-device-pixel-ratio: 2), only screen and (max-width: 768px) and (min-resolution: 192dpi), only screen and (max-width: 768px) and (min-resolution: 2dppx) {
.icon-b { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_2x_b.png); }
.icon-w { background-image: url(https://img.shop-pro.jp/tmpl_img/76/icon24_2x_w.png); }
}
@media (min-width: 980px) {
.contents {
width: 670px;
}
.contents_detail {
width: 100%;
}
.side {
width: 270px;
}
.header_nav_global_right li {
display: inline-block !important;
}
}
@media (min-width: 769px) {
.footer_list {
width: 10%;
}
}
@media (max-width: 980px) {
#base_gmoWrapp,
#gmo_CMSPbar {
overflow: hidden;
min-width: 100% !important;
width: 100% !important;
}
.contents,
.side,
.footer_heading {
padding-right: 1%;
padding-left: 1%;
}
.header_nav_phone {
margin-right: 0;
}
.nav_btn_phone {
display: block;
height: 30px;
padding-top: 15px;
}
}
@media (max-width: 768px) {
.contents,
.side,
.footer_heading {
padding: 0;
}
.productlist_lists {
padding: 0 10px 20px;
}
.header_btm {
padding-top: 51px;
text-align: center
}
.header_logo {
float: none;
}
.header_lead {
padding-top: 10px;
font-size: 12px;
float: none;
}
.header_nav_global_social {
padding-left: 0;
}
.search_form {
float: none;
}
.search_select {
width: 100%;
margin-bottom: 10px;
}
.search_box {
width: 75%;
float: left;
}
.btn_search {
width: 15%;
float: right;
}
.slider {
margin-bottom: 20px;
}
.side_group,
.side_freepage {
margin-top: 0;
}
.info_detail,
.seller_lists,
.recommend_lists {
padding: 0 10px 20px;
}
.free_space {
font-size: 12px;
padding: 0 10px 60px;
}
.list {
padding: 0;
}
.list_link {
padding: 10px;
}
.list_icon_arrow {
margin-right: 0;
}
.side_banner {
margin-bottom: 40px;
text-align: center;
}
.side_banner_list {
margin-top: 0;
}
.side_freepage_heading {
margin-bottom: 0;
}
.side_freepage_list {
padding: 0;
border-top: 1px solid #ccc;
}
.side_freepage_list a {
padding: 10px;
}
.heading {
font-size: 14px;
font-weight: bold;
padding: 0 10px 20px;
}
.side_category {
margin-top: 0;
}
.side_category_list {
position: static;
cursor: pointer;
}
.side_subcategory_lists {
width: 100%;
padding: 0;
position: static;
border: none;
background-color: #f5f5f5;
display: none;
}
.side_subcategory_list {
border-top: 1px solid #ccc;
}
.side_subcategory_list:first-child {
border-top: 1px solid #ccc;
}
.side_subcategory_lists li a {
padding: 10px;
}
.side_category_heading,
.side_group_heading,
.side_freepage_heading,
.footer_seller_heading,
.footer_recommend_heading,
.footer_checked_heading{
background-color: #333;
color: #fff;
padding: 10px 0 10px 10px;
}
.footer {
margin-top: 0;
}
.footer_lists {
padding: 0 10px 20px;
}
.footer_list {
padding-right: 1%;
padding-left: 1%;
}
.footer_checked {
border-bottom: 1px solid #333;
}
.footer_banner {
text-align: center;
padding: 0 10px 60px;
}
.footer_banner li {
padding: 5px;
}
.footer_seller_lists,
.footer_recommend_lists,
.footer_checked_lists {
font-size: 12px;
}
.footer_seller_list,
.footer_recommend_list {
margin-bottom: 40px;
}
.footer_checked_list {
margin-bottom: 10px;
}
.footer_notice {
padding: 0;
}
.footer_nav {
padding: 0;
}
.footer_nav_shopinfo {
padding: 30px 0;
}
.footer_nav_shopinfo_img {
padding-bottom: 10px;
text-align: center;
}
.footer_nav_shopinfo_caption {
text-align: center;
}
.footer_nav_shopinfo_name {
padding-left: 0;
}
.footer_nav_shopinfo_memo {
padding-left: 0;
}
.footer_nav_menu_right {
padding: 0;
border-top: 1px solid #777;
}
.footer_nav_menu_right li {
margin: 0;
padding: 0;
border-bottom: 1px solid #777;
}
.footer_nav_menu_right li:nth-child(odd) {
border-right: 1px solid #777;
}
.footer_nav_menu_right a {
display: block;
padding: 12px 10px;
color: #fff;
text-decoration: none;
font-size: 11px;
}
.footer_nav_menu {
padding: 20px;
text-align: center;
font-size: 10px;
background-color: #333;
color: #fff;
}
.footer_nav_list {
padding-top: 5px;
}
.footer_copyright {
font-size: 10px;
}
.skpr_detail,
.privacy_lead {
padding: 0 10px 20px;
}
.skpr_box {
padding-top: 70px;
margin-top: -10px
}
.skpr_box:first-child {
padding-top: 0;
margin-top: 0;
}
}
@media (max-width: 480px) {
.side_banner_list {
margin-top: 19px;
}
.side_banner_list:first-child {
margin-top: 0;
}
}
#top,
#a01,
#a02,
#a03,
#a04,
#a05,
#a06,
#a07,
#a08,
#a09,
#a10,
#a11,
#a12,
#a13,
#a14,
#a15,
#a16,
#a17,
#a18,
#a19,
#a20 {
padding-top: 65px;
margin-top: -65px;
}
hr {
border-width: 1px 0px 0px 0px;
border-style: solid;
border-color: #bbbbbb;
height: 1px;
}
h2 {
padding:15px;
padding-bottom: .3em;
border-bottom: 1px solid #ccc; margin: 20px;
}
@media(min-width: 768px){
a[href^="tel:"]{
pointer-events: none;
}
}
.cp_hr11 {
height: 3px;
border-width: 0;
background-color: #ffccbc;
background-image: -webkit-linear-gradient(135deg,
#ff5722 0px,#ff5722 2px, transparent 2px, transparent 4px,
#ff5722 4px, #ff5722 6px, transparent 6px, transparent);
background-image:         linear-gradient(-45deg,
#ff5722 0px,#ff5722 2px, transparent 2px, transparent 4px,
#ff5722 4px, #ff5722 6px, transparent 6px, transparent);
background-size: 6px 6px;
}
.cp_hr04 {
border-width: 3px 0 0 0;
border-style: double;
border-color: #ff6f00;
}
.marker_pink {
background: linear-gradient(transparent 60%, #fec1fe 0%);
}
.marker_yellow {
background: linear-gradient(transparent 60%, #ffff00 0%);
}
.marker_blue {
background: linear-gradient(transparent 60%, #00d2ff 0%);
}
.marker_brown {
background: linear-gradient(transparent 60%, #b16e49 0%);
}
.marker_orange {
background: linear-gradient(transparent 60%, #fcb848 0%);
}
.box {
display:flex;
flex-direction: row;
justify-content: space-between;
margin-bottom: 5px;
}
.text {
width: 800px;
}
h3 {
font-size: 18px;
margin: 0;
}
.pict {
width: 100%;
margin-left: 3%;
}
.pict img {
width: 100%;
height:auto;
}
@media (max-width:768px) {
.box {
flex-direction: column-reverse;
}
.text {
width: 95%;
text-align: left;
margin: 10px;
}
.pict {
width:100%;
margin-left: 0;
text-align: center;
}
.pict img {
width:90%;
height:auto;
}
}
hr.style1{
border-top: 1px solid #8c8b8b;
}
hr.style2 {
border-top: 3px double #8c8b8b;
}
hr.style3 {
border-top: 1px dashed #8c8b8b;
}
hr.style4 {
border-top: 1px dotted #8c8b8b;
}
hr.style5 {
background-color: #fff;
border-top: 2px dashed #8c8b8b;
}
hr.style6 {
background-color: #fff;
border-top: 2px dotted #8c8b8b;
}
:root {
--yz-navy: #17345d;
--yz-navy-2: #294d78;
--yz-blue-gray: #8fa9c6;
--yz-ink: #2f3946;
--yz-muted: #687586;
--yz-line: #d9dee6;
--yz-line-dark: #c7ced7;
--yz-paper: #ffffff;
--yz-soft: #f7f8fa;
--yz-kinari: #fbfaf7;
--yz-warm: #9a715f;
--yz-shadow: 0 8px 24px rgba(31, 50, 75, .06);
}
html {
scroll-behavior: smooth;
}
body {
line-height: 1.7;
word-break: normal;
overflow-wrap: anywhere;
}
img {
max-width: 100%;
height: auto;
}
.main {
width: 100%;
margin-right: auto;
margin-left: auto;
}
.contents,
.side,
.footer,
.header_top,
.header_mid {
box-sizing: border-box;
}
.heading {
margin: 0 0 22px;
padding: 0 0 12px;
border-bottom: 1px solid #bfc6cf;
color: #2f3946;
font-size: 18px;
font-weight: normal;
line-height: 1.55;
letter-spacing: .08em;
}
h2.heading,
h3.heading {
margin: 0 0 22px;
padding: 0 0 12px;
}
.seller,
.recommend,
.info {
margin-bottom: 44px;
}
.seller_lists,
.recommend_lists {
margin-top: 0;
border-bottom: 0;
}
.seller_list,
.recommend_list {
margin-bottom: 28px;
padding-right: 8px;
padding-left: 8px;
}
.seller_list .item_img,
.recommend_list .item_img {
width: 100%;
transition: opacity .2s ease, transform .2s ease;
}
.seller_list a:hover .item_img,
.recommend_list a:hover .item_img {
opacity: .88;
transform: translateY(-2px);
}
.item_name {
min-height: 3.2em;
padding-top: 10px;
color: #374454;
line-height: 1.6;
}
.item_price,
.item_regular_price,
.item_soldout {
margin-top: 4px;
}
.side .heading {
margin-bottom: 0;
padding: 11px 12px;
border-bottom: 0;
background: #f1f3f5;
font-size: 15px;
font-weight: bold;
letter-spacing: .04em;
}
.side .lists {
border-color: #d4d9df;
}
.side .list {
border-color: #e1e5ea;
}
.side .list_link {
padding: 13px 11px;
line-height: 1.55;
}
.footer_notice {
line-height: 1.8;
}
@supports selector(.main:has(.yz-free-v1)) {
@media screen and (min-width: 769px) {
.main:has(.yz-free-v1) {
max-width: 1120px;
}
.main:has(.yz-free-v1) .contents {
float: none;
width: 100%;
padding-right: 16px;
padding-left: 16px;
}
.main:has(.yz-free-v1) .side {
display: none;
}
}
}
.yz-free-v1,
.yz-free-v1 *,
.yz-free-v1 *::before,
.yz-free-v1 *::after {
box-sizing: border-box;
}
.yz-free-v1 {
width: 100%;
max-width: 980px;
margin: 22px auto 64px;
padding: 0 12px;
color: var(--yz-ink);
font-family:
-apple-system,
BlinkMacSystemFont,
"Yu Gothic",
"Hiragino Kaku Gothic ProN",
Meiryo,
sans-serif;
font-size: 16px;
line-height: 1.9;
text-align: left;
}
.yz-free-v1 h1,
.yz-free-v1 h2,
.yz-free-v1 h3,
.yz-free-v1 h4,
.yz-free-v1 p,
.yz-free-v1 ul,
.yz-free-v1 ol,
.yz-free-v1 figure,
.yz-free-v1 dl,
.yz-free-v1 dd {
margin-top: 0;
}
.yz-free-v1 h1,
.yz-free-v1 h2,
.yz-free-v1 h3,
.yz-free-v1 h4 {
color: var(--yz-navy);
font-family:
"Yu Mincho",
"Hiragino Mincho ProN",
"Noto Serif JP",
serif;
}
.yz-free-v1 a {
color: var(--yz-navy-2);
text-underline-offset: 3px;
}
.yz-free-v1 img {
display: block;
max-width: 100%;
height: auto;
}
.yz-free-v1__hero {
margin-bottom: 20px;
padding: 38px 40px 36px;
border: 1px solid var(--yz-line);
border-top: 5px solid var(--yz-navy);
background:
linear-gradient(135deg, rgba(255,255,255,.97), rgba(247,246,242,.97));
box-shadow: var(--yz-shadow);
}
.yz-free-v1__eyebrow {
margin-bottom: 7px;
color: var(--yz-muted);
font-size: 12px;
font-weight: bold;
letter-spacing: .16em;
}
.yz-free-v1__hero h1 {
margin: 0 0 13px;
padding: 0;
border: 0;
font-size: clamp(27px, 4vw, 34px);
line-height: 1.45;
letter-spacing: .03em;
}
.yz-free-v1__hero p:last-child {
margin-bottom: 0;
}
.yz-free-v1__nav,
.yz-free-v1__section,
.yz-free-v1__related {
margin-bottom: 20px;
padding: 30px 32px;
border: 1px solid var(--yz-line);
background: var(--yz-paper);
box-shadow: 0 4px 16px rgba(31, 50, 75, .035);
}
.yz-free-v1__nav {
background: #f8fafc;
}
.yz-free-v1__section--soft,
.yz-free-v1__related {
background: var(--yz-kinari);
}
.yz-free-v1__section--important {
border-top: 4px solid var(--yz-warm);
background: #fffdfc;
}
.yz-free-v1__section {
scroll-margin-top: 74px;
}
.yz-free-v1__nav-title,
.yz-free-v1__section-title,
.yz-free-v1__related-title {
margin: 0 0 22px;
padding: 0 0 12px 14px;
border: 0;
border-bottom: 1px solid #e2e6eb;
border-left: 4px solid var(--yz-navy);
color: var(--yz-navy);
font-size: clamp(21px, 3vw, 25px);
line-height: 1.5;
}
.yz-free-v1__subheading,
.yz-free-v1__tailor-subheading {
margin: 28px 0 14px;
padding-bottom: 8px;
border-bottom: 1px solid #dfe4e9;
color: var(--yz-navy);
font-size: 19px;
line-height: 1.55;
}
.yz-free-v1__lead-box,
.yz-free-v1__note,
.yz-free-v1__notice,
.yz-free-v1__subsection,
.yz-free-v1__estimate-box,
.yz-free-v1__contact-box {
margin: 0 0 17px;
padding: 19px 20px;
border: 1px solid var(--yz-line);
background: #fff;
}
.yz-free-v1__lead-box {
border-left: 5px solid var(--yz-blue-gray);
}
.yz-free-v1__note {
background: #f8fafc;
}
.yz-free-v1__notice {
border-left: 5px solid #c4a66a;
background: #fffdf6;
}
.yz-free-v1__estimate-box {
border-left: 5px solid var(--yz-warm);
background: #fffaf7;
}
.yz-free-v1__contact-box {
border-left: 5px solid var(--yz-navy);
}
.yz-free-v1__plain-list,
.yz-free-v1__check-list,
.yz-free-v1__purchase-check-list {
margin: 0;
padding-left: 1.35em;
}
.yz-free-v1__plain-list li,
.yz-free-v1__check-list li,
.yz-free-v1__purchase-check-list li {
margin: 5px 0;
}
.yz-free-v1 [class*="-grid"],
.yz-free-v1__nav-grid,
.yz-free-v1__related-grid,
.yz-free-v1__media-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__process-grid,
.yz-free-v1__service-grid,
.yz-free-v1__trust-grid,
.yz-free-v1__tailor-method-grid,
.yz-free-v1__tailor-required-grid,
.yz-free-v1__tailor-size-grid,
.yz-free-v1__tailor-pattern-grid,
.yz-free-v1__tailor-leadtime-grid,
.yz-free-v1__coupon-step-grid,
.yz-free-v1__purchase-state-grid,
.yz-free-v1__genpin-delivery-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.yz-free-v1__hakkake-type-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.yz-free-v1__hakkake-gallery {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__hakkake-overview-grid,
.yz-free-v1__service-intro {
grid-template-columns: 1fr;
}
.yz-free-v1 [class*="-card"],
.yz-free-v1__case-item,
.yz-free-v1__flow-item {
min-width: 0;
padding: 19px;
border: 1px solid var(--yz-line);
background: #fff;
}
.yz-free-v1 a[class*="-card"] {
display: block;
color: inherit !important;
text-decoration: none;
transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.yz-free-v1 a[class*="-card"]:hover,
.yz-free-v1 a[class*="-card"]:focus {
border-color: #b9c7d7;
box-shadow: var(--yz-shadow);
transform: translateY(-2px);
}
.yz-free-v1 [class*="-card"] h3,
.yz-free-v1 [class*="-card"] h4 {
margin: 0 0 8px;
font-size: 17px;
line-height: 1.55;
}
.yz-free-v1 [class*="-card"] p:last-child {
margin-bottom: 0;
}
.yz-free-v1__nav-link,
.yz-free-v1__related-link,
.yz-free-v1__page-link {
position: relative;
display: block;
min-height: 60px;
padding: 16px 44px 16px 17px;
border: 1px solid var(--yz-line);
border-left: 4px solid var(--yz-blue-gray);
background: #fff;
color: var(--yz-navy) !important;
font-weight: bold;
line-height: 1.55;
text-decoration: none;
}
.yz-free-v1__nav-link::after,
.yz-free-v1__related-link::after,
.yz-free-v1__page-link::after {
position: absolute;
top: 50%;
right: 16px;
color: #8294a9;
transform: translateY(-50%);
}
.yz-free-v1__nav-link::after {
content: "¢­";
}
.yz-free-v1__related-link::after,
.yz-free-v1__page-link::after {
content: "¢ª";
}
.yz-free-v1__nav-link:hover,
.yz-free-v1__related-link:hover,
.yz-free-v1__page-link:hover {
background: #f3f6fa;
}
.yz-free-v1__button-list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.yz-free-v1__button,
.yz-free-v1 [class*="-form-button"],
.yz-free-v1__purchase-genpin-button,
.yz-free-v1__tailor-form-button {
display: inline-flex;
min-height: 48px;
align-items: center;
justify-content: center;
padding: 13px 22px;
border: 1px solid var(--yz-navy);
background: var(--yz-navy);
color: #fff !important;
font-weight: bold;
line-height: 1.55;
text-align: center;
text-decoration: none;
transition: background .2s ease, transform .2s ease;
}
.yz-free-v1__button:hover,
.yz-free-v1 [class*="-form-button"]:hover,
.yz-free-v1__purchase-genpin-button:hover,
.yz-free-v1__tailor-form-button:hover {
background: #254d7c;
transform: translateY(-1px);
}
.yz-free-v1__flow,
.yz-free-v1__flow-list {
counter-reset: yz-flow;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
margin: 18px 0;
padding: 0;
list-style: none;
}
.yz-free-v1__flow li,
.yz-free-v1__flow-item {
counter-increment: yz-flow;
position: relative;
min-height: 70px;
margin: 0;
padding: 19px 16px 17px 58px;
}
.yz-free-v1__flow li::before,
.yz-free-v1__flow-item::before {
content: counter(yz-flow);
position: absolute;
top: 17px;
left: 16px;
display: flex;
width: 30px;
height: 30px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: var(--yz-navy);
color: #fff;
font-weight: bold;
line-height: 1;
}
.yz-free-v1 [class*="-number"] {
display: inline-flex;
min-width: 31px;
height: 31px;
align-items: center;
justify-content: center;
margin-right: 8px;
border-radius: 50%;
background: var(--yz-navy);
color: #fff !important;
font-weight: bold;
line-height: 1;
}
.yz-free-v1__table-wrap,
.yz-free-v1 [class*="-table-wrap"],
.yz-free-v1 [class*="-price-wrap"],
.yz-free-v1 [class*="-menu-wrap"],
.yz-free-v1 [class*="-rank-wrap"] {
width: 100%;
margin-top: 16px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.yz-free-v1__table,
.yz-free-v1 [class*="-table"] {
width: 100%;
min-width: 620px;
border-collapse: collapse;
border-spacing: 0;
background: #fff;
}
.yz-free-v1__table th,
.yz-free-v1__table td,
.yz-free-v1 [class*="-table"] th,
.yz-free-v1 [class*="-table"] td {
padding: 13px 15px;
border: 1px solid #d7dde5;
line-height: 1.65;
vertical-align: top;
}
.yz-free-v1__table th,
.yz-free-v1 [class*="-table"] th {
background: #f2f4f7;
color: var(--yz-navy);
font-weight: bold;
text-align: left;
}
.yz-free-v1__price-table td,
.yz-free-v1__aftercare-menu-table td,
.yz-free-v1__pearl-price-table td {
text-align: right;
white-space: nowrap;
}
.yz-free-v1__table-highlight {
background: #fff9dc !important;
}
.yz-free-v1__media,
.yz-free-v1__hakkake-overview {
margin: 18px 0;
padding: 14px;
border: 1px solid #e0e4e9;
background: #fafafa;
}
.yz-free-v1__media img,
.yz-free-v1__hakkake-overview img {
margin: 0 auto;
}
.yz-free-v1__media figcaption,
.yz-free-v1__hakkake-overview figcaption {
margin-top: 9px;
color: var(--yz-muted);
font-size: 13px;
line-height: 1.6;
text-align: center;
}
.yz-free-v1__placeholder,
.yz-free-v1 [class*="-placeholder"] {
display: flex;
min-height: 150px;
align-items: center;
justify-content: center;
padding: 20px;
border: 1px dashed #bcc5cf;
background: #f3f5f7;
color: #718096;
text-align: center;
}
.yz-free-v1__back {
margin: 24px 0 0;
text-align: right;
}
.yz-free-v1__back a {
display: inline-block;
padding: 7px 0 7px 18px;
text-decoration: none;
}
.yz-free-v1__back a::before {
content: "¢¬";
margin-right: 6px;
}
.yz-free-v1__tailor-form-box,
.yz-free-v1__genpin-form-box,
.yz-free-v1__pearl-form-box,
.yz-free-v1__aftercare-form-box {
margin-top: 20px;
padding: 24px;
border: 1px solid var(--yz-line-dark);
border-top: 4px solid var(--yz-navy);
background: #fff;
text-align: center;
}
.yz-free-v1__tailor-size-label {
display: block;
margin-bottom: 8px;
color: var(--yz-navy);
font-size: 25px;
font-weight: bold;
line-height: 1.3;
}
.yz-free-v1__tailor-leadtime-card {
text-align: center;
}
.yz-free-v1__tailor-leadtime-card strong {
display: block;
margin-top: 5px;
color: var(--yz-navy);
font-size: 21px;
}
.yz-free-v1__process-card {
position: relative;
padding-top: 20px;
}
.yz-free-v1__price-table th {
width: 62%;
}
.yz-free-v1__price-title {
margin: 0 0 10px;
color: var(--yz-navy);
font-size: 19px;
}
.yz-free-v1__master-section,
.yz-free-v1__master-subsection {
margin-bottom: 13px;
border: 1px solid var(--yz-line);
background: #fff;
}
.yz-free-v1__master-section > summary,
.yz-free-v1__master-subsection > summary {
position: relative;
padding: 15px 46px 15px 17px;
cursor: pointer;
list-style: none;
color: var(--yz-navy);
font-weight: bold;
line-height: 1.55;
}
.yz-free-v1__master-section > summary::-webkit-details-marker,
.yz-free-v1__master-subsection > summary::-webkit-details-marker {
display: none;
}
.yz-free-v1__master-section > summary::after,
.yz-free-v1__master-subsection > summary::after {
content: "¡Ü";
position: absolute;
top: 50%;
right: 16px;
color: var(--yz-blue-gray);
font-size: 20px;
font-weight: normal;
transform: translateY(-50%);
}
.yz-free-v1__master-section[open] > summary::after,
.yz-free-v1__master-subsection[open] > summary::after {
content: "¡Ý";
}
.yz-free-v1__master-section-body,
.yz-free-v1__master-subsection-body {
padding: 0 16px 18px;
border-top: 1px solid #e5e8ec;
}
.yz-free-v1__master-block {
padding: 17px;
border: 1px solid #e0e4e9;
background: #fafbfc;
}
.yz-free-v1__master-block-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 13px;
}
.yz-free-v1__master-form-url {
color: #315d91;
overflow-wrap: anywhere;
word-break: break-word;
}
.yz-free-v1__master-status {
display: inline-block;
margin-left: 8px;
padding: 2px 7px;
border-radius: 999px;
background: #eef2f6;
color: #66778a;
font-size: 11px;
font-weight: normal;
vertical-align: middle;
}
@media screen and (max-width: 900px) {
.yz-free-v1__process-grid,
.yz-free-v1__service-grid,
.yz-free-v1__trust-grid,
.yz-free-v1__tailor-method-grid,
.yz-free-v1__tailor-required-grid,
.yz-free-v1__tailor-size-grid,
.yz-free-v1__tailor-pattern-grid,
.yz-free-v1__tailor-leadtime-grid,
.yz-free-v1__coupon-step-grid,
.yz-free-v1__purchase-state-grid,
.yz-free-v1__genpin-delivery-grid,
.yz-free-v1__hakkake-type-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.yz-free-v1__hakkake-gallery {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media screen and (max-width: 700px) {
.yz-free-v1 {
margin-top: 14px;
padding: 0 7px;
font-size: 15px;
line-height: 1.85;
}
.yz-free-v1__hero {
padding: 25px 19px 23px;
}
.yz-free-v1__hero h1 {
font-size: 25px;
}
.yz-free-v1__nav,
.yz-free-v1__section,
.yz-free-v1__related {
padding: 22px 17px;
}
.yz-free-v1__nav-title,
.yz-free-v1__section-title,
.yz-free-v1__related-title {
padding-left: 10px;
font-size: 21px;
}
.yz-free-v1 [class*="-grid"],
.yz-free-v1__nav-grid,
.yz-free-v1__related-grid,
.yz-free-v1__media-grid,
.yz-free-v1__button-list,
.yz-free-v1__flow,
.yz-free-v1__flow-list,
.yz-free-v1__master-block-grid,
.yz-free-v1__hakkake-gallery {
grid-template-columns: 1fr;
}
.yz-free-v1 [class*="-card"],
.yz-free-v1__case-item,
.yz-free-v1__flow-item {
padding: 16px 15px;
}
.yz-free-v1__flow li,
.yz-free-v1__flow-item {
padding-left: 55px;
}
.yz-free-v1__table,
.yz-free-v1 [class*="-table"] {
min-width: 560px;
}
.yz-free-v1__tailor-form-box,
.yz-free-v1__genpin-form-box,
.yz-free-v1__pearl-form-box,
.yz-free-v1__aftercare-form-box {
padding: 20px 15px;
}
.yz-free-v1__button,
.yz-free-v1 [class*="-form-button"],
.yz-free-v1__purchase-genpin-button,
.yz-free-v1__tailor-form-button {
width: 100%;
min-width: 0;
}
.yz-free-v1__back {
text-align: left;
}
}
.yz-free-v1__hub-grid,
.yz-free-v1__trust-grid,
.yz-free-v1__service-grid,
.yz-free-v1__guide-strip {
display: grid;
gap: 14px;
}
.yz-free-v1__hub-grid,
.yz-free-v1__trust-grid,
.yz-free-v1__guide-strip {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.yz-free-v1__service-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.yz-free-v1__hub-card {
position: relative;
display: flex;
min-height: 230px;
flex-direction: column;
padding: 24px 22px 21px;
border: 1px solid #d9dee6;
border-top: 4px solid #8fa9c6;
background: #fff;
color: inherit !important;
text-decoration: none;
}
.yz-free-v1__hub-card--primary {
border-top-color: #17345d;
background: #f8fafc;
}
.yz-free-v1__hub-card-kicker {
display: block;
margin-bottom: 8px;
color: #718096;
font-size: 12px;
font-weight: bold;
line-height: 1.55;
letter-spacing: .04em;
}
.yz-free-v1__hub-card-title {
display: block;
margin-bottom: 10px;
color: #17345d;
font-family:
"Yu Mincho",
"Hiragino Mincho ProN",
"Noto Serif JP",
serif;
font-size: 20px;
font-weight: bold;
line-height: 1.55;
}
.yz-free-v1__hub-card-text {
display: block;
color: #536070;
font-size: 14px;
line-height: 1.8;
}
.yz-free-v1__hub-card-action {
display: block;
margin-top: auto;
padding-top: 16px;
color: #315d91;
font-size: 13px;
font-weight: bold;
}
.yz-free-v1__trust-card {
padding: 21px 20px;
border: 1px solid #dce1e7;
background: #fff;
}
.yz-free-v1__trust-card h3 {
margin: 0 0 9px;
color: #17345d;
font-size: 17px;
line-height: 1.55;
}
.yz-free-v1__trust-card p {
margin: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__service-card {
position: relative;
display: block;
min-height: 116px;
padding: 20px 48px 19px 20px;
border: 1px solid #dce1e7;
border-left: 4px solid #8fa9c6;
background: #fff;
color: inherit !important;
text-decoration: none;
}
.yz-free-v1__service-card-title {
display: block;
margin-bottom: 7px;
color: #17345d;
font-size: 17px;
font-weight: bold;
line-height: 1.55;
}
.yz-free-v1__service-card-text {
display: block;
color: #536070;
font-size: 14px;
line-height: 1.8;
}
.yz-free-v1__service-card::after {
content: "¢ª";
position: absolute;
top: 50%;
right: 18px;
color: #8fa9c6;
font-size: 18px;
transform: translateY(-50%);
}
.yz-free-v1__page-link {
min-height: 112px;
}
.yz-free-v1__page-link-kicker {
display: block;
margin-bottom: 5px;
color: #718096;
font-size: 12px;
font-weight: bold;
line-height: 1.5;
}
.yz-free-v1__page-link-title {
display: block;
color: #17345d;
font-size: 16px;
font-weight: bold;
line-height: 1.6;
}
.yz-free-v1__page-link-arrow {
display: none;
}
@media screen and (max-width: 900px) {
.yz-free-v1__hub-grid,
.yz-free-v1__trust-grid,
.yz-free-v1__guide-strip {
grid-template-columns: 1fr;
}
.yz-free-v1__service-grid {
grid-template-columns: 1fr;
}
.yz-free-v1__hub-card {
min-height: 0;
}
}
@media screen and (max-width: 700px) {
.yz-free-v1__hub-card {
padding: 19px 17px 17px;
}
.yz-free-v1__hub-card-title {
font-size: 19px;
}
.yz-free-v1__trust-card {
padding: 17px 16px;
}
.yz-free-v1__service-card {
min-height: 0;
padding: 17px 43px 17px 16px;
}
.yz-free-v1__page-link {
min-height: 0;
}
}
.yz-free-v1__case-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.yz-free-v1__case-item {
position: relative;
min-height: 64px;
padding: 18px 16px 17px 54px;
border: 1px solid #dce1e7;
background: #ffffff;
line-height: 1.65;
}
.yz-free-v1__case-item::before {
content: "✓";
position: absolute;
top: 17px;
left: 17px;
display: flex;
width: 22px;
height: 22px;
align-items: center;
justify-content: center;
border-radius: 50%;
background: #17345d;
color: #ffffff;
font-size: 12px;
font-weight: bold;
line-height: 1;
}
.yz-free-v1__process-grid--four {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.yz-free-v1__process-grid--four .yz-free-v1__process-card {
min-height: 208px;
}
@media screen and (max-width: 900px) {
.yz-free-v1__process-grid--four {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 700px) {
.yz-free-v1__case-grid,
.yz-free-v1__process-grid--four {
grid-template-columns: 1fr;
}
.yz-free-v1__case-item,
.yz-free-v1__process-grid--four .yz-free-v1__process-card {
min-height: 0;
}
}
.yz-free-v1__symptom-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__symptom-card {
position: relative;
padding: 20px;
border: 1px solid #dce1e7;
border-top: 4px solid #8fa9c6;
background: #ffffff;
}
.yz-free-v1__symptom-card--primary {
border-top-color: #17345d;
}
.yz-free-v1__symptom-label {
display: inline-block;
margin: 0 0 8px;
padding: 4px 9px;
border-radius: 999px;
background: #eef2f7;
color: #17345d;
font-size: 12px;
font-weight: bold;
line-height: 1.4;
}
.yz-free-v1__symptom-card h3 {
margin: 0 0 9px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__symptom-card p:last-child {
margin-bottom: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__estimate-box {
padding: 22px;
border: 1px solid #d3dbe4;
border-left: 5px solid #17345d;
background: #ffffff;
}
.yz-free-v1__estimate-main {
margin: 0 0 10px;
color: #17345d;
font-size: 19px;
font-weight: bold;
line-height: 1.6;
}
.yz-free-v1__estimate-box p:last-child {
margin-bottom: 0;
}
@media screen and (max-width: 700px) {
.yz-free-v1__symptom-grid {
grid-template-columns: 1fr;
}
.yz-free-v1__symptom-card,
.yz-free-v1__estimate-box {
padding: 17px 15px;
}
}
.yz-free-v1__mon-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__mon-card {
padding: 20px;
border: 1px solid #dce1e7;
border-top: 4px solid #8fa9c6;
background: #ffffff;
}
.yz-free-v1__mon-card--primary {
border-top-color: #17345d;
}
.yz-free-v1__mon-card h3 {
margin: 0 0 9px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__mon-card p {
margin: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__flow-list {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__flow-item {
padding: 18px;
border: 1px solid #dce1e7;
background: #ffffff;
}
.yz-free-v1__flow-item .yz-free-v1__process-number {
margin-bottom: 12px;
}
.yz-free-v1__flow-item h3 {
margin: 0 0 8px;
color: #17345d;
font-size: 16px;
line-height: 1.55;
}
.yz-free-v1__flow-item p:last-child {
margin: 0;
color: #536070;
font-size: 14px;
line-height: 1.8;
}
@media screen and (max-width: 900px) {
.yz-free-v1__mon-grid {
grid-template-columns: 1fr;
}
.yz-free-v1__flow-list {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 700px) {
.yz-free-v1__flow-list {
grid-template-columns: 1fr;
}
.yz-free-v1__mon-card,
.yz-free-v1__flow-item {
padding: 16px 15px;
}
}
.yz-free-v1__repair-choice-grid,
.yz-free-v1__repair-grid {
display: grid;
gap: 14px;
}
.yz-free-v1__repair-choice-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.yz-free-v1__repair-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.yz-free-v1__repair-choice-card,
.yz-free-v1__repair-card {
padding: 20px;
border: 1px solid #dce1e7;
border-top: 4px solid #8fa9c6;
background: #ffffff;
}
.yz-free-v1__repair-card--primary {
border-top-color: #17345d;
}
.yz-free-v1__repair-choice-label {
display: inline-block;
margin: 0 0 8px;
padding: 4px 9px;
border-radius: 999px;
background: #eef2f7;
color: #17345d;
font-size: 12px;
font-weight: bold;
line-height: 1.4;
}
.yz-free-v1__repair-choice-card h3,
.yz-free-v1__repair-card h3 {
margin: 0 0 9px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__repair-choice-card p:last-child,
.yz-free-v1__repair-card p {
margin-bottom: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__price-title {
margin: 26px 0 10px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__dimension-link {
position: relative;
display: block;
padding: 20px 52px 20px 20px;
border: 1px solid #d3dbe4;
border-left: 5px solid #8fa9c6;
background: #ffffff;
text-decoration: none;
}
.yz-free-v1__dimension-link strong {
display: block;
margin-bottom: 6px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__dimension-link span {
display: block;
color: #536070;
font-size: 14px;
line-height: 1.8;
}
.yz-free-v1__dimension-link::after {
content: "¢ª";
position: absolute;
top: 50%;
right: 20px;
color: #8fa9c6;
font-size: 20px;
transform: translateY(-50%);
}
@media screen and (max-width: 900px) {
.yz-free-v1__repair-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 700px) {
.yz-free-v1__repair-grid,
.yz-free-v1__repair-choice-grid {
grid-template-columns: 1fr;
}
.yz-free-v1__repair-card,
.yz-free-v1__repair-choice-card {
padding: 17px 15px;
}
.yz-free-v1__dimension-link {
padding: 17px 44px 17px 15px;
}
}
.yz-free-v1__pearl-request-choice {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__pearl-request-card {
padding: 20px;
border: 1px solid #dce1e7;
background: #ffffff;
}
.yz-free-v1__pearl-request-card--current {
border-top: 4px solid #17345d;
}
.yz-free-v1__pearl-request-card--link {
position: relative;
border-top: 4px solid #8fa9c6;
color: inherit !important;
text-decoration: none;
}
.yz-free-v1__pearl-request-label {
display: inline-block;
margin: 0 0 9px;
padding: 4px 10px;
border-radius: 999px;
background: #eef2f7;
color: #17345d;
font-size: 12px;
font-weight: bold;
line-height: 1.4;
}
.yz-free-v1__pearl-request-card h3 {
margin: 0 0 9px;
color: #17345d;
font-size: 18px;
line-height: 1.55;
}
.yz-free-v1__pearl-request-card p {
margin: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__pearl-request-card--link::after {
content: "¢ª";
position: absolute;
right: 18px;
bottom: 15px;
color: #8fa9c6;
font-size: 18px;
}
.yz-free-v1__pearl-price-wrap {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.yz-free-v1__pearl-price-table {
width: 100%;
min-width: 720px;
border-collapse: collapse;
background: #ffffff;
}
.yz-free-v1__pearl-price-table th,
.yz-free-v1__pearl-price-table td {
padding: 12px 14px;
border: 1px solid #d7dde5;
line-height: 1.6;
}
.yz-free-v1__pearl-price-table thead th {
background: #f4f6f8;
color: #17345d;
font-weight: bold;
text-align: center;
}
.yz-free-v1__pearl-price-table tbody th {
width: 25%;
background: #fafbfc;
color: #17345d;
text-align: left;
}
.yz-free-v1__pearl-price-table td {
text-align: right;
white-space: nowrap;
}
.yz-free-v1__pearl-price-table td:last-child {
color: #536070;
font-size: 13px;
text-align: left;
white-space: normal;
}
.yz-free-v1__pearl-flow {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
.yz-free-v1__pearl-flow-card {
padding: 18px;
border: 1px solid #dce1e7;
background: #ffffff;
}
.yz-free-v1__pearl-flow-card h3 {
margin: 0 0 8px;
color: #17345d;
font-size: 17px;
line-height: 1.55;
}
.yz-free-v1__pearl-flow-card p:last-child {
margin: 0;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__pearl-form-box {
margin-top: 18px;
padding: 24px;
border: 1px solid #cfd6df;
border-top: 4px solid #17345d;
background: #ffffff;
text-align: center;
}
.yz-free-v1__pearl-form-box h3 {
margin: 0 0 10px;
color: #17345d;
font-size: 20px;
line-height: 1.55;
}
.yz-free-v1__pearl-form-box p {
margin: 0 0 16px;
color: #536070;
font-size: 14px;
line-height: 1.85;
}
.yz-free-v1__pearl-form-button {
display: inline-block;
min-width: 280px;
padding: 14px 24px;
border: 1px solid #17345d;
background: #17345d;
color: #ffffff !important;
font-weight: bold;
line-height: 1.6;
text-decoration: none;
}
.yz-free-v1__pearl-form-button:hover,
.yz-free-v1__pearl-form-button:focus {
opacity: 0.88;
}
.yz-free-v1__pearl-related-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 14px;
}
@media screen and (max-width: 800px) {
.yz-free-v1__pearl-related-grid {
grid-template-columns: 1fr;
}
}
@media screen and (max-width: 700px) {
.yz-free-v1__pearl-request-choice,
.yz-free-v1__pearl-flow {
grid-template-columns: 1fr;
}
.yz-free-v1__pearl-request-card,
.yz-free-v1__pearl-flow-card,
.yz-free-v1__pearl-form-box {
padding: 17px 15px;
}
.yz-free-v1__pearl-form-button {
box-sizing: border-box;
width: 100%;
min-width: 0;
}
}
/* f071-f074 Ȭ³Ý¿§¸«ËÜ */
.yz-free-v1__hakkake-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.yz-free-v1__hakkake-type-card{display:block;position:relative;padding:18px 16px;border:1px solid #dce1e7;background:#fff;color:inherit!important;text-decoration:none}.yz-free-v1__hakkake-type-card--current{border-top:4px solid #17345d;background:#f8fafc}.yz-free-v1__hakkake-type-card:not(.yz-free-v1__hakkake-type-card--current){border-top:4px solid #8fa9c6}.yz-free-v1__hakkake-type-kicker{display:block;margin-bottom:5px;color:#708095;font-size:12px;font-weight:bold;line-height:1.4}.yz-free-v1__hakkake-type-title{display:block;color:#17345d;font-size:16px;font-weight:bold;line-height:1.55}.yz-free-v1__hakkake-type-card:not(.yz-free-v1__hakkake-type-card--current)::after{content:"¢ª";position:absolute;right:13px;bottom:10px;color:#8fa9c6;font-size:17px}.yz-free-v1__hakkake-overview-grid{display:grid;gap:16px}.yz-free-v1__hakkake-overview{margin:0;padding:12px;border:1px solid #dce1e7;background:#fff}.yz-free-v1__hakkake-overview a{display:block}.yz-free-v1__hakkake-overview img{display:block;width:100%;height:auto}.yz-free-v1__hakkake-image-fallback{display:none;align-items:center;justify-content:center;min-height:180px;padding:18px;background:#f4f6f8;color:#718096;text-align:center;font-size:13px;line-height:1.7}.yz-free-v1__hakkake-overview figcaption{margin-top:9px;color:#536070;text-align:center;font-size:12px;line-height:1.6}.yz-free-v1__hakkake-gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.yz-free-v1__hakkake-swatch{margin:0;overflow:hidden;border:1px solid #dce1e7;background:#fff}.yz-free-v1__hakkake-swatch a{display:block;color:inherit!important;text-decoration:none}.yz-free-v1__hakkake-swatch-image{position:relative;overflow:hidden;aspect-ratio:1/1;background:#f4f6f8}.yz-free-v1__hakkake-swatch-image img{display:block;width:100%;height:100%;object-fit:cover}.yz-free-v1__hakkake-swatch-fallback{display:none;align-items:center;justify-content:center;position:absolute;inset:0;background:linear-gradient(145deg,#f8f9fb 0%,#edf0f4 55%,#e2e7ed 100%);color:#8190a1;text-align:center;font-size:12px;line-height:1.6}.yz-free-v1__hakkake-swatch-number{display:block;padding:9px 8px 10px;border-top:1px solid #e3e7ec;color:#17345d;text-align:center;font-size:14px;font-weight:bold;line-height:1.4}.yz-free-v1__hakkake-order-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.yz-free-v1__hakkake-order-card{padding:20px;border:1px solid #dce1e7;background:#fff}.yz-free-v1__hakkake-order-card h3{margin:0 0 8px;color:#17345d;font-size:17px;line-height:1.55}.yz-free-v1__hakkake-order-card p{margin:0;color:#536070;font-size:14px;line-height:1.85}.yz-free-v1__hakkake-order-card p+p{margin-top:8px}@media screen and (max-width:900px){.yz-free-v1__hakkake-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.yz-free-v1__hakkake-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}}@media screen and (max-width:700px){.yz-free-v1__hakkake-type-grid,.yz-free-v1__hakkake-order-guide{grid-template-columns:1fr}.yz-free-v1__hakkake-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.yz-free-v1__hakkake-type-card,.yz-free-v1__hakkake-order-card{padding:16px 14px}.yz-free-v1__hakkake-swatch-number{font-size:13px}.yz-free-v1__hakkake-image-fallback{min-height:120px}}