@charset "utf-8";

/* ****************************************************************************
- MEMO -
--------Overall Setting/共通設定--------
________Font Setting/フォント設定________

--------Overall Layout/共通レイアウト--------
________wrapper________
________area_header________
________article_mainVisual________
________box__row________
________area_main________
________area_side________
________area_footer________

--------Overall Parts/共通パーツ--------
________wrapper________
________area_header________
________article_mainVisual________
________area_main________
________area_side________
________area_footer________

@media screen and (min-width: 769px) { } 【タブレット縦以上】※breakpoint
*****************************************************************************/
/*--------Overall Setting--------*/
/*________Font Setting________*/
html {
    /*基本フォントサイズ*/
    /* font-size: 62.5%; 10px*/
    font-size: 100%;
    /*16px*/
}

body {
    font-family: 'Noto Sans JP', 'Roboto', 'Open Sans', sans-serif;
    font-weight: 300;
    color: #212529;
}

a:hover {
    opacity: 0.8; 
    
}

a:hover img {
    opacity: 1; 
}





/*--------Overall Layout--------*/

/*________wrapper________*/

/*________area_header________*/
#area_header {
    display: block;
    position: fixed;
    top: 0;
    z-index: 99999;

    width: 100%;
    height: 60px;
    border-bottom: 3px double grey;

    border-bottom: solid var(--c_grey) 2px;
    background: var(--c_blk);

    /*opacity: 0;*/
}

/* #area_header .header_box {
    -ms-flex-preferred-size: 2;
    flex-basis: 2;
} */

/*________article_mainVisual________*/

#article_mainVisual--in {
    position: relative;
}


/*________box__row________*/
.box_row {
    width: 100%;
}


/*________area_main________*/
#area_main {
    width: 100%;
}

#area_main--in {
    width: 100%;
}

/*________section_main________*/
.section_main {
    display: block;
    width: 100%;
    padding-top: 0.75em;
    padding-bottom: 0.75em;
}
/*________section_system________*/
table.feesmart {
    margin: 5px;
    border-collapse: collapse;
    border-style: solid;
    border-width: 1px;
    width: 98%;
    background: #fff;
    font-size: 14px;

}
td.feetitle {
    text-align: center;
    font-weight: bold;
}
table.feesmart td {
    border-style: solid;
    border-width: 1px;
    color: #000;
    padding: 10px;
    border-color: #3b98d2;
    word-break: break-all;
   line-height: 18px;
}
td.feename {
    background: #f5f5f5;
    text-align: center;
    color: #000;
    padding: 5px;
}

@media only screen and (min-width : 769px) {
    .section_main {
        padding-top: 0.625em;
        padding-bottom: 0.625em;
    }
}

/*背景色設定*/

.section_main.bg_white_trans--sp,
#article_mainVisual.bg_white_trans--sp,
#article_mainSlide.bg_white_trans--sp {
    background: rgb(255, 255, 255, 0.8);
}

@media only screen and (min-width : 769px) {
    .section_main.bg_white_trans--sp,
    #article_mainVisual.bg_white_trans--sp,
    #article_mainSlide.bg_white_trans--sp {
        background: unset;
    }
    footer.bg_white_trans--pc,
    .section_main.bg_white_trans--pc,
    #article_mainVisual.bg_white_trans--pc,
    #article_mainSlide.bg_white_trans--pc {
        background: rgb(255, 255, 255, 0.8);
    }
}



/*________area_side________*/

/*________area_footer________*/

#area_footer {
    width: 100%;
    z-index: 0;
    position: relative;
}








/*--------Overall Parts--------*/

/*________wrapper________*/

#wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
}

/*________area_header________*/
/*Home Logo*/
#area_header #logo_home {
    display: block;
    width: 100%;
}

#area_header #logo_home #logo_home--link {
    display: block;
    margin: 0 auto;
    /* max-width: 124px;
    line-height: 60px; */
    width: 124px;
    padding: 6.3px 0;
}

@media only screen and (min-width : 769px) {
    .top_page #area_header #logo_home {
        display: none;
    }
}

/*________article_mainVisual________*/
/*________area_main________*/

/*_________section___________*/

.box--breadcrumb .txt,
.box--breadcrumb .fas {
    margin-right: 0.25em;
}

