
/*====================================================
////id |  archive
====================================================*/
#archive_mv {
    color: #fff;
    position: relative;
}
#archive_mv::before {
    background: #7B7B7B url('https://grubsport.com/wp-content/uploads/2023/10/NEUTRAL-2.jpg') no-repeat;
    background-position: right;
    background-size: auto 100%;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        top: 0;
        right: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
}
#archive_mv::after {
    background: rgba(0, 0, 0, .4);
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        top: 0;
        left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}
#archive_mv h1 {
    display: grid;
    margin-bottom: min(8vw, 90px);
}
#archive_mv h1 .en {
    display: block;
    font-size: min(15vw, 6rem);
    line-height: 1.0;
}
#archive_mv h1 .jp {
    font-size: min(4vw, 18px);
}
#archive_mv p {
    font-size: min(4vw, 20px);
    font-weight: 700;
}
#archive_banner {
    margin: 0 -5px 0;
    width: calc(100% + 10px);
}
#archive_banner .item {
    padding: 0 5px;
}
.archiveName {
    text-align: center;
    margin-bottom: .8em;
}
.archive_itemBox {
    display: grid;
        grid-gap: min(8vw, 50px) min(4vw, 30px);
}
.archive_item a {
    display: grid;
        grid-gap: min(3vw, 15px) min(3.8vw, 15px);
        grid-template-rows: auto 1fr auto;
    height: 100%;
}
.archive_item .coverImg {
    padding-top: 100%;
    transition: .3s ease-in-out;
}
.archive_item .txtBox {
    display: grid;
        grid-template-rows: auto 1fr auto;
}
.archive_item .title  {
    font-size: min(4.1vw, 17px);
    font-weight: 700;
    line-height: 1.6;
    margin: .3em 0;
}
.archive_item .priceBox {
    display: flex;
        align-items: center;
        flex-wrap: wrap;
        grid-gap: .3em .5em;
        justify-content: space-between;
    line-height: 1.2;
}
.archive_item .priceBox .small_lot {
    font-size: min(3vw, 12px);
}
.archive_item .priceBox .price {
    flex: auto;
    font-size: min(3.3vw, 13px);
    font-weight: 700;
    text-align: right;
    white-space: nowrap;
}
.archive_item .priceBox .price_no {
    font-size: 1.3em;
}
.archive_item .linkBtn {
    font-size: .9em;
    min-height: 2.5em;
    width: 100%;
        min-width: 0;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    .column_wrapper {
        display: grid;
            grid-gap: min(20vw, 60px);
            grid-template-columns: minmax(0, 1fr);
        
    }
    #archive_contents .column_wrapper {
        margin: auto;
        max-width: 500px;
    }
    /* #main_section {
        margin-top: min(12vw, 60px);
    } */
    #archive_contents #sidebar {
        grid-row: 2;
        width: 100%;
    }

    .archive_itemBox {
        grid-template-columns: 1fr;
    }
    .archive_item a {
        grid-gap: 8px 15px;
        grid-template-columns: 40% 1fr;
        grid-template-rows: 1fr auto;
    }
    .archive_item .imgBox {
        grid-row: 1 / 3;
    }
    .archive_item .btnBox {
        grid-column: 2;
        align-self: flex-end;
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 960px) {
    #archive_contents .column_wrapper {
        display: grid;
            grid-template-columns: minmax(0, 1fr) 260px;
    }
    #archive_contents #main_section {
        grid-column: 1;
        grid-row: 2;
    }
    #archive_contents #sidebar {
        grid-column: 2;
        grid-row: 1 / 3;
    }
    #archive_banner a {

    }
    .archive_itemBox {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
    #archive_contents .column_wrapper {
        display: grid;
            grid-gap: min(5vw, 60px)
    }
    #archive_contents #sidebar {
        grid-row: 2;
        width: 100%;
    }
    .archive_itemBox {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (min-width:960px) and (max-width:1180px) {
    .archive_itemBox {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (hover: hover) {
    .archive_item a:hover {
        opacity: 1;
    }
    .archive_item a:hover .coverImg {
        transform: scale(1.05);
    }
    .archive_item a:hover .coverImg img {
        transform: none;
    }
}

/*====================================================
////id |  sidebar
====================================================*/
#side_category {
    background: #F5F5F5;
    padding: min(6vw, 25px) min(5vw, 18px);
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
}

@media (hover: hover) {}


/*====================================================
////id |  single
====================================================*/
#single_contents .slick-dotted.slick-slider {
    margin-bottom: 40px !important;
    padding-bottom: 0px;
}
#single_contents .slick-dots {
    display: flex;
        justify-content: center;
    height: 20px;
    position: absolute;
        top: calc(100% + 1em);
        left: 0;
        right: 0;
    z-index: 10;
}
#single_contents .slick-dots li {
    width: auto;
    height: auto;
    margin: 0;
    /* margin: 0 4px; */
    padding: 0;
}
#single_contents .slick-dots li::before {
    display: none;
}
#single_contents .slick-dots li button {
    background: none;
    border: none;
    cursor: pointer;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-indent: -9999px;
    width: 20px;
    height: 20px;
}
#single_contents .slick-dots li button:before {
    background: var(--gray);
    border-radius: 10px;
    content: '';
    margin: auto;
    opacity: 1;
    position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    transition: .2s ease-in-out;
    width: 8px;
    height: 8px;
}
#single_contents .slick-dots li.slick-active button:before {
    background: var(--mainColor);
    opacity: 1;
}

#single_contents .slick-arrow {
    background: rgba(255, 255, 255, .6);
    border: solid 2px #fff;
    border-radius: 100%;
    margin: auto;
    position: absolute;
        top: 0;
        bottom: 0;
    transition: .2s ease-in-out;
    transform: none;
    width: min(6vw, 30px);
    height: min(6vw, 30px);
    z-index: 1000;
}
#single_contents .slick-prev {
    left: calc(min(3vw, 15px) * -1);
}
#single_contents .slick-next {
    right: calc(min(3vw, 15px) * -1);
}
#single_contents .slick-arrow:hover {
/*	background: #fff;*/
    opacity: 1;
}
#single_contents .slick-prev * {
    display: none;
}
#single_contents .slick-arrow:before {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 24 24"><path fill="%23333333" d="M12,0C5.37,0,0,5.37,0,12s5.37,12,12,12,12-5.37,12-12S18.63,0,12,0ZM10.77,16.17l-1.34-1.34,2.93-2.93-2.93-2.93,1.34-1.34,4.27,4.27-4.27,4.27Z" /></svg>') no-repeat center / contain;
    box-sizing: border-box;
    content: '';
    margin: auto;
    position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    transition: .3s ease-in-out;
    width: 100%;
    height: 100%;
}
#single_contents .slick-prev:before {
    transform: rotate(-180deg);
}
#single_contents .slick-arrow.slick-disabled {
    cursor: default;
    opacity: 0;
    pointer-events: none;
}
  
/*====================================================
////id |  product_detail
====================================================*/
#single_contents #product_detail .innerBox {
    padding: min(8vw, 80px) 0 0;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 959.8px) {
    #single_contents #product_detail .innerBox {
        margin: auto;
        max-width: 600px;
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 960px) {
    #single_contents #product_detail .wrapBox {
        display: grid;
            align-items: flex-start;
            grid-gap: min(15vw, 100px) min(5vw, 50px);
            grid-template-columns: min(40vw, 600px) 1fr;
    }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
}

@media (hover: hover) {
}
  
/*====================================================
////id |  product_img
====================================================*/
#single_contents #product_img .coverImg {
    padding-top: 100%;
}
#single_contents #product_img .thumbnail {
    margin-top: 10px;
}
#single_contents #product_img .thumbnail .slick-track {
    display: grid;
        grid-gap: 10px;
        grid-template-columns: repeat(5, 1fr);
    transform: unset !important;
    width: 100% !important;
    display: grid !important;
        grid-gap: 5px;
        grid-template-columns: repeat(6, 1fr);
  }
#single_contents #product_img .thumbnail .slick-slide {
    display: block!important;
    float: none !important;
    width: 100% !important;
}
#single_contents #product_img .thumbnail .slick-track:before {
display: none;
}
#single_contents #product_img .thumbnail .slick-track:after {
display: none;
}
  
#single_contents #product_img .item {
    padding: 0 2px;
}
#single_contents #product_img .thumbnail .coverImg {
    cursor: pointer;
    transition: .3s ease-in-out;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 960px) {
    #single_contents #product_img {
        position: sticky;
            top: 110px;
    }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
}

@media (hover: hover) {
    #single_contents #product_img .thumbnail .coverImg:hover {
        opacity: 1;
    }
}

/*====================================================
////id |  prodcut_text
====================================================*/
#single_contents #prodcut_text .category {
    display: flex;
        flex-wrap: wrap;
        grid-gap: .3em;
        margin-bottom: .5em;
}
.cate_item {
    font-size: min(3vw, 12px);
}
#single_contents #prodcut_text h1 {
    font-size: min(6.5vw, 30px);
    line-height: 1.5;
    margin-bottom: .7em;
}
#single_contents #prodcut_text p a {
    -webkit-text-decoration: underline dotted 1px;
	text-decoration: underline dotted 1px;
	text-underline-position: under;
	text-underline-offset: 0.1em;
}
#single_contents #prodcut_text .detailBox {
    font-size: min(3.8vw, 15px);
    margin-top: 1.6em;
}
#single_contents #prodcut_text .detailBox dt {
    background: #EEEEEE;
    border-radius: 2px;
    display: inline-block;
    font-size: .875em;
    font-weight: 700;
    margin-bottom: .5em;
    padding: .1em 1.2em .07em;
}
#single_contents #prodcut_text .detailBox dd .markList.dot {
    display: flex;
        flex-wrap: wrap;
        grid-gap: 0 .7em;
    line-height: 1.4;
}
#single_contents #prodcut_text .detailBox dd .markList.dot li {
    margin-top: 0;
}
#single_contents #prodcut_text .detailBox dd .markList.attentionMark {
    font-size: min(3.0vw, 11px);
    margin-top: .8em;
}
#single_contents #prodcut_text .detailBox dd .size_list_wrapper {
    overflow-x: scroll;
    white-space: nowrap;
    padding: .5em 0;
}
#single_contents #prodcut_text .detailBox dd .size_list_table {
    padding: 0 1px 0 0;
    text-align: center;
    min-width: 100%;
}
#single_contents #prodcut_text .detailBox dd .size_list_table table {
    border: none;
	border-collapse:separate;
	border-spacing:0;
    line-height: 1.4;
    min-width: 100%;
    overflow: visible;
}

#single_contents #prodcut_text .detailBox dd .size_list_table table td {
    padding: .4em 1em;
}
#single_contents #prodcut_text .detailBox dd .size_list_table table th:last-child,
#single_contents #prodcut_text .detailBox dd .size_list_table table td:last-child {
    border-right: none;
}
#single_contents #prodcut_text .detailBox dd .size_list_table table th:first-child ,
#single_contents #prodcut_text .detailBox dd .size_list_table table td:first-child {
    border-right: solid 1px var(--l_gray);
    position: sticky;
        left: 0;
}
#single_contents #prodcut_text .orderBox {
    display: flex;
        align-items: flex-end;
        flex-wrap: wrap;
        grid-gap: .3em 1em;
    margin-top: min(8vw, 30px);
    white-space: nowrap;
}
#single_contents #prodcut_text .orderBox .price {
    flex: 1;
    font-size: min(6vw, 30px);
    font-weight: 700;
    line-height: 1;
    text-align: right;
}
#single_contents #prodcut_text .orderBox:has(.price.price_variation) {
    display: grid;
}
#single_contents #prodcut_text .orderBox .price.price_variation {
    /* display: flex;
        justify-content: flex-end;
    flex: unset; */
    display: grid;
        grid-gap: 0 .5em;
        grid-template-columns: 1fr auto;
    font-size: min(5.5vw, 24px);
    margin-top: .3em;
    width: 100%;
}
#single_contents #prodcut_text .orderBox .price.price_variation ul {
    display: grid;
        grid-template-columns: subgrid;
        grid-column: span 2;
        align-items: baseline;
}
#single_contents #prodcut_text .orderBox .price.price_variation .title {
    font-size: .8em;
}
/* #single_contents #prodcut_text .orderBox .price.price_variation td:first-child {
    font-size: .8em;
    padding-right: .3em;
} */
#single_contents #prodcut_text .orderBox .price .small_lot {
    font-size: min(4.4vw, 18px);
}
#single_contents #prodcut_text .orderBox .price .price_no {
    font-size: 1.4em;
}
#single_contents #prodcut_text .orderBox .price .tax {
    font-size: .5em;
}
#single_contents #prodcut_text .orderBox .price_attention {
    display: flex;
        justify-content: flex-end;
    font-size: min(3.0vw, 12px);
    margin-top: .8em;
    width: 100%;
}

#single_contents #prodcut_text .linkArea {
    font-weight: 700;
    margin-top: min(15vw, 45px);
    text-align: center;
}
#single_contents #prodcut_text .linkArea .text {
    font-size: min(4.2vw, 18px);
}
#single_contents #prodcut_text .linkBtn {
    font-size: min(4.5vw, 20px);
    margin-top: 10px;
    width: 100%;
}
#single_contents #prodcut_text .linkBtn.btn-line {
    background: #00B900;
}
#single_contents #prodcut_text .linkBtn .link_icon {
    display: inline-block;
    margin-right: .5em;
    vertical-align: -.25em;
    width: 1.2em;
    height: 1.3em;
}
#single_contents #prodcut_text .linkBtn .icon-mail {
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 68"><path fill="%23ffffff" d="M24.51,35.16L.08,61.42c-.05-.39-.08-.78-.08-1.18V11.75l24.51,23.41ZM58.8,49.8l-.13.1c-2.83,2.25-6.11,3.39-9.4,3.39-3.06,0-6.12-.98-8.82-2.94l-.14-.1-11.82-11.29L2.83,66.52c1.13.93,2.51,1.48,4,1.48h86.33c.08,0,.17,0,.25,0l-25.56-27.48-9.06,9.28ZM55.59,45.2L97.74,2c-1.21-1.24-2.82-2-4.58-2H6.83C4.04,0,1.63,1.92.58,4.65l42.78,40.86c3.79,2.66,8.55,2.54,12.23-.31ZM100,7.58l-28.3,29,26.68,28.67c1.01-1.35,1.63-3.11,1.63-5.02V7.76c0-.06,0-.12,0-.18Z" /></svg>') no-repeat center / contain;
}
#single_contents #prodcut_text .linkBtn .icon-line {
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 80 76"><path fill="%23ffffff" d="M40,0C17.95,0,0,14.52,0,32.36c0,16,14.23,29.4,33.45,31.93,1.3.28,3.08.86,3.52,1.97.4,1.01.26,2.59.13,3.61,0,0-.47,2.81-.57,3.41-.17,1.01-.8,3.94,3.46,2.15,4.27-1.79,23.04-13.52,31.43-23.15h0c5.8-6.34,8.57-12.77,8.57-19.91C80,14.52,62.06,0,40,0ZM25.89,41.89c0,.43-.35.78-.78.78h-11.21c-.21,0-.4-.08-.54-.22,0,0,0,0-.01-.01,0,0,0,0-.01-.01-.13-.14-.22-.33-.22-.54h0v-17.38c0-.43.35-.78.78-.78h2.81c.43,0,.78.35.78.78v13.8h7.62c.43,0,.78.35.78.78v2.8ZM32.65,41.89c0,.43-.35.77-.78.77h-2.81c-.43,0-.78-.35-.78-.77v-17.38c0-.43.35-.78.78-.78h2.81c.43,0,.78.35.78.78v17.38ZM51.96,41.89c0,.43-.35.77-.78.77h-2.81c-.07,0-.14,0-.2-.03,0,0,0,0-.01,0-.02,0-.03-.01-.05-.02,0,0-.02,0-.02,0-.01,0-.03-.01-.04-.02-.01,0-.03-.01-.04-.02,0,0-.01,0-.02-.01-.02,0-.03-.02-.05-.03,0,0,0,0,0,0-.07-.05-.14-.11-.2-.19l-8-10.77v10.32c0,.43-.35.77-.78.77h-2.81c-.43,0-.78-.35-.78-.77v-17.38c0-.43.35-.78.78-.78h2.81s.02,0,.03,0c.01,0,.03,0,.04,0,.01,0,.03,0,.04,0,.01,0,.02,0,.03,0,.02,0,.03,0,.04.01,0,0,.02,0,.03,0,.02,0,.03,0,.05.02,0,0,.02,0,.03,0,.02,0,.03.01.04.02,0,0,.02,0,.02.01.01,0,.03.02.04.02,0,0,.02,0,.02.01.01,0,.03.02.04.03,0,0,.01.01.02.02.01.01.03.02.04.03,0,0,0,0,.01.01.02.02.03.03.05.05h0s.04.06.06.08l7.99,10.75v-10.32c0-.43.35-.78.78-.78h2.81c.43,0,.78.35.78.78v17.38ZM67.46,27.32c0,.43-.35.78-.78.78h-7.62v2.94h7.62c.43,0,.78.35.78.78v2.8c0,.43-.35.78-.78.78h-7.62v2.94h7.62c.43,0,.78.35.78.78v2.8c0,.43-.35.78-.78.78h-11.21c-.21,0-.4-.08-.54-.22,0,0,0,0-.01-.01,0,0,0,0-.01-.01-.13-.14-.22-.33-.22-.54h0v-17.38h0c0-.21.08-.4.22-.54,0,0,0,0,.01-.01,0,0,0,0,0,0,.14-.14.33-.22.54-.22h11.21c.43,0,.78.35.78.78v2.8Z" /></svg>') no-repeat center / contain;
}
#single_contents #prodcut_text .shareBox {
    margin-top: min(15vw, 45px);
}
#single_contents #prodcut_text .shareBox dt {
    margin-bottom: .8em;
    text-align: center;
}
#single_contents #prodcut_text .shareBox dt .share_txt {
    display: inline-block;
    line-height: 1.4;
    padding: 0 1.5em;
    position: relative;
}
#single_contents #prodcut_text .shareBox dt .share_txt::before,
#single_contents #prodcut_text .shareBox dt .share_txt::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 15 20"><path fill="%23FF5050" d="M2.1,0L0,1.6l15,18.4L2.1,0ZM.21,14.47l10.95,5.3L1.44,12.36.21,14.47Z" /></svg>') no-repeat center;
    content: '';
    display: block;
    margin: auto;
    position: absolute;
        bottom: 0;
    width: 1em;
    height: 1.35em;
}
#single_contents #prodcut_text .shareBox dt .share_txt::before {
    left: 0;
}
#single_contents #prodcut_text .shareBox dt .share_txt::after {
    right: 0;
    transform: scale(-1, 1);
}
#single_contents #prodcut_text .shareBox .share_wrapBox {
    display: flex;
        align-items: center;
        grid-gap: min(4vw, 15px);
        justify-content: center;
}
#single_contents #prodcut_text .shareBox .share_icon {
    background: var(--black);
    border-radius: 100%;
    cursor: pointer;
    display: block;
    width: 40px;
    height: 40px;
}
#single_contents #prodcut_text .shareBox .share_icon img {
    filter: invert(10);
    object-fit: contain;
    object-position: center;
    /* transition: .3s ease-in-out; */
    width: 100%;
    height: 100%;    
}
#single_contents #prodcut_text .shareBox .share-copy img {
    margin: 7px 8px 7px 6px;
    width: 26px;
    height: 26px;
}
#single_contents #prodcut_text .shareBox .success-msg {
    border-radius: 5px;
    display: none;
    line-height: 40px;
    background-color: var(--orange);
    margin: auto;
    color: #fff;
    position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    text-align: center;
    width: 300px;
    height: 40px;
}


