/*
Theme Name:		Welcart Simple Plus Child Theme
Template:		welcart_simple-plus
Theme URI:		https://www.welcart.com/archives/16004.html
Author:			Welcart Inc.
Author URI:		https://www.welcart.com/
Description:	Welcart Simple Plus Child Theme.
Version:		2.0
License:		GNU General Public License v2 or later
License URI:	http://www.gnu.org/licenses/gpl-2.0.html
Tags:			responsive-layout, simple-plus,
*/


/*-- リセット --*/
body{
    overflow-x: hidden;
}
main{
    overflow-x: hidden;
}
.wp-block-button__link{
    text-decoration: none !important;
}

/*-- utility --*/
.u-pc{
    @media (max-width: 767px) {
        display: none;
    }
}

.u-sp{
    display: none;
    @media (max-width: 767px) {
        display: block;
    }
}

.u-word{
    display: inline-block;
}

/*-- footer --*/
footer .sns {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
}

footer .sns .follow-us{
    font-size: 1rem;
    margin-bottom: 0 !important;
    letter-spacing: 1px !important;
    @media screen and (min-width: 768px){
        font-size: .9rem;
    }
}

footer .sns img{
    width: 23px;
    filter: brightness(0) saturate(100%) invert(18%) sepia(83%) saturate(0%) hue-rotate(284deg) brightness(100%) contrast(83%);
}


/*-- widget --*/
.front-page section[id="block-15"]{
    padding: 0;
    max-width: unset;
}

.block-15_cont{
    padding: 85px 0 20px;
    margin: 0;
}

.block-15_cont-inner{
    width: 85%;
    max-width: 750px !important;
    margin: 0 auto !important;
}

.front-page .block-15_cont h2.block-15_ttl{
    font-size: 23px;
    margin-bottom: 1em;
}

.block-15_txt{
    font-size: 13px;
    line-height: 1.8;
}

.block-15_cont .btn-readmore-dark a{
    font-size: 1rem;
    display: inline-block;
    border-radius: 0;
    background-color: transparent;
    border: 1px solid #fff;
    width: 300px;
    height: 60px;
    position: relative;
    line-height: calc(60px - 1em);
    padding: 0.375rem 0.75rem;
    text-align: center;
    vertical-align: middle;
    transition: color .15s ease-in-out,background-color .15s ease-in-out;
    --arrowColor: #fff;
}

.block-15_cont .btn-readmore-dark a::after{
    content: "";
    background-color: var(--arrowColor);
    -webkit-mask: url("../welcart_simple-plus/assets/icon/ico-harf-arrow-right.svg") no-repeat center/1rem;
    mask: url("../welcart_simple-plus/assets/icon/ico-harf-arrow-right.svg") no-repeat center/1rem;
    width: 1.1rem;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1.5em;
}

.block-15_cont .btn-readmore-dark a:hover{
    --arrowColor: #11304d;
    color: #11304d;
    background-color: #fff;
}


@media screen and (min-width: 768px){
    .block-15_cont{
        padding: 85px 0 20px;
        margin: 0;
    }
    
    .front-page .block-15_cont h2.block-15_ttl{
        font-size: 32px;
        margin-bottom: 1em;
    }
    
    .block-15_txt{
        font-size: 16px;
        line-height: 2;
    }
}

/*-- blockカスタマイズ --*/
/* table */
:is(.wp-block-table).is-style-border{
    tr td:first-child{
        min-width: 7em;
    }

    tr td:first-child{
        min-width: 17em;
        text-align: center;
    }

    td{
        vertical-align: baseline;
        border: none;
        border-top: 1px solid #ccc;
        padding: 1.1em;
    }

    tr:last-of-type td{
        border-bottom: 1px solid #ccc;
    }
}
@media screen and (max-width: 767px){
    :is(.wp-block-table).is-style-border{
        td{
            display: block;
            padding: .8em;
        }

        tr td:first-child{
            text-align: left;
            min-width: unset;
            border-bottom: none;
            padding-bottom: 0;
        }
        tr td:not(:first-child){
            border-top: none;
            padding-top: .5em;
        }
    }
}

/* 見出し */
:is(.wp-block-heading).is-style-border-none{
    border-top: none;
    border-bottom: none;
    padding: 1rem 0 !important;
    margin-bottom: 0 !important;
}

/* 段落 */
:is(p).is-style-margin-small{
    margin: 1.4rem 0;
}


/*-- animation --*/
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      transform: translateX(20px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
  }
  
  @keyframes fadeInRight {
    0% {
      opacity: 0;
      -webkit-transform: translateX(20px);
      -ms-transform: translateX(20px);
      transform: translateX(20px);
    }
  
    100% {
      opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
    }
  }
  
  .fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }
  
  

