/* ==============
monitor
============== */

.monitor-no-target .monitor-target-only,
.monitor-no-registered .monitor-registered-only {
    display: none;
}

.monitor-target .monitor-no-target-only,
.monitor-registered .monitor-no-registered-only {
    display: none;
}

/* ==============
main
============== */

.monitor-entry-register {
    width: 100%;
    text-align: center;
    margin: 20px 0 0;
}

.monitor-notice, .monitor-entry {
    background: #2edb0f;
    color: #fff;
    border-radius: 10px;
    border: none;
    width: 100%;
    padding: 8px;
}

.monitor-top-button {
    display: block;
    width: 100%;
    margin: 10px auto;
    text-align: center;
}

.monitor-top-button button {
    cursor: pointer;
}

/* ==============
monitor-notice
============== */

.monitor-notice_title_wrap {
    position: relative;
    display: inline-block;
    background-color: #fff;
    border-bottom: solid 1px #305c28;
    padding: 13px;
    min-width: 240px;
    max-width: 100%;
    text-align: center;
    margin-bottom: 10px;
}

.monitor-notice_title_wrap::before,
.monitor-notice_title_wrap:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.monitor-notice_title_wrap::before {
    border: solid 10px transparent;
    border-top: solid 10px #305c28;
}
.monitor-notice_title_wrap:after {
    border: solid 12px transparent;
    border-top: solid 12px #fff;
    margin-top: -3px;
}
.monitor-notice_title_wrap .monitor-notice_title {
    color: #305c28;
    margin: 0;
    padding: 0;
    font-weight: bold;
    font-size: 1.05rem;
}

.monitor-notice_text {
    background: #e4f5e0;
    padding: 20px !important;
    border-radius: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.group-member-ranking-popup-content .monitor-notice_text {
    margin-top: 180px;
}

.monitor-notice_images_wrap {
    width: 50px;
    margin: 0 auto 10px;
}

.monitor-notice_images {
    width: 100%;
}

button.small.monitor-entry_button {
    padding: 10px 32px;
    font-size: 0.77rem;
  	height: 50px;
  	border-radius: 12px;
  	width: 100%;
	max-width: 350px;
}

button.monitor-close_button {
    padding: 10px 32px;
  	height: 50px;
  	border-radius: 12px;
	display: block;
	width: 100%;
	max-width: 350px;
	border: 1px solid #25AC0D;
	color: #228D0F;
  	margin: 0 auto;
}

button.monitor-register {
    padding: 10px 32px;
    font-size: 0.77rem;
  	height: 50px;
  	border-radius: 12px;
  	width: 100%;
	max-width: 350px;
}

/*.monitor-entry_button:after {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	background: linear-gradient(#22cf3d 0 0), linear-gradient(#22cf3d 0 0), #ffffff;
	background-position: 6px 6px;
	background-size: 30% 1px,1px 30%;
	background-repeat: no-repeat;
	border-radius: 50%;
	margin-top: -2px;
	margin-left: 8px;
	transform: rotate(135deg);
}*/

/* ==============
monitor-entry
============== */

.monitor-entry_background {
    overflow: scroll;
}

.monitor-notice_text_span {
    color: #ff0000;
    font-weight: bold;
}

#monitor-profile-record p {
    width: 130px;
}

/* ==============
monitor-complete
============== */

.monitor-complete_title {
    color: #305c28;
    font-weight: bold;
    font-size: 1.05rem;
}


/* ==============
monitor-interview
============== */

.monitor-interview-ques {
    padding: 0 8px;
}

.monitor-interview-sel label {
    width: 100px;
}

.monitor-interview-sel .sequential-radio-label {
    margin-top: 8px;
    text-align: center;
    line-height: 120%;
}

#monitor-interview-record hr:last-of-type {
    display: none;
}

/* ==============
walk
============== */

.guidance-button_image_wrap, .guidance-button_image_bodaishin_wrap {
    overflow: hidden;
    text-align: center;
}

.guidance-button_image_wrap img {
    width: 40px;
}

.guidance-button_image_bodaishin_wrap img {
    width: 60px;
}

button.warm.gradient.starting-button {
    font-size: 1.6rem;
    background: linear-gradient(to right, #05C522, #A5E647);
}

/* ==============
group
============== */

#group .group-chat-icon {
    z-index: 30;
    position: fixed;
    top: 46px;
    right: 16px;
}

#group .group-chat-icon img {
    width: 72px;
    height: 72px;
}

.group_gogowalk_wrapper {
    background: #fff;
    padding: 5px;
    border-radius: 20px;
    color: #000;
}

.group_gogowalk_title {
    background-color: transparent;
    border: none;
    color: #000;
    margin: 0 auto;
}

.group-current {
    margin-left: 0;
    margin-right: auto;
}

.group-background {
	background: #fff;
	border-radius: 24px;
	padding: 15px;
}

.group-background.ranking {
	background: #fff;
	border-radius: 0;
	padding: 0;
  	border-radius: 24px 24px 0 0;
}

#group-ranking .group-background.ranking {
  	border-radius: 24px;
  	width: 90%;
}

.group-select-wrapper.select-wrapper.cool {
    margin-top: 20px;
}

.group-select-wrapper > .group-unread {
    position: absolute;
    top: -12px;
    right: -10px;    
}

.group-step-row_switch-wrapper {
    display: block;
    background: #fff;
    width: 100%;
    border-radius: 8px;
}

.group-step-row_switch-title {
    font-size: 0.9rem;
    margin-bottom: -5px;
}

.group-step-row_switch-title_tiny {
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #C0C7C0;
}

.switch-wrapper_content {
    padding: 20px;
}

.group-step_all_small {
    display: none;
}

#group .found {
    padding-left: 16px;
    padding-right: 16px;
  	padding-top: clamp(210px, 3.253px + 53.012vw, 650px);
}

#group .found.ranking {
    padding-left: 16px;
    padding-right: 16px;
  	padding-top: 0;
}

#group .group-personal-setting-area {
	padding: 0;
  	/* width: 60px; */
	width: 16%;
}

#group span.group-personal-setting-area {
	width: 9%;
}

#group .group-member-wrapper.pulldown-button_soklin-league.group-member-wrapper {
  	margin-bottom: 30px;
}

#group-ranking-top-content {
	margin-top: 100px !important;
}

#group .group-member-wrapper {
    max-width: 360px;
    width: 100%;
  	margin: 0 16px;
    position: relative;
    margin-bottom: 16px !important;
}
@media screen and (min-width: 520px){
  #group .group-member-wrapper {
  	margin: 0 auto;
}
}

#group .group-member-wrapper.group-member-wrapper.group-top_soklin-league {
    width: 100%;
  	margin: 0 auto;
  	border-radius: 24px 24px 24px 24px;
}

/* ==============
health
============== */

.fast-calendar-date {
    background: #fff;
    border-radius: 20px;
    text-align: center;
    width: 70%;
    margin: 10px auto 0;
    padding: 2px;
}
 
.fast-calendar-date .month-num {
    font-weight: bold;
    font-size: 1.8rem;
    font-family: "din-2014", "sans-serif";
}

#fast-calendar-wapper table {
    width: 90%;
    background: #fff;
    border: solid 1.5px #007100;
}

