@charset "UTF-8";

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

body{
  background            : #fff;
  font-feature-settings : 'palt';
  min-width             : 320px;
  width                 : 100%;
}

#header{
  margin-bottom: 0 !important;
}

#contents{
  max-width : 750px;
  width     : 100%;
}

.mlife{
  background : #fff;
  margin     : 0 auto;
  min-height : 100vh;
  padding    : 0 0 25% 0;
  position   : relative;
  width      : 100%;
}

.mlife img{
  display : block;
  width   : 100%;
}


.onsp{
  display: none;
}
@media only screen and (max-width:750px){
  .onpc{
    display: none;
  }
  .onsp{
    display: block;
  }
}




/*
// nav
*/

.mlife__nav ul{
  display         : flex;
  justify-content : space-between;
}

@media only screen and (min-width:320px) and (max-width:374px){
  .mlife__nav > ul > li{
    width  : 29.8%;
  }
  .mlife__nav > ul > li:first-child,
  .mlife__nav > ul > li:last-child{
    width  : 19.8%;
  }
}

@media only screen and (min-width:375px){
  .mlife__nav > ul > li{
    width  : 24.8%;
  }
}

.mlife__nav > ul > li:hover,.mlife__nav__list--type_active{
  border-bottom : 5px solid #FF0000;
}

.mlife__nav > ul > li > a{
  align-items     : center;
  color           : #000;
  display         : flex;
  font-size       : 11px;
  font-weight     : bold;
  height          : 30px;
  text-decoration : none;
  justify-content : center;
  width           : 100%;
}





/*
// top
*/

.mlife__fv{}

.mlife__fv__copy{
  background      : url(../img/mlife_fv-copy-bg.png) no-repeat top center;
  background-size : cover;
  margin          : -3.6% 0 0 0;
  padding         : 5.3% 6.6%;
  position        : relative;
	 text-align      : center;
}

.mlife__category{

}

.mlife__category__title{
  padding : 4.6% 0;
}

.mlife__article-list{
  border-bottom : 1px solid #B0B0B0;
  display       : flex;
  padding       : 3px 15px;
}

.mlife__article-list:last-child{
  border : none;
}

.mlife__article-list__image{
  position : relative;
  width    : 40%;
}

.mlife__article-list__image__icon{
  left      : 0;
  max-width : 72px !important;
  position  : absolute;
  top       : 0;
  width     : 25.7% !important;

}

.mlife__article-list__text{
  padding : /*12px 0 12px 9px*/3.4% 0 0 2.4%;
  width   : 60%;
}

.mlife__article-list__text__info{
  font-size : 10px;
  margin    : 0 0 12px 0;
}

.mlife__article-list__text__info__category{
  font-weight : bold;
  margin      : 0 5px 0 0;
}

.mlife__article-list__text__info__category--color_red{
  color : #e70012;
}

.mlife__article-list__text__info__category--color_green{
  color : #70bb2d;
}

.mlife__article-list__text__info__category--color_orange{
  color : #E99551;
}

.mlife__article-list__text__article-title a{
  color           : #000;
  font-size       : 14px;
  font-weight     : bold;
  text-align      : justify;
  text-decoration : none !important;
  word-break: break-all;
}

.mlife__article-list__text__article-title a:hover{
  text-decoration : underline;
}





/*
// category
*/

.mlife__category{
  margin : 3% 0 0 0;
}





/*
// article
*/

.mlife-article__fv__text{
  margin : 0 15px /*8%*/12%;
}

.mlife-article__fv__text__date{
  color     : #666;
  font-size : 10px;
  margin    : 2.6%;
}

.mlife-article__fv__text__copy{
  margin     : 0 2.6%;
  text-align : justify;
}

.mlife-article__fv__text__image{
  margin : 8% 0 0;
}

.mlife-article__content{
  margin : 0 15px;
}

.mlife-article__content--type_wide{
   margin : 0;
}

.mlife-article__content__title{
  align-items   : flex-start;
  border-bottom : 1px dashed #e70012;
  border-top    : 1px dashed #e70012;
  display       : flex;
  font-size     : 18px;
  font-weight   : bold !important;
  margin        : 0 0 5.3% 0;
  padding       : 2.6%;
  width         : 100%;
}

.mlife-article__content__title--prelude{
  display       : block;
}

.mlife-article__content__title--prelude__pre-title{
  color:#e70012;
  display: block;
  font-weight: bold;
  margin:0 0 0 40px;
}

.mlife-article__content__title--prelude__title{
  align-items   : flex-start;
  display: flex;
}

.mlife-article__content__title--type_in-wide-content{
  margin : 0 15px 5.3%;
  width  : auto;
}

.mlife-article__content__title__subtitle{
  display:inline-block;
  font-size : 14px;
  margin:0 0 5px 0;
}

.mlife-article__content__title--text_center{
  justify-content : center;
  text-align      : center;
}

.mlife-article__content__title--color_red{
  color : #e70012;
}

.mlife-article__content__title span{
  font-weight  : bold !important;
}

.mlife-article__content__title__text-medium{
  font-size : 15px;
}

.mlife-article__content__title__text-small{
  font-size : 14px;
}

.icon_question{
  display   : inline-block !important;
  max-width : 40px;
  width     : 12% !important;
}

.mlife-article__content__image{
  margin : 0 0 8% 0;
}

.mlife-article__content__image--margin_large{
  margin : 0 0 17.39% 0;
}

.mlife-article__content__image--margin_medium{
  margin : 0 0 13.33% 0;
}

.mlife-article__content__image--margin_small{
  margin : 0 0 5.3% 0;
}

.mlife-article__content__image--margin_s-small{
  margin : 0 0 4.2% 0;
}

.mlife-article__content__image--margin_xs-small{
  margin : 0 0 2.9% 0;
}

.mlife-article__content__image--margin_xxs-small{
  margin : 0 0 2% 0;
}

.mlife-article__content__image--margin_none{
  margin : 0 0 0 0;
}

.mlife-article__content__text{
  margin     : 0 2.6% 8%;
  text-align : justify;
}

.mlife-article__content__text--margin_large{
  margin : 0 0 17.39% 0;
}

.mlife-article__content__text--margin_medium{
  margin     : 0 2.6% 13.33%;
  text-align : justify;
}

.mlife-article__content__text--margin_small{
  margin     : 0 2.6% 5.3%;
  text-align : justify;
}


.mlife-article__content__text--margin-top_-16per{
  margin-top : -16%;
}

.mlife-article__content__text--margin-bottom_none{
  margin-bottom : 0;
}

.mlife-article__content__text span{
  color : #fc5b5b;
}

.mlife-article__content__ranking-title{
  align-items   : center;
  display       : flex;
  font-size     : 18px;
  font-weight   : bold !important;
  margin        : 0 2.6% 2.6%;
  text-align    : center;
  width         : 100%;
}

.icon_ranking{
  display   : inline-block !important;
  margin    : 0 1.5% 0 0;
  max-width : 43px;
  width     : 12.5% !important;
}

.mlife-article__content__ranking-image{
  margin : 0 0 4% 0;
}

.mlife-article__content__number-of-responses{
  font-size  : 10px;
  text-align : right;
  margin     : 0 2.6% 0;
}

.mlife-article__content__number-of-responses--margin_top-bottom{
  font-size  : 10px;
  text-align : right;
  margin     : 3% 2.6% 6% 0;
}



.mlife-article__content__number-of-responses--margin_medium{
  margin-bottom : 13.33%;
}


/* life 1904_01 */
.mlife-article__fv__supplement-content{
  border-radius : 10px;
  margin        : /*-2.2% 0 7.2% 0*/10.6% 0 12.8% 0;
  padding       : 7.2% 2.89%;
}

.mlife-article__fv__supplement-content--bg_skyblue{
  background : #f0fafa;
}

.mlife-article__fv__supplement-content--bg_yellow{
  background : #fff9e6;
}
.mlife-article__fv__supplement-content--bg_pink{
  background : #fef8f9;
}
.mlife-article__fv__supplement-content--bg_pink02{
  background : #ffeded;
}
.mlife-article__fv__supplement-content--bg_green{
  background : #a9d681;
}
.mlife-article__fv__supplement-content--bg_purple{
  background : #daa1d6;
}
.mlife-article__fv__supplement-content--bg_blue{
  background : #66cccc;
}

.mlife-article__fv__supplement-content__image{
  margin : 0 0 7.2% 0;
}

.mlife-article__fv__supplement-content__text--margin_none{
  margin     : 0;
  text-align : justify;
}

.mlife-article__fv__supplement-content--margin-bottom_large{
  margin-bottom:16%;
}


/* mono 1905_01 */
.mlife-article__content--bg_mono_1905_01-content02_1-text{
  background: #fffdf7;
  padding : 0 4% 5.8%;
  text-align : justify;
}

.mlife-article__content--bg_mono_1905_01-content02_2-text{
  background: #fef8f9;
  padding : 0 4% 5.8%;
  text-align : justify;
}

.mlife-article__content--bg_mono_1905_01-content02_3-text{
  background: #f1f8ea;
  padding : 0 4% 5.8%;
  text-align : justify;
}

.mlife-article__content--bg_mono_1905_01-content02_4-text{
  background: #fbf6fb;
  padding : 0 4% 5.8%;
  text-align : justify;
}

.mlife-article__content--bg_mono_1905_01-content02_5-text{
  background: #f0fafa;
  margin-bottom:13.33%;
  padding : 0 4% 4%;
  text-align : justify;
}

.mlife-article__content__mono_1905_01-content02_5__number-of-responses{
  display    : block;
  font-size  : 10px;
  text-align : right;
  margin     : 8% 0 0 0;
}

/* life 1906_01 */
.mlife-article__content--bg_life_1906_01-1-text{
  background: #fffdf7;
  padding : 0 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}

.mlife-article__content--bg_life_1906_01-2-text{
  background: #fef8f9;
  padding : 0 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}

.mlife-article__content--bg_life_1906_01-3-text{
  background: #f1f8ea;
  padding : 0 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}

.mlife-article__content--bg_life_1906_01-4-text{
  background: #fbf6fb;
  padding : 0 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}

.mlife-article__content--bg_life_1906_01-5-text{
  background: #f0fafa;
  margin-bottom:13.33%;
  padding : 0 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}

/* life 1907_01 */

.mlife-article__content--bg_life_1907_01-1-text{
  background: #fef8f9;
  padding : 3% 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}
.mlife-article__content--bg_life_1907_01-2-text{
  background: #f0fafa;
  padding : 3% 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}
.mlife-article__content--bg_life_1907_01-3-text{
  background: #fbf6fb;
  padding : 3% 4% 1%;
  text-align : justify;
  margin : -8% 0 0 0;
}
.mlife-article__content--bg_life_1907_01-4-text{
  background: #fbf6fb;
  padding : 3% 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}
.mlife-article__content--bg_life_1907_01-5-text{
  background: #f1f8ea;
  padding : 3% 4% 5.8%;
  text-align : justify;
  margin : -8% 0 0 0;
}


/* kokoro 1912_01 */
.mlife-article__content__text--kokoro_1912_01_2-1-text{
  background : #fef4f4;
  margin:0 0 10%;
  padding:0 6.6% 8%;
}

.mlife-article__content__text--kokoro_1912_01_2-2-text{
  background : #fffbf0;
  margin:0 0 10%;
  padding:0 6.6% 8%;
}

.mlife-article__content__text--kokoro_1912_01_2-3-text{
  background : #e8f7f7;
  padding:0 6.6% 8%;
}

.mlife-article__content__text--kokoro_1912_01_2-4-text{
  margin:0 0 14%;
  padding:0 6.6%;
}

/* life 1912_01 */
.mlife-article__content__text--life_1912_01_3-1-text{
  background : #fef4f4;
  margin:0 0 12%;
  padding:0 6.6% 8.6%;
}

.mlife-article__content__text--life_1912_01_3-2-text{
  margin:0 0 14%;
  padding:0 6.6%;
}

/* mono 2001_01 */
.mlife-article__content__text--mono_2001_01_1-text{
  background : #fffbf0;
  margin:0 0 13.5%;
  padding:0 6.6% 8%;
}

/* kokoro 2003_01 */
.mlife-article__content__text--kokoro_2003_01_2-2-text{
  background : #e8f7f7;
  padding:0 6.6% 5.3%;
}

.mlife-article__content__text--kokoro_2003_01_2-3-text{
  background : #fef4f3;
  margin : 0 0 10.6%;
  padding:0 6.6% 5.3%;
}

/* mono 2003_01 */
.mlife-article__content__text--mono_2003_01_2-text{
  margin     : 6.6% 2.6% 13.33%;
  text-align : justify;
}

/* mono 2004_01 */
.mlife-article__content__text--mono_2004_01_1-text{
  background : #fdf4f5;
  margin: 0 0 17.39%;
  padding: 6.6%;
  text-align : justify;
}

/* kokoro 2102_01 */
.mlife-article__content__text--kokoro_2102_01_2-text{
  margin     : 1.8% 6.5% 8%;
  text-align : justify;
}

/* mono 2109_02 */
.mono_2109_02_content02_2-list{
  margin: 0 0 8%;
}

.mono_2109_02_content02_3-list{
  margin: 0 0 16%;
}

.mono_2109_02_content02_2-list dt,
.mono_2109_02_content02_3-list dt{
  font-size:17px;
  font-weight: bold;
  margin: 25px 15px 0;
}

.mono_2109_02_content02_2-list dt{
  color:#f16c8b;
}

.mono_2109_02_content02_3-list dt{
  color:#62a9d7;
}

.mono_2109_02_content02_2-list dd,
.mono_2109_02_content02_3-list dd{
  margin: 0 10px;
}

/* kokoro 1811_01 */

/* a.mlife-app-dl__btn:last-child img{
  margin-left: auto;
  border-radius: 50%;
  padding: 20%;
} */

.footer-icon {
    position: fixed;
    right: 0%;
    bottom: 11%;
    width: 10%;
    height: auto;
    z-index: 999;
}

