@charset "utf-8";



.loginInfo_inner{
  display: block;
  align-items: center;
  justify-content: center;
  padding: 15px 20px;
  text-align: center;
}

.loginInfo_contents {
  display: inline-block;
  font-size: 14px;
}

.loginInfo_content {
  display: inline-block;
  padding-top: 10px;
}

.loginInfo_greeting{
  position: relative;
  text-align: center;
  height: 2.5em;
  margin-right: 10px;
  display: inline-block;
  vertical-align: top;
  padding-top: 18px;
  font-weight: bold;
}

.loginInfo_greeting:before{
  content:"";
  position: absolute;
  display: inline-block;
  width: 60px;
  height: 1px;
  background: #c8b895;
  -webkit-transform: rotate(15deg);
     -moz-transform: rotate(15deg);
      -ms-transform: rotate(15deg);
       -o-transform: rotate(15deg);
          transform: rotate(15deg);
  top:5px;
  right:5px;
}

.loginInfo_greeting:after{
  content:"";
  position: absolute;
  display: inline-block;
  width: 60px;
  height: 1px;
  background: #c8b895;
  -webkit-transform: rotate(-15deg);
     -moz-transform: rotate(-15deg);
      -ms-transform: rotate(-15deg);
       -o-transform: rotate(-15deg);
          transform: rotate(-15deg);
  bottom:-30px;
  right:5px;
}

.loginInfo_stage {
  display: inline-block;
}

.loginInfo_nonstage {
  display: inline-block;
  padding:15px;
}

.loginInfo_stage_detail{
  width: 246px;
  height: 68px;
  font-size: 12px;
  text-align: center;
  margin-bottom: 10px;
  margin-right: 20px;
}


.stage_detail-bronze{
  background: url(../../login/img/stage_frame_bronze.png) center center no-repeat;
  background-size: contain;
}
.stage_detail-silver{
  background: url(../../login/img/stage_frame_silver.png) center center no-repeat;
  background-size: contain;
}
.stage_detail-gold{
  background: url(../../login/img/stage_frame_gold.png) center center no-repeat;
  background-size: contain;
}
.stage_detail-platina{
  background: url(../../login/img/stage_frame_platina.png) center center no-repeat;
  background-size: contain;
}

.loginInfo_stage_detail_inner_bronze{
  background: url(../../login/img/icon_stage_bronze.png) no-repeat right 20px center;
  height: 100%;
  padding-top: 15px;
  padding-right: 60px;
  font-weight: bold;
}
.loginInfo_stage_detail_inner_silver{
  background: url(../../login/img/icon_stage_silver.png) no-repeat right 20px center;
  height: 100%;
  padding-top: 15px;
  padding-right: 60px;
  font-weight: bold;
}
.loginInfo_stage_detail_inner_gold{
  background: url(../../login/img/icon_stage_gold.png) no-repeat right 20px center;
  height: 100%;
  padding-top: 15px;
  padding-right: 60px;
  font-weight: bold;
}
.loginInfo_stage_detail_inner_platina{
  background: url(../../login/img/icon_stage_platina.png) no-repeat right 20px center;
  height: 100%;
  padding-top: 15px;
  padding-right: 60px;
  font-weight: bold;
}


.stage_current{
  font-size: 16px;
  text-align: center;
}



.stage_linkmypage,
.logout_area{
  text-align: left;
  font-weight: bold;
}

.stage_linkmypage a,
.logout_area a {
  padding-left: 15px;
  background: url(../../shared/img/link_arrow_red.png) 5px center no-repeat;
}

.loginInfo_guide {
  display: inline-block;
  vertical-align: top;
  width: 46%;
  font-weight: bold;
}

.loginInfo_guide_info{
  padding-bottom:5px;
  background: url(../../shared/img/border_dashed.png) center bottom repeat-x;
  text-align: left;
}

.loginInfo_guide_detail{
  font-size: 16px;
  padding-top: 10px;
  text-align: left;
}

@media screen and (min-width: 990px) {
  .loginInfo_guide {
    width: 60%;
  }

  .loginInfo_content {
    padding-top: 0;
  }
}