/*-- frontページ --*/
/* mv */
.main-image-text{
    width: 100%;
    z-index: 1;
    @media screen and (min-width: 768px){
        min-width: 1600px;
    }


    img{
        width: 100%;
    }
}

/*-- 固定ページ --*/
/* about */
.post-404 .entry-img{
    display: none;
}

.about_thumb {
    height: calc((450 / 1200) * 100vw);
    min-height: unset !important;
    max-height: 480px;
    margin-top: -3.4rem;
    margin-bottom: 2.3rem;
    margin-right: calc((var(--bs-gutter-md-x, 1.5rem)) * -1);
    margin-left: calc((var(--bs-gutter-md-x, 1.5rem)) * -1);
    
    @media screen and (min-width: 768px) {
        margin-top: -4.2rem;
        margin-bottom: 4.2rem;
        margin-right: calc((var(--bs-gutter-md-x, 5rem)) * -1);
        margin-left: calc((var(--bs-gutter-md-x, 5rem)) * -1);
    }
    
    @media screen and (max-width: 767px) {
        min-height: 200px !important;
    }
}

/* knowledge */
body[class~="page-id-339"]{
    .wp-block-media-text__content{
        align-self: flex-start;
    }
    
    .wp-block-media-text__media{
        align-self: flex-start;
    }
    
    @media screen and (max-width: 767px){
        .entry-content > p:first-child{
            font-size: 1.8rem !important;
        }

        article .wp-block-heading{
            font-size: 1.6rem !important;
        }


        .wp-block-media-text>.wp-block-media-text__content{
            padding: 0;
        }
    }
}


/*-- form --*/
.snow-monkey-form{
    max-width: 950px;
    margin: 0 auto;

    select{
        background: unset;
    }

    input[type=radio]::after, input[type=checkbox]::after{
        display: none;
    }

    ::placeholder {
        color: #8c8c8c;
    }      

    .smf-form .smf-select-control{
        display: block;
    }

    .smf-form .smf-text-control__control,
    .smf-form .smf-select-control__control,
    .smf-form .smf-textarea-control__control{
        --_border-radius: 0;
        font-size: 1em;
        border: none;
        background-color: #eaeaea;
        padding: 1em;
    }

    .smf-form .smf-select-control__control{
        padding-right: 35px;
    }

    .smf-item + .smf-item{
        margin-top: .7em;
    }

    .smf-item.required{
        label::before{
            content: "必須";
            font-size: .8em;
            color: #fff;
            background-color: #11304d;
            border-radius: 9999px;
            padding: .4em 1.3em;
            margin-right: 6px;
        }
    }

    .smf-checkboxes-control{
        label::before{
            display: none;
        }
    }

    .smf-item.is-privacy{
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: flex-end;

        .smf-item__description{
            font-size: 1rem;
        }

        .smf-checkbox-control__label{
            width: 4px;
        }

        .smf-error-messages{
            position: absolute;
        }
    }
    @media screen and (min-width: 768px){
        .smf-item.is-privacy{
            .smf-item__description{
                font-size: 1.1rem;
            }    
        }
    }


    .smf-item__label{
        font-size: 1.05rem;
        font-weight: 600;
    }
    @media screen and (min-width: 768px){
        .smf-item__label{
            font-size: 1.2rem;
            margin-left: -3.8em;
        }
    }

    .smf-item__label__text{
        color: #11304d;
    }

    .smf-form--letter .smf-item__col--label{
        padding-bottom: .8em;
    }

    .smf-form .smf-select-control__toggle{
        background-color: unset;
        z-index: 1;
        pointer-events: none;
    }

    .smf-form .smf-select-control__toggle:before{
        width: 8px;
        height: 8px;
        border-color: #11304d;
        border-width: 0 2px 2px 0;
        right: calc(var(--_s-1) - -3px);
    }

    .smf-form .smf-checkbox-control__control {
        border-radius: 0;
    }
    .smf-form--letter+.smf-action{
        margin-bottom: 3em;
    }

     /* 送信ボタン */
    .smf-action .smf-button-control__control{
        color: #fff;
        background-color: #11304d;
        background-image: none;
        border: #11304d 1px solid;
        border-radius: 9999px;
        min-width: 16em;
        padding: 1.3em;
        margin-bottom: 2em;
        transition: color .2s, background-color .2s;
    }

    @media (hover: hover) and (pointer: fine) {
        .smf-action .smf-button-control__control:hover, .smf-action .smf-button-control__control:focus {
            color: #11304d;
            background-color: #fff;
        }
    }

    /* エラーメッセージ */
    .smf-error-messages{
        font-size: .9em;
    }
}

.snow-monkey-form[data-screen="confirm"]{
    .smf-item.is-privacy .smf-item__description{
        display: none;
    }
}


/*-- 商品ページ --*/
/* 商品詳細 */
.item-description_title{
    background-color: #e0e6d9;
    margin: unset !important;
    padding: .25em .7em !important;
    width: fit-content;
    font-size: unset !important;
    font-weight: 700 !important;
    @media screen and (min-width: 768px){
        font-size: 1.05em !important;
    }

    &::before{
        display: none !important;
    }

    + p{
        margin-top: .4em;
    }
}


/*-- HOME 商品一覧ページ 商品ページ --*/
/* 税込金額 */
.tax_inc_block{
    display: none !important;
}

.item-category .card-body .card-text {
    margin-bottom: .5em !important;
}



/*-- 一覧ページ --*/
/* KNOWLEDGE */

body[class~="post-type-archive-knowledge"] .site-content {
    @media (min-width: 768px) and (max-width: 991px)  {
        max-width: unset;
    }
    @media (min-width: 992px) and (max-width: 1199px) {
        max-width: unset;
    }
}

.knowledge-content {
    padding-right: var(--bs-gutter-x, 1.5rem);
    padding-left: var(--bs-gutter-x, 1.5rem);
    line-height: 1.8;

    @media screen and (min-width: 768px) {
        padding-right: var(--bs-gutter-md-x, 5rem);
        padding-left: var(--bs-gutter-md-x, 5rem);
    }

    hr{
        color: #eef0f1;
    }
}

.knowledge-content_ttl{
    font-size: 1.64rem;
    line-height: 1.4;

    @media (min-width: 768px) {
        font-size: 2.14rem;
    }
}

.knowledge-list{
    list-style-type: none;
    margin: 0;
    padding-left: 0;
}

.knowledge-item{
    line-height: 1.6;
    @media (min-width: 768px) {
        font-size: 1.0715rem; /* 15px */
        line-height: 1.8;
    }

    p{
        margin-bottom: 0;
    }
}

.knowledge-item_wp-block-media-text{
    grid-template-columns: 1fr;
    @media screen and (min-width: 768px) {
        grid-template-columns: 44% 1fr;
    }

    @media (min-width: 992px) {
        grid-template-columns: 370px 1fr;
    }

    &:hover{
        .knowledge-item_thumb > img{
            transform: scale(1.08);
        }
    }
}

.knowledge-item_thumb{
    overflow: hidden;
    >img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform .5s;
    }
}

.knowledge-item_body{
    background-color: #f2f2f2;
    text-align: left;
    padding: 1.5em;
    display: grid;
    grid-template-rows: auto auto auto;
    @media (min-width: 768px) {
        grid-template-rows: auto 7.2em auto;
    }
}

.knowledge-item_ttl{
    font-size: 1.28rem;
    font-weight: 700;
    margin: 0 0 .6em;
    @media (min-width: 768px) {
        font-size: 1.43rem;
    }
}

.knowledge-item_desc{
    height: auto; /* 4em * 1.6 */
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    @media (min-width: 768px) {
        height: 7.2em; /* 4em * 1.8 */
    }
}

.knowledge-item_read-more{
    margin-top: 1em;
    text-align: right;
}

.knowledge-item_read-more::after{
    content: "";
    display: inline-block;
    width: 2.2em;
    aspect-ratio: 300/67;
    background: url("../simple-plus_child/assets/icon/ico-half-arrow-right.svg") no-repeat center / contain;
    margin-left: 20px;
    margin-bottom: .15em;
}

.pagination{
    justify-content: center;
}


/*-- 投稿ページ --*/
/* KNOWLEDGE */
.knowledge-article{
    padding-bottom: 130px;
}

.knowledge-article_ttl{
    font-size: 1.71rem;
    font-weight: 700;
    @media (min-width: 768px) {
        font-size: 2rem;
    }

}

.knowledge-article_thumb{
    max-width: 730px;
    margin-inline: auto;
    margin-bottom: 75px;

    > img{
        width: 100%;
        height: auto;
    }
}

.knowledge-article_cont{
    line-height: 1.8;
    @media (min-width: 768px) {
        font-size: 1.0715rem; /* 15px */
    }

    h2.wp-block-heading{
        font-size: 1.57rem;
        font-weight: 700;
        margin: 2em 0 .55em;
        @media (min-width: 768px) {
            font-size: 2rem;
        }
    }
}
