@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tinos&display=swap');
.yellow_line {
background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #f2ff00 0%) repeat scroll 0 0;
}

.make-results {
font-family: 'M PLUS Rounded 1c', sans-serif;
line-height: 2;
}

.results-head {
position: relative;
background-size: cover;
background-repeat: no-repeat;
background-position: right;
}

.results-head::before {
content: '';
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-head-warp.svg);
position: absolute;
background-repeat: no-repeat;
background-size: contain;
transform: translateX(-50%)translateY(-50%);
}

.results-head h2 {
color: #fff;
position: absolute;
left: 50%;
top: 50%;
transform: translateX(-50%)translateY(-50%);
text-align: center;
line-height: 1.5;
}

.results-head h2:before {
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 3px;
content: '';
border-radius: 3px;
background: #fff;
}

.results-bg-white, .results-bg-white-2 {
background: #fff;
position: relative;
border-bottom: solid 3PX #666;
}

.results-bg-pink {
background: #eee;
position: relative;
z-index: -2;
border-bottom: solid 3PX #666;
}

.results-bg-white-warp, .results-bg-pink-warp {
margin: 0 auto;
max-width: 1200px;
}

.results-flex div h3 {
position: absolute;
}

.results-flex div:nth-child(1) {
position: relative;
z-index: 2;
}

.results-flex div:nth-child(2) {
position: relative;
z-index: 2;
}

.results-flex div:nth-child(3) {
position: relative;
z-index: 2;
}

.results-bg-white-2 h2 {
color: #666;
}

.results-bg-pink h2 {
color: #666;
}

.results-bg-pink h2, .results-bg-white-2 h2 {
position: relative;
text-align: center;
line-height: 1.4;
}

.results-bg-pink h2:before, .results-bg-white-2 h2:before {
position: absolute;
bottom: 0px;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 5px;
content: '';
border-radius: 3px;
}

.results-bg-pink h2:before {
background: #666;
}

.results-bg-white-2 h2:before {
background: #666;
}

.results-chart, .results-chart-2 {
position: relative;
}

.results-flex-2 div:nth-child(1) {
width: 95%
}

.results-flex-2 div:nth-child(2) {
width: 95%
}

.results-chart, .results-chart-2 {
padding: 1rem;
background: rgba(255, 255, 255, 0.9);
}

.results-chart {
border: solid 0px #FFAD1C;
border-radius: 0px;
}

.results-chart-2 {
border: solid 0px #75D0FF;
border-radius: 0px;
}

.results-chart p, .results-chart-2 p {
text-align: center;
position: relative;
}

.results-chart p {
border-bottom: solid 1px #FFAD1C;
color: #FFAD1C;
padding-bottom: 10px;
}

.results-chart-2 p {
border-bottom: solid 1px #75D0FF;
color: #75D0FF;
padding-bottom: 10px;
}

.results-chart p span, .results-chart-2 p span {
padding-left: 30px;
font-weight: 700;
}

.chart-1::after, .chart-2::after, .chart-3::after, .chart-4::after, .chart-5::after, .chart-6::after {
content: '';
position: absolute;
background-size: contain;
background-repeat: no-repeat;
left: 17%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
}

.chart-1::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-1-orange.svg);
}

.chart-2::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-2-orange.svg);
}

.chart-3::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-3-orange.svg);
}

.chart-4::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-1-blue.svg);
}

.chart-5::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-2-blue.svg);
}

.chart-6::after {
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-3-blue.svg);
}

.results-chart h4, .results-chart-2 h4 {
position: absolute;
top: 0px;
left: 72.5%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
display: block;
padding: 1rem 0rem;
width: 50%;
text-align: center;
}

.results-chart h4 {
background: #666;
}

.results-chart-2 h4 {
background: #666;
}



.results-chart::after {
background: #FFAD1C;
}

.results-chart-2::after {
background: #75D0FF;
}

@media screen and (min-width:1501px) {
.results-bg-white::before, .results-bg-white-2::before {
top: 10%;
left: 0px;
font-size: 3rem;
}
.results-bg-pink::before {
top: 10%;
left: 90%;
font-size: 3rem;
}
}

@media screen and (min-width:1920px) {
.results-bg-white::before, .results-bg-white-2::before {
top: 15%;
left: 50px;
font-size: 5rem;
}
.results-bg-pink::before {
top: 15%;
left: 90%;
font-size: 5rem;
}
}

