@charset "UTF-8";/**/
#info_contents {margin-bottom:0!important;}
.brightup {/*background:#fff47a;*/ padding-bottom: 3%; color:#6c798c;}

.brightup sup {font-size:0.6em;}
.brightup .item {display:flex; flex-direction:row;}

.image_01Area, .image_02Area, .image_03Area, .image_06Area, .image_07Area, .image_08Area, .image_09Area, .image_10Area, .image_11Area {position: relative;}
.image_01on, .image_02on01, .image_02on02, .image_03on, .image_06on, .image_07on01, .image_07on02, .image_08on, .image_09on, .image_10on01, .image_10on02, .image_11on {position: absolute; display: block;}

.image_01on{width: 617px; height: auto; left: 1.944%; top: 66.08%;}
.image_02on01{width: 191px; height: auto; left: 7.638%; top: 5.714%;}
.image_02on02{width: 115px; height: auto; left: 11.11%; top: 70.77%;}


/* 単品ボタン */
.brightup .btn_oneitem{text-align: center; border: 1px solid #6c798c;  border-radius: 2em;}
.brightup .btn_oneitem{width: 30%; padding: 0.25em; margin: -1.2em 2em 2em auto;}


/* インクルード */
.item_include {background: #fff;}
.item_include {padding: 1em; margin: 2em 0; border: 14px solid #f0e9f2;}
.item_include .goods_set .name a:hover {text-decoration: none;}
.item_include li {width: 100%;}

.item_include .goods_set {margin: 0.75em;}

.item_include .icon_box {display: none;}
.item_include .img_box {width: 215px; float: left; text-align: left;}
.item_include .txt_box {margin-left: 270px; text-align: left; font-size: 130%; margin-top: 0.5em; margin-right: 1em;}

.item_include .name {font-weight: bold; margin-bottom: 1em; padding-bottom: 0.25em; border-bottom: 1px solid #6c798c;/**/ font-size: 100%; color:#6c798c;}
.item_include .copy {display: none;}

.item_include .price_box{margin-top: 0.5em;}
.item_include .price1{color:#6c798c;}
.item_include .price2{font-size: 170%; color: #ff5d7c;}
.item_include .tax{font-size: 40%; margin-left: -0.4em;}
.item_include .yen{margin-right: 0.1em;}

.item_include .cp_discount{background-color: #fa678d; border-radius: 50%; text-align: center;}
.item_include .cp_discount{width: 60px; height: 60px; padding: 5px; margin: -0.5em -0.25em -0.25em -0.85em; font-size: 140%;}
.item_include .cp_discount strong{display: flex; justify-content: space-evenly;}
.item_include .cp_discount strong{font-size: 38px; line-height: 0.85em; margin-top: 4px;}
.item_include .cp_limit{color:#6c798c;}
.item_include .cp_limit{vertical-align: middle; margin: 0.5em; font-size: 90%;}

/*.item_include .btn {margin-left: auto; margin-top: 1em; border-radius: 0.25em; background: linear-gradient(115deg,#f678a0 0,#ae80c0 50%,#4cc5f3 100%); position: relative; transition: 0.2s;}*/
.item_include .btn {margin-left: auto; margin-top: 1em; border-radius: 3em; background: #f9748d; background: linear-gradient(115deg, #c6dd71 10%, #63b173 90%)/*linear-gradient(115deg, #ff829a 10%, #fc5474 90%)*/; position: relative; transition: 0.2s;}
.item_include .btn {width: 85%; margin-top: 0.7em;}

.item_include a:link {color: #6c798c; text-decoration: none;}
.item_include a:visited {color: #6c798c; text-decoration: none;}
.item_include a:hover {color: #6c798c; text-decoration: none;}
.item_include a:active {color: #6c798c; text-decoration: none;}

/* 動き */
/*translateX(-50px)  X軸（左横に）方向に50px */
/*translateY(50px)  Y軸（上縦に）方向に50px */
/*translateY(-50px)  Y軸（下縦に）方向に50px */

.fuwatAnime,.fuwatAnime2 {-webkit-animation-fill-mode:both; -ms-animation-fill-mode:both; animation-fill-mode:both; -webkit-animation-duration:1.0s; -ms-animation-duration:1.0s; animation-duration:1.0s; -webkit-animation-name: fuwatAnime; -ms-animation-name: fuwatAnime; animation-name: fuwatAnime; visibility: visible !important;}
/* ふわっとアニメ */
/* 動作を適用する箇所 */
.fuwatAnime {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.0s; /* アニメ時間 */
-ms-animation-duration:1.0s; 
animation-duration:1.0s; 
-webkit-transition-delay: 0.5s;/* 開始時間 */
-ms-transition-delay: 0.5s;
transition-delay: 0.5s;
-webkit-animation-name: fuwatAnime; /* アニメ名 */
-ms-animation-name: fuwatAnime; 
animation-name: fuwatAnime; visibility: visible !important;}

.fuwatAnime2 {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:2.0s; /* アニメ時間 */
-ms-animation-duration:2.0s; 
animation-duration:2.0s; 
-webkit-transition-delay: 0.8s;/* 開始時間 */
-ms-transition-delay: 0.8s;
transition-delay: 0.8s;
-webkit-animation-name: fuwatAnime; /* アニメ名 */
-ms-animation-name: fuwatAnime; 
animation-name: fuwatAnime; visibility: visible !important;}

/* .fadeIn_r, .fadeIn_l {-webkit-animation-duration: 1.5s; -ms-animation-duration: 1.5s; animation-duration: 1.5s;
-webkit-animation-iteration-count: 1; -ms-animation-iteration-count: 1; animation-iteration-count: 1;/* アニメの繰り返し（無限infinite）}*/
.fadeIn_r_Anime {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* アニメ時間 */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: 0.5s;/* 0.0s開始時間 */
-ms-transition-delay: 0.5s;
transition-delay: 0.5s;
-webkit-animation-name: fadeIn_r_Anime; /* アニメ名 */
-ms-animation-name: fadeIn_r_Anime; 
animation-name: fadeIn_r_Anime; visibility: visible !important;}

.fadeIn_l_Anime {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* アニメ時間 */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: 0.5s;/* 0.0s開始時間 */
-ms-transition-delay: 0.5s;
transition-delay: 0.5s;
-webkit-animation-name: fadeIn_l_Anime; /* アニメ名 */
-ms-animation-name: fadeIn_l_Anime; 
animation-name: fadeIn_l_Anime; visibility: visible !important;}

.fadeIn_ru_Anime {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* アニメ時間 */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: -0.5s;/* 開始時間 */
-ms-transition-delay: -0.5s;
transition-delay: -0.5s;
-webkit-animation-name: fadeIn_ru_Anime; /* アニメ名 */
-ms-animation-name: fadeIn_ru_Anime; 
animation-name: fadeIn_ru_Anime; visibility: visible !important;}

.fadeIn_lu_Anime {-webkit-animation-fill-mode:both; 
-ms-animation-fill-mode:both; 
animation-fill-mode:both; 
-webkit-animation-duration:1.5s; /* アニメ時間 */
-ms-animation-duration:1.5s; 
animation-duration:1.5s; 
-webkit-transition-delay: -0.5s;/* 開始時間 */
-ms-transition-delay: -0.5s;
transition-delay: -0.5s;
-webkit-animation-name: fadeIn_lu_Anime; /* アニメ名 */
-ms-animation-name: fadeIn_lu_Anime; 
animation-name: fadeIn_lu_Anime; visibility: visible !important;}

/* 動作内容 */
@-webkit-keyframes fuwatAnime {0% {opacity: 0; -webkit-transform: translateY(-200px);}
 100% {opacity: 1; -webkit-transform: translateY(0);}}
@-webkit-keyframes fuwatAnime2 {0% {opacity: 0; -webkit-transform: translateY(-200px);}
 100% {opacity: 1; -webkit-transform: translateY(0);}}
@-webkit-keyframes fadeIn_r_Anime {0% {opacity: 0; -webkit-transform: translateX(300px);}
 100% {opacity: 1; -webkit-transform: translateX(0); width:100%;}}
@-webkit-keyframes fadeIn_l_Anime {0% {opacity: 0; -webkit-transform: translateX(-300px);}
 100% {opacity: 1; -webkit-transform: translateX(0); width:100%;}}
@-webkit-keyframes fadeIn_ru_Anime {0% {opacity: 0; -webkit-transform: translateX(300px) translateY(200px);}
 100% {opacity: 1; -webkit-transform: translateX(0); width:100%;}}
@-webkit-keyframes fadeIn_lu_Anime {0% {opacity: 0; -webkit-transform: translateX(-300px) translateY(200px);}
 100% {opacity: 1; -webkit-transform: translateX(0); width:100%;}}

@keyframes fuwatAnime {0% {opacity: 0; -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px);}
 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}}

@keyframes fuwatAnime2 {0% {opacity: 0; -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px);}
 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);}}

@keyframes fadeIn_r_Anime {0% {opacity: 0.5;/* 透明 */ -webkit-transform: translateX(300px); -ms-transform: translateX(300px); transform: translateX(300px);/*X軸（右横に）方向に300px */}
100% {opacity: 1;/* 不透明 */ -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width:100%;}}

@keyframes fadeIn_lAnime{0% {opacity: 0.5;/* 透明 */ -webkit-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px);/*X軸（右横に）方向に300px */}
 100% {opacity: 1;/* 不透明 */ -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width:100%;}}

@keyframes fadeIn_ru_Anime {0% {opacity: 0.5; -webkit-transform: translateX(300px) translateY(200px); -ms-transform: translateX(300px) translateY(200px); transform: translateX(300px) translateY(200px);}
100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ;}}
@keyframes fadeIn_lu_Anime{0% {opacity: 0.5; -webkit-transform: translateX(-300px) translateY(200px); -ms-transform: translateX(-300px) translateY(200px); transform: translateX(-300px) translateY(200px);}
 100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); width: ;}
}

@media print, screen and (min-width: 768px) {
    .brightup {
        width: 720px;
        margin: 0 auto;
    }
}

/* 画像位置調整 */
.c-panel__link {
    display: inline-flex;
}

.c-panel__header {
    flex: 1;
    /* padding-right: 3%; */
    padding: 0 20px;
}

.c-panel__header__image {
    /* padding: 0 20px; */
    /* border-radius: 0.5em; */
}

/* 商品名、受取方法、価格 */
.c-panel__body {
    flex: 2;
    /* margin-left: 270px; */
    /* text-align: left; */
    /* font-size: 130%; */
    margin-top: 0.5em;
    margin-right: 1em;
}

.c-panel__body .c-panel__name {
    font-weight: bold;
    margin-bottom: 1em;
    padding-bottom: 0.25em;
    border-bottom: 1px solid #6c798c;
    font-size: 100%;
    color: #6c798c;
}

.c-panel__body .c-price {
    justify-self: start;
}

/* 価格色調整 */
.c-panel__price-wrapper {
    color: #ff5d7c;
}

.c-panel__action {
    width: 70%;
    /* align-self: end; */
    /* 縦方向は下 */
    justify-self: end !important;
    /* 横方向は右 */
}

/* ボタン調整 */
.c-panel__action .btn {
    margin-bottom: 0;
    color: #fff;
    text-align: center;
    padding: 5% 18% 6% 4%;
    font-size: 1em;
    font-weight: bold;
    letter-spacing: 0.05em;
    border: none;   
    margin-top: 0% !important;
}

.c-panel__action .btn::after {
    content: "";
    width: 20px;
    height: 20px;
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="none" stroke="%2363b173" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="5 3 9 7 5 11"/></svg>') center / 14px no-repeat;
    top: 27%;
    right: 8%;
}

/*================
以下スマホ用
==================*/
@media screen and (max-width:768px) {
    .contents_main {margin: 0;}
    .brightup {padding-bottom: 3%;}

    .brightup .attention{margin-left: 1em; font-size: 0.55em;}

    .image_01on{width: 85.69%; height: auto;}

    .image_02on01{width: 26.52%; height: auto;}
    .image_02on02{width: 15.97%; height: auto;}

    /* 単品ボタン */
    .brightup .btn_oneitem{width: 30%; padding: 0.15em; margin: -0.65em 1em 0.58em auto;  font-size: 75%;}

    /* インクルード */
    .item_include {padding: 0.85em 0; margin: 1em 0; border: 10px solid #f0e9f2;}

    .item_include .goods_set {padding: 1em 0 1em 0; margin: 0;}

    .brightup .item_include .img_box {width: 30%; margin-left: 4%;}
    .brightup .item_include .txt_box {margin-left: 37%; margin-right: 4%;}

    .item_include .copy {font-size: 0.8em; line-height: 1.5; }

    .item_include .price_box{font-size: 100%;}
    .item_include .price1{/*display: block;*/}
    .item_include .price2{font-size: 128%;}
    .item_include .cp_box{display: flex; flex-direction: row;}

    .item_include .cp_discount{width: 55px; height: 55px;display: flex; flex-direction: column; justify-content: center;}
    .item_include .cp_discount strong{font-size: 26px; line-height: 0.85em;}
    .item_include .cp_limit{vertical-align: top; margin: 0.5em;}

    .item_include .btn {width: 100%; margin-top: -1.45em;}
    .item_include .r_img {/*border-radius: 0.25em;*/}
    
    .c-panel__name {
        font-size: 0.9em !important;
        padding-bottom: 0.35em;
        border-bottom: 1px solid #6c798c;
        color: #6c798c;
    }

    .c-panel__action {
        width: 85%;
    }

    .c-panel__action .btn {
        font-size: 0.88em;
    }

    .c-panel__action .btn::after {
        top: 17%;
    }

    /* .c-panel__action .btn::after {
        top: 16%; right: 6%;
    } */
}