Commit d5f1d61d by o.kimura

T145調整

parent 59d12e9b
@charset "UTF-8"; @charset "UTF-8";
:root { :root {
font-size: 16px; font-size: 16px;
font-family: 'Noto Sans JP', sans-serif; font-family: 'Noto Sans JP', sans-serif;
...@@ -81,25 +82,31 @@ a:hover { ...@@ -81,25 +82,31 @@ a:hover {
.pcOnly { .pcOnly {
display: none; display: none;
} }
body.nav-active { body.nav-active {
overflow: hidden; overflow: hidden;
} }
.nav-active .site-header { .nav-active .site-header {
opacity: 1; opacity: 1;
} }
.site-header { .site-header {
height: 55px; height: 55px;
min-width: 400px; min-width: 400px;
font-size: 16px; font-size: 16px;
} }
.site-header::before { .site-header::before {
bottom: -8px; bottom: -8px;
height: 8px; height: 8px;
} }
.site-header-logo { .site-header-logo {
left: 20px; left: 20px;
z-index: inherit; z-index: inherit;
} }
.site-header-nav { .site-header-nav {
position: fixed; position: fixed;
top: 0; top: 0;
...@@ -114,10 +121,12 @@ a:hover { ...@@ -114,10 +121,12 @@ a:hover {
z-index: 1; z-index: 1;
transition: right .5s; transition: right .5s;
} }
.site-header-nav { .site-header-nav {
margin-top: 55px; margin-top: 55px;
line-height: 1.7; line-height: 1.7;
} }
.site-header-nav-item { .site-header-nav-item {
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -127,21 +136,26 @@ a:hover { ...@@ -127,21 +136,26 @@ a:hover {
border-top: 1px solid #fff; border-top: 1px solid #fff;
min-height: 52px; min-height: 52px;
} }
.site-header-nav-item.twitter { .site-header-nav-item.twitter {
padding-top: 20px; padding-top: 20px;
} }
.site-header-nav-item.twitter a { .site-header-nav-item.twitter a {
width: 30px; width: 30px;
} }
.nav-active .site-header-nav { .nav-active .site-header-nav {
right: 0; right: 0;
} }
.menu-trigger, .menu-trigger,
.menu-trigger span { .menu-trigger span {
display: inline-block; display: inline-block;
transition: all .4s; transition: all .4s;
box-sizing: border-box; box-sizing: border-box;
} }
.menu-trigger { .menu-trigger {
position: fixed; position: fixed;
z-index: 10002; z-index: 10002;
...@@ -154,6 +168,7 @@ a:hover { ...@@ -154,6 +168,7 @@ a:hover {
transition: .5s; transition: .5s;
cursor: pointer; cursor: pointer;
} }
.menu-trigger span { .menu-trigger span {
position: absolute; position: absolute;
left: 0; left: 0;
...@@ -162,33 +177,42 @@ a:hover { ...@@ -162,33 +177,42 @@ a:hover {
background-color: #fff; background-color: #fff;
border-radius: 1px; border-radius: 1px;
} }
.menu-trigger span:nth-of-type(1) { .menu-trigger span:nth-of-type(1) {
top: 0px; top: 0px;
} }
.menu-trigger span:nth-of-type(2) { .menu-trigger span:nth-of-type(2) {
top: 10px; top: 10px;
} }
.menu-trigger span:nth-of-type(3) { .menu-trigger span:nth-of-type(3) {
bottom: 1px; bottom: 1px;
} }
.nav-active .menu-trigger span:nth-of-type(1) { .nav-active .menu-trigger span:nth-of-type(1) {
transform: translateY(11px) rotate(-220deg); transform: translateY(11px) rotate(-220deg);
} }
.nav-active .menu-trigger span:nth-of-type(2) { .nav-active .menu-trigger span:nth-of-type(2) {
opacity: 0; opacity: 0;
} }
.nav-active .menu-trigger span:nth-of-type(3) { .nav-active .menu-trigger span:nth-of-type(3) {
transform: translateY(-10px) rotate(220deg); transform: translateY(-10px) rotate(220deg);
} }
.nav-active .menu-trigger { .nav-active .menu-trigger {
visibility: visible !important; visibility: visible !important;
opacity: 1 !important; opacity: 1 !important;
} }
.menu-trigger.hidden { .menu-trigger.hidden {
visibility: hidden; visibility: hidden;
opacity: 0; opacity: 0;
transition: .5s; transition: .5s;
} }
.menu-bg, .menu-bg,
.bg-trigger { .bg-trigger {
display: block; display: block;
...@@ -199,6 +223,7 @@ a:hover { ...@@ -199,6 +223,7 @@ a:hover {
height: calc(100vh - 55px); height: calc(100vh - 55px);
visibility: hidden; visibility: hidden;
} }
.menu-bg { .menu-bg {
margin-top: 55px; margin-top: 55px;
background: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .5);
...@@ -206,13 +231,16 @@ a:hover { ...@@ -206,13 +231,16 @@ a:hover {
transition: .5s; transition: .5s;
z-index: -1; z-index: -1;
} }
.nav-active .menu-bg { .nav-active .menu-bg {
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;
} }
.bg-trigger { .bg-trigger {
cursor: pointer; cursor: pointer;
} }
.nav-active .bg-trigger { .nav-active .bg-trigger {
visibility: visible; visibility: visible;
} }
...@@ -223,21 +251,25 @@ a:hover { ...@@ -223,21 +251,25 @@ a:hover {
@media only screen and (max-width: 599px) { @media only screen and (max-width: 599px) {
.spNone { .spNone {
display: none!important; display: none !important;
} }
.site-header-logo a { .site-header-logo a {
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
width: 160px; width: 160px;
height: 100%; height: 100%;
} }
.header-syadan { .header-syadan {
width: 57px; width: 57px;
} }
.header-jprest { .header-jprest {
margin-top: 6px; margin-top: 6px;
width: 157px; width: 157px;
} }
.site-header-nav a { .site-header-nav a {
font-size: 15px; font-size: 15px;
} }
...@@ -249,16 +281,19 @@ a:hover { ...@@ -249,16 +281,19 @@ a:hover {
@media print, @media print,
(min-width: 600px) { (min-width: 600px) {
.spOnly { .spOnly {
display: none!important; display: none !important;
} }
.site-header-logo { .site-header-logo {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.site-header-logo a { .site-header-logo a {
justify-content: space-between; justify-content: space-between;
width: 339px; width: 339px;
} }
.site-header-nav { .site-header-nav {
left: 251px; left: 251px;
} }
...@@ -279,25 +314,30 @@ a:hover { ...@@ -279,25 +314,30 @@ a:hover {
@media print, @media print,
(min-width: 980px) { (min-width: 980px) {
.pcNone { .pcNone {
display: none!important; display: none !important;
} }
.menu-bg, .menu-bg,
.bg-trigger { .bg-trigger {
display: none; display: none;
} }
.site-header { .site-header {
height: 70px; height: 70px;
} }
.site-header::before { .site-header::before {
bottom: -10px; bottom: -10px;
height: 10px; height: 10px;
} }
.site-header-logo { .site-header-logo {
top: 0; top: 0;
left: calc(43.75vw - 420px); left: calc(43.75vw - 420px);
height: 100%; height: 100%;
font-size: 20px; font-size: 20px;
} }
.site-header-nav { .site-header-nav {
right: 45px; right: 45px;
right: calc(43.75vw - 420px); right: calc(43.75vw - 420px);
...@@ -306,16 +346,19 @@ a:hover { ...@@ -306,16 +346,19 @@ a:hover {
justify-content: center; justify-content: center;
height: 100%; height: 100%;
} }
.site-header-nav-item { .site-header-nav-item {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 100%; height: 100%;
} }
.site-header-nav-item+.site-header-nav-item {
.site-header-nav-item + .site-header-nav-item {
margin-left: 20px; margin-left: 20px;
} }
.site-header-nav-item>a {
.site-header-nav-item > a {
position: relative; position: relative;
display: flex; display: flex;
justify-content: center; justify-content: center;
...@@ -323,6 +366,7 @@ a:hover { ...@@ -323,6 +366,7 @@ a:hover {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.site-header-nav-item.twitter { .site-header-nav-item.twitter {
width: 25px; width: 25px;
} }
...@@ -362,21 +406,26 @@ a:hover { ...@@ -362,21 +406,26 @@ a:hover {
0% { 0% {
transform: scale(0); transform: scale(0);
} }
70% { 70% {
transform: scale(1.1); transform: scale(1.1);
} }
80% { 80% {
transform: scale(1); transform: scale(1);
} }
90% { 90% {
transform: scale(1.05); transform: scale(1.05);
} }
100% { 100% {
transform: scale(1); transform: scale(1);
} }
} }
.tv-fukidashi, .tv-fukidashi,
.tv-fukidashi2,
.tv-wchance, .tv-wchance,
.tv-koma1, .tv-koma1,
.tv-koma2, .tv-koma2,
...@@ -408,7 +457,7 @@ a:hover { ...@@ -408,7 +457,7 @@ a:hover {
color: #fff100; color: #fff100;
} }
.cp-period-txt1+.cp-period-txt2 { .cp-period-txt1 + .cp-period-txt2 {
margin-top: 10px; margin-top: 10px;
} }
...@@ -423,23 +472,28 @@ a:hover { ...@@ -423,23 +472,28 @@ a:hover {
.top-visual { .top-visual {
padding-top: 55px; padding-top: 55px;
} }
.cp-period { .cp-period {
align-items: center; align-items: center;
min-height: 25vw; min-height: 25vw;
padding: 4vw 0; padding: 4vw 0;
} }
.cp-period::before { .cp-period::before {
top: -5px; top: -5px;
height: 5px; height: 5px;
} }
.cp-period-txt1 { .cp-period-txt1 {
font-size: 4.75vw; font-size: 4.75vw;
font-size: max(15px, 4.75vw); font-size: max(15px, 4.75vw);
} }
.cp-period-txt2 { .cp-period-txt2 {
font-size: 2.25vw; font-size: 2.25vw;
font-size: max(11px, 2.25vw); font-size: max(11px, 2.25vw);
} }
.cp-period-txt2 span { .cp-period-txt2 span {
font-size: 3.7vw; font-size: 3.7vw;
font-size: max(11px, 3.7vw); font-size: max(11px, 3.7vw);
...@@ -451,13 +505,21 @@ a:hover { ...@@ -451,13 +505,21 @@ a:hover {
@media screen and (max-width:599px) { @media screen and (max-width:599px) {
.tv-logo { .tv-logo {
margin: 35px 0 30%; margin: 35px 0;
width: 92.1875%; width: 92.1875%;
} }
.tv-fukidashi { .tv-fukidashi {
top: 16px; top: 16px;
width: 94.81828%; width: 94.81828%;
} }
.tv-fukidashi2 {
top: 12px;
left: 3%;
width: 28%;
}
.tv-koma1 { .tv-koma1 {
bottom: 14%; bottom: 14%;
left: 5%; left: 5%;
...@@ -466,17 +528,21 @@ a:hover { ...@@ -466,17 +528,21 @@ a:hover {
box-shadow: 1px 3px 5px rgba(0, 0, 0, .2); box-shadow: 1px 3px 5px rgba(0, 0, 0, .2);
animation: koma1 2s infinite ease-in-out; animation: koma1 2s infinite ease-in-out;
} }
@keyframes koma1 { @keyframes koma1 {
0% { 0% {
bottom: 14.5%; bottom: 14.5%;
} }
50% { 50% {
bottom: 13.5%; bottom: 13.5%;
} }
100% { 100% {
bottom: 14.5%; bottom: 14.5%;
} }
} }
.tv-koma2 { .tv-koma2 {
bottom: -1.5%; bottom: -1.5%;
left: 9.5%; left: 9.5%;
...@@ -486,17 +552,21 @@ a:hover { ...@@ -486,17 +552,21 @@ a:hover {
z-index: 1; z-index: 1;
animation: koma2 2.1s infinite ease-in-out; animation: koma2 2.1s infinite ease-in-out;
} }
@keyframes koma2 { @keyframes koma2 {
0% { 0% {
bottom: -2%; bottom: -2%;
} }
50% { 50% {
bottom: -1%; bottom: -1%;
} }
100% { 100% {
bottom: -2%; bottom: -2%;
} }
} }
.tv-koma3 { .tv-koma3 {
bottom: 10%; bottom: 10%;
left: 38%; left: 38%;
...@@ -505,17 +575,21 @@ a:hover { ...@@ -505,17 +575,21 @@ a:hover {
box-shadow: -2px 3px 5px rgba(0, 0, 0, .2); box-shadow: -2px 3px 5px rgba(0, 0, 0, .2);
animation: koma3 2.5s infinite ease-in-out; animation: koma3 2.5s infinite ease-in-out;
} }
@keyframes koma3 { @keyframes koma3 {
0% { 0% {
bottom: 10.25%; bottom: 10.25%;
} }
50% { 50% {
bottom: 7.75%; bottom: 7.75%;
} }
100% { 100% {
bottom: 10.25%; bottom: 10.25%;
} }
} }
.tv-wchance { .tv-wchance {
bottom: 20px; bottom: 20px;
right: 4%; right: 4%;
...@@ -534,9 +608,11 @@ a:hover { ...@@ -534,9 +608,11 @@ a:hover {
max-width: 700px; max-width: 700px;
max-width: 1050px; max-width: 1050px;
} }
.tv-logo img { .tv-logo img {
width: 100%; width: 100%;
} }
.tv-fukidashi { .tv-fukidashi {
width: 90.625%; width: 90.625%;
max-width: 1160px; max-width: 1160px;
...@@ -545,12 +621,23 @@ a:hover { ...@@ -545,12 +621,23 @@ a:hover {
left: 50%; left: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.tv-fukidashi2 {
width: 25%;
max-width: 1160px;
max-width: 1740px;
top: 36%;
left: 14%;
transform: translate(-50%, -50%);
}
.tv-koma1, .tv-koma1,
.tv-koma2, .tv-koma2,
.tv-koma3 { .tv-koma3 {
width: 21.09375%; width: 21.09375%;
max-width: 405px; max-width: 405px;
} }
.tv-koma1 { .tv-koma1 {
top: 20px; top: 20px;
left: 0px; left: 0px;
...@@ -559,17 +646,21 @@ a:hover { ...@@ -559,17 +646,21 @@ a:hover {
transform-origin: left bottom; transform-origin: left bottom;
animation: koma1 2s infinite ease-in-out; animation: koma1 2s infinite ease-in-out;
} }
@keyframes koma1 { @keyframes koma1 {
0% { 0% {
top: 15px; top: 15px;
} }
50% { 50% {
top: 25px; top: 25px;
} }
100% { 100% {
top: 15px; top: 15px;
} }
} }
.tv-koma2 { .tv-koma2 {
top: 20px; top: 20px;
right: 4px; right: 4px;
...@@ -578,17 +669,21 @@ a:hover { ...@@ -578,17 +669,21 @@ a:hover {
transform-origin: right bottom; transform-origin: right bottom;
animation: koma2 2s infinite ease-in-out; animation: koma2 2s infinite ease-in-out;
} }
@keyframes koma2 { @keyframes koma2 {
0% { 0% {
top: 25px; top: 25px;
} }
50% { 50% {
top: 15px; top: 15px;
} }
100% { 100% {
top: 25px; top: 25px;
} }
} }
.tv-koma3 { .tv-koma3 {
bottom: -25px; bottom: -25px;
left: 22px; left: 22px;
...@@ -598,23 +693,28 @@ a:hover { ...@@ -598,23 +693,28 @@ a:hover {
z-index: 1; z-index: 1;
animation: koma3 2.3s infinite ease-in-out; animation: koma3 2.3s infinite ease-in-out;
} }
@keyframes koma3 { @keyframes koma3 {
0% { 0% {
bottom: -35px; bottom: -35px;
} }
50% { 50% {
bottom: -25px; bottom: -25px;
} }
100% { 100% {
bottom: -35px; bottom: -35px;
} }
} }
.tv-wchance { .tv-wchance {
width: 16.875%; width: 16.875%;
max-width: 324px; max-width: 324px;
bottom: 55px; bottom: 55px;
right: 4.5%; right: 4.5%;
} }
.cp-period::before { .cp-period::before {
top: -10px; top: -10px;
height: 10px; height: 10px;
...@@ -638,20 +738,25 @@ a:hover { ...@@ -638,20 +738,25 @@ a:hover {
.top-visual { .top-visual {
padding-top: 80px; padding-top: 80px;
} }
.tv-box { .tv-box {
margin-top: -10px; margin-top: -10px;
} }
.cp-period { .cp-period {
align-items: center; align-items: center;
padding-top: 8px; padding-top: 8px;
height: 260px; height: 260px;
} }
.cp-period-txt1 { .cp-period-txt1 {
font-size: 48px; font-size: 48px;
} }
.cp-period-txt2 { .cp-period-txt2 {
font-size: 28px; font-size: 28px;
} }
.cp-period-txt2 span { .cp-period-txt2 span {
font-size: 37px; font-size: 37px;
} }
...@@ -661,12 +766,15 @@ a:hover { ...@@ -661,12 +766,15 @@ a:hover {
.tv-koma1 { .tv-koma1 {
left: calc(50% - 960px); left: calc(50% - 960px);
} }
.tv-koma2 { .tv-koma2 {
right: calc(50% - 956px); right: calc(50% - 956px);
} }
.tv-koma3 { .tv-koma3 {
left: calc(50% - 938px); left: calc(50% - 938px);
} }
.tv-wchance { .tv-wchance {
right: calc(50% - 873px); right: calc(50% - 873px);
} }
...@@ -684,7 +792,7 @@ a:hover { ...@@ -684,7 +792,7 @@ a:hover {
text-align: center; text-align: center;
} }
.winner-item>dl>dt { .winner-item > dl > dt {
line-break: anywhere; line-break: anywhere;
background: center bottom / contain no-repeat url(../img/winner/winner-line.svg); background: center bottom / contain no-repeat url(../img/winner/winner-line.svg);
} }
...@@ -723,28 +831,34 @@ a:hover { ...@@ -723,28 +831,34 @@ a:hover {
padding: 40px 20px 80px; padding: 40px 20px 80px;
font-size: 15px; font-size: 15px;
} }
.winner-list { .winner-list {
margin: 40px auto 0; margin: 40px auto 0;
width: 270px; width: 270px;
} }
.winner-item>dl>dt {
.winner-item > dl > dt {
padding: 0 20px 50px; padding: 0 20px 50px;
font-size: 17px; font-size: 17px;
/* min-height: 188px; */ /* min-height: 188px; */
line-height: 1.6; line-height: 1.6;
} }
.winner-name { .winner-name {
margin-top: 12px; margin-top: 12px;
font-size: 26px; font-size: 26px;
line-height: 1.16667; line-height: 1.16667;
} }
.winner-name small { .winner-name small {
font-size: 17px; font-size: 17px;
} }
.winner-item .episode-button { .winner-item .episode-button {
padding-left: 69px; padding-left: 69px;
font-size: 16px; font-size: 16px;
} }
.winner-item .episode-button::before { .winner-item .episode-button::before {
top: 6px; top: 6px;
left: 10px; left: 10px;
...@@ -761,31 +875,36 @@ a:hover { ...@@ -761,31 +875,36 @@ a:hover {
.winner { .winner {
padding: 90px 0 150px; padding: 90px 0 150px;
} }
.winner-text { .winner-text {
margin: 0 auto; margin: 0 auto;
padding: 0 20px; padding: 0 20px;
width: 100%; width: 100%;
max-width: 790px; max-width: 790px;
} }
.winner-list { .winner-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: flex-start; justify-content: center;
margin: 100px auto 0; margin: 100px auto 0;
padding: 0 20px; padding: 0 20px;
width: 100%; width: 100%;
max-width: 1180px; max-width: 1180px;
} }
.winner-item { .winner-item {
width: 290px; width: 290px;
margin-bottom: 40px; margin-bottom: 40px;
margin-right: 7%; margin-right: 7%;
} }
.winner-item>dl>dt {
.winner-item > dl > dt {
padding: 0 40px; padding: 0 40px;
font-size: 21px; font-size: 21px;
min-height: 211px; min-height: 211px;
} }
.winner-name { .winner-name {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -798,12 +917,15 @@ a:hover { ...@@ -798,12 +917,15 @@ a:hover {
line-height: 1.16667; line-height: 1.16667;
height: 95px; height: 95px;
} }
.winner-name small { .winner-name small {
font-size: 21px; font-size: 21px;
} }
.winner-item .episode-button { .winner-item .episode-button {
padding-left: 81px; padding-left: 81px;
} }
.winner-item .episode-button::before { .winner-item .episode-button::before {
top: 6px; top: 6px;
left: 12px; left: 12px;
...@@ -819,9 +941,11 @@ a:hover { ...@@ -819,9 +941,11 @@ a:hover {
.winner-list { .winner-list {
max-width: 800px; max-width: 800px;
} }
.winner-item:nth-child(odd) { .winner-item:nth-child(odd) {
margin-right: 15px; margin-right: 15px;
} }
.winner-item:nth-child(even) { .winner-item:nth-child(even) {
margin-left: 15px; margin-left: 15px;
} }
...@@ -902,6 +1026,7 @@ a:hover { ...@@ -902,6 +1026,7 @@ a:hover {
} }
@media screen and (max-width: 599px) { @media screen and (max-width: 599px) {
.section-wave::before, .section-wave::before,
.section-wave::after { .section-wave::after {
background-size: 50vw 20px; background-size: 50vw 20px;
...@@ -916,10 +1041,12 @@ a:hover { ...@@ -916,10 +1041,12 @@ a:hover {
@media print, @media print,
(min-width: 600px) { (min-width: 600px) {
.section-wave::before, .section-wave::before,
.section-wave::after { .section-wave::after {
background-size: 640px 20px; background-size: 640px 20px;
} }
.section-header-ttl { .section-header-ttl {
font-size: 44px; font-size: 44px;
} }
...@@ -1016,29 +1143,35 @@ a:hover { ...@@ -1016,29 +1143,35 @@ a:hover {
#intro { #intro {
padding: 35px 0; padding: 35px 0;
} }
.mangaka-list { .mangaka-list {
flex-direction: column; flex-direction: column;
margin: 40px auto 0; margin: 40px auto 0;
width: 270px; width: 270px;
} }
.mangaka-image { .mangaka-image {
margin: 0 auto; margin: 0 auto;
width: 188px; width: 188px;
height: 188px; height: 188px;
border-width: 3px; border-width: 3px;
} }
.mangaka { .mangaka {
margin-top: 30px; margin-top: 30px;
padding: 20px 0; padding: 20px 0;
} }
.mangaka .detail { .mangaka .detail {
padding: 0 17px; padding: 0 17px;
font-size: 15px; font-size: 15px;
} }
.episode-manga { .episode-manga {
position: relative; position: relative;
margin-top: 18px; margin-top: 18px;
} }
.episode-manga::before { .episode-manga::before {
content: ''; content: '';
position: absolute; position: absolute;
...@@ -1048,6 +1181,7 @@ a:hover { ...@@ -1048,6 +1181,7 @@ a:hover {
width: 100%; width: 100%;
height: 110px; height: 110px;
} }
.episode-button { .episode-button {
padding-top: 8px; padding-top: 8px;
height: 64px; height: 64px;
...@@ -1065,6 +1199,7 @@ a:hover { ...@@ -1065,6 +1199,7 @@ a:hover {
#intro { #intro {
padding: 80px 0 120px; padding: 80px 0 120px;
} }
.mangaka-list { .mangaka-list {
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
...@@ -1074,21 +1209,25 @@ a:hover { ...@@ -1074,21 +1209,25 @@ a:hover {
width: 100%; width: 100%;
max-width: 1104px; max-width: 1104px;
} }
.mangaka-list::after { .mangaka-list::after {
content: ''; content: '';
display: block; display: block;
width: 0; width: 0;
height: 0; height: 0;
} }
.mangaka-item { .mangaka-item {
margin: 50px 32px 0; margin: 50px 32px 0;
width: 290px; width: 290px;
} }
.mangaka-image { .mangaka-image {
border-width: 6px; border-width: 6px;
width: 272px; width: 272px;
height: 272px; height: 272px;
} }
.mangaka { .mangaka {
margin-top: 50px; margin-top: 50px;
padding-top: 25px; padding-top: 25px;
...@@ -1096,31 +1235,38 @@ a:hover { ...@@ -1096,31 +1235,38 @@ a:hover {
border-width: 4px; border-width: 4px;
line-height: 30px; line-height: 30px;
} }
.mangaka::after { .mangaka::after {
left: calc(50% - 14.5px); left: calc(50% - 14.5px);
width: 29px; width: 29px;
} }
.mangaka dt { .mangaka dt {
font-size: 30px; font-size: 30px;
} }
.mangaka-narrow { .mangaka-narrow {
display: inline-block; display: inline-block;
font-size: 27px; font-size: 27px;
transform: scale(1, 1.1); transform: scale(1, 1.1);
transform-origin: bottom; transform-origin: bottom;
} }
.mangaka .type { .mangaka .type {
text-align: center; text-align: center;
} }
.mangaka .detail { .mangaka .detail {
margin-top: 1em; margin-top: 1em;
padding: 0 15px 0 19px; padding: 0 15px 0 19px;
font-size: 16px; font-size: 16px;
} }
.episode-manga { .episode-manga {
margin-top: 32px; margin-top: 32px;
min-height: 290px; min-height: 290px;
} }
.episode-button { .episode-button {
padding-top: 12px; padding-top: 12px;
height: 74px; height: 74px;
...@@ -1128,11 +1274,13 @@ a:hover { ...@@ -1128,11 +1274,13 @@ a:hover {
line-height: 1.6; line-height: 1.6;
transform: translateY(-37px); transform: translateY(-37px);
} }
.episode-button::after { .episode-button::after {
right: 20px; right: 20px;
width: 14px; width: 14px;
height: 14px; height: 14px;
} }
#intro .section-inner::before, #intro .section-inner::before,
#intro .section-inner::after, #intro .section-inner::after,
#terms .section-inner::before, #terms .section-inner::before,
...@@ -1148,10 +1296,12 @@ a:hover { ...@@ -1148,10 +1296,12 @@ a:hover {
opacity: .4; opacity: .4;
z-index: 1; z-index: 1;
} }
#intro .section-inner::before { #intro .section-inner::before {
top: -240px; top: -240px;
right: 30px; right: 30px;
} }
#intro .section-inner::after { #intro .section-inner::after {
bottom: -245px; bottom: -245px;
left: 30px; left: 30px;
...@@ -1164,6 +1314,7 @@ a:hover { ...@@ -1164,6 +1314,7 @@ a:hover {
/*** intro - tab ***/ /*** intro - tab ***/
@media screen and (min-width: 600px) and (max-width: 979px) { @media screen and (min-width: 600px) and (max-width: 979px) {
#intro .section-inner::before, #intro .section-inner::before,
#terms .section-inner::before, #terms .section-inner::before,
#footstep .section-inner::after, #footstep .section-inner::after,
...@@ -1171,9 +1322,10 @@ a:hover { ...@@ -1171,9 +1322,10 @@ a:hover {
transform: scale(.75); transform: scale(.75);
transform-origin: center right; transform-origin: center right;
} }
#intro .section-inner::after, #intro .section-inner::after,
#terms .section-inner::after { #terms .section-inner::after {
transform: scale(-.75, .75)!important; transform: scale(-.75, .75) !important;
transform-origin: top center; transform-origin: top center;
} }
} }
...@@ -1186,9 +1338,11 @@ a:hover { ...@@ -1186,9 +1338,11 @@ a:hover {
#intro .section-header-ttl { #intro .section-header-ttl {
font-size: 48px; font-size: 48px;
} }
.mangaka-item.drops::after { .mangaka-item.drops::after {
content: ''; content: '';
display: none;/* 20230201 */ display: none;
/* 20230201 */
margin: 115px auto 0; margin: 115px auto 0;
width: 220px; width: 220px;
height: 257px; height: 257px;
...@@ -1246,6 +1400,7 @@ a:hover { ...@@ -1246,6 +1400,7 @@ a:hover {
.prize { .prize {
padding-top: 60px; padding-top: 60px;
} }
.prize-6, .prize-6,
.prize-w { .prize-w {
display: block; display: block;
...@@ -1253,33 +1408,41 @@ a:hover { ...@@ -1253,33 +1408,41 @@ a:hover {
width: 101px; width: 101px;
height: 106px; height: 106px;
} }
.prize-6::after, .prize-6::after,
.prize-w::after { .prize-w::after {
left: 3px; left: 3px;
} }
.ttl-prize { .ttl-prize {
padding: 0; padding: 0;
} }
.prize-text { .prize-text {
margin: 20px 0; margin: 20px 0;
} }
.prize-6-box img, .prize-6-box img,
.prize-card { .prize-card {
display: block; display: block;
margin: 0 auto; margin: 0 auto;
} }
.prize-manga { .prize-manga {
width: 170px; width: 170px;
} }
.prize-plus { .prize-plus {
margin: 6px auto 8px; margin: 6px auto 8px;
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
.prize-amazon, .prize-amazon,
.prize-card { .prize-card {
width: 200px; width: 200px;
} }
.prize-notice { .prize-notice {
margin-top: 50px; margin-top: 50px;
margin-left: 10px; margin-left: 10px;
...@@ -1288,6 +1451,7 @@ a:hover { ...@@ -1288,6 +1451,7 @@ a:hover {
font-feature-settings: "palt"; font-feature-settings: "palt";
line-height: 1.6; line-height: 1.6;
} }
.prize-notice li:first-child { .prize-notice li:first-child {
line-break: anywhere; line-break: anywhere;
} }
...@@ -1301,11 +1465,13 @@ a:hover { ...@@ -1301,11 +1465,13 @@ a:hover {
.prize { .prize {
padding-top: 120px; padding-top: 120px;
} }
.header-prize { .header-prize {
position: relative; position: relative;
margin: 0 auto; margin: 0 auto;
max-width: 1280px; max-width: 1280px;
} }
.header-prize::before, .header-prize::before,
.header-prize::after { .header-prize::after {
content: ''; content: '';
...@@ -1316,35 +1482,43 @@ a:hover { ...@@ -1316,35 +1482,43 @@ a:hover {
height: 192px; height: 192px;
background: center / contain no-repeat url(../img/prize-line-pc.svg); background: center / contain no-repeat url(../img/prize-line-pc.svg);
} }
.header-prize::before { .header-prize::before {
left: 90px; left: 90px;
} }
.header-prize::after { .header-prize::after {
right: 90px; right: 90px;
transform: scale(-1, 1); transform: scale(-1, 1);
} }
.ttl-prize { .ttl-prize {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: center; justify-content: center;
align-items: flex-end; align-items: flex-end;
} }
.ttl-prize span+span {
.ttl-prize span + span {
margin-left: 10px; margin-left: 10px;
} }
.ttl-prize img { .ttl-prize img {
display: block; display: block;
width: 165px; width: 165px;
height: 159px; height: 159px;
} }
.prize-6 { .prize-6 {
transform: translateY(-30px); transform: translateY(-30px);
} }
.prize-text { .prize-text {
margin: 60px auto 0; margin: 60px auto 0;
max-width: 790px; max-width: 790px;
font-feature-settings: "palt"; font-feature-settings: "palt";
} }
.prize-6-box { .prize-6-box {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
...@@ -1356,21 +1530,25 @@ a:hover { ...@@ -1356,21 +1530,25 @@ a:hover {
height: 33.42857vw; height: 33.42857vw;
max-height: 266px; max-height: 266px;
} }
.prize-plus { .prize-plus {
width: 73px; width: 73px;
height: 73px; height: 73px;
transform: translateX(-8px); transform: translateX(-8px);
} }
.prize-plus::before, .prize-plus::before,
.prize-plus::after { .prize-plus::after {
width: 5px; width: 5px;
border-radius: 2.5px; border-radius: 2.5px;
} }
.prize-card { .prize-card {
min-height: 195px; min-height: 195px;
margin-top: 40px; margin-top: 40px;
text-align: center; text-align: center;
} }
.prize-notice { .prize-notice {
margin: 40px auto 0 46.5%; margin: 40px auto 0 46.5%;
font-size: 13px; font-size: 13px;
...@@ -1384,35 +1562,44 @@ a:hover { ...@@ -1384,35 +1562,44 @@ a:hover {
.prize { .prize {
overflow: hidden; overflow: hidden;
} }
.header-prize::before { .header-prize::before {
bottom: -40px; bottom: -40px;
left: -50px; left: -50px;
} }
.header-prize::after { .header-prize::after {
bottom: -40px; bottom: -40px;
right: -50px; right: -50px;
} }
.ttl-prize { .ttl-prize {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.ttl-prize span+span {
.ttl-prize span + span {
margin-left: 0; margin-left: 0;
} }
.prize-6::after, .prize-6::after,
.prize-w::after { .prize-w::after {
left: 6px; left: 6px;
} }
.prize-manga { .prize-manga {
width: 39.73%; width: 39.73%;
} }
.prize-plus { .prize-plus {
width: 7.449vw; width: 7.449vw;
height: 7.449vw; height: 7.449vw;
} }
.prize-amazon { .prize-amazon {
width: 41.3333%; width: 41.3333%;
} }
.prize-notice { .prize-notice {
margin-left: calc(100% - 610px); margin-left: calc(100% - 610px);
margin-left: max(calc(100% - 610px), 4px); margin-left: max(calc(100% - 610px), 4px);
...@@ -1435,7 +1622,7 @@ a:hover { ...@@ -1435,7 +1622,7 @@ a:hover {
/*** flow ***/ /*** flow ***/
.flow-leading+.flow-leading { .flow-leading + .flow-leading {
margin-top: 0; margin-top: 0;
} }
...@@ -1459,14 +1646,14 @@ a:hover { ...@@ -1459,14 +1646,14 @@ a:hover {
text-align: center; text-align: center;
} }
.step>dt { .step > dt {
margin: 0 auto; margin: 0 auto;
background: center / contain no-repeat url(../img/step-drop.svg); background: center / contain no-repeat url(../img/step-drop.svg);
color: #fff; color: #fff;
text-align: center; text-align: center;
} }
.step-finish>dl>dt { .step-finish > dl > dt {
background-image: url(../img/step-drop-fin.svg); background-image: url(../img/step-drop-fin.svg);
} }
...@@ -1510,7 +1697,7 @@ a:hover { ...@@ -1510,7 +1697,7 @@ a:hover {
text-decoration: underline; text-decoration: underline;
} }
.step-finish>dl { .step-finish > dl {
border-color: #0050AA; border-color: #0050AA;
} }
...@@ -1547,22 +1734,27 @@ a:hover { ...@@ -1547,22 +1734,27 @@ a:hover {
#flow { #flow {
margin-top: 40px; margin-top: 40px;
} }
.flow-leading { .flow-leading {
margin-top: 20px; margin-top: 20px;
padding: 0 20px; padding: 0 20px;
font-size: 15px; font-size: 15px;
} }
#flow .main-section+.main-section {
#flow .main-section + .main-section {
margin-top: 60px; margin-top: 60px;
} }
.step-item { .step-item {
margin-top: 80px; margin-top: 80px;
max-width: 350px; max-width: 350px;
} }
.step-item+.step-item {
.step-item + .step-item {
margin-top: 70px; margin-top: 70px;
} }
.step>dt {
.step > dt {
margin-top: -50px; margin-top: -50px;
padding-top: 28px; padding-top: 28px;
width: 62px; width: 62px;
...@@ -1571,23 +1763,28 @@ a:hover { ...@@ -1571,23 +1763,28 @@ a:hover {
font-weight: normal; font-weight: normal;
line-height: 1; line-height: 1;
} }
.step>dt small {
.step > dt small {
display: block; display: block;
font-size: 13px; font-size: 13px;
} }
.step>dd {
.step > dd {
margin-top: 10px; margin-top: 10px;
font-size: 17px; font-size: 17px;
line-height: 1.5; line-height: 1.5;
} }
.txt-hash { .txt-hash {
font-size: 22px; font-size: 22px;
} }
.step .sp95 { .step .sp95 {
display: inline-block; display: inline-block;
transform: scale(.95, 1); transform: scale(.95, 1);
transform-origin: bottom center; transform-origin: bottom center;
} }
.step-button { .step-button {
display: flex; display: flex;
align-items: center; align-items: center;
...@@ -1601,39 +1798,48 @@ a:hover { ...@@ -1601,39 +1798,48 @@ a:hover {
font-size: 15px; font-size: 15px;
line-height: 1.4; line-height: 1.4;
} }
.step-button::after { .step-button::after {
margin-left: -3px; margin-left: -3px;
} }
.step-button>img {
.step-button > img {
display: inline-block; display: inline-block;
width: 24px; width: 24px;
} }
.step-notice { .step-notice {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
margin: 5px auto; margin: 5px auto;
font-size: 12px; font-size: 12px;
} }
.step-finish .step { .step-finish .step {
padding-bottom: 20px; padding-bottom: 20px;
} }
.step-finish>dl>dt {
.step-finish > dl > dt {
padding-top: 25px; padding-top: 25px;
width: 78px; width: 78px;
height: 102px; height: 102px;
font-size: 25px; font-size: 25px;
line-height: 1.3; line-height: 1.3;
} }
.step-finish>dl>dt small {
.step-finish > dl > dt small {
font-size: 20px; font-size: 20px;
} }
.step-prize { .step-prize {
margin: 0 auto; margin: 0 auto;
padding: 0 20px; padding: 0 20px;
} }
.step-prize+.step-prize {
.step-prize + .step-prize {
margin-top: 40px; margin-top: 40px;
} }
.step-prize-name { .step-prize-name {
margin: 0 auto; margin: 0 auto;
padding-top: 45px; padding-top: 45px;
...@@ -1643,9 +1849,11 @@ a:hover { ...@@ -1643,9 +1849,11 @@ a:hover {
color: #000; color: #000;
line-height: 1.3; line-height: 1.3;
} }
.step-prize-name small { .step-prize-name small {
font-size: 16px; font-size: 16px;
} }
.step-prize-item { .step-prize-item {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -1653,20 +1861,24 @@ a:hover { ...@@ -1653,20 +1861,24 @@ a:hover {
margin-top: 10px; margin-top: 10px;
width: 100%; width: 100%;
} }
.step-prize-manga { .step-prize-manga {
display: inline-block; display: inline-block;
margin-top: 10px; margin-top: 10px;
width: 145px; width: 145px;
} }
.step-plus { .step-plus {
margin: 10px auto; margin: 10px auto;
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
.step-plus::before, .step-plus::before,
.step-plus::after { .step-plus::after {
width: 3px; width: 3px;
} }
.step-prize-right-amazon { .step-prize-right-amazon {
width: 160px; width: 160px;
margin-top: 10px; margin-top: 10px;
...@@ -1681,21 +1893,25 @@ a:hover { ...@@ -1681,21 +1893,25 @@ a:hover {
#flow { #flow {
margin-top: 80px; margin-top: 80px;
} }
#flow .main-section+.main-section {
#flow .main-section + .main-section {
margin-top: 80px; margin-top: 80px;
} }
.flow-leading { .flow-leading {
margin: 40px auto 0; margin: 40px auto 0;
padding: 0 20px; padding: 0 20px;
width: 100%; width: 100%;
max-width: 790px; max-width: 790px;
} }
.step { .step {
margin-top: 120px; margin-top: 120px;
padding: 0 20px; padding: 0 20px;
border-radius: 40px; border-radius: 40px;
} }
.step>dt {
.step > dt {
margin-top: -75px; margin-top: -75px;
padding-top: 38px; padding-top: 38px;
width: 95px; width: 95px;
...@@ -1703,17 +1919,21 @@ a:hover { ...@@ -1703,17 +1919,21 @@ a:hover {
font-size: 55px; font-size: 55px;
line-height: 1; line-height: 1;
} }
.step>dt small {
.step > dt small {
display: block; display: block;
font-size: 19px; font-size: 19px;
} }
.step>dd {
.step > dd {
margin-top: 20px; margin-top: 20px;
font-size: 24px; font-size: 24px;
} }
.txt-hash { .txt-hash {
font-size: 30px; font-size: 30px;
} }
.step-button { .step-button {
margin: 20px auto 40px; margin: 20px auto 40px;
padding-top: 11px; padding-top: 11px;
...@@ -1723,10 +1943,12 @@ a:hover { ...@@ -1723,10 +1943,12 @@ a:hover {
box-shadow: 0 5px 10px rgba(0, 0, 0, .2); box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
font-size: 22px; font-size: 22px;
} }
.step-button>img {
.step-button > img {
display: inline-block; display: inline-block;
width: 34px; width: 34px;
} }
.step-notice { .step-notice {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
...@@ -1734,33 +1956,40 @@ a:hover { ...@@ -1734,33 +1956,40 @@ a:hover {
width: 100%; width: 100%;
font-size: 13px; font-size: 13px;
} }
.step-finish { .step-finish {
padding: 0 10px; padding: 0 10px;
width: 100%; width: 100%;
max-width: 1020px; max-width: 1020px;
} }
.step-finish .step { .step-finish .step {
padding-bottom: 40px; padding-bottom: 40px;
} }
.step-finish>dl>dt {
.step-finish > dl > dt {
padding-top: 52px; padding-top: 52px;
width: 125px; width: 125px;
height: 173px; height: 173px;
font-size: 40px; font-size: 40px;
line-height: 1.3; line-height: 1.3;
} }
.step-finish>dl>dt small {
.step-finish > dl > dt small {
font-size: 32px; font-size: 32px;
} }
.step-prize { .step-prize {
display: flex; display: flex;
margin: 0 auto; margin: 0 auto;
width: 100%; width: 100%;
max-width: 855px; max-width: 855px;
} }
.step-prize+.step-prize {
.step-prize + .step-prize {
margin-top: 60px; margin-top: 60px;
} }
.step-prize-name { .step-prize-name {
flex-shrink: 0; flex-shrink: 0;
padding-top: 70px; padding-top: 70px;
...@@ -1770,42 +1999,51 @@ a:hover { ...@@ -1770,42 +1999,51 @@ a:hover {
color: #000; color: #000;
line-height: 1.3; line-height: 1.3;
} }
.step-prize-name small { .step-prize-name small {
font-size: 24px; font-size: 24px;
} }
.step-prize-item { .step-prize-item {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
width: 100%; width: 100%;
} }
.step-prize-left { .step-prize-left {
width: 57.9856%; width: 57.9856%;
max-width: 410px; max-width: 410px;
} }
.step-prize-manga { .step-prize-manga {
display: inline-block; display: inline-block;
margin-top: 10px; margin-top: 10px;
width: 220px; width: 220px;
height: 196px; height: 196px;
} }
.step-plus { .step-plus {
flex-shrink: 0; flex-shrink: 0;
margin: 20px 10px 0; margin: 20px 10px 0;
width: 40px; width: 40px;
height: 40px; height: 40px;
} }
.step-plus::before, .step-plus::before,
.step-plus::after { .step-plus::after {
width: 5px; width: 5px;
border-radius: 2.5px; border-radius: 2.5px;
} }
.step-prize-right { .step-prize-right {
width: 30.2158%; width: 30.2158%;
max-width: 210px; max-width: 210px;
} }
.step-prize-6 .step-prize-right-amazon { .step-prize-6 .step-prize-right-amazon {
margin-top: 40px; margin-top: 40px;
} }
.step-prize-w .step-prize-item { .step-prize-w .step-prize-item {
align-items: center; align-items: center;
} }
...@@ -1818,10 +2056,12 @@ a:hover { ...@@ -1818,10 +2056,12 @@ a:hover {
.step-finish { .step-finish {
max-width: 790px; max-width: 790px;
} }
.step-prize { .step-prize {
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.step-prize-item { .step-prize-item {
max-width: 696px; max-width: 696px;
} }
...@@ -1866,7 +2106,7 @@ a:hover { ...@@ -1866,7 +2106,7 @@ a:hover {
text-align: center; text-align: center;
} }
.term-lead+.term-lead { .term-lead + .term-lead {
margin-top: 0; margin-top: 0;
} }
...@@ -1916,9 +2156,9 @@ ol.term-notice li { ...@@ -1916,9 +2156,9 @@ ol.term-notice li {
list-style-type: disc; list-style-type: disc;
} }
.term-prohibition li+li, .term-prohibition li + li,
.term-notes li+li, .term-notes li + li,
.term-copyright li+li { .term-copyright li + li {
margin-top: .2em; margin-top: .2em;
} }
...@@ -1936,9 +2176,11 @@ ol.term-notice li { ...@@ -1936,9 +2176,11 @@ ol.term-notice li {
padding-top: 40px; padding-top: 40px;
padding-bottom: 70px; padding-bottom: 70px;
} }
.term-lead { .term-lead {
font-size: 15px; font-size: 15px;
} }
.term-list { .term-list {
margin: 30px auto 0; margin: 30px auto 0;
padding: 25px 20px 30px; padding: 25px 20px 30px;
...@@ -1946,23 +2188,29 @@ ol.term-notice li { ...@@ -1946,23 +2188,29 @@ ol.term-notice li {
max-height: 560px; max-height: 560px;
border-radius: 15px; border-radius: 15px;
} }
.term-ttl { .term-ttl {
margin-bottom: 5px; margin-bottom: 5px;
font-size: 17px; font-size: 17px;
} }
.term-detail { .term-detail {
font-size: 15px; font-size: 15px;
line-height: 1.6667; line-height: 1.6667;
} }
.term-notice { .term-notice {
font-size: 14px; font-size: 14px;
} }
.term-detail+.term-ttl {
.term-detail + .term-ttl {
margin-top: 20px; margin-top: 20px;
} }
#terms .section-content::before { #terms .section-content::before {
top: 3px; top: 3px;
} }
#terms .section-content::after { #terms .section-content::after {
bottom: 3px; bottom: 3px;
} }
...@@ -1978,6 +2226,7 @@ ol.term-notice li { ...@@ -1978,6 +2226,7 @@ ol.term-notice li {
padding-top: 100px; padding-top: 100px;
padding-bottom: 120px; padding-bottom: 120px;
} }
.term-list { .term-list {
margin: 50px auto 0; margin: 50px auto 0;
padding: 40px; padding: 40px;
...@@ -1987,36 +2236,44 @@ ol.term-notice li { ...@@ -1987,36 +2236,44 @@ ol.term-notice li {
border-radius: 19px; border-radius: 19px;
line-height: 1.875; line-height: 1.875;
} }
.term-ttl { .term-ttl {
margin-bottom: 6px; margin-bottom: 6px;
padding-bottom: 6px; padding-bottom: 6px;
font-size: 20px; font-size: 20px;
} }
.term-notice { .term-notice {
font-size: 14px; font-size: 14px;
} }
.term-detail+.term-ttl {
.term-detail + .term-ttl {
margin-top: 16px; margin-top: 16px;
} }
#terms .section-inner::before { #terms .section-inner::before {
top: -200px; top: -200px;
right: 30px; right: 30px;
} }
#terms .section-inner::after { #terms .section-inner::after {
bottom: -245px; bottom: -245px;
left: 30px; left: 30px;
transform: scale(-1, 1); transform: scale(-1, 1);
z-index: 1; z-index: 1;
} }
#terms .section-content::before, #terms .section-content::before,
#terms .section-content::after { #terms .section-content::after {
left: calc(50% - 400px); left: calc(50% - 400px);
width: calc(100% - 120px); width: calc(100% - 120px);
max-width: 800px; max-width: 800px;
} }
#terms .section-content::before { #terms .section-content::before {
top: 4px; top: 4px;
} }
#terms .section-content::after { #terms .section-content::after {
bottom: 4px; bottom: 4px;
} }
...@@ -2029,6 +2286,7 @@ ol.term-notice li { ...@@ -2029,6 +2286,7 @@ ol.term-notice li {
.term-list { .term-list {
max-height: 70vh; max-height: 70vh;
} }
#terms .section-content::before, #terms .section-content::before,
#terms .section-content::after { #terms .section-content::after {
left: 60px; left: 60px;
...@@ -2053,15 +2311,18 @@ ol.term-notice li { ...@@ -2053,15 +2311,18 @@ ol.term-notice li {
/*** history - sp ***/ /*** history - sp ***/
@media only screen and (max-width: 599px) { @media only screen and (max-width: 599px) {
#history, #history,
#toilet-culture { #toilet-culture {
margin-top: 60px; margin-top: 60px;
} }
.history-text { .history-text {
padding: 0 20px; padding: 0 20px;
font-size: 15px; font-size: 15px;
line-height: 1.6667; line-height: 1.6667;
} }
.sp-read-more { .sp-read-more {
position: relative; position: relative;
box-sizing: content-box; box-sizing: content-box;
...@@ -2073,11 +2334,13 @@ ol.term-notice li { ...@@ -2073,11 +2334,13 @@ ol.term-notice li {
background-clip: text; background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} }
.sp-read-more.open { .sp-read-more.open {
background: none; background: none;
-webkit-text-fill-color: inherit; -webkit-text-fill-color: inherit;
padding-bottom: 30px; padding-bottom: 30px;
} }
.sp-read-more::after { .sp-read-more::after {
content: ''; content: '';
position: absolute; position: absolute;
...@@ -2088,12 +2351,14 @@ ol.term-notice li { ...@@ -2088,12 +2351,14 @@ ol.term-notice li {
transition-delay: .3s; transition-delay: .3s;
transition-property: opacity; transition-property: opacity;
} }
.sp-read-more.open::after { .sp-read-more.open::after {
width: 100%; width: 100%;
height: 30px; height: 30px;
background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%); background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 100%);
opacity: 0; opacity: 0;
} }
.btn-read-more { .btn-read-more {
position: relative; position: relative;
display: flex; display: flex;
...@@ -2113,6 +2378,7 @@ ol.term-notice li { ...@@ -2113,6 +2378,7 @@ ol.term-notice li {
transition: .15s; transition: .15s;
transition-delay: visibility .15s; transition-delay: visibility .15s;
} }
.btn-read-more.open { .btn-read-more.open {
opacity: 0; opacity: 0;
visibility: hidden; visibility: hidden;
...@@ -2124,20 +2390,24 @@ ol.term-notice li { ...@@ -2124,20 +2390,24 @@ ol.term-notice li {
@media print, @media print,
(min-width: 600px) { (min-width: 600px) {
#history, #history,
#toilet-culture { #toilet-culture {
margin-top: 100px; margin-top: 100px;
} }
#history .section-header-ttl, #history .section-header-ttl,
#toilet-culture .section-header-ttl { #toilet-culture .section-header-ttl {
font-size: 36px; font-size: 36px;
} }
#history .section-content, #history .section-content,
#toilet-culture .section-content { #toilet-culture .section-content {
margin: 40px auto 0; margin: 40px auto 0;
width: calc(100% - 40px); width: calc(100% - 40px);
max-width: 750px; max-width: 750px;
} }
.shower-image { .shower-image {
display: block; display: block;
float: right; float: right;
...@@ -2147,6 +2417,7 @@ ol.term-notice li { ...@@ -2147,6 +2417,7 @@ ol.term-notice li {
height: 230px; height: 230px;
border-radius: 11px; border-radius: 11px;
} }
.history-text { .history-text {
line-height: 2.375; line-height: 2.375;
} }
...@@ -2184,6 +2455,7 @@ ol.term-notice li { ...@@ -2184,6 +2455,7 @@ ol.term-notice li {
margin-top: 80px; margin-top: 80px;
padding: 30px 0; padding: 30px 0;
} }
#footstep .section-content img { #footstep .section-content img {
margin-top: 10px; margin-top: 10px;
width: calc(100% - 40px); width: calc(100% - 40px);
...@@ -2200,12 +2472,15 @@ ol.term-notice li { ...@@ -2200,12 +2472,15 @@ ol.term-notice li {
margin-top: 120px; margin-top: 120px;
padding: 100px 15px 120px 20px; padding: 100px 15px 120px 20px;
} }
#footstep .section-header-ttl { #footstep .section-header-ttl {
font-size: 36px; font-size: 36px;
} }
#footstep .section-content img { #footstep .section-content img {
margin-top: 45px; margin-top: 45px;
} }
#footstep .section-inner::after { #footstep .section-inner::after {
bottom: -140px; bottom: -140px;
right: 5px; right: 5px;
...@@ -2220,6 +2495,7 @@ ol.term-notice li { ...@@ -2220,6 +2495,7 @@ ol.term-notice li {
padding-top: 7.8125vw; padding-top: 7.8125vw;
padding-bottom: 9.375vw; padding-bottom: 9.375vw;
} }
#footstep .section-content img { #footstep .section-content img {
margin-top: 3.515625vw; margin-top: 3.515625vw;
} }
...@@ -2257,16 +2533,16 @@ ol.term-notice li { ...@@ -2257,16 +2533,16 @@ ol.term-notice li {
color: #888; color: #888;
} }
.survey-notice>dt { .survey-notice > dt {
display: block; display: block;
float: left; float: left;
} }
.survey-notice>dt::after { .survey-notice > dt::after {
content: ': '; content: ': ';
} }
.survey-notice>dd::after { .survey-notice > dd::after {
content: ''; content: '';
display: block; display: block;
clear: both; clear: both;
...@@ -2284,21 +2560,25 @@ ol.term-notice li { ...@@ -2284,21 +2560,25 @@ ol.term-notice li {
#survey { #survey {
margin-top: 80px; margin-top: 80px;
} }
#survey .section-content { #survey .section-content {
margin-top: 30px; margin-top: 30px;
} }
.survey-lead { .survey-lead {
margin: 0 auto; margin: 0 auto;
padding: 0 25px; padding: 0 25px;
max-width: 400px; max-width: 400px;
font-size: 15px; font-size: 15px;
} }
.survey-item { .survey-item {
margin: 40px auto 0; margin: 40px auto 0;
padding: 0 20px; padding: 0 20px;
width: 100%; width: 100%;
max-width: 370px; max-width: 370px;
} }
.survey-item dt { .survey-item dt {
margin-bottom: 20px; margin-bottom: 20px;
padding: 6px 0; padding: 6px 0;
...@@ -2306,15 +2586,18 @@ ol.term-notice li { ...@@ -2306,15 +2586,18 @@ ol.term-notice li {
font-size: 16px; font-size: 16px;
line-height: 1.45; line-height: 1.45;
} }
.survey-1 img { .survey-1 img {
width: 100%; width: 100%;
} }
.survey-3 dd, .survey-3 dd,
.survey-4 dd, .survey-4 dd,
.survey-5 dd { .survey-5 dd {
margin: 0 auto; margin: 0 auto;
width: 70%; width: 70%;
} }
.survey-notice { .survey-notice {
margin-top: 40px; margin-top: 40px;
padding: 0 25px; padding: 0 25px;
...@@ -2332,28 +2615,35 @@ ol.term-notice li { ...@@ -2332,28 +2615,35 @@ ol.term-notice li {
padding: 100px 0 120px; padding: 100px 0 120px;
overflow: hidden; overflow: hidden;
} }
#survey .header-prize::before, #survey .header-prize::before,
#survey .header-prize::after { #survey .header-prize::after {
width: 79px; width: 79px;
height: 105px; height: 105px;
bottom: 0; bottom: 0;
} }
#survey .header-prize::before { #survey .header-prize::before {
left: calc(50% - 360px); left: calc(50% - 360px);
} }
#survey .header-prize::after { #survey .header-prize::after {
right: calc(50% - 360px); right: calc(50% - 360px);
} }
#survey .section-header-ttl { #survey .section-header-ttl {
font-size: 36px; font-size: 36px;
} }
#survey .section-content { #survey .section-content {
margin-top: 40px; margin-top: 40px;
padding: 0 20px; padding: 0 20px;
} }
.survey-lead { .survey-lead {
text-align: center; text-align: center;
} }
.survey-list { .survey-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
...@@ -2362,22 +2652,27 @@ ol.term-notice li { ...@@ -2362,22 +2652,27 @@ ol.term-notice li {
width: 100%; width: 100%;
max-width: 1000px; max-width: 1000px;
} }
.survey-item { .survey-item {
width: 290px; width: 290px;
} }
.survey-item dt { .survey-item dt {
padding: 12px 0 13px; padding: 12px 0 13px;
border-radius: 10px; border-radius: 10px;
font-size: 20px; font-size: 20px;
line-height: 1.45; line-height: 1.45;
} }
.survey-item dd { .survey-item dd {
margin-top: 30px; margin-top: 30px;
} }
.survey-1 { .survey-1 {
margin-bottom: 40px; margin-bottom: 40px;
width: 530px; width: 530px;
} }
.survey-notice { .survey-notice {
margin-top: 20px; margin-top: 20px;
margin-left: auto; margin-left: auto;
...@@ -2393,28 +2688,35 @@ ol.term-notice li { ...@@ -2393,28 +2688,35 @@ ol.term-notice li {
#survey .header-prize::before { #survey .header-prize::before {
left: calc(50% - 260px); left: calc(50% - 260px);
} }
#survey .header-prize::after { #survey .header-prize::after {
right: calc(50% - 260px); right: calc(50% - 260px);
} }
.survey-list { .survey-list {
justify-content: space-around; justify-content: space-around;
max-width: 700px; max-width: 700px;
} }
.survey-item { .survey-item {
margin-bottom: 40px; margin-bottom: 40px;
width: 40%; width: 40%;
} }
.survey-1 { .survey-1 {
width: 500px; width: 500px;
} }
.survey-item dt { .survey-item dt {
padding: 11px 0 12px; padding: 11px 0 12px;
font-size: 18px; font-size: 18px;
} }
.survey-item dd { .survey-item dd {
padding: 11px 0 12px; padding: 11px 0 12px;
font-size: 18px; font-size: 18px;
} }
.survey-2 dd { .survey-2 dd {
width: 350px; width: 350px;
transform: translateX(-11%); transform: translateX(-11%);
...@@ -2437,6 +2739,7 @@ ol.term-notice li { ...@@ -2437,6 +2739,7 @@ ol.term-notice li {
width: 361px; width: 361px;
transform: translateX(-71px); transform: translateX(-71px);
} }
.survey-3, .survey-3,
.survey-5 { .survey-5 {
margin-top: 15px; margin-top: 15px;
...@@ -2468,9 +2771,11 @@ ol.term-notice li { ...@@ -2468,9 +2771,11 @@ ol.term-notice li {
padding: 40px 0 140px; padding: 40px 0 140px;
font-size: 15px; font-size: 15px;
} }
#about .section-inner { #about .section-inner {
padding: 0 22px; padding: 0 22px;
} }
#about .section-inner::after { #about .section-inner::after {
content: ''; content: '';
position: absolute; position: absolute;
...@@ -2482,15 +2787,19 @@ ol.term-notice li { ...@@ -2482,15 +2787,19 @@ ol.term-notice li {
opacity: .4; opacity: .4;
z-index: 1; z-index: 1;
} }
.about-text { .about-text {
margin-top: 20px; margin-top: 20px;
} }
.coop { .coop {
margin-top: 1em; margin-top: 1em;
} }
.coop-item { .coop-item {
display: inline; display: inline;
} }
.mangaka-item.drops { .mangaka-item.drops {
margin-top: 20px; margin-top: 20px;
} }
...@@ -2504,27 +2813,33 @@ ol.term-notice li { ...@@ -2504,27 +2813,33 @@ ol.term-notice li {
#about { #about {
padding: 80px 0 200px; padding: 80px 0 200px;
} }
#about .section-inner::before { #about .section-inner::before {
top: -280px; top: -280px;
left: 20px; left: 20px;
transform: scale(-1, 1); transform: scale(-1, 1);
} }
#about .section-inner::after { #about .section-inner::after {
bottom: -140px; bottom: -140px;
right: 20px; right: 20px;
} }
#about .section-header-ttl { #about .section-header-ttl {
font-size: 36px; font-size: 36px;
} }
#about .section-content { #about .section-content {
margin: 40px auto 0; margin: 40px auto 0;
padding: 0 20px; padding: 0 20px;
width: 100%; width: 100%;
max-width: 780px; max-width: 780px;
} }
.coop { .coop {
margin-top: 2em; margin-top: 2em;
} }
.coop-item { .coop-item {
display: inline-block; display: inline-block;
font-feature-settings: "palt"; font-feature-settings: "palt";
...@@ -2538,6 +2853,7 @@ ol.term-notice li { ...@@ -2538,6 +2853,7 @@ ol.term-notice li {
#about { #about {
padding: 60px 0 140px; padding: 60px 0 140px;
} }
.coop { .coop {
width: calc(100% - 120px); width: calc(100% - 120px);
} }
...@@ -2625,14 +2941,17 @@ ol.term-notice li { ...@@ -2625,14 +2941,17 @@ ol.term-notice li {
.site-footer { .site-footer {
padding-top: 20px; padding-top: 20px;
} }
.footer-logo { .footer-logo {
margin: 0 auto; margin: 0 auto;
width: 192px; width: 192px;
} }
.footer-syadan { .footer-syadan {
display: block; display: block;
width: 72px; width: 72px;
} }
.copyright { .copyright {
margin-top: 20px; margin-top: 20px;
padding: 0 25px; padding: 0 25px;
...@@ -2641,6 +2960,7 @@ ol.term-notice li { ...@@ -2641,6 +2960,7 @@ ol.term-notice li {
text-align: center; text-align: center;
line-height: 1.4; line-height: 1.4;
} }
.copyright span { .copyright span {
display: inline-block; display: inline-block;
} }
...@@ -2654,16 +2974,19 @@ ol.term-notice li { ...@@ -2654,16 +2974,19 @@ ol.term-notice li {
.site-footer { .site-footer {
padding-top: 30px; padding-top: 30px;
} }
.site-footer::before { .site-footer::before {
top: -10px; top: -10px;
height: 10px; height: 10px;
} }
.footer-content { .footer-content {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin: 0 auto; margin: 0 auto;
max-width: 1000px; max-width: 1000px;
} }
.footer-nav-list { .footer-nav-list {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -2675,6 +2998,7 @@ ol.term-notice li { ...@@ -2675,6 +2998,7 @@ ol.term-notice li {
font-size: 15px; font-size: 15px;
line-height: 2.05; line-height: 2.05;
} }
.footer-nav-item::before { .footer-nav-item::before {
content: ''; content: '';
display: inline-block; display: inline-block;
...@@ -2683,6 +3007,7 @@ ol.term-notice li { ...@@ -2683,6 +3007,7 @@ ol.term-notice li {
height: 12px; height: 12px;
background: center / contain no-repeat url(../img/icon-drop-w.svg); background: center / contain no-repeat url(../img/icon-drop-w.svg);
} }
.copyright { .copyright {
margin-top: 30px; margin-top: 30px;
height: 50px; height: 50px;
...@@ -2699,10 +3024,12 @@ ol.term-notice li { ...@@ -2699,10 +3024,12 @@ ol.term-notice li {
width: calc(100% - 50px); width: calc(100% - 50px);
max-width: 830px; max-width: 830px;
} }
.footer-syadan { .footer-syadan {
display: block; display: block;
width: 90px; width: 90px;
} }
.footer-nav-list { .footer-nav-list {
width: 30vw; width: 30vw;
max-width: 362px; max-width: 362px;
...@@ -2717,6 +3044,7 @@ ol.term-notice li { ...@@ -2717,6 +3044,7 @@ ol.term-notice li {
.footer-content { .footer-content {
transform: translateX(8%); transform: translateX(8%);
} }
.footer-logo a { .footer-logo a {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
...@@ -2743,19 +3071,23 @@ ol.term-notice li { ...@@ -2743,19 +3071,23 @@ ol.term-notice li {
body { body {
width: 100%; width: 100%;
} }
.site-header { .site-header {
position: absolute; position: absolute;
min-height: 80px min-height: 80px
} }
.site-header-logo { .site-header-logo {
margin-top: 0; margin-top: 0;
padding-top: 10px padding-top: 10px
} }
.site-header-nav { .site-header-nav {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
right: 0; right: 0;
} }
.to-top { .to-top {
display: none; display: none;
} }
...@@ -2770,19 +3102,24 @@ ol.term-notice li { ...@@ -2770,19 +3102,24 @@ ol.term-notice li {
filter: blur(1rem); filter: blur(1rem);
transition: 1s opacity, 1s filter; transition: 1s opacity, 1s filter;
} }
.elemFadeIn.animated { .elemFadeIn.animated {
opacity: 1; opacity: 1;
filter: blur(0); filter: blur(0);
} }
.delay-1 { .delay-1 {
transition-delay: 1.2s; transition-delay: 1.2s;
} }
.delay-2 { .delay-2 {
transition-delay: 1.7s; transition-delay: 1.7s;
} }
.delay-3 { .delay-3 {
transition-delay: 2.2s; transition-delay: 2.2s;
} }
.main-copy { .main-copy {
transition-delay: 1s; transition-delay: 1s;
transition-property: opacity, filter; transition-property: opacity, filter;
......
<?xml version="1.0" encoding="UTF-8"?>
<svg id="_イヤー_2" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 250 247.6">
<!-- Generator: Adobe Illustrator 29.1.0, SVG Export Plug-In . SVG Version: 2.1.0 Build 142) -->
<defs>
<style>
.st0 {
fill: #fff;
}
.st1 {
fill: #ff6978;
}
</style>
</defs>
<path class="st1" d="M10.7,73.6c-27.7,62.5.4,135.6,62.9,163.3,54.9,24.4,118.8,6.1,151.3-41.7,8.8-12.9,21.2-8,24.5-15.6,3.4-7.6-8.6-13.5-4.9-28.7,13.6-56.2-15.7-115.8-70.6-140.2-62.5-27.7-135.6.4-163.3,62.9"/>
<g>
<path class="st0" d="M47.3,125l-5.1.9-1.7.3c2.6,1.8,5.3,3.2,9.1,4.5l-1.9,3.8c-.2.4-.4.5-.5.6-.2,0-.4,0-.7-.2-2.8-1.4-5.1-2.9-7-4.8l2,8.4-5,1-1.3-8.3c-1.4,2.8-3.4,5.3-5.9,7.5-.2.1-.3.2-.4.3-.2,0-.4,0-.7-.3l-3.1-2.4v.4c.9,4-.6,5.3-4.6,6.1-.4,0-.5,0-.7-.3l-2.5-3.9c1.3-.2,1.9-.4,2.5-.6.7-.2.9-.5.7-1.3l-1.2-6c-.7.4-1.5.8-2.3,1.2h-.3c0-.1-2.1-3.8-2.1-3.8v-.3c1.4-.5,2.7-1.1,3.8-1.7l-1.1-5.4-3.3.8-.3-.2-.7-3.7.2-.2,3.4-.6-1.3-6.5.2-.3,3.9-.8.4.2,1.3,6.5,2.6-.6h.2c0,.1.7,3.9.7,3.9l-.2.2-2.6.4.8,4c.8-.5,1.6-.9,2.4-1.4l.7,3.4c.1.6,0,.8-.5,1.2-.5.3-1.1.7-1.7,1.1l.2,1,1.6,7.1c2.9-2.4,5.5-5.2,7.5-8.4l-1.1.2-4.7,1-.3-.2-.7-3.7.2-.2,4.7-.8,2.9-.6-.6-2.9v-.2c.1,0,4.3-.8,4.3-.8h.2c0,.1.6,3.1.6,3.1l3.2-.6,5.1-1.1h.2c0,.1.7,3.9.7,3.9l-.2.2ZM40.1,105.5c1.4.7,2.8,1.6,4.3,2.7v.3c-6.6,2.4-12.6,4.3-17.1,5.4-.4.1-1.5.4-2.1.5-.3,0-.5,0-.7-.2l-2.6-3.4c7.8-1.7,13.4-3.6,17.8-5.4h.4ZM31.9,119.8l-3.6,2.3h-.4c-1-2-2-3.6-3.2-5v-.3s3.4-2.1,3.4-2.1h.4c1.2,1.2,2.3,2.8,3.5,4.7v.4ZM37.8,117.6l-3.7,2.2h-.3c-.9-1.9-1.9-3.6-2.9-4.9v-.3c0,0,3.4-1.9,3.4-1.9h.4c1.2,1.3,2.3,2.9,3.2,4.6v.3ZM39.8,111.1l4.7.7v.3c-.4,2.3-1.1,4.6-1.8,6.3,0,.2-.2.3-.4.3-.1,0-.3,0-.5,0l-3.7-.4c.7-2.4,1.2-4.7,1.3-7l.3-.2Z"/>
<path class="st0" d="M74.5,121.2l-6,1.2,2,9.6-5,1-1.8-9.7-5.8,1.1c.5,4.5,0,7.7-1.4,11.2,0,.2-.3.3-.4.3-.1,0-.2,0-.4,0l-4.2-2c2.1-4.4,1.8-8.7.6-15l-1.8-9.1-1-4.4.2-.3,5.8-1,14.3-2.8,5.7-1.2.3.2.8,4.5,2.3,12,2,9.5c.6,3-.2,4.5-4.3,5.3l-1.3.3c-.7.1-.8,0-1-.2l-2.4-3.7c1-.2,2.3-.5,3.2-.7.5-.1.6-.4.4-1.2l-.9-4.7ZM55.7,112.2l5.6-1.1-.8-3.8-5.6,1.1.7,3.8ZM63,119.3l-.8-4.2-5.6,1.1.4,1.8c.2.8.3,1.6.4,2.4l5.7-1.1ZM65.3,106.4l.8,3.8,6-1.2-.8-3.8-6,1.2ZM66.9,114.2l.8,4.2,6-1.2-.8-4.2-6,1.2Z"/>
<path class="st0" d="M90.4,121.9l-4.6,1-.3-.2-.9-4.5.3-.3,4.5-.8,6.5-1.3-1.7-8.6-2.9.6-5.1,1.1-.3-.2-.9-4.5.3-.3,5.1-.9,12.1-2.4,4.3-1h.3c0,.1.9,4.6.9,4.6l-.2.3-4.2.7-3.8.7,1.7,8.6,6.4-1.3,4.7-1h.3c0,.1.9,4.6.9,4.6l-.2.3-4.7.8-18.6,3.6Z"/>
<path class="st0" d="M120.3,94.8l.3.2,1.5,8c3-2.2,6.6-5.1,9.7-8.4h.3c0,0,4.1,3.3,4.1,3.3v.3c-3.7,3.6-8.2,6.9-13.2,10l.5,2.3c.2,1,.3,1.5.7,1.7.5.4,1.2.4,2.7,0,3.9-.8,7-1.6,11.5-3h.3c0,.1,1.2,5.1,1.2,5.1l-.2.3c-3.6,1-8.5,2.3-11.6,2.9-3.3.6-6,.9-7.8-.7-1.2-1-1.6-2.6-2-5l-3-15.8.2-.3,4.8-.9ZM140.4,91.2c.4,1.9-.9,3.8-2.8,4.1-1.9.4-3.8-.9-4.2-2.8-.4-1.9.9-3.8,2.8-4.2,1.9-.4,3.8.9,4.1,2.8ZM135.4,92.2c.2.9,1,1.4,1.9,1.2s1.4-1,1.2-1.8c-.2-.9-1-1.4-1.8-1.3s-1.4,1-1.3,1.9Z"/>
<path class="st0" d="M142.9,92.5l3.5-3.5h.4c2.8,1.6,4.5,3.1,6.9,5.4v.4s-3.8,3.9-3.8,3.9h-.4c-2-2.2-4.2-4.3-6.6-5.9v-.3ZM161,85.4l5.3.5.2.3c-.2,11.1-3.7,20.2-11.2,27.5-.3.2-.5.4-.7.5-.2,0-.4,0-.7-.1l-5.1-1.6c8.5-7.3,12-15.7,11.8-26.9l.3-.2Z"/>
<path class="st0" d="M199,93.7l-.2.3-5.1.9-15.2,3-5.1,1.1-.3-.2-1-4.9.3-.3,4.9-.9,15.2-3,5.2-1.1.3.2,1,4.8Z"/>
<path class="st0" d="M210.7,89.6l2.7,13-5.9,1.2-2.4-13.1-2.9-14.7.2-.3,5-1,.3.2,2.2,11.4,2.3-3.9h.3c3.1.9,5.5,1.8,8.7,3.6v.3s-2.5,4.8-2.5,4.8h-.3c-2.7-1.5-5.3-2.8-8.3-3.8l.4,2.3ZM213.8,75.2l1.5-1.6h.3c1.5.7,2.9,1.7,4.2,2.8v.3s-1.6,1.7-1.6,1.7h-.3c-1.3-1.1-2.5-2.1-4.1-3v-.3ZM216.6,72.5l1.5-1.6h.3c1.5.7,2.8,1.6,4.1,2.8v.3s-1.5,1.6-1.5,1.6h-.3c-1.3-1.1-2.4-1.9-4-2.8v-.3Z"/>
<path class="st0" d="M93.8,161.4v-.2c-1.2,1.3-2.6,2.6-4.2,3.7-.2.1-.3.2-.4.2-.2,0-.3,0-.5-.2l-3.2-2.7c2.3-1.5,4-3,5.4-4.5-1.1-.7-2.3-1.3-3.4-1.8v-.3s1.9-2.8,1.9-2.8h.3c1.1.3,2.4.9,3.6,1.5.5-.9.9-1.9,1.2-2.9l-3.4.7-4.4,1-.3-.2-.7-3.7.2-.3,4.5-.8,4.8-.9,2-.6,2.3,1.4c.2.1.3.3.4.5,0,.1,0,.3,0,.5-.6,2.9-1.6,5.7-3,8.1h.9c0-.1,7.6-1.6,7.6-1.6l1.5-.3c-3-2.2-5.6-5.1-7.9-9v-.4s3.5-1.9,3.5-1.9h.3c.7,1.2,1.5,2.2,2.3,3.2.6-.9,1.1-1.9,1.7-3.1h.3c0,0,3.7,1.5,3.7,1.5v.3c-1.1,1.7-2,3-2.9,4,.4.3.9.7,1.3,1,1-1.2,1.7-2.5,2.4-4h.3c0,0,3.5,1.5,3.5,1.5v.3c-.8,1.6-1.8,2.9-2.8,4.1,1.7.8,3.5,1.4,5.6,1.9l-2.3,4c-.1.2-.2.3-.3.3-.1,0-.4,0-.7,0-1.6-.5-3.1-1.1-4.5-1.8l.2.9-.2.3-2.3.4.8,3.9,2.6-.5,5.6-1.2.3.2.7,3.6-.2.3-5.7,1-2.6.5.7,3.7c.1.7.2.8,2.1.4,3.2-.6,3.4-1,2.9-4.3l4.3.7c.3,0,.4.1.4.3v.2c.5,2.6,0,3.9-.5,4.8-.7,1.1-2,1.7-5.9,2.5-6.1,1.2-7.2.8-7.8-2.4l-.9-5-3.1.6c.1,2.3-.3,4.2-1.2,5.9-1.4,2.4-4,4.3-7.9,5.6-.1,0-.2,0-.3,0-.3,0-.4,0-.6-.2l-3.1-3.2c4.1-1.3,6.5-2.6,7.7-4.5.4-.8.7-1.7.7-2.7l-1.7.3-5.5,1.2-.3-.2-.7-3.6.2-.3,5.5-1,2-.4-.8-3.8-1.6.3-.3-.2ZM101.1,164.2l2.9-.6-.8-3.9-2.9.6.8,3.9Z"/>
<path class="st0" d="M153.1,166.7c-.2.3-.3.5-.5.5-.1,0-.2,0-.4,0-1.3-.4-2.7-.7-4-1.2-2.7-1-5.3-2.5-7.5-4.3-1.6-1.3-3-2.8-4.2-4.4-.7,1-1.5,1.9-2.4,2.8l1,5.1c2-.8,4.1-1.6,6.3-2.5l.7,3.7c0,.4,0,.6-.5.8-3.7,1.9-8.3,3.7-13.3,5.4h-.3s-2.5-3.9-2.5-3.9l.2-.4c1.7-.5,3.2-1,4.8-1.5l-.5-2.8c-1.5,1.2-3.1,2.3-4.8,3.3-.1,0-.3.1-.4.1-.1,0-.3,0-.5-.2l-3.3-2.9c4.4-2.5,7.8-5.1,10.3-7.9l-5.4,1.1-5.1,1.1-.3-.2-.7-3.5.2-.3,5.2-.9,7.8-1.5-.3-1.6-3.4.7-5.1,1.1-.3-.2-.7-3.4.2-.3,5.2-.9,3.4-.7-.3-1.6-6.4,1.3-5.1,1.1-.3-.2-.7-3.5.2-.3,5.2-.9,6.4-1.3-.6-3,.2-.4,4.5-.9.3.2.6,3,7-1.4,5.2-1.2.3.2.7,3.6-.2.2-5.2.9-7,1.4.3,1.6,4.3-.8,4.9-1.1.2.2.7,3.5-.2.2-5,.9-4.3.8.3,1.6,8.4-1.6,5.2-1.2.2.2.7,3.6-.2.2-5.2.9-7.3,1.4c1.1,1.2,2.3,2.3,3.6,3.2,1-1.4,1.9-2.9,2.6-4.3h.3c0,0,4.3,2,4.3,2v.3c-1.4,1.9-2.4,3-3.5,4.1,2.5,1.1,5.2,1.9,8.2,2.4l-2.3,4.3Z"/>
<path class="st0" d="M161.9,153.8l-5.4,1.1-3.6-18.2,5.4-1.1,3.6,18.2ZM163.6,159.1c.4,1.8-.9,3.6-2.6,3.9-1.8.4-3.6-.8-4-2.6-.4-1.8.9-3.6,2.7-3.9,1.8-.3,3.6.8,3.9,2.6Z"/>
<path class="st0" d="M171.9,151.9l-5.4,1.1-3.6-18.2,5.4-1.1,3.6,18.2ZM173.6,157.2c.4,1.8-.9,3.6-2.6,3.9-1.8.4-3.6-.8-4-2.6s.9-3.6,2.7-3.9c1.8-.3,3.6.8,3.9,2.6Z"/>
</g>
<path class="st0" d="M198.4,128.4c-1.2-.8-3.8-5.1-5.3-7.8s-1.5-.5-1.6.3c-.4,3.1-1.1,8.1-1.9,9.3-.8,1.2-4.5,3.7-6.9,5.1s-.5,1.4.3,1.5c2.7.5,7.1,1.3,8.3,2.1,1.2.8,3.8,5.1,5.3,7.8s1.5.5,1.6-.3c.4-3.1,1.1-8.1,1.9-9.3.8-1.2,4.5-3.7,6.9-5.1s.5-1.4-.3-1.6c-2.7-.5-7.1-1.3-8.3-2.1Z"/>
<path class="st0" d="M190,42c-1.5-1-4.7-6.4-6.6-9.8s-1.8-.6-2,.4c-.5,3.9-1.4,10.1-2.4,11.6-1,1.5-5.7,4.6-8.6,6.4s-.6,1.8.4,1.9c3.4.6,8.8,1.7,10.4,2.7,1.5,1,4.7,6.4,6.6,9.8s1.8.6,2-.4c.5-3.9,1.4-10.1,2.4-11.6,1-1.5,5.7-4.6,8.6-6.4s.6-1.8-.4-1.9c-3.4-.6-8.8-1.7-10.4-2.7Z"/>
<g>
<path class="st0" d="M85.4,198.2c-.3.2-.2.7.2.8,1.4.2,3.5.7,4.2,1.1.6.4,1.9,2.6,2.7,3.9s.7.3.8-.2c.2-1.6.6-4,1-4.7.4-.6,2.3-1.8,3.4-2.6s.2-.7-.2-.8c-1.4-.2-3.5-.7-4.2-1.1-.6-.4-1.9-2.6-2.7-3.9s-.7-.3-.8.2c-.2,1.6-.6,4-1,4.7-.4.6-2.3,1.8-3.4,2.6Z"/>
<path class="st0" d="M59.2,193.4c-.6.4-.4,1.3.3,1.4,2.5.4,6.4,1.2,7.5,1.9,1.1.7,3.4,4.6,4.8,7.1s1.3.5,1.4-.3c.4-2.8,1-7.3,1.8-8.4.7-1.1,4.1-3.3,6.2-4.6s.4-1.3-.3-1.4c-2.5-.4-6.4-1.2-7.5-1.9-1.1-.7-3.4-4.6-4.8-7.1s-1.3-.5-1.4.3c-.4,2.8-1,7.3-1.8,8.4-.7,1.1-4.1,3.3-6.2,4.6Z"/>
<path class="st0" d="M32.5,74.6c-.4.3-.3.9.2,1,1.8.3,4.6.9,5.4,1.4.8.5,2.4,3.3,3.5,5.1s1,.3,1-.2c.3-2,.7-5.3,1.3-6,.5-.8,3-2.4,4.5-3.3s.3-.9-.2-1c-1.8-.3-4.6-.9-5.4-1.4-.8-.5-2.4-3.3-3.5-5.1s-1-.3-1,.2c-.3,2-.7,5.3-1.3,6-.5.8-3,2.4-4.5,3.3Z"/>
</g>
</svg>
\ No newline at end of file
...@@ -64,15 +64,12 @@ ...@@ -64,15 +64,12 @@
<main class="site-main"> <main class="site-main">
<header class="top-visual"> <header class="top-visual">
<p class="pre-ttl">
<img src="./img/winner/publication.svg" alt="採用エピソード発表!">
</p>
<div class="tv-box"> <div class="tv-box">
<h1 class="tv-logo"><img src="./img/tv-logo.png" alt="温水洗浄便座 国内累計出荷数 1億台達成記念 エピソードキャンペーン"></h1> <h1 class="tv-logo"><img src="./img/tv-logo.png" alt="温水洗浄便座 国内累計出荷数 1億台達成記念 エピソードキャンペーン"></h1>
<img src="./img/tv-fukidashi-pc.svg" alt="あなたのエピソードを漫画化!!サイトで公開/SNSで人気の漫画家さん3名とコラボ!" class="spNone tv-fukidashi"> <img src="./img/tv-fukidashi-pc.svg" alt="あなたのエピソードを漫画化!!サイトで公開/SNSで人気の漫画家さん3名とコラボ!" class="spNone tv-fukidashi">
<img src="./img/tv-fukidashi-sp.svg" alt="あなたのエピソードを漫画化!!サイトで公開/SNSで人気の漫画家さん3名とコラボ!" class="spOnly tv-fukidashi"> <img src="./img/tv-fukidashi-sp.svg" alt="あなたのエピソードを漫画化!!サイトで公開/SNSで人気の漫画家さん3名とコラボ!" class="spOnly tv-fukidashi">
<img src="./img/tv-fukidashi2-pc.svg" alt="採用エピソード発表!" class="spNone tv-fukidashi2">
<img src="./img/blank.png" data-src="./img/tv-koma3.jpg" alt="" class="tv-koma3 elemFadeIn delay-3 lazyload"> <img src="./img/tv-fukidashi2-pc.svg" alt="採用エピソード発表!" class="spOnly tv-fukidashi2">
</div> </div>
<div class="cp-period"> <div class="cp-period">
<p class="cp-period-txt1">4コマ漫画化された</p> <p class="cp-period-txt1">4コマ漫画化された</p>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment