/*----------------------------
 01. Generic styles
 -----------------------------*/

 @import url("reset.css");
 @import url("./css/layout.css");

 html, body {
  height: 100%;
  font-family: 'Open Sans', sans-serif;
  font-size:14px;
  /* overflow-y: scroll; */
}


.mincho{
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


a[href^="tel:"] { cursor: default; }

hr {
  border-top: 1px solid #dcdcdc;
}

.logo img{
  width:50%;
  height:50%;
}


#page-top {
  position: fixed;
  right:10px;
  bottom:10px;
  z-index:3; 
  width:100px; 
}

#page-top a{
  display:block;
  background-color: rgba(255, 255, 255, 0.3);
  text-decoration: none;
  text-align:center;
  padding:10px;

}

#page-top a:hover{
  color:#e72e8b;
  text-decoration: none;
  opacity:0.5;
}

.indent{
  text-indent: -1em;
  margin-left:1em;
  display:block;
}




section{
  padding-top:20px;
  padding-bottom:30px;
}

section.idx{
  padding-top:0px;
  padding-bottom:0px;
}

.red_line{
  border-style: solid;
  border-width: 5px 0 0 0;
  border-color: #ff0000;
}

.top_topimg_ymd a:hover,
.top_topimg_ymok a:hover{
  opacity:0.0;
}

.top_topimg_ymd{
  background-image: url('special_index/img/top_topimg_ymd_on.jpg');
  background-size: contain;
  background-position:bottom;
  background-repeat:  no-repeat;
}

.top_topimg_ymok{
  background-image: url('special_index/img/top_topimg_ymok_on.jpg');
  background-size: contain;
  background-position:top;
  background-repeat:  no-repeat;
}



p{
  margin-bottom:1em;
}

.fs-07{
  font-size:0.7em;
}

.dspc{
    display: block;
  }

  .dssp{
    display: none;
  }



/*----------------------------
 02. Typography
 ----------------------------*/

 .copyright {
  background:black;
  padding:10px;
}
/*----------------------------
 color
 ----------------------------*/
 .cblue{
  color:#036EB7;
}

.cgray{
  color:gray;
}

.cpink{
  color:#EB78AA
}


.red{
  color:#ff6400
}



/*----------------------------
 15. position
 -----------------------------*/

 header{
  z-index:2;

}

.fblink{
  position:absolute;
  top:8px;
  right:25px;
  font-size:40px;
  color: #305097;

}

.fblink2{
  font-size:40px;
  margin-top:8px;
  color: #305097;

}

/*----------------------------
  カスタム
  -----------------------------*/
  .row{
    padding:0;
    margin:0;

  }



  a img:hover{
    opacity:0.8;
  }


  .relative{
    position:relative;
  }

  .pbottom0{
    position:absolute;
    bottom:0;
  }

  .borderwhite{
    border:solid 5px white;
  }

  .borderblack{
    border:solid 1px black;
  }

  ol{
    margin-left:2em;
  }


  .navigation a{
    color:black;
  }


  .linkhead{
   margin-top:-74px;

   padding-top:74px;
 }

 .bdr-tb1{
  border-top:solid 1px black;
  border-bottom:solid 1px black;
  /* height: 50px; */
  padding-top:5px;
}


/*----------------------------
  セクション
  -----------------------------*/

  .toppage{
    background:url(./image/top/topback.png);
    background-size:cover;
    min-height:100%;
    padding-top:44px;

  }

  .playerspage{
   /* background:url(./special_yamaoka/image/players/topback.png); */
   background-size:contain;
   min-height:100%;
   padding-top:44px;
 }


 .athletespage{
   background:url(../special_yamada/image/athletes/topback.png) no-repeat;
   background-size:cover;
   min-height:100%;
   padding-top:44px;
 }

 .beautypage{
   background:url(./image/beauty/bg.png) no-repeat;
   background-size:cover;
   min-height:100%;
   padding-top:44px;
 }


 .listpage{
   /* background:url(./special_yamaoka/image/list/bg.png) no-repeat; */
   background-size:cover;
   min-height:100%;
   padding-top:44px;
 }


 .allwrap{
  background:white;
  max-width:1280px;
  margin:0 auto;
}


.onlymb{
  display:none!important;
}

.onlymbnav{
  display:none!important;
}

.onlypcnav{
  margin-top:-44px;
  position:fixed;
  background:white;
  width:100%;
  max-width:1280px;
  z-index:100;
}


/*----------------------------
 ナビ
 -----------------------------*/

 .toptext{
  background:#e72e8b;
  color:white;
}



.inner {
  width: 100%;
  margin: 0 auto;
}
.inner:after {
  content: "";
  clear: both;
  display: block;
}

/* header */
#top-head {
  top: -100px;
  position: absolute;
  width: 100%;
  max-width:1280px;
  /*margin: 100px auto 0;*/
  /*padding: 30px 0 0;*/
  line-height: 1;
  z-index: 999;
}

#top-head a,
#top-head {
  color: black;
  text-decoration: none;
}

#top-head .inner {
  position: relative;
}

#top-head .logo {
  float: left;
  /*font-size: 36px;*/
}

#global-nav ul {
  list-style: none;
  position: absolute;
  right: 0;
  bottom: 0;
  font-size: 14px;
}

#global-nav ul li {
  float: left;
}

#global-nav ul li a {
  padding: 0 30px;
}



/* Toggle Button */
#nav-toggle {
  display: none;
  position: absolute;
  right: 12px;
  top: 15px;
  width: 34px;
  height: 36px;
  cursor: pointer;
  z-index: 101;
}

#nav-toggle div {
  position: relative;
}

#nav-toggle span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background:black;
  left: 0;
  -webkit-transition: .35s ease-in-out;
  -moz-transition: .35s ease-in-out;
  transition: .35s ease-in-out;
}

#nav-toggle span:nth-child(1) {
  top: 0;
}

#nav-toggle span:nth-child(2) {
  top: 11px;
}

#nav-toggle span:nth-child(3) {
  top: 22px;
}


/*----------------------------
 ナビ sp
 -----------------------------*/


 #top-head,
 .inner {
  width: 100%;
  padding:v 0;
  margin:0 auto;
}
#top-head {
  top: 0;
  position: fixed;
}


#mobile-head {
 background:white;
 padding:10px;
 width: 100%;
 height: 54px;
 z-index: 999;
 position: relative;
 display: flex;
 justify-content:space-between;
}

#top-head .logo {
  /*position: absolute;
  left: 10px;
  top: -1px;*/
  width:108px;
}
#global-nav {
  position: absolute;
  /* 開いてないときは画面外に配置 */
  top: -512px;
  background: #e50012;
  width: 100%;
  text-align: center;
  padding: 10px 0;
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
}
#global-nav ul {
  list-style: none;
  position: static;
  right: 0;
  bottom: 0;
  font-size: 14px;
}
#global-nav ul li {
  float: none;
  position: static;
}
#top-head #global-nav ul li a,
#top-head.fixed #global-nav ul li a {
  width: 100%;
  display: block;
  color: #fff;
  padding: 18px 0;
}
#nav-toggle {
  display: none;
}
/* #nav-toggle 切り替えアニメーション */
.open #nav-toggle span:nth-child(1) {
  top: 11px;
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  transform: rotate(315deg);
}
.open #nav-toggle span:nth-child(2) {
  width: 0;
  left: 50%;
}
.open #nav-toggle span:nth-child(3) {
  top: 11px;
  -webkit-transform: rotate(-315deg);
  -moz-transform: rotate(-315deg);
  transform: rotate(-315deg);
}
/* #global-nav スライドアニメーション */
.open #global-nav {
  /* #global-nav top + #mobile-head height */
  -moz-transform: translateY(556px);
  -webkit-transform: translateY(556px);
  transform: translateY(556px);
}


/*----------------------------
 14. カスタム
 -----------------------------*/


 a.mbphone {
  color:black;
  display:block;
  position:absolute;
  right: 80px;
  margin:5px;
  height:30px;

}

.navwrap{
  background:#f3f3f3;
  margin-top:10px;

}

/*----------------------------
  background
  -----------------------------*/


  .row > [class*='col-'] {
    padding-right:5px;
    padding-left:5px;
  }


  .row10 > [class*='col-'] {
    padding-right:10px;
    padding-left:10px;
    overflow:hidden;
  }

  .row0 > [class*='col-'] {
    padding-right:0;
    padding-left:0;
  }


  .container{
    max-width:1280px;
  }

/*----------------------------
btn
-----------------------------*/
.oya{
  position:relative; 

}

.oya p.on{
  position:absolute;
  top:0;
  z-index:2;
  opacity:0;
}

.oya p.on:hover{
  position:absolute;
  top:0;
  z-index:2;
  opacity:1;
}

.oya p.on a img:hover{
  opacity:1!important;
}

.logo2{
  max-width:164px;
  margin-top:20px;
  margin-left:20px;

}

img.h100{
  width:auto!important;
  height:100% !important;
  margin:0 auto;
}

hr{
 background:black;

}
/*----------------------------
players
-----------------------------*/
.htype1{
  font-weight:bold;
  font-size:200%;
  border-bottom:2px black solid ;
  padding-bottom:10px;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.htype2{
  background:#E50012;
  padding:10px;
  color:white;
  font-size:150%;
  font-weight:bold;
}

.htype3{
  background:#036EB7;
  padding:10px;
  color:white;
  font-size:150%;
  font-weight:bold;
}

.htype4{
  font-weight:bold;
  font-size:150%;
  border-bottom:2px  solid ;
  padding-bottom:10px;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.htype5{
  background:#b89663;
  padding:10px;
  color:white;
  font-size:150%;
  font-weight:bold;
}

.htype6{
  font-weight:bold;
  font-size:200%;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  padding:10px 0;
}

.packwrap{
  border:gray solid 1px;
}


.big1{
  font-size:200%;
  font-weight:bold;
}



.nilabel{
  background:#BABABA;
  color:white;
}




.kuanlabel{
  background:#E7DE3B;
  color:white;
}


.replenishlabel{
  background:#063F85;
  color:white;
}

.kunlabel{
  background:#2977B2;
  color:white;
}

.immunitylabel{
  background:#0D6F54;
  color:white;
}

.jointlabel{
  background:#8378AC;
  color:white;
}

.huanlabel{
  background:#D12734;
  color:white;
}

.endurancelabel{
  background:#D9729D;
  color:white;
}

.chenlabel{
  background:#309C4E;
  color:white;
}

.fulabel{
  background:#AF8C5C;
  color:white;
}

.idxctr_recd {
  position:absolute;
  z-index: 1;
  margin: auto;
  width:16%;
  height:100%;
  top:-20%;
  left:42%;
}

.rmd{
  width:100%;
  margin: 0 auto;
  top:50px;
}

.idxctr {
  position:relative;
  z-index: 0;

  margin: auto;
}

.qatxt{
  font-size:125%;
}

/* color*/

.cni{
  color:#BABABA;
}




.ckuan{
  color:#E7DE3B;
}


.creplenish{
  color:#063F85;
}

.ckun{
  color:#2977B2;
}

.cimmunity{
  color:#0D6F54;
}

.cjoint{
  color:#8378AC;
}

.chuan{
  color:#D12734;
}

.cendurance{
  color:#D9729D;
}

.cchen{
  color:#309C4E;
}

.cfu{
  color:#AF8C5C;
}

.cwhite{
  color:white;
}

.bggray{
  background:gray;
}

.gray{
  color:#717071;
}

.contentwrap{
  border-bottom:dashed 2px gray;
  overflow:hidden;
  padding-bottom:30px;
  margin-top:30px;
}

.contentwraplast{
  overflow:hidden;
  padding-bottom:30px;
  margin-top:30px;
}

.kanso{
  color:#E50012;
  margin-bottom:10px;
}



.listwrap{
  height:360px;
}

.listtextwrap{
  height:70px;
}


.carousel-indicators .active{
  background:#E50012;
  border-color:#E50012;
}


.carousel-control.left{
  background:none;
}

.carousel-control.right{
  background:none;
}

.ico_q{
  width: 50px;
}

.ico_sns{
  width:34px;
  height:auto;
}

.tpcpy{
  padding-bottom: 40px;
}

/*----------------------------
 14. Media queries
 -----------------------------*/
 /* Large Devices, Wide Screens */
 @media only screen and (max-width: 1124px) {




 }


 /* Medium Devices, Desktops */
 @media only screen and (max-width: 1199px) {

  .fblink2{
    font-size:40px;
    margin-top:6px;
    color: #305097;

  }  

  .logo2{
    max-width:100px;
    margin-top:15px;
  }

  .listwrap{
    height:310px;
  }

  .qatxt{
    font-size:100%;
  }

  

}


/* Medium Devices, Desktops */
@media only screen and (max-width: 991px) {
  .logo img{
    width:100%;
    height:100%;
  }

  .onlymbnav{
   display:inline!important;
 }

 .onlypcnav{
  display:none;
}

.fblink{
  position:absolute;
  top:8px;
  right:55px;
  font-size:40px;

}

.listwrap{
  height:260px;
}



.dspc{
  display: block;
}

.dssp{
  display: none;
}




}


/* Medium Devices, Desktops */
@media only screen and (min-width: 768px) {

  .arrow_box {
    position: relative;
    background: #fff;
    border: 2px solid #000000;
    padding:10px;
    margin-right:5px;
    border-radius: 10px;
  }
  .arrow_box:after, .arrow_box:before {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
  }

  .arrow_box:after {
    border-color: rgba(255, 255, 255, 0);
    border-left-color: #fff;
    border-width: 10px;
    margin-top: -10px;
  }
  .arrow_box:before {
    border-color: rgba(0, 0, 0, 0);
    border-left-color: #000000;
    border-width: 13px;
    margin-top: -13px;
  }




  .arrow_box2 {
    position: relative;
    background: #fff;
    border: 2px solid #000000;
    padding:10px;
    margin-left:5px;
    border-radius: 10px;
  }
  .arrow_box2:after, .arrow_box2:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
  }

  .arrow_box2:after {
    border-color: rgba(255, 255, 255, 0);
    border-right-color: #fff;
    border-width: 10px;
    margin-top: -10px;
  }
  .arrow_box2:before {
    border-color: rgba(0, 0, 0, 0);
    border-right-color: #000000;
    border-width: 13px;
    margin-top: -13px;
  }





}
/* Small Devices, Tablets */
@media only screen and (max-width: 767px) {
  .icon-bar {
    background: white;
  }

  .onlymb{
   display:inline!important;
 }
 .onlypc{
  display:none!important;
}

.fblink{
  position:absolute;
  top:8px;
  right:10px;
  font-size:40px;

}

body {font-size:16px;}

.kanso{
  color:#E50012;
  margin-bottom:5px;
}

.htype6{
  font-weight:bold;
  font-size:115%;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
  padding-top:7px
}







.arrow_box2 {
  position: transparent;
  background: transparent;
  border: transparent;
  padding:transparent;
  margin-right:transparent;
  border-radius: transparent;
}
.arrow_box2:after, .arrow_box2:before {
  left: transparent;
  top: transparent;
  border: transparent;
  content: " ";
  height: transparent;
  width: transparent;
  position: transparent;
  pointer-events: transparent;
}

.arrow_box2:after {
  border-color:transparent;
  border-left-color:transparent;
  border-width:transparent;
  margin-top:transparent;
}
.arrow_box2:before {
  border-color:transparent;
  border-left-color: transparent;
  border-width:transparent;
  margin-top:transparent;
}




.arrow_boxmb {
  position: relative;
  background: #ffffff;
  border: 2px solid #000000;
  margin-bottom:20px;
  padding:10px;
  border-radius: 10px;

}
.arrow_boxmb:after, .arrow_boxmb:before {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.arrow_boxmb:after {
  border-color: rgba(255, 255, 255, 0);
  border-top-color: #ffffff;
  border-width: 10px;
  margin-left: -10px;
}
.arrow_boxmb:before {
  border-color: rgba(0, 0, 0, 0);
  border-top-color: #000000;
  border-width: 13px;
  margin-left: -13px;
}












/* .mbbggray{
  background:#FFCBCB;
  padding:10px;
  border-radius:10px;
  margin-bottom:15px; 
  } */



}
@media only screen and (max-width: 660px) {
  .icon-bar {
    background: black;
  }
  .tprecommend{
    background-color: #E50012;
    color:#ffffff;
    padding: 5px 0 5px 0;
  }

  .ftcopy{
    font-size: 100%;
    display: block;
    text-align: center;
    margin-top: 50px;
    margin-bottom: 120px;
  }

  .tpcpy span{
    font-size: 200%;
  }

  .idxctr_recd{
    display: none;
  }

  .dspc{
    display: none;
  }

  .dssp{
    display: block;
  }



  section{
    padding-bottom: 0;
  }


}
/* Extra Small Devices, Phones */
@media only screen and (max-width: 480px) {
 .icon-bar {
  background: black;
}


}
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {

}