@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
img { width: 100%; height: auto; vertical-align: middle; }

:root { --pc-tab-width: 350px; --base-color-blue: #5675F8; }

body { margin: 0; font-size: 11px; font-family: 'Lato', 'Noto Sans JP' !important; line-height: 1.5; padding-bottom: 55px; color: #333; }

ul { list-style: none; margin: 0; padding: 0; }

p, form, h2, h3 { margin: 0; }

a { text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }

select { -webkit-appearance: none; -moz-appearance: none; appearance: none; font-family: Lato; border: 1px solid; }

button { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; }

main { margin-top: 56px; }

header.common, footer.common, .side-menu-wrap, .common-dialog-wrap { font-family: 'Noto Sans JP'; }

header.common { border-bottom: solid 1px #DDD; position: fixed; top: 0; width: 100%; z-index: 13; height: 55px; box-sizing: content-box; }

header.common ul { display: flex; align-items: center; height: 100%; justify-content: space-between; padding-left: 2vw; line-height: 1.5; height: 55px; background: #fff; }

header.common li { width: 100%; }

header.common .logo { margin-right: 20px; }

header.common a { display: flex; height: 100%; text-decoration: none; }

header.common a > img, footer > .common a > img { width: 25px; box-sizing: content-box; -webkit-box-sizing: content-box; }

header.common .logo a > img { width: 60px; }

header.common .log-black-img, footer > .common .log-black-img { display: none; }

header.common.black .menu-item a, footer .common.black a { background-color: transparent; }

header.common a span { font-size: 10px; font-weight: 500; }

header.common .badge-wrap, footer > .common .badge-wrap { position: relative; width: 25px; }

header.common a span.badge { position: absolute; top: 0; right: -5px; background: red; width: 15px; line-height: 15px; color: #fff; text-align: center; border-radius: 50%; }

footer > .common a span.badge { position: absolute; background: red; color: #fff; font-size: 12px; font-family: Lato; border-radius: 10px; right: -20px; top: -25px; padding: 5px; min-width: 20px; line-height: 10px; text-align: center; }

header.common .menu-item a { flex-direction: column; align-items: center; justify-content: center; color: #666; background-color: #fff; aspect-ratio: 1 / 1; width: 48px; border-radius: 1000px; }

footer > .common { position: fixed; bottom: 0; width: 100%; border-top: 1px solid #ddd; z-index: 12; background: #fff; padding-bottom: env(safe-area-inset-bottom); min-height: 55px; }

footer > .common ul { display: flex; height: 55px; align-items: center; margin: 0 2vw; justify-content: space-between; }

footer > .common li { width: 100%; }

footer > .common a { color: #666; font-size: 10px; display: flex; flex-direction: column; width: 100%; height: 100%; justify-content: center; align-items: center; text-decoration: none; background-color: #fff; aspect-ratio: 1 / 1; width: 48px; border-radius: 1000px; white-space: nowrap; }

header.black, footer > .black { border: transparent !important; }

header.black ul, footer > .black { background: rgba(0, 0, 0, 0.5) !important; border-bottom: none; }

header.black ul { height: 56px !important; }

header.black a span, footer > .black span { color: #fff !important; }

header.black .log-img, footer > .black .log-img { display: none; }

header.black .log-black-img, footer > .black .log-black-img { display: block !important; }

header.black .side-menu-btn a::before { background: url("/assets/vivo_0218/img/lp/lp25/icon_menu_white_211020-2.svg"); background-size: contain; }

.side-menu-btn a::before { content: ''; background: url("/assets/vivo_0218/img/lp/lp25/icon_menu_brown.svg"); width: 25px; height: 25px; background-size: contain; display: inline-block; }

.common-header { border-bottom: 1px solid #ddd; margin-bottom: 10px; }

.common-header p { line-height: 39px; margin: 0 2vw; margin-bottom: 0; font-weight: 500; font-size: 14px; display: flex; align-items: center; color: #333; }

.common-header p::before { content: ''; width: 20px; height: 20px; background-size: contain; display: inline-block; margin-right: 5px; }

.common-header p.bell::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_bell_blk.svg"); }

.common-header p.good::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_good_blk.svg"); }

.common-header p.caution::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_caution_outline.svg"); }

.common-header p.search::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_search_bk.svg"); }

.common-header p.history::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_history_bk.svg"); }

.common-header p.want_talk::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_request_bk.svg"); }

.common-header p.mylist::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_mylist_bk.svg"); }

.common-header p.kyohi::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_kyohi_bk.svg"); }

.common-header p.info::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_infomation_bk.svg"); }

.common-header p.site::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_site_bk.svg"); }

.common-header p.app_dl::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_app_dl_bk.svg"); }

.common-header p.faq::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_faq_bk.svg"); }

.common-header p.livestream-list::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_red.svg"); }

.common-header p.live-viewing-now::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_black.svg"); }

.common-header p.pay-history::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_point_black.svg"); }

.common-header p.mail::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_mail_black.svg"); }

.common-content-wrap { margin: 2vw; }

.overlay { height: 100%; width: 100%; opacity: 0.4; background-color: #fff; z-index: 1; }

.load { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); z-index: 2; }

.side-menu-btn.open a::before { background: url("/assets/vivo_0218/img/lp/lp25/icon_menu_close_brown.svg"); background-size: contain; }

header.common .side-menu-btn.open a { padding-bottom: 1px; color: #666; background: #fff; height: 100%; box-sizing: border-box; }

.side-menu-wrap { display: none; color: #fff; height: 100%; width: 100%; position: fixed; z-index: 1; overflow-y: scroll; font-size: 13px; margin-top: 56px; top: 0; }

.side-menu-wrap p { margin: 0 !important; }

.side-menu-wrap a { color: #333; }

.side-menu-wrap.open { display: block; }

.side-menu-wrap.app_fixed_style { margin-top: 130px !important; }

.side-menu-wrap .point-wrap { height: 60px; background: #fff; display: flex; align-items: center; padding: 0 20px 1px; border-bottom: 1px solid; color: #333; }

.side-menu-wrap img { width: 24px; padding: 6px; border-radius: 50%; margin-right: 7px; box-sizing: content-box; -webkit-box-sizing: content-box; }

.side-menu-wrap img.point { background: #FF6E6E; }

.side-menu-wrap img.mymenu, .side-menu-wrap img.setting { background: #778FEF; }

.side-menu-wrap img.mymenu + span, .side-menu-wrap img.setting + span { color: #778FEF; }

.side-menu-wrap img.girls { background: #FC7CA4; }

.side-menu-wrap img.girls + span { color: #FC7CA4; }

.side-menu-wrap img.history { background: #9C6ED9; }

.side-menu-wrap img.history + span { color: #9C6ED9; }

.side-menu-wrap img.movie { background: #FF855F; }

.side-menu-wrap img.movie + span { color: #FF855F; }

.side-menu-wrap img.photo { background: #F4BC25; }

.side-menu-wrap img.photo + span { color: #F4BC25; }

.side-menu-wrap img.blog { background: #96D559; }

.side-menu-wrap img.blog + span { color: #96D559; }

.side-menu-wrap .point-wrap span:nth-of-type(2) { color: #F76451; font-size: 16px; font-weight: bold; margin-bottom: 2px; }

.side-menu-wrap .buy { margin-left: auto; color: #F76451; border: solid 1px; width: 80px; line-height: 30px; text-align: center; border-radius: 5vw; font-weight: 500; letter-spacing: 4px; text-indent: 4px; position: relative; }

.menu-list-wrap { padding: 20px; padding-bottom: 150px; background: #fff; }

.app_fixed_style .menu-list-wrap { padding-bottom: 200px !important; }

.menu-list-wrap p { display: flex; align-items: center; border-bottom: 1px solid #666; padding-bottom: 5px; font-size: 14px; font-weight: bold; }

.menu-list-wrap ul { margin: 5px 0 30px; }

.menu-list-item { height: 45px; display: flex; align-items: center; }

.menu-list-item span.ev, .menu-list-wrap p span.ev { font-size: 12px; background: linear-gradient(90deg, #FFE200, #FFC250); color: #25272C; font-weight: 500; padding: 4px 12px; border-radius: 7px; }

.menu-list-item span.ev { margin-left: auto; }

.menu-list-wrap p span.ev { margin-left: 15px; }

.point-up-now-wrap { position: absolute; width: 110px; right: -10px; line-height: 1.7; letter-spacing: 0; color: #25272C; background: linear-gradient(90deg, #FFE200, #FFC250); border-radius: 7px; bottom: -60px; }

.side-menu-wrap .arrow_box { position: relative; padding: 4px 0; line-height: 1.5; }

.side-menu-wrap .arrow_box:after { bottom: 95%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-bottom-color: #FED330; border-width: 8px; margin-left: -8px; }

.side-menu-wrap img.livestream { background: #67E0CE; }

.side-menu-wrap img.livestream + span { color: #67E0CE; }

.menu-list-item .sidemenu-badge-wrap { display: flex; flex-direction: column; }

.menu-list-item .sidemenu-badge-wrap .sidemenu-badge { font-size: 12px; color: #aaa; }

.menu-list-item::before, .menu-list-item::after { content: ''; display: inline-block; background-repeat: no-repeat; background-position: center; background-size: contain; }

.menu-list-item::before { margin: 0 12px 0 6px; width: 24px; height: 24px; }

.menu-list-item.app-dl::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_app_dl_gray.svg"); }

.menu-list-item.app-recovery::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_chain_broken.svg"); }

.menu-list-item.mypage::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_mypage_gray.svg"); }

.menu-list-item.tel::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_tel_gray.svg"); }

.menu-list-item.bell::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_bell_gray.svg"); }

.menu-list-item.info::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_infomation_gray.svg"); }

.menu-list-item.vv-site::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_vivo_site_gray.svg"); }

.menu-list-item.mess::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_message_gray.svg"); }

.menu-list-item.fav::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_favorite_gray.svg"); }

.menu-list-item.heart::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_heart_gray.svg"); }

.menu-list-item.foot::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_footprint_gray.svg"); }

.menu-list-item.pickup::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_pickup_gray.svg"); }

.menu-list-item.search::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_search_gray.svg"); }

.menu-list-item.history::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_history_gray.svg"); }

.menu-list-item.request::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_request_gray.svg"); }

.menu-list-item.pay::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_movie_gray.svg"); }

.menu-list-item.free::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_movie_gray.svg"); }

.menu-list-item.pay-photo::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_adult_gray.svg"); }

.menu-list-item.mylist::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_mylist_gray.svg"); }

.menu-list-item.ranking::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_ranking_gray.svg"); }

.menu-list-item.dialy::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_blog_gray.svg"); }

.menu-list-item.kyohi::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_kyohi_gray.svg"); }

.menu-list-item.kyohi::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_kyohi_gray.svg"); }

.menu-list-item.faq::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_faq_gray.svg"); }

.menu-list-item.site::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_site_gray.svg"); }

.menu-list-item.ryoukin::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_point_gray.svg"); }

.menu-list-item.about::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_about_gray.svg"); }

.menu-list-item.live-list::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_gray.svg"); }

.menu-list-item.good::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_good_blk.svg"); }

.menu-list-item.switch::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_design_change_gray.svg"); }

.menu-list-item::after { margin-left: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_gray.svg"); width: 15px; height: 15px; }

.menu-list-wrap .logout { width: 196px; display: flex; align-items: center; margin: auto; line-height: 44px; border-radius: 25px; background: #fff; color: #333; font-weight: 500; border: 1px solid; }

.menu-list-wrap .logout::before { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_logout_gray.svg"); width: 24px; height: 24px; margin: 0 12px 0 37px; }

@media screen and (width: 320px) { .menu-list-item.tel span.ev { padding: 2px 6px; font-size: 11px; } }
.common-dialog-wrap img { box-sizing: content-box; -webkit-box-sizing: content-box; }

.common-dialog-wrap { display: none; position: fixed; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 14; }

.nopoint_dialog .dialog { top: calc(50% - 176px); }

.common-dialog-wrap.open { display: block; }

.dialog { background: #fff; width: 90%; margin: auto; position: relative; top: 30%; padding: 30px 0 10px; border-radius: 10px; font-size: 15px; color: #333; }

.dialog p { text-align: center; margin-bottom: 40px; }

.dialog a { display: block; width: 215px; line-height: 48px; text-align: center; border-radius: 24px; margin: 20px auto; }

.dialog a.blue { background: var(--base-color-blue); color: #fff; }

.dialog a.red { background: #f55656; color: #fff; }

.dialog a.cancel { border: solid 1px #707070; color: #333; }

.dialog-close-btn { position: absolute; width: 20px; border: 2px solid #333; border-radius: 50%; padding: 3px; top: -10px; right: -10px; background: #fff; }

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

共通アイテム

************************************************************/
.btn-common__back { width: 150px; height: 40px; display: flex; align-items: center; justify-content: center; margin: 30px auto; font-size: 13px; font-weight: 500; color: #333; border: 1px solid #333; border-radius: 50px; }

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

PC / タブレット

************************************************************/
body.pc-tab { width: var(--pc-tab-width); margin: 0 auto; }

.pc-tab header, .pc-tab footer .common, .pc-tab .side-menu-wrap, .pc-tab .common-dialog-wrap { width: var(--pc-tab-width); }

.pc-tab .common-content-wrap { margin: 10px; }

.pc-tab header.common ul, .pc-tab footer .common ul { margin: 0 10px; }

.pc-tab .common-header p { margin: 0 10px; }

.pc-tab .menu-list-item.tel span.ev { padding: 2px 6px; font-size: 11px; }

#content-wrapper.movielist-box { margin-top: 113px; }

body .movie-header--wrap { top: 0; margin-top: 55px; position: fixed; z-index: 2; }

body .message-form-fixed .reload { user-select: none; }

.pc-tab header { right: auto; }

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

既存css調整

************************************************************/
body .name-speace-2, body .message-menu, body .message-headline, body .message-headline.fixed { z-index: 0; }

body #thumb-grid .thumb-rookie-mark2 > img, body #thumb-grid .thumb-rookie-mark1 > img, #content-wrapper .switch-menu, body .mail_dis_date, body .mail_dis_time { z-index: 1; }

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

共通見出し

************************************************************/
.base-header { line-height: 40px; border-bottom: solid 1px #EBEBEB; background: #FFF; color: #333; display: flex; align-items: center; }

.base-header span { margin-left: 5px; font-size: 13px; font-weight: 500; }

.base-header::before { content: ''; display: inline-block; width: 24px; height: 24px; background-position: center; background-repeat: no-repeat; background-size: contain; margin-left: 2.5vw; }

.base-header.point::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_side_point_bk.svg"); }

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

共通お気に入りリスト

************************************************************/
.post-list-favorite { display: none; position: fixed; box-sizing: border-box; height: 80px; width: 100%; top: 56px; padding: 10px 0; background-color: #fff; z-index: 999; border-bottom: 1px solid #DDDDDD; }

.post-list-favorite-ul { display: flex; align-items: center; position: relative; width: 100%; height: 60px; top: 0; left: 0; list-style-type: none; overflow-x: scroll; overflow-y: hidden; }

.post-list-favorite-ul li { display: block; width: 60px; height: 60px; margin: 0 10px; flex: 0; -webkit-transform: translate3d(0, 0, 0); }

.post-list-favorite-ul li.fav-title-mark { display: flex; flex-direction: column; align-items: center; color: #666666; margin-right: 0; }

.post-list-favorite-ul li a { width: 100%; display: flex; flex-direction: column; align-items: center; text-decoration: none; color: #666666; }

.post-list-favorite-ul li a .thumbnail { position: relative; width: 40px; height: 40px; border-radius: 20px; background-size: contain; background-position: center; }

.post-list-favorite-ul li a .thumbnail.badge:before { display: block; content: ""; position: absolute; width: 8px; height: 8px; top: 0; left: 0; background-color: #FF4D58; border-radius: 4px; }

.post-list-favorite-ul li.fav-title-mark a .thumbnail { width: 40px; height: 40px; border-radius: 20px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_star_black.svg"); background-size: 70%; background-position: center; background-repeat: no-repeat; border: 1px solid #dddddd; }

.post-list-favorite-ul li a .name { font-size: 12px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: center; }

.posts-list .no-list { display: flex; flex-direction: column; align-items: center; font-size: 14px; padding: 50px 30px 0; }

.posts-list .no-list a { width: 180px; height: 40px; line-height: 40px; margin-top: 30px; background-color: #5675F8; text-align: center; color: #fff; border-radius: 20px; box-shadow: 0 3px 2px #ddd; }

.balloon #view_po, .balloon .live-base-pt { color: red; }

.dialog.live { top: calc(50% - 178px) !important; }

.dialog.live .price-list-wrap { font-size: 12px; }

.dialog.live .price-list-wrap li { display: grid; grid-template-columns: 1fr 1fr .5fr; margin-bottom: 5px; align-items: center; }

.dialog.live .price-list-wrap li:last-of-type { margin-bottom: 0; }

.dialog.live .price-list-wrap li span:nth-of-type(2) { font-weight: bold; color: red; }

.dialog.live .price-list-wrap li span:nth-of-type(1) { display: flex; align-items: center; }

.dialog.live .price-list-wrap li span:nth-of-type(1)::before { content: ''; width: 16px; height: 16px; background-size: cover; display: block; margin-right: 4px; }

.dialog.live .price-list-wrap .live::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_black.svg"); }

.dialog.live .price-list-wrap .comment-img::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_black.svg"); }

.dialog.live .price-list-wrap .stamp::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_stamp_black.svg"); }

.dialog.live .price-list-wrap .chip::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_chip_black.svg"); }

.site-info-header.recommend, .switch-menu.recommend, .common-content-wrap.girls-list.recommend { display: none; }

.switch-menu { background: #F0F3FF; padding: 2vw; }

.switch-menu ul { display: flex; height: 40px; align-items: center; justify-content: space-between; }

.switch-menu li { background: #fff; height: 40px; width: 40px; border-radius: 8px; }

.switch-menu li.active { background: var(--base-color-blue); }

.switch-menu li.active a { color: #fff; }

.switch-menu li:first-of-type, .switch-menu li:nth-of-type(2), .switch-menu li:nth-of-type(3) { border-radius: 20px; }

.switch-menu li:first-of-type { font-size: 12px; width: 25%; }

.switch-menu li:nth-of-type(2) { line-height: 1.5; }

.switch-menu li:nth-of-type(2), .switch-menu li:nth-of-type(3) { width: 20%; }

.switch-menu li a { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; color: #666; }

.girls-list > ul { display: flex; flex-wrap: wrap; justify-content: space-between; }

.status { display: flex; align-items: center; justify-content: center; position: absolute; bottom: -25px; color: #fff; font-size: 10px; font-weight: 500; border-radius: 50%; width: 46px; height: 46px; font-size: 11px; text-align: center; }

.three .status { width: 40px; height: 40px; font-size: 9px; }

.status.busy { background: rgba(92, 105, 113, 0.8); }

.status.video, .status.video-voice { background: rgba(245, 58, 79, 0.8); }

.status.voice { background: rgba(250, 134, 35, 0.8); }

.status.mail { background: rgba(75, 196, 173, 0.8); }

.status.live { background: rgba(123, 113, 255, 0.8); line-height: 1.2; }

.status.video-voice { line-height: 1.3; }

.three .status.video-voice span { overflow-wrap: break-word; width: 35px; }

/***
右下寄せ
.inner-age-area {
	position: absolute;
	right: 0;
	bottom: -20px;
	font-size: 12px;
	color: #333;
	font-weight: 500;
}
***/
.inner-age-area { left: 41px; position: absolute; bottom: -20px; font-size: 12px; color: #333; font-weight: 500; width: 75px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.inner-commnet-area { position: absolute; width: calc(100% - 2vw); left: 1vw; bottom: calc(-25px - 5vw); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; color: #888; font-weight: 300; }

.three .inner-age-area { font-size: 11px; }

.three .inner-commnet-area { display: none; }

.girls-list .thumnail { height: 47vw; width: 47vw; background-size: cover; background-position: center; position: relative; border-radius: 4vw; }

.girls-list li { margin-bottom: 16vw; }

@keyframes rookie_cp_balloon { 0% { transform: translate(0, 0); }
  50% { transform: translate(0, -5px); }
  100% { transform: translate(0, 0); } }
.new { position: absolute; right: 1px; bottom: 3.5px; color: #fff; display: inline-block; animation: rookie_cp_balloon 3s infinite linear alternate; }

.new .new_mark_icon { width: 40px; }

.new .new_mark_icon_mini { width: 40px; }

/***
.new img {
	display: block;
	width: 60px;
	height: 15.5px;
}
****/
.rank { position: absolute; width: 30px; left: -5px; top: -15px; }

.new_under { position: absolute; top: 3px; z-index: 1; right: 3px; }

.new_under img { width: 11px; height: 14px; }

#rank_json { display: none; }

.search-modal-btn span, .layout-switch span { line-height: 1.2; display: flex; flex-direction: column; }

.search-modal-btn a, .layout-switch a { flex-direction: column; overflow: hidden; }

.search-modal-btn span { font-size: 18px; transform: scale(0.5); }

.layout-switch span { font-size: 16px; transform: scale(0.5); width: 70px; }

.layout-switch a::before, .search-modal-btn a::before { content: ''; width: 22px; height: 22px; display: inline-block; background-repeat: no-repeat; background-size: contain; margin: auto; }

.layout-switch a::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_view_grid.svg"); margin-bottom: -5px; }

.search-modal-btn a::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_search.svg"); margin-bottom: -5px; }

.no-online { display: none; }

.online-flex { border-radius: 50px; display: flex; justify-content: center; align-items: center; margin: 20px auto 30px; font-size: 13px; background-color: #333; color: #fff; width: 70%; padding: 10px 15px; }

.info-link-wrap { display: flex; flex-direction: column; justify-content: space-between; }

.update-info, .design-change, .point-info { box-sizing: border-box; width: 132px; height: 31px; display: flex; justify-content: center; align-items: center; border-radius: 16px; font-size: 12px; font-weight: 500; }

@keyframes toggleFade { 0% { opacity: 1; }
  20% { opacity: 0; }
  40% { opacity: 1; } }
.update-info { background: #fff; color: #666; border: solid 1px #666; margin-bottom: 10px; position: relative; }

.update-info.anime { animation: 3s toggleFade infinite; animation-delay: 1s; }

.point-info { background: #EDEFF8; color: #666; margin-bottom: 10px; position: relative; font-size: 14px; }

.point-info .point-unit { font-size: 12px; margin-left: 2px; }

.point-info img { position: absolute; display: block; width: 21px; height: 21px; top: 5px; left: 9px; }

.update-info::after, .point-info::after { content: ''; display: inline-block; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_black.svg"); background-repeat: no-repeat; background-size: contain; width: 13px; height: 13px; position: absolute; right: 10px; }

.design-change { color: #B9833A; border: 1px solid #B9833A; }

.design-change img { width: 16px; }

.site-info-header { display: flex; justify-content: space-between; padding: 10px 10px 25px; }

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

３列レイアウト

************************************************************/
.layout-switch.three a::before { width: 32px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_view_grid_3row.svg"); }

.girls-list.three > ul { justify-content: start; }

.girls-list.three li { margin: 0 1.5vw 11vw 0; }
.girls-list.three li:nth-of-type(1) { position: relative; z-index: 5; }

.girls-list.three li:nth-of-type(2n) { margin-right: 0; }

.girls-list.three .thumnail { height: 50vw; width: 47.25vw; }

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

カルーセル

************************************************************/
.slider-wrap { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; width: calc(100vw - 160px); }

.slider-wrap > ul { margin: 0 auto; height: calc((100vw - 160px) * 0.31); }

.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; top: 0; left: 0; display: block; }

.slick-track:before, .slick-track:after { display: table; content: ''; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }

[dir='rtl'] .slick-slide { float: right; }

.slick-slide img { display: block; height: 100%; width: 100%; border-radius: 10px; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

.slick-loading .slick-list { background: white url("https://cdn.vi-vo.link/css/public/slick/ajax-loader.gif") center center no-repeat; }

.slick-dots { display: block; width: 100%; padding: 0; margin: 8px 0 0; list-style: none; text-align: center; }

.slick-dots li { position: relative; display: inline-block; width: 11px; height: 20px; margin: 0 3px; padding: 0; cursor: pointer; }

.slick-dots li button { font-size: 0; line-height: 0; display: block; width: 6px; height: 6px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }

.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }

.slick-dots li button:before { font-size: 16px; line-height: 20px; position: absolute; top: 0; left: 0; width: 6px; height: 6px; background: #888; content: ""; text-align: center; border-radius: 50%; opacity: 0.2; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }

.slick-dots li.slick-active button:before { color: #888888; opacity: 1; }

@media screen and (max-width: 350px) { .update-info, .design-change { width: 115px; font-size: 11px; line-height: 1; }
  .slider-wrap { width: calc(100vw - 145px); }
  .slider-wrap > ul { height: calc((100vw - 145px) * 0.31); } }
/************************************************************

PC / タブレット

************************************************************/
.pc-tab .switch-menu { padding: 10px; }

.pc-tab .girls-list .thumnail { height: 162.5px; width: 162.5px; border-radius: 10px; }

.pc-tab .girls-list li { margin-bottom: 40px; }

.pc-tab .update-info, .pc-tab .design-change { width: 115px; }

.pc-tab .slider-wrap { width: 200px; }

.pc-tab .slider-wrap > ul { height: 62px; }

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

PC / タブレット 3列

************************************************************/
.pc-tab .girls-list.three li { margin: 0 3px 40px 0; }

.pc-tab .girls-list.three li:nth-child(3n) { margin-right: 0; }

.pc-tab .girls-list.three .thumnail { height: 108px; width: 108px; border-radius: 14px; }

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

アプリDL促進レイアウト

************************************************************/
header.app_fixed_style { height: 130px; }

main.app_fixed_style { margin-top: 135px; }

.app_info_fixed { display: flex; justify-content: flex-start; align-items: center; /* background-image: url("/assets/vivo_0218/img/lp/lp25/bg_app_dl_banner_green.png"); */ background-image: url("/assets/vivo_0218/img/lp/lp25/bg_app_dl_banner_yellow.png"); height: 75px; background-size: cover; width: 100%; }

.app_info_fixed-left { display: flex; justify-content: center; align-items: center; margin-left: 1vw; }

.app_info_fixed-left img { width: 55px; }

.app_info_fixed-right { display: flex; flex-direction: column; justify-content: space-between; margin-left: 1vw; margin-right: 1vw; width: 100%; }

.app_info_fixed-right-text { color: #fff; font-weight: bold; font-size: 14px; }

.app_info_fixed-right-btn { background-color: #fff; border-radius: 14px; width: 90px; color: #333333; display: flex; justify-content: center; align-items: center; position: relative; height: 18px; margin-top: 5px; padding: 3px 6px 3px 0px; }

.app_info_fixed-right-btn a { color: #333333; text-decoration: none; font-size: 12px; font-weight: bold; }

.app_info_fixed-right-btn a:before { content: ''; position: absolute; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_black.svg"); width: 14px; height: 14px; top: 5px; right: 0px; background-size: cover; }

.app_info_fixed-right-wrap { display: flex; justify-content: flex-start; align-items: center; }

.app_info_fixed-right-getpoint { color: #fff; margin-left: 3px; }

.app_info_prepoid { border: 1px solid #fff; padding: 3px; vertical-align: text-top; line-height: 8px; }

.app_info_point { color: #FFF536; font-size: 22px; font-weight: bold; padding-left: 4px; }

.app_info_present { color: #FFF536; padding-right: 5px; font-size: 16px; font-weight: bold; }

.pc-tab .app_info_fixed-right-text { font-size: 13px; }

.pc-tab .app_info_point { font-size: 19px; }

.pc-tab .app_info_present { font-size: 13px; }

.pc-tab .app_info_fixed-right-btn { width: 80px; }

.pc-tab .app_info_fixed-right-btn a { font-size: 11px; }

.pc-tab .app_info_fixed-left { margin-left: 10px; }

.pc-tab .app_info_fixed-right { margin-left: 10px; }

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

ビデオ会話 促進レイアウト

************************************************************/
.video_promote_dialog-layout { background: #fff; width: 84%; margin: auto; position: relative; top: 10%; border-radius: 15px; font-size: 15px; color: #333; }

img.video_promote_dialog-bg { width: 100%; border-radius: 10px; }

.video_promote_dialog-btn { position: absolute; right: 0; bottom: 15px; left: 0; margin: auto; display: flex; flex-direction: column; }

.video_promote_dialog-btn img { width: 90%; display: block; margin: auto; }

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

新人促進ダイアログ（白背景）

************************************************************/
.rookie-dialog.open { height: 100%; display: flex; justify-content: center; align-items: center; }

.rookie-dialog .dialog { width: 85%; top: 0; padding: 0; }

.rookie-dialog-close-btn { position: absolute; width: 20px; height: 20px; border-radius: 50%; padding: 3px; top: -10px; right: -10px; background-color: #333333; }

.rookie-dialog-main { display: flex; flex-direction: column; align-items: center; width: 100%; box-sizing: border-box; padding: 15px 10px 25px; }

.rookie-dialog-main .rookie-dialog-catch { display: block; width: calc(100% - 80px); height: auto; }

.rookie-dialog-main .rookie-dialog-title { display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; width: 235px; height: 40px; margin: 0 0 5px; font-size: 16px; font-weight: 700; border-top: 1px solid #333333; border-bottom: 1px solid #333333; }

.rookie-dialog-main .rookie-dialog-title:before { display: block; content: ""; width: 20px; height: 20px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_rookie_black.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.rookie-dialog-main .rookie-girl-image { display: block; width: auto; width: 264px; }

.rookie-dialog-main .rookie-dialog-caption { display: inline-block; width: 243px; margin: 5px auto 0; padding-left: 15px; font-size: 15px; font-weight: 700; }

.rookie-dialog-main .low-point-caption { display: inline-block; font-size: 13px; width: 210px; margin: 8px auto; padding-left: 13px; text-indent: -13px; color: #FF3333; }

.rookie-dialog-main .rookie-dialog-link-btn { display: flex; justify-content: center; align-items: center; position: relative; box-sizing: border-box; width: 225px; height: 54px; margin: 20px 0 0; padding-right: 12px; border-radius: 27px; border: 1px solid #333333; background-color: #fff; color: #333333; font-size: 16px; font-weight: 500; }

.rookie-dialog-main .rookie-dialog-link-btn:after { display: block; position: absolute; content: ""; width: 12px; height: 12px; top: 21px; right: 20px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_arrow_right.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

@media screen and (max-width: 355px) { .rookie-dialog-main .rookie-dialog-sample .rookie-cp-balloon-caption { line-height: 18px; font-size: 12px; } }
/************************************************************

新人促進ダイアログ（写真背景）

************************************************************/
.rookie-photo-dialog.open { height: 100%; display: flex; justify-content: center; align-items: center; }

.rookie-photo-dialog .dialog { position: relative; box-sizing: border-box; top: 0; height: 111vw; background-image: url("/assets/vivo_0218/img/lp/lp25/img_rookie_dialog_photo.jpg"); background-size: cover; background-position: center; background-repeat: no-repeat; }

.rookie-photo-dialog-main { display: flex; flex-direction: column; align-items: center; }

.rookie-photo-dialog-main .rookie-photo-dialog-catch { display: block; width: 184px; height: auto; margin: 0 0 17px auto; }

.rookie-photo-dialog-sample { box-sizing: border-box; width: 170px; background-color: rgba(255, 255, 255, 0.5); margin: 0 10px 17px auto; padding: 10px 7px; font-size: 13px; font-weight: 700; border-radius: 9px; }

.rookie-photo-dialog-sample .low-point-caption { padding-left: 12px; text-indent: -12px; font-size: 12px; color: #FD4141; }

.rookie-photo-dialog-sample .rookie-cp-balloon-image { display: block; width: 79px; height: auto; margin-bottom: 5px; }

.rookie-photo-dialog .dialog .rookie-photo-dialog-link-btn { position: absolute; display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 230px; height: 54px; bottom: 8vw; left: calc(50% - 115px); margin: 0; padding-right: 12px; border-radius: 27px; background-color: #fff; color: #333333; font-size: 15px; font-weight: 500; }

.rookie-photo-dialog .dialog .rookie-photo-dialog-link-btn:after { display: block; position: absolute; content: ""; width: 16px; height: 16px; top: 19px; right: 20px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_black.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.rookie-photo-dialog .dialog.low-point .rookie-girl-btn, .rookie-photo-dialog .dialog .low-point-caption, .rookie-photo-dialog .dialog .info-discount-btn { display: none; }

.rookie-photo-dialog .dialog.low-point .low-point-caption, .rookie-photo-dialog .dialog.low-point .info-discount-btn { display: flex; }

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

LIVE配信ドック　レイアウト

************************************************************/
.livestream_list { display: flex; width: 100%; /*	height: 122px;*/ margin: 0; padding: 12px 0; overflow: scroll; }

.livestream-list-wrap { position: sticky; top: 54px; background: rgba(255, 255, 255, 0.8); z-index: 1; box-shadow: 0 3px 6px -2px rgba(0, 0, 0, 0.16); }

.app_fixed_style .livestream-list-wrap { top: 128px; }

.livestream_list li { position: relative; flex: 0 0 43%; }

.livestream_list li:first-of-type { margin: 0 1.5vw 0 2vw; position: relative; z-index: 5; }
.livestream_list li:first-of-type .prf_link { width: 100%; height: auto; aspect-ratio: 162 / 122; display: block; position: relative; }

.livestream_list li:last-child { margin-right: 0; }

.livestream_list li .live-main { width: 100%; height: 100%; background-size: cover; background-position: top; background-repeat: no-repeat; border-radius: 8px; }

.livestream_list li .live-head { display: flex; position: absolute; top: 0; left: 0; }

.livestream_list li .live-view-po { background: rgba(10, 4, 36, 0.6); width: fit-content; position: absolute; right: -30px; color: #fff; font-size: 18px; height: 40px; min-width: 120px; display: flex; align-items: center; justify-content: center; border-radius: 0 16px 0 16px; transform: scale(0.5); top: -10px; }

.live-head .live-mark { display: flex; justify-content: center; align-items: center; width: 37px; height: 20px; background-color: #FD2D55; color: #fff; font-size: 12px; border-radius: 8px 0 0 0; }

.live-head .live-count { display: flex; justify-content: center; align-items: center; width: 37px; height: 20px; background-color: rgba(10, 4, 36, 0.6); color: #fff; font-size: 12px; border-radius: 0 0 8px 0; }

.live-head .live-count .small-text { font-size: 10px; }

.livestream_list li .live-foot { display: flex; justify-content: center; align-items: center; position: absolute; width: 100%; height: 36px; bottom: 0; left: 0; background-color: rgba(0, 0, 0, 0.5); border-radius: 8px; }

.live-foot .live-girl-thmb { display: block; width: 30px; height: 30px; margin: 3px; border-radius: 15px; }

.live-foot .comment-box { width: calc(100% - 14px); color: #fff; }

.live-foot .live-girl-thmb + .comment-box { width: calc(100% - 36px); }

.live-foot .comment-box .age-area { display: flex; align-items: baseline; }

.live-foot .comment-box .age, .live-foot .comment-box .area-name, .live-foot .comment-box .comment { display: inline-block; }

.live-foot .comment-box .age, .live-foot .comment-box .area-name { margin-right: 4px; font-size: 11px; }

.live-foot .comment-box .area-name { max-width: calc(100% - 37px); width: fit-content; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; line-height: 1; }

.live-foot .comment-box .comment { width: calc(100% - 2px); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.live-list-header { display: flex; align-items: flex-end; box-sizing: border-box; padding: 10px 10px 0 10px; }

.live-list-header .livestream-about-link { font-size: 14px; display: flex; align-items: center; cursor: pointer; -webkit-tap-highlight-color: transparent; color: #333; line-height: 24px; }

/* .live-list-header .livestream-about-link:after {
	content: "";
	background-image: url("/assets/vivo_0218/img/lp/lp25/icon_question_black.svg");
	background-size: contain;
	width: 16px;
	height: 16px;
	margin-left: 7px;
} */
.about-livestream-link { border: 1px solid #FF5858; font-weight: 500; color: #FF5858; height: 24px; display: flex; align-items: center; border-radius: 12px; padding: 0 7px 0 3px; margin: 0 0 0 10px; box-sizing: border-box; font-size: 12px; position: relative; background: #fff; }

.about-livestream-link:before { content: ''; width: 14px; height: 14px; background-size: cover; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_question_red.svg"); margin-right: 2px; margin-top: -2px; margin-left: 3px; }

.mroe-live-list-view-link { width: 132px; height: 31px; position: relative; box-sizing: border-box; border: 1px solid; color: #FF5858; font-size: 12px; line-height: 24px; border-radius: 16px; margin-left: auto; display: flex; align-items: center; justify-content: center; background: #fff; }

.mroe-live-list-view-link:after { content: ""; display: inline-block; background-repeat: no-repeat; background-size: contain; width: 13px; height: 13px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_red.svg"); position: absolute; right: 15px; }

.mroe-live-list-view-link span { margin-right: 5px; font-weight: 500; }

.dialog.live { padding: 20px; box-sizing: border-box; top: calc(50% - 127px); }

.dialog.live .head-text { font-size: 16px; display: flex; margin: auto auto 13px; align-items: center; }

.dialog.live .annotation { text-align: left; color: #888888; font-size: 13px; margin-bottom: 30px; }

.dialog.live .annotation:before { content: '※'; margin-right: 2px; }

.dialog.live .balloon { display: flex; align-items: center; width: 127px; margin: inherit; height: 50px; box-sizing: border-box; border-radius: 10px; justify-content: center; font-weight: bold; }

.dialog.live .balloon img { width: 17px; height: 17px; display: block; margin-right: 8px; }

.dialog.live .head-text:before { content: ''; display: inline-block; width: 24px; height: 24px; background-size: contain; background-repeat: no-repeat; background-position: center; margin-right: 5px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_red.svg"); }

.dialog.live .balloon-bottom { position: relative; background: #fff; border: 1px solid #888888; }

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

.dialog.live .balloon-bottom:after { border-color: rgba(255, 255, 255, 0); border-top-color: #fff; border-width: 5px; margin-left: -5px; }

.dialog.live .balloon-bottom:before { border-color: rgba(136, 136, 136, 0); border-top-color: #888888; border-width: 6px; margin-left: -6px; }

.dialog.live a.blue { margin-top: 10px; }

/* LIVE配信ドック レイアウト PC */
.pc-tab .live-list-header .livestream-about-link { font-size: 13px; }

.pc-tab .mroe-live-list-view-link { width: 120px; }

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

女性表示末尾表示　アニメーション版

************************************************************/
.lastest-online-block { display: none; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 210px; }

.lastest-online-block .lastest-online-mark-wrap { display: flex; justify-content: center; align-items: center; width: 100%; height: 80px; }

.lastest-online-block .lastest-online-mark-wrap .lastest-online-mark { display: flex; justify-content: center; align-items: center; position: relative; width: 80px; height: 80px; }

.lastest-online-block .lastest-online-mark-wrap .lastest-online-mark-circle { position: relative; width: 0; height: 0; opacity: 0; background: linear-gradient(45deg, #5abefd, #187aff); border-radius: 50%; }

.lastest-online-block .lastest-online-mark-wrap .lastest-online-mark:before, .lastest-online-block .lastest-online-mark-wrap .lastest-online-mark:after { display: block; position: absolute; content: ""; width: 5px; height: 0; border-radius: 3px; }

.lastest-online-block .lastest-online-mark-wrap .lastest-online-mark:before { transform: rotate(-45deg); background: linear-gradient(90deg, #48acfe, #45a9fe); z-index: 1; }

.lastest-online-block .lastest-online-mark-wrap .lastest-online-mark:after { transform: rotate(45deg); background: linear-gradient(0deg, #45a9fe, #298dff); }

.lastest-online-block.start .lastest-online-mark-wrap .lastest-online-mark .lastest-online-mark-circle { animation-name: mark-animation; animation-delay: 0.2s; animation-duration: 0.25s; animation-timing-function: ease-out; animation-fill-mode: forwards; }

.lastest-online-block.start .lastest-online-mark-wrap .lastest-online-mark:before { animation-name: mark-shortbar-animation; animation-delay: 0.45s; animation-duration: 0.1s; animation-timing-function: linear; animation-fill-mode: forwards; }

.lastest-online-block.start .lastest-online-mark-wrap .lastest-online-mark:after { animation-name: mark-longbar-animation; animation-delay: 0.55s; animation-duration: 0.2s; animation-timing-function: linear; animation-fill-mode: forwards; }

.lastest-online-block.start .lastest-online-mark-wrap .lastest-online-mark .lastest-online-mark-circle:before { display: block; position: absolute; content: ""; width: calc(100% - 10px); height: calc(100% - 10px); top: 5px; left: 5px; background-color: #fff; border-radius: 50%; }

.lastest-online-block .lastest-online-caption { margin: 20px auto 0; color: #222222; font-size: 14px; font-weight: 600; }

.lastest-online-block .lastest-online-movie-link { display: flex; justify-content: center; align-items: center; width: 200px; height: 40px; margin: 20px auto; background-color: #3494ff; font-size: 14px; font-weight: 600; border-radius: 20px; }

.lastest-online-block .lastest-online-movie-link a { color: #fff; }

.none-live-list { width: fit-content; font-size: 13px; margin: 20px auto 10px 10px; border: 1px solid #ccc; border-radius: 20px; box-sizing: border-box; height: 40px; display: flex; align-items: center; justify-content: flex-start; padding: 0 15px; color: #888; }

.none-live-list:before { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_gray.svg"); width: 20px; height: 20px; background-size: cover; margin-right: 5px; }

@keyframes mark-animation { 0% { width: 0; height: 0; opacity: 0; }
  100% { width: 80px; height: 80px; opacity: 1; } }
@keyframes mark-shortbar-animation { 0% { height: 0; top: 43px; left: 18px; }
  100% { height: 20px; top: 40px; left: 25px; } }
@keyframes mark-longbar-animation { 0% { height: 0; top: 55px; left: 30px; }
  100% { height: 40px; top: 21px; left: 45px; } }
@media screen and (max-width: 360px) { .about-livestream-link { font-size: 11px; }
  .mroe-live-list-view-link { width: fit-content; padding: 0 10px; font-size: 11px; } }
.item-wrap { position: relative; }

.live-stram-about { position: absolute; top: -5px; right: 0px; }

.live-stram-about img { width: 25px; }

.about-livestream-relese-date { border-radius: 20px; border: 1px solid #FF5858; padding: 5px 10px; border-radius: 3px; width: fit-content; margin-left: 10px; color: #FF5858; display: flex; justify-content: center; align-items: center; }

.auto-scroll-appeal-comment-area { position: absolute; bottom: 38px; width: 100%; overflow: hidden; }

.auto-scroll-appeal-comment-wrap { display: flex; align-items: center; overflow: hidden; color: #fff; min-width: 100%; width: max-content; }

.auto-scroll-appeal-comment-wrap p { width: 100%; transform: translateX(80%); animation: slideText 5s linear infinite; }

@keyframes slideText { 100% { transform: translateX(-100%); } }
/* 女性一覧　配信  */
.livestream-girls-list { display: none; }

.livestream-girls-list.open { min-height: 100vh; display: block; padding: 2vw; }

.livestream-girls-list ul { display: grid; column-gap: 1.5vw; row-gap: 40px; grid-template-columns: repeat(2, 1fr); }

.livestream-girls-list.three ul { grid-template-columns: repeat(3, 1fr); }

.livestream-girls-list .thumnail { width: 47vw; height: 47vw; background-size: cover; background-position: center; position: relative; border-radius: 4vw; }

.livestream-girls-list.three .thumnail { height: 47.5vw; width: 47.5vw; }

/* 女性一覧　配信 pc  */
.pc-tab .livestream-girls-list.open { padding: 10px; }

.pc-tab .livestream-girls-list .thumnail { width: 162.5px; height: 162.5px; border-radius: 10px; }

.pc-tab .livestream-girls-list.three .thumnail { height: 108px; width: 108px; border-radius: 14px; }

.livestream_list li .live-view-prf-text { background: rgba(10, 4, 36, 0.6); width: auto; position: absolute; right: 0px; color: #fff; font-size: 11px; height: 20px; display: flex; align-items: center; justify-content: center; border-radius: 0 16px 0 16px; top: 0px; padding-left: 10px; padding-right: 5px; }

/*** メンテナンス告知リンク ***/
.maintenance-notice { width: 100%; box-sizing: border-box; text-align: center; padding: 5px; font-size: 15px; border-bottom: 1px solid #dddddd; margin-bottom: 5px; }

.maintenance-notice a { color: #db0b0b; }

/*** PHP8 アプリアップデート促進 2024-02-01***/
.caution-app-update-wrap { display: flex; align-items: center; box-sizing: border-box; width: 327px; height: 56px; margin: 0 auto 3px; background-color: #FFF2C7; border-radius: 9px; }

.caution-app-update-wrap .caution-icon { display: block; width: 50px; height: auto; margin: 0 10px 0 16px; }

.caution-app-update-wrap p { display: block; padding-left: 14px; font-size: 14px; color: #333333; text-indent: -14px; }

.caution-app-update-wrap p .caution-bold-text { font-weight: 700; }

.caution-app-update-wrap .caution-arrow { display: block; width: 20px; height: auto; margin-left: 10px; }

/*** メールNG告知リンク 2024-04-05***/
.no-mail-alert-wrap { display: flex; justify-content: center; align-items: center; width: 100%; margin: 8px 0; font-size: 14px; text-decoration: underline; }

.status_test { display: flex; flex-wrap: wrap; box-sizing: border-box; width: 100%; padding: 0 15px; }

.status_test span { font-size: 10px; padding: 1px 4px; }

/**** _member_menu_mail_pt_get.html ****/
.present-container { display: flex; flex-direction: column; align-items: center; width: 100%; padding: 15px 0; background-color: #FAF5F0; }

.present-container .wrapper-square { display: flex; flex-direction: column; align-items: center; position: relative; width: 340px; margin: 10px; padding-bottom: 15px; background-color: #FFF; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); }

.wrapper-square .present-header-pink { display: flex; justify-content: center; align-items: center; width: 100%; padding: 8px 0; background-color: #FF4577; text-align: center; font-size: 15px; font-weight: bold; color: #FFF; }

.wrapper-square .present-inner { padding: 15px; }

.wrapper-square .present-inner .present-point { display: flex; justify-content: center; align-items: center; width: 225px; height: 80px; background-color: #00ACC1; border-radius: 14px; color: #FFF; }

.wrapper-square .present-inner .present-point .present-left img { width: 41px; margin-right: 5px; }

.wrapper-square .present-inner .present-point .present-right { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 114px; }

.present-right .present-money { font-size: 26px; font-weight: bold; }

.present-right .present-money .present-yen { font-size: 13px; margin-left: -4px; }

.present-right .present-wrapper { display: flex; justify-content: center; align-items: center; width: 100%; height: 20px; background-color: #FFF; border-radius: 4px; color: #00ACC1; font-size: 13px; font-weight: bold; letter-spacing: 3px; }

.wrapper-square .icon-caution { display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: bold; }

.wrapper-square .icon-caution::before { content: '!'; width: 22px; height: 22px; margin-right: 5px; background-color: #F40D0D; border-radius: 100px; text-align: center; font-size: 16px; color: #FFF; }

.present-btn-area { width: 70%; }

.present-btn-green { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 240px; height: 50px; margin: 10px 0 5px; padding-left: 20px; border-radius: 50px; background-color: #00C753; box-shadow: 0 2px #03883B; font-size: 16px; font-weight: 700; color: #FFF; }

.present-btn-green:after { display: block; content: ""; width: 18px; height: 18px; margin-left: 25px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_wt.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }

.under-back-btn { display: flex; justify-content: center; align-items: center; height: 34px; width: 140px; margin: 30px auto 15px; border: 2px solid #222; border-radius: 100px; font-size: 15px; color: #222; }

/*====================================
ライブ配信無料チケット受取告知ダイアログ
=====================================*/
#dialog_livestream_free_receive { position: fixed; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100dvh; background-color: rgba(0, 0, 0, 0.85); top: 0; left: 0; z-index: 9999; }

#dialog_livestream_free_receive.none { display: none; }

#dialog_livestream_free_receive .bold { font-weight: bold; }

#dialog_livestream_free_receive .fs-22 { font-size: 22px !important; }

#dialog_livestream_free_receive .fs-25 { font-size: 25px !important; }

#dialog_livestream_free_receive .fs-30 { font-size: 30px !important; }

#dialog_livestream_free_receive .ms-2 { margin: 0 2px; }

#dialog_livestream_free_receive .ms-2-5 { margin: 0 2px 0 5px; }

#dialog_livestream_free_receive .mr-2 { margin-right: 2px; }

#dialog_livestream_free_receive .mr-4 { margin-right: 4px; }

#dialog_livestream_free_receive .dialog_livestream_inner { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; }

#dialog_livestream_free_receive .contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; }

#dialog_livestream_free_receive .contents .icon { position: relative; width: 90px; height: 90px; margin-bottom: 22px; background-color: #fff; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_ticket_pink.svg"); background-size: 100%; background-position: center; background-repeat: no-repeat; border-radius: 10px; }

#dialog_livestream_free_receive .contents .icon::before { content: ''; position: absolute; width: 300px; height: 300px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_ticket_back.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; top: calc(50% - 300px/2); left: calc(50% - 300px/2); }

#dialog_livestream_free_receive .contents .contents-text { color: #FFE05C; font-size: 22px; font-weight: bold; text-shadow: 0 0 14px #000; }

#dialog_livestream_free_receive .contents .contents-text { color: #FFE05C; font-size: 22px; font-weight: bold; text-shadow: 0 0 14px #000; }

#dialog_livestream_free_receive .contents .caution-text { margin-top: 20px; color: #FFF; font-size: 14px; }

#dialog_livestream_free_receive .contents .text-box { display: flex; justify-content: center; align-items: center; width: 260px; margin-top: 14px; padding: 8px 0; border: 1px solid #FFF; border-radius: 5px; color: #FFF; font-size: 14px; }

#dialog_livestream_free_receive .contents .close_icon { position: relative; margin-top: 116px; color: #FFF; font-size: 14px; }

#dialog_livestream_free_receive .contents .close_icon:before { content: ''; position: absolute; width: 36px; height: 36px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_close_circle_white.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; top: -35px; left: calc(50% - 36px/2); }

header.common { position: sticky; top: 0; z-index: 1000; }

main { margin-top: 0px; }

.base-headline { display: flex; position: relative; padding: 0px 3px; height: 40px; line-height: 40px; font-size: 16px; color: #fff; margin: 0 0 0px 0; background-color: #999; margin: 0 0 5px 0; }
.base-headline img { width: 25px; margin-right: .2rem; }

#live_video::-webkit-media-controls { display: none !important; }

#live_video { pointer-events: none; }

.rgt_btn { width: 100%; height: 3em; border-radius: 1000px; position: relative; display: flex; justify-content: center; align-items: center; transition: 0.2s ease-in-out; white-space: nowrap; text-decoration: none; filter: brightness(100%) drop-shadow(0px 10px 10px rgba(0, 0, 0, 0.6)); font-size: 22px; font-weight: bold; max-width: 480px; margin: 10px auto 30px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-arrow.svg), url(/assets/vivo_0218/img/lp/lp25/img-dot.svg), url(/assets/vivo_0218/img/lp/lp25/img-white.svg), linear-gradient(to bottom, #ff3593 0%, #ff0077 100%); background-size: 3%, 3%, cover, 100%; background-position: right 5% center, center, center, center; background-repeat: no-repeat, repeat, no-repeat, no-repeat; border-top: 0.2rem solid white; border-left: 0.2rem solid white; border-bottom: 0.2rem solid rgba(255, 255, 255, 0.7); border-right: 0.2rem solid rgba(255, 255, 255, 0.85); animation: button-bound-anime 2s linear infinite; color: #fff; }
.rgt_btn p { filter: drop-shadow(0px 2px 3px rgba(0, 0, 0, 0.6)); }

#welcomeModal.modal_welcome_overlay { color: #fff; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); z-index: 9999; justify-content: center; align-items: center; cursor: pointer; display: flex; }
#welcomeModal .modal_welcome_content { position: relative; width: 100%; height: auto; max-width: 480px; aspect-ratio: 1 / 1; }
#welcomeModal .modal_welcome_content img { width: 100%; height: auto; position: absolute; left: 50%; top: 50%; translate: -50% -50%; }
#welcomeModal .modal_welcome_content .rgt_btn { width: 70%; height: 14%; position: absolute; left: 50%; top: 74%; translate: -50% -50%; margin: 0; }
#welcomeModal .modal_welcome_content .rgt_btn p { filter: drop-shadow(0px 2px 3px rgba(0, 0, 0, 0.6)); }

#modal_message { display: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-weight: bold; z-index: 10; width: 100%; height: 100%; justify-content: center; align-items: center; flex-flow: column; pointer-events: none; }
#modal_message a { display: flex; justify-content: center; align-items: center; flex-flow: column; color: #fff; padding: 30px 20px; width: 100%; height: 100%; position: relative; z-index: 12; }
#modal_message a span { color: #ff0; }
#modal_message .modal_message_overlay { position: absolute; width: 100%; height: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: rgba(0, 0, 0, 0.75); z-index: 1; opacity: 0; }

#modal_message.is-show { display: flex; }
#modal_message.is-show a { pointer-events: auto; animation: zoomInBounce 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
#modal_message.is-show .modal_message_overlay { animation: overlayAni 1.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }

@keyframes zoomInBounce { 0% { opacity: 0; transform: scale(0); }
  100% { opacity: 1; transform: scale(1); } }
@keyframes overlayAni { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes button-bound-anime { 0% { transform: skew(0); }
  5% { transform: skew(5deg, 4.2deg) scale(1.1, 1); }
  10% { transform: skew(-4deg, -3deg) scale(0.98, 1); }
  15% { transform: skew(3deg, 2.2deg); }
  20% { transform: skew(-2deg, -1.5deg); }
  25% { transform: skew(0.9deg, 0.9deg); }
  30% { transform: skew(-0.6deg, -0.6deg); }
  35% { transform: skew(0.3deg, 0.3deg); }
  40% { transform: skew(-0.2deg, -0.2deg); }
  45% { transform: skew(0.1deg, 0.1deg); }
  50% { transform: skew(0); }
  100% { transform: skew(0); } }
.contents-back-btn { margin: 40px auto; text-align: center; display: flex; align-items: center; justify-content: center; }

.contents-back-btn > a { width: 150px; color: #e01540; border: 2px solid #e01540; border-radius: 1000px; line-height: 1; height: 28px; display: flex; align-items: center; justify-content: center; }

.photo-box { position: relative; }

* { box-sizing: border-box; }

video { width: 100%; height: auto; vertical-align: middle; }

.no-stream-p { background-color: #000; color: #fff; height: 100%; border-radius: 8px; display: flex; justify-content: center; align-items: center; flex-flow: row nowrap; padding: 15px; box-sizing: border-box; font-size: 15px; }

.no-stream-p:before { content: ''; width: 0; height: 0; border-style: solid; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-right: 10px solid #ffffff; border-left: 0; display: block; margin-right: 10px; }

header.common ul { justify-content: flex-start; padding: 0 7vw 0 2vw; }

header.common ul li { width: auto; }

header.common li.logo + li { margin-left: auto !important; margin-right: 30px; }

footer > .common ul { justify-content: flex-end; margin: 0; padding: 0 7vw 0 2vw; }

footer > .common ul li { width: auto; }

footer > .common ul li { margin-left: 30px; }

.layout { width: 100%; margin: 0; position: relative; top: 0; left: 0%; }

.layout.modal-active { position: relative; top: 0; left: calc(-100% - 30px); transition: all 400ms cubic-bezier(0, 0, 0, 1); }

.modal-video { position: fixed; top: 0; left: calc(100% + 0px); width: 100%; height: 100dvh; background: #000; z-index: 9999; background-image: url(/assets/vivo_0218/img/lp/lp25/call-bg.jpg); background-size: cover; background-position: center; border-radius: 75px; transition: all 400ms cubic-bezier(0, 0, 0, 1); box-shadow: 5px 5px 5px #000; }
.modal-video .modal-video-wrap { width: 100%; height: 100%; display: none; position: relative; z-index: 9; }
.modal-video .modal-video-wrap video { width: 100%; height: 100%; vertical-align: middle; object-fit: cover; position: relative; z-index: 7; }
.modal-video .modal-video-first { z-index: 5; position: absolute; display: flex; justify-content: space-between; align-items: center; flex-flow: column; width: 100%; height: 100%; background-color: #000; }
.modal-video .modal-video-first .modal-video-first-header { width: 100%; }
.modal-video .modal-video-first .modal-video-first-header div:nth-child(1) { background-color: #fff; width: 100%; display: flex; justify-content: flex-start; align-items: center; height: 64px; }
.modal-video .modal-video-first .modal-video-first-header div:nth-child(1) img { height: 48px; width: auto; }
.modal-video .modal-video-first .modal-video-first-header div:nth-child(2) { margin-top: 33px; width: 100%; display: flex; justify-content: bottom; align-items: center; flex-flow: column; }
.modal-video .modal-video-first .modal-video-first-header div:nth-child(2) img { width: 75%; height: auto; }
.modal-video .modal-video-first .modal-video-first-tmb { position: absolute; left: 50%; top: 50%; translate: -50% -50%; display: flex; aspect-ratio: 1 / 1; justify-content: center; align-items: center; flex-flow: column; width: 100%; }
.modal-video .modal-video-first .modal-video-first-tmb img { width: 73%; height: auto; border-radius: 1000px; }
.modal-video .modal-video-first .modal-video-first-tmb span { background-color: #999; padding: 5px 10px; font-size: 30px; margin-top: 20px; color: #fff; display: inline-block; border-radius: 10px; background-image: linear-gradient(to right, #e71140 0%, #93278f 100%); }
.modal-video .modal-video-first .modal-video-first-footer { background-color: #e74040; display: flex; justify-content: center; align-items: center; width: 100%; height: 52px; }
.modal-video .modal-video-first .modal-video-first-footer img { width: auto; height: 100%; }

@keyframes grad { 0% { background-position: 100% 0; }
  100% { background-position: 0% 0; } }
.modal-video.active { border-radius: 0px; left: calc(0% - 0px); }

.no-transition { transition: none !important; }

.disconnect-btn { grid-area: disconnect-btn; height: 44px; width: 44px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.3); border-radius: 50%; margin-left: auto; position: absolute; z-index: 12; top: 10px; right: 10px; }

.modal-video.active .disconnect-btn { opacity: 0; animation: show 0s linear; animation-delay: 3s; animation-fill-mode: forwards; }

@keyframes show { from { opacity: 0; }
  to { opacity: 1; } }
/*　画面サイズが767pxまではここを読み込む　*/
@media screen and (max-height: 659px) { .modal-video .modal-video-first .modal-video-first-tmb { top: 58%; }
  .modal-video .modal-video-first .modal-video-first-tmb img { width: 63%; } }
/* 非表示制御用クラス */
.is-hidden { display: none !important; }

.dark-link { display: none; }

.dark header, .dark footer > .common, .dark main, .dark video { border-color: #6e6e6e; }
.dark header:before, .dark footer > .common:before, .dark main:before, .dark video:before { content: ''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.75); z-index: 1; }
.dark main:before { height: 107%; }
.dark .dark-link { position: fixed; z-index: 9000; display: block; width: 100vw; height: 100vh; }
.dark header ul { position: relative; }
.dark header ul:before { content: ''; position: absolute; top: -92px; right: calc(8vw - 20px); width: 237px; height: 77px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-tutorial-box-header.webp); background-repeat: no-repeat; background-size: contain; background-position: center center; animation: pyokon 8s cubic-bezier(0.68, -0.6, 0.32, 1.6) infinite; animation-delay: 2s; }
.dark header li.menu-item, .dark footer li:nth-child(2) { position: relative; z-index: 3; }
.dark header li.menu-item a, .dark footer li:nth-child(2) a { width: 50px; transform: scale(1.3); transition: 0.4s; transition-timing-function: cubic-bezier(0.68, -0.6, 0.32, 1.6); }
.dark header li.menu-item a > span, .dark footer li:nth-child(2) a > span { margin-top: -3px; transform: scale(0.8); color: #000 !important; }
.dark header li.menu-item { position: relative; }
.dark header li.menu-item:before { content: ''; position: absolute; left: 50%; top: -28px; translate: -50% 0; width: 20px; height: 16px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-tutorial-arrow.webp); background-repeat: no-repeat; background-size: contain; }
.dark header li.menu-item:nth-child(2):before { animation-delay: 2s; }
.dark header li.menu-item:nth-child(3):before { animation-delay: 4s; }
.dark footer ul { position: relative; }
.dark footer ul:before { content: ''; position: absolute; top: -26px; right: calc(8vw + 64px); width: 245px; height: 77px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-tutorial-box-footer.webp); background-repeat: no-repeat; background-size: contain; background-position: center center; z-index: 2; animation: pyokon 8s cubic-bezier(0.68, -0.6, 0.32, 1.6) infinite; animation-delay: 8s; }
.dark footer li { position: relative; }
.dark .livestream_list { position: relative; overflow: unset; }
.dark .livestream_list li:first-of-type:after { content: ''; position: absolute; left: 30vw; bottom: 20vw; width: 242px; height: 75px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-tutorial-box-streaming.webp); background-repeat: no-repeat; background-size: contain; background-position: center center; z-index: 6; animation: pyokon 8s cubic-bezier(0.68, -0.6, 0.32, 1.6) infinite; animation-delay: 4s; }
.dark .girls-list.three li:nth-of-type(1):after { content: ''; position: absolute; left: 30vw; bottom: 40vw; width: 242px; height: 76px; background-image: url(/assets/vivo_0218/img/lp/lp25/icon-tutorial-box-video.webp); background-repeat: no-repeat; background-size: contain; background-position: center center; z-index: 6; animation: pyokon 8s cubic-bezier(0.68, -0.6, 0.32, 1.6) infinite; animation-delay: 6s; }
@keyframes pyokon { 0% { transform: translateY(0) scale(1, 1); }
  2% { transform: translateY(0) scale(1.05, 0.9); }
  4% { transform: translateY(-7px) scale(0.95, 1.1); }
  6% { transform: translateY(0) scale(1.05, 0.95); }
  8%, 100% { transform: translateY(0) scale(1, 1); } }
.dark header.black .log-img, .dark footer > .black .log-img { display: block; }
.dark header.black .log-black-img, .dark footer > .black .log-black-img { display: none !important; }
.dark header.common.black .menu-item a, .dark footer .common.black a { background-color: #fff; }
.dark header.black ul, .dark footer > .black { background: #fff !important; backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); border-bottom: none; }
.dark header.common { position: relative; top: 0; z-index: 1000; }
.dark header.black a span, .dark footer > .black > span { color: #000 !important; }

.video-dummy-wrapper { position: relative; }

.video-wrapper { position: relative; width: 100%; }

/* videojs-vivo-2023.jsで生成される.vjs-styles-defaultsの打消し */
.video-wrapper .vjs-fluid:not(.vjs-audio-only-mode) { padding-top: 0 !important; }

.video-play-btn-overlay { cursor: pointer; position: absolute; width: 30%; top: 50%; /* 追記 */ left: 50%; /* 追記 */ -ms-transform: translate(-50%, -50%); /* 追記 */ -webkit-transform: translate(-50%, -50%); /* 追記 */ transform: translate(-50%, -50%); /* 追記 */ }

.vjs-big-play-button { display: none !important; /*videojsデフォルトの再生ボタンのデザインを消すために必要です*/ }

.movie-time-wrap { position: absolute; background-color: rgba(0, 0, 0, 0.8); color: #FFF; bottom: 10px; z-index: 1; min-width: 55px; height: 24px; font-size: 13px; line-height: 24px; text-align: center; border-radius: 6px; right: 10px; }

/* movie_error_info_post関連 */
.show-detail-form { margin: 0px 15px 25px; padding-bottom: 25px; border-bottom: 1px solid #DDDDDD; }

.play_caution { font-size: 14px; color: #666; width: 100%; text-align: center; margin: 15px 0; }

.cannot_play { display: flex; justify-content: center; width: 100%; margin-top: 15px; font-size: 18px; }

.cannot_play { font-size: 14px; display: block; text-align: center; margin: 24px auto 30px; position: relative; width: 200px; }

.cannot_play span { position: relative; }

.cannot_play span:after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; margin: auto; height: 1px; width: 100%; background: #00a6c9; }

.movie-error-info-wrap { box-sizing: border-box; width: calc(100% - 30px); margin: 0 15px; padding: 25px 0; }

.movie-error-info-wrap .movie-error-info-head { display: flex; align-items: center; margin-bottom: 15px; }

.movie-error-info-wrap .movie-error-info-head img { display: block; width: 25px; height: auto; margin-right: 5px; }

.movie-error-info-wrap .movie-error-info-head p { margin: 0; font-size: 15px; font-weight: 500; }

.movie-error-info-wrap .movie-error-info-button-wrap { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }

.movie-error-info-wrap .movie-error-info-button-wrap .movie-error-info-button { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: calc(50% - 5px); max-width: 180px; height: 56px; border: 1px solid #C1C6D0; border-radius: 11px; font-size: 14px; font-weight: 700; color: #333333; }

.movie-error-info-button-wrap .movie-error-info-button.yes-btn.active { border: 2px solid #4C85EC; color: #4C85EC; }

.movie-error-info-button-wrap .movie-error-info-button.no-btn.active { border: 2px solid #EB6464; color: #EB6464; }

.movie-error-info-button-wrap .movie-error-info-button.disable { border: none; background-color: #EBEBEB; color: #9F9F9F; }

.movie-error-info-message-wrap { display: flex; flex-direction: column; align-items: center; width: 100%; height: 0; overflow: hidden; transition: 0.5s; }

.movie-error-info-message-wrap .info-message-box { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; padding: 35px 0; border-radius: 10px; }

.movie-error-info-message-wrap .info-message-box.info-message-ok { background-color: #F0F6FF; }

.movie-error-info-message-wrap .info-message-box.info-message-not { background-color: #FFEDED; }

.movie-error-info-message-wrap .info-message-box.none { display: none; }

.movie-error-info-message-wrap .info-message-box h4 { font-size: 14px; font-weight: 700; margin: 0 0 20px; }

.movie-error-info-message-wrap .info-message-box.info-message-ok h4 { color: #4C85EC; }

.movie-error-info-message-wrap .info-message-box.info-message-not h4 { color: #EB6464; }

.movie-error-info-message-wrap .info-message-box a { display: flex; justify-content: center; align-items: center; width: 271px; height: 57px; border-radius: 29px; font-size: 13px; font-weight: 500; color: #fff; }

.movie-error-info-message-wrap .info-message-box .movie-link-btn { background-color: #4C85EC; }

.movie-error-info-message-wrap .info-message-box .cannot_play-btn { background-color: #EB6464; }

/*
各設定
*/
/*
base color palette
http://www.colourlovers.com/palette/3293028/Christmas_Time
*/
/* ===================================================================================================================== 有料画像一覧
===================================================================================================================== */
/* *********************************************************
ヘッダー
********************************************************* */
.movie-headline { position: relative; }

.moviedetail-left { width: 60px; display: inline-block; vertical-align: top; margin: 0; }

.moviedetail-left > .image-box { width: 40px; border-radius: 50%; padding: 5px 10px 10px; }

.moviedetail-left > .image-box > span { display: inline-block; width: 40px; height: 40px; border-radius: 20px; background-color: transparent; background-repeat: no-repeat; background-size: contain; background-position: center center; }

.moviedetail-right { display: inline-block; vertical-align: top; width: calc(100% - 70px); padding: 5px 0 10px; }

.moviedetail-right > div { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; height: 40px; color: #36231f; }

.moviedetail-right > div > span { display: block; line-height: 1em; font-size: 13px; }

.moviedetail-right > div > span.name { font-size: 16px; }

.btn-message-profile { width: 120px; height: 30px; line-height: 28px; color: #36231f; font-size: 13px; text-align: center; background-color: #FFF; border: 1px solid #888; border-radius: 100px; position: absolute; top: 0; right: 10px; bottom: 0; padding-right: 8px; margin: auto; z-index: 10; }

.btn-message-profile::after { content: ""; position: absolute; top: 0; right: 7px; bottom: 0; width: 10px; height: 10px; margin: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_arrow_right_gray.svg"); background-repeat: no-repeat; background-position: center; background-size: contain; }

/* *********************************************************
動画詳細
********************************************************* */
.moviedetail-wrap { margin: 0 0px; padding: 0; }

.moviedetail-ul { width: 100%; }

.moviedetail-ul .girls-list-li { margin: 6px 0; }

.moviedetail-ul .hl-wrapper { margin: 0; }

.moviedetail-li { padding: 0 0px; }

.moviedetail-dl { margin: 0 0 10px 0; }

.moviedetail-dd li.girl-prof span.name { line-height: .8em; display: inline-block; margin: 0 0 7px; }

.moviedetail-dd li.girl-prof span.age { font-size: 11px; }

.moviedetail-dd li.girl-prof span.time { display: block; padding: 0px; font-size: 12px; line-height: 1em; white-space: nowrap; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.moviedetail-iine { display: inline-block; margin: 10px 0 0 0; padding: 15px; line-height: 1em; font-size: 13px; color: #FF6666; background-color: #FFFFFF; border: 1px solid #FF7777; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; width: 100%; }

.moviedetail-textarea { box-sizing: border-box; width: 100%; background-color: #FFFFFF; padding: 15px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #f7f0e8; }

.moviedetail-title { font-size: 18px; font-weight: bold; }

.moviedetail-comment { width: 100%; margin: 20px 0 0 0; }

.moviedetail-img { width: 100%; margin: 0 auto; position: relative; }

.moviedetail-img img { width: 100%; }

.moviedetail-comment-send { margin: 0px 0; text-align: center; border-bottom: 1px dashed #ccc; }

.moviedetail-comment-send > a { font-size: 20px; padding: 10px 15px; background-color: #4AA954; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color: #FFFFFF; }

.moviedetail-back { overflow: hidden; margin: 20px 0 0; text-align: center; }

.moviedetail-back > a { display: block; border-top: 1px dashed #ccc; padding: 20px 0; }

.moviedetail-back > a:last-child { border-bottom: 1px dashed #ccc; }

.moviedetail-msg { margin: 10px 0 0 0; }

.moviedetail-textarea > .item-tag { padding: 10px 0 0; }

.moviedetail-textarea > .item-tag a { display: inline-block; margin: 0 3px 0px 0; padding: 5px 7px; font-size: 11px; line-height: 1em; border: 1px solid #E01540; color: #E01540; letter-spacing: -1px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.moviedetail-thumb { position: relative; display: block; width: 100%; }

.moviedetail-thumb > .image-box { display: block; position: relative; width: 100%; overflow: hidden; background-color: #393939; background-repeat: no-repeat; background-size: contain; background-position: center center; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }

.moviedetail-thumb > .image-box:before { content: ""; display: block; padding-top: 75%; /* 高さを幅の75%に固定 */ }

.moviedetail-thumb > .image-box > img { display: block; position: absolute; top: 0; left: 0; }

.photo-box > img { width: 100%; }

/*.movielist-play { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 60px; height: 60px; -moz-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px; background-color: rgba(0,0,0,.3); border:1px solid #fff }

.movielist-play:before { content: ''; position: absolute; top: 10px; left: 12px; width: 40px; height: 40px; background: transparent url("/assets/vivo_0218/img/lp/lp25/icon_movie_play.svg") no-repeat center center; background-size: contain; }*/
.photo-box { width: 100%; }

.photo-box > img { width: 100%; }

.photo-image { display: block; margin: 0 auto; width: 100%; background-repeat: no-repeat; background-size: contain; background-position: center; }

.girl-prof { font-size: 12px; }

.woman-detail-my-memo { width: 90%; height: 70px; }

.moviedetail-comment-send div { display: inline-block; }

.mov_video_play { display: none; width: 100%; }

.movie-show { position: relative; }

.file_attr { margin-left: 20px; }

.mov_play_time { background-color: #544A49; color: white; border-radius: 5px; padding: 2px 5px; position: absolute; bottom: 25px; right: 40px; font-weight: bold; }

.profile-title { width: 60%; display: inline-block; font-size: 16px; }

.profile-title-bar { padding: 0 8px; height: 35px; background-color: #E01540; line-height: 35px; color: #FFFFFF; font-weight: bold; margin: 20px 0 0 0; }

.mov-playicon { position: absolute; top: 50%; left: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px; -moz-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px; background-color: rgba(0, 0, 0, 0.3); border: 1px solid #fff; }

.mov-playicon:before { content: ''; position: absolute; top: 10px; left: 12px; width: 40px; height: 40px; background: transparent url("/assets/vivo_0218/img/lp/lp25/icon_movie_play.svg") no-repeat center center; background-size: contain; }

.woman-detail-my-memo { font-size: 16px; }

.detail-header-button { padding: 0 0 0 20px; color: #FFFFFF; line-height: 1em; background-color: transparent; border: none; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6), 0 -1px 2px rgba(0, 0, 0, 0.6); font-size: 20px; }

.div_moive_comment { margin: 20px; }

.div_moive_comment > .title { line-height: normal; }

/*** Add 20/02/26 sasaki 有料画像デザイン追加 *****/
.show-detail-wrap { margin-bottom: 40px; }

.show-detail-container { display: flex; }

.show-detail-left { display: inline-block; vertical-align: top; margin: 0 10px; }

.show-detail-left > a > .image-box { width: 65px; border-radius: 50%; }

.show-detail-left > a > .image-box > span { display: inline-block; width: 65px; height: 65px; -moz-border-radius: 55px; -webkit-border-radius: 55px; border-radius: 55px; background-color: #4AA954; background-repeat: no-repeat; background-size: contain; background-position: center center; }

.show-detail-right { display: flex; flex-direction: column; width: 100%; margin-right: 15px; }

.show-detail-name { font-size: 14px; font-weight: bold; color: #707070; margin: 6px 0 10px; line-height: 1; display: flex; justify-content: space-between; align-items: center; }

.show-detail-time { margin-bottom: 10px; font-size: 12px; color: #707070; line-height: 1; display: flex; justify-content: space-between; }

.show-detail-data { margin-right: 10px; }

.show-detail-btn { display: flex; align-items: center; margin-bottom: 15px; }

.btn-show-detail-prf { width: 124px; height: 32px; line-height: 30px; border: 1px solid #888; border-radius: 100px; font-size: 13px; font-weight: bold; text-align: center; color: #888; margin-right: 10px; position: relative; padding-right: 8px; }

.btn-show-detail-prf::after { content: ""; position: absolute; top: 0; right: 7px; bottom: 0; width: 10px; height: 10px; margin: auto; background-image: url("/img/icon_arrow_right_gray.svg"); background-repeat: no-repeat; background-position: center; background-size: contain; }

.btn-show-detail-fav { width: 124px; height: 32px; line-height: 30px; border: 1px solid #FF9D2B; border-radius: 100px; font-size: 13px; font-weight: bold; text-align: center; color: #FF9D2B; background: #FFF; padding: 0; }

.btn-show-detail-fav.on { background: #FF9D2B; color: #FFF; border: none; }

.show-detail-text { color: #333; margin: 15px 15px 20px 15px; border-bottom: 1px solid #DDD; word-break: break-all; }

.show-detail-title { font-size: 15px; font-weight: bold; margin-bottom: 10px; }

.show-detail-comment { font-size: 14px; margin-bottom: 15px; }

.show-detail-heading { border-left: 4px solid #4C86ED; font-size: 14px; padding-left: 3px; margin: 0px 15px 10px; }

.show-detail-form { margin: 0px 15px 50px; }

.show-detail-textarea { border: 1px solid #888; width: 100%; border-radius: 10px; padding: 12px; min-height: 100px; -webkit-appearance: none; font-size: 16px; }

.show-detail-send { display: flex; justify-content: flex-end; margin-top: 15px; }

.btn-show-detail-send { width: 100px; height: 40px; line-height: 40px; border-radius: 10px; background-color: #4C86ED; font-size: 15px; color: #FFF; text-align: center; border: none; }

.show-detail-point { display: inline-block; background-color: #E0153E; border-radius: 6px; font-size: 13px; font-weight: bold; color: #FFF; height: 24px; line-height: 24px; padding: 0 10px; text-align: center; }

.show-detail-point.color-yellow { background-color: #FAA000; }

.show-detail-movie { position: relative; }

.show-detail-movie-date { position: absolute; right: 15px; bottom: 15px; display: flex; flex-direction: column; }

.show-detail-movie-time { display: inline-block; background-color: rgba(0, 0, 0, 0.8); border-radius: 6px; font-size: 13px; color: #FFF; height: 24px; line-height: 24px; padding: 0 10px; text-align: center; margin-top: 10px; }

.btn-show-detail-fav-on { width: 124px; height: 32px; line-height: 32px; border-radius: 100px; font-size: 13px; font-weight: bold; text-align: center; color: #FF9D2B; background: #FFF; padding: 0; background: #FF9D2B; color: #FFF; }

.show-detail-title, .show-detail-text, .show-detail-name { word-break: break-all; overflow-wrap: anywhere; }

.show-detail-name .name { max-width: calc(100% - 60px); }

.section_photo_target, .section_movie_target { overflow: hidden; }

.girls-list-prof > span.name { max-width: 100px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.contents-back-btn > a { width: 150px; }

main { margin: 0; background: #fff; }

body.profile { padding: 0; -webkit-text-size-adjust: 100%; /************************************************************
ç™»éŒ²å¾Œãƒ—ãƒ­ãƒ•é–¢é€£   add21/04/28 iwane
************************************************************/ /************************************************************

201001 è¿½åŠ ã€€ãƒ‡ãƒãƒƒã‚°å‰ã«coverageç¢ºèªã—ã¦å‰Šé™¤

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

PC / ã‚¿ãƒ–ãƒ¬ãƒƒãƒˆ

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

WEBTC 3ã‚«ãƒ©ãƒ ã®å ´åˆ

******/ /***é…ä¿¡ç”¨***/ /************************************************************

ã‚¢ãƒ—ãƒªDLä¿ƒé€²ãƒ¬ã‚¤ã‚¢ã‚¦ãƒˆ

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

ã‚­ãƒ¼ãƒ¯ãƒ¼ãƒ‰

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

ãƒ©ã‚¤ãƒ–é…ä¿¡ ç„¡æ–™å‹•ç”»å†ç”Ÿãƒ€ã‚¤ã‚¢ãƒ­ã‚°

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

ãƒ“ãƒ‡ã‚ªãƒ»éŸ³å£°ä¼šè©± æ–°äººã‚­ãƒ£ãƒ³ãƒšãƒ¼ãƒ³ãƒ€ã‚¤ã‚¢ãƒ­ã‚°

************************************************************/ }
body.profile footer { display: none; }
body.profile header { background: linear-gradient(rgba(0, 0, 0, 0.3) 0%, transparent 100%); border: none; display: flex; justify-content: space-between; align-items: center; height: 50px; line-height: 1.5; position: fixed; top: 0; width: 100%; z-index: 2; }
body.profile header a { cursor: pointer; font-size: 10px; display: flex; align-items: center; position: relative; }
body.profile header.dark, body.profile header.fixed { background: rgba(0, 0, 0, 0.5); }
body.profile header img { width: 26px; height: 26px; }
body.profile header .logo a > img { height: 55px; }
body.profile header .back { background: rgba(0, 0, 0, 0.5); border-radius: 50%; margin: auto 15px auto 10px; width: 26px; height: 26px; justify-content: center; }
body.profile header .back > img { width: 20px; height: 20px; transform: rotate(180deg); }
body.profile header .home { margin-right: auto; }
body.profile header.dark .home, body.profile header.fixed .home { margin-right: 15px; }
body.profile header .fav { margin: auto 10px auto 15px; }
body.profile header .fav::before { content: ''; width: 26px; height: 26px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_favorite_wt.svg"); background-repeat: no-repeat; background-size: contain; }
body.profile header .fav.on::before { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_favorite_active.svg"); }
body.profile .header-girl-info { display: none; margin-right: auto; align-items: center; }
body.profile .header-girl-info .header-girl-info-img { margin-right: 10px; width: 40px; height: 40px; border-radius: 50%; background-size: cover; background-position: center; flex-shrink: 0; }
body.profile .header-girl-info img { margin-right: 10px; width: 40px; height: 40px; border-radius: 50%; }
body.profile .header-girl-info span { color: #fff; font-size: 15px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; word-break: break-all; }
body.profile .dark .header-girl-info, body.profile .fixed .header-girl-info { display: flex; }
body.profile .header-present-point { display: flex; align-items: center; justify-content: center; width: 100%; padding: 0 15px; }
body.profile .dark .header-present-point { padding-left: 0; }
body.profile .header-present-point a { display: flex; align-items: center; justify-content: space-around; box-sizing: border-box; width: 175px; padding: 5px; font-size: 11px; text-decoration: none; background: linear-gradient(90deg, #FFE838, #FFCA52); border-radius: 16px; color: #222222; }
body.profile .header-present-point .icon_point { display: block; width: 20px; height: 20px; border-radius: 10px; background-color: #fff; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_present_orange.svg"); background-repeat: no-repeat; background-size: 60%; background-position: center; }
body.profile .main-img-wrap { position: relative; overflow: hidden; width: 100vw; height: 100vw; margin-bottom: 10px; }
body.profile .main-img-wrap ul { display: flex; position: relative; background: #F5F5F5; }
body.profile .gradient-cover { position: absolute; background: linear-gradient(transparent 0%, rgba(128, 128, 128, 0.5) 100%); width: 100%; height: 50vw; top: 50vw; display: flex; align-items: flex-end; pointer-events: none; }
body.profile .main-img { width: 100vw; height: 100vw; background-size: cover; background-repeat: no-repeat; background-position: center; }
body.profile .content-info { position: absolute; top: 0; width: 100vw; height: 100vw; }
body.profile .content-info .play-btn, body.profile .content-info .check-content, body.profile .content-info .duration { pointer-events: none; }
body.profile .content-info .check-content, body.profile .item-wrap .check-content { position: absolute; top: 60%; left: 50%; transform: translate(-50%, -60%); background: rgba(250, 72, 93, 0.8); color: #fff; font-size: 15px; display: inline-flex; align-items: center; justify-content: center; width: 230px; height: 40px; border-radius: 20px; }
body.profile .item-wrap .check-content { /*	top: 100px;*/ }
body.profile .content-info .duration { position: absolute; bottom: 55px; right: 10px; background: rgba(0, 0, 0, 0.7); color: #fff; width: 60px; line-height: 25px; text-align: center; border-radius: 4px; font-size: 13px; }
body.profile .content-info .play-btn { position: absolute; width: 21%; top: 30%; left: 50%; transform: translate(-50%, -30%); }
body.profile .content-info .play-label { display: flex; justify-content: center; align-items: center; position: absolute; box-sizing: border-box; width: 200px; height: 30px; top: calc(40% + 30px); left: calc(50% - 100px); background-color: rgba(255, 255, 255, 0.8); border-radius: 15px; font-size: 15px; font-weight: 700; opacity: 0.75; }
body.profile .name-space-wrap { width: 100%; position: absolute; bottom: 3vw; pointer-events: none; }
body.profile .name-space { color: #fff; padding: 0 20px; display: flex; align-items: center; font-size: 14px; }
body.profile .name-space img { width: 15px; margin-left: 5px; }
body.profile .name-space span:first-of-type { font-size: 16px; margin-right: 5px; max-width: calc(100% - 100px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
body.profile .comment { background: rgba(255, 255, 255, 0.75); line-height: 35px; border-radius: 18px; padding: 0 10px; color: #333; font-size: 14px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; width: 90%; margin: auto 10px; }
body.profile .simple-photo-viewer .comment { position: absolute; top: 70%; }
body.profile .post-gallerys ul { display: flex; margin: 10px 10px 25px; }
body.profile .post-gallerys li { margin-right: 2.5%; }
body.profile .post-gallerys li:last-of-type { margin-right: 0; }
body.profile .post-gallerys a { position: relative; cursor: pointer; }
body.profile .post-gallerys .post-type { position: absolute; width: 15px; height: 15px; padding: 3px; left: -5px; bottom: -15px; border-radius: 50%; }
body.profile .post-gallerys .time-diff { position: absolute; bottom: -15px; right: 0; font-size: 9px; }
body.profile .post-gallerys .prf-img { position: absolute; box-sizing: border-box; width: calc(100% + 10px); height: 18px; line-height: 12px; padding: 3px; left: -5px; bottom: -15px; border-radius: 9px; font-size: 9px; text-align: center; color: #fff; background-color: #68B3FD; }
body.profile .post-gallerys .post-type.free, body.profile .gallary-modal-wrap .infto span.free { background: #34A5F7; }
body.profile .post-gallerys .post-type.pay, body.profile .gallary-modal-wrap .infto span.pay { background: #FA485D; }
body.profile .post-gallery-item { position: relative; box-sizing: border-box; width: calc(18vw - 4px); height: calc(18vw - 4px); border-radius: 10px; border: solid 3px #fff; background-repeat: no-repeat; background-size: cover; background-position: center; }
body.profile li.active .post-gallery-item { border: solid 3px #FFADB7; }
body.profile li.active .post-gallery-item.prf-item { border-color: #68B3FD; }
body.profile .post-gallerys-head { display: flex; justify-content: space-between; align-items: center; margin: 0 10px auto; }
body.profile .post-gallerys-head > span { font-size: 14px; color: #363636; display: flex; font-weight: 500; }
body.profile .post-gallerys-head a { font-size: 13px; color: #6363D6; border: solid 1px; width: 128px; line-height: 30px; border-radius: 15px; display: flex; justify-content: center; cursor: pointer; box-sizing: border-box; padding-right: 5px; }
body.profile .post-gallerys-head a span::after, body.profile .detail-head .more-post-list::after { content: ""; position: absolute; top: 0; right: 7px; bottom: 0; width: 14px; height: 14px; margin: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_right_arrow_blue.svg"); background-size: contain; }
body.profile .new-mark { position: absolute; width: 20px; left: -5px; top: -5px; }
body.profile .new-post-list-item { position: absolute; width: 32px; left: -10px; top: -10px; }
body.profile .detail-content.post-list { margin: 0 auto 0; padding: 0; }
body.profile .detail-content.post-list ul li:last-child { padding-right: 20px; }
body.profile .detail-content.post-list ul, body.profile .photo-viewer-modal-wrap ul { display: flex; position: relative; }
body.profile .photo-viewer-modal-wrap ul { height: 100vh; }
body.profile .detail-content.post-list ul { overflow-x: scroll; }
body.profile .detail-content.post-list ul::-webkit-scrollbar { display: none; }
body.profile .detail-content.post-list li { margin: 20px 20px 20px 0; }
body.profile .detail-content.post-list li:first-of-type { margin-left: 15px; }
body.profile .photo-viewer-modal-wrap li { margin: 10px 5vw; position: relative; transform-origin: top center; }
body.profile .photo-viewer-modal-wrap li img { display: block; width: 90vw; height: auto; border-radius: 10px; transform-origin: top; }
body.profile .photo-viewer-modal-wrap li .item-wrap { position: relative; }
body.profile .photo-viewer-modal-wrap li .touch-prohibit { position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; height: 100vh; }
body.profile .photo-viewer-modal-wrap li .first-last-text { position: absolute; color: #333; background: #fff; width: 232px; text-align: center; line-height: 42px; font-size: 13px; font-weight: 600; border-radius: 21px; left: 0; right: 0; top: 30px; margin: auto; pointer-events: none; opacity: 0; }
body.profile .detail-content.post-list .duration { color: #fff; width: 40px; line-height: 20px; text-align: center; border-radius: 5px; background: rgba(0, 0, 0, 0.7); font-size: 10px; position: absolute; bottom: 6px; right: 6px; }
body.profile .detail-content.post-list .play-btn { width: 40px; }
body.profile .latest-review-wrap { background: #F5F5F5; padding: 10px; border-bottom: solid 1px #ddd; border-top: solid 1px #ddd; }
body.profile .latest-review-head { display: flex; justify-content: space-between; align-items: center; }
body.profile .latest-review-head .review-cnt { margin-right: 10px; font-size: 14px; color: #333; font-weight: 500; }
body.profile .latest-review-head span:nth-of-type(2) { margin-right: auto; font-size: 13px; color: #888; }
body.profile .latest-review-head a.more { width: 100px; background: #fff; border: solid 1px #ddd; color: #333; display: flex; align-items: center; justify-content: center; height: 26px; border-radius: 13px; margin-right: 10px; position: relative; padding-right: 10px; font-size: 12px; }
body.profile .latest-review-head a.more span::after { position: absolute; right: 9px; width: 13px; height: 13px; margin: auto; background-size: contain; }
body.profile .latest-review-head a.more span::after { content: ""; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_right_arrow_gray.svg"); bottom: 7px; transform: rotate(90deg); }
body.profile .latest-review-head a.review, body.profile .detail-head a.review { background: #5675F8; display: flex; font-size: 12px; color: #fff; width: 119px; align-items: center; justify-content: center; height: 26px; border-radius: 13px; cursor: pointer; position: relative; }
body.profile .latest-review-head a.review.disable, body.profile .detail-head a.review.disable { background: #bbbbbb; }
body.profile a.review::before { content: ""; position: absolute; top: 0; left: 7px; bottom: 0; width: 16px; height: 16px; margin: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_review_write_wt.svg"); background-size: contain; }
body.profile a.review.send_review_dialog span, body.profile a.review.completed_send_review span, body.profile a.review.requier_not_met_send_review span, body.profile a.review.disable span { padding-left: 10px; font-size: 12px; }
body.profile .detail-head a.completed_send_review span::before { display: none; }
body.profile a.review.send_review_dialog span::before, body.profile a.review.requier_not_met_send_review span::before, body.profile a.review.disable span::before { content: none; }
body.profile a.review.done::before { content: none; }
body.profile .latest-review-content { display: flex; align-items: flex-start; margin: 10px auto; }
body.profile .latest-review-content .review { font-size: 12px; width: calc(100% - 50px); background: #fff; padding: 7px 10px; border-radius: 8px; overflow-wrap: break-word; line-height: 1.5; color: #666; }
body.profile .new-review { position: relative; }
body.profile .new-review::before { content: "NEW"; position: absolute; width: 34px; height: 12px; left: -3px; bottom: -7px; background-color: #55D8BF; color: #FFF; text-align: center; font-size: 8px; font-weight: bold; line-height: 12px; border-radius: 10px; }
body.profile .latest-review-content img, body.profile .detail-content.review-list .head > img { width: 19px; background: #B5BFC6; padding: 3px; border-radius: 50%; margin-right: 8px; }
body.profile .appeal-action-wrap ul { display: flex; padding: 13px 8px; border-bottom: 1px solid #ddd; }
body.profile .appeal-action-wrap li { width: 25%; }
body.profile .appeal-action-wrap li:last-of-type { border-right: none; }
body.profile .appeal-action-wrap a { display: flex; flex-direction: column; justify-content: center; align-items: center; color: #666; font-weight: 600; cursor: pointer; }
body.profile .appeal-action-wrap .disable a { color: #AAA; }
body.profile .appeal-action-wrap .appeal-action-icon { background: #F0F3FF; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 2px; }
body.profile .disable .appeal-action-icon { background: #F8F8F8; }
body.profile .appeal-action-wrap .appeal-action-icon.history:after, body.profile .appeal-action-wrap .appeal-action-icon.live-history:after { content: ''; background-size: cover; width: 28px; height: 28px; }
body.profile .appeal-action-wrap .appeal-action-icon.history:after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_history_blue.svg"); }
body.profile .appeal-action-wrap .disable .appeal-action-icon.history:after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_history_light_gray.svg"); }
body.profile .appeal-action-wrap .appeal-action-icon.live-history:after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_history_blue.svg"); }
body.profile .appeal-action-wrap .disable .appeal-action-icon.live-history:after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_history_gray.svg"); }
body.profile .appeal-action-wrap a > span > img { width: 28px; }
body.profile .prf-detail-wrap { padding-bottom: 10px; }
body.profile .detail-head { display: flex; justify-content: space-between; align-items: flex-end; border-bottom: 1px solid #ddd; padding: 20px 0 10px; margin: 0 10px; }
body.profile .detail-head.post-area { border-bottom: none; padding: 20px 0 0; }
body.profile .detail-head.nb { border: none; padding: 20px 0 0; }
body.profile .detail-head.prf, body.profile .detail-head.come { border-bottom: 1px solid #FFD3DA; }
body.profile .detail-head span { font-size: 15px; display: flex; align-items: center; font-weight: 500; }
body.profile .gallary-modal-head { top: 0; width: 100%; display: flex; align-items: center; background-color: #FFF; border-bottom: 1px solid #ddd; }
body.profile .gallary-modal-head .detail-head { padding: 0; height: 50px; align-items: center; width: 100%; }
body.profile .photo-edit { color: #B98339; display: flex; align-items: center; margin-left: 5px !important; }
body.profile .detail-head span.review_cnt { font-size: 13px; color: #888; margin: auto auto auto 5px; }
body.profile .post-gallerys-head > span:first-of-type::before, body.profile .detail-head span:first-of-type::before { content: ''; display: inline-block; margin-right: 5px; width: 24px; height: 24px; background-size: contain; }
body.profile .detail-head span.photo-edit::before { content: ''; display: inline-block; background-size: 70%; background-position: center; background-repeat: no-repeat; background-color: #FFEED6; border-radius: 100px; width: 36px; height: 36px; margin-right: 5px; }
body.profile .post-gallerys-head > span.photo::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_camera_pink.svg"); }
body.profile .detail-head span.prf::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_girl_pink.svg"); }
body.profile .detail-head span.come::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_pink.svg"); }
body.profile .detail-head span.memo::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_memo_blue.svg"); }
body.profile .detail-head span.p-mov::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_movie_pay_red.svg"); }
body.profile .detail-head span.f-mov::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_movie_free_blue.svg"); }
body.profile .detail-head span.p-photo::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_photo_pay_red.svg"); }
body.profile .detail-head span.f-photo::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_photo_free_blue.svg"); }
body.profile .detail-head span.diary::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_blog_blue.svg"); }
body.profile .detail-head span.review::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_review_blue.svg"); }
body.profile .detail-head span.rejection::before, body.profile .rejection_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_girl_kyohi_gray.svg"); }
body.profile .detail-head span.photo-edit::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_photo_edit.svg"); }
body.profile .detail-head a { display: flex; align-items: center; justify-content: center; }
body.profile .detail-head a.gallary-modal-close-btn { padding: 15px 0 15px 15px; }
body.profile .detail-head .play-vo-prf { background: #FC778C; font-size: 12px; color: #fff; width: 177px; height: 32px; border-radius: 20px; position: relative; box-sizing: border-box; padding-left: 15px; }
body.profile .detail-head .play-vo-prf::before { content: ""; position: absolute; top: 0; left: 12px; bottom: 0; width: 18px; height: 18px; margin: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_prf_voice_wt.svg"); background-size: contain; }
body.profile .detail-head .play-vo-prf.gray { background: #bbb; padding: 1px 0 0 0; pointer-events: none; }
body.profile .detail-head .play-vo-prf.gray::before { content: none; }
body.profile .detail-head .more-post-list { border: solid 1px #8484E6; color: #6363D6; width: 130px; height: 30px; border-radius: 15px; position: relative; font-size: 13px; box-sizing: border-box; padding-right: 5px; }
body.profile .detail-head .more-post-list.p_move, body.profile .detail-head .more-post-list.p_photo { border: solid 1px #F76451; color: #F76451; }
body.profile .detail-head .more-post-list.p_move::after, body.profile .detail-head .more-post-list.p_photo::after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_right_arrow_red.svg"); }
body.profile .prf-item-list { margin: 0 10px 20px; position: relative; display: flex; flex-direction: column; }
body.profile .prf-item-list.open { margin-bottom: 60px; }
body.profile .prf-item-list li { min-height: 20px; padding: 12px 0; display: flex; align-items: center; border-radius: 8px; }
body.profile .prf-item-list li div { display: flex; align-items: center; }
body.profile .prf-item-list li .list-left { width: 50%; }
body.profile .prf-item-list li .list-right { width: 50%; }
body.profile .prf-item-list li:nth-child(2n) { background: #FFF7FA; }
body.profile .prf-item-list li:last-of-type { margin-bottom: 0; }
body.profile .prf-item-list li span:first-of-type, body.profile .prf-item-list div span:first-of-type { margin-left: 10px; font-size: 12px; color: #FD5353; min-width: 65px; display: inline-block; align-self: flex-start; }
body.profile .prf-item-list li span:nth-of-type(2) { font-size: 13px; font-weight: 500; color: #333; overflow-wrap: anywhere; word-break: break-all; }
body.profile .detail-content { margin: 10px auto 0; padding: 0 10px 10px; word-break: break-all; overflow-wrap: anywhere; }
body.profile .detail-content.kyohi-content { border-bottom: none; }
body.profile .detail-comment { font-size: 14px; color: #333; }
body.profile form.memo { overflow-x: hidden; }
body.profile .memo textarea { appearance: none; outline: none; border: 1px solid #888; margin-bottom: 10px; border-radius: 10px; padding: 10px; line-height: 1.4; color: #333; font-family: 'Noto Sans JP'; font-size: 16px; transform: scale(0.8); width: 123%; margin: -10px 0 10px -11.5%; -webkit-appearance: none; }
body.profile .memo textarea::placeholder { color: #AAA; }
body.profile .memo input[type="submit"] { -webkit-appearance: none; border: none; margin-left: auto; display: block; width: 100px; height: 30px; color: #fff; background: #5675F8; border-radius: 15px; font-size: 13px; cursor: pointer; line-height: 30px; }
body.profile .post-list li { margin-bottom: 10px; padding-bottom: 10px; }
body.profile .review-list li { margin-bottom: 10px; padding-top: 10px; }
body.profile .review-list li { border-top: 1px solid #ddd; }
body.profile .review-list li:first-child { border-top: none; padding-top: 0; }
body.profile .post-list li > a { display: flex; }
body.profile .post-list .thumnail { width: 30vw; height: 30vw; border-radius: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; position: relative; display: flex; align-items: center; justify-content: center; }
body.profile .post-list .post-info { width: 60vw; margin-left: 10px; color: #888; display: flex; flex-direction: column; }
body.profile .post-info .title { font-size: 14px; color: #333; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 5px; }
body.profile .post-info .mess { -webkit-line-clamp: 2; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; line-height: 1.6; font-size: 13px; word-break: break-word; }
body.profile .post-info .view-price { margin-top: auto; display: flex; justify-content: space-between; align-items: center; }
body.profile .post-info .view-price span:nth-of-type(2) { margin: auto auto auto 0; }
body.profile .post-info .view-price span:nth-of-type(3) { color: #fff; width: 52px; line-height: 20px; text-align: center; border-radius: 5px; }
body.profile .post-info .view-price span:nth-of-type(3).free { background: #43A1FF; }
body.profile .post-info .view-price span:nth-of-type(3).pay { background: #F76451; }
body.profile #review-area { padding-top: 70px; margin-top: -50px; }
body.profile .review-list .name-date { display: flex; justify-content: space-between; align-items: center; font-size: 13px; }
body.profile .review-score { display: flex; align-items: center; margin: 5px 0; }
body.profile .review-score img { width: 16px; }
body.profile .review-list .name-date img { background: #B5BFC6; border-radius: 50%; width: 17px; padding: 1px; }
body.profile .review-list .name-date span:first-of-type { max-width: calc(100% - 100px); margin: auto auto auto 5px; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.profile .review-list .name-date span:last-of-type { color: #888; }
body.profile .review-list .description { font-size: 13px; color: #333; word-break: break-all; overflow-wrap: anywhere; }
body.profile .review-more, body.profile .add-rejection { margin: 20px auto auto; display: flex; justify-content: center; align-items: center; width: 180px; height: 36px; border-radius: 22px; }
body.profile .review-more { color: #6363D6; border: solid 1px #8484E6; cursor: pointer; font-size: 13px; }
body.profile .add-rejection { color: #F55656; border: solid 1px; cursor: pointer; }
body.profile .gallary-modal-wrap { position: absolute; z-index: -1; width: 100vw; transform: translate(0, 100%); transition: all .3s; background: #fff; display: none; }
body.profile .gallary-modal-wrap.open { z-index: 2; display: block; position: fixed; }
body.profile .photo-viewer-modal-wrap { background: #333; height: 100vh; overflow-y: hidden; display: none; position: fixed; top: 0; z-index: 2; width: 100vw; }
body.profile .gallary-modal-list { height: 80vh; padding-bottom: 20vh; overflow: auto; }
body.profile .simple-photo-viewer { background: #333; height: 90vh; width: 100vw; padding-bottom: 10vh; overflow-y: scroll; display: none; position: fixed; top: 0; z-index: 3; }
body.profile .simple-photo-viewer.open { display: block; }
body.profile .simple-photo-viewer .photo { width: 100%; height: 100%; background-size: contain; display: block; background-repeat: no-repeat; background-position: top; }
body.profile .viewer-header { display: flex; align-items: center; margin: 10px; color: #fff; }
body.profile .gallary-modal-head .viewer-header { width: 100%; }
body.profile .viewer-header .prf-icon-img { margin-right: 10px; width: 46px; height: 46px; border-radius: 50%; background-size: cover; background-position: center; flex-shrink: 0; }
body.profile .viewer-header .prf-icon { width: 46px; border-radius: 50%; margin-right: 10px; }
body.profile .viewer-header p { font-size: 14px; margin-right: auto; overflow: hidden; word-break: break-all; }
body.profile .viewer-header p span:last-of-type { font-size: 13px; }
body.profile .viewer-header p.gallary { color: #333; }
body.profile .viewer-header p.gallary span:first-child { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-break: break-all; }
body.profile .viewer-close { margin-right: 10px; background: #fff; border-radius: 50%; padding: 3px; }
body.profile .viewer-close.gallary { border: solid 1px #333; }
body.profile .viewer-close img { width: 28px; }
body.profile .gallary-modal-close-btn img { width: 14px; border: 1px solid #707070; border-radius: 50%; padding: 3px; background: #fff; margin-right: 10px; }
body.profile .gallary-modal-wrap ul { display: flex; flex-wrap: wrap; margin: 2vw 0 2vw 2vw; }
body.profile .gallary-modal-wrap ul li { margin-bottom: 6px; }
body.profile .gallary-modal-wrap .thumnail { width: 31vw; height: 31vw; background-size: cover; background-repeat: no-repeat; background-position: center; border-radius: 3vw; margin: 0 1.6vw 1.6vw 0; position: relative; display: flex; place-items: center; }
body.profile .gallary-modal-wrap .play-btn { width: 40px; margin: auto; }
body.profile .gallary-modal-wrap .infto { position: absolute; bottom: 0; margin: 0 auto 3px; width: 100%; display: flex; justify-content: space-between; height: 100%; }
body.profile .gallary-modal-wrap .new-mark { width: 32px; top: 30px; }
body.profile .gallary-modal-wrap .infto span { color: #fff; width: 40px; line-height: 20px; text-align: center; border-radius: 5px; background: rgba(0, 0, 0, 0.7); font-size: 10px; position: absolute; }
body.profile .gallary-modal-wrap .infto span.duration { bottom: 3px; right: 3px; }
body.profile .gallary-modal-wrap .infto span.pay, body.profile .gallary-modal-wrap .infto span.free { display: flex; justify-content: center; align-items: center; left: -8px; top: -5px; width: 36px; height: 36px; line-height: 12px; border-radius: 50%; }
body.profile .gallary-modal-wrap .detail-head { border-bottom: none; border-top: 1px solid #ddd; }
body.profile .gallary-modal-wrap .detail-head:first-of-type { border-top: none; }
body.profile .fav_dialog.open, body.profile .point_dialog.open { display: block; }
body.profile .fav_dialog .dialog, body.profile .point_dialog .dialog { padding: 10px 0; }
body.profile .template_dialog { overflow-y: scroll; }
body.profile .fav_dialog .dialog-head, body.profile .review_dialog .dialog-head, body.profile .template_dialog .dialog-head, body.profile .rejection_dialog .dialog-head, body.profile .voice_dialog .dialog-head, body.profile .point_dialog .dialog-head { margin: auto auto 15px; border-bottom: 1px solid #ccc; width: 90%; text-align: left; font-size: 14px; display: flex; align-items: center; padding-bottom: 3px; }
body.profile .fav_dialog .dialog-head::before, body.profile .review_dialog .dialog-head::before, body.profile .template_dialog .dialog-head::before, body.profile .rejection_dialog .dialog-head::before, body.profile .voice_dialog .dialog-head::before, body.profile .point_dialog .dialog-head::before { content: ''; display: inline-block; margin-right: 3px; width: 24px; height: 24px; background-size: contain; }
body.profile .review_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_review_write.svg"); }
body.profile .template_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_template.svg"); }
body.profile .fav_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_favorite_ng_gray.svg"); }
body.profile .voice_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_tel.svg"); }
body.profile .point_dialog .dialog-head::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_point_gray.svg"); }
body.profile .fav_dialog .dialog-mess { font-size: 14px; }
body.profile .dialog-center { display: flex; justify-content: center; }
body.profile .point_dialog .dialog-mess { font-size: 14px; font-weight: 500; text-align: left; margin-bottom: 0; }
body.profile .review_dialog .dialog, body.profile .rejection_dialog .dialog { top: 20%; padding: 10px 0; }
body.profile .template_dialog .dialog { top: 10%; margin: 0 auto 30px; padding: 10px 0; }
body.profile .voice_dialog .dialog { padding: 10px 0; }
body.profile .web-video-dialog.dialog { font-weight: 500; padding: 18px; display: flex; flex-direction: column; align-items: center; width: calc(90% - 36px); }
body.profile .web-video-dialog.dialog.ios, body.profile .web-video-dialog.dialog.android { top: calc(50% - 156px); }
body.profile .web-video-dialog.dialog.ios-first { width: calc(100% - 26px); border-radius: 0; top: calc(50% - 243px); height: calc(486px - 26px); padding: 13px; }
body.profile .web-video-dialog.dialog.android-first { top: calc(50% - 210.5px); }
body.profile .web-video-dialog.dialog.ios-first .dialog-close-btn { right: 14px; }
body.profile .web-video-dialog p.web-video-dialog-notice { text-align: left; display: flex; align-items: center; margin-bottom: 35px; }
body.profile .web-video-dialog p.web-video-dialog-notice img { background-color: #F53A4FCC; padding: 2px; width: 24px; height: 24px; border-radius: 50%; margin-right: 10px; }
body.profile .ios-first.web-video-dialog p.web-video-dialog-notice { margin: 0 auto 7.5px 0; }
body.profile .android-first.web-video-dialog p.web-video-dialog-notice { margin: 0 auto 21px 0; }
body.profile .web-video-dialog a.blue { margin: 0; width: 225px; height: 56px; display: flex; align-items: center; justify-content: center; border-radius: 28px; }
body.profile .web-video-dialog a.blue::before { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/webrtc_video/icon_video_white.svg"); display: block; width: 30px; height: 30px; background-size: contain; background-repeat: no-repeat; background-position: center; margin-right: 20px; }
body.profile .web-video-dialog a.cancel { margin: 25px auto 22px; width: 133px; height: 36px; line-height: 36px; }
body.profile .web-video-dialog a.gray { margin: 23px auto 0; width: 225px; height: 43px; line-height: 43px; text-align: center; background: #AFAFAF; color: #fff; border-radius: 28px; font-size: 12px; }
body.profile .ios-first .step-wrap { display: flex; width: 100%; justify-content: center; }
body.profile .ios-first .step-header { margin: 0 0 3.5px; font-size: 10px; height: 45px; text-align: left; display: flex; align-items: center; }
body.profile .ios-first .step-header::before { width: 22px; height: 22px; background-color: #5675F9; border-radius: 50%; color: #fff; text-align: center; line-height: 22px; margin-right: 6px; font-size: 11px; }
body.profile .ios-first .step-item:nth-of-type(1) .step-header::before { content: '1'; }
body.profile .ios-first .step-item:nth-of-type(2) .step-header::before { content: '2'; }
body.profile .ios-first .step-item:nth-of-type(3) .step-header::before { content: '3'; }
body.profile .ios-first .step-item img { display: block; width: 100%; margin: auto; max-height: 220px; max-width: 130px; }
body.profile .ios-first .re-notice { padding-top: 15px; }
body.profile .ios-first .re-notice img { width: 182px; display: block; margin: auto; }
body.profile .ios-first .re-notice p:first-of-type { margin-bottom: 4px; font-size: 13px; }
body.profile .ios-first .re-notice p:first-of-type b { color: #FF3434; font-size: 15px; }
body.profile .ios-first .re-notice p:last-of-type { margin: 8px 0 0; font-size: 13px; }
body.profile .ios-first hr, body.profile .android-first hr { height: 8px; width: calc(100% + 35px); appearance: none; padding: 0; border: 0; background: #EEEEEE; }
body.profile .ios-first hr { margin: 15px 0 25px; }
body.profile .android-first hr { margin: 20px 0 16px; }
body.profile .android-first .err-image-wrap { display: flex; align-items: flex-start; }
body.profile .android-first .err-image-wrap img { display: block; width: 127px; height: 224px; }
body.profile .android-first .err-image-wrap .txt-wrap { margin: 20px auto auto 9px; font-size: 12px; width: 165px; }
body.profile .android-first .err-image-wrap .txt-wrap p { text-align: left; margin: auto; }
body.profile .android-first .err-image-wrap .txt-wrap a { width: 165px; height: 42px; background: #40C779; color: #fff; margin: auto; display: flex; justify-content: center; align-items: center; position: relative; }
body.profile .android-first .err-image-wrap .txt-wrap a::after { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_wt.svg"); width: 17px; height: 17px; background-size: contain; background-repeat: no-repeat; background-position: center; display: block; position: absolute; right: 7px; }
body.profile .android-first-arrow-box { position: relative; background: #fff; border: 1px solid #AAAAAA; margin-bottom: 20px; display: flex; padding: 13px 0; border-radius: 10px; width: 157px; margin: 0 auto 20px; }
body.profile .android-first-arrow-box:after, body.profile .android-first-arrow-box:before { top: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; }
body.profile .android-first-arrow-box:after { border-color: rgba(255, 255, 255, 0); border-top-color: #fff; border-width: 8px; margin-left: -8px; }
body.profile .android-first-arrow-box:before { border-color: rgba(170, 170, 170, 0); border-top-color: #AAAAAA; border-width: 9px; margin-left: -9px; }
@media screen and (max-width: 359px) { body.profile .web-video-dialog.dialog.ios-first { height: calc(440px - 26px); top: calc(50% - 220px); } }
@media screen and (max-width: 360px) { body.profile .web-video-dialog p.web-video-dialog-notice { font-size: 13px; }
  body.profile .web-video-dialog p.web-video-dialog-notice img { margin-right: 5px; width: 22px; height: 22px; }
  body.profile .ios-first .step-header::before { margin-right: 2px; width: 16px; height: 16px; line-height: 16px; }
  body.profile .web-video-dialog.dialog.android-first { top: calc(50% - 183.5px); }
  body.profile .web-video-dialog.dialog.ios-first { top: calc(50% - 203px); height: calc(406px - 26px); }
  body.profile .android-first .err-image-wrap img { width: 100px; height: 176px; }
  body.profile .web-video-dialog.dialog.ios-first .wait-text-alert { margin-top: 0; } }
@media screen and (min-width: 400px) { body.profile .web-video-dialog.dialog.ios-first { height: calc(520px - 26px); top: calc(50% - 260px); } }
@media screen and (max-height: 600px) { body.profile .web-video-dialog.dialog.ios-first { height: calc(440px - 26px); top: calc(50% - 220px); }
  body.profile .ios-first.web-video-dialog p.web-video-dialog-notice { margin-bottom: 2px; font-size: 12px; }
  body.profile .ios-first .re-notice { padding-top: 5px; }
  body.profile .ios-first .re-notice p:first-of-type b { font-size: 13px; }
  body.profile .ios-first .re-notice img { width: 130px; }
  body.profile .ios-first .re-notice p:last-of-type { margin: 4px 0 8px; font-size: 12px; }
  body.profile .ios-first hr { display: none; }
  body.profile .ios-first .web-video-dialog a.blue { width: 200px; height: 40px; } }
body.profile .textarea-center { display: flex; justify-content: center; }
body.profile .review_dialog .dialog-inner, body.profile .template_dialog .dialog-inner, body.profile .rejection_dialog .dialog-inner { margin: auto; }
body.profile .review_dialog textarea, body.profile .template_dialog textarea, body.profile .rejection_dialog textarea { appearance: none; outline: none; width: 104%; border: 1px solid #888; border-radius: 5px; padding: 10px; color: #333; font-family: 'Noto Sans JP'; margin: auto; display: flex; line-height: 1.4; font-size: 16px; transform: scale(0.865); -webkit-appearance: none; }
body.profile .review_dialog textarea::placeholder, body.profile .template_dialog textarea::placeholder, body.profile .rejection_dialog textarea::placeholder { color: #AAA; }
body.profile .review_dialog .notcie-wrap { margin: 10px auto; }
body.profile .review_dialog .notice { color: #FA4343; }
body.profile .review_dialog img { width: 25px; height: 25px; }
body.profile .dialog p.recommend-level-wrap { display: flex; justify-content: center; align-items: center; margin: 10px auto 15px; }
body.profile .recommend-level { display: flex; justify-content: space-evenly; width: 160px; margin-left: 5px; }
body.profile .dialog a.blue.no { opacity: .4; }
body.profile .template_dialog input[type="radio"] { display: none; }
body.profile .template_dialog .request-mess { display: flex; align-items: center; }
body.profile .template_dialog .request-mess::before { content: ''; width: 15px; height: 15px; border-radius: 50%; box-shadow: 0 0 0 1px #ddd inset; }
body.profile .template_dialog input[type="radio"]:checked + .request-mess { color: #7878E6; }
body.profile .template_dialog input[type="radio"]:checked + .request-mess::before { content: ''; width: 15px; height: 15px; border-radius: 50%; box-shadow: 0 0 0 1px #7878E6 inset, 0 0 0 3px #fff inset, 0 0 0 14px #7878E6 inset; }
body.profile .template_dialog li { width: 90%; margin: auto; }
body.profile .template_dialog li:last-of-type { margin-bottom: 10px; }
body.profile .prf-detail-btn-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 0; padding: 20px 0 0; background-color: #F0F0F3; }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box { display: flex; justify-content: space-between; align-items: center; box-sizing: border-box; width: 300px; height: 70px; border: 1px solid #707070; border-radius: 11px; background-color: #fff; }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box a { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100px; height: 56px; }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box a:before { display: block; content: ""; width: 40px; height: 25px; margin-bottom: 10px; background-size: contain; background-repeat: no-repeat; background-position: center; }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box .add-fav-btn:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_favorite_orange_off.svg"); }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box .add-fav-btn.on:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_favorite_active.svg"); }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box .want-talk-btn:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_vibration_blue.svg"); }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box .want-talk-btn.disable:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_vibration_light_gray.svg"); }
body.profile .prf-detail-btn-wrap .prf-detail-btn-box .add-rejection-btn:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_girl_kyohi_red.svg"); }
body.profile .prf-detail-btn-box .add-fav-btn.on .off-txt, body.profile .prf-detail-btn-box .add-fav-btn .on-txt { display: none; }
body.profile .prf-detail-btn-box .add-fav-btn .off-txt, body.profile .prf-detail-btn-box .add-fav-btn.on .on-txt { display: inline; }
body.profile .prf-detail-btn-box .want-talk-btn { border-left: 1px solid #888888; border-right: 1px solid #888888; }
body.profile .prf-detail-btn-box .want-talk-btn.disable { pointer-events: none; color: #AAA; }
body.profile .prf-detail-foot { padding: 35px 0 160px; background: #F5F5F5; display: flex; place-content: center; }
body.profile .prf-detail-foot a { background: #fff; width: 180px; line-height: 36px; text-align: center; border-radius: 18px; border: solid 1px; color: #333; }
body.profile .app-and-mess-wrap { position: fixed; bottom: 50px; display: flex; align-items: flex-end; width: 100%; justify-content: space-around; }
body.profile .app-and-mess-wrap a.video, body.profile .app-and-mess-wrap a.voice, body.profile .app-and-mess-wrap a.mess { display: flex; flex-direction: column; width: 80px; height: 80px; justify-content: center; align-items: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); border-radius: 50%; color: #fff; font-size: 11px; cursor: pointer; }
body.profile .app-and-mess-wrap a.video img, body.profile .app-and-mess-wrap a.voice img, body.profile .app-and-mess-wrap a.mess img { width: 35px; }
body.profile .app-and-mess-wrap a.video { background: rgba(245, 58, 79, 0.8); }
body.profile .app-and-mess-wrap a.voice { background: rgba(250, 134, 35, 0.8); }
body.profile .app-and-mess-wrap a.mess { background: rgba(74, 219, 191, 0.9); }
body.profile .app-and-mess-wrap a.video.no_waiting, body.profile .app-and-mess-wrap a.voice.no_waiting { background: rgba(128, 128, 128, 0.8); }
body.profile .app-and-mess-wrap a.want-talk { height: 74px; background: #fff; width: 211px; border: solid 2px rgba(86, 117, 248, 0.4); border-radius: 38px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); display: flex; align-items: center; justify-content: center; margin-right: -20px; }
body.profile .want-talk img { background: #F0F3FF; width: 28px; padding: 8px; border-radius: 50%; margin-left: -8px; }
body.profile .want-talk div { margin-left: 10px; }
body.profile .want-talk div p { color: #3C3C3C; font-size: 12px; font-weight: 500; }
body.profile .want-talk div span { color: #888; }
body.profile .prev-next-wrap { position: fixed; width: 100%; bottom: 225px; z-index: 2; }
body.profile .prev-next-wrap a { position: absolute; width: 32px; height: 68px; background: rgba(56, 46, 52, 0.6); color: #fff; display: flex; align-items: center; backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
body.profile .prev-next-wrap a span { writing-mode: vertical-lr; margin-left: 6px; letter-spacing: 1px; }
body.profile .prev-next-wrap a span::before { content: ''; width: 14px; height: 14px; background-repeat: no-repeat; background-size: contain; display: inline-block; }
body.profile .prev-next-wrap a.prev span::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_prf_arrow_left_wt.svg"); }
body.profile .prev-next-wrap a.next span::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_prf_arrow_right_wt.svg"); margin-left: 3px; }
body.profile .prev-next-wrap a.prev { border-radius: 0 34px 34px 0; }
body.profile .prev-next-wrap a.next { right: 0; border-radius: 34px 0 0 34px; }
body.profile .open_modal > .prev-next-wrap { display: none; }
body.profile .prev-next-wrap-new { position: fixed; width: 100%; bottom: calc(50% - 25px); z-index: 2; }
body.profile .prev-next-wrap-new a { display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; width: 45px; height: 55px; background: rgba(56, 46, 52, 0.6); color: #fff; font-size: 14px; backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
body.profile .prev-next-wrap-new a span::before { content: ''; width: 18px; height: 18px; background-repeat: no-repeat; background-size: contain; display: inline-block; }
body.profile .prev-next-wrap-new a.prev span::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_prf_arrow_left_wt.svg"); }
body.profile .prev-next-wrap-new a.next span::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_prf_arrow_right_wt.svg"); margin-left: 3px; }
body.profile .prev-next-wrap-new a.prev { border-radius: 0 10px 10px 0; }
body.profile .prev-next-wrap-new a.next { right: 0; border-radius: 10px 0 0 10px; }
body.profile .open_modal > .prev-next-wrap { display: none; }
body.profile .invitation-pt-wrap, body.profile .invitation-alert-wrap { position: fixed; bottom: 140px; width: 100%; }
body.profile .invitation-pt, body.profile .invitation-alert { display: flex; width: 230px; background: rgba(255, 114, 131, 0.9); color: #fff; margin: auto; height: 50px; justify-content: center; align-items: center; border-radius: 10px; }
body.profile .invitation-pt img { background: #fff; padding: 7px; width: 22px; height: 22px; border-radius: 9px; margin-right: 7px; }
body.profile .invitation-alert img { background: #fff; padding: 5px; width: 26px; height: 26px; border-radius: 9px; margin-right: 7px; }
body.profile .invitation-pt div { margin-right: 10px; }
body.profile .invitation-pt p:first-of-type { font-size: 12px; }
body.profile .invitation-pt p:last-of-type { font-size: 11px; opacity: .8; }
body.profile .invitation-alert { background: rgba(255, 225, 90, 0.9); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); color: #666; padding: 5px; }
body.profile .free-container ~ .detail-gallery { display: none; }
body.profile .from-girl-jump-dialog { display: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 3; }
body.profile .from-girl-jump-dialog .can-talk-wrap, body.profile .from-girl-jump-dialog .not-talk-wrap { display: none; }
body.profile .from-girl-jump-dialog.open, body.profile .from-girl-jump-dialog .can-talk-wrap.open, body.profile .from-girl-jump-dialog .not-talk-wrap.open { display: block; }
body.profile .from-girl-jump-dialog .back-screen { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.5); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
body.profile .from-girl-jump-dialog .back-screen:before { display: block; position: absolute; content: ""; width: 70px; height: 35px; top: 20px; left: 15px; background-image: url("/assets/vivo_0218/img/lp/lp25/logo_vivo_white.svg"); background-size: contain; background-repeat: no-repeat; }
body.profile .from-girl-jump-dialog .head-parent { box-sizing: border-box; position: absolute; width: 230px; height: 125px; left: calc(50% - 115px); }
body.profile .from-girl-jump-dialog .head-parent.can-talk { top: 140px; }
body.profile .from-girl-jump-dialog .animation-box_1 { display: flex; justify-content: center; align-items: flex-end; position: absolute; box-sizing: border-box; width: 230px; height: 125px; top: 60px; left: 0; margin: 0; padding: 0 0 20px; opacity: 0; color: #fff; font-size: 20px; background-image: url("/assets/vivo_0218/img/lp/lp25/img_border_white_gap.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; animation: animation_fadein 1s ease-in-out 0.5s; animation-fill-mode: forwards; }
body.profile .from-girl-jump-dialog .animation-box_1:before { display: block; position: absolute; content: ""; width: 54px; height: 54px; top: -27px; left: 88px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_check_blue_circle.svg"); background-size: contain; background-repeat: no-repeat; }
body.profile .from-girl-jump-dialog .balloon-parent { display: block; position: absolute; width: 200px; height: 75px; }
body.profile .from-girl-jump-dialog .balloon-parent .animation-box_2 { display: flex; justify-content: center; align-items: center; position: absolute; box-sizing: border-box; width: 200px; height: 75px; top: 60px; left: 0; margin: 0; padding: 20px; opacity: 0; color: #fff; font-size: 15px; background-color: #1060FB; border-radius: 10px; animation: animation_fadein 1s ease-in-out 1.5s; animation-fill-mode: forwards; z-index: 4; }
body.profile .from-girl-jump-dialog .balloon-parent .animation-box_2:after { display: block; position: absolute; content: ""; width: 16px; height: 16px; bottom: -8px; left: 40px; background-color: #1060FB; transform: rotate(45deg); }
body.profile .from-girl-jump-dialog div .caption-parent { display: block; position: absolute; width: 170px; height: 40px; }
body.profile .from-girl-jump-dialog .can-talk-wrap .caption-parent { right: 10%; }
body.profile .from-girl-jump-dialog .not-talk-wrap .caption-parent { top: calc(100vh + 10px); left: calc(50% - 100px); }
body.profile .from-girl-jump-dialog .can-talk-wrap .caption-parent .animation-box_3, body.profile .from-girl-jump-dialog .not-talk-wrap .caption-parent .animation-box_5 { position: absolute; box-sizing: border-box; height: 40px; top: 60px; left: 0; opacity: 0; color: #fff; font-size: 13px; animation: animation_fadein 1s ease-in-out 2.5s; animation-fill-mode: forwards; }
body.profile .from-girl-jump-dialog .can-talk-wrap .caption-parent .animation-box_3 { display: block; width: 170px; text-indent: -13px; padding-left: 13px; }
body.profile .from-girl-jump-dialog .not-talk-wrap .caption-parent .animation-box_5 { display: flex; justify-content: space-between; width: 200px; }
body.profile .from-girl-jump-dialog .not-talk-wrap .caption-parent .animation-box_5:before { display: block; content: ""; width: 40px; height: 40px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_finger_touch_white.svg"); background-size: contain; background-repeat: no-repeat; }
body.profile .from-girl-jump-dialog .not-talk-wrap .caption-parent .animation-box_5:after { position: absolute; content: ""; width: 0px; height: 0px; opacity: 0; border: 2px solid #fff; border-radius: 50%; top: 1px; left: 15px; animation: animation_touch 2s ease-out 3.5s infinite; }
body.profile .from-girl-jump-dialog .prf-parent { display: block; position: absolute; box-sizing: border-box; width: 230px; height: 230px; left: calc(50% - 115px); }
body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 { display: flex; flex-wrap: wrap; justify-content: center; position: absolute; box-sizing: border-box; width: 230px; height: 230px; top: 60px; left: 0; opacity: 0; color: #fff; font-size: 13px; animation: animation_fadein 1s ease-in-out 1.5s; animation-fill-mode: forwards; }
body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-img { display: block; width: 110px; height: 110px; border-radius: 55px; background-size: contain; background-repeat: no-repeat; }
body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-balloon { display: flex; position: relative; justify-content: center; align-items: center; box-sizing: border-box; width: 230px; height: 80px; top: 0; left: 0; margin: 0; padding: 20px 0; color: #fff; font-size: 15px; background-color: #1060FB; border-radius: 10px; }
body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-balloon:after { display: block; position: absolute; content: ""; width: 16px; height: 16px; top: -8px; left: 107px; background-color: #1060FB; transform: rotate(45deg); }
@keyframes animation_fadein { 0% { opacity: 0; top: 60px; }
  100% { opacity: 1; top: 0; } }
@keyframes animation_touch { 0% { width: 0px; height: 0px; opacity: 0; top: 1px; left: 15px; }
  1% { width: 0px; height: 0px; opacity: 1; top: 1px; left: 15px; }
  50% { width: 46px; height: 46px; opacity: 0; top: -22px; left: -8px; }
  100% { width: 0px; height: 0px; opacity: 0; top: 1px; left: 15px; } }
@media screen and (max-width: 350px) { body.profile .from-girl-jump-dialog .back-screen:before { width: 50px; height: 25px; }
  body.profile .from-girl-jump-dialog .head-parent { width: 200px; height: 110px; left: calc(50% - 100px); }
  body.profile .from-girl-jump-dialog .head-parent.can-talk { top: 90px; }
  body.profile .from-girl-jump-dialog .animation-box_1 { width: 200px; height: 100px; font-size: 18px; }
  body.profile .from-girl-jump-dialog .animation-box_1:before { width: 48px; height: 48px; top: -24px; left: 76px; }
  body.profile .from-girl-jump-dialog .prf-parent { width: 200px; height: 200px; left: calc(50% - 100px); }
  body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 { width: 200px; height: 200px; }
  body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-img { width: 100px; height: 100px; border-radius: 50px; }
  body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-balloon { width: 200px; height: 70px; font-size: 13px; padding: 15px 0; }
  body.profile .from-girl-jump-dialog .prf-parent .animation-box_4 .animation-prf-balloon:after { left: 92px; } }
body.profile .thumnail-new { width: 237px; height: 304px; border-radius: 10px; position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; }
body.profile .thumnail-gradation-new { width: 237px; height: 152px; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.35)); border-radius: 10px; position: absolute; left: 0; right: 0; bottom: 0; margin: auto; pointer-events: none; word-break: break-all; }
body.profile .photo-viewer-modal-wrap .slide-wrap { overflow: hidden; }
body.profile .photo-viewer-modal-wrap .thumnail-new { width: 90vw; height: 90vw; }
body.profile .photo-viewer-modal-wrap .thumnail-gradation-new { width: 100%; }
body.profile .view-price-new { width: 40px; height: 40px; border-radius: 40px; background: #FA485D; color: #FFF; position: absolute; top: -8px; left: -12px; display: flex; align-items: center; justify-content: center; text-align: center; line-height: 12px; }
body.profile .view-price-new.free { background: #34A5F7; }
body.profile .new-post-list-item-new, body.profile .slide-list .new-post-list-item-new { width: 40px; height: 40px; position: absolute; top: 37px; left: -12px; }
body.profile .post-info-new { color: #FFF; line-height: 1.4; position: absolute; bottom: 0; margin: 10px; pointer-events: none; overflow-wrap: anywhere; }
body.profile .post-info-new .title-new { font-size: 14px; font-weight: 500; height: 20px; text-overflow: ellipsis; overflow: hidden; margin-bottom: 3px; }
body.profile .post-info-new .mess-new { font-size: 13px; font-weight: 400; height: 38px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-bottom: 3px; }
body.profile .detail-content.post-list .duration, body.profile .slide-list .duration { color: #fff; width: 40px; line-height: 20px; text-align: center; border-radius: 5px; background: rgba(0, 0, 0, 0.7); font-size: 10px; position: absolute; top: 6px; right: 6px; height: 22px; }
body.profile .detail-content.post-list .play-btn, body.profile .slide-list .play-btn { width: 64px; height: 64px; position: absolute; top: -15%; right: 0; bottom: 0; left: 0; margin: auto; }
body.profile .slide-list .play-btn { background-repeat: no-repeat; background-position: center; background-size: contain; }
body.profile .slide-list .new-post-list-item-new, body.profile .slide-list .view-price-new, body.profile .slide-list .play-btn, body.profile .slide-list .duration { z-index: 1; }
body.profile .pc-tab .app-and-mess-wrap, body.profile .pc-tab .gallary-modal-wrap, body.profile .pc-tab .photo-viewer-modal-wrap, body.profile .pc-tab .photo-viewer-modal-wrap .photo, body.profile .pc-tab main.open_modal, body.profile .pc-tab .prev-next-wrap, body.profile .pc-tab .invitation-pt-wrap, body.profile .pc-tab header, body.profile .pc-tab footer { max-width: 350px; }
body.profile .pc-tab .main-img-wrap, body.profile .pc-tab .main-img, body.profile .pc-tab .content-info { width: 350px; height: 350px; }
body.profile .pc-tab .gradient-cover { width: 350px; height: 175px; top: 175px; }
body.profile .pc-tab .post-gallery-item { width: 53px; height: 53px; }
body.profile .pc-tab .post-gallerys li { margin-right: 8px; }
body.profile .pc-tab .post-list .thumnail { width: 100px; height: 100px; }
body.profile .pc-tab .post-list .post-info { width: 230px; }
body.profile .pc-tab .photo-viewer-modal-wrap { overflow-x: hidden; }
body.profile .pc-tab .gallary-modal-wrap ul { margin: 10px 0 10px 10px; }
body.profile .pc-tab .gallary-modal-wrap .thumnail { width: 104px; height: 104px; border-radius: 10px; margin: 0 3px 3px 0; }
body.profile .pc-tab .photo-viewer-modal-wrap li img { width: 310px; }
body.profile .pc-tab .photo-viewer-modal-wrap li { margin: 10px 20px; }
body.profile .app-browser-layout { display: flex; flex-direction: column; align-items: center; margin-top: 10px; }
body.profile .app-and-mess-wrap a.browser-video { background: rgba(245, 58, 79, 0.8); display: flex; flex-direction: column; width: 80px; height: 80px; justify-content: center; align-items: center; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); border-radius: 50%; color: #fff; font-size: 11px; cursor: pointer; }
body.profile .app-browser-video { margin-bottom: 15px; }
body.profile .app-video-browser { display: flex; flex-direction: column; align-items: center; background-color: rgba(255, 100, 100, 0.8); height: 78px; width: 66px; color: #fff; border-radius: 10px; text-align: center; font-size: 10px; margin-right: 18px; }
body.profile .app-video { display: flex; flex-direction: column; align-items: center; background-color: rgba(93, 123, 255, 0.8); height: 78px; width: 66px; color: #fff; border-radius: 10px; text-align: center; font-size: 10px; }
body.profile .app-voice { display: flex; flex-direction: column; align-items: center; background-color: rgba(245, 131, 71, 0.8); height: 78px; width: 66px; color: #fff; border-radius: 10px; text-align: center; font-size: 10px; margin-right: 18px; }
body.profile .app-mailbox { display: flex; flex-direction: column; align-items: center; background-color: rgba(74, 219, 191, 0.8); height: 78px; width: 66px; color: #fff; border-radius: 10px; text-align: center; font-size: 10px; }
body.profile .app-and-mess-wrap .app-video-browser img, body.profile .app-and-mess-wrap div.app-video img { width: 24px; height: 24px; background-color: #fff; padding: 5px; border-radius: 30px; margin: 5px 0; }
body.profile .app-and-mess-wrap a.app-voice img, body.profile .app-and-mess-wrap a.app-mailbox img { width: 24px; height: 24px; background-color: #fff; padding: 5px; border-radius: 30px; margin: 5px 0 10px; }
body.profile .t_class .no_waiting, body.profile .app-video.no_waiting, body.profile .app-voice.no_waiting { background-color: rgba(166, 168, 180, 0.8); }
body.profile .app-video span.app { margin-top: 5px; }
body.profile .wait-text-alert { margin: 20px auto; font-size: 14px; text-align: center; display: flex; justify-content: center; align-items: center; }
body.profile .circle-wrap { margin: 0px auto; width: 64px; height: 16px; display: flex; align-items: center; justify-content: space-between; }
body.profile .circle { background: #333; display: block; border-radius: 50%; opacity: 0; animation: 1.5s fade infinite; }
body.profile .circle.small { width: 4px; height: 4px; animation-delay: .5s; }
body.profile .circle.middle { width: 12px; height: 12px; animation-delay: 1s; }
body.profile .circle.large { width: 16px; height: 16px; animation-delay: 1.5s; }
body.profile .new-girl-badge { position: relative; }
body.profile .new-girl-badge:after { display: block; position: absolute; content: ""; width: 40px; height: 50px; top: -16px; right: -14px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_rookie_30pt_off.svg"); background-size: contain; background-repeat: no-repeat; background-position: center; }
@keyframes fade { 0% { opacity: .8; }
  100% { opacity: 0; } }
body.profile .three_column_class div.app-video, body.profile .three_column_class a.app-voice, body.profile .three_column_class a.app-mailbox { width: 86px !important; }
body.profile .three_column_class span { font-size: 12px !important; }
body.profile .three_column_class img { width: 38px !important; height: 38px !important; }
body.profile .live-view-link { box-sizing: border-box; height: 78px; width: 211px; color: #000; background: none; box-shadow: none; background-color: #fff; border-radius: 37px; display: flex; align-items: center; justify-content: center; margin-right: -20px; border: 2px solid #d9afe5; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }
body.profile .live-view-link img { padding: 8px; border-radius: 50%; background-color: #fbe7ff; margin-right: 12px; width: 44px !important; height: 44px !important; box-sizing: border-box; }
body.profile .live-view-link p { font-size: 16px; font-weight: bold; margin-bottom: 6px; }
body.profile .appeal-action-wrap.live li { width: 20%; }
body.profile .appeal-action-wrap.live li.disable { pointer-events: none; }
body.profile .live-icon-wrap { position: relative; }
body.profile .live-icon-wrap .effect { position: absolute; min-width: 30px; height: 30px; left: 6.5px; background-color: #fbe7ff; border-radius: 50%; opacity: 1; animation: 2.5s live-effect infinite; top: 6.5px; }
@keyframes live-effect { 20% { opacity: 1; }
  70% { opacity: 0; }
  80% { opacity: 0; } }
body.profile .dialog.live { padding: 20px; box-sizing: border-box; top: calc(50% - 127px); }
body.profile .dialog.live .head-text { font-size: 16px; display: flex; margin: auto auto 13px; align-items: center; }
body.profile .dialog.live .annotation { text-align: left; color: #888888; font-size: 13px; margin-bottom: 30px; }
body.profile .dialog.live .annotation:before { content: 'â€»'; margin-right: 2px; }
body.profile .dialog.live .balloon { display: flex; align-items: center; width: 127px; margin: inherit; height: 50px; box-sizing: border-box; border-radius: 10px; justify-content: center; font-weight: bold; }
body.profile .dialog.live .balloon img { width: 17px; height: 17px; display: block; margin-right: 8px; }
body.profile .dialog.live .head-text:before { content: ''; display: inline-block; width: 24px; height: 24px; background-size: contain; background-repeat: no-repeat; background-position: center; margin-right: 5px; background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_live_red.svg"); }
body.profile .dialog.live .balloon-bottom { position: relative; background: #fff; border: 1px solid #888888; }
body.profile .dialog.live .balloon-bottom:after, body.profile .dialog.live .balloon-bottom:before { top: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; }
body.profile .dialog.live .balloon-bottom:after { border-color: rgba(255, 255, 255, 0); border-top-color: #fff; border-width: 5px; margin-left: -5px; }
body.profile .dialog.live .balloon-bottom:before { border-color: rgba(136, 136, 136, 0); border-top-color: #888888; border-width: 6px; margin-left: -6px; }
body.profile .dialog.live a.blue { margin-top: 10px; }
body.profile .live-link-view-point { margin-left: 5px; }
body.profile .live-main-info { margin-top: -10px; background-color: #FFF0F0; padding-bottom: 20px; margin-bottom: 10px; }
body.profile .live-main-info input { display: none; }
body.profile .live-main-info-h { height: 55px; background: linear-gradient(45deg, rgba(255, 90, 90, 0.8), #c05cff); color: #fff; display: flex; align-items: center; padding-left: 50px; position: relative; font-weight: bold; font-size: 16px; }
body.profile .live-main-info-h:before { content: ''; position: absolute; display: flex; align-items: center; width: 30px; height: 30px; background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_live_white.svg"); background-size: cover; left: 15px; }
body.profile .live-main-group-tab { display: flex; align-items: center; justify-content: space-between; margin: 10px 5px; }
body.profile .live-main-group-tab label { width: 49%; display: flex; justify-content: center; align-items: center; background-color: #CCCCCC; border-radius: 6px; color: #fff; height: 45px; margin: 0 5px; font-weight: bold; font-size: 14px; position: relative; padding-left: 20px; }
body.profile .live-main-group-tab label:before { content: ''; position: absolute; display: flex; align-items: center; width: 30px; height: 30px; background-size: cover; left: 10px; }
body.profile .live-main-label-comment:before { background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_appeal_white.svg"); }
body.profile .live-main-label-usagefee:before { background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_point_white.svg"); }
body.profile #tab-comment:checked ~ .live-main-group-tab .live-main-label-comment { background-color: #fff; border: 1px solid #FA667E; color: #FA667E; }
body.profile #tab-comment:checked ~ .live-main-group-tab .live-main-label-comment:before { background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_appeal_pink.svg"); }
body.profile #tab-usagefee:checked ~ .live-main-group-tab .live-main-label-usagefee { background-color: #fff; border: 1px solid #FA667E; color: #FA667E; }
body.profile #tab-usagefee:checked ~ .live-main-group-tab .live-main-label-usagefee:before { background-image: url("/assets/vivo_0218/img/lp/lp25/livestream/icon_point_pink.svg"); }
body.profile .live-main-contents-wrap { background-color: #fff; min-height: 100px; border-radius: 10px; margin: 10px; border-radius: 10px; }
body.profile #tab-comment:checked ~ .live-main-contents-wrap .live-main-contents-comment { display: block; font-size: 14px; padding: 20px; color: #333333; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-main-contents-comment { display: none; }
body.profile #tab-comment:checked ~ .live-main-contents-wrap .live-main-contents-usagefee-wrap { display: none; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-main-contents-usagefee-wrap { display: flex; justify-content: space-between; align-items: center; font-size: 14px; padding: 10px; color: #333333; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-icon-text { display: flex; flex-direction: column; align-items: center; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-icon { background-color: #FFF2F9; border-radius: 25px; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; margin-bottom: 10px; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-icon img { width: 30px; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-text { font-size: 13px; text-align: center; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-text span.accept-price { font-weight: bold; color: #FC0000; }
body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-text span.accept-time { font-size: 11px; }
@media screen and (max-width: 385px) { body.profile #tab-usagefee:checked ~ .live-main-contents-wrap .live-contents-text { font-size: 12px; } }
body.profile header.app_fixed_style { height: 130px; }
body.profile main.app_fixed_style { margin-top: 135px; }
body.profile .app_info_fixed { display: flex; justify-content: flex-start; align-items: center; /* background-image: url("/assets/vivo_0218/img/lp/lp25/bg_app_dl_banner_green.png"); */ background-image: url("/assets/vivo_0218/img/lp/lp25/bg_app_dl_banner_yellow.png"); height: 75px; background-size: cover; width: 100%; }
body.profile .app_info_fixed-left { display: flex; justify-content: center; align-items: center; margin-left: 1vw; }
body.profile .app_info_fixed-left img { width: 55px; }
body.profile .app_info_fixed-right { display: flex; flex-direction: column; justify-content: space-between; margin-left: 1vw; margin-right: 1vw; width: 100%; }
body.profile .app_info_fixed-right-text { color: #fff; font-weight: bold; font-size: 14px; }
body.profile .app_info_fixed-right-btn { background-color: #fff; border-radius: 14px; width: 90px; color: #333333; display: flex; justify-content: center; align-items: center; position: relative; height: 18px; margin-top: 5px; padding: 3px 6px 3px 0px; }
body.profile .app_info_fixed-right-btn a { color: #333333; text-decoration: none; font-size: 12px; font-weight: bold; }
body.profile .app_info_fixed-right-btn a:before { content: ''; position: absolute; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_right_arrow_black.svg"); width: 14px; height: 14px; top: 5px; right: 0px; background-size: cover; }
body.profile .app_info_fixed-right-wrap { display: flex; justify-content: flex-start; align-items: center; }
body.profile .app_info_fixed-right-getpoint { color: #fff; margin-left: 3px; }
body.profile .app_info_prepoid { border: 1px solid #fff; padding: 3px; vertical-align: text-top; line-height: 8px; }
body.profile .app_info_point { color: #FFF536; font-size: 22px; font-weight: bold; padding-left: 4px; }
body.profile .app_info_present { color: #FFF536; padding-right: 5px; font-size: 16px; font-weight: bold; }
body.profile .app-pos { margin-top: 74px; transition: .3s; }
body.profile .app-pos.app-pos-none { margin-top: 0px; }
body.profile .questionnaire_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; box-sizing: border-box; width: 300px; margin-bottom: 20px; padding: 30px 0 20px; border: 1px solid #707070; border-radius: 11px; background-color: #fff; }
body.profile .keyword-box-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; box-sizing: border-box; width: 300px; margin-bottom: 20px; padding: 30px 0 20px; border: 1px solid #707070; border-radius: 11px; background-color: #fff; }
body.profile .keyword-wrap { display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; box-sizing: border-box; width: calc(100% - 60px); margin: 0; font-weight: 700; font-size: 18px; border: 2px solid #FF2121; border-radius: 20px; }
body.profile span.keyword-title { position: absolute; top: -15px; background-color: #fff; padding: 0 10px; }
body.profile .keyword-wrap .keyword-text { font-size: 30px; color: #FF2121; margin: 15px 0; }
body.profile .questionnaire-link-btn { display: flex; justify-content: center; align-items: center; width: 215px; height: 40px; border-radius: 24px; margin: 20px auto 0; background: #5675F8; font-size: 14px; color: #fff; }
body.profile .keyword-caution { font-size: 14px; font-weight: 500; }
body.profile .keyword-ev-link-btn { display: flex; justify-content: center; align-items: center; width: 215px; height: 40px; border-radius: 24px; margin: 25px auto 0; background: #ff9c35; font-size: 15px; color: #fff; }
body.profile .livestream-free-movie-dialog-wrap { position: fixed; top: 100vh; left: 0; width: 100%; height: 100vh; background-color: #000; z-index: 100; transition: 0.3s; opacity: 0; }
body.profile .livestream-free-movie-dialog-wrap.open { top: 0; opacity: 1; }
body.profile .livestream-free-movie-dialog-close-btn { position: absolute; width: 30px; height: 30px; top: 15px; right: 15px; z-index: 1; }
body.profile .livestream-free-movie-dialog-close-btn img { display: block; width: 100%; height: 100%; }
body.profile .livestream-free-movie-dialog-wrap .video-area { display: flex; justify-content: center; align-items: flex-start; background-color: #000; }
body.profile .livestream-free-movie-dialog-wrap .video-area .video-wrapper { position: relative; width: 100%; margin: 0; }
body.profile .livestream-free-movie-dialog-wrap .video-area .video-wrapper .video-play-btn-overlay { display: block; position: absolute; width: 80px; height: 80px; top: calc(50% - 40px); left: calc(50% - 40px); }
body.profile .talk-new-discount-dialog { display: flex; flex-direction: column; align-items: center; padding-bottom: 30px; }
body.profile .talk-new-discount-dialog .talk-new-discount-head-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; box-sizing: border-box; position: relative; width: calc(100% - 50px); max-width: 285px; height: 100px; margin: 10px auto 20px; border: 1px solid #D2D2D2; border-radius: 10px; }
body.profile .talk-new-discount-dialog .talk-new-discount-head-wrap:before { display: block; position: absolute; content: ""; width: 55px; height: 42px; top: -21px; left: calc((100% - 55px) / 2); background-color: #fff; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_rookie_30pt_off.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }
body.profile .talk-new-discount-head-wrap .upper-text { display: flex; justify-content: center; align-items: baseline; margin-bottom: 6px; font-size: 16px; font-weight: 700; color: #333333; }
body.profile .talk-new-discount-head-wrap .upper-text .red-text { color: #F55656; }
body.profile .talk-new-discount-head-wrap .upper-text .num-text { font-size: 30px; }
body.profile .talk-new-discount-head-wrap .lower-text { display: flex; justify-content: center; align-items: baseline; position: relative; margin-bottom: 6px; padding: 0 8px; font-size: 16px; font-weight: 700; color: #333333; z-index: 0; }
body.profile .talk-new-discount-head-wrap .lower-text:after { display: block; position: absolute; content: ""; width: 100%; height: 6px; left: 0; bottom: 0; background-color: #FD9D9D; opacity: 0.4; z-index: -1; }
body.profile .talk-new-discount-dialog .talk-new-discount-ul { width: calc(100% - 50px); max-width: 285px; }
body.profile .talk-new-discount-ul li { display: flex; flex-wrap: wrap; justify-content: space-between; }
body.profile .talk-new-discount-ul li.video-discount { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #EEEEEE; }
body.profile .talk-new-discount-ul li .discount-icon { display: flex; justify-content: center; align-items: center; width: 36px; height: 36px; border-radius: 10px; }
body.profile .talk-new-discount-ul li .discount-icon img { display: block; width: 25px; height: auto; }
body.profile .talk-new-discount-ul li .discount-icon.discount-video-icon { background-color: #E0E6FF; }
body.profile .talk-new-discount-ul li .discount-icon.discount-tel-icon { background-color: #FFECE2; }
body.profile .talk-new-discount-ul li .discount-body { width: calc(100% - 100px); }
body.profile .discount-body .discount-body-upper-line { margin-bottom: 8px; font-size: 14px; font-weight: 700; color: #333333; }
body.profile .discount-body .discount-body-lower-line { display: flex; align-items: center; }
body.profile .discount-body .discount-body-lower-line .original-price { font-size: 13px; color: #A1A1A1; text-decoration: line-through; }
body.profile .discount-body .discount-body-lower-line .original-price .price-num { font-size: 15px; }
body.profile .discount-body .discount-body-lower-line .original-price .price-slash { font-size: 15px; margin: 0 2px; }
body.profile .discount-body .discount-body-lower-line .original-price .price-unit { font-size: 12px; }
body.profile .discount-body .discount-body-lower-line .discount-price { font-size: 14px; font-weight: 700; color: #333333; }
body.profile .discount-body .discount-body-lower-line .discount-price .price-num { font-size: 18px; }
body.profile .discount-body .discount-body-lower-line .discount-price .price-slash { font-size: 18px; margin: 0 2px; }
body.profile .discount-body .discount-body-lower-line .discount-price .price-unit { font-size: 14px; }
body.profile .discount-body .discount-body-lower-line .arrow { width: 13px; height: 13px; margin: 0 8px 0 10px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_triangle_green.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }
body.profile .talk-new-discount-ul li .icon-value { display: flex; flex-direction: column; justify-content: center; align-items: center; font-family: 'Roboto'; width: 50px; height: 50px; background-color: #42D1B0; border-radius: 30px; font-size: 11px; font-weight: 700; color: #fff; transform: rotate(15deg); }
body.profile .talk-new-discount-ul li .icon-value .num-text { font-size: 16px; font-weight: 500; }
body.profile .talk-new-discount-ul li .icon-value .unit-text { font-size: 14px; font-weight: 500; }
body.profile .talk-new-discount-dialog .point-link-btn { display: flex; align-items: center; box-sizing: border-box; width: 252px; height: 56px; margin-bottom: 24px; padding-left: 24px; background-color: #F55656; border-radius: 28px; font-size: 16px; font-weight: 700; color: #fff; }
body.profile .talk-new-discount-dialog .point-link-btn:before { display: block; content: ""; width: 25px; height: 25px; margin-right: 17px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_wife_point_wt.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }
body.profile .talk-new-discount-dialog .talk-start-btn { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 252px; height: 56px; border: 1px solid #707070; border-radius: 28px; font-size: 16px; font-weight: 700; color: #333333; }
body.profile .want-talk-disable-dialog-inner, body.profile .reject-reverse-talk-dialog-inner { width: 85%; }
body.profile .want-talk-disable-dialog-inner .dialog-inner-body, body.profile .reject-reverse-talk-dialog-inner .dialog-inner-body { display: flex; flex-direction: column; position: relative; border: 1px solid #D2D2D2; box-sizing: border-box; margin: 0 20px 30px; padding: 15px 10px 15px 45px; border-radius: 10px; font-size: 14px; font-weight: 500; }
body.profile .want-talk-disable-dialog-inner .dialog-inner-body:before, body.profile .reject-reverse-talk-dialog-inner .dialog-inner-body:before { display: block; position: absolute; content: ""; width: 25px; height: 25px; top: 15px; left: 10px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_caution_circle_border.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }
body.profile .dialog-inner-body span:nth-child(2) { margin-top: 15px; }
body.profile .want-talk-disable-dialog-inner .app-dl-link-btn, body.profile .reject-reverse-talk-dialog-inner .app-dl-link-btn { background-color: #4adb72; color: #fff; font-size: 15px; font-weight: 700; }

.movie-list .post-list-menu-movie { position: fixed; width: 100%; padding: 0; top: 56px; background-color: #fff; z-index: 999; }
.movie-list .post-list-menu-movie ul { display: flex; justify-content: space-around; align-items: flex-end; box-sizing: border-box; width: 100%; height: 40px; margin: 0; padding: 0; list-style-type: none; border-bottom: 1px solid #DDDDDD; }
.movie-list .post-list-menu-movie ul li { display: flex; justify-content: center; align-items: center; position: relative; box-sizing: border-box; height: 100%; padding: 5px 15px; }
.movie-list .post-list-menu-movie ul li.active:after { display: block; position: absolute; content: ""; width: 100%; height: 3px; bottom: -1px; left: 0; background-color: #5675F8; }
.movie-list .post-list-menu-movie ul li a { display: flex; align-items: center; font-size: 14px; color: #888888; text-decoration: none; color: #666666; }
.movie-list .post-list-menu-movie ul li.active a { color: #5675F8; font-weight: 500; }
.movie-list .post-list-menu-movie ul li a.icon-ranking:before { display: block; content: ""; width: 20px; height: 20px; background-image: url("/img/public/icon_ranking_gray.svg"); background-size: contain; background-repeat: no-repeat; background-position: center; }
.movie-list .posts-list { width: 100%; margin-top: 116px; }
.movie-list .posts-list ul { display: flex; flex-direction: column; align-items: center; width: 100%; height: calc(54vw + 90px); margin: 0; padding: 0; list-style-type: none; }
.movie-list .posts-list ul li { display: block; margin-bottom: 8px; }
.movie-list .posts-list ul li:last-of-type { padding-bottom: 66px; }
.movie-list .posts-list ul li a { display: block; width: 100%; height: 100%; text-decoration: none; }
.movie-list .posts-list ul li a .thumnail { display: block; position: relative; width: 100vw; height: 54vw; background-color: #000; background-size: contain; background-repeat: no-repeat; background-position: center; }
.movie-list .posts-list ul li a .thumnail .mark { display: block; position: absolute; }
.movie-list .posts-list ul li a .thumnail .new-mark { display: flex; width: 36px; height: 36px; top: 3px; left: 3px; background-color: transparent; }
.movie-list .posts-list ul li a .thumnail .movie-play-icon { display: block; position: absolute; width: 50px; height: 50px; top: calc(50% - 25px); left: calc(50% - 25px); }
.movie-list .posts-list ul li a .thumnail .time-mark, .movie-list .posts-list ul li a .thumnail .price-mark { display: flex; justify-content: center; align-items: center; box-sizing: border-box; width: 52px; height: 22px; right: 6px; border-radius: 3px; font-size: 12px; font-weight: 700; color: #fff; }
.movie-list .posts-list ul li a .thumnail .time-mark { background-color: rgba(13, 13, 13, 0.6); bottom: 6px; }
.movie-list .posts-list ul li a .thumnail .price-mark { bottom: 33px; }
.movie-list .posts-list ul li a .thumnail .price-mark.purchased { background-color: rgba(50, 235, 107, 0.7); }
.movie-list .posts-list ul li a .thumnail .price-mark.price { background-color: rgba(255, 57, 70, 0.7); }
.movie-list .posts-list ul li a .info-text { display: flex; flex-wrap: wrap; justify-content: space-between; box-sizing: border-box; width: 100%; min-height: 50px; padding: 10px 15px 20px; }
.movie-list .posts-list ul li a .info-text > img { display: block; width: 40px; height: 40px; border-radius: 20px; background-size: contain; background-repeat: no-repeat; background-position: center; }
.movie-list .posts-list ul li a .info-text .info-text-box { width: calc(100% - 55px); min-height: 40px; }
.movie-list .posts-list ul li a .info-text .info-text-box p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; width: 100%; min-height: 20px; max-height: 40px; margin: 0; padding: 0; font-size: 14px; color: #333333; word-break: break-word; }
.movie-list .posts-list ul li a .info-text .info-text-box .girl-info { display: flex; height: 15px; line-height: 15px; width: 100%; margin: 10px 0 0; font-size: 13px; color: rgba(102, 102, 102, 0.7); }
.movie-list .info-text-box .girl-info .name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; height: 15px; word-break: break-word; }
.movie-list .info-text-box .girl-info .age-area { margin-left: 5px; }
.movie-list .info-text-box .girl-info .age-area, .movie-list .info-text-box .girl-info .views, .movie-list .info-text-box .girl-info .post-date { flex-shrink: 0; }
.movie-list .status { display: flex; align-items: center; justify-content: center; position: absolute; color: #fff; font-weight: 500; border-radius: 50%; width: 46px; height: 46px; font-size: 11px; text-align: center; z-index: 1; left: -5px; top: -5px; }
.movie-list .status.busy { background: rgba(92, 105, 113, 0.8); }
.movie-list .status.video, .movie-list .status.video-voice { background: rgba(245, 58, 79, 0.8); }
.movie-list .status.voice { background: rgba(250, 134, 35, 0.8); }
.movie-list .status.mail { background: rgba(75, 196, 173, 0.8); }
.movie-list .status.live { background: rgba(123, 113, 255, 0.8); line-height: 1.2; }
.movie-list .status.video-voice { line-height: 1.3; }
.movie-list .pc-tab .posts-list, .movie-list .pc-tab .post-list-menu-movie { width: var(--pc-tab-width); }
.movie-list .pc-tab .posts-list ul li a .thumnail { width: 160px; height: auto; }

.movie-list .posts-list { box-sizing: border-box; width: 100%; margin: 50px 0 0 0 !important; padding: 10px; }
.movie-list .posts-list ul { display: flex; flex-wrap: wrap; flex-direction: row; justify-content: space-between; width: 100%; height: auto; margin: 0; padding: 0; list-style-type: none; }
.movie-list .posts-list ul li { position: relative; width: 46vw; height: 68vw; margin-bottom: 2.5vw; background-color: #333333; border-radius: 10px; }
.movie-list .posts-list ul li:last-of-type { padding-bottom: 0; }
.movie-list .posts-list ul li a .thumnail { position: absolute; width: 100%; height: 0; padding-top: 148%; top: 0; left: 0; background-size: cover; background-position: center; border-radius: 10px; }
.movie-list .posts-list ul li a .thumnail.sideway { padding-top: 100%; }
.movie-list .posts-list ul li a .girl-info { display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0; padding: 0; background: linear-gradient(transparent 0%, rgba(0, 0, 0, 0.4) 100%); border-radius: 10px; }
.movie-list .posts-list ul li a .girl-info .post-date { display: flex; align-items: center; justify-content: center; position: absolute; width: 56px; height: 15px; right: 0; top: 0; margin: 5px 5px 0 0; font-size: 10px; background-color: rgba(0, 0, 0, 0.5); color: #fff; border-radius: 8px; }
.movie-list .posts-list ul li a .girl-info .movie-play-icon { display: block; position: absolute; width: 50px; height: 50px; top: calc(40% - 25px); left: calc(50% - 25px); }
.movie-list .posts-list ul li a .girl-info p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; box-sizing: border-box; width: 100%; height: 40px; margin: 0; padding: 0 8px 8px; font-size: 11px; color: #fff; word-break: break-word; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap, .movie-list .posts-list ul li a .girl-info .girl-info-name-wrap { display: flex; align-items: center; box-sizing: border-box; width: 100%; font-size: 10px; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap { justify-content: flex-end; padding: 8px; display: none; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap { padding: 5px 8px; background: rgba(255, 255, 255, 0.35); border-radius: 0 0 10px 10px; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap .views { margin: 0 auto 0 0; font-size: 11px; color: #fff; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap .price-mark, .movie-list .posts-list ul li a .girl-info .girl-info-views-wrap .time-mark { display: flex; align-items: center; justify-content: center; width: 45px; height: 20px; border-radius: 5px; font-size: 10px; color: #fff; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap .time-mark { background: rgba(255, 255, 255, 0.7); margin-right: 5px; color: #333; }
.movie-list .posts-list li a .girl-info .girl-info-views-wrap .price-mark.purchased { background-color: rgba(50, 235, 107, 0.7); }
.movie-list .posts-list li a .girl-info .girl-info-views-wrap .price-mark.price { background-color: rgba(255, 57, 70, 0.7); }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap.pcmax-user .time-mark { width: 35px; }
.movie-list .posts-list ul li a .girl-info .girl-info-views-wrap.pcmax-user .price-mark { width: 65px; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap img { display: block; width: 32px; height: 32px; margin-right: 10px; border-radius: 18px; flex-shrink: 0; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap .name, .movie-list .posts-list ul li a .girl-info .girl-info-name-wrap .age-area { min-width: 35px; font-size: 11px; color: #fff; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap .age-area { flex-shrink: 0; margin-right: 10px; }
.movie-list .posts-list ul li a .girl-info .girl-info-name-wrap .age-area:before { display: inline-block; content: "/"; margin: 0 5px; }
.movie-list .pc-tab .posts-list, .movie-list .pc-tab .post-list-menu-photo { width: var(--pc-tab-width); }
.movie-list .pc-tab .posts-list ul li { width: 160px; height: 237px; margin-bottom: 10px; }

.search-wrap { box-sizing: border-box; width: 100%; padding: 12px 0 6px; background-color: #fff; z-index: 10; top: 0px; position: relative; }

.pc-tab .search-wrap { width: var(--pc-tab-width); }

.search-wrap.purchased { top: 136px; }

.search-wrap + .posts-list { margin-top: 204px; }

.search-wrap + .mylist-contents-wrap { margin-top: 244px; }

.search-result-wrap + .posts-list { margin-top: 234px; }

.search-result-wrap + .mylist-contents-wrap { margin-top: 274px; }

.search-wrap input[type="checkbox"] { display: none; }

.search-wrap .search-keyword-wrap { display: flex; padding-left: 15px; }

.search-wrap .search-keyword-wrap input[type="text"] { position: relative; box-sizing: border-box; /* width: calc(100% - 118px); 人気ワードボタンを表示した際の幅*/ width: calc(100% - 59px); height: 36px; padding: 8px 14px 8px 14px; border: 1px solid #5575F8; border-radius: 8px 0 0 8px; font-size: 14px; }

.search-wrap .search-keyword-wrap .search-keyword-icon { display: flex; width: 44px; height: 36px; justify-content: center; align-items: center; border-radius: 0 8px 8px 0; background-color: #5575F8; }

.search-wrap .search-keyword-wrap .search-keyword-icon img { width: 21px; height: auto; }

.search-wrap .search-keyword-wrap .popular-words-btn { display: flex; flex-direction: column; align-items: center; width: 55px; height: 36px; margin-left: 8px; }

.search-wrap .search-keyword-wrap .popular-words-btn img { width: auto; height: 22px; }

.search-wrap .search-keyword-wrap .popular-words-btn span { font-size: 11px; color: #5E7BF4; }

.search-wrap .narrow-down-wrap { display: flex; align-items: center; box-sizing: border-box; margin: 10px 15px 0 15px; }

.search-wrap .narrow-down-wrap h4 { font-size: 12px; color: #333333; margin: 0; }

.search-wrap .narrow-down-wrap .narrow-down-tag { display: flex; align-items: center; box-sizing: border-box; width: auto; height: 32px; margin-left: 12px; padding: 0 8px; background-color: #F7F7F7; border: 1px solid #DDDDDD; border-radius: 6px; font-size: 12px; color: #333333; margin-left: 12px; }

.search-wrap .narrow-down-wrap .narrow-down-tag::before { display: block; content: ""; box-sizing: border-box; width: 18px; height: 18px; margin-right: 8px; background-color: #fff; border: 1px solid #DDDDDD; border-radius: 5px; }

@media screen and (max-width: 390px) { .search-wrap .narrow-down-wrap .narrow-down-tag { margin-left: 9px; } }
@media screen and (max-width: 360px) { .search-wrap .narrow-down-wrap .narrow-down-tag { margin-left: 6px; } }
.pc-tab .search-wrap .narrow-down-wrap .narrow-down-tag { margin-left: 6px; }

.search-wrap .narrow-down-wrap #select-new-girl:checked ~ .narrow-down-tag.new-gorl-tag, .search-wrap .narrow-down-wrap #select-favorite:checked ~ .narrow-down-tag.favorite-tag { background-color: #DEE5FF; border: 1px solid #DEE5FF; }

.search-wrap .narrow-down-wrap #select-new-girl:checked ~ .narrow-down-tag.new-gorl-tag::before, .search-wrap .narrow-down-wrap #select-favorite:checked ~ .narrow-down-tag.favorite-tag::before { background-color: #5575F8; border: 1px solid #5575F8; background-image: url("/img/icon_check_white.svg"); }

.search-wrap .narrow-down-wrap .serch_cnt { margin: 0 0 0 auto; font-size: 14px; }

.search-result-wrap { display: flex; align-items: center; position: fixed; box-sizing: border-box; width: 100%; height: 29px; top: 198px; padding: 4px 0 0 15px; background-color: #F0F2F5; font-size: 12px; color: #333333; z-index: 10; }

.search-wrap.purchased + .search-result-wrap { top: 238px; }

#search-form + .posts-list { margin-top: 200px; }

.popular-words_dialog .dialog { box-sizing: border-box; padding: 15px 15px 20px; }

.popular-words_dialog .dialog .dialog-close-btn { border: none; border-radius: 0; top: 10; right: 10; }

.popular-words_dialog .dialog .popular-words-title { display: flex; margin-bottom: 5px; }

.popular-words_dialog .dialog .popular-words-title img { width: 16px; height: auto; }

.popular-words_dialog .dialog .popular-words-title span { font-size: 12px; font-weight: 700; color: #5E7BF4; margin-left: 5px; padding-bottom: 2px; box-sizing: border-box; }

.popular-words_dialog .dialog .popular-words-list { display: flex; flex-wrap: wrap; width: 100%; }

.popular-words_dialog .dialog .popular-words-list .word-li { display: flex; align-items: center; width: 50%; height: 38px; font-size: 14px; color: #333333; }

.popular-words_dialog .dialog .popular-words-list .word-li:before { display: block; content: ""; width: 18px; height: 18px; margin-right: 7px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_search.svg"); background-position: center; background-size: contain; background-repeat: no-repeat; }

.empty-search-result-wrap { display: flex; flex-direction: column; align-items: center; margin-top: 234px; }

.search-wrap.purchased ~ .empty-search-result-wrap { margin-top: 274px; }

.empty-search-result-wrap img { display: block; width: 80px; height: auto; margin: 40px 0 10px; }

.empty-search-result-wrap p { font-size: 14px; color: #222222; }

/*
各設定
*/
/*
base color palette
http://www.colourlovers.com/palette/3293028/Christmas_Time
*/
/* =====================================================================================================================
メッセージ
===================================================================================================================== */
/* ********************************************************* メニュー
********************************************************* */
body.message-box { background: #FAF5F0; }

.message-box { /* ===================================================================================================================== メッセージ詳細 message-detail.php
===================================================================================================================== */ /*********************************

add 20/04/11 sasaki
flex 書き換え

**********************************/ }
.message-box main { background-color: transparent; }
.message-box .message-menu { position: relative; top: 0px; left: 0; overflow: hidden; margin: 0px; width: 100%; height: 55px; z-index: 9999; background-color: #FAF5F0; }
.message-box .message-menu.fixed { position: fixed; top: 0; left: 0; }
.message-box .message-menu-ul { margin: 0 6px 0; overflow: hidden; overflow-x: scroll; -webkit-overflow-scrolling: touch; white-space: nowrap; text-align: center; }
.message-box .message-menu-li { position: relative; display: inline-block; padding: 11px 0 0 0; width: 24%; height: 55px; }
.message-box .message-menu-li > a { position: relative; display: block; margin: 0 2px 0 0; padding: 8px 0; text-align: center; line-height: 1em; font-size: 14px; color: #E01540; background-color: #FFFFFF; border: 1px solid #E01540; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.message-box .two_type { width: 47% !important; }
.message-box .message-menu-li:last-child > a { margin: 0; }
.message-box .message-menu-li > a.active { color: #FFFFFF; background-color: #E01540; }
.message-box .message-menu-li > a:hover { text-decoration: none; }
.message-box .message-menu-li > a.active:before { content: ''; display: block; position: absolute; left: 50%; bottom: -17px; width: 1px; height: 1px; margin: 0 0 0 -8px; background-color: transparent; border: 10px solid #E01540; border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; }
.message-box .message-bagde { position: absolute; top: 0px; right: -2; padding: 2px 5px; min-width: 20px; text-align: center; font-size: 13px; color: #FFFFFF; line-height: 1em; background-color: #E01540; border: 1px solid #FFFFFF; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.message-box .messageList-ul { margin: 0 6px; display: none; min-height: 300px; }
.message-box .messageList-ul.active { display: block; }
.message-box .messageList-li { position: relative; margin: 0 0 3px 0; border: 1px solid #f7f0e8; background-color: #FFFFFF; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.message-box .messageList-li > .left { position: absolute; width: 80px; height: 80px; }
.message-box .messageList-li > .left .messageList-thumb { height: 70px; padding: 10px 0 0 0; text-align: center; }
.message-box .messageList-li > .left .messageList-thumb > a > span { display: inline-block; width: 60px; height: 60px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-border-radius: 30px; -webkit-border-radius: 30px; border-radius: 30px; }
.message-box .messageList-li > .right { display: block; margin: 0 0 0 80px; height: 80px; }
.message-box .messageList-li > .right:hover { text-decoration: none; }
.message-box .messageList-li > .right > ul { margin: 0 25px 0 0; padding: 5px 0 0 0; height: 80px; color: #36231F; }
.message-box .messageList-li > .right > ul > li { height: 20px; }
.message-box .messageList-li > .right > ul > li.arrow { position: absolute; top: 0; right: 0; width: 20px; height: 80px; }
.message-box .messageList-li > .right > ul > li.arrow i { display: table-cell; height: 80px; vertical-align: middle; font-size: 22px; }
.message-box .messageList-li > .right > ul > li.read div { display: table-cell; height: 20px; vertical-align: middle; }
.message-box .messageList-li > .right > ul > li.read div > label, .message-box .messageList-li > .right > ul > li.read div > span { display: inline-block; }
.message-box .messageList-li > .right > ul > li.read div > label { margin: 0 5px 0 0; height: 20px; padding: 0 5px; color: #FFFFFF; background-color: #E01540; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.message-box .messageList-li > .right > ul > li.read div > label.done { background-color: #4AA954; }
.message-box .messageList-li > .right > ul > li.prof { display: table-cell; height: 25px; vertical-align: middle; }
.message-box .messageList-li > .right > ul > li.prof span { display: inline-block; font-size: 13px; line-height: 1em; margin: 0 5px 0 0; }
.message-box .messageList-li > .right > ul > li.prof span.name { font-size: 14px; }
.message-box .messageList-li > .right > ul > li.title { position: relative; margin: 0 -15px 0 0px; height: 25px; line-height: 25px; font-size: 16px; white-space: nowrap; overflow: hidden; }
.message-box .messageList-li > .right > ul > li.title > span { display: block; position: relative; background-color: #E9E6E2; padding: 0 10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; white-space: nowrap; font-size: 13px; overflow: hidden; }
.message-box .messageList-ul { margin: 0 6px; display: none; min-height: 300px; }
.message-box .messageList-ul.active { display: block; }
.message-box .messageList-li { position: relative; margin: 0 0 3px 0; border: 1px solid #f7f0e8; background-color: #FFFFFF; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.message-box .messageList-li > .no-message { padding: 20px 10px; text-align: center; }
.message-box .layout { background-color: #f0f0f0; }
.message-box .message-headline { position: relative; width: 100%; height: 55px; z-index: 9996; background-color: #fff; }
.message-box .message-headline.fixedbox { color: #FFFFFF; background-color: #FAF5F0; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; }
.message-box .message-headline-a { position: absolute; top: 15px; right: 5px; height: 24px; line-height: 22px; padding: 0px 8px; font-size: 13px; border: none; }
.message-box .message-headline.fixed { position: fixed; top: 0; left: 0; z-index: 99999; }
.message-box .message-headline > .left { position: absolute; top: 5px; left: 10px; width: 40px; height: 55px; }
.message-box .message-headline > .left span.thumb { display: block; width: 40px; height: 40px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.message-box .message-headline > .right { position: relative; margin: 0 0 0 55px; height: 55px; }
.message-box .message-headline > .right > div:first-child { display: table-cell; height: 55px; vertical-align: middle; }
.message-box .message-headline > .right > div > span { display: block; line-height: 1em; font-size: 13px; }
.message-box .message-headline > .right > div > span.name { font-size: 16px; }
.message-box .messageDetail-wrap { padding: 0 0 0px 0; }
.message-box .messageDetail-ul { position: relative; margin: 0 6px; padding: 0 0 0px 0; /* background-color: #FFFFFF;*/ background-color: #F0F0F0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.message-box .messageDetail-ul > div { margin: 0 0 10px; }
.message-box .messageDetail-li { position: relative; }
.message-box .messageDetail-li.male:last-child { padding-bottom: 15px; }
.message-box .messageDetail-li.female > .left { position: absolute; top: 0; left: 0px; width: 50px; text-align: center; padding: 10px 0 0 0; text-align: center; }
.message-box .messageDetail-li.female > .left > .date { padding: 5px 0; text-align: center; font-size: 12px; line-height: 1.1em; color: #999; }
.message-box .messageDetail-li.female > .right { margin: 0 0 0 50px; padding: 0px 0 10px; min-height: 100px; }
.message-box .messageDetail-thumb { display: inline-block; width: 30px; height: 30px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }
.message-box .messageDetail-thumb2 { width: 180px; height: 180px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; margin: 1.1em; position: relative; }
.message-box .message_send { margin-top: -20px; }
.message-box .message_show_file { text-align: center; }
.message-box .message_send_file { margin: 0px auto; padding: 0px; text-align: center; }
.message-box .message_send_file > textarea { height: 80px; border: 1px solid #ccc; width: 85% !important; margin: 10px auto; }
.message-box .message_send_file > p { margin-top: 15px; }
.message-box .messageDetail-li-date { padding: 10px 0 5px 0; text-align: center; }
.message-box .messageDetail-li-date > span { display: inline-block; background-color: #2A4686; color: #FFFFFF; font-size: 12px; padding: 2px 10px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.message-box .message-wrap { position: relative; max-width: 95%; padding: 10px 15px 25px; font-size: 14px; line-height: 1.6em; background-color: #fff; /*  background-color: #F0F0F0;*/ text-align: center; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); }
.message-box .message-wrap > p { margin: 0; padding: 5px 0 5px 0; text-align: left; }
.message-box .male .mail_del a { color: rgba(255, 255, 255, 0.6); }
.message-box .mail_del a img { position: relative; top: -2px; opacity: .6; }
.message-box .message-wrap:before { content: ''; position: absolute; top: 10px; left: -14px; display: block; width: 0; height: 0; border: 8px solid #fff; /*border: 8px solid #F0F0F0;*/ border-top-color: transparent; border-left-color: transparent; border-bottom-color: transparent; }
.message-box .kidoku { position: absolute; bottom: -1px; width: 3em; line-height: 1.1em; font-size: 12px; left: -3em; text-align: left; color: #36231f; }
.message-box .message-wrap > .mail_del { position: absolute; right: 0.7em; bottom: 3px; width: 3.5em; line-height: 1.1em; font-size: 12px; text-align: left; }
.message-box .send_del { text-align: right; margin-right: 10px; }
.message-box .message-type { display: inline-block; padding: 2px 10px; color: #FFFFFF; font-size: 12px; line-height: 1em; background-color: #BBB; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.message-box .message-type.yuryo { background-color: #E01540; }
.message-box .male .message-wrap { position: relative; float: right; max-width: 80%; margin: 0 10px 0 0; padding: 10px 15px 15px; font-size: 14px; color: #FFFFFF; line-height: 1.6em; background-color: #6382CE; text-align: center; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.message-box .male .message-wrap:before { content: ''; position: absolute; top: 10px; left: auto; right: -14px; display: block; width: 0; height: 0; border: 8px solid #6382CE; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; }
.message-box .pageing_mail { overflow: hidden; margin-top: 0px; }
.message-box .prev_page_mail, .message-box .sitemail_del, .message-box .next_page_mail { width: 33%; text-align: center; float: left; }
.message-box .sitemail_del { margin-left: 33%; }
.message-box .prev_page_mail + .sitemail_del { margin-left: 0; }
.message-box .pageing_mail img { width: 90%; }
.message-box .support-img { width: 60px; height: 60px; display: block; background-size: cover; }
.message-box .mail_del_char { position: absolute; bottom: 35px; z-index: 9; right: 40px; }
.message-box .mail_img_appended, .message-box .mail_mov_appended { position: absolute; top: 5; right: 40; }
.message-box .mov-playicon { position: absolute; top: 50%; left: 50%; width: 60px; height: 60px; margin: -30px 0 0 -30px; -moz-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px; background-color: rgba(0, 0, 0, 0.3); border: 1px solid #fff; }
.message-box .mov-playicon:before { content: ''; position: absolute; top: 10px; left: 12px; width: 40px; height: 40px; background: transparent url("/assets/vivo_0218/img/lp/lp25/icon_movie_play.svg") no-repeat center center; background-size: contain; }
.message-box .temp_file_alert { font-size: 12px; text-align: right; color: red; margin-bottom: 10px; }
.message-box .detail-menu { background-color: #FFFFFF; margin: 0px 0 0px; padding: 5px 0 10; box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.4); }
.message-box .event-pr { padding: 10px 0; text-align: center; }
.message-box .eve-img { position: absolute; top: -10px; left: -10px; }
.message-box .no-search { margin: 20px auto; text-align: center; }
.message-box .keylock { position: fixed; top: 70px; right: 0px; left: 0px; z-index: 99999; }
.message-box .mailbox_adv_banner { margin: 0px auto 20px; width: 100%; text-align: center; }
.message-box .mailbox_adv_banner img { width: 100%; }
.message-box .message-menu-li { width: 24% !important; }
.message-box .message-menu-li > a { font-size: 13px !important; }
.message-box .mail_del_char { z-index: 9 !important; }
.message-box .color-headline { margin-bottom: 0px !important; }
.message-box .message-box-li-wrap { position: relative; display: flex; justify-content: flex-start; height: 80px; background-color: #fff; margin-top: 5px; margin-bottom: 10px; border-radius: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
.message-box .message-box-li-wrap a { display: flex; justify-content: flex; color: #45302B; font-size: 13px; text-decoration: none; }
.message-box .message-box-li-left { width: 80px; padding: 10px 0px 10px 10px; }
.message-box .message-li-thumb { height: 100%; background-size: contain; background-repeat: no-repeat; width: 60px; height: 60px; background-color: transparent; background-position: center center; border-radius: 30px; }
.message-box .message-box-li-right { min-width: 230px; position: relative; }
.message-box .message-box-li-right .name-speace { display: flex; align-items: center; white-space: nowrap; /*text-overflow: ellipsis;*/ overflow: hidden; width: 230px; }
.message-box .message-box-li-right .name-speace .area { margin-right: 3px; }
.message-box .message-box-li-right .read-check { font-size: 13px; margin-top: 10px; }
.message-box .message-box-li-right .read-check .read-no { margin: 0 5px 0 0; height: 20px; padding: 0 5px; color: #FFFFFF; background-color: #E01540; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.message-box .message-box-li-right .read-check .read-done { background-color: #4AA954; margin: 0 5px 0 0; height: 20px; padding: 0 5px; color: #FFFFFF; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.message-box .message-box-li-right .mail-file-load { padding-left: 5px; }
.message-box .message-box-li-right .message-speace { white-space: nowrap; width: 300px; overflow: hidden; height: 20px; /*2023-04-12 iOS16.4.xで省略の切れ目に絵文字があるとSafariがクラッシュする問題のため*/ /*text-overflow: ellipsis;*/ }
.message-box .mail-remove { width: 100%; display: flex; justify-content: center; align-items: center; cursor: pointer; }
.message-box .mail-remove img { width: 16px; cursor: pointer; }
.message-box .message-new-mark img { width: 15px; height: 15px; }
.message-box .message-li-wait-status { position: absolute; bottom: 5px; left: 14px; }
.message-box .list-girls-status { display: flex; justify-content: center; align-items: center; width: 55px; height: 20px; border-radius: 5px; font-size: 11px; font-weight: bold; color: #FFF; text-align: center; padding: 1px 3px; }
.message-box .color-status-wait { background-color: rgba(245, 0, 87, 0.8); }
.message-box .color-status-mail { background-color: rgba(17, 184, 174, 0.8); }
.message-box .color-status-busy { background-color: rgba(102, 102, 102, 0.8); }

.message-detail { /* ===================================================================================================================== ヘッダー
===================================================================================================================== */ /*余白削除用*/ /*画像・動画メッセージ*/ /*動画メッセージ*/ /* =====================================================================================================================
前へ次へ関連
===================================================================================================================== */ /* ===================================================================================================================== フッター
===================================================================================================================== */ /*flg10のみ非表示*/ /*メッセージ動画・画像閲覧*/ /************************************************************

アプリDL促進レイアウト

************************************************************/ /* ===================================================================================================================== test
===================================================================================================================== */ }
.message-detail body { padding-bottom: 0px; }
.message-detail .layout { background: #FFF; }
.message-detail p { margin: 0; }
.message-detail .btn-pink { width: 256px; height: 40px; }
.message-detail a:hover { color: inherit; }
.message-detail .message-headline { position: relative; width: 100%; height: 55px; z-index: 9; background-color: #fff; border-bottom: transparent; }
.message-detail .message-headline-fixed { position: fixed; top: 55px; width: 100%; z-index: 9; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px solid #ccc; background-color: #fff; }
.message-detail .message-headline-fixed a.message_box_backlink { display: block; margin-left: 15px; margin-right: 8px; }
.message-detail .message-header-backbox { display: block; width: 15px; height: 15px; border-bottom: solid 3px #697b91; border-left: solid 3px #697b91; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.message-detail .message-headline-fixed a { text-decoration: none; color: #222; }
.message-detail .message-headline-fixed .message-headline > .right .name-wrap { width: 150px; display: flex; align-items: baseline; line-height: 27px; color: #333; height: auto; vertical-align: inherit; }
.message-detail .message-headline > .right .name-wrap .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 85px; display: inline-block; line-height: 21px; }
.message-detail .message-headline > .left { position: absolute; top: 5px; left: 10px; width: 40px; height: 40px; }
.message-detail .message-headline > .left span.thumb { display: block; width: 40px; height: 40px; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; border-radius: 20px; }
.message-detail .message-headline > .right { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; position: relative; margin: 0 0 0 55px; height: 55px; }
.message-detail .message-headline > .right > div:first-child { display: table-cell; height: 55px; vertical-align: middle; }
.message-detail .message-headline > .right > div > span { display: block; line-height: 1em; font-size: 13px; }
.message-detail .message-headline > .right > div > span.name { font-size: 16px; }
.message-detail .btn-message-profile { width: 120px; height: 30px; line-height: 28px; color: #36231f; font-size: 13px; text-align: center; background-color: #FFF; border: 1px solid #888; border-radius: 100px; position: absolute; top: 0; right: 10px; bottom: 0; padding-right: 8px; margin: auto; z-index: 9999; }
.message-detail .btn-message-profile::after { content: ""; position: absolute; top: 0; right: 7px; bottom: 0; width: 10px; height: 10px; margin: auto; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_arrow_right_gray.svg"); background-repeat: no-repeat; background-position: center; background-size: contain; }
.message-detail .messageDetail-wrap { padding: 60px 0 0px 0; background: #FFF; }
.message-detail .app_fixed_style .messageDetail-wrap { padding: 100px 0 0px 0; }
.message-detail .messageDetail-ul { position: relative; margin: 0; padding: 5px 6px 70px; background-color: #FFF; border-radius: 0; }
.message-detail .messageDetail-ul > div { margin: 0 0 20px; }
.message-detail .messageDetail-li { position: relative; }
.message-detail .messageDetail-li.male:last-child { padding-bottom: 0; }
.message-detail .messageDetail-li.male { display: flex; flex-direction: row-reverse; }
.message-detail .messageDetail-li.female { display: flex; }
.message-detail .message-wrap > p { padding: 10px 15px; word-break: break-word; }
.message-detail .message-nothing { height: 10px; }
.message-detail .male .message-wrap { min-width: 150px; max-width: 80%; font-size: 15px; color: #FFF; line-height: 1.6; text-align: left; margin: 0 10px 0 0; padding: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); background-color: #5085E3; border-radius: 20px; border: none; position: relative; display: inline-block; float: none; }
.message-detail .female .message-wrap { min-width: 150px; max-width: 100%; font-size: 15px; color: #222; line-height: 1.6; text-align: left; padding: 0; border: 1px solid #D5DAE3; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15); background-color: #fff; border-radius: 20px; position: relative; z-index: 2; display: inline-block; overflow: hidden; }
.message-detail .male .message-wrap::before { content: ''; position: absolute; top: 12px; left: auto; right: -10px; display: block; width: 16px; height: 13px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_tail_male.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; border: none; }
.message-detail .female .message-wrap::before { display: none; }
.message-detail .msg_pic .message-wrap, .message-detail .msg_movie .message-wrap { overflow: hidden; }
.message-detail .msg_pic .message-wrap::before, .message-detail .msg_movie .message-wrap::before { display: none; }
.message-detail .messageDetail-li.female > .left { position: absolute; top: 0; left: 0px; width: auto; text-align: center; padding: 0; }
.message-detail .messageDetail-li.female > .left a { display: block; }
.message-detail .messageDetail-thumb { display: inline-block; background-color: transparent; background-position: center center; background-repeat: no-repeat; background-size: cover; width: 44px; height: 44px; border-radius: 22px; }
.message-detail .messageDetail-li.female > .right { margin: 0 0 0 55px; padding: 0 0 0; min-height: auto; position: relative; display: flex; align-items: flex-end; z-index: 2; }
.message-detail .female .message-tail { position: relative; }
.message-detail .female .message-tail:before { content: ''; position: absolute; top: 12px; left: auto; left: -10px; display: block; width: 16px; height: 13px; z-index: 3; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_tail_female_over.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; border: none; }
.message-detail .female .message-tail:after { content: ''; position: absolute; top: 12px; left: auto; left: -10px; display: block; width: 16px; height: 13px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_tail_female_base.svg"); z-index: 1; background-repeat: no-repeat; background-size: contain; background-position: center; border: none; }
.message-detail .female.msg_pic .message-tail::before, .message-detail .female.msg_pic .message-tail::after, .message-detail .female.msg_movie .message-tail::before, .message-detail .female.msg_movie .message-tail::after { display: none; }
.message-detail .male .message-type { display: inline-block; padding: 0 10px; color: #444; font-size: 12px; background-color: #FFF; height: 25px; line-height: 25px; border-radius: 10px; margin: 10px 0 5px 15px; }
.message-detail .female .message-type { display: inline-block; padding: 0 10px; color: #FFF; font-size: 12px; background-color: #FFA3A3; height: 25px; line-height: 25px; border-radius: 10px; margin: 10px 0 0 15px; }
.message-detail .messageDetail-li-date { padding: 10px 0 5px 0; text-align: center; }
.message-detail .messageDetail-li-date > span { display: inline-block; background-color: #F3F3F4; color: #898795; height: 30px; line-height: 30px; font-size: 13px; padding: 0px 25px; border-radius: 20px; margin-bottom: 10px; }
.message-detail .message-data-container { display: flex; align-items: flex-end; margin-bottom: 5px; }
.message-detail .message-data { position: relative; bottom: -1px; width: auto; line-height: 1; font-size: 11px; left: 0; color: #AAA; text-align: right; margin: 0 8px 0 0; display: flex; flex-direction: column; }
.message-detail .female .message-data { margin: 0 0 0 5px; }
.message-detail .kidoku-flg { margin-bottom: 5px; }
.message-detail .mail_del { margin: 0 5px 0 0; }
.message-detail .female .mail_del { margin: 0 0 0 2px; }
.message-detail .mail_del a { display: block; }
.message-detail .mail_del a img { position: relative; top: 1; opacity: 1; }
.message-detail .dustbox { width: 18px; height: 18px; }
.message-detail .messageDetail-thumb2 { position: relative; margin: 5px; width: 246px; height: auto; background-size: contain; background-position: center; background-repeat: no-repeat; border-radius: 15px; max-height: 456px; padding: 0; margin: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-flow: column; }
.message-detail .messageDetail-thumb2 img { width: 20%; margin: .5rem; }
.message-detail .messageDetail-thumb2 > .show { position: absolute; top: 0; height: 100%; width: 100%; }
.message-detail .msg_pic .message-wrap { width: 256px !important; }
.message-detail .female.message-wrap a { width: 256px; }
.message-detail .msg_pic p { padding: 15px; }
.message-detail .female.msg_pic .message-tail:before { z-index: 2 !important; }
.message-detail .msg_pic .message-wrap a { display: block; position: relative; max-height: 456px; display: block; position: relative; max-height: 456px; aspect-ratio: 1 / 1; padding: 5px; }
.message-detail .message-temp-lock { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.message-detail .message-temp-lock::before { content: ""; display: inline-block; position: relative; width: 48px; height: 48px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_lock_white.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; margin-bottom: 20px; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2)); }
.message-detail .message-temp-pay { width: 170px; height: 40px; line-height: 40px; border-radius: 100px; background-color: #FFE836; font-size: 15px; color: #222; display: inline-block; text-align: center; margin: 0 auto; width: auto; padding: 0 1rem; height: 40px; line-height: 40px; border-radius: 100px; background-color: #FFE836; font-size: 14px; color: #222; display: inline-block; text-align: center; margin: 0 auto; white-space: nowrap; }
.message-detail .msg_movie .message-wrap { width: 256px !important; }
.message-detail .msg_movie p { padding: 15px; }
.message-detail .female.msg_movie .message-tail::before { z-index: 2 !important; }
.message-detail .msg_movie .message-wrap a { display: block; position: relative; max-height: 456px; }
.message-detail .icon-movie-play { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 80px; height: 80px; background: url("/assets/vivo_0218/img/lp/lp25/icon_movie_play.svg") no-repeat; background-size: contain; background-position: center; }
.message-detail .messageList-wrap { background: #FAF5F0; padding-top: 1px; }
.message-detail .message-box-li-wrap { border-radius: 8px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
@media screen and (max-width: 360px) { .message-detail .female .message-data-container { flex-direction: column-reverse; align-items: center; }
  .message-detail .female .mail_del { margin: 0 0 5px 0; } }
@media screen and (width: 320px) { .message-detail .messageDetail-thumb2 { width: 220px; }
  .message-detail .msg_movie .message-wrap { width: 220px !important; }
  .message-detail .msg_pic .message-wrap { width: 220px !important; } }
@media screen and (width: 320px) { .message-detail .msg_pic .message-wrap { width: 100% !important; } }
.message-detail .message-headline-fixed .message-headline > .right .name-wrap { line-height: 1; }
.message-detail .load-page-box.scroll-down { transform: translateY(140px); }
.message-detail .load-page-box.focus-down { transform: translateY(140px); }
.message-detail .load-page-box { position: absolute; display: flex; justify-content: space-between; align-items: center; width: 100%; height: 42px; top: -50px; font-size: 10px; transition: 0.3s; }
.message-detail .load-page-box a:visited, .message-detail .load-page-box a:hover, .message-detail .load-page-box a:active, .message-detail .load-page-box a:focus { color: #fff; }
.message-detail .kyohi-sorry-fixed .load-page-box { top: -107px; }
.message-detail .prev-btn, .message-detail .next-btn { position: absolute; display: flex; justify-content: center; align-items: flex-end; box-sizing: border-box; width: 34px; height: 42px; padding-bottom: 4px; color: #fff; background-color: #403C53B3; }
.message-detail .prev-btn { border-radius: 0 8px 8px 0; padding-right: 3px; left: 0; }
.message-detail .next-btn { border-radius: 8px 0 0 8px; padding-left: 3px; right: 0; }
.message-detail .load-page-box .reload { position: absolute; display: flex; justify-content: center; align-items: flex-end; box-sizing: border-box; width: 56px; height: 42px; color: #666666; background-color: #fff; border-radius: 8px; border: 1px solid #333; margin: 0; padding-bottom: 3px; top: 0; right: calc(50% - 28px); }
.message-detail .prev-btn::after, .message-detail .next-btn::after, .message-detail .load-page-box .reload::after { content: ''; position: absolute; background-repeat: no-repeat; background-size: 16px; width: 16px; height: 16px; top: 6px; }
.message-detail .prev-btn::after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_arrow_left_white.svg"); }
.message-detail .next-btn::after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_arrow_right_white_next.svg"); }
.message-detail .load-page-box .reload::after { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_reload_gray.svg"); }
.message-detail .message-input-wrap { /*下に行ったときに透けないようにするため*/ background-color: #fff; }
.message-detail .message-form-fixed, .message-detail .kyohi-sorry-fixed { position: fixed; bottom: 0; width: 100%; z-index: 98; background: #FFF; padding-bottom: calc(env(safe-area-inset-bottom) * 1.55); }
.message-detail .message-form-fixed.focus { padding: 0; }
.message-detail .pc-tab .message-form-fixed { width: var(--pc-tab-width); }
.message-detail .message-input-wrap { width: 100%; padding: 8px 0; border-top: 1px solid #D5DAE3; display: flex; justify-content: space-between; align-items: flex-end; position: relative; }
.message-detail .message-form-area { position: relative; margin: 0; }
.message-detail .message-textarea { width: 100%; height: 40px; min-height: 40px; max-height: 110px; background: #F6F6F6; border: 1px solid #EEEFF1; box-sizing: border-box; border-radius: 20px; color: #444; display: block; line-height: 1.5; font-size: 16px; padding: 7px 10px; resize: none; overflow: scroll; -webkit-appearance: none; }
.message-detail .message-textarea::placeholder { color: #aaa; }
.message-detail .android_mark { height: 60px !important; line-height: 1.7; }
.message-detail .message-input-file { position: relative; margin: 0 5px; height: 40px; display: flex; align-items: center; cursor: pointer; }
.message-detail .message-input-file:before { content: ""; display: block; width: 30px; height: 30px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_message_image.svg"); background-repeat: no-repeat; background-size: contain; background-position: center; }
.message-detail .message-input-file.active:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_message_image_active.svg"); }
.message-detail .message-input-file input { display: none; }
.message-detail .message-send-btn { height: 40px; display: flex; align-items: center; }
.message-detail .message-input-send { width: 34px; min-width: 34px; height: 34px; border: none; border-radius: 100px; background: #4C86ED url("/assets/vivo_0218/img/lp/lp25/icon_request_send.svg") no-repeat; background-size: contain; background-position: center; margin: 0 5px; }
.message-detail .message-file-select { background: #5085E3; padding: 8px 10px; border-radius: 10px; align-items: center; justify-content: center; font-size: 13px; font-weight: bold; color: #FFF; z-index: 99; filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15)); position: absolute; top: -40px; left: 10px; display: none; }
.message-detail .message-file-select.active { display: flex; }
.message-detail .message-file-select::after { top: 100%; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-top-color: #5085E3; border-width: 8px; margin-left: -8px; }
.message-detail .message-file-thumbnail { width: 24px; height: auto; max-height: 38px; overflow: hidden; margin-right: 6px; }
.message-detail .message-file-thumbnail img { width: 100%; }
.message-detail .message-send-error { position: absolute; left: 10px; top: -45px; background: #F84452; border-radius: 10px; padding: 10px; color: #FFF; font-weight: bold; display: none; }
.message-detail .message-send-error.active { display: inline-block; }
.message-detail .mailbox_adv_banner, .message-detail .hl-wrapper, .message-detail .detail-menu, .message-detail .tabbar { display: none; }
.message-detail .message-movie-show, .message-detail .message-img-show { position: relative; overflow: hidden; }
.message-detail .photo-image { display: block; margin: 0 auto; width: 100%; background-repeat: no-repeat; background-size: contain; background-position: center; }
.message-detail .photo-image.image-view { height: 0; }
.message-detail .show-detail-movie-time { display: inline-block; background-color: rgba(0, 0, 0, 0.8); border-radius: 6px; font-size: 13px; color: #FFF; height: 24px; line-height: 24px; padding: 0 10px; text-align: center; margin-top: 10px; }
.message-detail .message-back-container { text-align: center; margin-top: 80px; }
.message-detail .btn-message-back { display: inline-block; box-sizing: border-box; padding: 10px 25px; font-size: 14px; color: #333; border: 1px solid #888; border-radius: 100px; max-width: calc(100% - 30px); overflow: hidden; }
.message-detail .tablet { width: 320px !important; }
.message-detail .message-wrap-tablet { justify-content: unset !important; }
.message-detail .message-send-error a { color: #fff; }
.message-detail .message-detail-image-no-point, .message-detail .message-detail-movie-no-point { position: relative; max-height: 456px; cursor: pointer; }
.message-detail .keylock { position: fixed; top: 20px; right: 0px; left: 0px; z-index: 99999; }
.message-detail .keylock-iphone { position: fixed; top: 140px; right: 0px; left: 0px; z-index: 99999; }
.message-detail .bodylock { position: fixed !important; }
.message-detail .reload { margin: 10px 10px 30px 23px; padding: 3px 5px; border-radius: 5px; color: #fff; width: 15%; background-color: #999999; text-align: center; cursor: pointer; position: absolute; top: -50; right: 10px; }
.message-detail .message-detail-adv-banner-section { padding: 0px; margin: 0px 4px 30px; }
.message-detail .mailbox_adv_banner { margin: 20px auto; width: 100%; text-align: center; }
.message-detail .mailbox_adv_banner img { width: 80%; }
.message-detail #message-image-put-preview img { width: 30px; height: 30px; }
.message-detail .message-file-select > span { padding-left: 5px; }
.message-detail footer { /*	display: none;*/ }
.message-detail .app_info_fixed { display: flex; justify-content: center; align-items: center; background-image: url("/assets/vivo_0218/img/lp/lp25/public/developer/bg_app_dl_banner_green.png"); height: 75px; background-size: cover; }
.message-detail .app_info_fixed-left { width: 70px; display: flex; justify-content: center; align-items: center; margin-left: 1vw; }
.message-detail .app_info_fixed-left img { width: 55px; }
.message-detail .app_info_fixed-right { display: flex; flex-direction: column; justify-content: flex-start; width: 100%; margin-left: 0px; }
.message-detail .app_info_fixed-right-text { color: #fff; font-weight: bold; font-size: 14px; margin: 0px 0 0px 3px; }
.message-detail .app_info_fixed-right-btn { background-color: #fff; border-radius: 14px; width: 90px; color: #333333; display: flex; justify-content: center; align-items: center; position: relative; height: 18px; margin-top: 5px; padding: 3px 6px 3px 0px; box-sizing: content-box; }
.message-detail .app_info_fixed-right-btn a { color: #333333; text-decoration: none; font-size: 12px; font-weight: bold; box-sizing: content-box; }
.message-detail .app_info_fixed-right-btn a:before { content: ''; position: absolute; background-image: url("/assets/vivo_0218/img/lp/lp25/public/developer/icon_right_arrow_black.svg"); width: 14px; height: 14px; top: 5px; right: 0px; background-size: cover; }
.message-detail .app_info_fixed + ul { border-bottom: solid 1px #DDD; }
.message-detail .app_info_fixed-right-wrap { display: flex; justify-content: flex-start; align-items: center; font-size: 11px; }
.message-detail .app_info_fixed-right-getpoint { color: #fff; margin-left: 3px; }
.message-detail .app_info_prepoid { border: 1px solid #fff; padding: 3px; vertical-align: text-top; line-height: 8px; }
.message-detail .app_info_point { color: #FFF536; font-size: 22px; font-weight: bold; padding-left: 4px; }
.message-detail .app_info_present { color: #FFF536; padding-right: 5px; font-size: 16px; font-weight: bold; }
.message-detail main.app_fixed_style { margin-top: 75px !important; }
.message-detail .app_fixed_style .message-headline-fixed { top: 128px !important; }
.message-detail .app_fixed_style .messageDetail-ul { margin-top: 60px; }
.message-detail .btn-message-test { width: auto; position: fixed; top: 118px; left: 10px; padding: 2px 5px; background: #222; color: #FFF; border-radius: 4px; z-index: 9999; text-decoration: none; font-size: 13px; padding: 4px 8px; }
.message-detail .btn-message-test:active { opacity: 0.7; color: #FFF; }

:focus { outline: none; }

.display-hidden { display: none; }

body.livestream { padding-bottom: 0; }
body.livestream .content-wrap { position: relative; z-index: 4; height: 100dvh; }

.live-video-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }

.live-video-wrap video { object-fit: cover; object-position: top; width: 100%; height: 100%; }

.message-list-wrap { width: 100%; position: absolute; bottom: 70px; padding: 8px; box-sizing: border-box; }

.message-list-wrap ul { overflow-y: scroll; height: 160px; -webkit-mask-image: -webkit-linear-gradient(90deg, black 0%, black 80%, rgba(0, 0, 0, 0)); }

.message-list-wrap ul::-webkit-scrollbar { width: 0; }

.message-list-wrap li { margin-bottom: 12px; }

.message-list-wrap div { display: inline-flex; background: rgba(0, 0, 0, 0.3); border-radius: 8px; box-sizing: border-box; padding: 3px 8px; font-size: 12px; color: #fff; }

.message-list-wrap .stamp div, .message-list-wrap .tip div { align-items: center; }

.message-list-wrap p { word-break: break-all; display: inline-block; overflow-wrap: anywhere; }

.message-list-wrap li.stamp p img { width: 30px; height: auto; display: flex; align-self: center; }

.message-list-wrap .mens_name { text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 85px; min-width: 85px; color: rgba(255, 255, 255, 0.6); }

.content-header { z-index: 11; position: absolute; top: 0; padding: 8px; box-sizing: border-box; width: 100%; display: grid; grid-template-areas: "name-wrap user-infos disconnect-btn" "ready-message ready-message ready-message"; }

.content-footer { position: absolute; bottom: 5px; display: flex; align-items: center; color: #fff; padding: 8px; width: 100%; box-sizing: border-box; }

.tops-wrap { display: inline-flex; align-items: center; width: calc(100vw - 16px); }

.name-fa-wrap { min-width: 163px; max-width: 200px; padding: 5px 7px 5px 7px; box-sizing: border-box; background: rgba(0, 0, 0, 0.3); display: flex; align-items: center; flex-wrap: wrap; border-radius: 10px; grid-area: name-wrap; }

.name-fa-wrap .thumnail { width: 28px; height: 28px; border-radius: 50%; margin-right: 6px; }

.name-fa-wrap span { font-size: 14px; color: #fff; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.other-infos-wrap { display: flex; justify-content: space-between; width: 100%; }

.other-infos-wrap .time, .other-infos-wrap .user, .other-infos-wrap .comment, .other-infos-wrap .chip { font-size: 11px; font-weight: bold; color: #fff; height: 24px; box-sizing: border-box; display: inline-flex; align-items: center; margin-right: 5px; line-height: 1; }

.other-infos-wrap span:before { content: ''; width: 14px; height: 14px; background-repeat: no-repeat; background-size: cover; background-position: center; margin-right: 3px; }

.other-infos-wrap span.time:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_time_white.svg"); }

.other-infos-wrap span.user:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_users_white.svg"); }

.other-infos-wrap span.comment:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_white.svg"); }

.other-infos-wrap span.chip:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_chip_white.svg"); }

.fav-btn { margin-left: auto; background: #fff; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 7px; }

.fav-btn:before { content: ""; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_favorite_black.svg"); width: 16px; height: 16px; background-repeat: no-repeat; background-size: cover; background-position: center; }

.fav-btn.on { background: #FFBD27; }

.fav-btn.on:before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_favorite_white.svg"); }

.user-infos-wrap { padding: 5px 7px; box-sizing: border-box; display: flex; align-items: center; flex-wrap: wrap; grid-area: user-infos; margin: 0 5px; }

.user-id { display: flex; align-items: center; color: #fff; -webkit-text-fill-color: #fff; font-size: 16px; width: 100%; height: 28px; box-sizing: border-box; pointer-events: none; }

.now-point-wrap { grid-area: point-info; width: 100%; font-family: 'Lato'; }

.now-point-wrap a { display: inline-flex; align-items: center; color: #FFDE26; font-size: 14px; box-sizing: border-box; width: fit-content; font-family: 'Lato'; }

.now-point-wrap a.red { color: #ff3946; }

.now-point-wrap a::before { content: ""; width: 17px; height: 17px; margin-right: 4px; background-size: cover; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_point_yellow.svg"); }

.now-point-wrap a.red::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_point_red.svg"); }

.ready-message-wrap { grid-area: ready-message; box-sizing: border-box; background: rgba(57, 216, 155, 0.8); color: #fff; display: flex; align-items: center; border-radius: 8px; animation: 4s toggleColor infinite; animation-delay: 1s; margin-top: 25px; width: 100%; font-size: 14px; justify-content: center; height: 40px; }

.ready-message-wrap:after { content: ''; background: url("/assets/vivo_0218/img/lp/lp25/icon_question_white.svg"); width: 20px; height: 20px; background-size: contain; display: block; margin-left: 5px; }

@keyframes toggleColor { 0% { background: rgba(57, 216, 155, 0.8); }
  50% { background: rgba(0, 0, 0, 0.8); } }
.disconnect-btn { grid-area: disconnect-btn; height: 44px; width: 44px; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.3); border-radius: 50%; margin-left: auto; }

.disconnect-btn img { width: 30px; height: 30px; }

.open-input-area-btn { display: inline-flex; align-items: center; height: 36px; box-sizing: border-box; padding: 5px; background: rgba(0, 0, 0, 0.7); border-radius: 18px; width: calc(100% - 170px); }

.open-input-area-btn:before { content: ""; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_white.svg"); width: 24px; height: 24px; background-size: contain; background-position: center; background-repeat: no-repeat; margin: 0 8px 0 2px; }

.footer-btns { display: flex; margin: 15px 0 0 auto; width: 156px; justify-content: space-evenly; }

.footer-btns a { display: flex; flex-direction: column; align-items: center; justify-content: center; }

.footer-btns .comment span { position: relative; width: 36px; height: 36px; background: rgba(0, 0, 0, 0.7); border-radius: 50%; }

.footer-btns .comment span::before { content: ''; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_view_on_white.svg"); width: 26px; height: 26px; display: block; position: absolute; top: 5px; left: 5px; background-size: cover; border-radius: 50%; background-position: center; background-repeat: no-repeat; }

.footer-btns .comment.hidden span::before { background-image: url("/assets/vivo_0218/img/lp/lp25/icon_comment_view_off_red.svg"); }

.footer-btns .stanmp:after { content: 'スタンプ'; }

.footer-btns .chip:after { content: 'チップ'; }

.footer-btns .comment:after { content: '表示中'; }

.footer-btns .comment.hidden:after { content: '非表示中'; color: #F74747; }

.footer-btns img { width: 36px; height: 36px; background: rgba(0, 0, 0, 0.7); border-radius: 50%; padding: 5px; box-sizing: border-box; }

.dialog-wrap-bottom.getting-ready { flex-direction: column; padding: 20px; bottom: 20px; border-radius: 16px; width: 85%; left: calc(50% - calc(85%/2)); box-sizing: border-box; align-items: center; font-size: 14px; }

.dialog-wrap-bottom.points { padding: 16px; box-sizing: border-box; }

.dialog-wrap-bottom.open { display: block; z-index: 1; }

.dialog-wrap-bottom.getting-ready.open, .dialog-wrap-bottom.template-comments.open { display: flex; }

.dialog-wrap-bottom.template-comments { font-size: 15px; flex-direction: column; align-items: center; box-sizing: border-box; padding: 14px 22px 24px; }

.getting-ready .red { color: #FF4B4B; position: relative; left: 14px; margin-top: 9px; }

.getting-ready .red:before { content: '※'; position: absolute; left: -15px; }

.getting-ready-icon { width: 56px; height: 56px; box-sizing: border-box; padding: 10px; background: rgba(255, 123, 138, 0.3); border-radius: 50%; margin-bottom: 12px; }

.close-dialog-btn { position: absolute; width: 30px; height: 30px; border: 1px solid #333; border-radius: 50%; display: flex; align-items: center; justify-content: center; right: 10px; top: -15px; background: #fff; }

.dialog-inner-wrap .close-dialog-btn { right: -10px; }

.close-dialog-btn img { width: 25px; height: 25px; }

.stamps .item-list, .chips .item-list { padding: 20px 25px; display: grid; grid-template-columns: repeat(4, 14.4vw); grid-column-gap: 9.5vw; grid-row-gap: 1vw; overflow: scroll; height: 400px; }

.stamps .item-list li, .chips .item-list li { text-align: center; height: 19vw; }

.stamps .item-list li:nth-of-type(4n), .chips .item-list li:nth-of-type(4n) { margin-right: 0; }

.stamps .item-list img, .chips .item-list img { width: 14.4vw; height: 14.4vw; }

.stamps .item-list a, .chips .item-list a { color: #333; }

.dialog-wrap { display: none; position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); }

.dialog-inner-wrap { display: none; width: 85%; height: auto; background: #fff; position: fixed; border-radius: 13px; z-index: 2; top: 50%; left: calc(50% - calc(85%/2)); font-size: 14px; text-align: center; padding: 20px 0 25px; }

.dialog-wrap.open { z-index: 1; }

.dialog-wrap.open, .dialog-inner-wrap.open { display: block; }

.dialog-inner-wrap.stamp, .dialog-inner-wrap.chip { top: calc(50% - 120px); }

.dialog-inner-wrap.disconnect { padding-top: 30px; top: calc(50% - 104px); }

.dialog-inner-wrap.point { text-align: left; top: calc(50% - 138px); }

.dialog-inner-wrap.point-bought { top: calc(50% - 100px); }

.dialog-inner-wrap.not-registered-credit { top: calc(50% - 86px); }

.dialog-inner-wrap.stamp.open, .dialog-inner-wrap.chip.open, .dialog-inner-wrap.disconnect.open, .dialog-inner-wrap.point.open, .dialog-inner-wrap.point-bought.open, .dialog-inner-wrap.not-registered-credit.open { display: flex; flex-direction: column; align-items: center; }

.point-icon-wrap { display: flex; flex-direction: column; align-items: center; margin-bottom: 14px; font-size: 16px; font-weight: bold; }

.point-icon-wrap img { width: 64px; height: 64px; }

.point-balloon { position: absolute; font-size: 10px; display: flex; justify-content: center; align-items: center; box-sizing: border-box; background: linear-gradient(90deg, #FF3C87 10%, #FF9831 100%); border-radius: 8px; color: #fff; left: 75px; top: -8px; width: 54px; height: 23px; }

.point-balloon:before { content: ''; display: block; position: absolute; width: 0; height: 0; border-style: solid; border-width: 6px; border-color: #FF3C87 transparent transparent transparent; bottom: -4px; transform: rotate(126deg) skew(0deg, 15deg); z-index: 0; left: 4px; }

.point-bought .message-wrap { margin: 22px auto 15px; text-align: left; }

.point-bought .message-wrap p { height: 52px; line-height: 1.8; }

.point-bought .message-wrap span { font-size: 18px; color: #F83D43; font-weight: bold; }

.btn { width: 200px; height: 46px; line-height: 46px; border-radius: 23px; margin-top: 20px; box-sizing: border-box; text-align: center; }

.btn:disabled { opacity: .5; }

.do.btn { background: #5675F8; color: #fff; }

.stop.btn { background: #F74747; color: #fff; }

.cancel.btn { border: 1px solid #707070; }

.mute-off.btn { position: absolute; z-index: 1; top: 200px; left: calc(50vw - 100px); margin: 0; background: rgba(0, 0, 0, 0.8); color: #fff; font-size: 14px; }

.dialog-wrap-bottom.points .head { display: flex; align-items: center; font-size: 13px; }

.dialog-wrap-bottom.points .head img { width: 54px; height: auto; margin-right: 13px; }

.point-list { margin-top: 15px; }

.point-list li { display: flex; align-items: center; width: 100%; height: 56px; border-top: 1px solid #DDDDDD; position: relative; }

.point-list .point { display: flex; align-items: center; font-size: 16px; font-weight: bold; font-family: 'Lato'; width: 110px; }

.point-list .point img { width: 20px; height: 20px; margin-right: 7px; }

.price { font-size: 15px; color: #666666; font-family: 'Lato'; }

.buy-btn { width: 70px; height: 30px; background: #5675F8; color: #fff; text-align: center; line-height: 30px; border-radius: 15px; margin-left: auto; }

.comment-input-wrap { display: flex; position: absolute; z-index: 8; bottom: 0; background: #fff; width: 100%; height: 68px; align-items: center; padding: 0 8px; box-sizing: border-box; }

.comment-input-wrap.open { display: flex; }

.open-template-comments { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 49px; height: 49px; border: 1px solid #CCCCCC; border-radius: 8px; margin-right: 8px; box-sizing: border-box; }

.open-template-comments img { width: 25px; height: 25px; }

.comment-input-wrap input { appearance: none; -webkit-appearance: none; margin: 0; border: 1px solid #EEEFF1; background: #F6F6F6; font-size: 14px; width: calc(100% - 50px); height: 38px; box-sizing: border-box; padding: 0 10px; border-radius: 19px; }

.comment-send { background: #5675F8; width: 38px; height: 38px; display: flex; border-radius: 50%; align-items: center; justify-content: center; margin-left: auto; }

.comment-send img { width: 70%; height: 70%; }

.point-price-wrap { display: flex; flex-direction: column; align-items: center; }

.point-price-wrap img { width: 42px; height: 42px; margin-bottom: 12px; }

.point .message-wrap { display: flex; align-items: flex-start; border-top: 1px solid #DDDDDD; padding-top: 15px; margin-top: 15px; }

.point .message-wrap img { margin-right: 14px; width: 54px; height: 37px; }

.point-price-wrap .blue { color: #5675F8; }

.point .message-wrap p { margin-top: -4px; }

.template-comment-list input { display: none; }

.template-comment-list label { display: flex; align-items: center; }

.template-comment-list label:before, .template-comment-list input:checked + label:before { content: ''; min-width: 20px; height: 20px; border-radius: 50%; margin-right: 11px; }

.template-comment-list label:before { box-shadow: 0 0 0 1px #707070 inset; }

.template-comment-list input:checked + label:before { box-shadow: 0 0 0 2px #5675f8 inset, 0 0 0 5px #fff inset, 0 0 0 15px #5675f8 inset; }

.template-comment-list { width: 100%; }

.template-comment-list li { height: 42px; margin-bottom: 5px; }

.tip-icon { background-size: cover; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; }

.tip-icon.tip-1 { background-image: url("/assets/vivo_0218/img/lp/lp25/img_chip_red.png"); }

.tip-icon.tip-5 { background-image: url("/assets/vivo_0218/img/lp/lp25/img_chip_blue.png"); }

.tip-icon.tip-10 { background-image: url("/assets/vivo_0218/img/lp/lp25/img_chip_green.png"); }

.tip-icon.tip-30 { background-image: url("/assets/vivo_0218/img/lp/lp25/img_chip_orange.png"); }

.touch-area { position: absolute; width: 100%; height: 100%; z-index: 0; }

.stamp_img { position: absolute; animation-name: stamps; animation-timing-function: ease-in-out; animation-iteration-count: 1; animation-direction: alternate; animation-duration: 4s; z-index: 1; }

@keyframes stamps { 0% { transform: translate(0, 0px); }
  100% { transform: translate(0, 30px); } }
@media screen and (max-width: 350px) { .name-fa-wrap { max-width: 134px; min-width: auto; }
  .name-fa-wrap span { font-size: 11px; }
  .user-infos-wrap { padding: 5px 0; }
  .user-id { font-size: 14px; }
  .disconnect-btn { width: 35px; height: 35px; }
  .disconnect-btn img { width: 30px; height: 30px; } }
/*************************
クレジット決済ダイアログ関連
*************************/
.dialog { width: 80%; padding-top: 20px; color: #333333; }

.credit-recommend-dialog .dialog { padding: 20px; top: calc(50% - 124px); }

.dialog .po-now-txt-wrap { margin-bottom: 35px; font-weight: 500; display: flex; align-items: center; }

.po-now-txt-wrap:before { content: ""; background-image: url("/img/public/developer/webrtc_video/icon_point_orange.svg"); width: 24px; height: 24px; display: block; background-size: contain; background-position: center; background-repeat: no-repeat; display: block; margin-right: 10px; }

.credit-recommend-dialog a.blue { width: 225px; height: 56px; border-radius: 28px; line-height: normal; margin: auto; display: flex; justify-content: center; font-size: 14px; }

.credit-recommend-dialog a.blue span { display: flex; align-items: center; }

.credit-recommend-dialog a.blue span:before { content: ""; background-image: url("/img/public/developer/webrtc_video/icon_credit_white.svg"); width: 30px; height: 30px; display: block; margin-right: 16px; background-size: contain; background-position: center; background-repeat: no-repeat; }

.credit-recommend-dialog a.cancel { width: 133px; height: 36px; line-height: 36px; font-size: 12px; margin-bottom: 15px; }

.dialog .po-now-txt p { margin: 0; text-align: left; }

.buy_dialog .dialog { top: calc(50% - 173px); }

.dialog-inner .dialog-head { display: flex; align-items: center; margin: 0 auto 15px; padding-bottom: 3px; width: 90%; text-align: left; font-size: 14px; font-weight: 600; }

.dialog-inner .dialog-head:before { display: block; content: ""; width: 20px; height: 20px; margin-right: 5px; background-position: center; background-repeat: no-repeat; }

.buy_dialog .dialog .dialog-inner .dialog-head:before, .credit-dialog .dialog .dialog-inner .dialog-head:before { background-image: url("/img/public/developer/webrtc_video/icon_bag_white.svg"); background-size: 70%; background-color: #FFAC26; border-radius: 10px; }

.credit-dialog .dialog .dialog-inner .dialog-head { margin-bottom: 12px; }

.credit-dialog .dialog .dialog-inner .dialog-head:before { border-radius: 50%; width: 36px; height: 36px; }

.credit-dialog .inner-wrap { display: flex; flex-direction: column; align-items: center; }

.credit-dialog .inner-wrap .close-btn { display: flex; justify-content: center; align-items: center; width: 186px; height: 46px; background-color: #5675F8; border-radius: 25px; font-size: 14px; color: #ffffff; margin: 24px auto 20px; cursor: pointer; }

.dialog-inner .dialog-caption { margin-bottom: 30px; }

.credit-dialog .dialog-inner .dialog-caption { text-align: left; margin: 0; }

.buy_dialog .dialog .dialog-inner .point-table { display: flex; align-items: center; width: 90%; height: 50px; margin: 0 auto 10px; border-radius: 8px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); }

.buy_dialog .dialog .dialog-inner .point-table .point { display: flex; align-items: center; box-sizing: border-box; width: 50%; height: calc(100% - 10px); padding: 0 10px; border-right: 1px solid #cccccc; font-size: 16px; font-weight: 400; }

.buy_dialog .dialog .dialog-inner .point-table .price { display: flex; align-items: center; box-sizing: border-box; width: 50%; height: calc(100% - 10px); padding: 0 10px; font-size: 16px; font-weight: 600; }

.buy_dialog .dialog .dialog-inner .point-table .point:before { display: block; content: ""; width: 22px; height: 22px; margin-right: 3px; background-image: url("/img/public/developer/webrtc_video/icon_point_orange.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.payment-dialog .dialog { padding: 15px; height: 230px; top: calc(50% - 115px); }

.payment-dialog .dialog .dialog-inner .payment-dialog-head { display: flex; align-items: center; margin-bottom: 14px; padding-bottom: 9px; border-bottom: 1px solid #DDDDDD; }

.payment-dialog .dialog .dialog-inner .payment-dialog-head .credit-card-img { display: block; width: 50px; height: auto; margin-right: 12px; }

.payment-dialog .dialog .dialog-inner .payment-dialog-head p { margin: 0; padding: 0; text-align: left; font-size: 13px; font-weight: 600; }

.payment-dialog .dialog .dialog-inner .payment-dialog-point { display: flex; align-items: center; margin-bottom: 12px; font-size: 15px; font-weight: 900; }

.payment-dialog .dialog .dialog-inner .payment-dialog-point:before { display: block; content: ""; width: 25px; height: 25px; margin-right: 5px; background-image: url("/img/public/developer/webrtc_video/icon_point_yellow.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.payment-dialog .dialog .dialog-inner .payment-dialog-price { font-size: 14px; font-weight: 700; margin-bottom: 15px; }

.payment-dialog .dialog .dialog-inner .payment-dialog-price .price-text, .complete-dialog .dialog .dialog-inner .complete-dialog-text .point-text { display: inline-block; font-size: 18px; font-weight: 900; color: #45A2FC; margin-right: 5px; }

.complete-dialog .dialog .dialog-inner .complete-dialog-text .point-text { margin-left: 5px; }

.payment-dialog .dialog .dialog-inner .dialog-btn-box { display: flex; justify-content: space-between; margin-bottom: 10px; }

.payment-dialog .dialog .dialog-inner .dialog-btn-box .dialog-btn, .complete-dialog .dialog .dialog-inner .dialog-btn { display: flex; justify-content: center; align-items: center; box-sizing: border-box; height: 46px; border-radius: 23px; }

.payment-dialog .dialog .dialog-inner .dialog-btn-box .dialog-btn.cancel-btn { width: calc(40% - 5px); color: #333333; border: 1px solid #707070; }

.payment-dialog .dialog .dialog-inner .dialog-btn-box .dialog-btn.submit-btn { width: calc(60% - 5px); color: #fff; background-color: #5675F8; }

.complete-dialog .dialog { padding: 15px; height: 180px; top: calc(50% - 90px); }

.complete-dialog .dialog .dialog-inner .dialog-head { width: 100%; margin: 0 0 15px; padding: 0 0 7px; border-bottom: 1px solid #CCCCCC; font-size: 16px; }

.complete-dialog .dialog .dialog-inner .dialog-head:before { display: block; content: ""; width: 25px; height: 25px; margin-right: 5px; background-image: url("/img/public/developer/webrtc_video/icon_point_gray.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.complete-dialog .dialog .dialog-inner .complete-dialog-text { font-size: 14px; font-weight: 600; margin-bottom: 30px; }

.complete-dialog .dialog .dialog-inner .close-btn { width: 50%; margin: 0 auto; color: #fff; background-color: #5675F8; }

/*=======
無料視聴中
========*/
.freeview-indicator { position: fixed; display: flex; justify-content: center; align-items: center; top: 76px; left: 7px; }

.freeview-indicator-inner { position: relative; display: flex; justify-content: center; align-items: center; gap: 8px; z-index: 1; }

.freeview-indicator-inner::before { content: ''; position: absolute; width: 100%; height: 100%; background-image: url("/assets/vivo_0218/img/lp/lp25/object_live_ticket_display_frame.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; top: 0; z-index: 2; }

.freeview-indicator-inner .left-box { display: flex; justify-content: center; align-items: center; width: 70px; height: 24px; background-color: #fff; border-radius: 4px 0 0 4px; color: #F05697; font-size: 12px; border: 1px solid #F05697; border-right: 1px solid #fff; }

.freeview-indicator-inner .right-box { display: flex; justify-content: center; align-items: center; width: 70px; height: 26px; background-color: #F05697; border-radius: 0 4px 4px 0; color: #fff; font-size: 10px; font-weight: bold; }

.freeview-indicator-inner .right-box .ticket-cnt { display: inline-block; margin: 0 3px 0 2px; font-size: 19px; }

.dialog-confirm-paid-view { position: fixed; display: none; flex-direction: column; justify-content: center; align-items: center; width: 100%; height: 100dvh; background: rgba(0, 0, 0, 0.25); backdrop-filter: blur(20px) brightness(80%); top: 0; left: 0; z-index: 9999; }

.dialog-confirm-paid-view.open { display: flex; }

.livefree-contents { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; }

.livefree-contents .ms-1-3 { margin: 0 1px 0 3px; }

.livefree-contents .livefree-title { color: #fff; font-size: 18px; font-weight: bold; }

.livefree-contents .livefree-text { color: #fff; font-size: 15px; margin-top: 8px; }

.livefree-contents .livefree-time { color: #fff; font-size: 12px; margin-top: 5px; }

.livefree-contents .livefree-btn-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 100%; margin-top: 60px; }

.livefree-contents .livefree-balloon { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; width: 142px; padding: 10px 16px; background: #fff; border-radius: 8px; box-sizing: border-box; }

.livefree-contents .livefree-balloon:after { top: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-top-color: #fff; border-width: 7px; margin-left: -7px; }

.livefree-contents .livefree-balloon-title { position: relative; font-size: 15px; font-weight: bold; width: 100%; text-align: center; padding-left: 22px; box-sizing: border-box; }

.livefree-contents .livefree-balloon-title:before { content: ""; position: absolute; width: 25px; height: 25px; background-image: url("/assets/vivo_0218/img/lp/lp25/icon_live_light_purple.svg"); background-size: contain; background-position: center; background-repeat: no-repeat; top: calc(50% - 25px/2); left: 0; }

.livefree-contents .livefree-balloon-point { display: flex; justify-content: center; align-items: center; width: 100%; height: 26px; margin-top: 5px; padding: 4px 0; background-color: #F8E5FF; border-radius: 3px; font-size: 15px; font-weight: bold; }

.livefree-contents .livefree-balloon-point span { font-size: 12px; }

.livefree-contents .livefree-confirm { display: flex; justify-content: center; align-items: center; width: 305px; margin-top: 10px; padding: 16px 0; background-color: #D35FFF; border-radius: 100px; color: #fff; font-size: 18px; font-weight: bold; }

.livefree-contents .livefree-stop { display: flex; justify-content: center; align-items: center; width: 128px; margin-top: 80px; padding: 12px 0; border: 1px solid #fff; border-radius: 100px; color: #fff; font-size: 14px; }