#fast-calendar-wapper table th {
    border: solid 1px #E6FEC2;
    background: #007100;
    font-size: 0.7rem;
    font-weight: 500;
    color: #fff;
}

#fast-calendar-wapper table tr:has(th) {
    border: solid 1px #007100;
}

#fast-calendar-wapper table td {
    border: solid 1px #007100;
    font-family: "din-2014", sans-serif;
    font-style: normal;
    font-size: 0.8rem;
    font-weight: 500;
    padding: 0;
}

#fast-calendar-wapper table td div.calendar-cell {
    height: 40px;
}

#fast-calendar-wapper table td.is-disabled div:first-child {
    color: #fff;
}

#fast-calendar-wapper table td.is-disabled div:nth-child(2) {
    height: 40px;
}

#fast-calendar-wapper table td .day0,#fast-calendar-wapper table td .day1,#fast-calendar-wapper table td .day2,#fast-calendar-wapper table td .day3,#fast-calendar-wapper table td .day4,#fast-calendar-wapper table td .day5,#fast-calendar-wapper table td .day6 {
    padding-left: 5px;
}

#fast-calendar-wapper table td .day0 {
    color: #e63426;
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-1) {
    background: #DBFEAC;
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-1) div.calendar-cell {
    background: url(../img/kenko_star/kenko_star01.png) no-repeat center bottom;
    background-size: contain;
    color: #fff;
    font-weight: bold;
    font-size: 1rem;
    text-align: center;
    padding-top: 13px;
}
@media screen and (min-width: 380px){
    #fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-1) div.calendar-cell {
        font-size: 1.5rem;
        text-align: center;
        padding-top: 5px;
    }
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-2) {
    background: #CFEBCB;
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-2) div.calendar-cell {
    background: url(../img/kenko_star/kenko_star02.png) no-repeat center bottom;
    background-size: contain;
    color: #fff;
    font-weight: bold;
    font-size: 1rem;
    text-align: center;
    padding-top: 13px;
}
@media screen and (min-width: 380px){
    #fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-2) div.calendar-cell {
        font-size: 1.5rem;
        text-align: center;
        padding-top: 5px;
    }
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-3) {
    background: #FFFFBF;
}

#fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-3) div.calendar-cell {
    background: url(../img/kenko_star/kenko_star03.png) no-repeat center bottom;
    background-size: contain;
    color: #fff;
    font-weight: bold;
    font-size: 1rem;
    text-align: center;
    padding-top: 13px;
}
@media screen and (min-width: 380px){
    #fast-calendar-wapper table td div.calendar-cell-wrapper:has(div.fast-3) div.calendar-cell {
        font-size: 1.5rem;
        text-align: center;
        padding-top: 5px;
    }
}

.health-top_wrap_fast-calendar {
    padding-bottom: 20px;
    margin-bottom: 32px;
}

.health-top_title_span {
    background: #fff;
    color: #007100;
    padding: 3px 8px 3px 5px;
    border-radius: 20px;
    font-size: 0.7rem;
    margin-left: 5px;
    max-width: 110px;
    position: static;
    display: block;
    width: 100%;
    max-width: 190px;
}

.health-top_title_span::before {
    content: "？";
    display: inline-block;
    width: 14px;
    height: 10px;
    line-height: 15px;
    background: #22cf3d;
    color: #fff;
    border-radius: 50px;
    text-align: center;
    vertical-align: middle;
    font-size: 0.5rem;
    margin-right: 2px;
    margin-bottom: 3px;
    padding-bottom: 5px;
}

/* ==============
birth-self
============== */

.filled_birth {
	border-radius: 16px;
	max-width: 640px;
	width: 100%;
}

.filled_birth.box {
	width: fit-content;
	max-width: 480px;
}

.filled_birth.fixed {
	width: fit-content;
	max-width: 480px;
	width: 100%;
}

.vertical.scrollable_birth {
	height: 100%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	position: relative;
}
@supports (-webkit-touch-callout: none) {
	.vertical.scrollable_birth {
		overflow-y: scroll;
		overflow-x: hidden;
	}
}

.birth-self_info-box {
    border-radius: 16px;
	max-width: 640px;
	width: 100%;
}

.birth-self_background {
    overflow: hidden;
    position: relative;
	background-image: url(../img/background_birth-self.jpg);
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
	width: 100%;
	top: 0;
    left: 0;
}

.birth-self_image_wrapper {
    padding-top: 20px;
}

.birth-self_image {
    width: 100%;
}

.birth-box-name_wrapper {
    color: #fff;
    font-weight: bold;
}

.filled_birth.birth-box-birth_message {
    color: #FF463C;
    background: #fff;
    font-weight: bold;
    padding: 10px;
    margin-bottom: 16px;
}

.birth-box_message {
    color: #fff;
    font-weight: bold;
}

.birth-popup-close_wrapper {
    background: #fff;
    padding: 16px;
    border-radius: 0 0 16px 16px;
}

/* ==============
birth-other
============== */

.birth-other_background {
    overflow: hidden;
    position: relative;
	background: #fff;
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
	width: 100%;
	top: 0;
    left: 0;
}

.congrats-achieved {
    padding: 16px;
}

.birth-other-popup-close_wrapper {
    padding: 0 0 16px 0;
}

button.cool.birth-chat-button {
    background: url(../img/birth-chat-button.jpg);
    background-size: cover;
    border: 2px solid #fff;
}

/* ==============
meter
============== */

span.home-edit-walk-row_cell_span {
    display: block;
    text-align: center;
}

tbody#home-edit-walk-table tr.entry td label input[type="time"] {
    padding: 5px;
}

tbody#home-edit-walk-table tr.entry td input[type="time"] {
    padding: 5px;
}

tbody#home-edit-walk-table tr.entry td input.step-input.small {
    padding: 2px;
}

.home-edit-walk-delete.icon-button.custom {
    padding: 0px 6px 10px 3px !important;
  	margin-top: 5px;
}

.date-list-col.date-list-col_totalsteps {
    text-align: right;
}

.date-list-col {
    text-align: right;
}

/* ==============
giant
============== */

.giant-size_images {
    font-family: "din-2014", "sans-serif";
}

.giant-size_images_giant span.text.bold.light {
    font-size: 1rem;
}

.giant-size_images_giant span.text.huge.bold.cool.light {
    font-size: 1.5rem;
}

.giant-size_images_general span.text.bold.cool.light {
    font-size: 1rem;
}

.giant-size_images_general span.text.huge.bold.light {
    font-size: 1.5rem;
}

/* ==============
health-disp
============== */

.health-button_wrapper {
    margin: 24px auto;
    width: 97%;
    display: flex;
    justify-content: space-between;
}

button.health-button_next.horizontal.middle.round {
    background: #fff;
  	color: #25AC0D;
 	border: 1.5px solid #25AC0D;
    font-weight: bold;
    padding: 6px 40px 6px 20px !important;
    cursor: pointer;
    outline: none;
    width: 100%;
    max-width: 100%;
    position: relative;
    text-align: center;
    margin-left: 10px;
    filter: drop-shadow(1px 1px 5px rgb(0,0,0,0.3));
}

