/* ====================================
common
==================================== */
input.error {border: 1px solid #f00!important;box-shadow: inset 2px 0 0 #e2401c!important;}
p.error {border: none!important;margin-bottom: 0;margin-top: 6px;display: block;color: #f00;}
abbr[title], abbr[data-original-title]{text-decoration: none!important;}


/* ====================================
/themes/storefront-child/woocommerce/cart/cart.php 
==================================== */
.wc-add-coupon-notice{text-align: left;margin-top: 15px;color: #f00;max-width: fit-content;}
.wc-add-cart_totals-notice{padding: 20px 10px;background-color: #EFF8FC;}
.wc-add-cart_totals-notice_title{color: #308FBD;font-size: 20px;font-weight: 700;text-align: center;}
.wc-add-cart_totals-notice ul li{list-style-type: none;font-size: 16px;}
.wc-add-cart_totals-notice ul li:not(:last-child){margin-bottom: 10px;}


/* ====================================
/themes/storefront-child/page.php
/themes/storefront-child/woocommerce/checkout/form-checkout.php 
/themes/storefront-child/woocommerce/myaccount/form-login.php 
==================================== */
.wc-add-flow ul{display: flex;gap: 40px;justify-content: space-between;}
.wc-add-flow ul li{list-style-type: none;width: calc(25% - 30px);text-align: center;}
.wc-add-flow ul li .step{text-align: center;color: #3386B7;margin-bottom: 10px; font-weight: 700;}
.wc-add-flow ul li.finish p,.wc-add-flow ul li.finish div{color: #A7A7A7; border-color: #A7A7A7;}
.wc-add-flow-text{height: 73px; padding: 10px 5px;border-radius: 6px;background-color: white;border: solid 2px #3386B7;color: #3386B7;position: relative; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.wc-add-flow-text p{margin-bottom: 0;}
.wc-add-flow-text p{font-size: 16px; font-weight: 700;}
.wc-add-flow-text p:nth-child(2){font-size: 14px;}
.wc-add-flow-text.active{background-color: #3386B7;border: solid 2px #3386B7!important;color: white!important;}
.wc-add-flow-text::before{position: absolute;top: 50%;right: -27px;transform: translateY(-50%);content: "";width: 0;height: 0;border-style: solid;border-width: 5px 0 5px 8px;border-color: transparent transparent transparent #3386B7;}
.finish .wc-add-flow-text::before{content: unset;}
@media screen and (max-width: 568px){
    .wc-add-flow ul{flex-wrap: wrap; gap: 15px;}
    .wc-add-flow ul li{width: calc(50% - 10px);}
    .wc-add-flow ul li .step{margin-bottom: 4px;}
    .wc-add-flow-text{padding: 5px;height: 55px;}
    .wc-add-flow-text p{font-size: 14px;}
    .wc-add-flow-text p:nth-child(2){font-size: 12px;}
    .wc-add-flow-text::before{right: -17px;}
    .wc-add-flow ul li:nth-child(2) .wc-add-flow-text::before{content: unset;}
    /* .wc-add-flow ul li:nth-child(2) .wc-add-flow-text::before{border-width: 8px 0 0 8px;border-color: transparent transparent transparent #3386B7; transform: unset; top: calc(100% + 8px); right: 43vw;} */
}


/* ====================================
/themes/storefront-child/woocommerce/checkout/form-login.php 
==================================== */
.ssc-woocommerce-form-wrap{display: flex;flex-wrap: wrap;gap: 40px;}
.ssc-woocommerce-form-inner{width: calc(50% - 20px);}
.ssc-woocommerce-form-inner .form-row{float: unset;width: 100%;}

.ssc-woocommerce-form-wrap .woocommerce-info{padding: 1.5rem 1rem;text-align: center;}
.ssc-woocommerce-form-wrap .woocommerce-info::before{content: unset;}
.ssc-woocommerce-form-wrap form .form-row .required{font-size: 14px;}
.woocommerce-form-buttom--gradation{text-decoration: none;color: #fff !important;font-size: 16px;box-shadow: 0px 8px 16px rgb(0 0 0 / 20%);background: #00acc1;background: linear-gradient(90deg, #00acc1 0%, #00897b 100%);border-radius: 4px;padding: 20px 24px;width: 100%;max-width: 200px;display: flex;justify-content: center;margin-right: auto;margin-left: auto;}

button.woocommerce-button.woocommerce-form-login__submit{width: 100%;max-width: 200px;display: flex;justify-content: center;margin-right: auto;margin-left: auto;background: white;color: #00897b!important;border: solid 2px #00897b;}

@media screen and (max-width: 568px){.ssc-woocommerce-form-inner{width: 100%;}.mail_notice{display: none;}}
/* /themes/storefront-child/woocommerce/checkout/form-login.php */



/* ====================================
2023 1月追加分 UI/UX改善
- こんな方におすすめです
- ボタンの修正
- 講座内容の要点追加
==================================== */
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mb20{margin-bottom: 20px!important;}
.mb30{margin-bottom: 30px;}
.mb60{margin-bottom: 60px;}
.fit-auto{width: fit-content;margin-right: auto;margin-left: auto;}
.grayArrow{position: relative;padding: 30px 0;margin-right: auto;margin-left: auto;}
.grayArrow::before{top: 50%;left: 50%;transform: translate(-50%,-50%);position: absolute;margin-right: auto;margin-left: auto;content: '';width: 0;height: 0;border-style: solid;border-width: 24px 30px 0 30px;border-color: #E0E5EB transparent transparent transparent;}
.site-main .txts{font-size: 14px;}
.site-main .emp{font-size: 18px;font-weight: 700;}
.site-main .empl{font-size: 24px;font-weight: 700;}
.site-main .center{text-align: center;}
.site-main .red{color: #e2401c}
.site-main .price{font-size: 20px;}
.site-main .plr10{padding-right: 10px; padding-left: 10px;}
.form.cart{position: relative; display: flex; justify-content: center;}
.form.cart .button--add{text-decoration: none; box-shadow: 0px 8px 16px rgb(0 0 0 / 20%); border-radius: 4px; display: flex; justify-content: center; align-items: center; padding: 20px 24px; max-width: 230px; position: relative;background-color: #FF9900;color: white;font-size: 18px;font-weight: 700;}


/* course/product/詳細ページ/ */
.single-product div.product form.cart{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
button.single_add_to_cart_button{
    background: unset;
    background-color: #FF9900!important;
    font-size: 18px;
    position: relative;
}
.single_add_to_cart_button--addText{
    position: absolute;
    top: -32px;
    left: 50%;
    transform: translateX(-50%);
    color: #00897B;
    white-space: nowrap;
    font-size: 16px;
}
.single_add_to_cart_button--addTextBtm{
    position: absolute;
    bottom: -32px;
    left: 50%;
    transform: translateX(-50%);
    color: #00897B;
    white-space: nowrap;
    font-size: 16px;
}
.single_add_to_cart_button--addText::after,.single_add_to_cart_button--addText::before{
    content: '';
    background-color: #00897B;
    position: absolute;
    height: 1px;
    width: 20px;
    top: 50%;
    transform: translateY(-50%);
}
.single_add_to_cart_button--addText::after{
    transform: rotate(75deg);
    left: -18px;
}
.single_add_to_cart_button--addText::before{
    transform: rotate(105deg);
    right: -18px;
}

.site-main .recommendText p{margin-bottom: 0;}
.site-main .recommendText{
    margin-bottom: 30px;
    background-color: #FFFFF2;
    border: solid 4px #FFF2CC;
    width: 100%;
}

/* .site-main .recommendText_inner{
    width: 80%;
    margin-right: auto;
    margin-left: auto;
} */
.site-main .recommendText_ttl{
    font-size: 24px;
    padding: 20px 20px 10px;
    color: #b71c1c;
    text-align: center;
    /* margin-bottom: 15px; */
    font-weight: 700;
}
.site-main .recommendText_list{
    border-top: 3px dotted #FFF2CC;
    margin-top: 8px;
}
.site-main .recommendText ul{
    padding: 15px 20px 20px;
}
.site-main .recommendText ul li{
    position: relative;
    list-style-type: none!important;
    display: flex;
    align-items: initial;
    font-size: 24px;
    padding-left: 30px;
}
.site-main .recommendText ul li:not(:last-child){
    margin-bottom: 10px;
}

.site-main .recommendText ul li::before{
    content: '';
    background-image: url('../img/check.svg');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    left: 0;
    top: 5px;
}

.site-main .infoTable{
    padding: 20px 30px;
    background-color: #F0F2F4;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 30px;
}
.site-main .infoTable .unit{
    width: calc(50% - 20px);
    margin-right: 10px;
    margin-left: 10px;
    /* color: white; */
    font-size: 18px;
    padding: 4px 0;
}
.site-main .infoTable .unit.bld{font-weight: 700;}

/* .points{} */
.points ul{
    margin-bottom: 30px;
}
.points ul li{
    list-style: none;
    padding-left: 30px;
    position: relative;
    font-size: 20px;
    font-weight: 500;
}
.points ul li:not(:last-child){
    margin-bottom: 10px;
}
.points ul li::before{
    display: block;
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 8px 16px;
    border-color: transparent transparent transparent #e2401c;
    top: 9px;
    left: 0;
}





/* sp */
@media screen and (max-width: 568px){
    .site-main .emp{font-size: 16px;}
    .site-main .empl{font-size: 20px;}
    .site-main .price{font-size: 16px;}


    /* points sp */
    .points ul li{
        padding-left: 20px;
        font-size: 16px;
    }
    .points ul li:not(:last-child){
        margin-bottom: 10px;
    }
    .points ul li::before{
        border-width: 6px 0 6px 12px;
        top: 6px;
    }


    /* recommend sp */
    .site-main .recommendText_ttl{
        font-size: 16px;
        padding: 15px 15px 6px;
    }
    .site-main .recommendText_list{
        border-top: 2px dotted #FFF2CC;
        margin-top: 4px;
    }
    .site-main .recommendText ul{
        padding: 6px 15px 15px;
    }
    .site-main .recommendText ul li{
        font-size: 14px;
        padding-left: 20px;
    }
    .site-main .recommendText ul li:not(:last-child){
        margin-bottom: 5px;
    }
    
    .site-main .recommendText ul li::before{
        width: 15px;
        height: 15px;
        top: 3px;
    }
    
    .site-main .infoTable{
        padding: 10px 15px;
        margin-bottom: 30px;
    }
    .site-main .infoTable .unit{
        width: calc(50% - 10px);
        margin-right: 5px;
        margin-left: 5px;
        /* color: white; */
        font-size: 12px;
        padding: 3px 0;
    }
}


.trialArea {
    border: 2px dashed #ccc;
    padding: 16px;
    margin: 24px 0;
}
.trialArea p {
    margin-bottom: 0;
}
.trialArea__title {
    font-weight: bold;
    text-align: center;
    font-size: 16px;
    margin: 0 auto;
    background-color: #F0F2F4;
    padding: 8px 0;
}
.trialArea__text {
    text-align: center;
    font-size: 14px;
    margin: 8px auto 0;
}
.trialArea__text strong {
    font-size: 14px;
    background:linear-gradient(transparent 60%, #ff6 60%);
}
.trialArea__text span {
    font-weight: bold;
    color: #999;
    text-decoration: line-through;
}
.trialArea__link {
    display: table;
    margin: 8px auto 0;
    padding: 8px 16px;
    font-weight: bold;
    font-size: 14px;
    background-color: #fff;
    border: 2px solid #333;
    border-radius: 8px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.15);
    color: #333;
    text-decoration: none;
}


.courceList {
    overflow: hidden;
}
.courceList li {
    list-style-type: none;
    margin: 0 8px 8px 0;
    padding: 0;
    float: left;
    display: block;
}
.courceList li a {
    display: block;
    position: relative;
    padding: 8px 32px 8px 16px;
    line-height: 1.2em;
    border: 1px solid #ccc;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    color: #333;
}
.courceList li a:after {
    content: '∨';
    position: absolute;
    top: 8px;
    right: 8px;
    color: #999;
}
@media screen and (min-width:768px) {
.courceList {
}
.courceList li {
}
.courceList li a {
    font-size: 14px;
}
.courceList li a:hover {
    opacity: 0.7;
}
}
@media screen and (max-width:767px) {
.courceList {
}
.courceList li {
}
.courceList li a {
    font-size: 12px;
}
}