@charset "utf-8";
/* CSS Document */
/**********************************************

共通

**********************************************/
html {font-size: 62.5%;}
body{
    font-size: 1.4rem;
    line-height: 1.7;
    box-sizing: border-box;　/*パディングとボーダーを幅と高さに含める*/
    height: 100%;
    width: 100%;
    margin: 0 auto;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
/*画像遅延処理*/
.ready {
  opacity: 0;
}
.loaded {
  opacity: 1;
  -webkit-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  -moz-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  -o-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
}

/* メインエリア */
.main{
  padding-bottom: 15%;
}
.wrap{
  width: 96%;
  margin: 0 auto;
}
.full{width: 100%;}
.clearfix {
    zoom: 1;
}
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}
.BgBlack{
  background-color: :#000;
}
/****************************************
マージン各種
*****************************************/

.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}

.mt2{margin-top:2%;}
.mt3{margin-top:3%;}
.mt4{margin-top:4%;}
.mt5{margin-top:5%;}

.mb2{margin-bottom:2%;}
.mb3{margin-bottom:3%;}
.mb4{margin-bottom:4%;}
.mb5{margin-bottom:5%;}
.mb10{margin-bottom:10%;}

.pt2{padding-top:2%;}
.pt3{padding-top:3%;}
.pt4{padding-top:4%;}
.pt5{padding-top:5%;}
/**********************************************

ヘッダー

**********************************************/
h1{
/*  background-color:#8fc31f;
  color:#FFF;
  padding:1% 3%;;*/
  font-size:90%;
}
header div{
  margin:0;
  padding:0;
}
header ul{
  display:flex;
}
header ul li{
  width:20%;
}
header .otherLink a{
  width: 50%;
    float: left;
}

/**********************************************

フッター

**********************************************/
footer{
  margin-bottom:5%;
}
/*
footer .txt{
  border-top:1px solid #603517;
  width:90%;
  margin:0 auto;
  text-align:center;
  color:#603517;
  font-size:120%;
  padding-top:2%;
}
footer .btn{
  width:90%;
  margin:5% auto 10% auto;
}
*/
/* メニュー
footer nav{
  margin-top:5%;
  margin-bottom:10%;
}
*/

/* コピーライト
footer #copyright{
    text-align: center;
    color: #855427;
}
*/


/* ----------------------------------------------
  追尾メニュー
---------------------------------------------- */
#footer_wrap{
  display:none;
  position:fixed;
  bottom:0;
  z-index:1000;
    margin: 0 auto;
    min-width: 320px;
    max-width: 640px;
  width:100%;
}
#footer_menu{
  display:flex;
  width:100%;
}
#footer_menu.FlexRight{
  justify-content: flex-end;
}
#footer_menu a{
  width:33%;
  margin-right:0.5%;
}
#footer_menu a:last-child{
  margin-right:0;
}
#footer_menu a img{
  width:100%;
}

/**********************************************

トップ

**********************************************/
.main#top{
  width: 100%;
  padding-bottom: 0;
}
#top{
  height: 0;
  padding-top: 158.4%;/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
  background: url('../images/top/bg.jpg') 0 0 no-repeat;
  background-size: contain;
  position:relative;
}
#top img{
  width: 100%;
}
/* タイトル */
#top h1{
  position: absolute;
  top:4%;
  right: 2%;
  width: 60%;
}
/* エロモード全開奥様 */
#top .interview2{
  position: absolute;
  width: 50%;
  top:20%;
  left: 2%;
}
/* 変態奥様 */
#top .interview1{
  position: absolute;
  width: 50%;
  top:33%;
  left: 2%;
}
/* 官能小説 */
#top .novel{
  position: absolute;
  width: 25%;
  top:47%;
  left: 2%;
}
/* ヘブン総選挙 */
#top .cityheaven{
  position: absolute;
  width: 45%;
  bottom:5%;
  left: 0;
}
/* スタッフ紹介 */
#top .staff{
  position: absolute;
  width: 25%;
  top:23%;
  right: 2%;
}
/* ランキング */
#top .ranking{
  position: absolute;
  width: 25%;
  top:38%;
  right: 25%;
}
/* カバーガール */
#top .covergall{
  position: absolute;
  width: 23%;
  top:61%;
  right: 6%;
}
/* プレゼント企画 */
#top .present{
  position: absolute;
  width: 45%;
  bottom:15%;
  right: 2%;
}
/* 熟女家プラス難波店 */
#top .plus{
  position: absolute;
  width: 50%;
  bottom:6%;
  right: 2%;
}

/**********************************************

スタッフ紹介

**********************************************/
/*staff #move1{position:absolute;right:-600px;}*/

/* スタッフ画像(移動表示) */
#staff .BgBeige{
  background-color: #603813;
  font-size: 1.0rem;
}
#staff .StaffWrap{
  background-image: url(../images/staff/bg_red.png);
  background-repeat: repeat;
  padding: 5% 2%;
}
#staff .StaffMove{
  position: relative;
}
#staff .StaffInterview{
  background-image: url(../images/staff/bg_yellow.png);
  background-repeat: repeat;
  position: relative;
  padding-bottom: 5%;
}
/* 動く素材 */
#staff #move1_1{
  position:absolute;left:-600px;
  z-index: 10;
  height: 250px;
}
#staff #move1_2{
  position:absolute;
  right:-600px;
  z-index: 10;
  height: 200px;
}
#staff #move2_1{
  position:absolute;right:-600px;
  z-index: 10;
  height: 200px;
}
#staff #move2_2{
  position:absolute;left:-600px;
  z-index: 10;
  height: 200px;
  top:0;
}
#staff .StaffImage{
  height:200px;
  position:relative;
}
#staff .second{
  padding: 8% 0;
}
/* 斜線 */
#staff .diagonal{
  position: absolute;
/*  top: 50%;*/
  top: 215px;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  z-index: 5;
  width: 100%;
}
#staff .diagonal img{
  width: 100%;
}
/**/
#staff .mark{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  width: 70%;
  z-index: 0;
}
#staff .mark img{
  width: 100%;
}

#staff .samurai{
  position: absolute;
  top: 0;
  right: 0;
}
#staff .comment{
  padding: 5% 0;
}
#staff .subtitle{
  height: 40px;
}
#staff .herf{
  width: 50%;
}
#staff .flex{
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#staff .flex div:first-child{
  width: 30%;
  z-index: 10;
}
#staff .box{
  margin-bottom: 5%;
}
#staff .box h3{
  margin-bottom: 1%;
}
/* セリフ部分 */
#staff .box .balloon1-left {
  position: relative;
  display: inline-block;
  padding: 2%;
  width: 71%;
  margin-left: -5px;
  background: #fff;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border: 5px solid #000;
  z-index: 0;
}
#staff .box .balloon1-left p {
    margin: 0;
    padding: 0;
}
#staff .box .balloon1-left .hukidashi{
  position: absolute;
  top: 20px;
  left: -39px;
}

#staff .box .microphone{
  height: 50px;
}
#staff .question{
  width: 70%;
}
#staff .BtnJob{
  padding-bottom: 10%;
  width: 100%;
}
#staff .box .flex span{
  color:#FF0000 ;
}

/* フラッシュバック熟女家 */
#staff .FlashWrap{
  background-image: url(../images/staff/column_back_middle.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  padding: 2% 0;
  /*
  background-image:url(../images/staff/column_back_top.png),
           url(../images/staff/column_back_middle.png),
           url(../images/staff/column_back_bottom.png);
  background-position:center top,
            center 50px,
            center bottom;

            -moz-background-size:100% auto;
            background-size:100% auto;
*/
}
#staff .FlashWrap .contents{
  margin: 2%;
  padding: 2%;
  border: 2px solid #603813;
}
#staff .FlashWrap .contents p{
  margin-bottom: 3%;
}


/**********************************************

ランキング

**********************************************/
#ranking{
  /* 横幅いっぱい・縦リピート */
  background: url(../images/ranking/bg_ranking.jpg);
  -moz-background-size:100% auto;
  background-size:100% auto;
}
#ranking .BgStar1{
  background-image: url(../images/ranking/star1.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  position: relative;
}
#ranking .BgStar2{
  background-image: url(../images/ranking/star2.png);
  background-repeat: repeat;
  position: relative;
}
#ranking .test{
  position: absolute;
  top: 0;
  z-index: 0;
}

#ranking .info{
  background: url(../images/ranking/waku.png) no-repeat;
  background-size: 100% auto;
  padding: 10% 8%;
  color: #fff;
  margin-bottom: 5%;
  margin-top: 3%;
  color: #fff;
}

#ranking .RankMain{
  position: relative;
  margin-bottom: 5%;
}
#ranking .RankMain img{
  width: 96%;
  padding: 0 2%;
}
#ranking .RankMain .prof{
  position: absolute;
  top:38%;
  left: 6%;
}
#ranking .RankMain .prof .name{
  border-bottom: 1px solid #000;
  margin-bottom: 2%;
}
#ranking .RankMain .prof .name span{
  font-weight: bold;
  font-size: 3.0rem;
}
#ranking .RankMain .prof .size{
  line-height: 150%;
  text-align: left;
}

/* ランキング5位～20位 */
#ranking .RankSubWrap{
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 0 2% 5% 2%;
}
#ranking .RankSub{
  width: 49%;
  position: relative;
}
#ranking .RankSub img{
  width: 100%;
}
#ranking .RankSub .prof{
  position: absolute;
  top:5%;
  left: 35%;
}
#ranking .RankSub .prof .name{
  border-bottom: 1px solid #000;
  font-weight: bold;
  font-size: 2.0rem;
}
#ranking .RankSub .size{
  position: absolute;
  top:40%;
  left: 7%;
  line-height: 140%;
}
/* もうすぐベストテン */
#ranking .SubTitleImg{
  width: 100%;
  margin-bottom: 5%;
}


/**********************************************

インタビュー

**********************************************/
#interview{}

#interview .LadySelect{
  position: relative;
}
#interview .LadySelect .lady1{
  position:absolute;
  top: 55%;
  left: 4%;
}
#interview .LadySelect .lady2{
  position:absolute;
  top: 55%;
  right: 4%;
}
#interview .WrapButterfly{
/* 背景を固定する場合の記述
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: right bottom;*/
/*  background: url(../images/interview/bg_butterfly.png) left top, url('../images/interview/frame_top.png') 0 0 no-repeat;*/

/*background: url(../images/interview/bg_butterfly.png) left top;
background-size: contain;
padding: 2%;
*/
/* 横幅いっぱい・縦リピート */
background: url(../images/interview/bg_butterfly.png);
-moz-background-size:100% auto;
background-size:100% auto;
position: relative;


}
#interview .frame{
  background: url(../images/interview/frame_main.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  padding: 0 7%;
  margin: 2% 0;
  /*
  background-image:
    url(../images/interview/frame_top.png),
    url(../images/interview/frame_bottom.png);
    background-repeat:no-repeat,no-repeat;
    background-position:left 50px,left bottom;
    background-size: contain;*/
}
#interview .frame_top{
  position: absolute;
  top:0;
  left: 0;
}

#interview .frame_main{
  padding: 2%;
  background-image: url('../images/interview/frame_main.png');
  background-repeat: repeat-y;
  background-size: contain;
  /*
  margin: 1% 0;*/
}
#interview .frame_bottom{
  position: absolute;
  bottom:0;
  left: 0;
}

/* 女性紹介部分 */
#interview .FlexTop{
  display: -webkit-flex;
  display: flex;
  width: 107%;
  margin-top: -15%;
  margin-bottom: 5%;
}
#interview .FlexTop .prof{
  width: 45%;
}
#interview .FlexTop .photo{
  width: 62%;
}
#interview .FlexTop .prof .age img{
  width: 95%;
}
#interview .FlexTop .prof .date{
    font-size: 98%;
    border-top: 1px solid #000;
    padding:2% 0 5% 0;
    margin-top: 8%;
}
/* インタビュー */
#interview .ContentsBase{
  margin-bottom: 5%;
}
#interview .ContentsLast{
  margin-bottom: -10%;
}
#interview .question{
  font-weight:bold;
}
/* 写真を右下に置くパターン(テキストが画像上部に表示) */
#interview .BoxTypeA {
  overflow: hidden;/*float解除*/
  width: 108%;
}
#interview .BoxTypeA .space {
  float: right;/*画像の位置を右下にしたい場合はright*/
  height: 2.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeA .space_l {
  float: right;/*画像の位置を右下にしたい場合はright*/
  height: 5.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeA .photo {
  float: right;/*画像の位置を右下にしたい場合はright*/
  clear: both;/*.spaceのfloat解除*/
  margin: 2% 0 0 2%;/*画像の周りの余白*/
  width: 40%;
}
#interview .BoxTypeA .photo img{
  width: 110%;
}
#interview .BoxTypeA .answer{
  margin-bottom: 5%;
  width: 95%;
}