button.health-button_next.horizontal.middle.round::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 25px;
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid #25AC0D;
	border-left: 0;
	border-bottom: 0;
	box-sizing: border-box;
	transform: rotate(45deg);
}

button.health-button_back.horizontal.middle.round {
    background: #fff;
  	color: #25AC0D;
  	border: 1.5px solid #25AC0D;
    font-weight: bold;
    padding: 6px 20px 6px 40px !important;
    cursor: pointer;
    outline: none;
    width: 100%;
    max-width: 100%;
    position: relative;
    text-align: center;
    margin-right: 10px;
    filter: drop-shadow(1px 1px 5px rgb(0,0,0,0.3));
}

button.health-button_back.horizontal.middle.round::after {
    content: "";
    position: absolute;
    top: 12px;
    left: 25px;
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid #25AC0D;
	border-left: 0;
	border-bottom: 0;
	box-sizing: border-box;
	transform: rotate(-135deg);
}

.health-detail.center.vertical.double-gap > * + * {
    margin-top: 0;
}

/* ==============
monitor
============== */

#monitor-entry-notice .monitor-exclamation {
    position: absolute;
    top: 100px;
    transform: rotate(20deg) scale(350%, 300%);
}

/* ==============
fast
============== */

.fast-help-opener {
    cursor: pointer;
}

.words-disp img {
    width: 100%;
}

#home .float-icon.bottom-icon {
    cursor: pointer;
    z-index: 6 !important;
    top: 300px;
}

.float-icon.bottom-icon a {
    position: relative;
}

#home .float-icon.fast-walk span.bold {
    line-height: 0.8rem;
    text-align: right;
    margin-right: 7px;
}

.lang-ja.general-mode #home .float-icon.fast-walk span.bold {
    margin-right: 4px;
}

.general-mode .home-step-wrapper .step-step {
    margin: 0;
}
.general-mode .gauge-ratio .num {
    margin: 0;
}

.general-mode .home-step-wrapper .unit {
    margin-left: 4px;
    margin-bottom: 8px;
}

.general-mode #date-list-body .step-date * {
    font-size: 1rem;
}

/* ==============
group
============== */

#group .group-birth-mark {
    width: 42px;
    height: 42px;
    position: absolute;
    transform: translate(-25px,-25px);
    background-image: url(../img/birthday_mark.png);
    background-size: cover;
    font-size: 1.4rem;
  	font-weight: bold;
    color: #ffffff;
    background-repeat: no-repeat;
    padding-bottom: 4px;
}

.group-card {
    width: 62px;
}

.giant-mode .login-giant-switch[data-target="giant"], 
.general-mode .login-giant-switch[data-target="normal"] {
    background-color: #E5F9E5;
    border: #22ce3c solid 2px;
    color: #1c5e20;
}

.group-japan-wrapper {
    position: relative;
}

.group-place {
    position: relative;
    background-color: #ff7300;
    padding-bottom: 16px;
    border-radius: 0 0 16px 16px;
    max-width: 350px;
}

.group-place .current-station {
    color: #ffffff;
    font-size: 2.0rem;
    line-height: 125%;
}

.group-place .current-loc {
    color: #ffffff;
    font-size: 1.0rem;
    line-height: 125%;
}

.group-place-arrow-wrapper {
    position: relative;
}

.group-place .group-place-arrow::after {
    content: "";
    position: absolute;
    right: -1.19rem;
    border-left: 0.6rem solid;
    border-top: 0.6rem solid transparent;
    border-right: 0.6rem solid transparent;
    border-bottom: 0.6rem solid transparent;
    color: #ffffff;
}

.group-place .group-place-arrow-locator {
    position: absolute;
    background-color: #ff7300;
    padding: 8px 0;
    width: auto;
    left: 16px;
    right: 16px;
    border-radius: 16px;
    top: -16px;
}

.group-place .group-place-arrow {
    position: relative;
    width: 90%;
    height: 1.2rem;
    background: #ffffff;
    margin-right: 0.5rem;
    border-radius: 4px 0 0 4px;
    padding: 0 8px;
}

.group-map-wrapper {
    margin-top: -45px;
}

.group-bonus-box div {
    padding-left: 16px;
}

.group-bonus-box hr {
    margin-bottom: 0;
}

.group_bonus {
    position: relative;
}

.group-bldg {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 160px;
}

.group-pops {
    position: absolute;
    width: 100%;
    height: 100%;
}

.group-pops div:nth-child(1) {
    position: absolute;
    left: -10px;
    bottom: 45%;
}

.group-pops div:nth-child(2) {
    position: absolute;
    bottom: 60%;
    left: 85px;
}

.group-pops div:nth-child(3) {
    position: absolute;
    bottom: 30%;
    right: -30px;
}

.group-pops div {
    width: 120px;
}

.group-pops div img {
    width: 85px;
}

.general-mode #group .group-birth-mark {
    font-size: 0.8rem;
}

.group-unread, .notice-unread {
    color: #ffffff;
    background-color: #ff0000;
    padding: 0px 8px;
    border-radius: 16px;
    margin-right: 0.25rem;
    font-weight: normal;
    font-size: 0.8rem;
    font-family: 'Noto Sans JP', sans-serif;
	position: absolute;
    top: -4px;
    right: -10px;
}

#home .float-icon .group-unread {
    padding: 6px 8px;
}

/* ==============
music
============== */

#home .float-icon.music-button {
    z-index: 6;
    line-height: 1rem;
}

/* ==============
dance
============== */

#dance {
    height: 100%;
    background: #F2F2F2;
    overflow-y: hidden;
}

#dance .dance-title {
    background: #DEFEDD;
    height: 101px;
    font-size: 1.4rem;
	font-weight: bold;
    color: #0A3F03;
    /* padding-bottom: 32px; */
}

#dance .dance-icon {
    width: 24px;
    height: 24px;
}

#dance .dance-main-wrapper {
    margin-top: 140px;
}

#dance .dance-main {
	padding-left: 16px;
    padding-right: 16px;
    max-width: 640px;
}

#dance .dance-video-wrapper {
    width: 100%;
}

#dance .dance-main button, #dance #dance2 button {
    padding: 12px;
}

#dance #dance1 .dance-video-wrapper video,
#dance #dance1 .dance-video-wrapper img {
    width: 100%;
    border-radius: 16px;
}

#dance #dance1 .video-js {
    border-radius: 16px;
}

#dance .vjs-progress-control,
#dance .vjs-remaining-time,
#dance .vjs-picture-in-picture-control {
    display: none;
}

#dance .vjs-big-play-button {
    width: 2.5em;
    height: 2.5em;
    border-radius: 100px;
    transform: translate(0, -20%);
    border-width: 0;
    line-height: 2.5em;
    background: rgba(0, 0, 0, 0.4);
}

#dance  .vjs-big-play-button .vjs-icon-placeholder {
    font-size: 1.5em;
}

#dance .vjs-button > .vjs-icon-placeholder:before {
    font-size: 3em;
}

#dance .vjs-control-bar {
    display: flex;
    width: 100%;
    justify-content: space-evenly;
    height: 48px;
    opacity: 0;
}

#dance #dance1 .vjs-control-bar {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

#dance .page-title .settings-close {
  padding-bottom: 0px;
  padding-left: 16px;
  padding-top: 8px;
  white-space: nowrap;
}