@media screen and (max-width: 1000px) {
.results-head {
background: linear-gradient(to left, rgb(102, 102, 102) 0%, rgba(102, 102, 102, 1) 70%, rgba(102, 102, 102, 0.2) 90% 100%), url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-head-sp.webp);
height: 100px;
}
.results-head::before {
left: 40%;
width: 180px;
height: 180px;
top: 10px;
}
.results-head h2 {
font-size: 1.2rem;
}
.results-bg-white, .results-bg-white-2, .results-bg-pink {
padding: 2rem 1em;
}
.results-flex div {
position: relative;
}
.results-flex div:nth-child(1) {
margin: 5px;
height: 200px;
margin-bottom: 40px;
}
.results-text-box p {
padding: 1rem;
}
.results-flex div:nth-child(1) h3 {
background: repeating-linear-gradient(-45deg, #fe9895 -1px, #FF7975 1px, #FF7975 6px);
color: #fff;
width: 80px;
height: 80px;
border-radius: 50%;
top: 30%;
left: 85%;
z-index: 2;
transform: translateX(-50%)translateY(-50%);
text-align: center;
}
.results-flex div:nth-child(1) h3 span {
position: absolute;
font-size: 12px;
line-height: 1.1;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 100%;
}
.results-flex div:nth-child(2) h3 {
background: repeating-linear-gradient(-45deg, #658591 -1px, #417083 1px, #417083 6px);
color: #fff;
width: 70px;
height: 70px;
border-radius: 50%;
margin-top: -180px;
left: 15%;
z-index: 2;
transform: rotate(5deg) translateX(-50%)translateY(-50%);
text-align: center;
position: absolute;
}
.results-flex div:nth-child(2) h3 span {
position: absolute;
font-size: 12px;
line-height: 1.1;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 100%;
}
.results-flex div:nth-child(3) h3 {
background: repeating-linear-gradient(-45deg, #ffcda5 -1px, #ffb375 1px, #ffb375 6px);
color: #fff;
width: 75px;
height: 75px;
border-radius: 50%;
margin-top: -70px;
left: 20%;
z-index: 2;
transform: rotate(-5deg) translateX(-50%)translateY(-50%);
text-align: center;
position: absolute;
}
.results-flex div:nth-child(3) h3 span {
position: absolute;
font-size: 12px;
line-height: 1.1;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 100%;
}
.results-flex div:nth-child(1)::after {
content: '';
z-index: 1;
display: inline-block;
position: absolute;
top: 0px;
opacity: 1;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-01.webp);
width: 100%;
height: 100%;
left: 0;
background-size: cover;
}
.results-flex div:nth-child(1)::before {
content: '';
z-index: -3;
display: inline-block;
position: absolute;
top: 10px;
opacity: 0.4;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-01.webp);
width: 100%;
height: 100%;
left: 0;
background-size: cover;
}
.results-bg-pink h2, .results-bg-white-2 h2 {
font-size: 2.5rem;
padding: 1rem;
}
.results-bg-pink h2 span, .results-bg-white-2 h2 span {
font-size: 13px;
display: block;
}
.results-flex-2 {
margin: 0 auto;
}
.results-flex-2 div p {
padding: 1rem;
}
.results-flex-2 div {
margin: 0 auto;
margin: 2rem 0.8rem;
}
.results-chart p span, .results-chart-2 p {
font-size: 2rem;
}
.results-chart h4, .results-chart-2 h4 {
font-size: 0.9rem;
}
.chart-1::after, .chart-2::after, .chart-3::after, .chart-4::after, .chart-5::after, .chart-6::after {
width: 30px;
height: 30px;
}
.results-chart, .results-chart-2 {
line-height: 0.5;
}
.results-chart p small, .results-chart-2 p small {
font-size: 0.9rem
}

.results-chart::before, .results-chart-2::before {
content: '';
position: absolute;
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-ranking.svg);
top: 15%;
left: 10%;
transform: translateX(-50%) translateY(-50%);
background-size: contain;
width: 30px;
height: 30px;
z-index: 2;
}

.results-chart::after, .results-chart-2::after {
content: '';
position: absolute;
top: 15%;
left: 10%;
transform: translateX(-50%) translateY(-50%);
z-index: 1;
width: 50px;
height: 50px;
border-radius: 50%;
}

}

