/* Reward page CSS: pruned from the verified desktop, mobile, menu, modal, and slider states. */
html { text-size-adjust: 100%; box-sizing: border-box; tab-size: 4; word-break: normal; }
*, ::after, ::before { background-repeat: no-repeat; box-sizing: inherit; }
* { margin: 0px; padding: 0px; }
details, main { display: block; }
a { background-color: transparent; }
a:active, a:hover { outline-width: 0px; }
button, input, optgroup, select, textarea { font: inherit; }
button { overflow: visible; }
button, select { text-transform: none; }
[role="button"], [type="button"], [type="reset"], [type="submit"], button { cursor: pointer; }
[type="reset"], [type="submit"], button, html [type="button"] { appearance: button; }
button, input, select, textarea { background-color: transparent; border-style: none; }
a:focus, button:focus, input:focus, select:focus, textarea:focus { outline-width: 0px; }
img { border-style: none; }
[aria-controls] { cursor: pointer; }
.slick-slider { position: relative; display: block; box-sizing: border-box; user-select: none; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0px; padding: 0px 0px 5px; }
.slick-list:focus { outline: none; }
.slick-slider .slick-track, .slick-slider .slick-list { transform: translate3d(0px, 0px, 0px); }
.slick-track { position: relative; top: 0px; left: 0px; display: block; margin-left: auto; margin-right: auto; }
.slick-track::before, .slick-track::after { display: table; content: ""; }
.slick-track::after { clear: both; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
.slick-slide img { display: block; }
.slick-initialized .slick-slide { display: block; }
.slick-dotted.slick-slider { margin-bottom: 30px; }
.slick-dots { position: static; display: block; width: 100%; padding: 0px; margin: 10px 0px 0px; list-style: none; text-align: center; }
.slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0px 5px; padding: 0px; cursor: pointer; }
.slick-dots li button { font-size: 0px; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0px; outline: none; background: transparent; }
.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }
.slick-dots li button:hover::before, .slick-dots li button:focus::before { opacity: 1; }
.slick-dots li button::before { font-size: 70px; position: absolute; top: 0px; left: 0px; width: 20px; height: 20px; content: "•"; text-align: center; opacity: 0.5; color: rgb(255, 255, 255); -webkit-font-smoothing: antialiased; }
.slick-dots li.slick-active button::before { opacity: 1; color: rgb(231, 20, 37); }
:root { --color-main: #333333; --color-key: #e71425; --color-bg: #ffffff; --font: "Kiwi Maru", serif; --space-xs: clamp(8px, 2.5vw, 10px); --space-sm: clamp(12px, 5vw, 20px); --space-md: clamp(20px, 7.5vw, 30px); --space-l: clamp(24px, 10vw, 40px); --space-xl: clamp(32px, 12.5vw, 50px); --space-2xl: clamp(40px, 15vw, 60px); --space-3xl: clamp(48px, 17.5vw, 70px); --space-4xl: clamp(56px, 20vw, 80px); --transition: .5s ease; }
* { font-style: normal; margin: 0px; padding: 0px; text-align: left; box-sizing: border-box; }
html, body { scroll-behavior: smooth; }
[id] { scroll-margin-top: 60px; }
body { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; color: var(--color-main); font-size: 16px; line-height: 1.5; font-weight: 400; background: url("images/common/pc_bg.jpg") center center / cover no-repeat fixed; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
li { list-style-type: none; }
p { line-height: 1.8; }
img { height: auto; max-width: 100%; vertical-align: bottom; }
#topimage .slider1:not(.slick-initialized) > li:not(:first-child), .slider2:not(.slick-initialized):not(.bonus-native-slider) > li:not(:first-child), .slider3:not(.slick-initialized) > li:not(:first-child) { display: none; }
#topimage .slider1:not(.slick-initialized), .slider2:not(.slick-initialized):not(.bonus-native-slider), .slider3:not(.slick-initialized) { overflow: hidden; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
.layout { position: relative; }
.z-02 { position: relative; z-index: 2; }
.m20b { margin-bottom: 20px !important; }
.mb01 { margin-bottom: var(--space-xs); }
.mb02 { margin-bottom: var(--space-sm); }
.mb03 { margin-bottom: var(--space-md); }
.mb04 { margin-bottom: var(--space-l); }
.mb05 { margin-bottom: var(--space-xl); }
.mb08 { margin-bottom: clamp(40px, 24vw, 100px); }
.p-i01 { padding-inline: clamp(10px, 4vw, 30px); }
.p-b03 { padding-block: var(--space-l); }
.txtRed { color: var(--color-key); }
.txtBlack { color: var(--color-main); }
.txtWhite { color: rgb(255, 255, 255) !important; }
.txt10 { font-size: 77% !important; }
.txt11 { font-size: 92% !important; }
.f-maru { font-family: var(--font); font-style: normal; }
.cen { text-align: center !important; }
.bg01 { background: linear-gradient(rgb(255, 241, 235) 0%, rgb(255, 207, 202) 100%); }
.bg04 { position: relative; padding-top: var(--space-l); background: url("images/common/bg02-t.jpg") center top / 100% no-repeat rgb(255, 234, 225); }
.bg04::after { content: ""; position: absolute; left: 50%; bottom: -60px; transform: translateX(-50%); width: 110%; height: 210px; background: rgb(255, 234, 225); border-radius: 50%; z-index: 1; }
.line01 { padding-bottom: 5px; border-bottom: dotted 2px var(--color-key); }
.secstyle01 { position: relative; }
.secstyle01::before { content: " "; width: 100%; height: 50px; display: block; background: url("images/common/bg01.png") 0% 0% / 11px; }
.hstyle02 { color: var(--color-key); font-family: var(--font); font-size: min(5.5vw, 26px); text-align: center; }
.hstyle05 { display: inline-block; position: relative; padding: 10px 15px; color: var(--color-key); font-family: var(--font); font-size: min(4.8vw, 24px); text-align: center; }
.hstyle05::before { content: " "; position: absolute; left: 0px; top: 0px; background: url("images/common/commnet01_b.png") left top / 100% no-repeat; width: 20px; height: 25px; }
.hstyle05::after { content: " "; position: absolute; right: 0px; bottom: 0px; background: url("images/common/commnet01_a.png") right top / 100% no-repeat; width: 20px; height: 25px; }
.slider-bg { position: relative; padding-inline: 5%; }
.slider-bg::before { content: " "; position: absolute; top: calc(50% - 10px); left: 0px; background: var(--color-key); width: 100%; height: 1px; }
.ulstyle01 li.inner { border: solid var(--color-key) 1px; border-radius: 10px; overflow: hidden; background: rgb(255, 255, 255); box-shadow: rgba(206, 9, 25, 0.5) 0px 4px 0px; }
.ulstyle01 li.inner { margin-right: 1px; }
.ulstyle01 li .ttl.bgred { padding-block: var(--space-xs); background: var(--color-key); font-family: var(--font); font-size: min(4.8vw, 24px); }
.ulstyle01 li .text { padding: var(--space-sm); }
#reward01 .reward-workstyle-list-wrap { padding-inline: 5%; }
#reward01 .reward-workstyle-list { display: grid; gap: var(--space-xl); margin: 0px; padding: 0px; }
#reward01 .reward-workstyle-list > li.inner { width: 100%; margin: 0px; }
.ulstyle03 li { padding-top: 20px; padding-bottom: 40px; position: relative; }
.ulstyle03 li::before { content: " "; position: absolute; left: 0px; top: 0px; width: 97%; height: 100%; background: rgb(255, 255, 255); border-radius: 0px 0px 80px; box-shadow: rgba(0, 0, 0, 0.1) 3px 3px 8px; z-index: 1; }
.ulstyle03 li:nth-of-type(2n)::before { left: auto; right: 0px; border-radius: 0px 0px 0px 80px; }
.ulstyle03 li .boxstyle01, .ulstyle03 li p { position: relative; z-index: 2; }
.ulstyle03 li .boxstyle01 .ttl1 { padding-inline: var(--space-xs); font-size: clamp(12px, 4.6vw, 22px); line-height: 2; }
.ulstyle03 li p { padding-top: var(--space-sm); padding-left: var(--space-xs); padding-right: var(--space-l); }
.ulstyle03 li:nth-of-type(2n) p { padding-left: var(--space-l); padding-right: var(--space-xs); }
.boxstyle01 { display: flex; flex-wrap: wrap; justify-content: space-between; }
.boxstyle01.rev { flex-direction: row-reverse; }
.boxstyle01.center { align-items: center; }
.wid01 { width: 48%; }
.wid02 { width: 50%; }
.link01 a { padding: var(--space-xs); display: inline-block; background: rgb(220, 54, 68); color: rgb(255, 255, 255); font-family: var(--font); border-radius: 20px; box-shadow: rgba(103, 92, 93, 0.5) 0px 0px 8px; }
.link02 a { padding: 15px 40px 15px 15px; background: url("images/common/link02.png") right 10px center / 20px no-repeat rgb(220, 54, 68); font-size: min(4.1vw, 20px); }
.photo01 { padding: var(--space-xs); display: grid; gap: 2vw; grid-template-columns: repeat(3, 1fr); }
.photo01 img:nth-of-type(2), .photo01 picture:nth-of-type(2) { margin-top: 20px; }
.header { position: fixed; inset: 0px auto auto 0px; width: 100%; min-height: 55px; z-index: 5; background: rgba(255, 255, 255, 0.7); }
body.menu-open .header { background: none !important; }
.header-site-title { position: absolute; top: 1px; left: 50%; transform: translateX(-50%); z-index: 20; display: block; width: auto; white-space: nowrap; font-size: 11px; line-height: 1.4; text-align: center; margin: 0px; font-weight: 400; pointer-events: auto; }
.header-site-title a { position: relative; z-index: 21; display: inline-block; color: inherit; text-decoration: none; pointer-events: auto; }
.logo { display: flex; justify-content: center; align-items: center; height: auto; padding-top: 18px; padding-bottom: 5px; }
.logo img { display: block; width: 80px; height: auto; }
.circle-text { display: none; }
.hamburger { position: fixed; top: 0px; right: 0px; width: 56px; height: 56px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; z-index: 7; transition: var(--transition); }
.hamburger span { position: absolute; left: 50%; transform: translateX(-50%); width: 24px; height: 2px; background: rgb(232, 32, 48); transition: var(--transition); }
.hamburger span:nth-child(1) { top: 20px; }
.hamburger span:nth-child(2) { top: 27px; }
.hamburger span:nth-child(3) { top: 34px; }
.hamburger.active span:nth-child(1) { top: 27px; transform: translateX(-50%) rotate(45deg); }
.hamburger.active span:nth-child(2) { opacity: 0; }
.hamburger.active span:nth-child(3) { top: 27px; transform: translateX(-50%) rotate(-45deg); }
body.menu-open { overflow: hidden; height: 100dvh; overscroll-behavior: none; }
.nav { position: fixed; inset: 0px; opacity: 0; visibility: hidden; transition: opacity 0.4s, visibility 0.4s; z-index: 6; padding-top: 60px; padding-bottom: 20px; background: rgba(17, 17, 17, 0.94); overflow-y: scroll; }
.nav.active { opacity: 1; visibility: visible; }
.nav-list a { display: block; border-bottom: 1px solid rgb(102, 102, 102); padding-block: var(--space-xs); padding-inline: var(--space-sm); background: url("images/common/list03.png") right 20px center / 8px no-repeat; color: rgb(255, 255, 255); font-size: clamp(12px, 4.3vw, 22px); }
.area-list-sp { padding: var(--space-sm); display: grid; gap: 10px; grid-template-columns: 1fr 1fr 1fr 1fr; }
.area-list-sp li a { padding: var(--space-xs); display: block; background: rgba(255, 255, 255, 0.9); text-align: center; font-size: min(4vw, 16px); }
#entry { padding-block: var(--space-l); background: url("images/common/entry_bg01.jpg") center bottom / cover no-repeat; }
#entry h2 { margin-bottom: 55%; }
#entry .inner { padding-bottom: var(--space-l); padding-inline: var(--space-sm); background: rgba(232, 32, 48, 0.85); border-radius: 10px; }
#entry .inner .text img { margin-top: -53%; }
#entry .inner ul li a { padding: 15px 10px; display: block; border-radius: 20px; background: rgb(255, 255, 255); font-size: min(4.1vw, 20px); text-align: center; }
#entry .inner ul li:first-of-type a img { width: 20px; vertical-align: -2px; margin-right: var(--space-xs); }
#entry .inner ul li:last-of-type a img { width: 25px; margin-right: var(--space-xs); }
footer { padding-bottom: 50px; }
footer .footertop { padding-top: var(--space-l); padding-bottom: var(--space-sm); padding-inline: var(--space-sm); border-bottom: 1px solid rgb(204, 204, 204); }
footer .footertop .ttl img { width: 80px; }
footer .footertop ul { display: flex; justify-content: center; }
footer .footertop ul li a { padding-inline: 5px; text-decoration: underline; font-size: 90%; }
footer .footerbottom { padding: var(--space-xs); line-height: 1.5; font-size: 75%; }
#footerFloatingMenu { display: block; width: 100%; position: fixed; left: 0px; bottom: 0px; z-index: 4; text-align: center; }
#footerFloatingMenu ul { display: grid; grid-template-columns: repeat(3, 1fr); }
#footerFloatingMenu ul li { border-top: 1px solid rgb(255, 255, 255); height: 50px; line-height: 1; }
#footerFloatingMenu ul li:first-child { border-right: 1px solid rgb(255, 255, 255); background: rgb(241, 70, 70); }
#footerFloatingMenu ul li:nth-child(2) { border-right: 1px solid rgb(255, 255, 255); background: rgb(76, 198, 101); }
#footerFloatingMenu ul li:nth-child(3) { background: rgb(81, 156, 222); }
#footerFloatingMenu ul li a { position: relative; display: block; width: 100%; height: 100%; text-decoration: none; text-align: center; padding: 5px 0px; color: rgb(255, 255, 255); font-size: 11px; }
#footerFloatingMenu ul li:first-of-type img { width: 31px; }
#footerFloatingMenu ul li:nth-of-type(2) img { margin-top: 1px; width: 24px; }
#footerFloatingMenu ul li:nth-of-type(3) img { margin-top: 4px; width: 26px; }
#footerFloatingMenu ul li div { position: absolute; width: 100%; left: 0px; bottom: 5px; }
.modal { position: fixed; top: 0px; left: 0px; width: 100%; height: 100vh; z-index: 9; opacity: 0; visibility: hidden; transition: 0.3s; }
.modal.is-active { opacity: 1; visibility: visible; }
.modal__bg { position: absolute; inset: 0px; background: rgba(0, 0, 0, 0.8); }
.modal__content { left: 50%; padding: 10% 5%; position: absolute; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; overflow: auto; }
.modal__content .text { max-width: 440px; margin: 0px auto 30px; text-align: center; font-size: min(3.8vw, 18px); }
.modal__content ul { max-width: 380px; margin: 0px auto; }
.modal__content ul li a { position: relative; display: block; padding: 10px 22%; text-decoration: none; background: var(--color-key); color: rgb(255, 255, 255); margin-bottom: 15px; text-align: center; border-radius: 20px; font-size: min(3.8vw, 16px); }
.modal__content ul li a::before { content: " "; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); width: 10px; height: 15px; background: url("images/common/list02.png") center center / 100% no-repeat; }
.modal__content ul.f-tel a { background: url("images/common/c_tel.png") 10% center / 13px no-repeat rgb(241, 70, 70); }
.modal__content ul.f-line a { background: url("images/common/c_line.png") 10px center / 20px no-repeat rgb(76, 198, 101); }
.f-line, .f-tel { display: flex; flex-wrap: wrap; gap: 10px; }
.f-line li, .f-tel li { width: calc(50% - 10px); list-style: none; }
.f-line li a, .f-tel li a { display: block; padding: 10px; }
.close { margin-top: 20px; text-align: center; }
.close button { width: 100px; margin: 10px auto; display: block; text-align: center; text-decoration: none; background: rgb(255, 255, 255); padding: 5px 10px; color: rgb(26, 26, 26); border-radius: 5px; }
.sidebar { display: none; }
.main { width: min(100%, 560px); margin-inline: auto; background: rgb(255, 255, 255); min-height: 100vh; box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 30px; overflow: hidden; }
#subimage { padding-bottom: var(--space-sm); background: url("images/top/topimage_bg01.png") center center / cover repeat; }
#subimage .sub-top { position: relative; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; background: url("images/chatlady/subimage.png") center bottom / cover no-repeat; height: 55vh; }
#subimage .sub-top .ttl1 { display: inline-block; margin-bottom: var(--space-xs); padding: var(--space-xs); border: solid 1px var(--color-key); background: rgb(255, 255, 255); color: var(--color-key); font-family: var(--font); font-size: min(5vw, 30px); }
#subimage .sub-top .ttl2 { position: absolute; left: 0px; top: 58%; width: 100%; text-align: center; color: var(--color-key); font-family: var(--font); font-size: min(4.5vw, 22px); text-shadow: rgb(255, 255, 255) 1px 1px 0px, rgb(255, 255, 255) -1px 1px 0px, rgb(255, 255, 255) 1px -1px 0px, rgb(255, 255, 255) -1px -1px 0px, rgb(255, 255, 255) 1px 0px 0px, rgb(255, 255, 255) 0px 1px 0px, rgb(255, 255, 255) -1px 0px 0px, rgb(255, 255, 255) 0px -1px 0px; }
#subimage .sub-bottom { display: flex; justify-content: center; align-items: center; height: 16vh; padding: 0px 2%; font-size: clamp(12px, 4.2vw, 18px); }
#breadcrumb { position: relative; background: rgba(255, 255, 255, 0.6); z-index: 2; }
#breadcrumb ul { padding: 5px 5px 5px 12px; display: flex; flex-wrap: wrap; gap: 0px 4px; }
#breadcrumb ul li { font-size: 75%; }
#breadcrumb::after { content: " "; display: block; clear: both; }
.faq-list { padding: 15px; background: rgb(255, 234, 225); }
.faq-list > summary { display: flex; align-items: center; gap: 12px; position: relative; cursor: pointer; list-style: none; }
.faq-list > summary::-webkit-details-marker { display: none; }
.icon-q { width: 19px; height: 23px; background: url("images/common/q.png") center center / contain no-repeat; flex-shrink: 0; }
.toggle { margin-left: auto; font-size: 24px; line-height: 1; color: var(--color-key); }
.faq-list > .faq-answer { display: none; }
.faq-list[open] > .faq-answer { padding-top: 15px; margin-top: 15px; border-top: dotted 2px var(--color-key); display: flex; gap: 12px; font-size: 90%; }
.icon-a { width: 20px; height: 19px; background: url("images/common/a.png") center center / contain no-repeat; flex-shrink: 0; margin-top: 4px; }
.answer-text { flex: 1 1 0%; line-height: 1.8; }
.faq-list .toggle::before { content: "＋"; }
.faq-list[open] .toggle::before { content: "－"; }
.fadeUp { opacity: 0; transform: translateY(20px); transition: opacity 0.8s, transform 0.8s; }
.fadeUp.show { opacity: 1; transform: translateY(0px); }
.delay1 { transition-delay: 0.2s; }
.delay2 { transition-delay: 0.4s; }
@keyframes infinity-scroll-left {0% { transform: translateX(0px); }
100% { transform: translateX(-100%); }}
@media (min-width: 500px) {body { font-size: 18px; }
#footerFloatingMenu { max-width: 560px; left: 50%; transform: translateX(-50%); }
#subimage .sub-bottom { width: 450px; margin-inline: auto; }}
@media screen and (min-width: 1000px) {.header { background: none; }
.hamburger, .nav { display: none; }
.header { z-index: 20; width: 420px; inset: 0px 0px auto; padding: 40px 20px; }
.logo { display: inline-block; height: auto; padding-top: 0px; }
.header-site-title { top: 12px; left: 20px; transform: none; font-size: 12px; text-align: left; z-index: 1001; }
.header-site-title a { position: relative; z-index: 1002; pointer-events: auto; }
#footerFloatingMenu { display: none; }
.sidebar { display: block; position: fixed; top: 0px; left: 0px; width: 420px; height: 100vh; padding: 140px 60px 140px 30px; z-index: 5; }
.pc-nav { display: flex; }
.pc-nav-list { margin-right: 70px; }
.pc-nav-list li { position: relative; }
.pc-nav-list li + li { margin-top: 24px; }
.pc-nav-list a { transition: var(--transition); }
.pc-nav-list li a.current { color: var(--color-key); }
.pc-nav-list a:hover { color: var(--color-key); }
.pc-nav-list li a::after { position: absolute; left: -20px; content: "●"; opacity: 0; transition: 0.5s; color: var(--color-key); }
.pc-nav-list li a.current::before { position: absolute; left: -20px; content: "●"; color: var(--color-key); }
.pc-nav-list li a:hover::after { opacity: 1; }
.area-list li { position: relative; margin-bottom: 15px; font-size: 90%; }
.area-list li a { transition: var(--transition); }
.area-list li a:hover { color: var(--color-key); }
.contact-nav { display: flex; justify-content: space-between; }
.contact-nav li { width: 48%; }
.contact-nav li a { display: block; padding: 15px 10px; border: solid 1px var(--color-key); background: rgb(255, 255, 255); color: var(--color-key); border-radius: 30px; text-align: center; transition: var(--transition); }
.contact-nav li:first-of-type a img { width: 25px; vertical-align: -5px; margin-right: var(--space-xs); }
.contact-nav li:last-of-type a img { width: 22px; vertical-align: -1px; margin-right: var(--space-xs); }
.contact-nav li a:hover { background: rgb(254, 243, 240); }
.circle-text { display: block; position: fixed; bottom: -30vw; right: -10vw; width: 80vw; aspect-ratio: 1 / 1; pointer-events: none; z-index: -1; animation: 80s linear 0s infinite normal none running rotate-circle; }
.circle-text svg { width: 100%; height: 100%; overflow: visible; }
.circle-text text { fill: rgba(255, 255, 255, 0.4); font-size: clamp(8px, 0.5vw, 14px); letter-spacing: 0.12em; text-transform: uppercase; }
@keyframes rotate-circle {0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }}
.main { margin-inline: auto 0px; }
#subimage .sub-top { height: 560px; }
#subimage .sub-bottom { height: 160px; }}
@media screen and (min-width: 1120px) {.main { margin-left: 50%; }
.sidebar, .header { left: inherit; right: 60%; }}
html { scroll-behavior: smooth; }
.page-top { position: fixed; right: 14px; bottom: 64px; z-index: 8; display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: solid 1px var(--color-key); border-radius: 50%; background: rgba(255, 255, 255, 0.9); color: var(--color-key); font-size: 18px; line-height: 1; text-decoration: none; box-shadow: rgba(0, 0, 0, 0.12) 0px 4px 12px; }
.page-top:hover { background: rgb(254, 243, 240); }
@media screen and (min-width: 1000px) {.page-top { right: 24px; bottom: 24px; }}
.circle-text, .circle-text * { user-select: none; pointer-events: none; }
.page-top { user-select: none; -webkit-tap-highlight-color: transparent; }
.page-top:focus { outline: none; }
#reward #subimage .sub-top { background: url("css/../images/reward/subimage.png") center bottom / cover no-repeat; }
#reward01 .reward-workstyle-heading { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; aspect-ratio: 690 / 320; padding: 0px 12px; background: image-set(url("css/../images/reward/reward_ttl1.png.webp") 1x type("image/webp"), url("css/../images/reward/reward_ttl1.png") 1x type("image/png")) center center / contain no-repeat; }
#reward01 .reward-workstyle-heading__line { display: block; width: max-content; max-width: 100%; box-sizing: border-box; padding: 8px 16px; border: solid 1px var(--color-key); background: rgba(255, 255, 255, 0.94); color: var(--color-key); font-family: "Kiwi Maru", serif; font-size: 18px; font-weight: 400; line-height: 1.4; letter-spacing: 0px; text-align: center; white-space: nowrap; }
@media (min-width: 500px) {#reward01 .reward-workstyle-heading { gap: 12px; padding: 0px 20px; }
#reward01 .reward-workstyle-heading__line { padding: 9px 20px; font-size: 24px; }}
#reward .case { padding: var(--space-sm); background: rgb(254, 247, 247); }
#reward .case .casettl { margin-bottom: var(--space-sm); padding: 5px; background: var(--color-key); color: rgb(255, 255, 255); border-radius: 20px; text-align: center; }
#reward02 { padding-bottom: var(--space-2xl); }
#reward02 h2 { padding-inline: 20%; }
#reward02 h2 img { margin-top: -25px; }
.modelcase .inner { padding-bottom: var(--space-l); border-bottom: 1px solid rgb(255, 255, 255); }
.modelcase .ttl1 .name { padding-block: var(--space-xs); padding-inline: var(--space-sm); display: inline-block; background: var(--color-key); color: rgb(255, 255, 255); border-radius: 20px; }
.modelcase .box { padding-block: var(--space-sm); padding-left: 25%; position: relative; background: rgba(255, 255, 255, 0.8); border-radius: 40px 40px 0px 0px; }
.modelcase .box .girl { position: absolute; left: 3%; top: -5%; height: 182px; width: auto; }
.modelcase .box .profile { width: 45px; }
.modelcase .box ol li { list-style-type: disc; margin-left: 1em; }
.modelcase .box ol li dl { display: flex; }
.modelcase .box ol li dl dt { width: 40%; }
.modelcase .box ol li dl dd { width: 60%; line-height: 1.2; }
.case-dl1 { display: flex; justify-content: space-between; }
.case-dl1 dt { width: 18%; }
.case-dl1 dd { width: 78%; }
#reward05 { padding-top: 25%; background: url("css/../images/reward/q&a_bg.jpg") center top / 100% no-repeat; }
#reward05 h2 { margin-inline: 5%; padding-block: var(--space-xl); background: rgb(220, 54, 68); color: rgb(255, 255, 255); text-align: center; font-family: var(--font); font-size: min(5.5vw, 28px); border-radius: 30px; box-shadow: rgba(103, 92, 93, 0.8) 0px 0px 8px; }
#reward05 h3 { margin-inline: 5%; }
@media (min-width: 500px) {.modelcase .box ol li dl dd span { display: block; }}