#dance .health-page .page-title img {
  width: 32px;
}

#dance #dance2 {
    background-color: #000000;
}

#dance #dance2 .dance-main,
#dance #dance2 .scrollable {
    padding: 0;
}

/* ==============
reward
============== */

#reward .reward-box {
	max-width: 400px;
    width: 100%;
    position: relative;
    margin: 0 auto;
    border-radius: 24px;
}

#reward .reward-title {
    position: absolute;
    text-align: center;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    font-size: 18px;
}

#reward .reward-video {
    width: 100%;
    height: auto;
    border-radius: 24px;
}

#reward .reward-wrapper {
    position: absolute;
    top: 40%;
    left: 50%;
    padding: 0 8px;
    transform: translate(-50%, -50%);
}

#reward .reward-wrapper .num {
    font-size: 7.5em;
    font-weight: bold;
    font-family: "din-2014", "sans-serif";
    filter: drop-shadow(5px 5px 3px rgba(134,134,134,.8));
    margin-right: -2px;
    font-style: italic;
}

#reward.breath .reward-wrapper .num {
    color: #00106B;
}

#reward .reward-wrapper .unit {
    font-size: 4em;
    font-weight: bold;
    margin-left: -2px;
    font-style: italic;
    margin-top: 40px;
}

#reward.breath .reward-wrapper .unit {
	color: #00106B;
}

#reward.walk .reward-wrapper {
    color: #5A2400;
}

#reward.fast .reward-wrapper {
    color: #0A3F03;
}

#reward.toes .reward-wrapper {
    color: #504300;
}

#reward .reward-button {
    width: 90%;
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
}

#reward.walk .fast-only,
#reward.walk .toes-only,
#reward.walk .breath-only,
#reward.fast .walk-only,
#reward.fast .toes-only,
#reward.fast .breath-only,
#reward.toes .walk-only,
#reward.toes .fast-only,
#reward.toes .breath-only,
#reward.breath .walk-only,
#reward.breath .fast-only,
#reward.breath .toes-only {
  display: none;
}

/* ==============
group 4th
============== */

#main {
    overflow-y: hidden;
}

#group.profile-mode .found {
    padding-top: 24px;
}

#group.profile-mode, #group.profile-mode .group-background {
    background-color: #F2F2F2 !important;
}

#group.group-mode .profile-mode-only,
#group.profile-mode .group-mode-only {
    display: none;
}

#group.profile-mode .group-member-wrapper {
    margin: 0 auto;
}

#group .group-profile-detail {
    width: 100%;
}

#group.profile-mode .group-detail-only.show-profile {
    display: flex;
}

#group.profile-mode .member-icon.large {
    width: 110px;
    height: 110px;
}

#group .profile-button,#group .card-button {
	background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 8px 0;
    appearance: none;
    width: 100%;
    min-width: fit-content;
    color: inherit;
    font-weight: inherit;
    max-width: 100%;
	border: 1px solid #228D0F;
    color: #0A3F03;
    background: #DEFEDD;
    position: relative;
    width: 100%;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
}

#group .name-change-button {
	background-color: transparent;
    border: none;
    cursor: pointer;
    outline: none;
    padding: 4px 0;
    appearance: none;
    width: 100%;
    min-width: fit-content;
    color: inherit;
    font-weight: inherit;
    max-width: 100%;
	border: 2px solid #25AC0D;
    color: #0A3F03;
    background: #fff;
    position: relative;
    width: 100%;
    border-radius: 8px;
    text-align: center;
    font-weight: bold;
}

#group.profile-mode .group-personal-setting {
    padding-bottom: 0px;
    padding-left: 16px;
    padding-top: 8px;
}

.words_bodaisin_wrapper.vertical.bottombar.filled.box.white {
    width: 90%;
}

button#words-ok {
    background: #22CF3C;
    color: #021D01;
    padding: 12px;
    max-width: 350px;
    font-weight: bold; 
}

button.words-cancel {
    border: 1px solid #25AC0D;
    color: #228D0F;
    padding: 12px;
    max-width: 350px;
}

#home .mindset-logs {
    margin-right: 4px;
}

#home .mindset-logs img {
    width: 62px;
}

/*.ver-5-1-2 #home .home-step-wrapper .step-step {
    color: #0000cc;
}*/

/* ==============
group 4th sokulympic
============== */

.pulldown-button_soklin-league select {
    letter-spacing: normal;
    word-spacing: normal;
    line-height: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: center;
    align-items: flex-start;
    cursor: default;
    box-sizing: border-box;
}

.group-member-wrapper.group-top_soklin-league {
  	background: #fff;
  	font-weight: bold;
  	padding-left: 0;
  	padding-right: 0;
    margin-top: 20px;
    border-radius: 24px 24px 0 0;
}

.group-top-title_soklin-league {
    background: linear-gradient(70.09deg, #22CF3C 29.61%, #16FF39 78.62%, #A7FC73 93.15%);
    color: #000;
    text-align: center;
  	padding: 10px 0;
  	position: relative;
    font-weight: bold;
    border-radius: 24px 24px 0 0;
}

/* 2024 soklinpic
.group-top-title_soklin-league::before {
    content: "";
    background: url(../img/soklin-league/group/KUN_nikoniko_NEW_v01.png?1) no-repeat;
    background-size: contain;
  	width: 95px;
 	height: 95px;
    text-align: center;
    display: block;
  	position: absolute;
  	top: -30px;
  	left: -25px;
}

.group-top-title_soklin-league::after {
    content: "";
    background: url(../img/soklin-league/group/jii_nikoniko_talking_01.png) no-repeat;
    background-size: contain;
    width: 100px;
 	height: 100px;
    text-align: center;
    display: block;
    position: absolute;
   	bottom: -40px;
  	right: -20px;
}
*/
.soklin-league-color_a {
	background: linear-gradient(45deg, #ECC440, #FFFA8A, #DDAC17);
    /* 背景を文字の形にクリップ */
    -webkit-background-clip: text;
    background-clip: text;
    
    /* 文字色を透明にする */
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.soklin-league-color_a_bg {
    background: linear-gradient(45deg, #C99700, #FFDB66, #C99700, #FFDB66, #CE9B00);
}

.soklin-league-color_b {
    color: #E50000;
}

.soklin-league-color_b_bg {
    background: #E50000;
}

.soklin-league-color_c {
    color: #FF5C5C;
}

.soklin-league-color_c_bg {
    background: #FF5C5C;
}

.soklin-league-color_d {
    color: #00A8CD;
}

.soklin-league-color_d_bg {
    background: #00A8CD;
}

.soklin-league-color_e {
    color: #0D39D4;
}

.soklin-league-color_e_bg {
    background: #0D39D4;
}

#soklin-league {
	font-size: 1.3rem;
  	font-family: "din-2014", "sans-serif";
}

.soklin-league-unit {
	font-size: 1.3rem;
  	margin-left: 5px;
}

#soklin-base {
	font-size: 0.8rem;
}

#soklin-base-unit {
	font-size: 0.8rem;
}

#soklin-name {
	text-align: left;
}

.soklin-league-yourleague {
	color: #7F7F7F;
  	font-weight: 700;
  	font-size: 0.9rem;
}