@media screen and (min-width: 1001px) {
.results-head {
background: linear-gradient(to left, rgba(102, 102, 102, 1) 0%, rgba(102, 102, 102, 1) 75%, rgba(102, 102, 102, 0.2) 90% 100%), url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-head-pc.webp);
height: 200px;
}
.results-head::before {
left: 45%;
width: 250px;
height: 250px;
top: 20px;
}
.results-head h2 {
font-size: 2.3rem;
}
.results-bg-white {
padding: 7rem 0rem 3rem 0rem;
}
.results-bg-pink, .results-bg-white-2 {
padding: 3rem 0rem;
}
.results-bg-white .results-text-box, .results-bg-white-2 .results-text-box, .results-bg-pink .results-text-box {
max-width: 700px;
margin: 0 auto;
margin-top: 50px;
margin-bottom: 40px;
font-size: 1rem;
}
.results-flex div {
margin: 10px;
height: 200px;
min-width: 200px;
}
.results-flex div h3 {
background: repeating-linear-gradient(-45deg, #fe9895 -1px, #FF7975 1px, #FF7975 6px);
color: #fff;
z-index: 2;
width: 80px;
height: 80px;
border-radius: 50%;
top: -20%;
left: -10%;
}
.results-flex div h3 span {
position: absolute;
font-size: 13px;
line-height: 1.1;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 100%;
}
.results-flex div:nth-child(1)::after {
content: '';
z-index: 1;
display: inline-block;
position: absolute;
top: 0px;
opacity: 1;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-01.webp);
width: 100%;
height: 100%;
left: 0;
background-size: cover;
}
.results-flex div:nth-child(1)::before {
content: '';
z-index: -3;
display: inline-block;
position: absolute;
top: 10px;
opacity: 0.4;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-01.webp);
width: 100%;
height: 100%;
left: 20px;
background-size: cover;
}
.results-flex div:nth-child(2)::after {
content: '';
z-index: 1;
display: inline-block;
position: absolute;
top: 0px;
opacity: 1;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-02.webp);
width: 100%;
height: 100%;
left: 20px;
background-size: cover;
}
.results-flex div:nth-child(2)::before {
content: '';
z-index: -3;
display: inline-block;
position: absolute;
top: 10px;
opacity: 0.4;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-02.webp);
width: 100%;
height: 100%;
left: 0;
background-size: cover;
}
.results-flex div:nth-child(3)::after {
content: '';
z-index: 1;
display: inline-block;
position: absolute;
top: 0px;
opacity: 1;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-03.webp);
width: 100%;
height: 100%;
left: 20px;
background-size: cover;
}
.results-flex div:nth-child(3)::before {
content: '';
z-index: -3;
display: inline-block;
position: absolute;
top: 10px;
opacity: 0.4;
background: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-03.webp);
width: 100%;
height: 100%;
left: 0;
background-size: cover;
}
.results-bg-pink h2, .results-bg-white-2 h2 {
font-size: 3rem;
padding: 1rem;
}
.results-bg-pink h2 span, .results-bg-white-2 h2 span {
font-size: 1.5rem;
display: block;
}
.results-flex-2 {
display: flex;
margin: 0 auto;
}
.results-flex-2 div {
width: 100%;
margin: 0 auto;
margin: 1rem;
}
.results-flex-2 div p {
margin: 2rem;
}
.results-chart p span, .results-chart-2 p {
font-size: 3rem;
}
.results-chart h4, .results-chart-2 h4 {
font-size: 1rem;
}
.chart-1::after, .chart-2::after, .chart-3::after, .chart-4::after, .chart-5::after, .chart-6::after {
width: 40px;
height: 40px;
padding-bottom: 10px;
}
.results-chart, .results-chart-2 {
line-height: 0.5;
}
.results-chart p small, .results-chart-2 p small {
font-size: 1.3rem
}
.results-text-box p {
position: relative;
}
.results-text-box p::after {
content: '';
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-poke.svg);
position: absolute;
width: 120px;
height: 120px;
background-size: contain;
background-repeat: no-repeat;
display: inline-block;
left: -7%;
top: 10%;
transform: translateX(-50%) translateY(-50%);
}
.results-flex {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}
.results-flex div {
width: calc(100%/3);
background-size: cover;
width: 100%;
position: relative;
}

.results-chart::before, .results-chart-2::before {
content: '';
position: absolute;
background-image: url(https://pokewaku.jp/wp-content/themes/blankslate-child/assets/images/make-ic-ranking.svg);
top: 0;
left: 0;
transform: translateX(-50%) translateY(-50%);
background-size: contain;
width: 40px;
height: 40px;
z-index: 2;
}

.results-chart::after, .results-chart-2::after {
content: '';
position: absolute;
top: 0;
left: 0;
transform: translateX(-50%) translateY(-50%);
z-index: 1;
width: 70px;
height: 70px;
border-radius: 50%;
}

}

@media screen and (min-width: 1501px) {
.results-bg-white::before {
content: 'RESULTS';
color: #ddd;
font-family: 'Tinos', serif;
}
.results-bg-white::before {
position: absolute;
writing-mode: vertical-rl;
text-orientation: sideways;
transform: rotate(180deg);
z-index: 3;
overflow: hidden;
}
.results-bg-white-2::before {
content: 'Hourly wage';
color: #ddd;
font-family: 'Tinos', serif;
}
.results-bg-white-2::before {
position: absolute;
writing-mode: vertical-rl;
text-orientation: sideways;
transform: rotate(180deg);
z-index: 3;
overflow: hidden;
}
.results-bg-pink::before {
content: 'PERSONS';
color: #dbdbdb;
font-family: 'Tinos', serif;
}
.results-bg-pink::before {
position: absolute;
writing-mode: vertical-rl;
text-orientation: sideways;
transform: rotate(180deg);
z-index: 3;
overflow: hidden;
}
}

