@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 .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_cont_sub
===================================== */
.article_content .article_cont_sub .article_cont_sub_txt {
    padding-top: 9.333vw;
    padding-bottom: 8vw;
    background: #ccc;
}
.article_content .article_cont_sub_txt_article {
    position: relative;
    padding-left: 15.2vw;
    margin-bottom: 20px;
}
.article_content .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_content .article_cont_sub_txt_article span {
    font-size: 3.8vw;
    color: #fff;
    background: #000;
    line-height: 1;
    padding: 1vw 3vw;
    border-radius: 20px;
}
/* article_mv
===================================== */
.article_content .article_mv {
    padding: 0 4.267vw;
    margin-bottom: 13vw;
}
.article_content .article_mv h1 {
    margin: 0 auto 4vw;
    width: 100%;
    height: 94.667vw;
    background: url("../images/article/mv_sp.webp") no-repeat 0 0 / contain;
    overflow: hidden;
    text-indent: -99999px;
}
/* article_mv_nav
===================================== */
.article_content .article_mv_nav {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
}
.article_content .article_mv .article_mv_nav .article_mv_nav_cont {
    display: block;
    width: 44.533vw;
    padding: 5.333vw 4vw;
    position: relative;
    border-radius: 4vw;
}
.article_content .article_mv .article_mv_nav .article_mv_nav_cont::after {
    display: block;
    content: '';
    position: absolute;
    top: 2.133vw;
    right: 2.133vw;
    width: 8.533vw;
    height: 8.533vw;
    background: url("../images/common/ic_link03.webp") no-repeat 0 0 / contain;
}
.article_content .article_mv .article_mv_nav .article_mv_nav_cont01 {
    background: #fddc01;
}
.article_content .article_mv .article_mv_nav .article_mv_nav_cont02 {
    background: #cccccc;
}
.article_content #article_what .article_what_ttl {
    margin-bottom: 5vw!important;
}
/* article_navi
===================================== */
.article_content .article_navi {
    margin: 10.667vw 0 13vw;
}
.article_content .article_navi_list .article_navi_list_cont {
    display: block;
    background: #ffdd00;
    border-radius: 40px;
    padding: 3vw 7.2vw 3vw 12vw;
    position: relative;
    width: 100%;
    margin: 0 auto 2.667vw;
}
.article_content .article_navi_list .article_navi_list_cont::before {
    display: block;
    content: '';
    position: absolute;
    top: calc(50% - 1.6vw);
    right: 2.933vw;
    width: 3.2vw;
    height: 3.2vw;
    background: url("../images/common/ic_link04.webp") no-repeat 0 0 / contain;
}
.article_content .article_navi_list .article_navi_list_cont::after {
    display: block;
    content: '';
    position: absolute;
    top: calc(50% - 4.5vw);
    left: 1.333vw;
    width: 9.067vw;
    height: 9.067vw;
}
.article_content .article_navi_list .article_navi_list_cont01::after {
    background: url("../images/common/point_nav_num01.webp") no-repeat 0 0 / contain;
}
.article_content .article_navi_list .article_navi_list_cont02::after {
    background: url("../images/common/point_nav_num02.webp") no-repeat 0 0 / contain;
}
.article_content .article_navi_list .article_navi_list_cont03::after {
    background: url("../images/common/point_nav_num03.webp") no-repeat 0 0 / contain;
}
/* article
===================================== */
.article_content #article_what_sp .article_what_sp_img {
    padding-top: 8vw;
    padding-bottom: 8vw;
    background: #ffdd00;
}
.article_content #article_what_sp .article_cont_txt {
    padding-top: 7vw;
    padding-bottom: 7vw;
    background: #fff5b2;
}
.article_content .article_cont .article_point_ttl {
    text-align: center;
    margin-bottom: 6vw!important;
}
.article_content .article_cont .article_cont_txt_inner {
    padding-top: 5.333vw;
    padding-bottom: 8vw;
    background: #ffdd00;
}
.article_content .article_cont .article_cont_txt_inner .article_cont_txt_num {
    margin: 0 auto 3.2vw;
    width: 45.867vw;
}
.article_content .article_cont .article_cont_sub_txt {
    padding-bottom: 6.667vw;
}
.article_content .article_cont .article_cont_txt_sp {
    padding-top: 7vw;
    padding-bottom: 7vw;
    background: #fff5b2;
}
.article_content .article_cont .article_cont_sub_txt_inner {
    margin: 6.667vw auto;
    padding: 8vw 6.667vw 4vw;
    background: #cccccc;
    border-radius: 4vw;
}
.article_content .article_cont .article_cont_ttl {
    text-align: center;
    letter-spacing: 0;
}
/* 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;
    letter-spacing: 0;
}
.article_content #recommend_goods .recommend_cont_txt_item_price {
    line-height: 1.4;
    letter-spacing: 0;
    margin-bottom: 2vw;
}
.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;
}
.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;
}
