@charset "shift_jis";
/* CSS Document */

/*-------------------------------------
	page
-------------------------------------*/
@media screen and (min-width:1024px){
.pc-only { display: block!important;}
.sp-only { display: none!important;}
}
@media screen and (max-width:1023.9px) {
.pc-only { display: none!important;}
.sp-only { display: block!important;}
}


.mb10{margin-bottom: 10px!important;}
.mb20{margin-bottom: 20px!important;}
.mb30{margin-bottom: 30px!important;}
.mb40{margin-bottom: 40px!important;}
.mb50{margin-bottom: 50px!important;}

.mt10{margin-top: 10px!important;}
.mt20{margin-top: 20px!important;}
.mt30{margin-top: 30px!important;}
.mt40{margin-top: 40px!important;}
.mt50{margin-top: 50px!important;}

/* top */
#MainVisual { position: relative; overflow: hidden; z-index: 1; }
#MainVisual li { margin: 0 0.3rem; text-align: center;}
#MainVisual li a { display: block;}
#MainVisual li img { width: 100%;}
#MainVisual a:hover .enlargeImg img { -webkit-transform: scale(1.05); transform: scale(1.05);}

#MainVisual .slick-arrow {
    position: absolute;
    top: 0;
    left: 0;
    width: 5rem;
    height: 100%;
    font-size: 0;
    background: rgba(255, 255, 255, 0.3) url("../../images/common/arrowLW.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    opacity: 0;
    z-index: 10;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
#MainVisual .slick-arrow:hover { opacity: 1;}
#MainVisual .slick-next { right: 0; left: auto; background-image: url("../../images/common/arrowRW.svg");}

#MainVisual .slick-dots { position: absolute; left: 50%; bottom: 1rem; z-index: 10; -webkit-transform: translateX(-50%); transform: translateX(-50%); }
#MainVisual .slick-dots li { display: inline-block; margin: 0 1px; width: auto; height: auto; min-height: 0; font-size: 0; }
#MainVisual .slick-dots button { display: block; width: 18px; height: 18px; font-size: 0; background: none; border: none; cursor: pointer; opacity: .6; outline: none; transition: all 0.3s ease; }
#MainVisual .slick-dots button:before,
#MainVisual .slick-dots button:after { content: ""; display: block; position: absolute; top: 4px; left: 4px; width: 10px; height: 10px; background: #FFF; border-radius: 8px; opacity: .7; transition: all 0.3s ease; }
#MainVisual .slick-dots button:after { background: none; border: 0.5px solid #FFF;}
#MainVisual .slick-dots button:hover { opacity: 1; }
#MainVisual .slick-dots button:hover:before, 
#MainVisual .slick-dots button:hover:after,
#MainVisual .slick-dots .slick-active button,
#MainVisual .slick-dots .slick-active button:before { opacity: 1 !important; }
#MainVisual .slick-dots .slick-active button:after { opacity: 1 !important; transform: scale(2);}

body > main.top > section { padding: 2rem !important; width: 100%;}
body > main.top > section.gray { margin: 1rem 0; padding: 3rem 2rem !important;}

#helpLink { text-align: center;}
#helpLink a {
    display: inline-block;
    padding: 2rem 6rem 2rem 2rem;
    line-height: 1.4;
    text-align: left;
    text-decoration: none;
    background: #FFFFA6 url(/images/common/arrowRt.svg) no-repeat;
    background-position: right 2rem center;
    background-size: 2rem;
}
#helpLink p { margin: 0 0 1rem; font-size: min(1.8rem, 3.2vw);}
#helpLink small { display: block; margin: 0.5rem 0 0; font-size: 85%;}
#helpLink img { margin: 0 1rem 0 0; width: 3rem; vertical-align: middle;}
#helpLink strong { vertical-align: middle;}

@media (hover: hover) {
#helpLink a:hover { background-position: right 1rem center; opacity: .6;}
}

.form-flex_box { margin: 4rem 0 1.5rem;}
#form1{ display: flex; margin: 0 auto; width: 80%;}
#sbox { padding:0 10px; width: max(calc(100% - 80px), calc(100% - 15vw)); height:50px; font-size:1.6rem; background:#fff; border-radius:2px 0 0 2px;}
#sbtn {
    width: max(80px, 15vw);
    height:50px;
    color:#fff;
    font-size:14px;
    font-weight:bold;
    background:#013161;
    border:none;
    border-radius:0 2px 2px 0;
    outline: none;
    transition: .3s;
}
.search__point { margin: 0 auto 2rem; width: 80%;}
.keyword_up h2 { text-align: center;}

@media (hover: hover) {
    #sbtn:hover { background: #000; cursor: pointer;}
}

#infoList { /*display: inline-block;*/ margin: 0 auto; padding: 1rem 0 0; border-top: 1px solid #000; border-bottom: 1px solid #000;}
#infoList li { margin: 0 0 1rem;}
#infoList a { font-size: 1.6rem; line-height: 1.2; text-decoration: none;}
#infoList a:hover { text-decoration: underline;}
#infoList span { width: calc(100% - 10rem);}
#infoList .date { width: 10rem;}

#recommendList { overflow: hidden;}
#recommendSlide { position: relative; margin: 0 -2rem 0 0;}
#recommendSlide .slick-list { padding: 0 20% 0 0;}
#recommendSlide .slick-slider { padding: 0 0 7.4rem; width: 120%;}
#recommendSlide .slick-slide { margin: 0 2rem 0 0;}
#recommendSlide .slick-slide a { text-decoration: none;}
#recommendSlide .slick-slide a:hover { text-decoration: underline;}
#recommendSlide .slick-slide figcaption { margin: 0.5rem 0 0; font-size: 1.4rem; line-height: 1.4;}

#recommendSlide .slick-arrow {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 4.4rem;
    height: 4.4rem;
    font-size: 0;
    background: #FFF url("../../images/common/arrowLt.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    border-radius: 4rem;
    box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
#recommendSlide .slick-arrow:hover { box-shadow: 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
#recommendSlide .slick-arrow:after { content: ""; position: absolute; top: -0.2rem; left: -0.2rem; width: calc(100% + 0.4rem); height: calc(100% + 0.4rem); border: 1px solid #013161; border-radius: 4rem; transition: all 0.3s ease;}
#recommendSlide .slick-arrow:hover:after { top: 0.2rem; left: 0.2rem; width: calc(100% - 0.4rem); height: calc(100% - 0.4rem);}
#recommendSlide .slick-next { left: 5.9rem; background-image: url("../../images/common/arrowRt.svg");}
#recommendSlide .slick-disabled { opacity: .5; pointer-events: none;}

#recommendSlide .slick-dots { position: absolute; bottom: 2.2rem; left: 13rem; width: calc(100vw - 17rem);}
#recommendSlide .slick-dots li { flex-grow: 1; pointer-events: none;}
#recommendSlide .slick-dots button { display: block; position: relative;width: 100%; height: 2px; font-size: 0; background: rgba(1, 49, 97, 0.2); border: none; cursor: pointer; outline: none;}
#recommendSlide .slick-dots button:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #013161; transition: all 0.3s ease;}
#recommendSlide .slick-dots .slick-active ~ li button:after { width: 0;}

#recommendSlide.itemList { margin: 0;}
#recommendSlide.itemList .slick-list { padding: 0;}
#recommendSlide.itemList li { width: auto;}
#recommendSlide.itemList .price { margin: 0; padding: 0; border: none;}
#recommendSlide.itemList .slick-slider { margin: 0; width: 100%;}
#recommendSlide.itemList .slick-list { width: 100%; overflow: hidden;}
#recommendSlide.itemList .slick-slide a:hover { text-decoration: none;}
#recommendSlide.itemList .slick-dots { width: calc(100% - 18rem);}
#recommendSlide.itemList .slick-dots li { margin-left: 0; margin-right: 0;}

#keywordList { margin: 0 -1.4rem 1.6rem;}
.gray #keywordList { margin: 0 -0.7rem -1.4rem;}
#keywordList li { margin: 0 0.7rem 1.4rem 0.7rem; width: calc(33.33% - 1.4rem);}
#keywordList li.long { width: calc(66.666% - 2rem);}
#keywordList a {
    align-items: center;
    justify-content: center;
    padding: 0.6rem 1.5rem;
    width: 100%;
    height: 100%;
    color: #000 !important;
    font-size: 1.6rem;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    background: #FFF;
    border: 1px solid #000;
    border-radius: 4rem;
}
@media (hover: hover) {
#keywordList a:hover { opacity: .6;}
}

#keywordList + .center .btn { margin: 0 2rem 2rem; width: min(30rem, 60%);}

/*20230131～追加 イベント用キーワード検索 ここから*/

#eventList { text-align: center;}
#eventList li { display: inline-block; margin: 0 1.2rem 1.2rem 0;}
#eventList a { display: block; padding: 0.6rem 1.5rem; color: #fff !important; font-size: 1.6rem; line-height: 1; text-decoration: none; background: #f0a448; border: 1px solid #f0a448; border-radius: 4rem;}
#eventList a:hover { opacity: .6;}

/*20230131～追加 イベント用キーワード検索 ここまで*/

#colorSearch { margin: 0 0 3rem;}
#colorSearch ul { gap: 5vw;}
#colorSearch li { width: calc(16.66% - 4.1666vw);}
#colorSearch .btn { padding: 0; min-width: 0; aspect-ratio: 1;}
#colorSearch a { display: block; width: 100%; height: 100%; min-width: 0; box-shadow: 0 0 0 1.5vw #FFF inset, 0 0.2rem 1rem rgba(1, 49, 97, 0.2); aspect-ratio: 1;}

#colorSearch a.btn.btnCred { background: red;}
#colorSearch a.btn.btnCpink { background: pink;}
#colorSearch a.btn.btnCyellow { background: gold;}
#colorSearch a.btn.btnCgreen { background: yellowgreen;}
#colorSearch a.btn.btnCblue { background: deepskyblue;}
#colorSearch a.btn.btnCpurple { background: mediumpurple;}
#colorSearch a.btn.btnCbrown { background: saddlebrown;}
#colorSearch a.btn.btnCgray { background: silver;}
#colorSearch a.btn.btnCwhite { background: white; box-shadow: 0 0 0 1.5vw #FFF inset, 0 0 0 calc(1.5vw + 1px) silver inset, 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}
#colorSearch a.btn.btnCblack { background: black;}
#colorSearch a.btn.btnCsilver { background: linear-gradient(to bottom right, silver 10%, #FFF 50%, silver 90%);}
#colorSearch a.btn.btnCgold { background: linear-gradient(to bottom right, darkgoldenrod 10%, #FFF 50%, darkgoldenrod 90%);}

@media (hover: hover) {
#colorSearch a.btn:hover { box-shadow: 0 0 0 1.5vw #FFF inset, 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
#colorSearch a.btn.btnCwhite:hover { box-shadow: 0 0 0 1.5vw #FFF inset, 0 0 0 calc(1.5vw + 1px) silver inset, 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
}

body > main > section:nth-child(2) .topBtnTitle { margin: 0 0 2rem !important; width: 100% !important;}
#topBtnList { gap: 2rem; margin: 0 0 6rem;}
#topBtnList .btn { width: calc(50% - 1rem); min-width: 0; font-size: min(1.8rem, 2.4vw);}
#topBtnList .btn.white .icon.arrowR { width: min(1.8rem, 2.4vw); height: min(1.8rem, 2.4vw);}

#topNavBtn { gap: 2rem;}
#topNavBtn li { width: calc(33.333% - 1rem);}
#topNavBtn .btn {
    align-items: center;
    justify-content: center;
    padding: 1rem;
    width: 100%;
    min-width: 0;
    background: #FFF url(/images/common/arrowRt.svg) no-repeat;
    background-position: right 1.5vw center;
    background-size: min(3vw, 4rem);
    aspect-ratio: 1;
}
#topNavBtn img { width: 100%; max-width: 24rem;}
#topNavBtn p { margin: 2rem 0 0; font-size: 1.4rem; line-height: 1.4;}

@media (hover: hover) {
#topNavBtn .btn:hover { background-position: right 1vw center;}
}
#categoryList .categoryL h3 a { text-decoration: none;}
#categoryList .categoryL h3 a:hover { text-decoration: underline;}
#categoryList .categoryL figure { margin: 0 1rem 0 0; width: 5rem; height: 5rem; border-radius: 5rem; overflow: hidden;}
#categoryList .categoryL span { width: calc(100% - 6rem);}
#categoryList .categoryM { display: none;}