.results-bg-white-2 h3 {
position: relative;
padding: 1rem;
border: 1px solid #666;
color: #666;
border-radius: 10px;
background: #fff;
display: inline-block;
margin: 1rem 0rem 0rem 0rem;
}

.results-bg-white-2 h3:before {
position: absolute;
bottom: -12px;
left: 1em;
width: 0;
height: 0;
content: '';
border-width: 12px 10px 0 10px;
border-style: solid;
border-color: #666 transparent transparent transparent;
}

.results-bg-white-2 h3:after {
position: absolute;
bottom: -10px;
left: 1em;
width: 0;
height: 0;
content: '';
border-width: 12px 10px 0 10px;
border-style: solid;
border-color: #fff transparent transparent transparent;
}

.results-graph-2, .results-graph-3 {
position: relative;
}

.results-graph-2::after, .results-graph-3::after {
position: absolute;
width: 50px;
height: 50px;
border-radius: 50px;
text-align: center;
color: #fff;
line-height: 50px;
transform: translateX(-50%)translateY(-50%);
top: 15px;
}

.results-graph, .results-graph-2, .results-graph-3 {
display: flex;
height: 200px;
align-items: flex-end;
}

.results-graph span {
background: repeating-linear-gradient(-45deg, #fbaba7 -1px, #FF7975 1px, #FF7975 6px);
}

.results-graph-2 span {
background: repeating-linear-gradient(-45deg, #FFAD1C -1px, #f79c00 1px, #f79c00 6px);
}

.results-graph-3 span {
background: repeating-linear-gradient(-45deg, #75D0FF -1px, #00aaf9 1px, #00aaf9 6px);
}

.results-graph span, .results-graph-2 span, .results-graph-3 span {
position: relative;
text-align: center;
width: calc(100%/6);
flex: 1;
border: solid 1px #fff;
color: #fff;
display: block;
}

.results-graph span:nth-child(1) {
height: 59%;
}

.results-graph span:nth-child(2) {
height: 71%;
}

.results-graph span:nth-child(3) {
height: 79%
}

.results-graph span:nth-child(4) {
height: 80%
}

.results-graph span:nth-child(5) {
height: 88%
}

.results-graph span:nth-child(6) {
height: 100%
}

.results-graph-2 span:nth-child(1) {
height: 100%;
}

.results-graph-2 span:nth-child(2) {
height: 77%;
}

.results-graph-2 span:nth-child(3) {
height: 79%
}

.results-graph-2 span:nth-child(4) {
height: 83%
}

.results-graph-2 span:nth-child(5) {
height: 73%
}

.results-graph-2 span:nth-child(6) {
height: 74%
}

.results-graph-3 span:nth-child(1) {
height: 100%;
}

.results-graph-3 span:nth-child(2) {
height: 94%;
}

.results-graph-3 span:nth-child(3) {
height: 94%
}

.results-graph-3 span:nth-child(4) {
height: 98%
}

.results-graph-3 span:nth-child(5) {
height: 92%
}

.results-graph-3 span:nth-child(6) {
height: 91%
}

.results-graph span::before {
background: #666;
display: block;
}

.results-graph-2 span::before {
background: #666;
display: block;
}

.results-graph-3 span::before {
background: #666;
display: block;
}

.results-graph span:nth-child(1)::before, .results-graph-2 span:nth-child(1)::before, .results-graph-3 span:nth-child(1)::before {
content: '2022.01';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}

.results-graph span:nth-child(2)::before, .results-graph-2 span:nth-child(2)::before, .results-graph-3 span:nth-child(2)::before {
content: '2022.03';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}

.results-graph span:nth-child(3)::before, .results-graph-2 span:nth-child(3)::before, .results-graph-3 span:nth-child(3)::before {
content: '2022.05';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}

.results-graph span:nth-child(4)::before, .results-graph-2 span:nth-child(4)::before, .results-graph-3 span:nth-child(4)::before {
content: '2022.07';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}

.results-graph span:nth-child(5)::before, .results-graph-2 span:nth-child(5)::before, .results-graph-3 span:nth-child(5)::before {
content: '2022.09';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}

.results-graph span:nth-child(6)::before, .results-graph-2 span:nth-child(6)::before, .results-graph-3 span:nth-child(6)::before {
content: '2022.11';
font-size: 10px;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #fff;
width: 100%;
}