/* ==============================
簡易リセットCSS（組み込み時、大元リセットCSS入る？）
============================== */
ul {
list-style: none;
margin: 0;
padding: 0;
}

dl, dt, dd {
margin: 0;
padding: 0;
}

.wrap p {
    margin: 1em 0;
}

a {
    color: black;
    text-decoration: none;
}

a:hover {
    color: #EBC52F;
}

/* ==============================
共通CSS
============================== */
@media only screen and (min-width: 428px) {
.allwrap {
padding: 8px 4%;
}
.wrap {
width: 100%;
max-width: 910px;
margin: 0 auto;
}
}

.wrap {
width: 100%;
max-width: 910px;
}

.wrap-l {
max-width: 1200px;
}

.c-grid {
display: grid;
}

.c-flex {
display: flex;
}

.pc_on {
display: block;
}

.sp_on {
display: none;
}

.in_pc_on {
display: inline;
}

.in_sp_on {
display: none;
}

.br_pc_on {
display: inline;
}

.br_sp_on {
display: none;
}

.block {
display:block;
}

.breadcrumbs span {
font-size: 1.1rem;
}

.wrap p {
font-size: 1.4rem;
}

.wrap li {
font-size: 1.4rem;
}

.wrap a {
font-size: 1.4rem;
}

.wrap th {
font-size: 1.4rem;
}

.wrap table {
font-size: 1.4rem;
}

.wrap .big {
font-size: 1.6rem;
font-weight: bold;
}

.indent {
text-indent: -1em;
padding-left: 1em;
}

.indent {
    margin-top: 1em;
  }

/* ==============================
パンくず
============================== */
.block-topic-path--list {
display: flex;
font-size: 1.1rem;
}

.block-topic-path--list a {
text-decoration: underline;
}

/* ==============================
feature（特集一覧）
============================== */
.wrap-inner {
margin-bottom: 80px;
box-sizing: border-box;
}

.wrap-inner * {
box-sizing: border-box;
}

.mv {
margin: 60px 0;
}

.l-box__ttl {
    width: 100%;
    text-align: center;
    position: relative;
}

h2.ttl {
    margin: 0 0 1em;
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    padding: 0 1em 0.2em;
    display: inline-block;
    border-bottom: 1px solid #000;
}

.wrap-inner h3 {
font-size: 2.3rem;
text-align: left;
border-left: 5px solid #EBC52F;
line-height: 1.5384615385;
padding-left: 20px;
}

.wrap-inner h3 a {
font-size: 2.3rem;
}

.wrap-inner p {
margin-top: 1em;
}

.wrap-inner .p-margin0 {
margin-top: 0;
}

.align-center{
text-align: center;
}

.c-box {
margin-top: 30px;
}

.c-box__inner {
width: 100%;
justify-content: space-between;
margin: 0;
padding: 0 25px;
}

.c-box .c-box__inner picture {
display: block;
width: 42%;
}

.c-box .c-box__inner figcaption {
width: 52%;
}

.c-itemlist .c-grid {
    margin: 0 auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 40px 4.4%;
}

.c-item .c-item__name {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.44;
    text-align: justify;
    margin-bottom: 6px;
    font-feature-settings: "palt" 1;
}

.c-item .c-item__price {
    font-size: 1.6rem;
    line-height: 1.5;
    text-align: justify;
    margin-bottom: 6px;
}

.c-grid {
    display: grid;
}

/* 左右交換 */
.replacement {
flex-direction: row-reverse;
}

/* アンカーリンク */
.anchorlink {
padding-top: 100px;
margin-top: -100px;
}


.background {
background-color: #F6F6F6;
padding: 30px 0 35px 0;
}

.background_skin {
background-color: #faf1ed;
padding: 30px 0 35px 0;
}

position-re {
position: relative;
}

position-ab {
position: absolute;
}

/* 下矢印 */
.down-arrow {
display: inline-block;
vertical-align: middle;
line-height: 1;
width: 0.7em;
height: 0.7em;
border: 2px solid;
border-left: 0;
border-bottom: 0;
box-sizing: border-box;
transform: translateY(-25%) rotate(135deg);
margin: 7px 5px 5px 5px;
}


/**********************************

PCのみのCSSを記述

***********************************/


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


/* PCで非表示 */
.pc-hidden {
display: none !important;
}

/* c-boxの上に文章を置くときにサイドの余白を作成 */
.p-padding-side {
padding: 0 25px;
}

th {
padding: 0 10px;
}

/* PCでのみmargin削除 */
.wrap-inner .p-pc-margin0 {
margin-top: 0;
}

/* pcで横並びにする */
.pc-flex {
display: flex;
}

/* 横並びを50％:50％にする */
.half {
width: 50%;
}

/* ボタンをSPで中央揃えにするために */
.left-auto {
margin-left: auto;
}

/* 春のお茶特集 */
.gift-introduction {
height: 48px;
}

.e-box__inner_child .pc-name {
height: 3em;
}



}










/************************************

スマホサイズver

***********************************/





@media screen and (max-width: 768px) {
/* ==============================
共通CSS
============================== */
.pc_on {
display: none;
}
.sp_on {
display: block;
}

.in_pc_on {
display: none;
}
.in_sp_on {
display: inline;
}

.br_pc_on {
display: none;
}

.br_sp_on {
display: inline;
}

.sp-hidden {
display: none !important;
}

    h2.ttl {
        font-size: 18px;
    }
    
.wrap-inner .h3-margin0 {
margin-top: 0;
}

.wrap-inner h3 {
font-size: 1.6rem;
}

.wrap-inner h3 a {
font-size: 1.6rem;
}

.wrap p {
font-size: 1.4rem;
}

.wrap li {
font-size: 1.4rem;
}

.wrap a {
font-size: 1.4rem;
}

.wrap th {
font-size: 1.4rem;
}

.wrap table {
font-size: 1.4rem;
}

.wrap .big {
font-size: 1.5rem;
}

.sp_rink-underline {
text-decoration:underline solid;
}

/* ==============================
パンくず
============================== */
.block-topic-path--list {
display: flex;
font-size: 1.1rem;
}

.block-topic-path--list a {
text-decoration: underline;
}

/* ==============================
feature（特集一覧）
============================== */
.wrap-inner {
margin-bottom: 10.67vw;
}

.wrap-inner .title {
margin-bottom: 20px;
}

.c-box__inner {
flex-wrap: wrap;
padding: 0 3.33vw;
}

.c-box .c-box__inner picture {
width: 100%;
}

.c-box .c-box__inner figcaption {
width: 100%;
}

.c-itemlist .c-grid {
        grid-template-columns: 1fr 1fr;
        gap: 4vw 5.33vw;
    }
    
    .c-item .c-item__name {
        font-size: 14px;
    }

p.btn {
margin: 16px 0;
}

a.btn {
display: block;
padding: 10px 0;
background-color: #000000;
color: #fff;
transition: all .2s ease;
max-width: 300px;
margin-left: auto;
text-align: center;
}

.banner {
padding: 1em 45px;
border: solid 1px;
display: inline-flex;
margin-top: 20px;
background-color: #fff;
}

.table-product-name {
padding: 0 5px;
}

.wrap .numbers_top_left {
font-size: 20px;
background: #91908e;
border-radius: 50%;
width: 30px;
height: 30px;
color: #fff;
text-align: center;
line-height: 30px;
position: absolute;
top: 0;
left: 0;
padding: 0;
z-index: 10;
}


}