@charset "UTF-8";

#info_contents {
    margin-bottom: 0 !important;
}
.body_sph .contents_main {
    margin: 0;
}
.dha_teiki,
.dha_teiki p,
.dha_teiki a {
    margin: 0;
    padding: 0;
    line-height: 1.5;
}
/*===============================
wrapper
===============================*/
.wrapper-big,
.wrapper-middle,
.wrapper-small {
    margin-inline: auto;
}
.wrapper-big {
    width: 662px;
}
.wrapper-middle {
    width: 596px;
}
.wrapper-small {
    width: 535px;
}
/*蟾ｦ蜿ｳ荳贋ｸ倶ｸｭ螟ｮ縺槭ｍ縺�*/
.center-center {
    display: grid;
    place-content: center;
    /*隕∫ｴ�縺ｮ荳ｭ螟ｮ謠�∴*/
    place-items: center;
    /*隕∫ｴ�蜷悟｣ｫ縺ｮ荳ｭ螟ｮ謠�∴*/
}
/*===============================
繝ｪ繝ｳ繧ｯ繧ｨ繝ｪ繧｢
===============================*/
.dha_teiki .link-wrap {
    position: relative;
    display: inline-block;
}
.dha_teiki .link {
    position: absolute;
    display: block;
    z-index: 3;
    /*background: rgba(255,0,0,0.2); */
}
.dha_teiki .link-teiki {
    height: 4.5%;
    width: 94%;
    left: 3%;
    bottom: 2.7%;
}
/*===============================
FV
===============================*/
.fv {
    background-color: #3b9ae7;
    line-height: 0;
}
.fv h2 a {
    line-height: 0;
}
.fv .spec {
    padding-top: 0;
}
.fv .spec {
    margin-top: 0;
}
.annotation {
    color: #fff;
    text-align: right;
}
.dha-solution {
    margin-top: -7%;
}
#food-prpblem {
    margin-top: -14%;
    background: linear-gradient(to bottom, #fff 0%, #fff 20%, #5f6568 20%, #5f6568 100%);
    padding-bottom: 2%;
}
#solution {
    background: linear-gradient(to bottom, #373c3f 0%, #373c3f 10%, #e8f7ff 10%, #e8f7ff 100%);
    padding: 0 0 10% 0;
}
#solution>h3,
#solution>div,
.margin-wrapper>* {
    margin-bottom: 8%;
}
#solution>*:last-child,
.margin-wrapper>*:last-child {
    margin-bottom: 0%;
}
.margin-top-less {
    margin-top: -3%;
}
.continue-title {
    display: flex;
    justify-content: center;
    gap: 8%;
}
.continue-title-img {
    width: 40%;
}
.continue-title-txt {
    width: 50%;
}
#feature {
    background-color: #0768c4;
    background-image: url("../images/feature_back.png");
    background-size: 100% auto;
    background-position: top;
    background-repeat: no-repeat;
    padding: 10% 0 10%;
}
#feature>div>* {
    margin-bottom: 8%;
}
#feature>div>*:last-child {
    margin-bottom: 0%;
}
.feature-pkg {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 4%;
}
.feature-pkg-label {
    width: 6.3%;
}
.feature-pkg-img {
    width: 40%;
}
.passion-title {
    padding: 8% 0 6%;
}
.passion-item {
    background-color: #ecf9ff;
    margin-bottom: 7%;
    padding-bottom: 5%;
}
/*===============================
　アコーディオン
===============================*/
.accordion {
    border: 2px solid #08308E;
    background-color: #ffffff;
    margin-top: 5%;
    text-align: center;
    font-size: 1.2em;
    line-height: 1.6;
    color: #00357f;
}
.accordion .accordion_title {
    position: relative;
    cursor: pointer;
    transition: all .2s ease;
    padding: 2.8%;
    font-weight: 700;
    font-size: 21.84px;
}
.accordion_title::before,
.accordion_title::after {
    position: absolute;
    content: '';
    width: 4%;
    height: 2px;
    background-color: #08308E;
    transition: all .2s ease;
}
.accordion_title::before {
    top: 48%;
    right: 5%;
    transform: rotate(0deg);
}
.accordion_title::after {
    top: 48%;
    right: 5%;
    transform: rotate(90deg);
}
/*縲讓ｪ縺ｮ蜊∝ｭ暦ｼ喞lose縺ｨ縺�≧繧ｯ繝ｩ繧ｹ縺後▽縺�◆繧牙ｽ｢迥ｶ螟牙喧縲*/
.accordion_title.close::before {
    transform: rotate(45deg);
    transition: all .2s ease;
}
.accordion_title.close::after {
    transform: rotate(-45deg);
    transition: all .2s ease;
}
/*繧｢繧ｳ繝ｼ繝�ぅ繧ｪ繝ｳ縺ｧ迴ｾ繧後ｋ繧ｨ繝ｪ繧｢ */
.accordion_box {
    display: none;
    background: #ecf9ff;
    text-align: left;
    margin: 2%;
    margin-top: 0;
    padding: 4%;
}
.accordion_box p {
    margin-bottom: 2%;
    font-size: 16.8px;
}
.accordion_box p:last-child {
    margin-bottom: 0%;
}
/*蛻晄悄迥ｶ諷九ｒ繝ｪ繧ｻ繝�ヨ*/
.accordion p span {
    display: inline;
}
.underline {
    background: linear-gradient(transparent 70%, #fdffbc 70%);
}
/*===============================
繧､繝ｳ繧ｯ繝ｫ繝ｼ繝�
===============================*/
.spec {
    /*    background: linear-gradient(-45deg, #31b26a, #57cb35);*/
    background-color: #3b9ae7;
    padding: 10% 0 3%;
    margin: 5% 0;
}
.spec-title {
    text-align: center;
}
.spec-title.spec-title1 {
    margin: 0 0 6% 0;
}
.spec-title.spec-title2 {
    margin: 0 0 -2% 0;
}
/*蜈ｨ菴薙�菴咏區隱ｿ謨ｴ*/
.include {
    background-color: #ffffff;
    padding: 4% 0;
    margin-top: 5%;
    margin-bottom: 8%;
    border-radius: 10px;
}
.include.include-big {
    padding: 5% 0;
}
.include.include-fv {
    margin-bottom: 12%;
}
.include .goods_set {
    display: flex;
    gap: 3%;
    margin: 0 0 2% 0;
}
.include.include-big .goods_set {
    gap: 4%;
    margin: 0 0 3% 0;
}
/*蟾ｦ----------------------*/
.include .img_box {
    flex: 0.8;
    /*逕ｻ蜒上�螟ｧ縺阪＆*/
}
.include.include-big .img_box {
    flex: 1.2;
    /*逕ｻ蜒上�螟ｧ縺阪＆*/
}
/*蜿ｳ----------------------*/
/*髟ｷ縺�*/
.include .txt_box {
    flex: 2;
    /*髟ｷ縺�*/
}
/*蜑ｲ蠑募ｾ御ｾ｡譬ｼ*/
.include .c-price {
    font-size: 39.55px;
    color: #ff6f00;
}
span.c-price-yen {
    font-size: 0.5em;
    margin-left: 0.2em;
}
/*蜑ｲ蠑慕紫*/
.include .cp_box {
    display: block;
}
.include.include-big .cp_box {
    display: flex;
    align-items: end;
}
.include .cp_discount {
    font-size: 2.3em;
    background-color: #ff6f00;
}
.include.include-big .cp_discount {
    font-size: 5em;
    padding: 0.1em 0.3em 0.08em 0.3em;
    margin: 0.1em 0 0 0;
}
.include.include-big .cp_discount strong {
    font-size: 1.4em;
}
/*譌･莉�*/
.include.include-big .cp_discount+.cp_limit {
    font-size: 1.5em;
}
/*蝠�刀蜷�*/
/*繝懊ち繝ｳ*/
.cta-btn a {
    position: relative;
    display: block;
    width: 100%;
    background: linear-gradient(0deg, #ff6f00 40%, #ff5500 100%);
    color: #fff;
    text-decoration: none;
    text-align: center;
    padding: 2% 0;
    border-radius: 10em;
    box-shadow: 0 3px 0 0 #e26200;
}
.include.include-big .cta-btn a {
    padding: 3% 0;
    box-shadow: 0 5px 0 0 #e26200;
}
.cta-btn:hover {
    opacity: 0.8;
    transition: 0.3s;
}
.cta-btn a::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 1.5em;
    width: 0.5em;
    height: 0.5em;
    margin: auto;
    border-top: 0.1em solid #fff;
    border-right: 0.1em solid #fff;
    transform: rotate(45deg);
    box-sizing: border-box;
}
.include .cta-btn a {
    font-size: 1.8em;
    font-weight: bold;
}
.include .cta-btn a::after {
    border-top: 0.15em solid #fff;
    border-right: 0.15em solid #fff;
}
.single {
    font-size: 13px;
    text-align: right;
    /* margin: -4% 0 10% 0; */
    color: #fff;
}
.single a {
    font-feature-settings: "palt";
    text-underline-offset: 0.18em;
}
.single a:visited {
    color: #fff;
}
.single a:hover {
    opacity: 0.6;
    cursor: pointer;
}
.single a span {
    font-size: 0.7em;
}
.single a:link {
    color: #fff;
}
.spec-text {
    text-align: center;
}
#teiki {
    position: relative;
    display: inline-block;
}
.link-area {
    border-radius: 13%;
    position: absolute;
    top: 93%;
    left: 4%;
    width: 92%;
    height: 4%;
}
.spec-text p {
    display: inline-block;
    font-size: 2.2em;
    font-weight: bold;
    color: #00579e;
    background: linear-gradient(transparent 75%, #fff99f 75%);
    margin-bottom: 0.8em;
}
/*騾壼ｸｸ螳壽悄繝懊ち繝ｳ髫�縺�*/
.goods_set .btn img {
    display: none;
}
/*縺ｽ繧医⊃繧医☆繧�*/
.poyo {
    animation: poyopoyo 2s ease-out infinite;
    opacity: 1;
}
@keyframes poyopoyo {
    0%, 40%, 60%, 80% {
        transform: scale(1.0);
    }
    50%, 70% {
        transform: scale(0.95);
    }
}
/*===============================
繧｢繝ｳ繧ｫ繝ｼ繝ｪ繝ｳ繧ｯ
===============================*/
.anchor {
    position: relative;
}
.anchor-btn-wrapper {
    position: absolute;
    right: 0;
    left: 0;
    margin: 0 auto;
    bottom: 10%;
}
.anchor-btn {
    display: flex;
    gap: 3%;
    justify-content: center;
}
.anchor-btn a {
    box-shadow: 0.2em 0.2em 0.3em 0.2em rgba(0, 0, 0, 0.1);
    width: 45%;
}
.anchor-btn img {
    width: 100%;
}

.flavor>* {
    margin-bottom: 4%;
}
.flavor>*:last-child {
    margin-bottom: 0%;
}

.c-panel__action {
    display: none;
}
.c-panel__link {
    display:flex;
}
.c-panel__header{
    flex-shrink: 0;
    margin-right: 30px;
}
.c-panel__body {
    margin-top: 0;
}
.c-panel__price-wrapper {
    display: flex;
    align-items: baseline;
    gap: 0px 20px;
    flex-wrap: wrap;
    margin-top: 0;
}

/* design_common_for_dhc_contents.cssの打ち消し線を隠す */
.c-price-delete{
  background: linear-gradient(transparent 0px, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 0px, transparent 0px) !important;
}

/* 割引前の値段に打ち消し線を引く */
.c-price-delete .d-inline-block{
  text-decoration: line-through;
  text-decoration-color: #333;
  text-decoration-thickness: 1px;
}

/* 割引前の値段の円の調整 */
.c-price-delete-yen {
  display: inline-block;
  position: relative;
  z-index: 1;
  padding: 0 2px;
}

.sample_view {
    margin-bottom: 20px;
}
.c-panel__badge {
    display: none !important;
}
.c-panel__desc {
    display: none;
}
.c-label-discount {
    font-size: 63px !important;
}
.monitor {
    margin-top: -8%;
}
/*===============================
　PC画面
===============================*/
@media print, screen and (min-width: 768px) {
    .dha_teiki {
        width: 720px;
        margin: 0 auto;
    }
    .include .c-panel__name {
        font-size: 16.8px;
        font-weight: 500;
    }
    .c-panel__link .c-panel__header__image {
        width: 192.61px;
        aspect-ratio: 1 / 1;
        border-radius: 12px;
    }
    
    a[href="/goods/32674.html"] .c-panel__header {
        width: 192.61px;
    }


}
/*===============================
　スマホ画面
===============================*/
@media screen and (max-width: 768px) {
    /*wrapper*/
    .wrapper-big {
        width: 92vw;
    }
    .wrapper-middle {
        width: 86vw;
    }
    .wrapper-small {
        width: 80vw;
    }
    .single {
        margin: 0px 0px 0% 0px;
        /* padding-left: 34%; */
        font-size: 9.4px;
    }
    .fv .pkg {
        top: 36%;
        left: 19vw;
        width: 41%;
    }
    .annotation {
        padding-left: 42%;
        font-size: 0.7em;
    }
    .accordion {
        border: 1px solid #08308E;
        font-size: 1em;
    }
    .accordion_box p {
        font-size: 16.125px
    }
    .body_sph .accordion_box p {
        /*line-height: 1.8;*/
    }
    .accordion .accordion_title {
        font-size: 17.735px;
    }
    .spec-text p {
        font-size: 1.3em;
    }
    .include .c-price {
        font-size: 24.76px;
        color: #ff6f00;
    }
    .include {
        padding: 6% 0;
    }
    .include .goods_set {
        gap: 4%;
    }
    .include .img_box {
        flex: 0.55;
    }
    .include .txt_box {
        font-size: 0.85em;
        flex: 1;
    }
    .include .price2 {
        font-size: 1.6em;
    }
    .include .cp_discount {
        font-size: 2em;
    }
    .include .name {
        font-size: 1em;
        /*    margin-bottom: 0.9em;*/
    }
    .include .cta-btn a {
        font-size: 1.2em;
    }
    .include.include-big {
        padding: 5% 0 7%;
    }
    .include.include-big .cp_box {
        display: block;
    }
    .include.include-big .cp_discount {
        font-size: 3.5em;
        margin: 0.1em 0 0.2em 0;
    }
    .include.include-big .txt_box {
        font-size: 0.8em;
        flex: 1.6;
    }
    .c-panel__header{
        flex-shrink: 0;
        margin-right: 5px;
    }
    .c-panel__link .c-panel__header__image {
        width: 123.42px;
    }
    .include .goods_set {
        margin: 0 0 4% 0;
    }
    .include.include-big .cp_discount+.cp_limit {
        font-size: 1.2em;
    }
    .c-panel__name {
        font-size: 12.9px;
        font-weight: 200;
    }
    .c-panel__link {
        display: flex;
    }
    .c-label-discount {
        font-size: 38.8px !important;
    }
    .c-price-delete{
        font-size: 11.6px
    }
    .c-panel__price-wrapper {
        gap: 0 15px;    
    }
}