.soklin-league_num {
    font-family: din-2014, sans-serif;
  	font-size: 2rem;
}

.soklin-league_text {
    color: #00A8CD;
    font-family: din-2014, sans-serif;
  	font-size: 1.5rem;
}

.group-top-wrapper {
    padding-top: 72px;
}

#group-ranking-button {
  background: linear-gradient(45deg, #ECC440, #FFFA8A, #DDAC17);
  font-weight: bold;
  text-align: center;
  width: 100%;
  max-width: 360px;
  border: none;
  border-radius: 8px;
  color: #021D01;
}

.group-top-text {
	padding: 20px;
  	text-align: center;
}

#group .sokuikkun_level_title_jp {
   font-size: 0.8rem;
   color: #4D4D4D;
   font-weight: bold;
   text-align: center;
}

#group .sokuikkun_level_title_en {
   font-size: 0.9rem;
   color: #4D4D4D;
   font-family: "din-2014", "sans-serif";
   font-weight: 700;
   text-align: center;
   margin-top: 0;
}

#group .sokuikkun_level_title_number {
   font-size: 3rem;
   color: #4D4D4D;
   font-family: "din-2014", "sans-serif";
}


#group .point-goal-wrapper {
	position: relative;
}

#group .point-goal-explanation {
  	font-size: 0.8rem;
  	text-align: right;
  	color: #949494;
}

#group #week-points-button {
  	margin-top: 10px;
  	font-family: 'Noto Sans JP', sans-serif;
}

#group .point_field{
  background-color: #F2F2F2;
  color: #949494;
  border-radius: 50%;
  position: absolute;
  width: 38px;
  height: 38px;
  text-align:center;
  line-height:38px;
  font-size: 14px;
  font-family: "din-2014", "sans-serif";
  font-weight: 600;
  top: 50%;
  transform: translateY(-50%);
  mix-blend-mode: multiply;
  -webkit-mix-blend-mode: multiply;
  -moz-mix-blend-mode: multiply;
  -ms-mix-blend-mode: multiply;
}

#group .individual-point-view{
  	overflow: hidden;
  	display: flex;
  	justify-content:center;
    align-items: center;
}

#group .individual-point-view div:has(img) {
  	width: 40px;
  	margin-right: 5px;
}

#group .individual-point-view img {
  	width: 80%;
}

#group .individual-point-view-title.gogo {
  	color: #8E3D00;
    line-height: 35px;
    font-size: 0.9rem;
  	font-weight: bold;
}

#group .individual-point-view-title_point.gogo {
  	color: #8E3D00;
    line-height: 35px;
    font-size: 0.7rem;
  	font-weight: bold;
  	margin-left: 5px;
}

#group .individual-point-view-title.sokuho {
  	color: #166508;
  	line-height: 35px;
    font-size: 0.9rem;
    font-weight: bold;
}

#group .individual-point-view-title_point.sokuho {
  	color: #166508;
  	line-height: 35px;
    font-size: 0.7rem;
    font-weight: bold;
    margin-left: 5px;
}

#group .individual-point-view-title.ashiyubi {
  	color: #8D7700;
    line-height: 35px;
  	font-size: 0.9rem;
    font-weight: bold;
}

#group .individual-point-view-title_point.ashiyubi {
  	color: #8D7700;
    line-height: 35px;
  	font-size: 0.7rem;
    font-weight: bold;
    margin-left: 5px;
}

#group .individual-point-view-title.humming {
    color: #0071C6;
    line-height: 35px;
    font-size: 0.9rem;
    font-weight: bold;
}

#group .individual-point-view-title_point.humming {
    color: #0071C6;
    line-height: 35px;
    font-size: 0.7rem;
    font-weight: bold;
    margin-left: 5px;
}

#group .point-num-wrapper {
  	margin-right: 0;
  	margin-left: auto;
  	float: right;
}

#group #group-gogo-point-num {
  	font-size: 1.5rem;
    font-family: din-2014, sans-serif;
  	color: #8E3D00;
    vertical-align: baseline;
}

#group #group-fast-point-num {
    font-size: 1.5rem;
    font-family: din-2014, sans-serif;
  	color: #166508;
    vertical-align: baseline;
}

#group #group-toes-point-num {
    font-size: 1.5rem;
  	font-family: din-2014, sans-serif;
    color: #8D7700;
    vertical-align: baseline;
}

#group #group-breath-point-num {
    font-size: 1.5rem;
  	font-family: din-2014, sans-serif;
    color: #0071C6;
    vertical-align: baseline;
}

#group #group-point-num {
  	font-size: 2.5rem;
  	margin-left: 8px;
    margin-right: 8px;
  	color: #22CF3C;
    font-family: din-2014, sans-serif;
}

.group-name-change-popup-background {
  padding: 0;
}

.group-name-change-popup-content {
  padding: 16px;
}

.records-top-page-title {
	background: #E9EFE9;
  	color: #228D0F;
  	font-weight: bold;
  	font-size: 1.3rem;
  	text-align: center;
  	padding: 20px;
  	width: 100%;
  	border-radius: 16px 16px 0 0;
}

#group-name-target {
	font-weight: bold;
  	font-size: 1.1rem;
  	text-align: center;
}

#group-name-apply {
	height: 50px;
  	margin-bottom: 10px;
}

#group-name-text {
  	width: 100%;
	max-width: 100%;
    margin-bottom: 20px;
}

#group-name-change-popup .vertical.scrollable {
	padding: 0;
}

/* ==============
group 4th sokulympic ranking
============== */

#group-ranking {
	overflow: hidden;
}

#group-ranking iframe {
	width: 100%;
	height: 50vh;
	border: 0;
}

.group-member-ranking-title {
    text-align: center;
    font-weight: bold;
    border-radius: 24px 24px 0 0;
    padding: 10px;
}

.ranking-title-ashiyubi {
    background: #FFD600;
}