@media screen and (min-width: 1305px) {
  .loginInfo_guide {
    padding-top: 15px;
    width: auto;
  }

  .loginInfo_content {
    padding-top: 0;
  }
}





/*
#loginRanking
---------------------------------------*/

#loginRanking .contents_inner {
  padding-top: 40px;
  padding-bottom: 40px;
}

#topMainContents .ranking-logined{
  margin-left: 15px;
  width: 1320px;
}

.ranking-logined_title{
  font-size: 20px;
  font-weight: bold;
  padding:0 5px;
  margin-bottom: 15px;
}

.ranking-logined_contents{
  display:-webkit-box;/*--- Androidブラウザ用 ---*/
  display:-ms-flexbox;/*--- IE10 ---*/
  display: -webkit-flex;/*--- safari（PC）用 ---*/
  display:flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-left: auto;
}
/* 例外 */
#topMainContents .ranking-logined .ranking-logined_contents.w1320 {
    width: 100%;
    max-width: 1320px;
}

.ranking-logined_list{
  width: 48.5%;
  margin-right: 1%;
}

.ranking-logined_supplement,
.ranking-logined_skincare{
  margin-bottom: 20px;
}

@media screen and (min-width: 1024px){
  .ranking-logined_list {
    width: 24%;
  }
  .ranking-logined_supplement,
  .ranking-logined_skincare{
    margin-bottom: 0px;
  }
}



.ranking_list_title{
  font-size: 18px;
  font-weight: bold;
  border-bottom-right-radius: 10px;
  padding:15px 30px 15px 55px;
  line-height:1em;
}

.ranking-logined_supplement .ranking_list_title{
  background: url(../img/ranking_icon_blue.png) 10px 40% no-repeat #d6e7f8;
}

.ranking-logined_recommend .ranking_list_title,
.ranking-logined_kodawari .ranking_list_title{
  background: url(../img/ranking_icon_green.png) 10px 40% no-repeat #deebd0;
}

.ranking-logined_skincare .ranking_list_title{
  background: url(../img/ranking_icon_red.png) 10px 40% no-repeat #f6e0e0;
}

.ranking-logined_supportfood .ranking_list_title{
  background: url(../img/ranking_icon_yellow.png) 10px 40% no-repeat #fceecb;
}

.ranking_item{
  background: url(../../shared/img/border_dashed.png) center bottom repeat-x;
}

.ranking-logined_list .ranking_item:last-child{
  background: none;
}

.ranking_item a{
  display:-webkit-box;/*--- Androidブラウザ用 ---*/
  display:-ms-flexbox;/*--- IE10 ---*/
  display: -webkit-flex;/*--- safari（PC）用 ---*/
  display:flex;

  padding:10px 0;
}

.ranking_item_image{
  width: 80px;
  height: 80px;
  margin-right: 15px;
}

.ranking_item_image img{
  width: auto;
  height: 100%;
}

.ranking_item_detail{
  flex:1;
}

.ranking_item_name{
  min-height: 3em;
  line-height:1.5em;
  font-weight: bold;
  font-size: 16px;
}

.ranking_item_price{
  text-align: right;
  font-weight: bold;
  padding-top: 10px;
}


/*
#loginProduct
---------------------------------------*/

#loginProduct .contents_inner{
  padding-top:40px;
  padding-bottom: 40px;
}

.category-logined img {
  width: 100%;
}

.category-logined_title{
  font-size: 20px;
  font-weight: bold;
  padding:0 5px;
  margin-bottom: 15px;
}

.category-logined_list{
  display:-webkit-box;/*--- Androidブラウザ用 ---*/
  display:-ms-flexbox;/*--- IE10 ---*/
  display: -webkit-flex;/*--- safari（PC）用 ---*/
  display:flex;
  flex-wrap: wrap;
  justify-content: space-between;
  background: none;
  padding: 30px 7.8%;
  border-radius: 10px;
  box-shadow: 0 1px 1px rgba(0,0,0,0.1) inset, 0 -1px 1px rgba(0,0,0,0.1) inset,
    1px 0 1px rgba(0,0,0,0.1) inset, -1px 0 1px rgba(0,0,0,0.1) inset;
}

.category-logined_list li{
  width: 46%;
  font-size: 16px;
  text-align: center;
  margin-bottom: 35px;
}