.mlife-article__image--small-center {
  display: block;
  margin: 0 auto 8% auto;
  max-width: 350px; /* 必要に応じてサイズ調整 */
  width: 100%;
}

.mlife-article__image-slider {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-bottom: 8%;
}

.mlife-article__image-slider img {
  min-width: 955px; /* スクロールを誘導するために幅を広めに */
  width: auto;
  display: block;
}

@media only screen and (max-width: 750px)/* スマホ用 */{
  .footer-icon {
    position: fixed;
    right: 3%;
    bottom: 11%;
    width: 19%;
    height: auto;
    z-index: 999;
}
}



/* survey */

.mlife-article__content__survey{
  border-bottom : 1px dashed #000;
  border-top    : 1px dashed #000;
  font-size     : 12px;
  margin        : 0 2.6% 8%;
  padding       : 4.2% 0;
}

.mlife-article__content__survey__title{
  font-weight : bold;
  line-height : 1.75;
}

.mlife-article__content__survey__text{
  line-height : 1.75;
}




/* toplink */

.toplink{
  padding    : 4% 15px;
  text-align : right;
}

.toplink a{
  background   : url(../img/side_arrow2.png) left center no-repeat;
  padding-left : 16px;
}





/* footer content link */

.mlife__footer-content-link{
  padding : 5.3% 15px;
  width   : 100%;
}

.mlife__footer-content-link li{
  display   : block;
  margin    : 0 auto 2.26%;
  max-width : 560px;
}





/* app dl */

.mlife-app-dl{
  background      : #FFF9E6;
  bottom          : 0;
  left            : 0;
  position        : fixed;
  width           : 100%;
  z-index         : 9999;
}

@media only screen and (min-width: 751px) {

  .mlife-app-dl__inner{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 15px;
  }

  .mlife-app-dl__icon img{
    width: 500px;
    max-width: 100%;
    height: auto;
  }

}

@media only screen and (max-width: 750px){

  .mlife-app-dl__inner{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 15px;
  }

  .mlife-app-dl__icon{
    width: auto !important;
    margin: 0;
  }

  .mlife-app-dl__icon img{
    width: auto;
    max-width: 100%;
    margin: 0 auto;
  }

}

.mlife-app-dl__close-btn{
  position: relative;
  left: -10px;
  z-index: 1;
}

/* 2112_01　追加*/
.boxArea4 {
    border: #fdeabe 3px solid;
    background: #ffffff;
    padding: 7%;
    border-radius: 20px;
    margin-top: -8%;
    z-index: 1;
    line-height: 1.8;
}
@media only screen and (min-width: 751px){
	.boxArea4 {
	font-size: 190%;
	}
}

/*　uservoice　*/
.clife-article__content__uservoice{
  margin: 0 auto 6%;
  padding: 0 8.8%;
}

.clife-article__content__uservoice li{
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
  margin: 0 0 6%;
}

.clife-article__content__uservoice li:nth-child(even){
  flex-direction: row-reverse;
}

.clife-article__content__uservoice li img{
  flex-shrink: 0;
  margin: 3.23% 0 0;
  width: 18.93%;
}

.clife-article__content__uservoice li p{
    /*background: #fffcf3;*/
    border: 3px solid #fdeabe;
    border-radius: 5.333vw;
    font-size: 102%;
    padding: 6.47%;
    position: relative;
    text-align: justify;
    width: 72%;
}

.clife-article__content__uservoice li p:before{
  background: url(../img/fukidashi_uservoice.png) no-repeat top left 0.266vw/100% auto;
  content:'';
  height:4vw;
  left: -6.933vw;
  position: absolute;
  top: 11.2vw;
  width: 6.933vw;
  z-index: 2;
}

.clife-article__content__uservoice li:nth-child(even) p:before{
  background: url(../img/fukidashi_uservoice.png) no-repeat top right -0.266vw/100% auto;
  left: auto;
  right: -6.933vw;
  transform: rotateY(180deg);
}

@media only screen and (min-width:751px){
  .clife-article__content__uservoice li p{
    border: 3px solid #fdeabe;
    border-radius: 40px;
    font-size: 187%;
  }

  .clife-article__content__uservoice li p:before{
    background: url(../img/fukidashi_uservoice.png) no-repeat top left 2px/100% auto;
    height: 30px;
    left: -52px;
    top: 84px;
    width: 52px;
  }

  .clife-article__content__uservoice li:nth-child(even) p:before{
    background: url(../img/fukidashi_uservoice.png) no-repeat top right -2px/100% auto;
    right: -52px;
  }
}


.clife-article__content__uservoice.clife-article__content__uservoice--2111_01 li p{
    background: #fff;
    border: 0.4vw solid #fff095;
}
@media only screen and (min-width:751px){
  .clife-article__content__uservoice.clife-article__content__uservoice--2111_01 li p{
    border: 3px solid #fff095;
  }
}