/*________section_main________*/
/*共通リンクボタン*/
.section_main .btnCom--link {
    position: relative;
    display: block;
    margin-top: 0.25em;
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    font-size: var(--fs_l);
    text-align: center;
    line-height: 2.25em;
    background: rgb(81, 17, 17);
    color: #fff;
    border-radius: 0.5em;
    font-weight: bold;
}

.section_main .btnCom--link:hover {
    top: 2px;
}

.section--bangos .btnCom--link {
    background: #511111;
    color: #fff;
}

.section--rank .btnCom--link {
    margin-top: 0.5em;
    background: #511111;
    color: #fff;
}

.section--recom .btnCom--link {
    margin-top: 0.5em;
    background: #511111;
    color: #fff;
}

.section--diary .btnCom--link {
    margin-top: 0.5em;
    background: #511111;
    color: #fff;
}

.section--newface .btnCom--link {
    margin-top: 0.5em;
    background: #511111;
    color: #fff;
}




/*-------女性リストデザイン-------*/
/*写真エリア*/
/*切り抜き*/
.box_girl.box_girl_clipCircle .box_girl--photo,
.box_girl.box_girl_clipCircle .box_girl--inf {
    position: relative !important;
}

.box_girl.box_girl_clipCircle .box_girl--photo {
    position: relative;
    width: 100%;
    margin-bottom: 0.25em;
}

.box_girl.box_girl_clipCircle .box_girl--photo:before {
    content: "";
    display: block;
    padding-top: 100%;
    /* 高さを幅の75%に固定 */
}

.box_girl.box_girl_clipCircle .box_girl--photo .box_img {
    position: absolute !important;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-radius: 50%;
}

.box_girl.box_girl_clipCircle .box_girl--photo .box_img:hover {
    -webkit-animation-name: circleSquare_Ani;
    animation-name: circleSquare_Ani;
    animation-duration: 0.2s;
    animation-delay: 0s;
    animation-timing-function: ease-out;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

@-webkit-keyframes circleSquare_Ani {
    0% {
        border-radius: 50%;
    }

    50% {}

    100% {
        border-radius: unset;
    }
}

@keyframes circleSquare_Ani {
    0% {
        border-radius: 50%;
    }

    50% {}

    100% {
        border-radius: unset;
    }
}




.box_girl.box_girl_clipCircle .box_girl--photo .box_img img {
    object-fit: cover;
    object-position: top center;
}

/*テキストエリア*/
/*テキストエリア背景画像*/
/* .box_girl--inf.bg_line_00 {
    background: none;
    background-color: rgb(0, 0, 0, 0) !important;
    background: url("../image/bg_list-girl/bg_line_00.png");
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-position: top center;
    background-size: cover;
    padding: 5.8em 0.5em 0.5em 0.5em !important;
}

@media only screen and (min-width : 769px) {
    .box_girl--inf.bg_line_00 {
        padding: 4em 0.5em 0.5em 0.5em !important;
    }
}


.box_girl--inf.bg_line_00 .box_txt {
    min-height: 3em;
    background: rgba(255, 255, 255, 0.4);
}



.box_girl--inf.bg_line_00 .txt {
    color: rgb(49, 49, 49) !important;
} */

/*________area_side________*/
/*________area_footer________*/


/*________page_nav_link________*/
.li_nav.disabled .nav--link {
    color: #6c757d!important;
    pointer-events: none;
    cursor: auto;
    background-color: #fff!important;
}

/*___________バンゴーズ____________*/
.box_page_banos .img_bangos{
    padding:5px;
    width: 80%;
    margin: 0 auto;
}
@media only screen and (min-width : 769px) {
    .box_page_banos .img_bangos {
        width: 30%;
    }
}
/*___________ポイント____________*/
.box_page_point {
    padding: 5px;
    background-color: rgb(255 255 255 / 65%);
}
@media only screen and (min-width : 769px) {
    .box_page_point {
        padding: 30px;
    }
}

/*___________背景画像全体制御____________*/
/*トップページ*/
#article_mainVisual .box_mainVisual .box_mainVisual--in::after {
    content: '';
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
/*各ページ*/
#article_bgVisual--in .box_img picture::after {
    content: '';
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}