/* 写真を右横に置くパターン(画像下にテキストが回り込み) */
#interview .ContentsTypeB{
  width: 105%;
  margin-bottom: 5%;
}
#interview .BoxTypeB.photo{
  float: right;
  width: 50%;
}
#interview .BoxTypeB.photo img{
  width: 100%;
}
/* 写真を右下に置くパターン(テキストが画像上部に表示) */
#interview .BoxTypeC {
  overflow: hidden;/*float解除*/
  width: 108%;
 margin-left: -8%;
}
#interview .BoxTypeC .space {
  float: left;/*画像の位置を右下にしたい場合はright*/
  height: 2.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeC .photo {
  float: left;/*画像の位置を右下にしたい場合はright*/
  clear: both;/*.spaceのfloat解除*/
  margin: 2% 5% 0 0;/*画像の周りの余白*/
  width: 50%;
}
#interview .BoxTypeC .photo img{
  width: 110%;
}
#interview .BoxTypeC .answer{
  margin-bottom: 5%;
  width: 92%;
  margin-left: 8%;
}

/* 写真を左横に置くパターン(画像下にテキストが回り込み) */
#interview .ContentsTypeD{
  width: 105%;
  margin-bottom: 5%;
}
#interview .BoxTypeD.photo{
  float: left;
  width: 50%;
  margin: 0 2% 0 -10%;
}
#interview .BoxTypeD.photo img{
  width: 100%;
}
/**********************************************

プレゼント

**********************************************/
#present{
  background-color: #000;
}

**********************************************

PLUS宣伝ページ

**********************************************/
#plus section{
    margin-bottom: 12%;
}
#plus img{
  width: 100%;
}
#plus .bg01{
    background: url(../images/plus/bg_sec01.png) 0 90% no-repeat;
    background-size: contain;
}
#plus .bg02{
    background: url(../images/plus/bg_sec02.png) 90% 100% no-repeat;
    background-size: 90%;
    padding-bottom: 10%;
}
#plus .bg03{
    background: url(../images/plus/bg_sec03.png) 0 90% no-repeat;
    background-size: contain;
}
#plus .bg04{
  background: url(../images/plus/bg_sec04.png) 0 1% no-repeat;
    background-size: contain;
    padding-top: 10%;
}
#plus .bg05{
    background: url(../images/plus/bg_sec05.png) 0 -5% no-repeat;
    background-size: contain;
}
#plus p{
    width: 94%;
    margin: 0 auto;
    margin-bottom: 3%;
}
#plus .keyV a{
    display: block;
    width: 100%;
}
#plus img.mv{
    margin-bottom: 3%;
}
#plus img.logo{
  display: block;
    width: 98%;
    margin: 0 auto;
    margin-bottom: 10%;
}
#plus h2{
  padding-bottom: 5%;
    border-bottom: #333 1px solid;
    margin: 0 3% 5% 3%;
}
#plus .otherLink{
  width: 94%;
    margin: 0 auto;
    margin-bottom: 3%;
}
#plus p.copy{
  margin-bottom: 8%;
}
#plus p.caution{
    color: #e60012;
    text-align: center;
}
#plus p span.emphasis{
    font-weight: bold;
    font-size: 1.8rem;
}
#plus .bg04 ul{
  margin-bottom: 3%;
}
#plus .bg04 ul li{
  list-style-type: none;
}
#plus .bg05{
  margin-bottom: 0;
}

/**********************************************

熟女官能小説秘め事

**********************************************/
#novel {
  width:100%;
  background-color: #000000;
}
.tv_waku {
    background: url(../images/novel/img02.jpg) 0 0 no-repeat;
    background-size: cover;
    position: relative;
    padding-bottom: 60.25%;
}
.tv_waku iframe{
    display: block;
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    margin: 0 auto;
    height: 51%;
}
.novel_coment {
  /* height:0; */
  padding-top: 10%;
  background: url(../images/novel/img03.jpg) 0 0 no-repeat;
  background-size: 100%;
  }
.nobel_commentText {
     width: 80%;
     margin: 0 auto;
}
.nobel_commentText img {
    width:50%;
    margin:5% 20%;
}
/**********************************************

PCでみた時の画面

**********************************************/
.pcVer{
    background: #ffedfe;
}
.pcVer img{
    display: block;
    margin: 0 auto;
}
@charset "utf-8";
/* CSS Document */
/**********************************************

共通

**********************************************/
html {font-size: 62.5%;}
body{
    font-size: 1.4rem;
    line-height: 1.7;
    box-sizing: border-box;　/*パディングとボーダーを幅と高さに含める*/
    height: 100%;
    width: 100%;
    margin: 0 auto;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
/*画像遅延処理*/
.ready {
  opacity: 0;
}
.loaded {
  opacity: 1;
  -webkit-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  -moz-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  -o-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
  transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95) 10ms;
}

/* メインエリア */
.main{
  padding-bottom: 15%;
}
.wrap{
  width: 96%;
  margin: 0 auto;
}
.full{width: 100%;}
.clearfix {
    zoom: 1;
}
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}
.BgBlack{
  background-color: :#000;
}
/****************************************
マージン各種
*****************************************/

.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}

.mt2{margin-top:2%;}
.mt3{margin-top:3%;}
.mt4{margin-top:4%;}
.mt5{margin-top:5%;}

.mb2{margin-bottom:2%;}
.mb3{margin-bottom:3%;}
.mb4{margin-bottom:4%;}
.mb5{margin-bottom:5%;}
.mb10{margin-bottom:10%;}

.pt2{padding-top:2%;}
.pt3{padding-top:3%;}
.pt4{padding-top:4%;}
.pt5{padding-top:5%;}
/**********************************************

ヘッダー

**********************************************/
h1{
/*  background-color:#8fc31f;
  color:#FFF;
  padding:1% 3%;;*/
  font-size:90%;
}
header div{
  margin:0;
  padding:0;
}
header ul{
  display:flex;
}
header ul li{
  width:20%;
}
header .otherLink a{
  width: 50%;
    float: left;
}

/**********************************************

フッター

**********************************************/
footer{
  margin-bottom:5%;
}
/*
footer .txt{
  border-top:1px solid #603517;
  width:90%;
  margin:0 auto;
  text-align:center;
  color:#603517;
  font-size:120%;
  padding-top:2%;
}
footer .btn{
  width:90%;
  margin:5% auto 10% auto;
}
*/
/* メニュー
footer nav{
  margin-top:5%;
  margin-bottom:10%;
}
*/

/* コピーライト
footer #copyright{
    text-align: center;
    color: #855427;
}
*/


/* ----------------------------------------------
  追尾メニュー
---------------------------------------------- */
#footer_wrap{
  display:none;
  position:fixed;
  bottom:0;
  z-index:1000;
    margin: 0 auto;
    min-width: 320px;
    max-width: 640px;
  width:100%;
}
#footer_menu{
  display:flex;
  width:100%;
}
#footer_menu.FlexRight{
  justify-content: flex-end;
}
#footer_menu a{
  width:33%;
  margin-right:0.5%;
}
#footer_menu a:last-child{
  margin-right:0;
}
#footer_menu a img{
  width:100%;
}

/**********************************************

トップ

**********************************************/
.main#top{
  width: 100%;
  padding-bottom: 0;
}
#top{
  height: 0;
  padding-top: 158.4%;/* 表示画像の高さ ÷ 表示画像の幅 × 100 */
  background: url('../images/top/bg.jpg') 0 0 no-repeat;
  background-size: contain;
  position:relative;
}
#top img{
  width: 100%;
}
/* タイトル */
#top h1{
  position: absolute;
  top:4%;
  right: 2%;
  width: 60%;
}
/* エロモード全開奥様 */
#top .interview2{
  position: absolute;
  width: 50%;
  top:20%;
  left: 2%;
}
/* 変態奥様 */
#top .interview1{
  position: absolute;
  width: 50%;
  top:33%;
  left: 2%;
}
/* 官能小説 */
#top .novel{
  position: absolute;
  width: 25%;
  top:47%;
  left: 2%;
}
/* ヘブン総選挙 */
#top .cityheaven{
  position: absolute;
  width: 45%;
  bottom:5%;
  left: 0;
}
/* スタッフ紹介 */
#top .staff{
  position: absolute;
  width: 25%;
  top:23%;
  right: 2%;
}
/* ランキング */
#top .ranking{
  position: absolute;
  width: 25%;
  top:38%;
  right: 25%;
}
/* カバーガール */
#top .covergall{
  position: absolute;
  width: 23%;
  top:61%;
  right: 6%;
}
/* プレゼント企画 */
#top .present{
  position: absolute;
  width: 45%;
  bottom:15%;
  right: 2%;
}
/* 熟女家プラス難波店 */
#top .plus{
  position: absolute;
  width: 50%;
  bottom:6%;
  right: 2%;
}

/**********************************************

スタッフ紹介

**********************************************/
/*staff #move1{position:absolute;right:-600px;}*/

/* スタッフ画像(移動表示) */
#staff .BgBeige{
  background-color: #603813;
  font-size: 1.0rem;
}
#staff .StaffWrap{
  background-image: url(../images/staff/bg_red.png);
  background-repeat: repeat;
  padding: 5% 2%;
}
#staff .StaffMove{
  position: relative;
}
#staff .StaffInterview{
  background-image: url(../images/staff/bg_yellow.png);
  background-repeat: repeat;
  position: relative;
  padding-bottom: 5%;
}
/* 動く素材 */
#staff #move1_1{
  position:absolute;left:-600px;
  z-index: 10;
  height: 250px;
}
#staff #move1_2{
  position:absolute;
  right:-600px;
  z-index: 10;
  height: 200px;
}
#staff #move2_1{
  position:absolute;right:-600px;
  z-index: 10;
  height: 200px;
}
#staff #move2_2{
  position:absolute;left:-600px;
  z-index: 10;
  height: 200px;
  top:0;
}
#staff .StaffImage{
  height:200px;
  position:relative;
}
#staff .second{
  padding: 8% 0;
}
/* 斜線 */
#staff .diagonal{
  position: absolute;
/*  top: 50%;*/
  top: 215px;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  z-index: 5;
  width: 100%;
}
#staff .diagonal img{
  width: 100%;
}
/**/
#staff .mark{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  -webkit- transform: translateY(-50%) translateX(-50%);
  width: 70%;
  z-index: 0;
}
#staff .mark img{
  width: 100%;
}

#staff .samurai{
  position: absolute;
  top: 0;
  right: 0;
}
#staff .comment{
  padding: 5% 0;
}
#staff .subtitle{
  height: 40px;
}
#staff .herf{
  width: 50%;
}
#staff .flex{
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#staff .flex div:first-child{
  width: 30%;
  z-index: 10;
}
#staff .box{
  margin-bottom: 5%;
}
#staff .box h3{
  margin-bottom: 1%;
}
/* セリフ部分 */
#staff .box .balloon1-left {
  position: relative;
  display: inline-block;
  padding: 2%;
  width: 71%;
  margin-left: -5px;
  background: #fff;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border: 5px solid #000;
  z-index: 0;
}
#staff .box .balloon1-left p {
    margin: 0;
    padding: 0;
}
#staff .box .balloon1-left .hukidashi{
  position: absolute;
  top: 20px;
  left: -39px;
}

#staff .box .microphone{
  height: 50px;
}
#staff .question{
  width: 70%;
}
#staff .BtnJob{
  padding-bottom: 10%;
  width: 100%;
}
#staff .box .flex span{
  color:#FF0000 ;
}

/* フラッシュバック熟女家 */
#staff .FlashWrap{
  background-image: url(../images/staff/column_back_middle.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  padding: 2% 0;
  /*
  background-image:url(../images/staff/column_back_top.png),
           url(../images/staff/column_back_middle.png),
           url(../images/staff/column_back_bottom.png);
  background-position:center top,
            center 50px,
            center bottom;

            -moz-background-size:100% auto;
            background-size:100% auto;
*/
}
#staff .FlashWrap .contents{
  margin: 2%;
  padding: 2%;
  border: 2px solid #603813;
}
#staff .FlashWrap .contents p{
  margin-bottom: 3%;
}


/**********************************************

ランキング

**********************************************/
#ranking{
  /* 横幅いっぱい・縦リピート */
  background: url(../images/ranking/bg_ranking.jpg);
  -moz-background-size:100% auto;
  background-size:100% auto;
}
#ranking .BgStar1{
  background-image: url(../images/ranking/star1.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  position: relative;
}
#ranking .BgStar2{
  background-image: url(../images/ranking/star2.png);
  background-repeat: repeat;
  position: relative;
}
#ranking .test{
  position: absolute;
  top: 0;
  z-index: 0;
}

#ranking .info{
  background: url(../images/ranking/waku.png) no-repeat;
  background-size: 100% auto;
  padding: 10% 8%;
  color: #fff;
  margin-bottom: 5%;
  margin-top: 3%;
  color: #fff;
}

#ranking .RankMain{
  position: relative;
  margin-bottom: 5%;
}
#ranking .RankMain img{
  width: 96%;
  padding: 0 2%;
}
#ranking .RankMain .prof{
  position: absolute;
  top:38%;
  left: 6%;
}
#ranking .RankMain .prof .name{
  border-bottom: 1px solid #000;
  margin-bottom: 2%;
}
#ranking .RankMain .prof .name span{
  font-weight: bold;
  font-size: 3.0rem;
}
#ranking .RankMain .prof .size{
  line-height: 150%;
  text-align: left;
}

/* ランキング5位～20位 */
#ranking .RankSubWrap{
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  margin: 0 2% 5% 2%;
}
#ranking .RankSub{
  width: 49%;
  position: relative;
}
#ranking .RankSub img{
  width: 100%;
}
#ranking .RankSub .prof{
  position: absolute;
  top:5%;
  left: 35%;
}
#ranking .RankSub .prof .name{
  border-bottom: 1px solid #000;
  font-weight: bold;
  font-size: 2.0rem;
}
#ranking .RankSub .size{
  position: absolute;
  top:40%;
  left: 7%;
  line-height: 140%;
}
/* もうすぐベストテン */
#ranking .SubTitleImg{
  width: 100%;
  margin-bottom: 5%;
}


/**********************************************

インタビュー

**********************************************/
#interview{}

#interview .LadySelect{
  position: relative;
}
#interview .LadySelect .lady1{
  position:absolute;
  top: 55%;
  left: 4%;
}
#interview .LadySelect .lady2{
  position:absolute;
  top: 55%;
  right: 4%;
}
#interview .WrapButterfly{
/* 背景を固定する場合の記述
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: right bottom;*/
/*  background: url(../images/interview/bg_butterfly.png) left top, url('../images/interview/frame_top.png') 0 0 no-repeat;*/

/*background: url(../images/interview/bg_butterfly.png) left top;
background-size: contain;
padding: 2%;
*/
/* 横幅いっぱい・縦リピート */
background: url(../images/interview/bg_butterfly.png);
-moz-background-size:100% auto;
background-size:100% auto;
position: relative;


}
#interview .frame{
  background: url(../images/interview/frame_main.png);
  -moz-background-size:100% auto;
  background-size:100% auto;
  padding: 0 7%;
  margin: 2% 0;
  /*
  background-image:
    url(../images/interview/frame_top.png),
    url(../images/interview/frame_bottom.png);
    background-repeat:no-repeat,no-repeat;
    background-position:left 50px,left bottom;
    background-size: contain;*/
}
#interview .frame_top{
  position: absolute;
  top:0;
  left: 0;
}

#interview .frame_main{
  padding: 2%;
  background-image: url('../images/interview/frame_main.png');
  background-repeat: repeat-y;
  background-size: contain;
  /*
  margin: 1% 0;*/
}
#interview .frame_bottom{
  position: absolute;
  bottom:0;
  left: 0;
}

/* 女性紹介部分 */
#interview .FlexTop{
  display: -webkit-flex;
  display: flex;
  width: 107%;
  margin-top: -15%;
  margin-bottom: 5%;
}
#interview .FlexTop .prof{
  width: 45%;
}
#interview .FlexTop .photo{
  width: 62%;
}
#interview .FlexTop .prof .age img{
  width: 95%;
}
#interview .FlexTop .prof .date{
    font-size: 98%;
    border-top: 1px solid #000;
    padding:2% 0 5% 0;
    margin-top: 8%;
}
/* インタビュー */
#interview .ContentsBase{
  margin-bottom: 5%;
}
#interview .ContentsLast{
  margin-bottom: -10%;
}
#interview .question{
  font-weight:bold;
}
/* 写真を右下に置くパターン(テキストが画像上部に表示) */
#interview .BoxTypeA {
  overflow: hidden;/*float解除*/
  width: 108%;
}
#interview .BoxTypeA .space {
  float: right;/*画像の位置を右下にしたい場合はright*/
  height: 2.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeA .space_l {
  float: right;/*画像の位置を右下にしたい場合はright*/
  height: 5.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeA .photo {
  float: right;/*画像の位置を右下にしたい場合はright*/
  clear: both;/*.spaceのfloat解除*/
  margin: 2% 0 0 2%;/*画像の周りの余白*/
  width: 40%;
}
#interview .BoxTypeA .photo img{
  width: 110%;
}
#interview .BoxTypeA .answer{
  margin-bottom: 5%;
  width: 95%;
}