.ranking-title-sokuho {
    background: linear-gradient(45deg, #00B51B, #21E53E);
}

.ranking-title-gogo {
    background: linear-gradient(45deg, #FF790B, #FFAA29, #FFCD4B);
}

.group-member-ranking-league-images-wrapper {
    display: flex;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0 8px;
    margin-top: 10px;
}

.group-member-ranking-league-images-content {
    width: 90%;
    position: relative;
}

.group-member-ranking-league-images {
    width: 100%;
}

.group-member-ranking-your-league-images {
    text-align: center;
    position: absolute;
    width: 100px;
    top: -30px;
    left: 50%;
    transform: translateX(-50%);
}

.group-member-ranking-league-move-wrapper {
    display: flex;
    width: 100%;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
}

.group-member-ranking-league-move-text {
    font-weight: bold;
}

.group-member-ranking-league-move {
    position: relative;
    color: #166508;
    width: 35px;
    height: 35px;
}

.group-member-ranking-league-move::after {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    border-top: 2px solid #166508;
    border-left: 2px solid #166508;
}

.group-member-ranking-league-move.back::after {
    transform: rotate(-45deg);
    position: absolute;
    right: 0;
    top: 8px;
    margin-right: 20px;
}

.group-member-ranking-league-move.next::after {
    transform: rotate(135deg);
    position: absolute;
    right: 0;
    top: 8px;
}

.group-member-ranking-league-my-wrapper {
    font-weight: bold;
    padding: 20px;
    text-align: center;
}

.group-member-ranking-league-top3-content {
    padding: 20px;
}

.group-member-ranking-league-top3-content-1stplace {
    background: linear-gradient(45deg, #ECC440, #FFFA8A, #DDAC17);
    padding: 10px;
}

.group-member-ranking-league-top3-content-2ndplace {
    background: linear-gradient(45deg, #E9E9E9, #8F8F8F);
    padding: 10px;
}

.group-member-ranking-league-top3-content-3rdplace {
    background: linear-gradient(45deg, #B45100, #FFAA29, #FFCD4B);
    padding: 10px;
}

.group-member-ranking-league-top3-rank {
    overflow: hidden;
    display: flex;
    width: 100%;
 	max-width: auto;
    justify-content: stretch;
    align-items: stretch;
    flex-direction: row;
    gap: 5px;
    margin-bottom: 10px;
}

.group-member-ranking-league-top3-rank-wrapper {
    width: 25%;
}

.group-member-ranking-league-top3-rank-1stplace {
    background: url(../img/soklin-league/rank/rank_crown.png) no-repeat center bottom;
    background-size: contain;
    color: #EA6900;
    text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
    -1px 1px 0 #FFF, 1px -1px 0 #FFF,
    0px 1px 0 #FFF,  0-1px 0 #FFF,
    -1px 0 0 #FFF, 1px 0 0 #FFF;
    font-weight: bold;
    font-size: 1rem;
    padding-top: 13px;
    text-align: center;
}

.group-member-ranking-league-top3-rank-2ndplace {
    background: url(../img/soklin-league/rank/rank_crown.png) no-repeat center bottom;
    background-size: contain;
    color: #4B4D50;
    text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
    -1px 1px 0 #FFF, 1px -1px 0 #FFF,
    0px 1px 0 #FFF,  0-1px 0 #FFF,
    -1px 0 0 #FFF, 1px 0 0 #FFF;
    font-weight: bold;
    font-size: 1rem;
    padding-top: 13px;
    text-align: center;
}

.group-member-ranking-league-top3-rank-3rdplace {
    background: url(../img/soklin-league/rank/rank_crown.png) no-repeat center bottom;
    background-size: contain;
    color: #8E3D00;
    text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
    -1px 1px 0 #FFF, 1px -1px 0 #FFF,
    0px 1px 0 #FFF,  0-1px 0 #FFF,
    -1px 0 0 #FFF, 1px 0 0 #FFF;
    font-weight: bold;
    font-size: 1rem;
    padding-top: 13px;
    text-align: center;
}

.group-member-ranking-league-top3-point {
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.3rem;
}

.group-member-ranking-league-top3-point-unit {
    font-size: 0.65rem;
}

.group-member-ranking-league-top3-place {
    width: 25%;
    font-size: 0.9rem;
    background: #fff;
    padding: 10px;
    font-weight: bold;
    border-radius: 8px;
}

.group-member-ranking-league-top3-name {
    width: 50%;
    font-weight: bold;
    font-size: 0.9rem;
}

.group-member-ranking-league-list-wrapper {
    margin-top: 20px;
}

.group-member-ranking-league-list {
    border-collapse: collapse;
    width: 100%;
}

.group-member-ranking-league-title, .group-member-ranking-league-place, .group-member-ranking-league-place-name {
    border-bottom: 1px solid #D9D9D9;
  	width: 30%;
}

.group-member-ranking-league-title {
    background: linear-gradient(45deg, #00B51B, #21E53E);
    padding: 5px;
}

.group-member-ranking-league-title-rank {
    color: #021D01;
}

.group-member-ranking-league-title-point {
    color: #fff;
    text-align: center;
    font-weight: bold;
    font-size: 1.3rem;
}

.group-member-ranking-league-title-point-unit {
    font-size: 0.65rem;
}

.group-member-ranking-league-place {
    padding: 5px;
    font-weight: bold;
  	width: 20%;
}

.group-member-ranking-league-place-border {
    border-right: 1px solid #D9D9D9;
    padding: 5px;
}

.group-member-ranking-league-place-name {
    padding: 5px;
    font-weight: bold;
    font-size: 1.2rem;
    width: 50%;
}

.group-member-ranking-back {
    margin-top: 30px;
    margin-bottom: 45px;
}

.group-member-ranking-best100-images-wrapper {
    margin-top: 30px;
}

.group-member-ranking-best100-images {
    width: 100%;
}

.group-member-ranking-league-button_wrapper {
    margin: 24px auto 0;
    width: 97%;
    display: flex;
    justify-content: space-between;
}

button.group-member-ranking-league_next.horizontal.middle.round {
    background: #fff;
  	color: #25AC0D;
 	border: 1.5px solid #25AC0D;
    font-weight: bold;
    padding: 6px 40px 6px 20px !important;
    cursor: pointer;
    outline: none;
    width: 100%;
    max-width: 100%;
    position: relative;
    text-align: center;
    margin-left: 10px;
    filter: drop-shadow(1px 1px 5px rgb(0,0,0,0.3));
}

button.group-member-ranking-league_next.horizontal.middle.round::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 25px;
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid #25AC0D;
	border-left: 0;
	border-bottom: 0;
	box-sizing: border-box;
	transform: rotate(45deg);
}

button.group-member-ranking-league_back.horizontal.middle.round {
    background: #fff;
  	color: #25AC0D;
  	border: 1.5px solid #25AC0D;
    font-weight: bold;
    padding: 6px 20px 6px 40px !important;
    cursor: pointer;
    outline: none;
    width: 100%;
    max-width: 100%;
    position: relative;
    text-align: center;
    margin-right: 10px;
    filter: drop-shadow(1px 1px 5px rgb(0,0,0,0.3));
}

button.group-member-ranking-league_back.horizontal.middle.round::after {
    content: "";
    position: absolute;
    top: 12px;
    left: 25px;
	display: inline-block;
	width: 10px;
	height: 10px;
	border: 2px solid #25AC0D;
	border-left: 0;
	border-bottom: 0;
	box-sizing: border-box;
	transform: rotate(-135deg);
}

.group-member-ranking-league-number {
    font-weight: bold;
    display: flex;
}

.ranking-league-top-page-title {
    /* background: #E9EFE9; */
 	background:linear-gradient(45deg, #22CF3C, #16FF39, #A7FC73);
    color: #228D0F;
    font-weight: bold;
    font-size: 1.3rem;
    text-align: center;
    padding: 20px;
    width: 100%;
    border-radius: 16px 16px 0 0;
}

.ranking-1st {
    background: linear-gradient(45deg, #ECC440, #FFFA8A, #DDAC17);
}

.ranking-2nd {
    background: linear-gradient(45deg, #8F8F8F, #B1B1B1, #E9E9E9, #BCBCBC);
}

.ranking-3rd {
    background: linear-gradient(45deg, #B45100, #FFAA29, #FFCD4B);
}

.ranking-league-top-page-title .group-member-ranking-league-top3-rank-1stplace {
    font-size: 2rem;
}

.ranking-league-top-page-place {
    color: #333333;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 10px 0;
}

.ranking-league-top-page-name {
    color: #333333;
    font-size: 1.7rem;
    line-height: 2rem;
}

.group-name-change-popup-content {
    width: 100%;
}

.ranking-league-top-page-point {
    font-size: 3rem;
    border-bottom: 1px solid #000;
    text-align: center;
    padding-bottom: 10px;
    font-weight: bold;
}

.ranking-league-top-page-point-unit {
    font-size: 1rem;
}

.ranking-league-top-page-member {
    margin: 10px 0 30px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.ranking-league-top-page-member-one {
    width: calc(50% - 20px);
    margin-bottom: 10px;
    box-sizing: border-box;
  	text-align: center;
}

#ranking-league-images-A {
    width: 90%;
    position: relative;
}
#ranking-league-images-B {
    width: 90%;
    position: relative;
}
#ranking-league-images-C {
    width: 150%;
    position: relative;
}
#ranking-league-images-D {
    width: 90%;
    position: relative;
}
#ranking-league-images-E {
    width: 90%;
    position: relative;
}

#ranking-league-A {
    font-weight: bold;
    display: none;
}
#ranking-league-B {
    font-weight: bold;
    display: none;
}
#ranking-league-C {
    font-weight: bold;
}
#ranking-league-D {
    font-weight: bold;
    display: none;
}
#ranking-league-E {
    font-weight: bold;
    display: none;
}

#group-ranking-league-A {
    display: none;
}
#group-ranking-league-B {
    display: none;
}
#group-ranking-league-C {

}
#group-ranking-league-D {
    display: none;
}
#group-ranking-league-E {
    display: none;
}

#top100-ranking-A {
    display: none;
}
#top100-ranking-B {
    display: none;
}
#top100-ranking-C {
    display: none;
}
#top100-ranking-D {
    display: none;
}
#top100-ranking-E {
    display: none;
}
#top100-ranking-A-1 {
    display: none;
}
#top100-ranking-A-2 {
    display: none;
}
#top100-ranking-A-3 {
    display: none;
}
#top100-ranking-A-4 {
    display: none;
}
#top100-ranking-A-5 {
    display: none;
}
#top100-ranking-B-1 {

}
#top100-ranking-B-2 {
    display: none;
}
#top100-ranking-B-3 {
    display: none;
}
#top100-ranking-B-4 {
    display: none;
}
#top100-ranking-B-5 {
    display: none;
}
#top100-ranking-C-1 {

}
#top100-ranking-C-2 {
    display: none;
}
#top100-ranking-C-3 {
    display: none;
}
#top100-ranking-C-4 {
    display: none;
}
#top100-ranking-C-5 {
    display: none;
}
#top100-ranking-D-1 {

}
#top100-ranking-D-2 {
    display: none;
}
#top100-ranking-D-3 {
    display: none;
}
#top100-ranking-D-4 {
    display: none;
}
#top100-ranking-D-5 {
    display: none;
}
#top100-ranking-E-1 {

}
#top100-ranking-E-2 {
    display: none;
}
#top100-ranking-E-3 {
    display: none;
}
#top100-ranking-E-4 {
    display: none;
}
#top100-ranking-E-5 {
    display: none;
}

#ranking-league-number-1 {
    font-weight: bold;
    display: flex;
    margin-left:20%;
}
#ranking-league-number-5 {
    font-weight: bold;
    display: flex;
    margin-right:47%;
}

#initial_ranking .group-background {
  border-radius: 0;
}

.soklin-rank-before0822 {
	max-width: 300px;
  	margin: 0 auto;
}

.soklin-rank-before0822 img {
	width: 100%;
}

/* ==============
group 4th sokulympic popup
============== */

/* midterm report */

.midterm-report-up {
    background: url(../img/soklin-league/popup/midterm-report/midterm-report-up.png?) no-repeat;
    background-size: contain;
    background-position: top center;
}

.midterm-report-nochange-a {
    background: url(../img/soklin-league/popup/midterm-report/midterm-report-nochange-a.png?) no-repeat;
    background-size: contain;
    background-position: top center;
}

.midterm-report-nochange {
    background: url(../img/soklin-league/popup/midterm-report/midterm-report-nochange.png?) no-repeat;
    background-size: contain;
    background-position: top center;
}

.midterm-report-down {
    background: url(../img/soklin-league/popup/midterm-report/midterm-report-down.png?) no-repeat;
    background-size: contain;
    background-position: top center;
}

.group-member-ranking-popup-background {
	background: #fff;
    border-radius: 24px;
}

.group-member-ranking-popup-content.vertical.scrollable {
	padding: 0;
}

.midterm-report-top-page-wrapper {
    padding: 20px;
    width: 100%;
    border-radius: 16px;
    min-width: 200px;
    max-width: 380px;
}

.midterm-report-top-page-title {
    color: #166508;
    font-weight: bold;
    font-size: 1.3rem;
    text-align: center;
    line-height: 1.8rem;
    margin-bottom: 5px;
}

.midterm-report-top-page-sub-title {
    color: #228D0F;
    font-weight: bold;
    font-size: 1.8rem;
    text-align: center;
    line-height: 2rem;
    position: relative;
}

.lang-en .midterm-report-top-page-sub-title,.lang-pt .midterm-report-top-page-sub-title {
    color: #228D0F;
    font-weight: bold;
    font-size: 1.8rem;
    text-align: center;
    line-height: 1.5rem;
    position: relative;
}

.midterm-report-top-page-sub-title::before {
    content: url(../img/soklin-league/popup/midterm-report/midterm-report-top-page-sub-title.png?);
    display: block;
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 5px;
    left: 0;
}

.midterm-report-top-page-sub-title::after {
    content: url(../img/soklin-league/popup/midterm-report/midterm-report-top-page-sub-title.png?);
    transform: scale(-1, 1);
    display: block;
    width: 1rem;
    height: 1rem;
    position: absolute;
    top: 5px;
    right: 0;
}

.midterm-report-color {
    color: #25AC0D;
    font-size: 2rem;
    line-height: 2rem;
    font-weight: bold;
}

.midterm-report-group-wrapper {
    margin-top: clamp(170px, -220.000px + 100vw, 210px);
}

.midterm-report-group-content-wrapper {
    justify-content: center;
  	margin-bottom: -130px;
}

.midterm-report-group-button {
    position: relative;
}

.midterm-report-group-button::after {
    content: " ";
    display: inline-block;
    width: 10px;
    height: 10px;
    border: 1px solid #021D01;
    border-left: 0;
    border-bottom: 0;
    margin-left: 10px;
    box-sizing: border-box;
    transform: translateY(-50%) rotate(45deg);
    position: absolute;
    right: 20px;
    top: 50%;
}

/* average */

.average-back {
    background: url(../img/soklin-league/popup/average/average-back.png?) no-repeat;
    background-size: contain;
    background-position: top center;
    position: relative;
}

.average-report-top-page-title-wrapper {
    margin-top: 20px;
}

.average-text, .average-sub-text {
    font-weight: bold;
    font-size: 1.3rem;
  	line-height: 1.5rem;
    text-align: center;
    color: #228D0F;
    text-shadow:2px 2px 0 #FFF, -2px -2px 0 #FFF,
    -2px 2px 0 #FFF, 2px -2px 0 #FFF,
    0px 2px 0 #FFF,  0 -1px 0 #FFF,
    -2px 0 0 #FFF, 2px 0 0 #FFF;
}

