@charset "utf-8";
/* =================================================
	content common
================================================= */
.article_content {
    width: 100%;
    overflow: hidden;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "游ゴシック体", YuGothic, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    line-height: 1.8;
    letter-spacing: 0.08em;
    font-weight: 400;
}
.article_content img {
    max-width: 100%;
    vertical-align: bottom;
}
.article_content .d_pc {
  display: none !important;
}
.article_content .sp_inner {
    padding-left: 6.667vw;
    padding-right: 6.667vw;
}
/* btn */
.article_content .btn_a a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    width: 69.333vw;
    max-width: 100%;
    text-align: center;
    color: #fff;
    line-height: 1.3;
    font-size: 4.267vw;
    border-radius: 30px;
    position: relative;
    background: url("../images/common/ic_link01.webp")  no-repeat 92% 50% / 15px #000;
}
.article_content .btn_b a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    width: 69.333vw;
    max-width: 100%;
    text-align: center;
    line-height: 1.3;
    font-size: 4.267vw;
    background: #fff;
    border-radius: 30px;
    border: 1px solid #000;
}
.article_content .btn_b a span {
    padding-right: 20px;
    background: url("../images/common/ic_window01.webp")  no-repeat 100% 60% / 13px;
}
.article_content .btn_c a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 15px;
    width: 86.4vw;
    max-width: 100%;
    text-align: center;
    line-height: 1.3;
    font-size: 4.267vw;
    border-radius: 30px;
    border: 1px solid #000;
    position: relative;
}
.article_content .btn_c a span {
    padding-right: 20px;
    background: url("../images/common/ic_link02.webp")  no-repeat 100% 50% / 15px;
}
.article_content .btn_d a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 12px;
    width: 69.333vw;
    max-width: 100%;
    text-align: center;
    line-height: 1.3;
    font-size: 4.267vw;
    border-radius: 30px;
    position: relative;
    background: url("../images/common/ic_link04.webp")  no-repeat right 7.467vw top 50% / 4.8vw #f2f2f2;
}
.article_content .btn_e a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 13px;
    width: 69.333vw;
    max-width: 100%;
    text-align: center;
    line-height: 1.3;
    font-size: 4.267vw;
    color: #fff;
    border-radius: 30px;
    position: relative;
    background: url("../images/common/ic_link01.webp")  no-repeat right 4.8vw top 50% / 3.733vw #000000;
}
.article_content .btn_f a {
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 13px;
    width: 69.333vw;
    max-width: 100%;
    text-align: center;
    line-height: 1.3;
    font-size: 4.267vw;
    background: #fff;
    border-radius: 30px;
    border: 1px solid #000;
}
.article_content .btn_f a span {
    padding-right: 20px;
    background: url("../images/common/ic_window01.webp")  no-repeat 100% 60% / 13px;
}
/* list */
.article_content .list_dot li {
    list-style: disc;
    margin-left: 1.5em;
    line-height: 1.4;
}
/* font color */
.article_content .black {  color: #000!important;}
.article_content .sky {  color: #00bcff!important;}
.article_content .white {  color: #fff!important;}

/* font weight */
.article_content .mid_bold {  font-weight: 500;}
.article_content .bold {  font-weight: bold;}

/* font size */
.article_content .fsize3vw {    font-size: 3vw;}
.article_content .fsize35vw {    font-size: 3.5vw;}
.article_content .fsize4vw {    font-size: 4.2vw;}
.article_content .fsize45vw {    font-size: 4.5vw;}
.article_content .fsize5vw {    font-size: 5vw;}
.article_content .fsize6vw {    font-size: 6vw;}

/* line height */
.article_content .lh10 {  line-height: 1;}
.article_content .lh12 {  line-height: 1.2;}
.article_content .lh13 {  line-height: 1.3;}
.article_content .lh14 {  line-height: 1.4;}
.article_content .lh15 {  line-height: 1.5;}
.article_content .lh16 {  line-height: 1.6;}
.article_content .lh18 {  line-height: 1.8;}
.article_content .lh20 {  line-height: 2;}

/* align */
.article_content .align_l {  text-align: left !important;}
.article_content .align_c {  text-align: center !important;}
.article_content .align_r {  text-align: right !important;}

/* padding,margin */
.article_content .pt10 {  padding-top: 10px!important;}
.article_content .pl5 {  padding-left: 5px!important;}
.article_content .pr5 {  padding-right: 5px!important;}
.article_content .pr10 {  padding-right: 10px!important;}
.article_content .pl10 {  padding-left: 10px!important;}
.article_content .pb10 {  padding-bottom: 10px!important;}
.article_content .mb0 {  margin-bottom: 0!important;}
.article_content .mb5 {  margin-bottom: 5px!important;}
.article_content .mb10 {  margin-bottom: 10px!important;}
.article_content .mb15 {  margin-bottom: 15px!important;}
.article_content .mb20 {  margin-bottom: 20px!important;}
.article_content .mb30 {  margin-bottom: 30px!important;}
.article_content .mb40 {  margin-bottom: 40px!important;}
.article_content .mb50 {  margin-bottom: 50px!important;}
.article_content .mb60 {  margin-bottom: 60px!important;}
.article_content .mb70 {  margin-bottom: 70px!important;}
.article_content .mb80 {  margin-bottom: 80px!important;}
.article_content .mb90 {  margin-bottom: 90px!important;}
.article_content .mb100 {  margin-bottom: 100px!important;}
.article_content .mb1em {  margin-bottom: 1em!important;}
.article_content .mt5 {  margin-top: 5px!important;}
.article_content .mt10 {  margin-top: 10px!important;}
.article_content .mt15 {  margin-top: 15px!important;}
.article_content .mt20 {  margin-top: 20px!important;}
.article_content .mt30 {  margin-top: 30px!important;}
.article_content .mr5 {  margin-right: 5px!important;}
.article_content .mr10 {  margin-right: 10px!important;}
.article_content .mr15 {  margin-right: 15px!important;}
.article_content .mr20 {  margin-right: 20px!important;}
.article_content .mr30 {  margin-right: 30px!important;}
.article_content .ml5 {  margin-left: 5px!important;}
.article_content .ml10 {  margin-left: 10px!important;}
.article_content .ml15 {  margin-left: 15px!important;}
.article_content .ml20 {  margin-left: 20px!important;}
.article_content .ml30 {  margin-left: 30px!important;}

/* =================================================
	main
================================================= */
/* article_mv
===================================== */
.article_mv h1 {
    display: block;
    padding-top: 117.867vw;
    width: 100%;
    height: 0;
    background: url("../images/article/mv_sp.webp") no-repeat 0 0 / cover;
    overflow: hidden;
}
/* article_navi
===================================== */
.article_navi {
    padding: 6.667vw;
}
.article_navi .article_navi_list_cont {
    position: relative;
    border-radius: 1.867vw;
    padding-left: 4.8vw;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    height: 16.533vw;
    margin-bottom: 2.667vw;
}
.article_navi .article_navi_list_cont::after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    line-height: 1;
    width: 2vw;
    height: 2vw;
    border: 0.6vw solid currentColor;
    border-left: 0;
    border-bottom: 0;
    transform: translateY(-25%) rotate(135deg);
    position: absolute;
    top: calc(50% - 1vw);
    right: 4.8vw;
}
.article_navi .article_navi_list .article_navi_list_cont.article_navi_list_cont_yellow {
    background: rgba(255,211,0,0.9);
}
.article_navi .article_navi_list .article_navi_list_cont.article_navi_list_cont_yellow::after {
    color: #000;
}
.article_content .article_navi .article_navi_list .article_navi_list_cont.article_navi_list_cont_green {
    background: rgba(61,168,111,0.9);
    color: #fff;
}
.article_content .article_navi .article_navi_list .article_navi_list_cont.article_navi_list_cont_orange {
    background: rgba(232,124,30,0.9);
    color: #fff;
}
.article_navi .article_navi_list_cont .article_navi_ttl {
    font-weight: bold;
    font-size: 4.267vw;
    margin-bottom: 0!important;
}
/* article_cont
===================================== */
.article_cont .article_cont_img {
    padding: 6.667vw;
}
#article_cont01 .article_cont_img {
    background: #ffdd00;
}
#article_cont02 .article_cont_img {
    background: #3da86f;
}
#article_cont03 .article_cont_img {
    background: #e87c1e;
}
.article_cont .article_cont_ttl {
    text-align: center;
}
.article_cont .article_cont_txt {
    padding-top: 6.667vw;
    padding-bottom: 8vw;
}
#article_cont01 .article_cont_txt {
    background: #fff5b2;
}
#article_cont02 .article_cont_txt {
    background: #d8eee2;
}
#article_cont03 .article_cont_txt {
    background: #fae5d2;
}
.article_illust {
    margin: 12vw auto;
    width: 82vw;
}
/* article_cont_sub
===================================== */
.article_cont_sub .article_cont_sub_txt {
    padding-top: 9.333vw;
    padding-bottom: 8vw;
    background: #ccc;
}
.article_cont_sub_txt_article {
    position: relative;
    padding-left: 15.2vw;
    margin-bottom: 20px;
}
.article_cont_sub_txt_article::before {
    display: block;
    content: '';
    width: 11.467vw;
    height: 9.333vw;
    background: url("../images/common/ic_article.webp") no-repeat 0 0 / contain;
    position: absolute;
    top: calc(50% - 6vw);
    left: 0;
}
.article_cont_sub_txt_article span {
    font-size: 3.8vw;
    color: #fff;
    background: #000;
    line-height: 1;
    padding: 1vw 3vw;
    border-radius: 20px;
}
/* recommend_goods
===================================== */
.article_content #recommend_goods {
    position: relative;
    padding: 24vw 6.667vw 6.667vw;
    background: #ffdd00;
}
.article_content #recommend_goods::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 82.667vw;
    height: 16.8vw;
    background: url("../images/common/recommend_ttl.webp") no-repeat 0 0 / contain;
}
.article_content #recommend_goods .recommend_ttl {
    margin-bottom: 6vw;
}
.article_content #recommend_goods .recommend_cont_wrap {
    margin-bottom: 6vw;
}
.article_content #recommend_goods .recommend_cont:not(:last-child) {
    margin-bottom: 12vw;
    border-bottom: 1px solid #000;
}
.article_content #recommend_goods .recommend_cont_img {
    margin-bottom: 2.6vw;
}
.article_content #recommend_goods .recommend_cont_img .slider .slider_img {
    overflow: hidden;
    border-radius: 7vw;
}
.article_content #recommend_goods .recommend_cont_img .slick-dotted.slick-slider {
    margin-bottom: 5.8vw;
}
.article_content #recommend_goods .recommend_cont_img .slick-dots {
    bottom: 3.2vw;
}
.article_content #recommend_goods .recommend_cont_img .slick-dots li,
.article_content #recommend_goods .recommend_cont_img .slick-dots li button,
.article_content #recommend_goods .recommend_cont_img .slick-dots li button:before {
    width: 10px;
    height: 10px;
    padding: 0;
    line-height: 10px;
    border-radius: 5px;
    color: #ccc;
    background: #ccc;
}
.article_content #recommend_goods .recommend_cont_img .slick-dots li.slick-active,
.article_content #recommend_goods .recommend_cont_img .slick-dots li.slick-active button,
.article_content #recommend_goods .recommend_cont_img .slick-dots li.slick-active button:before {
    color: #999;
    background: #999;
}
.article_content #recommend_goods .recommend_cont_img .slider .slick-arrow {
    position: absolute;
    top: 50%;
    width: 8.8vw;
    height: 8.8vw;
    z-index: 10;
    background: url("../images/common/btn_arrow_l02.webp") no-repeat center / contain;
}
.article_content #recommend_goods .recommend_cont_img .slider .slick-arrow::before {
    content: none;
}
.article_content #recommend_goods .recommend_cont_img .slider .slick-prev {
    left: -4.5vw;
}
.article_content #recommend_goods .recommend_cont_img .slider .slick-next {
    right: -4.5vw;
    background-image: url("../images/common/btn_arrow_r02.webp");
}
.article_content #recommend_goods .recommend_cont_txt_item {
    margin-bottom: 2.6vw;
    padding: 4.267vw;
    border-radius: 4vw;
    background: #fff;
}
.article_content #recommend_goods .recommend_cont_txt_item .recommend_cont_txt_item_ttl {
    margin-bottom: 3vw;
    padding-bottom: 4vw;
    border-bottom: 1px solid #cbcbcb;
}
.article_content #recommend_goods .recommend_cont_txt_item_price,
.article_content #recommend_goods .recommend_cont_txt_item_manufacturer {
    line-height: 1.5;
}
.article_content #recommend_goods .recommend_cont_txt_intro {
    padding: 4.267vw;
    border-radius: 4vw;
    background: #fff5b2;
}
.article_content #recommend_goods .recommend_cont_txt_feature_ttl {
    margin-bottom: 4vw;
}
.article_content #recommend_goods .recommend_cont_txt_intro .recommend_cont_txt_feature_ttl {
    font-weight: bold;
    letter-spacing: 0.02em;
}
.article_content #recommend_goods .recommend_cont_txt_intro .list_dot li {
    font-weight: 400;
    margin-bottom: 3vw;
}
.article_content #recommend_goods .recommend_cont_btn > * {
    margin-bottom: 4vw;
}
/* recommend_cont01 */
.article_content #recommend_goods .recommend_cont01 .recommend_cont_txt .recommend_cont_txt_item_price {
    line-height: 1.55;
    background: url("../images/article/reccomend_cont_line.webp") no-repeat left 0 bottom 2.5vw / auto 3.5px;
}
.article_content #recommend_goods .recommend_cont01 .recommend_cont_txt .recommend_cont_txt_item_price01 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-bottom: 6px;
}
.article_content #recommend_goods .recommend_cont01 .recommend_cont_txt .recommend_cont_txt_item_price01 p:last-child {
    margin: 0 0 0 auto;
}
.article_content #recommend_goods .recommend_cont01 .recommend_cont_txt .recommend_cont_txt_item_price span {
     background: #fff;   
}