/* 写真を右横に置くパターン(画像下にテキストが回り込み) */
#interview .ContentsTypeB{
  width: 105%;
  margin-bottom: 5%;
}
#interview .BoxTypeB.photo{
  float: right;
  width: 50%;
}
#interview .BoxTypeB.photo img{
  width: 100%;
}
/* 写真を右下に置くパターン(テキストが画像上部に表示) */
#interview .BoxTypeC {
  overflow: hidden;/*float解除*/
  width: 108%;
 margin-left: -8%;
}
#interview .BoxTypeC .space {
  float: left;/*画像の位置を右下にしたい場合はright*/
  height: 2.3em/*画像上の余白の高さ*/
}
#interview .BoxTypeC .photo {
  float: left;/*画像の位置を右下にしたい場合はright*/
  clear: both;/*.spaceのfloat解除*/
  margin: 2% 5% 0 0;/*画像の周りの余白*/
  width: 50%;
}
#interview .BoxTypeC .photo img{
  width: 110%;
}
#interview .BoxTypeC .answer{
  margin-bottom: 5%;
  width: 92%;
  margin-left: 8%;
}

/* 写真を左横に置くパターン(画像下にテキストが回り込み) */
#interview .ContentsTypeD{
  width: 105%;
  margin-bottom: 5%;
}
#interview .BoxTypeD.photo{
  float: left;
  width: 50%;
  margin: 0 2% 0 -10%;
}
#interview .BoxTypeD.photo img{
  width: 100%;
}
/**********************************************

プレゼント

**********************************************/
#present{
  background-color: #000;
}

**********************************************

PLUS宣伝ページ

**********************************************/
#plus section{
    margin-bottom: 12%;
}
#plus img{
  width: 100%;
}
#plus .bg01{
    background: url(../images/plus/bg_sec01.png) 0 90% no-repeat;
    background-size: contain;
}
#plus .bg02{
    background: url(../images/plus/bg_sec02.png) 90% 100% no-repeat;
    background-size: 90%;
    padding-bottom: 10%;
}
#plus .bg03{
    background: url(../images/plus/bg_sec03.png) 0 90% no-repeat;
    background-size: contain;
}
#plus .bg04{
  background: url(../images/plus/bg_sec04.png) 0 1% no-repeat;
    background-size: contain;
    padding-top: 10%;
}
#plus .bg05{
    background: url(../images/plus/bg_sec05.png) 0 -5% no-repeat;
    background-size: contain;
}
#plus p{
    width: 94%;
    margin: 0 auto;
    margin-bottom: 3%;
}
#plus .keyV a{
    display: block;
    width: 100%;
}
#plus img.mv{
    margin-bottom: 3%;
}
#plus img.logo{
  display: block;
    width: 98%;
    margin: 0 auto;
    margin-bottom: 10%;
}
#plus h2{
  padding-bottom: 5%;
    border-bottom: #333 1px solid;
    margin: 0 3% 5% 3%;
}
#plus .otherLink{
  width: 94%;
    margin: 0 auto;
    margin-bottom: 3%;
}
#plus p.copy{
  margin-bottom: 8%;
}
#plus p.caution{
    color: #e60012;
    text-align: center;
}
#plus p span.emphasis{
    font-weight: bold;
    font-size: 1.8rem;
}
#plus .bg04 ul{
  margin-bottom: 3%;
}
#plus .bg04 ul li{
  list-style-type: none;
}
#plus .bg05{
  margin-bottom: 0;
}


/**********************************************

PCでみた時の画面

**********************************************/
.pcVer{
    background: #ffedfe;
}
.pcVer img{
    display: block;
    margin: 0 auto;
}