/* ////////// mobile ////////// */
@media screen and (max-width: 960px) {
    #single_contents #prodcut_text {
        margin-top: min(10vw, 40px);
    }
    #single_contents #prodcut_text .detailBox {
        font-size: min(3.7vw, 14px);
    }
}

@media screen and (max-width: 769px) {
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 960px) {
    #single_contents #prodcut_text .detailBox dd .size_list_wrapper {
        max-width: calc(min(90vw, 1200px) - min(40vw, 600px) - min(5vw, 50px));
    }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
}

@media (hover: hover) {
    #single_contents #prodcut_text p a:hover {
        color: var(--mainColor);
    }
    #single_contents #prodcut_text .shareBox .share_icon:hover {
        transform: scale(1.1)
    }

}

/*====================================================
////id |  related_post
====================================================*/
#related_post .innerBox {
    padding: 0;
}

#related_post .itemBox {
    display: grid;
        grid-gap: min(3vw, 20px);
}
#related_post .item a {
    color: inherit;
    display: grid;
        grid-gap: min(3vw, 30px);
        grid-template-columns: min(30%, 240px) 1fr;
}
#related_post .item dt {
    line-height: 1.6;
}
#related_post .item dd {
    font-size: .8em;
}
/* ////////// mobile ////////// */
@media screen and (max-width: 769px) {
    #related_post .item dd {
        display: none !important;
    }
}

/* ////////// PC ////////// */
@media print, screen and (min-width: 769px) {
    #related_post .item dt {
        margin-bottom: .5em;
        font-size: 1.1em;
    }
}

/* ////////// tablet ////////// */
@media screen and (min-width:769px) and (max-width:960px) {
}

@media (hover: hover) {}