.category-logined_list li:nth-child(n + 3){
  margin-bottom: 0;
}

.category-logined_list_image{
  text-align: center;
  margin-bottom: 15px;
  position: relative;
  display: inline-block;
  width: 70%;
}

.category-logined_list_image:before{
  content:"";
  position: absolute;
  display: inline-block;
  width: 63px;
  height: 60px;
  top:-10px;
  left: -10px;
}

@media screen and (min-width: 1024px){
  .category-logined_list_image {
    width: 100%;
  }
}


.category-logined{
  width: 100%;
  display: inline-block;
  vertical-align: top;
  margin-bottom: 50px;
}

@media screen and (min-width: 1024px){
  .category-logined{
    width: 33%;
    display: inline-block;
    vertical-align: top;
    margin-right: 2%;
  }
}

.category_item_supplement .category-logined_list_image:before{
  background: url(../img/category_icon_supplement.png) center center no-repeat;
}
.category_item_skincare .category-logined_list_image:before{
  background: url(../img/category_icon_skincare.png) center center no-repeat;
}
.category_item_kodawari .category-logined_list_image:before{
  background: url(../img/category_icon_kodawari.png) center center no-repeat;
}
.category_item_supportfood .category-logined_list_image:before{
  background: url(../img/category_icon_supportfood.png) center center no-repeat;
}

.category-logined_list_name {
  font-weight: bold;
}

/*
#loginTrial
---------------------------------------*/

.trial-logined_product{
  width: 100%;
  display: inline-block;
}

@media screen and (min-width: 1024px){
  .trial-logined_product{
    width: 64%;
    display: inline-block;
  }
}

.trial-logined_titles {
  position: relative;
  overflow: hidden;
  margin-bottom: 15px;
}

.trial_product_title{
  position: relative;
  font-size: 20px;
  font-weight: bold;
  padding-right: 15px;
  display: inline-block;
  z-index: 4;
}


.trial_product_title+span {
  font-weight: bold;
}

/*.trial_product_title+span:before {
  content: "";
  position: absolute;
  right: 100%;
  top: 0;
  bottom: 0;
  margin: auto;
  display: inline-block;
  width: 200%;
  height: 2px;
  border-top: 1px solid #d2c5b8;
  border-bottom: 1px solid #fff;
  z-index: 3;
}*/

.trial_product_title+span {
  display: inline-block;
  position: absolute;
  font-size: 18px;
  right: 0;
  padding-left: 15px;

}

.trial_product_list{
  padding-top: 10px;
  display:-webkit-box;/*--- Androidブラウザ用 ---*/
  display:-ms-flexbox;/*--- IE10 ---*/
  display: -webkit-flex;/*--- safari（PC）用 ---*/
  display:flex;
  flex-wrap: wrap;
  /* justify-content: flex-start; */
  justify-content: space-between;
}

.trial_product_list:after {
    content: "";
    display: block;
    width: 30%;
}

.trial_list_item{
  position: relative;
  display: inline-block;
  background: #fff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  text-align: center;
  width: 32%;
  padding:15px;
  margin-bottom:30px;
  box-shadow:0 2px 5px rgba(0,0,0,0.2);
}


.trial_product_list .trial_list_item:nth-child(3n){
  margin-right: 0;
}
.trial_list_item:before{
  content:"";
  position: absolute;
  display: block;

  bottom:99%;
  left: 0;

  background: url(../img/trial_product_item_header.png) center bottom no-repeat;
  background-size:100%;
  width: 100%;
  height: 10px;
}

.trial_item_image{
  margin-bottom: 10px;
}

.trial_item_image img {
  width: 100%;
}

.trial_item_name{
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1em;
  height: 3em;
  font-size: 16px;
  font-weight: bold;
}

.trial_item_link a{
  display: inline-block;
  width: 100%;
  font-size: 14px;
  border-radius: 5px;
  padding:8px 0;
  background: url(../img/trial_link_arrow.png) 95% center no-repeat #f7f6f1;
}


/* __________ ranking __________ */

.disp_none {
  display: none;
}

@media screen and (min-width: 1023px) and (max-width:1320px) {
  .disp_block {
    display: block!important;
  }
}