.average-sub-text {
    font-size: 1.5rem;
}

.average-notice {
    margin-top: 180px;
    margin-bottom: 30px;
}

.average-point-content {
    position: relative;
}

.average-point-images-wrapper {
    position: absolute;
    top: 38%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 180px;
}

.average-point-images-wrapper.down {
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 150px;
}

.average-point-images-wrapper img {
    width: 100%;
}

.average-point-images-wrapper.down img {
    width: 140%;
}

.average-point {
    color: #fff;
    font-size: 2.3rem;
    position: absolute;
    top: 50%;
    left: 62%;
    transform: translate(-50%, -50%);
    font-family: din-2014, sans-serif;
}
.average-point.non {
    color: #fff;
    font-size: 2.3rem;
    position: absolute;
    top: 50%;
    left: 30%;
    transform: translate(-50%, -50%);
    font-family: din-2014, sans-serif;
}


.average-point.down {
    color: #fff;
    font-size: 2.3rem;
    position: absolute;
    top: 65%;
    left: 38%;
    transform: translate(-50%, -50%);
    font-family: din-2014, sans-serif;
}

.average-point-unit {
    color: #228D0F;
    font-weight: bold;
    position: absolute;
    top: 105%;
    left: 65%;
    transform: translate(-50%, -50%);
    width: 90px;
}

#group-midterm-report-popup-notice,#group-midterm-report-popup-up, #group-midterm-report-popup-nochange-a, #group-midterm-report-popup-nochange-a, #group-midterm-report-popup-nochange-a, #group-midterm-report-popup-down, #group-average-up, #group-average-nochange, #group-average-down, #group-member-rankinge-popup{
	position: absolute;
}

#group-qr-button {
    font-weight: bold;
    text-align: center;
    width: 100%;
    max-width: 560px;
}

#group-qr-popup .qr-disp {
	margin: 32px auto;
}

#group .sokulyn-end-wrapper {
    width: 100%;
    position: absolute;
    text-align: center;
    background-image: url(../img/gogo_bg_241203.png);
    z-index: 2;
    background-size: 100% 72px;
    height: 72px;
    margin-top: 200px;
}

#group .sokulyn-end-text {
    height: 72px;
    z-index: 3;
    margin-top: 4px;
}

/* @media screen and (min-width: 450px){
  #group .sokulyn-end-wrapper {
    margin-top: 250px;
  }
}
@media screen and (min-width: 545px){
  #group .sokulyn-end-wrapper {
    margin-top: 350px;
  }
}
@media screen and (min-width: 650px){
  #group .sokulyn-end-wrapper {
    margin-top: 400px;
  }
}
@media screen and (min-width: 700px){
  #group .sokulyn-end-wrapper {
    margin-top: 450px;
  }
}
@media screen and (min-width: 850px){
  #group .sokulyn-end-wrapper {
    margin-top: 500px;
  }
}
@media screen and (min-width: 950px){
  #group .sokulyn-end-wrapper {
    margin-top: 550px;
  }
}
@media screen and (min-width: 1110px){
  #group .sokulyn-end-wrapper {
    margin-top: 600px;
  }
} */

.group-qr-title {
    color: #22CF3C;
    font-size: 1.5rem;
}

.group-qr-message {
    color: #166508;
}

.group-qr-close {
    height: 54px;
    border: 1px solid #25AC0D;
}

/* .group-qr-icon {
    width: 48px;
}

.group-qr-spacer {
    height: 80px;
}

@media screen and (min-width: 400px){
    .group-qr-spacer {
        height: 90px;
    }
}

@media screen and (min-width: 500px){
    .group-qr-spacer {
        height: 120px;
    }
} */

#group .title_soklin {
    background-position: top center !important;
    /* background: url(../img/soklin-league/group/soklin-league_group_bg_2025.png) no-repeat !important; */
    background-size: contain !important;
}

/* #group .sokulyn-end-spacer {
    aspect-ratio: 0.66;
    width: 100%;
}*/

#group-qr-button img {
    margin-top: -15px;
}

.group-alive-popup-main {
    padding: 0;
    overflow-y: auto;
}

#group-alive-popup .group-alive-popup-image {
    background-image: url(../img/group-alive-popup/background.png);
    background-repeat: no-repeat;
    background-size: auto;
    background-position-x: center;
    background-position-y: -16px;
    background-color: #F6FFEF;
    min-height: 138px;
    border-radius: 16px;
}

#sokulyn-notice-popup .group-alive-popup-image {
    background-image: url(../img/soklin-league/group/soklin-league_group_bg_2025.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position-x: center;
    background-position-y: -12px;
    background-color: #FFFFFF;
    aspect-ratio: 1.8;
    border-radius: 0px;
}

.group-alive-popup-title {
    color: #228D0F;
    font-weight: bold;
    font-size: 16px;
}
.group-alive-popup-title > div:nth-child(1) {
    font-size: 24px;
}

.group-alive-popup-body {
    font-size: 16px;
}
.group-alive-popup-body > span.emphasis {
    color: #FF2719;
}

.group-alive-popup-remark {
    font-size: 14px;
    color: #6C6F6E;
}

.group-alive-popup-main .group-alive-later {
    font-size: 16px;
    color: #919499;
}

/* ==============
group 5th
============== */

#group .group-photo-btn {
	display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 0 8px;
    border-radius: 16px;
    background-color: #F6FFEF;
    border: 2px dashed #228D0F;
    box-sizing: border-box;
    padding: 8px 0;
    max-width: 100%;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.10)) drop-shadow(0 1px 5px rgba(0, 0, 0, 0.30));
}

#group .group-photo-btn__circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #228D0F;
    position: relative;
}

#group .group-photo-btn__circle::before, #group .group-photo-btn__circle::after  {
    content: '';
    position: absolute;
    background-color: #228D0F;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#group .group-photo-btn__circle::before {
    width: 1px;
    height: 24px;
}

#group .group-photo-btn__circle::after {
    width: 24px;
    height: 1px;
}

#group .group-photo-btn__text {
    text-align: left;
    font-size: 18px;
    color: #0A3F03;
    font-weight: bold;
}


/* ==============
olive
============== */
.olive-wrapper {
    position: relative;
    z-index: 10;
}

.olive-disp {
    position: absolute;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 2px 20px;
    background: #93A204;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.3), 0px 6px 20px 4px rgba(0, 0, 0, 0.1);
    border-radius: 30px;
    top: 12px;
    left: 16px;
    transform-origin: center left;
}

.olive-head {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 900;
    font-size: 14px;
    color: #FFFFFF;
}

.olive-point {
    font-family: din-2014, sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: #FFFFFF;
    line-height: 1.0;
    margin-left: 4px !important;
}

.olive-tail {
    font-family: 'Noto Sans JP';
    font-style: normal;
    font-weight: 900;
    font-size: 8px;
    color: #FFFFFF;
    margin-bottom: -6px;
}

#olive-popup .video-wrapper {
    max-width: 360px;
    width: 100%;
    height: 100%;
}

#olive-popup .video-wrapper video {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 28px;
}

#season5-popup img {
    width: 200px;
}