.brandTitle { padding: 0 0 5px; font-size: 1.6rem; border-bottom: 1px solid #000;}

.brandList { margin: 0 -2rem 2rem;}
.brandList li { padding: 1rem 2rem; width: 50%; }
.brandList li:nth-child(2n-1) { border-right: 1px solid #CCC;}
.brandList li a { font-size: 1.4rem; text-decoration: none;}
.brandList li a:hover { text-decoration: underline;}

.tabTop h2 { margin-top: 0 !important;}
.tabTop .tabChange { margin-bottom: 0.5rem;}
.tabTop .tabChange li {
    margin: 0 1rem 1.5rem;
    padding: 0.7rem 1rem;
    color: #013161;
    font-size: 1.6rem;
    line-height: 1.2;
    text-align: center;
    background: #E6EAEF;
    border-radius: 0.3rem;
    cursor: pointer;
    transition: all ease 0.3s;
}

.tabTop .tabChange li.select { color: #FFF !important; background: #013161 !important; cursor: default;}
.tabs { display: none; margin: 0;}
.tabs li:nth-child(6) ~ li { display: none;}

.tabTop .itemList ul { margin: 0 -1rem 1rem;}
.tabTop .itemList .enlargeImg { margin: 0;}
.tabTop .itemList h3 + p { margin: 0.5rem 0;}
.tabTop figcaption:last-child .price { margin: 0; padding: 0; border: none;}

@media (hover: hover) {
.tabTop .tabChange li:hover { background: rgba(1, 49, 97, 0.2);}
.tabTop .itemList a:hover { text-decoration: none;}
}

#topStyleList .flexList figcaption { font-weight: 900; text-align: center;}
#topStyleList .flexList figcaption img { margin: -0.4rem 0 0 0.5rem; width: 1.5rem; vertical-align: middle;}

@media (hover: hover) {
#topStyleList .flexList a:hover { text-decoration: none;}
#topStyleList .flexList a:hover figcaption img { transform: translateX(0.8rem);}
}
    
/* category */
#catFlex { margin: 1rem 0 0;}
#catSide { padding: 0 2rem; width: 100%;}
#catSide .sideSearch { margin: 1rem 0 0;}
#catSide .acd { position: relative; padding: 1rem 3rem 1rem 1rem; cursor: pointer;}
#catSide .acd:after { content: ""; display: block; position: absolute; top: 50%; right: 1rem; margin: -0.8rem 0 0; width: 1.8rem; height: 1.8rem; background: url("../../images/common/arrowDBt.svg") no-repeat; background-size: contain; transition: all 0.3s ease;}
#catSide .acd.open:after { transform: scale(1,-1);}
#catSide .acd.sideTitle { color: #FFF; background: rgba(1, 49, 97, 0.5);}
#catSide .acd.sideTitle:after { right: 1rem; background-image: url("../../images/common/arrowDWt.svg");}
#catSide a { text-decoration: none;}
#catSide .sideDd a:hover { text-decoration: underline;}
#catSide .sideDt { border-bottom: 1px solid #000;}
#catSide .sideDd { margin: 0 -2rem 0 0; padding: 1rem 0 0 1rem;}
#catSide .sideDd.prices { align-items: center; margin: 0 0 1rem;}
#catSide .sideDd.prices input { margin: 0 1rem; width: calc(50% - 3.5rem);}
#catSide .sideDd.prices input:first-child { margin-left: 0;}
#catSide .sideDd ul { padding: 1rem 0 0;}
#catSide .sideDd li,
#catSide .sideDd label { display: inline-block;margin: 0 2rem 1rem 0;}
#catSide .center { padding: 2rem 0;}

#catSide .sideInput { padding: 1rem 0 0;}
#catSide .sideExample { margin: 0 -1rem 0 0;}
#catSide .sideExample span { display: inline-block; margin: 0 1rem 0.5rem 0;}

#catMain { width: 100%;}
#catMain .categoryL a { align-items: center; text-decoration: none;}
#catMain .categoryL a:hover { text-decoration: underline;}

.paged { margin: 2rem 0;}

.pager { padding: 0 0 1rem; text-align: center; border-bottom: 1px solid #000;}
.pager li { display: inline-block;margin: 0 0.3rem;vertical-align: middle;}
.pager a { display: block; width: 3rem; line-height: 3rem; text-align: center ;text-decoration: none; border-radius: 5rem;}
.pager a.current { color: #FFF; background: #000;}
.pager a:hover { color: #013161; background: rgba(1, 49, 97, 0.1);}
.pager a.disabled { pointer-events: none;}
.pager.bottom { margin: 0; padding: 1rem 0 0; border-bottom: none; border-top: 1px solid #000;}

.sorting { align-items: center; margin: 1rem 0 2rem; padding: 0 0 0 2rem; background: url("../../images/common/icon-adjust.svg") left center no-repeat;}
.sorting p { padding: 0 0 0 1rem; width: 33.33%; text-align: right;}
.sorting span { display: none;}
.sorting select { width: 100%;}

/*.itemList ul { margin: 0 -1rem -2rem;}*/
.itemList ul { margin: 0 auto -2rem;}
.itemList li { margin: 0 1rem 2rem; width: calc(50% - 2rem);}
.itemList li a { text-decoration: none;}
.itemList li .enlargeImg { align-items: end; justify-content: center; width: 100%; height: 20rem; text-align: center;}
.itemList li h3 { margin: 1rem 0 0.5rem; font-size: min(3.5vw, 1.6rem);}
.itemList li .icons { position: absolute; top: 0; left: 0; margin: 0; width: 100%; z-index: 1;}
.itemList li .icons .icon { display: block; padding: 0.2rem 0.5rem; width: 100%; color: #FF00A6; font-size: 1.4rem; text-align: center; background: rgba(255, 255, 255, 0.5);}
.itemList li .icons .icon:empty { display: none;}
.itemList li div,
.itemList li p { margin: 0.5rem 0 0; font-size: min(3.5vw, 1.6rem);}
.itemList li p img { position: relative; top: -0.2rem; margin: 0 0.2rem 0 0; width: 2rem; vertical-align: middle;}

/* detail */
body > main.detail > section { padding: 2rem !important; width: 100%;}
.detail section:last-of-type { padding-bottom: 4rem;}
.detail h2 { text-align: center;}

.detail .itemList ~ .center { margin: 2rem 0 0;}
.detail .flexList.coordinate li { width: calc(50% - 1rem);}
.detail .flexList.coordinate figcaption { display: block;}

#detailTop .slick-arrow {
    position: absolute;
    top: 40%;
    left: 0;
    width: 20%;
    height: 20%;
    font-size: 0;
    background: rgba(255, 255, 255, 0.3) url("../../images/common/arrowLW.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    opacity: 0;
    z-index: 10;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
#detailTop .slick-arrow:hover { opacity: 1;}
#detailTop .slick-arrow.slick-disabled{ opacity: 0; pointer-events: none;}
#detailTop .slick-next { right: 0; left: auto; background-image: url("../../images/common/arrowRW.svg");}
#detailSlide { overflow: hidden;}

#mainSlide { margin: 0 0 1rem;}
#mainSlide li { text-align: center;}
#mainSlide li img { max-height: 80vw;}
#navSlide { margin: 0 0 2rem; width: 120%;}
#navSlide li img { max-height: 10rem;}
#navSlide .slick-slide { margin: 0 1rem 0 0; min-width: 10rem; text-align: center; cursor: pointer;}
#navSlide .slick-slide img {transition: all 0.3s ease;}
#navSlide .slick-arrow { top: 0; width: 10%; height: 100%; opacity: .6;}
#navSlide .slick-next { right: 17%;}
#navSlide .slick-active ~ .slick-active img { opacity: 1;}
#navSlide .slick-slide:hover img { opacity: .8;}
#navSlide .slick-active img { opacity: .6;}

#detailCont h1 { font-size: 2.6rem;}
#detailCont h1 small { display: block;}
#detailCont .price { margin: 0 0 1rem; font-size: 1.8rem;}
#detailCont .price strong { font-size: 2rem;}
#detailCont dl { margin: 0 0 1rem;}
#detailCont dt,
#detailCont dd { margin: 0 0 1rem; width: 6rem;}
#detailCont dd { width: calc(100% - 6rem);}
#detailCont p { margin: 0 0 1rem;}
#detailCont .addBtn { margin: 2rem 0 0;}
#detailCont .btn { display: block; margin: 1rem 0 0; font-size: 1.8rem; width: 100%;}
#detailCont .btn img { position: relative; top: -2px; margin: 0 0.5rem 0 0; vertical-align: middle;}

#detailText { margin: 3rem 0 0;}

/* list */
#cartSteps { margin: 0 -1rem 2rem;}
#cartSteps li { margin: 0 1rem; width: 25%; font-size: 1.8rem; text-align: center;}
#cartSteps li:after { content: ""; display: block; position: absolute; top: 50%; right: -2rem; margin: -1rem 0 0; width: 2rem; height: 2rem; background: url("../../images/common/arrowRBt.svg") no-repeat; background-size: contain;}
#cartSteps li:last-child:after { display: none;}
#cartSteps li.current ~ li { opacity: .5;}

.listCtrl { margin: 0 0 2rem;}
.listCtrl label { white-space: nowrap;}
.listCtrl div { text-align: right;}
.listCtrl div .btn { margin: 0.5rem 0 0.5rem 1rem;}
.listCtrl.bottom { margin: 1rem 0 2rem;}
.listCtrl.bottom .btn { margin: 1rem 0 0; width: 100%;}
.listCtrl.bottom .btn.gray { order: 2; margin: 2rem auto 0; width: auto;}

.orderList { margin: 0 0 2rem;}
.orderList thead { display: none;}
.orderList th { width: 100%;}
.orderList tbody th,
.orderList tbody td { transition: background ease 0.3s;}
.orderList th,
.orderList td:first-of-type,
.orderList td:nth-of-type(2),
.orderList td:nth-of-type(3) { border-bottom-color: #CCC;}
.orderList td { padding: 1rem 0.5rem; width: 33.33%; font-size: 1.8rem;}
.orderList td:nth-of-type(3n-2) { padding-left: 1rem;}
.orderList td:nth-of-type(3n) { padding-right: 1rem;}
.orderList tbody tr:hover th,
.orderList tbody tr:hover td { background: rgba(1, 49, 97, 0.05);}
.orderList tbody tr.errorRow th,
.orderList tbody tr.errorRow td { background: #fff1f1;}
.orderList tbody tr.errorRow:hover th,
.orderList tbody tr.errorRow:hover td { background: #ffe2e2;}
.orderList td .subtotal { display: block; line-height: 4rem; text-align: center; white-space: nowrap;}
.orderList td input[type=number] { width: 100%;}
.orderList td .btn { padding: 0 1.5rem; width: auto; min-width: 0; font-size: 1.8rem; line-height: 4rem; white-space: nowrap;}

.orderList .tableFlex figure { padding: 0 1rem 0 0; width: 33.33%; min-width: 33.33%; text-align: center;}
.orderList .tableFlex figure img { max-height: 10rem;}
.orderList .tableFlex.haveimg_ figure { display: block}

.orderList th,
.orderList td,
.orderList th span,
.orderList td span { font-weight: 400 !important; line-height: 1.4 !important;}
.orderList.newOrderList th  strong span,
.orderList.newOrderList td  strong span { font-weight: 600 !important;}
.orderList.newOrderList tbody th:first-child { width: 8rem; white-space: nowrap;}
.orderList.newOrderList tbody th ~ th { width: calc(100% - 8rem);}
.orderList.newOrderList td:nth-child(3) { width: 60%;}
.orderList.newOrderList td:nth-child(4) { width: 40%;}
.orderList.newOrderList td:nth-child(5) { width: 40%; text-align: left !important; border-bottom-color: #333;}
.orderList.newOrderList td:nth-child(5) input { margin: 0.8rem 0; max-width: 10rem; text-align: right;}
.orderList.newOrderList td:nth-child(6) { width: 40%; text-align: right;}
.orderList.newOrderList td:nth-child(6) .subtotal { display: flex; height: 100%; align-items: center; justify-content: end;}
.orderList.newOrderList td:nth-child(7) { display: flex; align-items: center; justify-content: center; width: 20%;}

.orderList.proceedingList td { padding: 0 1rem; width: 100%; border-bottom-color: transparent;}
.orderList.proceedingList .tableFlex figure { max-height: 15rem;}
.orderList.proceedingList .tableFlex figure img { max-height: min(100%, 15rem);}
.orderList.proceedingList td span.sp { display: inline-block; position: relative; margin: 0 1rem 0 0; min-width: 11rem;}
.orderList.proceedingList td span.sp::after { content: ":"; position: absolute; right: 0;}
.orderList.proceedingList td.right span.sp { min-width: 0;}
.orderList.proceedingList td.right span.sp::after { display: none;}
.orderList.proceedingList td:nth-child(2) { padding-top: 1rem;}
.orderList.proceedingList td:nth-child(5) { padding-bottom: 1rem; border-bottom-color: #CCC;}
.orderList.proceedingList td:last-child { padding: 1rem; border-bottom-color: #333;}

#totalPrice { margin: 0 0 1.5rem; font-size: 1.8rem; text-align: right;}
#totalPrice strong { font-size: 2rem;}
#totalPrice strong strong { font-size: 2.2rem;}

.addData th { padding-bottom: 0; font-weight: 900; border: none;}

/* payment */
.orderedList { border-top: none;}
.orderedList th,
.orderedList td { transition: background ease 0.3s;}
.orderedList th { padding: 0.5rem 1rem 0; width: 100%; border-bottom: none;}
.orderedList th:first-child { padding-top: 1rem;}
.orderedList th:last-of-type { padding-bottom: 1rem;}
.orderedList td { width: 50%; border-top: 1px solid #CCC;}
.orderedList tr:hover th,
.orderedList tr:hover td { background: rgba(1, 49, 97, 0.05);}

.note { margin: 0 0 0 2rem;}
.note li { margin: 0 0 0.8rem;}
.note li:last-child { margin: 0;}
.note li:before { content: ""; display: block; position: absolute; top: 0; left: -2rem;}

.addData select { min-width: 33.33vw;}
.addData label { margin: 0.5rem 2rem 0.5rem 0;}

main.payment h3 { margin: 2rem 0 1rem;}
main.payment h3 + p { margin: 0 0 2rem;}
/* 20221025 C   ?    main.payment h3 + p input[type=tel] { width: 100%;}*/
main.payment h3 + p input[type=tel] { width: 100%; max-width: 30vw;}
@media screen and (max-width:767.9px) {
main.payment h3 + p input[type=tel] { width: 100%; max-width: 100%;}
}
/* mypage */
.mypage h1 img { width: 2.4rem;}

#myList > li { width: 100%;}
#myList li h3 { margin: 0 0 1.5rem; font-size: 1.8rem;}
#myList li .rightBtn { margin: -4.2rem 0 1.4rem;}
#myList li ul { margin: 0 0 4rem; border-top: 1px solid #333;}
#myList li li { border-bottom: 1px solid #333;}
#myList li li a { display: block; position: relative; padding: 1.4rem 3rem 1.4rem 1rem; font-size: 1.6rem; line-height: 1.2; text-decoration: none;}
#myList li li a:after { content: ""; display: block; position: absolute; top: 50%; right: 1rem; margin: -0.8rem 0 0; width: 1.6rem; height: 1.6rem; background: url("../../images/common/arrowRBt.svg") no-repeat; background-size: contain;}
#myList li li a:hover { background: rgba(1, 49, 97, 0.05);}
#myList li li a:hover:after { right: 0.8rem;}

/* proceedingList */
html > body > main.proceedingList > section { padding: 2rem !important; width: 100% !important;}
.proceedingList .paging { justify-content: space-between;}

#searchCart { margin: 0 -2rem; padding: 3rem 2rem; background: #f1f5f9;}
#searchCart h3 { margin: 0 0 1.5rem; text-align: center;}
#searchCart table { margin: 0 0 2rem;}
#searchCart th { padding-bottom: 0; font-weight: 900; border: none; white-space: nowrap;}
#searchCart .tableFlex div:first-child { margin: 0 1rem 1rem 0; }
#searchCart .tableFlex span { margin: 0 0.8rem 0 0.3rem;}

.paging .paged { padding: 0 0 1rem;}
.paging .pager { border: none;}
.paging.bottom { padding: 1rem 0 0;}
.paging.bottom .pager { padding: 0;}

.searchList thead { display: none;}
.searchList tr:hover td { background: rgba(1, 49, 97, 0.05);}
.searchList td { width: 50%; border-color: #CCC; transition: background ease 0.3s;}
.searchList td:nth-child(3),
.searchList td.btns { order: 2;}
.searchList td.btns { width: 100%; text-align: right; border-color: #333;}
.searchList .btn { margin: 0 0 0 2rem;}

/* proceedingDetail */
.proceedingDetail h3 { margin: 0 0 1.5rem;}

#orderDetail div { width: 100%;}
#orderDetail dl { margin: 0 0 3rem; border: 1px solid #333;}
#orderDetail dt,
#orderDetail dd { padding: 1rem; width: 100%;}
#orderDetail dt:not(:first-child) { border-top: 1px solid #CCC;}
#orderDetail dt { background: #f1f5f9;}
#orderDetail dl.white dt { padding-bottom: 0; font-weight: 900; background: none;}
#orderDetail .note { margin: -2rem 0 2rem;}
#orderDetail .btn { margin: 0 0 2rem; width: 100%;}
#orderDetail .btn:last-child  { margin: 0;}

.proceedingDetail .comments h3 ~ h3 { margin-top: 3rem;}
.proceedingDetail .comments textarea { height: 10rem;}

.proceedingDetail .listCtrl { justify-content: flex-start;}
.proceedingDetail .listCtrl h3 { margin: 0 2rem 0 0;}

/* .proceedingDetail .orderList thead { display: block; position: -webkit-sticky; position: sticky; top: 5.5rem; background: #FFF; z-index: 1;} */
.proceedingDetail .orderList thead { display: none;}
.proceedingDetail .orderList thead tr { justify-content: center; border-bottom: 1px solid #333;}
.proceedingDetail .orderList thead th { display: none;}
.proceedingDetail .orderList thead th.right { display: block; width: 25%; font-size: 1.4rem; border: none;}
.proceedingDetail .orderList tbody th p { margin: 0 -1rem 0 0; font-size: 1.8rem;}
.proceedingDetail .orderList tbody th span { display: inline-block; margin: 0 1rem 0.5rem 0; line-height: 1.2;}

.linkBtns .btn { margin: 2rem 0 0; width: 100%;}
.linkBtns .btn.gray { order: 2; margin: 2rem auto 0; width: auto; min-width: 10rem;}

.likeTextarea {
    padding: 1rem 0.8rem 0.8rem;
    min-height: 8rem;
    font-size: 16px;
    background: #f6fafd;
    border: 1px solid #abc0d4;
    border-radius: 5px;
    pointer-events: none;
}

/* login_old */
/* 20221025 C   @.common_headline1_ { margin: 0 auto 2rem; padding: 0 0 1.5rem; max-width: 64rem; font-size: 2.8rem; text-align: center; border-bottom: 1px solid #333;}*/
.common_headline1_ { margin: 1rem auto 2rem; padding: 1.5rem 0 1.5rem; max-width: 64rem; font-size: 2.8rem; text-align: center; border-bottom: 1px solid #333;}
.form_text_ { margin: 0 0 2rem; line-height: 1.6;}
.loginform_ { margin: 0 auto; max-width: 64rem;}
.loginform_ table { margin: 0 0 2rem; border: none;}
.loginform_ th { padding: 2rem 0 0.5rem; border: none;}
.loginform_ td { padding: 0; border: none;}
.loginform_ .inputimage_ { text-align: center;}
.loginform_ form .form_text_ { margin: 2rem 0 1rem; padding: 2rem 0 0; text-align: center; border-top: 1px solid #333;}
.loginform_ .forgotpass_ { text-align: center;}

.notice_ { line-height: 1.6;}
.notice_ .centertext_ { margin: 2rem 0 0; text-align: center;}

/*220726  \   C  
.customer_.col1_ { margin: 0 auto; max-width: 64rem;}*/
.customer_.col1_ { margin: 0 auto 4rem; max-width: 64rem;}
.customer_.col1_ p { line-height: 1.6;}
.customer_.col1_ .submit_ { margin: 2rem 0 0; text-align: center;}

/* login_new */
#login p { margin: 0 0 2rem; line-height: 1.6;}
#login .disc { margin: 0 0 2rem;}
#login .disc li { margin: 0 0 1rem 2rem; font-size: 1.6rem; list-style: disc outside;}
#login .loginForm { margin: 0 0 3rem; padding: 0 0 3rem; border-bottom: 1px solid #333;}
#login .loginForm dt { margin: 0 0 0.5rem;}
#login .loginForm dd { margin: 0 0 1rem;}
#login .loginForm .submit { margin: 2rem 0 0; text-align: center;}
#login .loginForm .center { margin: 2rem 0 0;}
#login .notMember {
    padding: 3rem 2rem;
    background-size: auto auto;
    background-color: #f1f5f9;
    background-image: -webkit-repeating-linear-gradient(45deg, #f1f5f9, #f1f5f9 12px, #edf0f4 12px, #edf0f4 14px );
    background-image: repeating-linear-gradient(45deg, #f1f5f9, #f1f5f9 12px, #edf0f4 12px, #edf0f4 14px );
}
#login .notMember .kome { margin: 0 0 2rem;}
#login .notMember .kome li { margin: 0 0 1rem; padding: 0 0 0 2rem; font-size: 1.6rem;}
#login .notMember .kome li::before { content: "??"; display: block; position: absolute; top: 0; left: 0;}

/* logout_new */
#logout { margin: 0 auto; max-width: 100rem;}
#logout p { margin: 2rem 0 0; line-height: 1.6;}
#logout .border { padding: 2rem 0; text-align: center; border-top: 1px dotted #333;}

/* contact */
.contact_.col1_ .common_headline1_ { max-width: none;}
.contact_.col1_ .message_ { margin: 0 0 2rem;}
.contact_.col1_ th { position: relative; padding-bottom: 0; font-weight: bold; border-bottom: none;}
.contact_.col1_ td { padding: 0.5rem 1rem;}
.contact_.col1_ .must_ { position: absolute; top: calc(50% - 7px); right: 1rem;}
.contact_.col1_ select { margin: 0.5rem 0; width: 100%;}
.contact_.col1_ input[type=text],
.contact_.col1_ textarea { margin: 0.5rem 0;}
.contact_.col1_ input[type=text]:first-of-type { margin-top: 0;}
.contact_.col1_ .name input[type=text] { margin: 0.5rem 0 !important; width: calc(50% - 5.5rem); max-width: 40rem;}
.contact_.col1_ .name .small_ { display: inline-block;}
.contact_.col1_ .small_ { color: #5e96cf;}
.contact_.col1_ .submit_ { margin: 2rem 0 0; text-align: center;}

/* quickorder */
#quickOrder h2.line { margin: 0;}
#quickOrder p { line-height: 1.6;}

#quickOrder .quickAcd { margin: 2rem 0; padding: 0 0 2rem; border-bottom: 1px solid #333;}
#quickOrder .quickAcd .btn.acd { width: 100%; text-align: left;}
#quickOrder .quickAcd .btn.acd .icon { left: 0 !important; transform: rotate(90deg);}
#quickOrder .quickAcd .btn.acd.open .icon { transform: rotate(90deg) scale(-1, 1);}
#quickOrder .quickAcd ul { margin: 2rem 0 0;}
#quickOrder .quickAcd li { margin: 1rem 0 0 2rem; list-style: disc outside;}
#quickOrder > div.listCtrl > label { width: 100%; }
#quickOrder .listCtrl { flex-wrap: wrap; justify-content: flex-start;}
#quickOrder .listCtrl .btn { 
    margin: 1.5rem 0 0; 
    width: 100%!important;
    display: inline-block;
    position: relative;
    padding: 1.3rem 2rem!important;
    width: auto;
    min-width: 20rem;
    color: #FFF !important;
    font-size: 1.8rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none !important;
    line-height: 1.4;
    background: #013161;
    border: none;
    vertical-align: middle;
    cursor: pointer;
    outline: none !important;
    z-index: 0;
    transition: all 0.3s ease;
}

.orderList.quickList { border-top: none;}
.orderList.quickList th,
.orderList.quickList td { padding: 1rem 0.5rem; width: 30%; border-bottom-color: #CCC;}
.orderList.quickList th { width: 60%;}
.orderList.quickList td:nth-last-child(3),
.orderList.quickList td:nth-last-child(2),
.orderList.quickList td:last-child { border-bottom-color: #333;}
.orderList.quickList td:first-child,
.orderList.quickList td:nth-last-child(3) { padding-left: 1rem;}
.orderList.quickList td:first-child,
.orderList.quickList td:last-child { width: 40%;}
.orderList.quickList th,
.orderList.quickList td:last-child { padding-right: 1rem;}
.orderList.quickList .stockNo,
.orderList.quickList .orderNum input { margin: 0.5rem 0 0;}
.orderList.quickList td:last-child .tableFlex { display: block;}
.orderList.quickList td:last-child .tableFlex input { margin: 0.5rem 1rem 0.5rem 0; width: calc(100% - 8rem); max-width: 12rem; text-align: right; vertical-align: middle;}
.orderList.quickList  ~ .center { margin: 2rem 0 0;}
.orderList.quickList  ~ .center .btn { width: 100%;}

/*220929 o b N A b v
#suggestArea { max-width: calc(100vw - 5rem); background: #FFF; border: 1px solid #333; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}
#suggestArea li { padding: 0.5rem 1rem; max-width: 100%;}
*/
#suggestArea { width:100%; max-width: 650px; background: #FFF; border: 1px solid #333; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}
#suggestArea:empty { display: none;}
#suggestArea li { padding: 0.5rem 1rem; width:100%; max-width: 600px; font-size: 2.2rem!important;}

@media screen and (max-width:767.9px) {
    #suggestArea { width:100%; max-width: 80vw; background: #FFF; border: 1px solid #333; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}
    #suggestArea li { padding: 0.5rem 1rem; width:100%; max-width: nonr; font-size: 2.0rem!important;}
}

#camArea {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    top: 0;
    left: 0;
    padding: 3rem 2rem;
    width: 100%;
    height: 100%;
    text-align: center;
    background: rgba(0, 27, 54, 0.5);
    pointer-events: none;
    opacity: 0;
    transition: .3s;
    z-index: 1000;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}
#camBlock { padding: 3rem 2rem; max-width: 80rem; background: #FFF;}
#interactive { position: relative; width: 100%;}
#interactive > video { display: block; width: 100% !important; height: auto !important; max-height: 75vh; max-height: 75dvh;}
#interactive > canvas.drawingBuffer { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important;}
#interactive > br { display: none !important;}
#result { margin: 0 0 2rem; color: #2ecc71; font-size: 3.5rem; font-weight: bold;}
#camBtn {
    position: fixed;
    bottom: 1.5rem;
    left: 1.5rem;
    background: rgba(255, 255, 255, 0.8);
    z-index: 10;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    z-index: 1001;
}
#toggle-quagga {
    padding: 8.2rem 2rem 2rem;
    min-width: 0;
    font-size: 1.8rem;
    background: rgba(1, 49, 97, 0.2) url(/images/common/icon-camera.svg) center 2.2rem no-repeat;
    background-size: 5rem;
}

#camArea.open { opacity: 1; pointer-events: auto;}
#camArea.open ~ #camBtn #toggle-quagga { background-image: url(/images/common/icon-camera-off.svg);}

.priceAll { position: -webkit-sticky; position: sticky; top: 5.5rem; z-index: 10;}
.priceAll th { position: relative; width: 100% !important; background: #FFF;}
.priceAll th::after { content: ""; display: block; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: #333;}
.orderList tbody tr.priceAll:hover th { background: #FFF !important;}
.priceAll strong { font-size: 2rem;}

/* order address */
.order_.col1_ .common_headline1_ { max-width: none;}
.order_.col1_ div,
.order_.col1_ p { margin: 0 0 2rem; line-height: 1.6;}
.order_.col1_ div:last-child,
.order_.col1_ p:last-child { margin-bottom: 0;}

.order_.col1_ .inputWrap { margin: 0 auto; vertical-align: top;}
.order_.col1_ .keyword_ { margin: 0 1rem 0 0; width: calc(100% - 10rem);}
.order_.col1_ .submit_ { margin: 2rem 0 0; text-align: center;}
.order_.col1_ .btn.small.searchBtn { height: 4rem;}
.method_address_ { border-top: 1px solid #333;}
.method_address_ .address_item_ { margin: 0; padding: 2rem 1rem; border-bottom: 1px solid #333;}

/* catalogList */
.catalogList h2:not(:first-of-type) { padding: 0 0 1rem; border-bottom: 1px solid #000;}

/* ledger */
.ledgerList { margin: 1rem 0 0; border-top: 1px solid #333;}
.ledgerList li { padding: 1rem; border-bottom: 1px solid #333; transition: background ease 0.3s; }
.ledgerList li:hover { background: rgba(1, 49, 97, 0.05);}
.ledgerList .ledgerWrap { flex-grow: 1;}
.ledgerList .ledgerTitles h2 { flex-grow: 1; margin: 0 0 1rem;}
.ledgerList .ledgerTitles dl { margin: 0 0 1rem; width: 100%;}
.ledgerList .ledgerTitles dt { width: 8rem;}
.ledgerList .ledgerTitles dd { width: calc(50% - 8rem);}
.ledgerList .ledgerWrap .btn { margin: 1rem auto 0;}
.ledgerList .btns { margin: 2rem -1rem 1rem; width: calc(100% + 2rem);}
.ledgerList .btns .btn { margin: 0 1rem; min-width: 0; width: calc(33.33% - 2rem);}

#ledgerDetail h1 ~ p { margin: 0 0 1rem;}
#ledgerDetail h1 ~ p label { margin: 0 1rem 1rem 0;}
#ledgerDetail .btns { margin: 0 0 2rem;}
#ledgerDetail .btns .btn { display: block; margin: 0 0 1rem; width: 100%;}

.ledgerComments { margin: 0 0 2rem;}
.ledgerComments.bottom { margin: 0;}
.ledgerComments input[type=text] { margin: 0 0 1rem; height: 40px; font-size: 20px;}

#ledgerDetail .itemList { margin: 0 0 2rem;}
.itemList h3 + p { margin: 1rem 0; font-size: 2rem;}
.itemList .price { margin: 0 0 0.5rem; font-size: 1.8rem; border-bottom-width: 2px;}
.itemList .price strong { font-size: 2rem!important;}
.itemList .nums dt,
.itemList .nums dd { margin: 0 0 0.5rem; padding: 0 0 0.5rem; min-width: 35%; border-bottom: 1px solid #333;}
.itemList .nums dd { flex-grow: 1; text-align: right;}
#ledgerDetail .addBtn .btn { width: 100%;}

/*       ?  i ^ C g      */
body > main > div.wpPage > div.imgTextGroupM > section:nth-child(3) > div > h2 > a {
	text-decoration: none;
	color: #262C33;
	cursor: default!important;
}

/*       ?  i  more { ^  */
body > main > div.wpPage > div.imgTextGroupM > section:nth-child(3) > div > div.list_btn_ { text-align: center!important;}
body > main > div.wpPage > div.imgTextGroupM > section:nth-child(3) > div > div.list_btn_ > a:hover {box-shadow: 0 0.5rem 1.5rem rgb(1 49 97 / 30%);}
body > main > div.wpPage > div.imgTextGroupM > section:nth-child(3) > div > div.list_btn_ > a {
    display: inline-block;
    position: relative;
/*    padding: 1.3rem 2rem;*/
    width: auto;
/*    color: #FFF !important;*/
    font-size: 1.6rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none !important;
    line-height: 1.4;
/*    background: #013161;*/
/*    border: none;*/
    vertical-align: middle;
    cursor: pointer;
    outline: none !important;
    z-index: 0;
    transition: all 0.3s ease;
	border-radius: 99rem;
	color: #013161 !important;
    background: #FFF;
    box-shadow: 0 0.2rem 1rem rgb(1 49 97 / 20%);
	padding: 0.6rem 1.5rem;
    min-width: 10rem;
/*    font-size: 1.3rem;	*/
	border: solid 1px #013161;
}

/* ?   ?L [   [ h*/
body > main > section {
	margin: 0 auto;
	width: 80vw;
	padding: 0!important;
	text-align: center;
}

@media screen and (max-width: 370px){

/* base */

/* common */

/* page */
.listCtrl .choices { font-size: 1.3rem;}
.listCtrl .btn { padding: 0.6rem 1rem; font-size: 1.4rem;}
}

@media screen and (min-width: 768px){

/* base */

/* common */

/* page */
#mainSlide li img { max-height: 50rem;}

#myList > li { padding: 0 1rem 0 0; width: 50%; }
#myList > li:nth-child(2n) { padding: 0 0 0 1rem;}

#orderDetail dt { width: 30%;}
#orderDetail dd { width: 70%;}
#orderDetail dd:not(:nth-child(2)) { border-top: 1px solid #CCC;}
#orderDetail div:last-child { margin: 0 -1rem; width: calc(100% + 2rem);}
#orderDetail .btn { margin: 0 1rem; width: calc(33.33% - 2rem);}

.proceedingDetail .orderList thead th.right { font-size: 1.8rem;}

.linkBtns .btn { width: 45%;}
.linkBtns .btn.gray { margin: 2rem 0 0;}

#quickOrder .listCtrl { flex-wrap: nowrap; justify-content: space-between;}
#quickOrder .listCtrl label { margin: 0 auto 0 0;}
#quickOrder .listCtrl .btn { margin: 0 0 0 2rem; width: auto; white-space: nowrap;}

.ledgerList li,
.ledgerList .ledgerTitles { flex-wrap: nowrap;}
.ledgerList .ledgerWrap { width: calc(100% - 20rem);}
.ledgerList .ledgerTitles h2 { flex-grow: 1; padding: 0 2rem 0 0;}
.ledgerList .ledgerTitles dl { margin: 0 0 0.5rem; width: auto;}
.ledgerList .ledgerTitles dt { margin: 0 0 0.5rem; width: 8rem;}
.ledgerList .ledgerTitles dd { margin: 0 0 0.5rem; width: calc(100% - 8rem);}
.ledgerList .btns { display: block; margin: 0; padding: 0 0 0 2rem; width: 20rem;}
.ledgerList .btns .btn { margin: 0 0 1rem; min-width: 0; width: 100%;}

/*#ledgerDetail .btns .btn { display: inline-block; margin: 0 2rem 0 0; width: auto;}*/
#ledgerDetail .btns .btn { display: inline-block; margin: 0; width: auto;}
/*#ledgerDetail .itemList li { width: calc(33.33% - 2rem);}*/
#ledgerDetail .itemList li { width: calc((100% - 6rem) / 3);}

#login .loginFlex { display: flex; margin: 3rem 0 0; padding: 3rem 0 0; border-top: 1px solid #333;}
#login .loginForm { margin: 0; padding: 0 3rem 0 0; width: 50%; border: none;}
#login .notMember { width: 50%;}

#suggestArea li { box-sizing: content-box;}
}

@media print {

.qualva,
.qualvaHeader,
.qualvaHeader * { display: none !important; visibility: hidden !important;}

/*20221115  ?    */

#headNav,#logo,
#breadCrumbs,
#menuTrigger,
#spNav,
#iconNav,
#ledgerDetail > h1,
#ledgerDetail > p:nth-child(2),
#ledgerDetail > p:nth-child(3),
#ledgerDetail > p.btns,
#ledgerDetail > div.itemList > ul > li > p { display: none!important; visibility: hidden !important; }    
    
#ledgerDetail .itemList ul {
    margin: 0;
    padding: 0!important;
    gap: 30px!important;
    break-inside: avoid;
    }
    
#ledgerDetail .itemList li {
    margin: 0!important;
    padding: 0!important;
    display: block!important;
    page-break-inside: avoid!important;
    width: calc((100% - 200px) / 5)!important;
    }
    
#ledgerDetail > div.itemList > ul > li > a {
    display: block;
    page-break-inside: avoid!important;
    margin: 50px 0!important;
    }  
#ledgerDetail > div.itemList > ul > li > a > figure,
#ledgerDetail > div.itemList > ul > li > a > figure > div > img {
    display: block!important;
    page-break-inside:avoid!important;
    overflow:visible;
    }
    
   
    #ledgerDetail > div:nth-child(5) { position: fixed; top:0; width: 98%; }
    #ledgerDetail > div.ledgerComments.bottom { position: fixed; bottom: 0; width: 98%; }

    header,footer { display: none!important; visibility: hidden !important; }
    
    #ledgerDetail .itemList ul {
        margin-top: 100px!important;
        background-color: red;
    }
    
    #ledgerDetail .itemList ul li {
        display: flex;
        flex-direction: column;    
    }
    #ledgerDetail > div.itemList > ul > li > a > figure > figcaption > dl.nums { align-self: flex-end; }
}






@media screen and (min-width:1024px){

/*-------------------------------------
	base
-------------------------------------*/

/* base */
h1 { margin: 0 auto 4rem; font-size: 5rem;}
h2 { margin: 0 auto 4rem; font-size: 4.5rem;}
h3 { margin: 0 auto 4rem; font-size: 4rem;}
h4 { margin: 0 auto 4rem; font-size: 3.5rem;}
h5 { margin: 0 auto 4rem; font-size: 3rem;}
h6 { margin: 0 auto 4rem; font-size: 2.5rem;}

th,
td { display: table-cell;}

/* form */
input.sizeLL { width: 50%;}
input.sizeL { width: 35%;}
input.sizeM { width: 20%; min-width: 26rem;}
input.sizeS { width: 10%; min-width: 10rem;}

.errorMsg { margin: 0 0 4rem; padding: 2rem; font-size: 1.8rem;}

.btn { padding: 2rem 3rem 1.8rem; min-width: 22rem; font-size: 1.9rem;}

.btn .icon { top: -0.2rem; margin: 0 0 0 0.8rem; width: 1.6rem; height:1.6rem;}

.btn.small { padding: 1.8rem 2rem 1.4rem; min-width: 14rem; font-size: 1.6rem;}
.btn.small .icon { width: 1.8rem; height: 1.8rem;}

.btn.large { padding: 3rem 5rem 2.8rem; font-size: 2rem;}

.inputWrap ~ .inputWrap { margin-left: 4rem;}

/* header */
#headNav li.pc { display: none !important; }

#headNav .mypage.before { padding: 2rem 0 0;}

/* aside */
#fixBtns { position: fixed; bottom: 2rem; right: 2rem;}
#fixBtns .btn { margin: 2rem 0 0; padding: 4rem 0 0; width: 11rem; height: 11rem; font-size: 1.6rem!important; line-height: 1.3!important; background-position: center 1.2rem; background-size: 2.6rem;}
#fixBtns .btn.form { 
    padding: 6.5rem 0 0; 
    background-position: center 1.5rem; 
    background: /*20221215 濃色に変更指示 #b39e05*/ #885500 url(../../images/common/icon-form.svg) center 1.2rem no-repeat!important;
    background-size: 4.5rem!important;
    }
#fixBtns .btn.chat { 
    padding: 6.5rem 0 0; 
    background-position: center 1.5rem; 
    background-size: 4.5rem;
    background-image: url(../../images/common/icon-faq.svg);
    }
#fixBtns .btn.cart { 
    padding: 6rem 0 0; 
    font-size: 1.2rem; 
    background-position: center 1.5rem;
    background-image: url(../../images/common/icon-cartW.svg);
    background-size: 4rem;
    }
 
@media print {
    aside { display: none;}
}

/* footer */
footer { padding: 10rem 0; font-size: 1.6rem; margin-top: 8rem;}

#footWrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; margin: 0 auto; padding: 0 4rem; max-width: 184rem;}

#footLogo { width: 30rem; text-align: left;}
#footLogo img { margin: 0 0 0.8rem; height: 5rem;}
#footLogo strong { display: inline-block; width: 24rem; text-align: center;}

#footNav { margin: 0 0 4rem; width: calc(100% - 30rem);}
#footNav .acd { display: none !important; pointer-events: none;}
#footNav .acd-content { display: block !important; padding: 3rem 1rem 0; border-top: 1px solid #013161;}
#footNav .acd-content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#footNav .acd-content li { margin: 0 2rem 3rem; width: calc(50% - 4rem);}
#footNav .acd-content a { color: #013161 !important; text-decoration: none;}
#footNav .acd-content a:hover { text-decoration: underline;}

footer .snsLinks { margin: 0; width: 30rem; text-align: left;}

#copy { width: calc(100% - 30rem); font-size: 1.8rem; line-height: 2.4rem; text-align: right;}


/*-------------------------------------
	common
-------------------------------------*/

.pc { display: block !important; }
.sp { display: none !important; }

.rightBtn { margin: -9.5rem 0 4.5rem;}

main { padding: 11rem 0 0;}
main section { margin: 0 auto; padding: 10rem 4rem; max-width: 184rem;}
main section.gray { margin: 4rem 0;padding: 12rem 8rem; max-width: none;}
main section.gray h2 { padding: 0 4rem; max-width: 184rem;}
main section.gray div:has(.catalog) { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
main h2.line { padding: 0 0 2rem;}

#maker { margin: -4rem auto 0; padding: 10rem 0 !important; max-width: 176rem; overflow: hidden; border-top: 1px solid #abc0d4;}
#maker > p,
#maker > div { margin-left: auto; margin-right: auto;}

#iconNav { display: none;}

#breadCrumbs { margin: 0 auto; padding: 4rem; max-width: 184rem;}

/* flexList */
.flexList { margin: 0 -2rem;}
.flexList li { margin: 0 2rem 4rem; width: calc(33.33% - 4rem);}
.flexList figcaption { margin: 1rem 0 0; font-size: 1.8rem;}

.flexList.coordinate,
.flexList.catalog { margin: 0 -2rem;}
.flexList.coordinate li,
.flexList.catalog li { margin: 0 2rem 4rem; width: calc(25% - 4rem);}
.flexList.coordinate figcaption { display: block;}

.flexList.four li { width: calc(25% - 4rem);}
.flexList.five li { width: calc(20% - 4rem);}
.flexList.six li { width: calc(16.66% - 4rem);}
.flexList li figcaption h2,
.flexList li figcaption h3 { margin: 2rem 0 1.5rem !important; font-size: 2.8rem;}
.flexList li figcaption h4 { margin: 1.5rem 0 1rem !important; font-size: 2.4rem;}
.flexList li figcaption h5 { margin: 1.5rem 0 1rem !important; font-size: 2rem;}
.flexList li figcaption h6 { margin: 1.5rem 0 1rem !important; font-size: 1.8rem;}


/*-------------------------------------
	page
-------------------------------------*/

/* top */
#MainVisual li { margin: 0 1rem;}
#MainVisual .slick-list { padding: 0 15vw !important;}
#MainVisual .slick-arrow { width: 15vw; background-size: 5rem;}
#MainVisual .slick-dots { bottom: 3rem;}
#MainVisual .slick-dots li { margin: 0 0.5rem;}

body > main.top > section { margin: 0 auto; padding: 10rem 4rem !important; width: 100%; max-width: 184rem;}
body > main.top > section.gray { margin: 4rem 0; padding: 12rem 8rem !important; max-width: none;}

#helpLink { margin: 0 0 6rem;}
#helpLink a { padding: 3rem 10rem 3rem 7rem; background-position: right 4rem center; background-size: 3rem;}
#helpLink p { display: inline-block; margin: 0 3rem 0 0; font-size: 2.4rem; vertical-align: middle;}
#helpLink img { margin: 0 2rem 0 0; width: 5rem;}
#helpLink strong { font-size: 3rem;}

@media (hover: hover) {
#helpLink a:hover { background-position: right 3rem center;}
}
    
.form-flex_box { margin: 4rem 0 2.5rem;}
#form1 { width: 51vw;}
#sbox { width: calc(100% - 80px);}
#sbtn { width: 80px;}
.search__point { margin: 0 auto 6rem; width: 51vw;}
.keyword_up h2 { margin: 0 auto 1rem; font-size: 3.2rem;}

#infoList { padding: 3rem 0 0;}
#infoList li { margin: 0 0 3rem; padding: 0 3rem;}
#infoList a { font-size: 1.9rem;}
#infoList span { width: calc(100% - 12rem);}
#infoList .date { width: 12rem;}

#recommendSlide { position: relative; margin: 0 -4rem 0 0;}
#recommendSlide .slick-slider { padding: 0 0 9rem;}
#recommendSlide .slick-slide { margin: 0 4rem 0 0;}
#recommendSlide .slick-slide figcaption { margin: 1rem 0 0; font-size: 1.6rem; line-height: 1.6;}

#recommendSlide .slick-arrow { width: 6rem; height: 6rem; background-size: 4rem;}
#recommendSlide .slick-next { left: 8rem;}

#recommendSlide .slick-dots { bottom: -1.1rem; left: 20rem; width: calc(83.33% - 20rem);}

#keywordList { margin: 0 -1rem 6rem;}
#keywordList li { margin: 0 1rem 2rem; width: calc(16.666% - 2rem);}
#keywordList li.long { width: calc(33.333% - 2rem);}
#keywordList a { padding: 1rem 2.5rem; font-size: 1.9rem;}

#keywordList + .center { display: flex; margin: 0; gap: 4rem;}
#keywordList + .center .btn { margin: 0; flex-grow: 1;}

.gray div:has(#keywordList) { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
.gray #keywordList { margin: 0 -1rem -2rem;}
.gray #keywordList li { width: calc(14.285% - 2rem);}

/*20230131～追加 イベント用キーワード検索 ここから*/

#eventList li { margin: 2rem 1.5rem 2rem 1.5rem;}
#eventList a { padding: 2rem 3rem; font-size: 1.9rem;}

/*20230131～追加 イベント用キーワード検索 ここまで*/

#colorSearch h2 { margin: 0 0 4rem;}
#colorSearch ul { gap: 4rem; justify-content: space-around; flex-wrap: nowrap; margin: 0 0 8rem;}
#colorSearch li { flex-grow: 1; width: auto; max-width: 9rem;}
#colorSearch a { box-shadow: 0 0 0 1.5rem #FFF inset, 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}
#colorSearch a.btn.btnCwhite { box-shadow: 0 0 0 1.5rem #FFF inset, 0 0 0 calc(1.5rem + 1px) silver inset, 0 0.2rem 1rem rgba(1, 49, 97, 0.2);}

@media (hover: hover) {
#colorSearch a.btn:hover { box-shadow: 0 0 0 1.5rem #FFF inset, 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
#colorSearch a.btn.btnCwhite:hover { box-shadow: 0 0 0 1.5rem #FFF inset, 0 0 0 calc(1.5rem + 1px) silver inset, 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
}

body > main > section:nth-child(2) .topBtnTitle { margin: 0 0 4rem !important;}
#topBtnList { gap: 4rem; margin: 0 0 20rem;}
#topBtnList .btn { width: calc(25% - 3rem); font-size: min(1.9rem, 1.2vw);}
#topBtnList .btn.white .icon.arrowR { width: 1.6rem; height: 1.6rem;}

#topNavBtn { gap: 9rem;}
#topNavBtn .btn { padding: 4rem; aspect-ratio: unset;}
#topNavBtn img { width: 100%; max-width: 30rem;}
#topNavBtn p { font-size: 2rem; line-height: 1.4;}
  
#categoryList { margin: 0 -2rem -4rem;}
#categoryList .categoryL li { margin: 2rem 2rem 1rem; width: calc(33.33% - 4rem);}
#categoryList .categoryL h3 { margin: 0 0 3rem; padding: 0 0 3rem; font-size: 2.6rem; border-bottom: 1px solid #000;}
#categoryList .categoryL span { width: 100%;}
#categoryList .categoryM { display: block;}
#categoryList .categoryM li { margin: 0 0 3rem; width: 100%;}
#categoryList .categoryM a { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; text-decoration: none; }
#categoryList .categoryM a:hover { text-decoration: underline;}
#categoryList .categoryM figure { margin: 0 2rem 0 0; width: 8rem; height: 8rem; overflow: hidden;}
#categoryList .categoryM span { width: calc(100% - 10rem); font-size: 1.9rem;}

.brandTitle { padding: 10px; font-size: 2rem;}

.brandList { margin: 0 auto 4rem; max-width: 184rem;}
.brandList li { padding: 2rem 4rem; width: 25%;}
.brandList li:nth-child(4n) { border: none;}
.brandList li:nth-child(4n-3),
.brandList li:nth-child(4n-2),
.brandList li:nth-child(4n-1) { border-right: 1px solid #CCC;}
.brandList li a { font-size: 1.9rem;}

.tabTop .tabChange { margin-bottom: 0;}
.tabTop .tabChange li { margin: 0 2rem 4rem; padding: 1.6rem 2rem 1.4rem; font-size: 1.8rem; border-radius: 0.5rem;}
.tabs li:nth-child(6) ~ li { display: block;}

.tabTop .itemList ul { margin: 0 -2rem 4rem;}
.tabTop .itemList h3 { margin: 1.5rem 0 0.8rem !important; font-size: 1.6rem;}
.tabTop .itemList h3 + p { margin: 0.8rem 0;}

#topStyleList .flexList a { padding: 0 0 2rem;}
#topStyleList .flexList figcaption { padding: 2rem 2rem 0; font-size: 1.8rem;}

/* category */
#catFlex { margin: 0 auto; padding: 0 0 4rem 4rem; max-width: 184rem;}
#catSide { padding: 0 0 4rem; width: 40rem;}
/* #catSide #sidebox { position: -webkit-sticky; position: sticky;  top: 13rem;} */
#catSide .sideSearch { margin: 0 0 4rem; padding: 0 2rem; border: 1px solid #000;}
#catSide .acd.sideTitle { margin: 0 -2rem; padding: 1.5rem 3.5rem 1.5rem 1.5rem; font-weight: 900; background: rgba(1, 49, 97, 1); transition: all ease 0.3s;}
#catSide .acd.sideTitle:hover { background: rgba(1, 49, 97, 0.7);}
#catSide .sideCont { padding: 2rem 0 0;}
#catSide .sideDt { margin: 0 0 1rem; transition: all ease 0.3s;}
#catSide .sideDt:hover { background: rgba(1, 49, 97, 0.1);}
#catSide .sideDt:nth-last-child(2):not(.open) { margin: 0 0 3rem;}
#catSide .sideDd,
#catSide .sideDd.prices { margin: 0 0 2rem;}
#catSide .center { padding: 0 0 3rem;}
#catSide .sideDd ul { padding: 0;}

#catSide #sidebox .ps { position: relative; }
#catSide #sidebox .ps__thumb-y { background: rgba(1, 49, 97, 0.4); border-radius: 20px;}
#catSide .sideInput { padding: 0 0 2rem;}
#catSide .sideExample { padding: 0 0 1.5rem;}

#catMain { width: calc(100% - 40rem);}
#catMain section { padding: 4rem;}
#catMain section:first-of-type { padding-top: 0;}
#catMain .flexList.special li { width: calc(50% - 4rem);}

#catMain #categoryList { margin: 0 -2rem 3rem;}
#catMain #categoryList .categoryL li { width:  calc(50% - 4rem);}
#catMain #categoryList .categoryL figure { margin: 0 2rem 0 0; width: 8rem; height: 8rem;}
#catMain #categoryList .categoryL span { width: calc(100% - 10rem); font-size: 1.9rem;}

/* 220726  \      C  
.paged { margin: 6rem 0 -3.5rem; pointer-events: none;}*/
.paged { margin: 0 2rem 0 0; pointer-events: none; padding-bottom: 10px;}

.pager { padding: 0 0 2rem;}
.pager li { margin: 0 0.8rem;}
.pager a { width: 5rem; line-height: 5rem; font-size: 1.8rem;}
.pager.bottom { padding: 2rem 0 0;}

.sorting { justify-content: end; margin: 3rem 0; padding: 0; background: none;}
.sorting p { width:  auto; text-align: left;}
.sorting span { display: inline-block; margin: 0 1rem;}
.sorting select { width: auto;}

.itemList ul { margin: 0 -2rem;}
.itemList li { margin: 0 2rem 4rem; width: calc(25% - 4rem);}
.itemList li .icons .icon { font-size: 1.8rem;}
.itemList li .addBtn { margin: 1rem 0 0; font-size: min(1vw, 1.6rem);}
.itemList li a:hover figcaption,
.itemList li .addBtn a:hover { opacity: .6;}

/* detail */
body > main.detail > section { padding: 10rem 4rem !important;}
.detail section:first-of-type { padding-top: 0;}
.detail section:last-of-type { padding-bottom: 15rem;}
.detail .itemList ul { margin: 0 -2rem -4rem;}
.detail .itemList li { width: calc(20% - 4rem);}
.detail .itemList ~ .center { margin: 4rem 0 0;}
.detail .flexList.coordinate { margin: 0 -2rem -4rem;}
.detail .flexList.coordinate li { margin: 0 2rem 4rem; width: calc(25% - 4rem);}
.detail .flexList ~ .center { margin: 4rem 0 0;}

#detailTop { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#detailTop .slick-arrow { background-size: 4rem;}
#detailSlide { width: 50%;}

#mainSlide li img { max-height: 65rem;}
#navSlide { margin: 0; width: 100%;}
#navSlide li img { max-height: 15rem;}
#navSlide .slick-track { margin: 2rem -1rem -2rem; width: calc(100% + 2rem) !important; transform: none !important;}
#navSlide .slick-slide { margin: 0 1rem 2rem; width: calc(25% - 2rem) !important;}
#navSlide .slick-cloned { display: none !important;}

#detailCont { padding: 0 0 0 6rem; width: 50%; font-size: 1.8rem;}
#detailCont h1 { font-size: 4rem;}
#detailCont h1 small { margin: 1rem 0 0;}
#detailCont .price { margin: 0 0 3rem; padding: 0 0 2rem; font-size: 3rem;}
#detailCont .price strong { font-size: 4rem;}
#detailCont dt,
#detailCont dd { margin: 0 0 1.5rem; width: 8rem;}
#detailCont dd { width: calc(100% - 8rem);}
#detailCont p { margin: 0 0 1.5rem; font-size: 1.8rem;}
#detailCont .addBtn { margin: 3rem 0 0;}
#detailCont .btn { margin: 2rem 0 0; font-size: 2.2rem;}
#detailCont .btn img { margin: 0 0.8rem 0 0; width: 3rem;}

#detailText { margin: 6rem 0 0; width: 100%;}
#detailText p { margin: 0 auto; max-width: 100rem; font-size: 1.8rem; line-height: 1.6;}

/* list */
main.list section { padding-top: 0;}
main.list h1 img { position: relative; top: -2px; width: 6rem;}
main.list h2 { margin: 0 0 3rem; font-size: 4rem;}
main.list h2 + .rightBtn { margin: -9rem 0 4rem;}

#cartSteps { margin: 0 -2rem 4rem;}
#cartSteps li { margin: 0 2rem; font-size: 2.4rem;}
#cartSteps li:after { right: -3rem;}

.listCtrl { margin: 0 0 4rem;}
.listCtrl.bottom { margin: 4rem 0 0;}
.listCtrl.bottom .btn { margin: 0; width: auto; min-width: 30%;}
.listCtrl.bottom .btn.gray { order: 0; margin: 0; min-width: 0;}

.orderList { border-top: none;}
.orderList thead { display: table-row-group;}
.orderList thead th { position: -webkit-sticky; position: sticky;  top: 11rem; text-align: center; background: #FFF; border: none !important; box-shadow: 0 -1px 0 #333 inset; z-index: 1;}
.orderList tr { display: table-row;}
.orderList th,
.orderList td { padding: 2rem 1rem !important; width: auto; font-size: 1.6rem; border-bottom: 1px solid #333 !important;}
.orderList th:first-child { padding-left: 2rem !important;}
.orderList th:last-child,
.orderList td:last-child { padding-right: 2rem !important;}
.orderList .tableFlex figure { padding: 0 2rem 0 0; width: 20%; min-width: 20%;}
.orderList td input[type=number] { max-width: 8rem;}

.orderList.newOrderList tbody th:first-child { width: 5%;}
.orderList.newOrderList tbody th ~ th { width: 35%;}
.orderList.newOrderList td:nth-child(3) { width: 25%;}
.orderList.newOrderList td:nth-child(4) { width: 15%;}
.orderList.newOrderList td:nth-child(5) { width: 15%; text-align: left !important; border-bottom-color: #333;}
.orderList.newOrderList td:nth-child(6) { width: 10%; vertical-align: middle;}
.orderList.newOrderList td:nth-child(7) { display: table-cell; width: 10%; vertical-align: middle;}

.orderList.proceedingList tbody th { width: 40%;}
.orderList.proceedingList tbody td { width: 10% !important; text-align: right;}
.orderList.proceedingList tbody td:nth-child(2) { width: 15%; text-align: center;}
.orderList.proceedingList tbody td:last-child { width: 15%;}

#totalPrice { margin: 0 0 4rem; font-size: 2.4rem;}
#totalPrice strong { font-size: 3rem;}
#totalPrice strong strong { font-size: 3.5rem;}

.addData th,
.addData td { padding: 4rem 2rem; border-bottom: 1px solid #333;}

/* payment */
main.payment section { padding-top: 0;}
main.payment h1 img { position: relative; top: -2px; width: 6rem;}
main.payment h2 { margin: 0 0 2rem; font-size: 3rem;}
main.payment h2 + .rightBtn { margin: -9rem 0 4rem;}
main.payment h3 { margin: 8rem 0 2rem; font-size: 3rem;}
main.payment h3 + p { margin: 0 0 4rem;}

.payment #cartSteps { margin: 0 0 6rem;}

.orderedList { border-bottom: 1px solid #333;}
.orderedList tr { display: table-row;}
.orderedList th,
.orderedList td { padding: 2rem !important; width: auto !important; border-top: none; border-bottom: none;}

.addData select { min-width: 15vw; height: 5rem; font-size: 2rem;}
.addData label { margin: 0 4rem 0 0;}

/* mypage */
main.mypage section { padding-top: 0;}
.mypage h1 img { width: 6rem;}
.mypage h2 { margin: 0 0 8rem; font-size: 4rem;}

#myList { margin: 0 0 -8rem;}
#myList > li { padding: 0 4rem 0 0; }
#myList > li:nth-child(2n) { padding: 0 0 0 4rem;}
#myList li h3 { margin: 0 0 2rem; font-size: 2.6rem;}
#myList li .rightBtn {margin: -6.5rem 0 1.5rem;}
#myList li ul { margin: 0 0 8rem;}
#myList li li a { padding: 2rem 4rem 2rem 2rem; font-size: 1.8rem;}
#myList li li a:after { margin: -0.9rem 0 0; width: 1.8rem; height: 1.8rem;}

/* proceedingList */
main.proceedingList section { margin: 0 auto !important; width: 100% !important;}
body > main.proceedingList > section { padding: 2rem !important; width: 100%;}
.proceedingList h1 img { position: relative; top: -0.3rem; width: 6rem;}
.proceedingList h2 { margin: 0 0 4rem; font-size: 4rem;}

#searchCart { margin: 0; padding: 6rem 8rem}
#searchCart h3 { margin: 0 0 3rem; font-size: 4rem;}
#searchCart table { margin: 0 0 3rem;}
#searchCart th,
#searchCart td { padding: 2rem; border-bottom: 1px solid #333; vertical-align: middle;}

.searchList { margin: 0 0 2rem;}
.searchList thead { display: table-row-group;}
.searchList thead th { font-weight: 900;}
.searchList tr { display: table-row;}
.searchList th,
.searchList td { padding: 2rem; width: auto; border-color: #333; vertical-align: middle;}
.searchList td.btns { width: auto; white-space: nowrap;}

.proceedingList .searchList th:nth-child(3) { white-space: nowrap;}
.proceedingList .searchList td:first-child { width: 10%;}
.proceedingList .searchList td:nth-child(4) { width: 15%;}

/* proceedingDetail */
main.proceedingDetail section { padding-top: 0;}
.proceedingDetail h1 img { position: relative; top: -0.3rem; width: 6rem;}
.proceedingDetail h2 { margin: 0 0 4rem; font-size: 4rem;}
.proceedingDetail h3 { margin: 0 0 2rem; font-size: 3rem;}

#orderDetail div { padding: 0 2rem 0 0; width: 65%;}
#orderDetail dl { margin: 0 0 6rem;}
#orderDetail dl:last-of-type { margin: 0;}
#orderDetail dt,
#orderDetail dd { padding: 2rem 3rem !important; line-height: 1.4;}
#orderDetail .note { margin: -4rem 0 5rem; text-align: right;}
#orderDetail div:last-child { margin: 0; padding: 0 0 0 2rem; width: 35%;}
#orderDetail div:last-child p { position: -webkit-sticky; position: sticky;  top: 13rem;}
#orderDetail .btn { margin: 0 0 2rem; width: 100%;}

.proceedingDetail .comments h3 ~ h3 { margin-top: 6rem;}

.proceedingDetail .listCtrl { margin: 0 0 2rem;}
.proceedingDetail .orderList thead { display: table-row-group;}
.proceedingDetail .orderList thead tr { display: table-row; border: none;}
.proceedingDetail .orderList th,
.proceedingDetail .orderList td { display: table-cell !important; width: auto !important;}

.linkBtns { margin: 0 -2rem; width: calc(100% + 4rem);}
.linkBtns .btn { margin: 4rem 2rem 0 !important; width: 25%;}

/* login */
.common_headline1_ { margin: 0 auto 6rem; padding: 0 0 4rem; max-width: 82rem; font-size: 5rem;}
.common_headline2_ { font-size: 3rem;}
.loginform_ { max-width: 82rem;}
.loginform_ table { margin: 0 0 4rem;}
.loginform_ th { padding: 1rem 0 1rem 0;}
.loginform_ td { padding: 1rem 0 1rem 2rem;}
.loginform_ form .form_text_ { margin: 6rem 0 3rem; padding: 6rem 0 0;}

.notice_ .centertext_ { margin: 4rem 0 0;}

.customer_.col1_ { max-width: 82rem;}
.customer_.col1_ .submit_ { margin: 4rem 0 0;}

/* login_new */
#login .disc { margin: 0 0 4rem;}
#login .loginFlex { margin: 4rem 0 0; padding: 4rem 0 0;}
#login .loginForm { padding: 0 10rem 0 0;}
#login .loginForm dt { margin: 0 0 1rem;}
#login .loginForm dd { margin: 0 0 2rem;}
#login .loginForm .submit { margin: 4rem 0 0;}
#login .loginForm .center { margin: 3rem 0 0;}
#login .notMember { padding: 8rem;}
#login .notMember h2 { font-size: 3rem;}
#login .notMember .kome { margin: 0 0 4rem;}

/* logout_new */
#logout p { margin: 4rem 0 0;}
#logout .border { padding: 4rem 0;}

/* contact */
.contact_.col1_ .message_ { margin: 0 0 4rem;}
.contact_.col1_ th { padding: 2rem 8rem 2rem 2rem; width: 22%; border-bottom: 1px solid #333; vertical-align: middle;}
.contact_.col1_ td { padding: 2rem;}
.contact_.col1_ .must_ { right: 2rem;}
.contact_.col1_ select { margin: 0; width: auto;}
.contact_.col1_ input[type=text],
.contact_.col1_ textarea { margin: 1rem 0;}
.contact_.col1_ .submit_ { margin: 4rem 0 0;}

/* quickorder */
#quickOrder { padding: 0 4rem 4rem !important; width: 100%;}
#quickOrder h2.line { font-size: 3rem;}

#quickOrder .quickAcd { margin: 4rem 0; padding: 0 0 4rem;}
#quickOrder .quickAcd .btn.acd { width: auto; text-align: center;}
#quickOrder .quickAcd ul { margin: 3rem 0 0;}

.orderList.quickList th,
.orderList.quickList td { padding: 2rem 1rem !important; width: auto; border-bottom-color: #333;}
.orderList.quickList th { width: 32%;}
.orderList.quickList td { width: 16%;}
.orderList.quickList td:first-child { padding-left: 2rem !important; width: 20%;}
.orderList.quickList td:last-child { padding-right: 2rem !important;}
.orderList.quickList .tableFlex figure { width: 33.33%; min-width: 33.33%;}
.orderList.quickList .stockNo,
.orderList.quickList .orderNum input { margin: 1rem 0 0;}
.orderList.quickList  ~ .center { margin: 4rem 0 0;}
.orderList.quickList  ~ .center .btn { width: 30%;}

#camArea { padding: 6rem;}
#camBlock { padding: 6rem;}
#result { margin: 0 0 3rem; font-size: 4rem;}
#camBtn { bottom: 2rem; left: 2rem;}
#toggle-quagga { padding: 9rem 3rem 3rem; font-size: 2.4rem; background-position: center 2rem; background-size: 5.5rem;}

.priceAll { top: 11rem;}
.priceAll strong { font-size: 3rem;}

/* order address */
.order_.col1_ div,
.order_.col1_ p { margin: 0 0 4rem;}

.order_.col1_ .keyword_ { margin: 0 2rem 0 0; width: calc(100% - 17rem);}
.order_.col1_ .submit_ { margin: 4rem 0 0;}
.order_.col1_ .btn.small.searchBtn { padding: 0.6rem 1.5rem;}
.method_address_ .address_item_ { padding: 3rem;}

/* ledger */
.ledgerList { margin: 2rem 0 0;}
.ledgerList li { padding: 3rem;}
.ledgerList .ledgerWrap { width: calc(100% - 30rem);}
.ledgerList .ledgerTitles { align-items: flex-start; margin: 0 0 3rem;}
.ledgerList .ledgerTitles h2 { margin: 0; padding: 0 3rem 0 0; width: calc(100% - 17rem); font-size: 3rem;}
.ledgerList .ledgerTitles dl { margin: 0 0 -1rem; width: 17rem;}
.ledgerList .ledgerTitles dt { margin: 0 0 1rem; width: 8rem;}
.ledgerList .ledgerTitles dd { margin: 0 0 1rem; width: calc(100% - 8rem);}
.ledgerList .ledgerWrap .btn { margin: 2rem auto 0;}
.ledgerList .btns { padding: 0 0 0 4rem; width: 30rem;}
.ledgerList .btns .btn { margin: 0 0 2rem; min-width: 0; width: 100%;}

#ledgerDetail h1 ~ p { margin: 0 0 3rem;}
#ledgerDetail h1 ~ p label { margin: 0 2rem 0 0;}
#ledgerDetail .btns { margin: 0 0 4rem;}
#ledgerDetail .btns .btn { margin: 0 4rem 0 0;}

.ledgerComments { margin: 0 0 4rem;}
.ledgerComments input[type=text] { margin: 0 0 3rem; height: 50px;}

#ledgerDetail .itemList li { width: calc(20% - 4rem);}


}

@media screen and (min-width:1024px){
/* header */
header { height: 11rem; }

#logo { padding: 2rem 3rem; height: 11rem; text-align: left;}
#logo a { font-size: 1.6rem; text-align: center;}
#logo span { margin: 0 0 0.5rem; height: 5rem;}
#logo img { margin: 0; height: 5rem !important;}

#headNav { top: 50%; right: 11rem; margin: -2rem 0 0;}
#headNav li { display: inline-block; margin: 0 0 0 2rem;}
#headNav li.pc { display: inline-block !important;}
#headNav li.pc,
/*#headNav .mypage { margin-top: 0.3rem;}*/
#headNav li a { color: #000 !important; font-size: 1.4rem; text-align: center; text-decoration: none;}
#headNav li a:hover { opacity: .6;}
#headNav a .notice { top: -1.5rem;right: -1.5rem;width: 2rem;height: 2rem; font-size: 1.4rem;line-height: 2rem;}
#headNav li strong { display: block; margin: 0 0 1rem; font-size: 2rem; letter-spacing: 0.1rem;}
#headNav .search { width: 18rem;}
#headNav .list a,
#headNav .mypage a,
#headNav #searchBtn { padding: 0 0 0 3.5rem; width: auto; height: auto; font-size: 1.4rem; background: url("../../images/common/icon-userB.svg") left center no-repeat; background-size: 3.2rem;}
#headNav .list a { background-image: url("../../images/common/icon-file.svg");}
#headNav #searchBtn { display: none;}
#headNav .searchBox { position: static;  width: auto; height: auto; background: none; overflow: visible; -webkit-backdrop-filter: none; backdrop-filter: none;}

#headNav .mypage a { transform: none;}
#headNav .mypage a strong { display: block;}

#headNav .searchBox p { margin: 0; border: 1px solid #333;}
#headNav .searchBox p button { width: 4rem; background-image: url("../../images/common/icon-searchB.svg"); background-size: 2.8rem;}
#headNav .searchBox:hover,
#headNav .searchBox:focus { border-color: #013161 !important; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2) !important;}

#headNav > ul > li.language { margin: 2rem 0 0 min(4rem, 1.5vw); padding: 2rem 0 2.5rem;}
#headNav #langBtn { top: -0.3rem; width: 3rem; height: 4.4rem; background-position: top center;}
#headNav #langBtn:hover { cursor : pointer!important;}
#headNav #langBtn span { display: block; padding: 3.4rem 0 0; font-size: 1.3rem; text-align: center;}
#headNav #langBtn { width: 4rem; background-size: 3rem auto;}
#headNav #langBtn.active ~form .searchBox { height: 12rem;}
#headNav .langMenu { top: 100%; right: -6rem; width: 16rem;}
#headNav .langMenu li { padding: 0;}
#headNav .langMenu a { line-height: 6rem; font-size: 1.6rem;}
#headNav #langBtn.active ~ .langMenu { height: 18rem;}

#menuTrigger { top: 3rem;left: auto; right: 3rem; padding: 4rem 0 0; width: 5rem;}
#menuTrigger a { font-size: 1.5rem;}
#menuTrigger:before,
#menuTrigger:after,
#menuTrigger a:before { height: 0.3rem;}
#menuTrigger:after { top: 1.4rem; }
#menuTrigger a:before { top: 2.7rem; }
#menuTrigger span { letter-spacing: 0.2rem;}
#menuTrigger.active span.close { letter-spacing: 0;}

#menuTrigger.active:before { background: #FFF; -webkit-transform: translate(0, 1.3rem) rotate(225deg); transform: translate(0, 1.3rem) rotate(225deg); }
#menuTrigger.active:after { background: #FFF; opacity: 0; }
#menuTrigger.active a:before { background: #FFF; -webkit-transform: translate(0, -1.5rem) rotate(-225deg); transform: translate(0, -1.5rem) rotate(-225deg); }

#spNav { top: 11rem;}
#spNav .searchBox { display: none;}
#spNav ul { margin: 3rem;}
#spNav li { width: 33.33%; border-bottom: 1px solid #FFF;}
#spNav li a { padding: 3.3rem 3rem 3rem;}
#spNav li:nth-last-child(23) { width: 100%;}
#spNav li.sub,
#spNav li.sub:nth-last-child(2) { margin: 0;}
#spNav .snsLinks { padding: 0 0 3rem;}

.open #headNav li a { color: #FFF !important;}
.open #headNav .list a { background-image: url("../../images/common/icon-fileW.svg");}
.open #headNav .mypage a { background-image: url("../../images/common/icon-userW.svg");}
.open #headNav .langMenu { right: -6rem;}
.open #headNav .langMenu a { color: #000 !important;}
.open #headNav .search { margin: 0 0 0 2rem;}
.open #spNav { height: calc(100vh - 11rem);}

}


@media screen and (max-width:1023.9px){
	.wpPage {
/*20221018再修正		padding-top: 30px!important;    */
    padding-top: 10px!important;
	}
/*SPのメーカーで検索ボタン全体*/
.hidden_box {
    margin: 2em 0;
    padding: 0;
    text-align: center;
}

/*ボタン装飾*/
.hidden_box label {
    padding: 10px;
    font-weight: bold;
    background: #efefef;
    border-radius: 5px;
    cursor :pointer;
    transition: .5s;
}

/*アイコンを表示*/
.hidden_box label:before {
    display: inline-block;
    content: '\f078';
    font-family: 'FontAwesome';
    padding-right: 5px;
    transition: 0.2s;
}

/*ボタンホバー時*/
.hidden_box label:hover {
 /*   background: silver;*/
}

/*アイコンを切り替え*/
input[type=checkbox]:checked ~ label.btn.white.round.small::before,
.hidden_box input:checked ~ label:before {
     content: '\f00d';
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
     color: #668ad8;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*中身を非表示にしておく*/
.hidden_box .hidden_show {
    height: 0;
    padding: 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}

/*クリックで中身表示*/
.hidden_box input:checked ~ .hidden_show {
    padding: 0;/*10px 0;*/
    height: auto;
    opacity: 1;
}
	
ul,li {
list-style: none;
text-align: left;
}

body > main > div.wpPage > div.imgTextGroupM > section.gray.sp-only > div > ul.list01.flexlist__container > li,
body > main > div.wpPage > div.imgTextGroupM > section.gray.sp-only > div > ul.list02.flexlist__container.hidden_show > li { 
text-align: left;
padding: 2rem 0;
}

body > main > div.wpPage > div.imgTextGroupM > section.gray.sp-only > div > ul.list02.flexlist__container.hidden_show {
margin-bottom: 1.8em;
}
.list01,.list02 {
margin: 0;
padding: 0;
}

.list01 {
margin-top: 3.5rem;
}
	
.flexlist__container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}	

.flexlist__container li {
flex: 0 1 50%;
font-size: 1.6rem;
}    
.listmorebtn {
margin-top: 2rem!important;
text-align: center;
}
.flexlist__container > li > a {
text-decoration: none!important;
cursor: pointer;
}
}


/* 諸所追記修正箇所 */

/* マイページ注文商品数の数字部分 */
body > main > form > section > table > tbody > tr > td,
body > main > form > section > table > tbody > tr > td > div > span > input,
body > main > div.wpPage > div.imgTextGroupM > section > div > div.itemList > ul > li > a > figure > figcaption > div,
body > main > div.wpPage > div.imgTextGroupM > section > div > div.itemList > ul > li > a > figure > figcaption > table > tbody > tr > td,
body > main > div > div > div.mainframe_ > div.autopagerize_page_element_ > div > ul > li > a > figure > figcaption > table > tbody > tr > td,
body > main > div > div > div.mainframe_ > div.autopagerize_page_element_ > div > ul > li > a > figure > figcaption > table > tbody > tr > td,
body > main > div > div > div.mainframe_ > div.autopagerize_page_element_ > div > ul > li > a > figure > figcaption > table > tbody > tr > td,
#detailCont > table > tbody > tr > td,
body > main > section > div > ul > li > a > figure > figcaption > table > tbody > tr > td,
body > main > section > table > tbody > tr > td,
body > main > form > section > table > tbody > tr > td.right.net_ > span ,
#catMain > section > form > div.autopagerize_page_element_ > div > ul > li > a > figure > figcaption > table > tbody > tr > td,
body > main > form > section > table > tbody > tr > td > span,
#ledgerDetail > div.itemList > ul > li > a > figure > figcaption > dl > dd /*??*/ {
    font-family: 'Noto Sans','Inter', 'Work Sans',sans-serif;
    font-size: 1.6rem!important;
    font-weight: 500!important;
    letter-spacing: 0.1px;
    line-height: 26px;
}

#catMain > section > form > div.autopagerize_page_element_ > div > ul > li > a > figure > figcaption > table > tbody > tr > td {
    white-space: nowrap;
}


@media screen and (min-width:1024px) and (max-width:1227px) {
body > main > section > form > div:nth-child(1) {
    flex-direction: column;
}
.btn {
    display: inline-block;
    position: relative;
    padding: 1.3rem 2rem;
    width: auto;
    min-width: 20rem;
    color: #FFF !important;
    font-size: 1.8rem;
    font-weight: 900;
    text-align: center;
    text-decoration: none !important;
    line-height: 1.4;
    background: #013161;
    border: none;
    vertical-align: middle;
    cursor: pointer;
    outline: none !important;
    z-index: 0;
    transition: all 0.3s ease;
}
.listCtrl.bottom .btn {
    margin: 1rem auto 2rem!important;
    width: 80%;
}
.btn.large {
    padding: 1.8rem 3rem;
}
}


/*220830*/

/* category */
.category section:last-of-type { padding-bottom: 4rem;}
.category h2 { text-align: left;}


/*@media print, screen and (min-width:1024px) {*/
@media screen and (min-width:1024px) {
#headNav li.pc { display: none !important; }
#iconNav { display: none;}

/* category */
li .category { margin: 1rem 1rem 1.5rem 0;}

.category section:first-of-type { padding-top: 0;}
.category section:last-of-type { padding-bottom: 15rem;}
.category section:last-child .bannerLink { margin-bottom: 0;}

/* header */
#headNav { right: 12rem;}
#headNav li { display: inline-block; margin: 0 0 0 4rem;}
#headNav li.pc { display: none !important;}
#headNav li a { font-size: 1.4rem;}
#headNav li strong { font-size: 2rem;}

header { height: 11rem; }

#logo { padding: 3rem; height: 11rem; text-align: left;}
#logo a { font-size: 1.6rem; text-align: center;}
#logo span { margin: 0 0 0.5rem; height: 5rem;}
#logo img { height: 5rem !important;}

#headNav { top: 15%; right: 11rem; margin: -2rem 0 0;}
#headNav li { margin: 0 0 0 2rem; padding: 0 0 3.2rem;}
#headNav li.pc { display: inline-block !important;}
#headNav li.pc,
/*#headNav .mypage { margin-top: 0.3rem;}*/
#headNav li a { color: #000 !important; font-size: min(1.2rem, 0.8vw); text-align: center; text-decoration: none;}
#headNav li a:hover { opacity: .6;}
#headNav a .notice { top: -1.5rem;right: -1.5rem;width: 2rem;height: 2rem; font-size: 1.2rem;line-height: 2rem;}
#headNav li strong { display: block; margin: 0 0 min(1.4rem, 0.7vw); font-size: min(2rem, 1.1vw); letter-spacing: 0.1rem;}
#headNav .mypage a { padding: 0; width: auto; height: auto; font-size: min(1.2rem, 0.8vw); background: none;}

#headNav #searchBtn { top: -0.3rem; width: 3rem; height: 4.4rem; background-position: top center;}
#headNav #searchBtn:hover { cursor : pointer!important;}
#headNav #searchBtn span { display: block; padding: 3.4rem 0 0; font-size: 1.3rem; text-align: center;}
#headNav #searchBtn.active ~form .searchBox { height: 12rem;}

#headNav .searchBox { top: 100%; right: -11rem;}
#headNav .searchBox p { /*margin: 4rem;*/ margin: 4rem 0; border: 1px solid #333;}
#headNav .searchBox p button { width: 4rem; background-image: url("/images/common/icon-searchB.svg"); background-size: 2.8rem;}
#headNav .searchBox:hover,
#headNav .searchBox:focus { border-color: #013161 !important; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2) !important;}

#headNav .pc.catSub:hover { cursor : pointer!important;}	

#menuTrigger { top: 3rem;left: auto; right: 3rem; padding: 4rem 0 0; width: 5rem;}
#menuTrigger a { font-size: 1.4rem;}
#menuTrigger:before,
#menuTrigger:after,
#menuTrigger a:before { height: 0.3rem;}
#menuTrigger:after { top: 1.4rem; }
#menuTrigger a:before { top: 2.8rem; }
#menuTrigger span { letter-spacing: 0.2rem;}
#menuTrigger.active span.close { letter-spacing: 0;}

#menuTrigger.active:before { background: #FFF; -webkit-transform: translate(0, 1.3rem) rotate(225deg); transform: translate(0, 1.3rem) rotate(225deg); }
#menuTrigger.active:after { background: #FFF; opacity: 0; }
#menuTrigger.active a:before { background: #FFF; -webkit-transform: translate(0, -1.5rem) rotate(-225deg); transform: translate(0, -1.5rem) rotate(-225deg); }

#spNav { top: 11rem;}
#spNav .searchBox p { margin: 3rem;}
#spNav ul { margin: 0 3rem 6rem; border-bottom: 1px solid #FFF;}
#spNav li { width: 33.33%;}
#spNav li:first-child:nth-last-child(2),
#spNav li:first-child:nth-last-child(3),
#spNav li:nth-child(2):nth-last-child(2),
#spNav li:nth-child(2):last-child,
#spNav li:nth-child(3):last-child,
#spNav li:nth-child(3) ~ li:nth-last-child(3),
#spNav li:nth-child(3) ~ li:nth-last-child(2),
#spNav li:nth-child(3) ~ li:last-child { border: none !important;}
#spNav li a { padding: 3.3rem 3rem 3rem;}
#spNav li.sub,
#spNav li.sub:nth-last-child(3) { margin: 2rem 0;}
#spNav .snsLinks { padding: 0 0 3rem;}

#spNav .spNavTitle { margin: 3rem 3rem 2rem;}
#spNav .spNavTitle:first-of-type { margin-top: 6rem;}

.open #headNav li a { color: #FFF !important;}
.open #headNav .list a { background-image: url("/images/common/icon-fileW.svg");}
.open #headNav .mypage a { background: none;}
.open #spNav { height: calc(100vh - 11rem);}

#headNav .pc.catSub:hover { cursor : pointer!important;}	
}
@media screen and (min-width:1200px){

/* base */
#headNav { right: 12rem;}
#headNav li { margin: 0 0 0 min(4rem, 1.5vw);}
#headNav li a { font-size: 1.4rem;}
#headNav li strong { font-size: 2rem;}
#headNav .search { width: 25rem;}

.open #headNav .search { margin: 0 0 0 min(4rem, 1.5vw);}

#footNav .acd-content li { width: calc(33.33% - 4rem);}

/* page */
#catMain #categoryList .categoryL li { width:  calc(33.33% - 4rem);}

.itemList li .enlargeImg { height: 30rem;}

#searchCart .tableFlex div:first-child { margin: 0 1rem 0 0;}

.linkBtns .btn { width: auto; min-width: 19%;}
.linkBtns .btn.gray { order: 0; }
}

#logo img {
    height: 5rem;
    opacity: 1 !important;
   /* margin-top: 5px;   */
}
#headNav .search {
    display: inline-block;
}

#iconNav li:first-child {
    border: none !important;
}
#iconNav li {
    position: static;
    margin: 0 !important;
    width: 25%;
}
#iconNav li.coordinate a {
    letter-spacing: -0.2rem;
    background-image: url(/images/common/icon-coordinateW.svg);
}
#iconNav li.category a {
    background-image: url(/images/common/icon-layoutW.svg);
}
#iconNav li.shop a {
    background-image: url(/images/common/icon-storeW.svg);
}

#iconNav > ul > li.category > div > ul > li > a {
    background-image:none;
}

#iconNav > ul > li.category > div > ul {
    display: block;
    /*
    display: flex;
    flex-direction: column;
    align-items: center;
    */
}
#iconNav .acd-content li {
    margin: 0 15px!important;
    width: calc( 100% - 30px);
}
#iconNav .acd-content li a {
    padding: 1.5rem 2rem;
    font-size: 1.5rem;
    background: url(/images/common/arrowRW.svg) right 1rem center no-repeat!important;
    background-size: 1rem!important;
    text-align: left;
}
@media screen and (min-width:1300px){
    #headNav .submenu li { padding: 2rem;}

}


/* 20220901 表示崩れ修正*/
#headNav > ul > li.search > form > div > p { margin: 3.5rem 0; }
#headNav > ul > li.before { padding: 2rem 0 0; }

/* login_new */
#login h3 { font-size: 2.4rem; font-weight: 600; }
#login > div > div.loginForm { margin-top: 7rem; }


/* 20220927 TOPPAGE-banner */
#bannerArea  { width: 100% !important;}
#bannerArea .bannerArea__inner ul.bnrContainer {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
    gap: 6rem;
    width: 100%;
    max-width: 176rem;
    margin: 6rem auto 0;
}

#bannerArea > div > ul > li {
    width: calc(33.33% -  4rem);
}

#bannerArea > div > ul > li > a > img {
    width: 100%;
}
#bannerArea ul ~ .center { margin: 6rem 0 0;}

div.bnrItem_img { margin-bottom: 1em; }

@media (hover: hover) {
#bannerArea ul a:hover img { opacity: .6;}
}
@media screen and (max-width:1023.9px){
#bannerArea .bannerArea__inner ul.bnrContainer { margin: 0; gap: 2rem;}
#bannerArea > div > ul > li { width: calc((100% -  2rem) / 2);}
div.bnrItem_txt p { line-height: 1.2; font-size: 1.4rem;}
div.bnrItem_img { margin-bottom: 0.5em; }
#bannerArea ul ~ .center { margin: 3rem 0 0;}
}


/* 20221006 品種索引 */

section.kindIndex {
    width: 100%;
    max-width: 1000px;
    margin: 120px auto 0;
}

section.kindIndex h2 {
    font-weight: 600;
    font-size: 4rem;
    margin: 30px auto;
}

section.kindIndex div.kind_container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
/*    background-color: #F37476;    */
}

div.kind_container a { text-decoration: none; }

section.kindIndex dl.kind__inner {
    width: calc( (100% - 40px )/ 3 );
    display: flex;
    flex-direction: column;
/*    border-left: 1px solid #666;
    border-bottom: 1px solid #666;    */
    padding-left: 10px;
}

section.kindIndex dl dt {
    font-weight: 600;
    font-size: 2.6rem;
    border-bottom: solid 1px #666;
    padding-bottom: 5px;
    margin-bottom: 1em;
    text-align: left;
}

section.kindIndex dl dd {
    font-size: 2.0rem;
    line-height: 2.2;
    align-self: flex-start;
}



@media screen and (max-width:767.9px){

    section.kindIndex dl.kind__inner {
    width: calc( (100% - 20px )/ 2 );
    display: flex;
    flex-direction: column;
}
section.kindIndex dl dd {
    width: 100%;
    margin-left: 0;
    line-height: 1.2;
    margin-bottom: 1.5em;
    text-align: left!important;
    }

}

/*20221018*/
/* 表示修正 */

body > main > section:nth-child(7) > h2 {
    margin-top: 60px;
}
body > main > div.wpPage > div > p.btns.sp-only a {
    padding: 0.5em 0;
    margin-bottom: 1em!important;
    width: 80vw;
}

@media screen and (max-width:767.9px){
body > main > section:nth-child(7) > h2 {
    margin-top: 20px;
}  

}

/*20221025 表示修正*/
body > main.payment { max-width: 60vw; margin: 0 auto; }
main.payment table tr th,
main.payment table tr td { border: none; }
/*body > main > form > section:nth-child(5) > p:nth-child(6) > textarea { max-width: 70vw!important; }*/
body > main > section:nth-child(2) > h1 { margin-bottom: 50px!important; }
body > main > section:nth-child(2) > h2,
#orderDetail > div > h3 { width: 60vw; margin: 0 auto 30px!important;}
#orderDetail > div > dl:first-child { max-width: 60vw; margin: 0 auto 10px; }
#orderDetail > div > dl { max-width: 60vw; margin: 0 auto 30px; }
body > main > section:nth-child(3),body > main > section.comments { width: 60vw; margin: 0 auto 30px!important; }
#orderDetail > div > dl.white { margin: 0 auto 30px;}
#orderDetail > div > p.note { width: 60vw; margin: 0.5em auto 0.2em; }
#orderDetail > div > p:nth-child(3) { width: 60vw; margin: 0 auto 2em; }

#quickorder_form { margin: 0 auto 30px; }
#quickorder_form > div.input_area_ > ul,
#quickorder_form > div.input_area_ > div.formlist_.bulkorder_,
#quickorder_form > div:nth-child(2) { margin-bottom: 1.5em; }

body > main > div > form > div.top_box_ > div.rightfloat_  { padding-bottom: 30px; }
body > main > div > form > div.top_box_ > div.search_box_.leftfloat_  { padding: 2em 0; }
body > main > div > form > div.top_box_ > div.search_box_.leftfloat_ > input.keyword_,
body > main > div > form > div.top_box_ > div.search_box_.leftfloat_ > input[type=submit]:nth-child(2){ margin: 0.5em 0; }
body > main > div > form > div.address_item_ { margin: 1em 0; padding-top: 1em; }

body > main > div > form > div:nth-child(3) { margin-bottom: 8em; }

body > main > div > form > div > div.address_title_ { font-size: 2.0rem; font-weight: bold; margin-bottom: 0.5em; }
body > main > div > form > div > address { line-height: 2; margin-bottom: 1em;}

body > main > div > form > div.top_box_ > div.search_box_.leftfloat_ {
    display: flex;
    justify-content: center;
}
body > main > div > form > div.top_box_ > div.search_box_.leftfloat_ > input.keyword_ {
    box-sizing: border-box;
    border-radius: 0!important;
    padding: 1.5em!important;
}
body > main > div > form > div.top_box_ > div.search_box_.leftfloat_ > input[type=submit]:nth-child(2) {
    padding: 0.2em 1em!important;
    background-color: #013161!important;
    color: #fff!important;
    font-weight: 500;
    border: 0.5px solid #fff!important;
    box-sizing: border-box;
    letter-spacing: 5px;
}

body > main > div > form > div > div.address_change_ {
    border: solid 1px #353D89;
    font-weight: 500;
    background-color: #887D58;
    text-align: center;
    display: inline-block;
    width: auto;
    padding: 0.5em 2em;
    margin: 0 0 1em;
}
body > main > div > form > div > div.address_change_ a {
    color: #fff;
    text-decoration: none;
    letter-spacing: 0.2;
}

body > main > div.customer_.col1_ { margin-top: 20px; }
body > main > div.customer_.col1_ > h1 { margin-top: 1em; }
body > main > div.customer_.col1_ > form > table > tbody > tr { border-bottom: solid 0.5px #999; }
body > main > div.customer_.col1_ > form > table > tbody > tr > th { 
    width: 25%;
    background-color: #e6eaef;
    border-bottom: none;
    border-right: solid 1px;
}
body > main > div.customer_.col1_ > form > table > tbody > tr > td { border-bottom: none; }

body > main > div.customer_.col1_ > form > table > tbody > tr > th > img { margin-right: 1em; }
body > main > div.customer_.col1_ > p.message_ { margin-bottom: 2em; }

body > main > div.contact_.col1_ { margin: 20px auto; max-width: 60vw; }

body > main > section > form > div.listCtrl.bottom { margin-bottom: 3em; }
body > main > section > form > div.itemList > ul > li {
    padding: 1em;
    border: #ccc solid 0.5px;
}
body > main > section > form > div.itemList > ul > li > a > figure > div.cartgoods_ > input[type=checkbox] { transform: scale(1.5); margin: 0.5em 0 0 0.5em; }
body > main > section > form > div.itemList > ul > li > div > a > img { vertical-align: top; margin-top: 0.5em;}

@media screen and (max-width:1023.9px){
body > main.payment { max-width: 80vw; margin: 0 auto; }
body > main > div.contact_.col1_ { margin: 20px auto; max-width: 80vw; }
body > main > div.customer_.col1_ > form > table > tbody > tr > th { width: 100%; border-bottom: none; border-right: none;}
body > main > div.customer_.col1_ > form > div > a > img,
body > main > div.customer_.col1_ > form > div > input[type=image]:nth-child(2) { margin-bottom: 1em; }
body > main > div.customer_.col1_ > h2 { font-size: 3.6rem; }
#orderDetail > div > dl:first-child { max-width: 80vw; }
#orderDetail > div > dl { max-width: 80vw; }
#orderDetail > div:nth-child(2) > p { margin: 0 auto; text-align: center; }
body > main > section:nth-child(3),body > main > section.comments { width: 80vw; }
}

@media screen and (max-width:767.9px){
body > main.payment,
body > main > div.contact_.col1_ { max-width: 100%; margin: 0 auto; }
#quickorder_form { width: 95vw!important; margin: 0 auto 30px;}
#quickOrder { width: 100%; padding: 2rem !important;}
body > main > form > section:nth-child(5) > p:nth-child(6) > textarea { max-width: 100%!important; }
#orderDetail > div > dl { max-width: 100%!important; }
#orderDetail > div > dl:first-child,
#orderDetail > div > dl,
body > main > section:nth-child(2) > h2,
#orderDetail > div > h3,
#orderDetail > div > p.note,
#orderDetail > div > p:nth-child(3),
body > main > section:nth-child(3),
body > main > section.comments { width: 80vw!important; max-width: 100%; }
    
}


/* 221027修正 */
body > main.detail > section:nth-child(3) { width: 80vw; }
body > main > div.col1_ > div.order_.spandual_,
body > main > div.col1_ > div.order_.spandual_ > div.estimate_listframe_ {
    width: 100%!important;
    max-width: 80vw!important;
    margin: 0 auto;
}

body > main > div > div > table.estimate_top_ {
    margin-top: 3em;
    border: none;
}

body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ {
    width: 100%;
    max-width: 60vw;
    margin: 0 auto;
    border-right: 1px solid;
    border-left: 1px solid;
}
body > main > div > div > div > div > table.formlist_.estimate_.dest_ {
    width: 100%;
    max-width: 60vw;
    margin: 0 auto;
    border-right: 0.5px solid;
    border-left: 0.5px solid;
    margin-bottom: 2em;
}
body > main > div > div > div > div > table.formlist_.estimate_.dest_ > tbody > tr > th {
    padding: 2rem 3rem;
    background-color: #f1f5f9;
}
body > main > div > div > div > div > table.formlist_.estimate_.dest_ > tbody > tr > td {
    padding: 2rem 3rem;
}

body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr > th,
body > main > div > div > div > div > table.formsublist_.destspeclist_ > tbody > tr > th {
    width: 35%;
    font-size: 1.8rem;
    font-weight: 500;
    background-color: #f1f5f9;
    padding: 2rem 3rem!important;
}
body > main > div > div > table.estimate_top_ > tbody > tr > td > table > tbody > tr > td {   
        padding: 2rem 3rem;
}
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr:nth-child(6) > td {
    font-weight: 600;
    color: #222;
    padding: 2rem 3rem;
}
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr > td {
    vertical-align: middle!important;
}
body > main > div > div > table.estimate_top_ > tbody > tr > td {
    border: none;
}
body > main > div > div > div > div > div.estimate_block_ > table.formsublist_.destgoodslist_.request_confirm_,
body > main > div > div > div > div > table.formsublist_.destspeclist_ {
    width: 100%;
    max-width: 60vw;
    margin: 0 auto;
    border-right: 0.5px solid;
    border-left: 0.5px solid;
    margin-bottom: 2em;
}
body > main > div > div > div > div > div.estimate_block_ > table.formsublist_.destgoodslist_.request_confirm_ > tbody > tr > th,
body > main > div > div > table.formlist_.method_ > tbody > tr:nth-child(1) > th {
    background-color: #f1f5f9;
    padding: 2rem 3rem;
}
body > main > div > div > div > div > div.estimate_block_ > table.formsublist_.destgoodslist_.request_confirm_ > tbody > tr > td,
body > main > div > div > table.formlist_.method_ > tbody > tr:nth-child(2) > td,
body > main > div > div > div > div > table.formsublist_.destspeclist_ > tbody > tr > td {
    padding: 2rem 3rem;
}
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_goodsname_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_qty_ {
    border-right: 0.5px dotted #ccc;
}

body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th.estimate_qty_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th.estimate_amt_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_qty_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_amt_ {
    text-align: center;
}
body > main > div > div > table.formlist_.method_ {
    width: 100%;
    max-width: 60vw;
    margin: 0 auto;
    border-right: 0.5px solid;
    border-left: 0.5px solid;
    margin-bottom: 2em;
}
body > main > div.col1_ > div.order_.spandual_ > section > form > div.listCtrl.bottom {
    width: 60vw;
    margin-left: auto;
    margin-right: auto;
}
#suggestArea { margin: 0 auto 10px;}
body > main.list > form > section > h1 {
    text-align: center;
}
body > main > section:nth-child(3) > table > thead > tr > th.right {
    width: 14%!important;
}
body > main > section:nth-child(3) > table > thead > tr > th.sales_delivery_spec_ {
    width: 20%!important;
}

@media screen and (max-width: 1023.9px){
   
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th {
    width: 30%;
    font-size: 1.8rem;
    font-weight: 500;
    background-color: #f1f5f9!important;
    padding: 2rem 3rem!important;
    text-align: left;
}  
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr > th,
body > main > div > div > div > div > table.formsublist_.destspeclist_ > tbody > tr > th{
    width: 100%;
}
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th,
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr > th,
body > main > div > div > div > div > table.formsublist_.destspeclist_ > tbody > tr > th {
    width: 100%;
    max-width: none;
}
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th.estimate_qty_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > th.estimate_amt_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_qty_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr > td.estimate_amt_ {
    text-align: left;
}
    
body > main > section:nth-child(3) > table.orderList > tbody > tr > td.center {
    display: none;    
}    
     
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ {
    width: 100%;
    max-width: 80vw;
}
body > main > div > div > div > div > table.formlist_.estimate_.dest_ {
    width: 100%;
    max-width: 80vw;
}
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_ > tbody > tr > th,
body > main > div > div > div > div > table.formsublist_.destspeclist_ > tbody > tr > th {
    width: 100%;
}
body > main > div > div > div > div > div.estimate_block_ > table.formsublist_.destgoodslist_.request_confirm_,
body > main > div > div > div > div > table.formsublist_.destspeclist_ {
    width: 100%;
    max-width: 80vw;
}
body > main > div > div > table.formlist_.method_ {
    width: 100%;
    max-width: 80vw;
}
body > main > div.col1_ > div.order_.spandual_ > section > form > div.listCtrl.bottom {
    width: 80vw;
}
body > main > section:nth-child(3) > table > thead > tr > th.right { width: 25%!important; }
    
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr:nth-child(2) > td.estimate_maker_,
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr:nth-child(2) > td.estimate_itemcode_ {
    border-bottom: none;
    }
body > main > div > div > div > div > div.estimate_block_ > table > tbody > tr:nth-child(2) > td.estimate_itemcode_ {
    padding-top: 0!important;
    padding-bottom: 0!important;
}
    
    
}
@media screen and (max-width:767.9px){
body > main > div > div > table.estimate_top_ > tbody > tr > td > table.formdetail_.estimate_method_,
body > main > div > div > div > div > table.formlist_.estimate_.dest_,
body > main > div > div > div > div > div.estimate_block_ > table.formsublist_.destgoodslist_.request_confirm_,
body > main > div > div > div > div > table.formsublist_.destspeclist_,
body > main > div > div > table.formlist_.method_ {
    width: 100%;
    max-width: none;
}
    
}


/*WP固定ページサンプル共通レイアウト*/


/* M2-2 
▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
M2-2　スマホ版で縦1列並びで文字も画像の下 */

 /*親要素*/
.imgTextGroupM2-2 {
     display: flex;
     align-items: stretch;
     flex-wrap: wrap; 
     box-sizing: border-box;
     max-width: 184rem;
     margin: 0 auto!important;
     gap: 15px;
  }

 /* 子要素 */
.imgTextGroupM2-2 > div {
     box-sizing: border-box;
     width: calc((100% - 30px) / 3);
     display: flex;
     flex-direction: column;
     align-items: stretch;
 }

 /*子要素の中の画像*/
 .imgTextGroupM2-2 > div > img {
     width: 100%;
     height: auto;
     object-fit: cover; /**/
     display: block;
     margin-bottom: 4rem;
 }

/* M2 見出しテキスト小 */
body > main > div.wpPage > div.imgTextGroupM2-2 > div > div {
    display: flex;
    flex-direction: column;    
}

 /* 本文テキスト */
 .imgTextGroupM2-2 > div > p {
     display: block;
     width: 100%;
     padding: 0;
     box-sizing: border-box;
 }


 /*@media print, screen and (max-width:1023.9px){*/
 @media screen and (max-width:1023.9px){
/* 親要素 */
.imgTextGroupM2-2 {
    box-sizing: border-box;
    margin: 0 1rem!important;
    padding: 0!important;
}

.imgTextGroupM2-2 > div {
    width: 100%;
}
     
.imgTextGroupM2-2{
    flex-direction: column;
}

}



/*20221108 修正*/

body > main.proceedingDetail > section.comments { padding-top:30px!important; }

/*20221117  v     g  p   */


/*  p   T C Y ?w  iA4 j */



@media print, screen and (min-width: 300px){

body#print_ledger {
    background: #FFF;
    display: flex;
    flex-flow: column;
    min-height: 100vh;
    padding: 0;
    width: 100%;
}
main#print_main {
    flex: 1;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    height: calc(100% - 600px);
    page-break-inside:avoid;
}

#print_header {
    display: block;
    top: 0;
    background-color: #FFF!important;
    height: 410px;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: static!important;
}

#print_header article {
    height: 110px;
}

#print_header ul.print_header__inner01,
#print_header ul.print_header__inner02,
#print_footer div.print_footer__inner {
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;
    background-color: #FFF;
}


#print_header ul.print_header__inner01 {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
}
#print_header > ul.print_header__inner01 > li > a > img {
    width: 100%;
    max-width: 300px;
}

#print_header h2 { margin: 0; }

#print_header ul.print_header__inner02 {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#print_header ul.print_header__inner02 li:nth-child(1) {
    margin-bottom: 30px;
}

#print_ledger div.contaier {
  display: grid; 
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr; 
  grid-template-rows: 1fr 1fr; 
  gap: 5rem 3rem; 
    justify-content: space-between;
    margin-bottom:50px;
}

#print_ledger div.contaier div.item {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

#print_main div.enlargeImg {
    text-align: center;
}

#print_ledger figcaption {
    display: flex;
    flex-direction: column;
    gap: 10px 0;
}

#print_ledger figcaption a { text-decoration: none; }

#print_ledger figcaption dl {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    gap: 10px 0;
}

#print_ledger figcaption dt { width: 70%; }
#print_ledger figcaption dd { width: 30%; text-align: right;}

#print_footer {
    width: 100%;
    max-width: 1200px;
    margin: 30px auto 0;
    bottom: 0;
    padding: 20px;
    text-align: center;
    background: #FFF;
    }
}

@media print {
    #print_header,#print_footer { 
        position: fixed!important; 
        margin-left: auto!important; 
        margin-right: auto!important;
    }
    
    #print_header { margin-top: -100px; }
    
    #print_ledger div.contaier { 
        margin-top: 310px;
        break-after: page; 
        gap: 0;
    }
    
    #print_ledger div.contaier div.item {
       /* border: solid #ccc 1px;*/
        padding: 10mm;
    }

    #print_main > div > div.item > a > figure > div > img { 
        object-fit: contain;
        padding: 5mm!important;
    }
    
}