@charset "utf-8";
 @keyframes opa1 {
0% {opacity: 0;}
100% {opacity: 1;}
} html, body {
margin: 0;
padding: 0;
height: 100vh;
font-size: 13px;
} @media screen and (min-width: 576px) {
html, body {
font-size: 14px;
}
}
@media screen and (min-width: 768px) {
html, body {
font-size: 15px;
}
}
@media screen and (min-width: 1280px) {
html, body {
font-size: 16px;
}
} body {
font-family: "Sawarabi Gothic", Helvetica Neue, Helvetica, Hiragino Sans, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, sans-serif;
font-weight: 300;
font-optical-sizing: auto;
letter-spacing: 0.1rem;
text-indent: 0.1rem;
color: #333;
background: #fffff0;
}
h1, h2, h3, h4 {
font-family: "Potta One", serif;
font-weight: 400;
font-style: normal;
margin: 0;
}
p {
margin: 8px 0;
line-height: 2;
} .space-block-small {
margin-bottom: 3vh;
}
.space-block-middle {
margin-bottom: 28vh;
}
.space-block-large {
margin-bottom: 35vh;
} body::before {
content: '';
position: fixed;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(//www.colorfulclover.com/wp-clover/wp-content/themes/ColorfulClover/assets/img/hp_top.png) no-repeat center center / cover;
opacity: 1;
} img {
border: none;
max-width: 100%;
height: auto;
vertical-align: middle;
} a {
color: #333;
text-decoration: none;
transition: 0.3s;
}
a:hover {
opacity: 0.8;
}
.page-content > p > a, .logged-in-as > a, .comments a {
text-decoration: underline;
} input {
font-size: 1rem;
} ul, li {
list-style-type: none;
padding: 0;
}
.page-content > ul> li {
list-style-type: disc;
margin-left: 1rem;
} .site-header {
position: fixed;
width: 100%;
height: 100vh;
left: 0px;
top: 0px;
z-index: 99;
} .site-logo {
margin: 10px 0 0 5px;
text-align: left;
}
.site-logo img {
width: 100px;
animation: opa1 1.5s both;
}
.header-desc {
font-size: 0.75rem;
font-weight: bold;
margin-left: 12px;
animation: opa1 1.0s both;
}
.search-keyword {
position: relative;
display: flex;
height: calc(1rem + 11px);
animation: opa1 1.5s both;
}
#toggle1 {
visibility: hidden;
opacity: 0;
transition: 2s;
}
.header-search {
position: fixed;
display: flex;
width: 170px;
margin-left: 12px;
}
.header-search:after, .header-search:before {
display: block;
content: " ";
line-height: 0;
}
.header-search:after {
display: block;
content: " ";
clear: both;
}
.header-search input {
width: 100%;
border: 1px solid #333;
border-radius: 5px 5px 5px 5px;
padding: 5px;
}
.toggle-btn i {
position: fixed;
display: flex;
left: 163px;
color: #333;
font-size: 13px;
line-height: 2.2rem;
}
@media screen and (min-width: 768px) {
.site-header {
position: fixed;
width: 220px;
left: 0px;
top: 0px;
padding: 15px 15px 0 15px;
text-align: center;
}
.site-logo {
margin: 15px 0;
text-align: center;
}
.site-logo img {
width: 120px;
}
.header-desc {
margin-left: auto;
}
#toggle1 {
display: none;
}
.header-search {
position: fixed;
display: block;
width: 190px;
margin-left: auto;
}
.toggle-btn i {
position: relative;
font-size: 13px;
line-height: 2.2rem;
}
}
@media screen and (min-width: 1280px) {
.site-header {
width: 260px;
padding: 25px 25px 0 25px;
}
.site-logo {
margin: 20px 0;
}
.site-logo img {
width: 150px;
}
.header-desc p {
margin: 15px 0;
}
.header-search {
width: 215px;
}
.toggle-btn i {
left: 190px;
}
} .scroll-nav {
display: block;
width: 100%;
height: 100px;
}
.scroll-nav .site-logo {
margin: 14px 0 0 8px;
}
.scroll-nav .site-logo img {
width: 70px;
}
.scroll-nav .header-desc {
display: none;
}
.scroll-nav .header-search {
position: fixed;
display: flex;
top: 12px;
right: 85px;
width: 45%;
transition: 0s;
visibility: hidden;
opacity: 0;
}
.scroll-nav .toggle-btn i {
top: 12px;
right: 90px;
left: auto;
}
.scroll-nav #toggle1:checked ~ .header-search {
visibility: visible;
opacity: 1;
transition: 0.5s;
}
@media screen and (min-width: 768px) {
.scroll-nav {
width: 220px;
height: 100vh;
}
.scroll-nav .site-logo {
margin: 15px 0;
}
.scroll-nav .site-logo img {
width: 120px;
}
.scroll-nav .header-desc {
display: block;
}
.scroll-nav .header-desc p {
margin: 8px 0;
}
.scroll-nav .header-search {
position: absolute;
width: 190px;
top: auto;
right: auto;
transition: none;
visibility: visible;
opacity: 1;
}
.scroll-nav .toggle-btn i {
position: absolute;
top: 0;
left: 163px;
}
}
@media screen and (min-width: 1280px) {
.scroll-nav {
width: 260px;
}
.scroll-nav .site-logo {
margin: 20px 0;
}
.scroll-nav .site-logo img {
width: 150px;
}
.scroll-nav .header-desc p {
margin: 15px 0;
}
.scroll-nav .header-search {
width: 215px;
}
.scroll-nav .toggle-btn i {
left: 190px;
}
} .gnav a {
font-family: "Potta One";
font-size: 14px;
color: #333;
}
@media screen and (min-width: 576px) {
.gnav a {
font-size: 15px;
}
}
@media screen and (min-width: 768px) {
.gnav a {
font-size: 16px;
}
}
@media screen and (min-width: 1280px) {
.gnav a {
font-size: 17px;
}
}
.gnav {
display: flex;
justify-content: flex-end;
}
.gnav li {
width: 135px;
line-height: 70px;
text-align: center;
margin: 2vw;
background: url(//www.colorfulclover.com/wp-clover/wp-content/themes/ColorfulClover/assets/img/frame.png) no-repeat center center / cover, radial-gradient(rgba(255, 127, 127, 1), rgba(255, 255, 255, 0) 80%);
}
.gnav li {
animation: opa1 1.5s both;
}
.gnav li:hover {
transform: scale(1.05);
filter: brightness(1.1);
}
.sns-nav {
position: fixed;
margin: 0 0 0 5px;
padding: 0;
bottom: 15px;
list-style-type: none;
}
.sns-nav i {
font-size: 20px;
}
.sns-nav ul {
display: flex;
margin: 2px -2px;
}
.sns-nav li {
margin: 0 8px;
}
@media screen and (min-width: 576px) {
.gnav ul {
position: fixed;
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100%;
bottom: 10%;
}
}
@media screen and (min-width: 768px) {
.gnav ul {
left: 0;
bottom: auto;
top: 55%;
}
}
@media screen and (max-width: 767px) and (max-height: 500px) {
.gnav li {
width: 115px;
line-height: 58px;
margin: 15px;
}
} .scroll-nav .gnav ul {
position: fixed;
display: inline-flex;
top: 25px;
left: 85px;
flex-wrap: wrap;
justify-content: flex-start;
}
.scroll-nav .gnav li {
position: static;
background: none;
width: auto;
margin: 2px 10px 2px 0;
line-height: normal;
}
.scroll-nav .sns-nav {
top: 15px;
right: 10px;
bottom: auto;
}
.scroll-nav .sns-nav i {
font-size: 18px;
}
@media screen and (min-width: 576px) {
.scroll-nav .gnav ul {
bottom: auto;
}
}
@media screen and (min-width: 768px) {
.scroll-nav .gnav ul {
position: relative;
display: block;
left: auto;
top: auto;
}
.scroll-nav .gnav li {
margin: 0 0 10px;
}
.scroll-nav .sns-nav {
position: fixed;
right: auto;
top: auto;
bottom: 15px;
}
.scroll-nav .sns-nav i {
font-size: 20px;
}
}  .section-title {
font-size: 2rem;
}
.topics-section .section-title {
margin: 0 0 18px 0;
}
@media screen and (min-width: 768px) {
.section-title {
font-size: 2rem;
margin: 0;
}
}
@media screen and (min-width: 1280px) {
.section-title {
font-size: 2.2rem;
margin: 1vw 0 2.5vw 0;
}
}
.top-view {
padding: 2vw 5vw;
}
.top-view::before {
opacity: 0;
transition: opacity 1s;
}
.top-view.active::before {
opacity: 1;
}
.top-view.inactive::before {
opacity: 0;
}
.container {
min-height: calc(100dvh - 50px);
margin: 50px 0;
padding: 12vw 5vw;
}
.container.has-orange-bg::before {
content: '';
position: fixed;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #ff8c1a;
}
.scroll-offset {
padding-top: 100px;
margin: auto;
}
@media screen and (min-width: 768px) {
main {
margin-left: 220px;
}
.container {
padding: 4vw 6vw;
}
}
@media screen and (min-width: 1280px) {
main {
margin-left: 260px;
}
}  .page-section {
background-color: rgba(162, 215, 221, 0.9);
color: #333;
} .topics-section {
background-color: rgba(255, 191, 127, 0.8);
color: #333;
} .search-section, .not-found-section {
background-color: rgba(255, 177, 177, 0.9);
color: #333;
}
@media screen and (min-width: 768px) {
.page-section, .topics-section, .search-section, .not-found-section {
border-radius: 3vw 0 0 3vw;
margin-bottom: auto;
margin-top: 45px;
}
} .size-chart-swiper {
width: 100%;
padding: 20px 0;
}
.size-chart-swiper img {
width: 100%;
height: auto;
border-radius: 10px;
}
.size-chart-swiper p {
text-align: center;
margin-top: 10px;
font-weight: bold;
}
.swiper-button-prev {
left: -6px !important;
}
.swiper-button-next {
right: -6px !important;
}
.swiper-button-prev::after, .swiper-button-next::after {
display: none;
}
.swiper-button-prev::before, .swiper-button-next::before {
font-family: 'Font Awesome 6 Free';
font-weight: 900;
color: #333;
font-size: 2rem;
position: relative;
}
.swiper-button-prev::before {
content: '\f053';
}
.swiper-button-next::before {
content: '\f054';
}
.nav-previous, .nav-next, .swiper-button-prev, .swiper-button-next {
position: absolute;
top: 50%;
z-index: 10;
font-size: 2rem;
background: radial-gradient(rgba(255, 140, 26, 1), rgba(255, 255, 255, 0) 70%);
padding: 1em 1em;
border-radius: 50%;
transition: background-color 0.3s ease, color 0.3s ease;
}
.nav-previous {
left: -30px;
}
.nav-next {
right: -30px;
}
.nav-previous a:hover, .nav-next a:hover, .nav-previous a:active, .nav-next a:active, .swiper-button-prev:active, .swiper-button-next:active {
color: #0293AD;
background: radial-gradient(rgba(255, 140, 26, 1), rgba(255, 255, 255, 0) 70%);
}
.size-viewer {
display: flex;
flex-direction: row;
margin: 20px 0;
}
.silhouette-img {
max-width: 50%;
}
.silhouette-img img {
border-radius: 10px;
}
.size-list {
width: 50%;
}
.size-list-btn {
width: 88%;
margin-bottom: 2vw;
margin-left: 20px;
justify-content: flex-start;
flex-wrap: wrap;
}
.size-list-btn h3 {
margin: 8px 0;
line-height: 1.5;
}
.size-chart {
padding: 3vw 2vw;
width: 80%;
background:#F2EFE7;
box-shadow: 0 0 40px rgba(0, 0, 0, 0.2) inset,0 0 4px rgba(0, 0, 0, 0.2) ;
margin: 2vw auto;
position: relative;
}
.doll-info {
display: flex;
flex-direction: column;
}
.tshirt-icon {
width: 28vw;
height: 28vw;
background: url(//www.colorfulclover.com/wp-clover/wp-content/themes/ColorfulClover/assets/img/tshirt_icon.png) no-repeat center/contain;
position: absolute;
left: 0;
top: 0;
transform: translate(-80%, -50%);
z-index: 2;
}
.size-label {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 7vw;
font-family: "Potta One";
color: white;
pointer-events: none;
}
.doll-image {
width: 80%;
position: relative;
display: inline-block;
margin: 0 auto;
}
.doll-content {
margin: 2vw auto 0 auto;
}
.size-block-title {
font-size: 1.5rem;
margin-top: auto;
padding: 0;
}
.size-block-subtitle {
margin: 0 30px;
padding: 0;
font-size: 1.2rem;
}
.doll-size-table {
display: table;
font-size: 1.1rem;
margin: 0 auto;
}
.cell-left-align {
text-align: left;
}
.cell-right-align {
text-align: right;
}
.doll-type {
padding: 10px;
}
.doll-type h4 {
padding: 0;
font-size: 1.2rem;
}
.doll-type p {
line-height: 1;
font-size: 1rem;
}
.doll-type-item {
margin-left: 10px;
}
.doll-note {
min-width: 70%;
background: #fff;
border-radius: 8px;
font-size: 1.2rem;
margin: 2vw auto;
}
.doll-note h3 {
font-size: 1.5rem;
padding: 10px 0 0 0;
}
.doll-memo {
line-height: 1.2;
font-size: 1rem;
padding: 1vw;
margin: 0;
}  .size-label-swiper-container {
padding: 20px 20px 35px 20px;
width: 100%;
} .size-label-swiper {
display: flex;
overflow-x: auto;
scroll-behavior: smooth;
padding-bottom: 5px;
} .size-label-swiper::-webkit-scrollbar {
height: 6px;
}
.size-label-swiper::-webkit-scrollbar-thumb {
background: #ccc;
border-radius: 10px;
} .size-label-swiper .swiper-wrapper {
display: flex;
gap: 20px;
} .size-label-swiper .swiper-slide {
width: auto;
flex: 0 0 auto;
} .size-label-swiper .swiper-slide a {
display: inline-block;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
border: 1px solid #ccc;
border-radius: 10px;
background: #fffff0;
color: #333;
font-family: "Potta One";
font-size: 1.5em;
text-decoration: none;
font-weight: normal;
transition: 0.2s ease;
} .size-label-swiper .swiper-slide:hover a {
filter: brightness(0.8); 
} .size-label-swiper .swiper-slide-active-label a {
background: #0293AD;
color: #fff;
border-color: #0293AD;
}
@media screen and (max-width: 500px) {
.size-viewer {
flex-direction: column;
align-items: center;
}
.silhouette-img {
width: 80%;
margin-bottom: 3vw;
}
.size-list {
width: 80%;
}
}
@media screen and (min-width: 768px) {
.doll-info {
flex-direction: row;
}
.tshirt-icon {
width: 140px;
height: 140px;
transform: translate(-55%, -60%);
}
.size-label-swiper-container {
padding: 20px 20px 35px 0;
}
.size-label {
font-size: 35px;
}
.size-chart {
max-width: 750px;
width: 100%;
}
.doll-image {
width: 50%;
}
.doll-content {
width: 50%;
margin: auto;
}
.doll-note {
width: 100%;
}
}
@media screen and (max-width: 768px) {
.size-block-subtitle {
margin: 0;
}
}
@media screen and (min-width: 1024px) {
.tshirt-icon {
width: 160px;
height: 160px;
transform: translate(-55%, -60%);
}
.size-chart {
max-width: 750px;
width: 100%;
}
.doll-content {
width: 50%;
margin: auto;
}
.size-block-title {
margin-left: 20px;
}
.doll-size-table {
font-size: 1.2rem;
}
} .search-word-block {
align-items: center;
margin: 8px 0;
}
.search-word-block p {
font-size: 1.125rem;
margin-left: 10px;
}
.search-section .size-chart {
background: none;
box-shadow: none;
} .page-title {
font-size: 2.2rem;
line-height: 1;
}
.page-title .ja {
display: block;
position: relative;
margin-bottom: -1.5rem;
padding: 1vw 0.5vw;
border-bottom: 2px dashed #333;
color: #353535;
}
.page-title .en {
display: block;
font-size: 0.6em;
padding: 0 0.5vw;
color: #777;
}
.page-title .ja:after {
position: absolute;
content: '';
width: 15%;
left: 0;
bottom: -2.5px;
border-bottom: 4px solid #333;
}
.post-label span {
display: inline-block;
padding: 0.2em 0.6em;
font-size: 0.8em;
background: #f4f4f4;
border-radius: 5px;
color: #333;
font-weight: bold;
}
.page-content h3::before {
content: "【";
margin-right: 0.2em;
}
.page-content h3::after {
content: "】";
margin-left: 0.2em;
} .entry-list {
width: 100%;
}
.item--list, .blog--list {
margin: 1.5vw 0 1.5vw 0;
clear:both;
}
.entry-item {
margin: 0;
padding: 0;
}
.entry-item-body{
}
.entry-title {
line-height: 1;
}
.title--single {
font-size: 1.6rem;
font-weight: 700;
border-left: 4px solid #333;
padding: 0.8vw 0.5vw;
}
.title--list {
}
.entry-meta {
display: flex;
align-items: center;
justify-content: space-between;
}
.item--list .entry-meta {
width: 55%;
padding-left: 8px;
justify-content: start;
}
.item--list .entry-header {
display: flex;
width: 100%;
justify-content: space-between;
}
.entry-thumbnail img {
margin: 0 0 10px 0;
}
.cat-label {
display: flex;
flex-wrap: nowrap;
}
.cat-label a {
color: #0293AD;
}
.cat-label li {
display: inline-block;
font-size: 10px;
text-decoration: none;
line-height: 1;
color: #0293AD;
padding: 4px 8px;
border: 2px solid #0293AD;
margin: 0 0 0 15px;
}
.cat-label .cat-empty {
visibility: hidden;
}
.thumbnail--list {
width: 40vw;
margin: 0 5vw 0 0;
float: left;
}
.thumbnail--list .entry-thumbnail-label {
position: absolute;
lef: 0;
margin-left: 0;
z-index: 1;
}
.entry-thumbnail-label {
display: inline-block;
font-family: "Potta One";
font-size: 11px;
line-height: 1;
color: #ffffff;
padding: 5px 8px;
margin: 0 0 0 15px;
}
.new-mark{
background: #f35b69;
}
.post-type-label {
background: #0293AD;
}
.entry-excerpt {
margin: 0 0 25px 0;
}
.entry-excerpt p {
margin: auto;
line-height: 1.5;
}
.entry-excerpt a {
display: flex;
justify-content: flex-end;
}
@media screen and (min-width: 768px) {	
.thumbnail--list {
width: 20vw;
}
.entry-excerpt {
height: 15vw;
}
}
@media screen and (min-width: 1024px) {
.row {
display:flex;
flex-wrap: wrap;
margin-bottom: 20px;
}
.entry-meta ul li a {
font-size: 12px;
padding: 5px 10px;
}
.item--list {
position: relative;
width: 100%;
min-height: 1px;
margin: 1vw 0;
}
.blog--list {
position: relative;
flex: 0 0 31%;
width: 100%;
max-width: 31%;
min-height: 1px;
margin: 1vw 0.5vw 3vw 0.5vw;
}
.item--list .entry-title {
width: 82%;
display: flex;
align-items: center;
}
.blog--list .entry-meta {
display: flex;
align-items: center;
justify-content: space-between;
}
.thumbnail--list {
width: auto;
margin: 0;
float: none;
}
.entry-excerpt {
height: auto;
}
}
@media screen and (min-width: 1280px) {
.item--list .entry-meta {
width: 35%;
align-items: baseline;
}
.item--list .entry-title {
width: 85%;
}
} .post-links {
display: flex;
margin: 45px 0;
border-top: 1.5px solid #333;
}
.post-link {
width: 50%;
padding: 15px 0;
}
.post-link-prev i, .post-link-prev svg, .breadcrumb-inner i {
margin-right: 10px;
}
.post-link-next {
text-align: right;
}
.post-link-next i, .post-link-next svg {
margin-left: 10px;
} .archive-box {
background: #f4f4f4;
border-radius: 5px;
margin-top: 3vw;
}
.archive-title {
padding: 0 0 0 5px;
}
.archive-list {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin: 0;
padding: 0.5vw;
}
.archive-list li {
display: inline-flex;
margin-right: 35px;
} .confirm-area {
display: none;
}
.Form {
display: block;
} .wpcf7-response-output{
display: block;
color: red;
font-size: 14px;
}
.comments {
border-top: 2px dashed #333;
}
.ctc_form {
margin: 30px 0;
}
.form-group {
margin: 20px 0;
}
.form-group input, .comment-form-author input, .comment-form-email input, .comment-form-url input {
width: 80%;
border: 1px solid #333;
border-radius: 5px 5px 5px 5px;
padding: 5px;
}
.comment-form-author input, .comment-form-email input, .comment-form-url input {
width: 60%;
}
.comment-form-comment label {
vertical-align: top;
}
.form-group textarea, .comment-form-comment textarea {
width: 90%;
border: 1px solid #333;
border-radius: 5px 5px 5px 5px;
padding: 5px;
font-size: 1rem;
}
.comment-form-comment textarea {
width: 80%;
}
.form-group span, span.required {
font-weight: bold;
color: #ff0000;
font-size: 0.8em;
}
.logged-in-as a, .logged-in-as span, .comment-notes span {
display: inline-block;
}
span.wpcf7-spinner {
display: none;
}
.comments .commentlist .comment .children {
padding-left: 30px;
margin-left: 30px;
border-left: 2px solid #eee;
}
.comments .commentlist .comment .comment-body .comment-author {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
}
.comments .commentlist .comment .comment-body .comment-meta {
text-align: right;
font-size: 12px;
}
.confirm-box p {
background: #fff;
padding: 5px;
border-radius: 5px 5px 5px 5px;
width: 90%;
min-height: 3rem;
}
@media screen and (max-width: 768px) {
.comment-form-comment, .comment-form-author, .comment-form-email, .comment-form-url {
text-align: left;
}
.form-group input, .form-group textarea, .comment-form-comment textarea, .confirm-box p {
width: 100%;
}
.comment-form-author input, .comment-form-email input, .comment-form-url input {
display: flex;
flex-direction: column;
width: 80%;
}
} .topics-section .btn-container, .comment-form, .reply {
text-align: right;
margin-bottom: 25px;
}
.form-btn-group {
text-align: right;
width: 90%;
}
.button-base {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.4em;
padding: 10px 30px;
border: none;
border-radius: 100vh;
font-weight: bold;
font-size: 1rem;
cursor: pointer;
transition: 0.3s ease;
background: #eee;
vertical-align: middle;
text-decoration: none;
}
.button-blue {
color: #0293AD;
}
.button-blue:hover {
background: #d4eef7;
}
.button-orange {
color: #ff8c1a;
}
.button-orange:hover {
background: #ffd6ad;
}
.button-base .fa-caret-right {
font-family: 'Font Awesome 6 Free';
font-weight: 900;
} .confirm-button:disabled {
cursor: not-allowed;
opacity: 0.6; }
.reply .comment-reply-link {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.4em;
padding: 5px 15px;
border-radius: 100vh;
background: #eee;
color: #0293AD;
font-weight: bold;
font-size: 0.85rem;
text-decoration: none;
border: none;
transition: 0.3s ease;
}
.reply .comment-reply-link::after {
content: '\f0da';
font-family: 'Font Awesome 6 Free';
font-weight: 900;
color: #0293AD;
}
.reply .comment-reply-link:hover {
background: #d4eef7;
color: #0293AD;
}
@media screen and (max-width: 768px) {
.form-btn-group  {
width: 100%;
}
} .coming-soon-box {
background: #fff6f6;
border: 1px solid #ffc9d0;
border-radius: 12px;
padding: 1.5em;
margin-top: 2vw;
color: #333;
}
.coming-soon-box h3 {
color: #e6577e;
padding: 5px 0;
margin: 8px 0;
font-size: 1.2rem;
} .pagination {
clear: both;
} .breadcrumb {
margin: 3vw 0 0 0.5vw;
} footer {
font-size: 0.8rem;
text-align: center;
padding-bottom: 1rem;
}
.footer-links a {
color: inherit;
text-decoration: none;
}
.footer-links p {
margin: 5px 0 2px 0;
}
.footer-links .footer-credit {
font-size: 70%;
}
.footer-copyright {
font-size: 100%;
} .pagetop {
display: none;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
.pagetop-show {
display: block;
opacity: 1;
visibility: visible;
}
.pagetop a {
display: block;
text-decoration: none;
text-align: center;
position: fixed;
z-index: 99;
right: 10px;
bottom: 10px;
color: #70462E;
font-size: 1.5rem;
background: rgba(112, 70, 46, 0.4);
width: 50px;
line-height: 50px;
border-radius: 50%;
}
@media screen and (min-width: 1024px) {
.pagetop a {
right: 20px;
bottom: 20px;
width: 60px;
line-height: 60px;
}
}