/* added by sun start */
html {
box-sizing: border-box;
-webkit-text-size-adjust: 100%;
word-break: normal;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4
}
*,
:after,
:before {
background-repeat: no-repeat;
box-sizing: inherit
}
:after,
:before {
text-decoration: inherit;
vertical-align: inherit
}
* {
padding: 0;
margin: 0
}
hr {
overflow: visible;
height: 0
}
details,
main {
display: block
}
summary {
display: list-item
}
small {
font-size: 80%
}
[hidden] {
display: none
}
abbr[title] {
border-bottom: none;
text-decoration: underline;
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted
}
a {
background-color: transparent
}
a:active,
a:hover {
outline-width: 0
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace
}
pre {
font-size: 1em
}
b,
strong {
font-weight: bolder
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sub {
bottom: -.25em
}
sup {
top: -.5em
}
input {
border-radius: 0
}
[disabled] {
cursor: default
}
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto
}
[type=search] {
-webkit-appearance: textfield;
outline-offset: -2px
}
[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}
textarea {
overflow: auto;
resize: vertical
}
button,
input,
optgroup,
select,
textarea {
font: inherit
}
optgroup {
font-weight: 700
}
button {
overflow: visible
}
button,
select {
text-transform: none
}
[role=button],
[type=button],
[type=reset],
[type=submit],
button {
cursor: pointer;
color: inherit
}
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
border-style: none;
padding: 0
}
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button:-moz-focusring {
outline: 1px dotted ButtonText
}
[type=reset],
[type=submit],
button,
html [type=button] {
-webkit-appearance: button
}
button,
input,
select,
textarea {
background-color: transparent;
border-style: none
}
select {
-moz-appearance: none;
-webkit-appearance: none
}
select::-ms-expand {
display: none
}
select::-ms-value {
color: currentColor
}
legend {
border: 0;
color: inherit;
display: table;
white-space: normal;
max-width: 100%
}
::-webkit-file-upload-button {
-webkit-appearance: button;
color: inherit;
font: inherit
}
img {
border-style: none
}
progress {
vertical-align: baseline
}
svg:not([fill]) {
fill: currentColor
}
@media screen {
[hidden~=screen] {
display: inherit
}
[hidden~=screen]:not(:active):not(:focus):not(:target) {
position: absolute !important;
clip: rect(0 0 0 0) !important
}
}
[aria-busy=true] {
cursor: progress
}
[aria-controls] {
cursor: pointer
}
[aria-disabled] {
cursor: default
}
@-webkit-keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
@keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
html {
box-sizing: border-box;
font-size: 100%
}
body {
height: 100%;
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;
font-weight: 400;
line-height: 1.5;
color: #222;
word-wrap: break-word;
background-color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-font-feature-settings: "kern";
font-feature-settings: "kern";
-webkit-font-kerning: normal;
font-kerning: normal;
font-size: 16px
}
[tabindex]:active,
[tabindex]:hover {
outline: none
}
@media only screen and (min-width:769px) {
[data-tooltip]:focus,
[data-tooltip]:hover {
position: relative
}
[data-tooltip]:focus:after,
[data-tooltip]:hover:after {
position: absolute;
display: block;
max-width: 200px;
padding: 4px 8px;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;
font-weight: 400;
line-height: 1.5;
text-align: center;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
pointer-events: none;
content: attr(data-tooltip);
border: 1px solid #f2f2f2;
border-radius: 4px;
opacity: 0;
font-size: 12px;
-webkit-animation: tooltipAnimation .2s cubic-bezier(1, 0, 0, 1) .2s forwards;
animation: tooltipAnimation .2s cubic-bezier(1, 0, 0, 1) .2s forwards;
top: -8px;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-100%);
transform: translateX(-50%) translateY(-100%);
color: #787c7b;
background-color: #f7f9f9
}
@-webkit-keyframes tooltipAnimation {
0% {
opacity: 0
}
to {
opacity: 1
}
}
@keyframes tooltipAnimation {
0% {
opacity: 0
}
to {
opacity: 1
}
}
}
input[type=search]::-ms-clear,
input[type=search]::-ms-reveal {
display: none;
width: 0;
height: 0
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
display: none
}
button {
padding: 0
}
a {
color: inherit;
text-decoration: none
}
*,
:after,
:before {
box-sizing: inherit
}
address,
blockquote,
dl,
fieldset,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
ol,
p,
pre,
table,
ul {
padding: 0;
margin: 0
}
address,
cite,
dfn,
em,
i {
font-style: normal
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: inherit;
font-size: 100%;
font-weight: 400;
color: inherit
}
ol,
ul {
list-style-type: none
}
table {
width: 100%
}
th {
text-align: left
}
@font-face {
font-family: "note monospace";
font-style: normal;
font-weight: 400;
src: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/notemonospace.f347e59.woff) format("woff");
src: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/notemonospace.4b4d5fa.ttf) format("truetype");
font-display: swap
}
.hljs {
display: block;
overflow-x: auto;
padding: .5em;
color: #abb2bf;
background: #282c34
}
.hljs-comment,
.hljs-quote {
color: #5c6370;
font-style: italic
}
.hljs-doctag,
.hljs-formula,
.hljs-keyword {
color: #c678dd
}
.hljs-deletion,
.hljs-name,
.hljs-section,
.hljs-selector-tag,
.hljs-subst {
color: #e06c75
}
.hljs-literal {
color: #56b6c2
}
.hljs-addition,
.hljs-attribute,
.hljs-meta-string,
.hljs-regexp,
.hljs-string {
color: #98c379
}
.hljs-built_in,
.hljs-class .hljs-title {
color: #e6c07b
}
.hljs-attr,
.hljs-number,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-pseudo,
.hljs-template-variable,
.hljs-type,
.hljs-variable {
color: #d19a66
}
.hljs-bullet,
.hljs-link,
.hljs-meta,
.hljs-selector-id,
.hljs-symbol,
.hljs-title {
color: #61aeee
}
.hljs-emphasis {
font-style: italic
}
.hljs-strong {
font-weight: 700
}
.hljs-link {
text-decoration: underline
}
.modal-open {
overflow: hidden
}
.modal-wrapper {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
z-index: var(--z-index-modal);
display: none
}
.modal-open .modal-wrapper {
display: block
}
.modal-backdrop {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, .5);
opacity: 1
}
.modal-backdrop-enter {
opacity: 0
}
.modal-backdrop-enter-active {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
.modal-backdrop-enter-to,
.modal-backdrop-leave {
opacity: 1
}
.modal-backdrop-leave-active {
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
.modal-backdrop-leave-to {
opacity: 0
}
.modal-content-wrapper {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 2;
height: 100%;
overflow: auto;
text-align: center;
-webkit-overflow-scrolling: touch
}
.modal-content-wrapper:before {
display: inline-block;
height: 100%;
vertical-align: middle;
content: ""
}
.modal-content {
position: relative;
display: inline-block;
text-align: left;
vertical-align: middle
}
.modal-content-enter {
opacity: 0;
-webkit-transform: scale(.9);
transform: scale(.9)
}
.modal-content-enter-active {
-webkit-transition: all .2s ease-in-out 30ms;
transition: all .2s ease-in-out 30ms
}
.modal-content-enter-to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1)
}
.modal-content-leave-active {
display: none;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
.modal-content-slide-enter {
-webkit-transform: translateY(100%);
transform: translateY(100%)
}
.modal-content-slide-enter-active {
-webkit-transition: all .3s ease-out 30ms;
transition: all .3s ease-out 30ms
}
.modal-content-slide-enter-to,
.modal-content-slide-leave {
-webkit-transform: translate(0);
transform: translate(0)
}
.modal-content-slide-leave-active {
-webkit-transition: all .2s ease-in;
transition: all .2s ease-in
}
.modal-content-slide-leave-to {
-webkit-transform: translateY(100%);
transform: translateY(100%)
}
.sortable-ghost {
position: relative
}
.sortable-ghost:before {
position: absolute;
top: 4px;
right: 4px;
bottom: 4px;
left: 4px;
z-index: 3;
display: block;
content: "";
background-color: #fff;
border: 1px dashed #a8abb1
}
.nuxt-progress {
position: fixed;
top: 0;
left: 0;
right: 0;
height: 2px;
width: 0;
opacity: 1;
-webkit-transition: width .1s, opacity .4s;
transition: width .1s, opacity .4s;
background-color: #29d;
z-index: 999999
}
.nuxt-progress.nuxt-progress-notransition {
-webkit-transition: none;
transition: none
}
.nuxt-progress-failed {
background-color: red
}
.o-homescreenBanner:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-4b970f2a {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-4b970f2a {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-homescreenBanner {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 8px;
background-color: #f2f2f2
}
@media only screen and (min-width:769px) {
.o-homescreenBanner {
display: none
}
}
.o-homescreenBanner--type_ios .o-homescreenBanner__icon {
border-radius: 12px;
box-shadow: 0 0 10px rgba(0, 0, 0, .05)
}
@media only screen and (max-width:479px) {
.o-homescreenBanner--type_ios .o-homescreenBanner__icon {
width: 40px;
height: 40px;
border-radius: 8px
}
}
.o-homescreenBanner__icon {
width: 56px;
height: 56px;
margin-right: 8px;
margin-left: 8px;
overflow: hidden
}
.o-homescreenBanner__app {
width: 100%;
height: 100%
}
.o-homescreenBanner__caption {
-webkit-box-flex: 2;
flex-grow: 2;
font-size: 14px;
font-weight: 700
}
@media only screen and (max-width:359px) {
.o-homescreenBanner__caption {
font-size: 12px
}
}
.o-homescreenBanner__button {
padding: 8px
}
.o-homescreenBanner__close {
color: #a8abb1
}
.o-navBar:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-1567e10a {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-1567e10a {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-navBar {
position: relative;
background-color: #fff;
border-bottom: 1px solid #e6e6e6;
box-shadow: 0 0 1px rgba(34, 34, 34, .08);
-webkit-transition: -webkit-transform .3s ease;
transition: -webkit-transform .3s ease;
transition: transform .3s ease;
transition: transform .3s ease, -webkit-transform .3s ease
}
@media only screen and (max-width:768px) {
.o-navBar {
box-shadow: none
}
}
.o-navBar.active {
z-index: 11
}
@media only screen and (max-width:479px) {
.o-navBar.active {
position: fixed;
top: 0;
width: 100%
}
.o-navBar.active.is-search {
position: relative
}
}
.o-navBar.is-sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 11;
-webkit-transition: -webkit-transform .3s ease;
transition: -webkit-transform .3s ease;
transition: transform .3s ease;
transition: transform .3s ease, -webkit-transform .3s ease;
-webkit-transform: translate(0);
transform: translate(0)
}
@media print {
.o-navBar.is-sticky {
display: none
}
}
.o-navBar.is-stickyActive1 {
-webkit-transform: translateY(-100%);
transform: translateY(-100%)
}
.o-navBar.is-stickyActive1.is-search {
position: -webkit-sticky;
position: sticky
}
.o-navBar.is-stickyActive2 {
-webkit-transform: translate(0);
transform: translate(0)
}
.o-navBar.is-stickyActive2.is-search {
position: -webkit-sticky;
position: sticky
}
.o-navBar.is-stickyHide {
-webkit-transform: translateY(-200%);
transform: translateY(-200%)
}
.o-navBar.is-stickyHide.is-search {
position: -webkit-sticky;
position: sticky
}
.o-navBar__creator {
position: absolute;
top: 64px;
left: 0;
width: 100%;
max-height: 0;
overflow: hidden;
-webkit-transition: max-height .3s ease;
transition: max-height .3s ease
}
.o-navBar__creator.active {
max-height: 100px
}
@media only screen and (max-width:479px) {
.o-navBar__creator {
top: 48px
}
}
.o-navbarTop {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-3c321dc2 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3c321dc2 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-navbarTop {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
width: auto;
min-height: 64px;
margin-right: 24px;
margin-left: 24px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-navbarTop {
margin-right: 24px;
margin-left: 24px
}
}
@media only screen and (max-width:479px) {
.o-navbarTop {
width: calc(100% - 32px);
min-height: 48px;
margin-right: 16px;
margin-left: 16px
}
}
@media only screen and (max-width:359px) {
.o-navbarTop {
width: calc(100% - 16px);
min-height: 48px;
margin-right: 8px;
margin-left: 8px
}
}
.o-navbarTop__nav {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-navbarTop__search {
margin-right: -8px
}
.o-navbarTop__search--fieldVisible {
width: 240px
}
.o-navbarTop__search--fieldVisibleSp {
position: fixed;
top: 0;
left: 0;
z-index: 1000;
width: 100%;
padding: 4px;
background-color: #fff;
border-bottom: 1px solid #e6e6e6
}
.o-navbarTop__navItem {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-left: 16px
}
@media only screen and (max-width:359px) {
.o-navbarTop__navItem {
margin-left: 8px
}
}
@media only screen and (max-width:479px) {
.o-navbarTop__navItem--entry,
.o-navbarTop__navItem--login {
margin-left: 0
}
}
.o-navbarTop__navItem--home {
margin-right: -4px;
color: #a8abb1
}
@media only screen and (min-width:769px) {
.o-navbarTop__navItem--home {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-navbarTop__navItem--home:hover {
color: #787c7b
}
}
.m-siteLogo {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-e26e4412 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-e26e4412 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-siteLogo__link {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.m-siteLogo__image {
max-width: 250px;
max-height: 100px;
vertical-align: top;
}
@media only screen and (max-width:479px) {
.m-siteLogo__image {
max-width: 160px;
max-height: 64px;
}
}
@media only screen and (max-width:359px) {
.m-siteLogo__image {
max-width: 140px;
max-height: 58px
}
}
.a-button:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-7c9718b1 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-7c9718b1 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-button {
display: inline-block;
display: -webkit-inline-box;
display: inline-flex;
min-height: 40px;
padding: 0 16px;
margin: 0;
font-weight: 700;
line-height: 1;
color: #787c7b;
text-align: center;
text-decoration: none;
white-space: nowrap;
vertical-align: top;
touch-action: manipulation;
cursor: pointer;
background: #fff;
border: none;
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.a-button,
.a-button .a-button__inner {
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center
}
.a-button .a-button__inner {
font-size: 14px;
display: -webkit-box;
display: flex
}
.a-button[data-type=none] {
color: #787c7b
}
@media only screen and (min-width:769px) {
.a-button[data-type=none] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=none]:hover {
color: #222
}
}
.a-button[data-type=disabled] {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc
}
@media only screen and (min-width:769px) {
.a-button[data-type=disabled] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=disabled]:hover {
background-color: #b3b3b3
}
}
.a-button[data-type=basic] {
color: #222;
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.a-button[data-type=basic] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=basic]:hover {
border: 1px solid #a8abb1
}
}
.a-button[data-type=primary] {
color: #fff;
background-color: #2cb696;
background-color: var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=primary] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=primary]:hover {
background-color: #228d74;
background-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=secondary] {
color: #2cb696;
color: var(--customPrimaryColor);
border: 1px solid #2cb696;
border: 1px solid var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=secondary] {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=secondary]:hover {
color: #2cb696;
color: var(--customPrimaryColor);
border-color: #228d74;
border-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=danger] {
color: #fff;
background-color: #ed4956
}
@media only screen and (min-width:769px) {
.a-button[data-type=danger] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=danger]:hover {
background-color: #e81b2b
}
}
.a-button[data-type=twitter] {
color: #fff;
background-color: #55acee
}
@media only screen and (min-width:769px) {
.a-button[data-type=twitter] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=twitter]:hover {
background-color: #2795e9
}
}
.a-button[data-type=facebook] {
color: #fff;
background-color: #1877f2
}
@media only screen and (min-width:769px) {
.a-button[data-type=facebook] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=facebook]:hover {
background-color: #0b5fcc
}
}
.a-button[data-size=small] {
min-height: 32px
}
@media only screen and (max-width:479px) {
.a-button[data-size=small] {
padding-right: 12px;
padding-left: 12px
}
}
.a-button[data-size=small] .a-button__inner {
font-size: 12px
}
.a-button[data-size=large] {
min-height: 48px
}
.a-button[data-size=large] .a-button__inner {
font-size: 16px
}
.a-button[data-width=fit] {
width: 100%
}
.a-button[data-width=square] {
width: 32px
}
.a-button[data-disable-focus=false]:active,
.a-button[data-disable-focus=false]:hover,
.a-button[data-disable-focus=true]:focus {
outline: none
}
.a-button:disabled {
color: hsla(0, 0%, 100%, .5);
cursor: not-allowed;
background-color: #ccc;
border: none;
-webkit-transition: none;
transition: none
}
@media only screen and (min-width:769px) {
.a-button:disabled:hover {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc;
border: none
}
}
.a-button--icon {
padding-right: 0;
padding-left: 0
}
.a-button--icon .a-button__icon {
margin-right: 0
}
.a-link:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-7c9718b1 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-7c9718b1 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-link {
cursor: pointer
}
.a-link:active,
.a-link:hover {
outline: none
}
.a-link.disabled {
cursor: default
}
.a-link.a-link--underline {
text-decoration: underline
}
.a-image:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-40d4f4cd {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-40d4f4cd {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-image {
background-color: #fff
}
.a-image.a-image--bg-transparent {
background-color: transparent
}
.o-searchWindow {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation- {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation- {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-searchWindow {
width: 280px
}
@media only screen and (max-width:479px) {
.o-searchWindow {
width: auto
}
}
.o-searchWindow__header {
position: relative;
padding: 12px 16px;
cursor: default
}
.o-searchWindow__title {
font-size: 12px;
font-weight: 700;
cursor: default
}
.o-searchWindow__deleteAll {
position: absolute;
top: 12px;
right: 16px;
color: #2cb696;
color: var(--customPrimaryColor);
font-size: 12px;
cursor: pointer
}
.o-searchWindow__body {
width: 100%
}
@media only screen and (max-width:479px) {
.o-searchWindow__body {
padding-bottom: 16px
}
}
.o-searchWindow__item {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
width: 100%
}
.o-searchWindow__item:last-child {
border-radius: 0 0 4px 4px
}
.o-searchWindow__item--header {
border-bottom: 1px solid #f2f2f2
}
@media only screen and (min-width:769px) {
.o-searchWindow__item:hover {
background-color: #f7f9f9
}
}
.o-searchWindow__link {
position: relative;
display: block;
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-align: center;
align-items: center;
padding: 12px 16px;
overflow: hidden;
color: #787c7b;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
font-size: 14px
}
@media only screen and (min-width:769px) {
.o-searchWindow__link:hover {
color: #222
}
}
.o-searchWindow__avatar {
margin-right: 8px
}
.o-searchWindow__label {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.o-searchWindow__hash {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 32px;
min-width: 32px;
height: 32px;
margin-right: 8px;
background-color: #fff;
border: 1px solid #f2f2f2;
border-radius: 32px
}
.o-searchWindow__hash:before {
font-weight: 700;
color: #787c7b;
content: "#";
font-size: 16px
}
.o-searchWindow__official {
position: absolute;
top: 8px;
left: 8px;
color: #2cb696;
color: var(--customPrimaryColor)
}
.o-searchWindow__delete {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 12px 16px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-searchWindow__delete:hover {
color: #787c7b
}
}
.m-iconWithtext:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-f037c0a8 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-f037c0a8 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-iconWithtext {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.m-iconWithtext__form {
position: relative;
width: 100%
}
.m-iconWithtext__fieldInput {
padding-right: 40px !important
}
.m-iconWithtext__submit {
position: absolute;
top: 50%;
right: 8px;
color: #a8abb1;
cursor: pointer;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
@media only screen and (min-width:769px) {
.m-iconWithtext__submit {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.m-iconWithtext__submit:hover {
color: #787c7b
}
}
.m-iconWithtext__close {
padding: 8px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.m-iconWithtext__close {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.m-iconWithtext__close:hover {
color: #787c7b
}
}
.m-iconWithtext__button {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 8px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.m-iconWithtext__button {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.m-iconWithtext__button:hover {
color: #787c7b
}
}
.a-input:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-84a6d3fa {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-84a6d3fa {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-input {
display: inline-block;
min-height: 40px;
padding: 4px 8px;
line-height: 1.5;
color: #222;
vertical-align: top;
background: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
font-size: 14px
}
@media only screen and (max-width:479px) {
.a-input {
font-size: 16px
}
}
.a-input:focus {
border: 1px solid #a8abb1;
outline: none
}
.a-input::-webkit-input-placeholder {
color: rgba(34, 34, 34, .3)
}
.a-input::-moz-placeholder {
color: rgba(34, 34, 34, .3)
}
.a-input:-ms-input-placeholder {
color: rgba(34, 34, 34, .3)
}
.a-input::-ms-input-placeholder {
color: rgba(34, 34, 34, .3)
}
.a-input::placeholder {
color: rgba(34, 34, 34, .3)
}
@media only screen and (min-width:769px) {
.a-input:not(:disabled) {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-input:not(:disabled):hover {
border: 1px solid #a8abb1
}
}
.a-input:disabled {
color: #fff;
cursor: not-allowed;
background-color: #e6e6e6
}
.a-input--size_small {
min-height: 32px
}
.a-input--size_small .a-input__label {
font-size: 12px
}
.a-input--size_large {
min-height: 48px
}
.a-input--size_large .a-input__label {
font-size: 16px
}
.a-input--width_fit {
width: 100%
}
.a-input--width_4length {
width: 80px
}
.a-input--width_8length {
width: 160px
}
:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
@-webkit-keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@font-face {
font-family: "icon";
src: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/icon.5227f28.eot);
src: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/icon.5227f28.eot?#iefix) format("eot"), url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/icon.59ea0d8.woff) format("woff"), url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/fonts/icon.c55b483.ttf) format("truetype"), url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/img/icon.57f1c16.svg#icon) format("svg");
font-display: swap
}
button.a-icon {
cursor: pointer
}
@media only screen and (min-width:769px) {
button.a-icon {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
button.a-icon:hover {
color: #787c7b
}
}
.a-icon {
position: relative;
display: inline-block;
width: 24px;
height: 24px;
font-family: "icon";
font-size: 24px;
line-height: 1;
color: inherit;
vertical-align: top;
touch-action: manipulation;
background-color: transparent;
border: none;
border-radius: 24px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.a-icon:active,
.a-icon:hover {
outline: none
}
.a-icon:before {
position: absolute;
top: 0;
left: 0;
font-family: "icon";
font-style: normal;
font-weight: 400;
-webkit-font-feature-settings: normal;
font-feature-settings: normal;
font-variant: normal;
line-height: 1;
text-decoration: none;
text-transform: none;
vertical-align: middle
}
.a-icon--size_small {
width: 16px;
height: 16px;
font-size: 16px;
border-radius: 16px
}
.a-icon--size_large {
width: 32px;
height: 32px;
font-size: 32px;
border-radius: 32px
}
.a-icon--add:before {
content: "\f001"
}
.a-icon--amazon:before {
content: "\f002"
}
.a-icon--arrowback:before {
content: "\f003"
}
.a-icon--arrowdropdown:before {
content: "\f004"
}
.a-icon--arrowforward:before {
content: "\f005"
}
.a-icon--arrowright:before {
content: "\f006"
}
.a-icon--attachFile:before {
content: "\f007"
}
.a-icon--badge:before {
content: "\f008"
}
.a-icon--camera:before {
content: "\f009"
}
.a-icon--cameraPlus:before {
content: "\f00a"
}
.a-icon--check:before {
content: "\f00b"
}
.a-icon--checkCircle:before {
content: "\f00c"
}
.a-icon--circle:before {
content: "\f00d"
}
.a-icon--close:before {
content: "\f00e"
}
.a-icon--code:before {
content: "\f00f"
}
.a-icon--comment:before {
content: "\f010"
}
.a-icon--commentFill:before {
content: "\f011"
}
.a-icon--copy:before {
content: "\f012"
}
.a-icon--create:before {
content: "\f013"
}
.a-icon--download:before {
content: "\f014"
}
.a-icon--drag_handle:before {
content: "\f015"
}
.a-icon--editorBold:before {
content: "\f016"
}
.a-icon--editorCenter:before {
content: "\f017"
}
.a-icon--editorCode:before {
content: "\f018"
}
.a-icon--editorEmbed:before {
content: "\f019"
}
.a-icon--editorFileUpload:before {
content: "\f01a"
}
.a-icon--editorImage:before {
content: "\f01b"
}
.a-icon--editorImageAdd:before {
content: "\f01c"
}
.a-icon--editorLarge:before {
content: "\f01d"
}
.a-icon--editorLink:before {
content: "\f01e"
}
.a-icon--editorMinphoto:before {
content: "\f01f"
}
.a-icon--editorPc:before {
content: "\f020"
}
.a-icon--editorQuotation:before {
content: "\f021"
}
.a-icon--editorSmall:before {
content: "\f022"
}
.a-icon--editorTitle:before {
content: "\f023"
}
.a-icon--editorTrash:before {
content: "\f024"
}
.a-icon--expandless:before {
content: "\f025"
}
.a-icon--expandmore:before {
content: "\f026"
}
.a-icon--eye:before {
content: "\f027"
}
.a-icon--facebookFill:before {
content: "\f028"
}
.a-icon--fileDownload:before {
content: "\f029"
}
.a-icon--firstpage:before {
content: "\f02a"
}
.a-icon--flagFill:before {
content: "\f02b"
}
.a-icon--follow:before {
content: "\f02c"
}
.a-icon--following:before {
content: "\f02d"
}
.a-icon--gift:before {
content: "\f02e"
}
.a-icon--hatenaFill:before {
content: "\f02f"
}
.a-icon--heart:before {
content: "\f030"
}
.a-icon--heartFill:before {
content: "\f031"
}
.a-icon--help:before {
content: "\f032"
}
.a-icon--home:before {
content: "\f033"
}
.a-icon--image:before {
content: "\f034"
}
.a-icon--info:before {
content: "\f035"
}
.a-icon--instagramFill:before {
content: "\f036"
}
.a-icon--keyboard:before {
content: "\f037"
}
.a-icon--lastpage:before {
content: "\f038"
}
.a-icon--lightbulb:before {
content: "\f039"
}
.a-icon--lineFill:before {
content: "\f03a"
}
.a-icon--linkFill:before {
content: "\f03b"
}
.a-icon--lock:before {
content: "\f03c"
}
.a-icon--magazine:before {
content: "\f03d"
}
.a-icon--magazineAdd:before {
content: "\f03e"
}
.a-icon--magazineGrid:before {
content: "\f03f"
}
.a-icon--magazineList:before {
content: "\f040"
}
.a-icon--magazineStream:before {
content: "\f041"
}
.a-icon--mail:before {
content: "\f042"
}
.a-icon--more:before {
content: "\f043"
}
.a-icon--navbefore:before {
content: "\f044"
}
.a-icon--navnext:before {
content: "\f045"
}
.a-icon--note:before {
content: "\f046"
}
.a-icon--noteAdd:before {
content: "\f047"
}
.a-icon--notification:before {
content: "\f048"
}
.a-icon--pause:before {
content: "\f049"
}
.a-icon--person:before {
content: "\f04a"
}
.a-icon--pin:before {
content: "\f04b"
}
.a-icon--place:before {
content: "\f04c"
}
.a-icon--playFill:before {
content: "\f04d"
}
.a-icon--postNote:before {
content: "\f04e"
}
.a-icon--public:before {
content: "\f04f"
}
.a-icon--return:before {
content: "\f050"
}
.a-icon--rss:before {
content: "\f051"
}
.a-icon--satisfied:before {
content: "\f052"
}
.a-icon--search:before {
content: "\f053"
}
.a-icon--setting:before {
content: "\f054"
}
.a-icon--share:before {
content: "\f055"
}
.a-icon--shoppingcart:before {
content: "\f056"
}
.a-icon--shoppingcartFill:before {
content: "\f057"
}
.a-icon--sort:before {
content: "\f058"
}
.a-icon--tag:before {
content: "\f059"
}
.a-icon--time:before {
content: "\f05a"
}
.a-icon--topic:before {
content: "\f05b"
}
.a-icon--twitterFill:before {
content: "\f05c"
}
.a-icon--undo:before {
content: "\f05d"
}
.a-icon--view:before {
content: "\f05e"
}
.a-icon--viewOff:before {
content: "\f05f"
}
.a-icon--warning:before {
content: "\f060"
}
.a-icon--yen:before {
content: "\f061"
}
.a-icon--yenFill:before {
content: "\f062"
}
.a-icon--youtubeFill:before {
content: "\f063"
}
.o-notification__popover:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-0a8a3793 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-0a8a3793 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-notification__popover {
width: 300px;
height: 400px;
background-color: #fff
}
@media only screen and (max-width:479px) {
.o-notification__popover {
width: 100%;
height: 100%
}
}
.m-notificationBell:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-08842544 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-08842544 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-notificationBell {
position: relative
}
.m-notificationBell__icon {
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.m-notificationBell__icon {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.m-notificationBell__icon:hover {
color: #787c7b
}
}
.m-notificationBell__badge {
position: absolute;
top: -6px;
right: -6px;
padding: 2px 4px;
font-weight: 700;
line-height: 1;
color: #fff;
white-space: nowrap;
pointer-events: none;
background-color: #ed4956;
border-radius: 4px;
font-size: 12px
}
.o-usermenuPopover:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-418a0247 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-418a0247 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-usermenuPopover__avatar {
cursor: pointer;
opacity: .9
}
@media only screen and (min-width:769px) {
.o-usermenuPopover__avatar {
-webkit-transition: opacity .2s cubic-bezier(1, 0, 0, 1);
transition: opacity .2s cubic-bezier(1, 0, 0, 1)
}
.o-usermenuPopover__avatar:hover {
opacity: 1
}
}
.o-usermenuPopover__body {
position: relative;
width: 220px
}
@media only screen and (max-width:479px) {
.o-usermenuPopover__body {
width: auto;
padding-top: 8px
}
}
.o-usermenuPopover__item {
font-size: 12px
}
@media only screen and (max-width:479px) {
.o-usermenuPopover__item {
font-size: 14px
}
}
.o-usermenuPopover__item.is-first {
border-top: none
}
.o-usermenuPopover__item--separate {
position: relative
}
.o-usermenuPopover__item--separate:before {
display: block;
width: 100%;
height: 1px;
margin-top: 8px;
margin-bottom: 8px;
content: "";
background-color: #f2f2f2
}
.o-usermenuPopover__item--separate:empty:before {
height: 0;
margin: 0
}
.o-usermenuPopover__item--profile {
display: -webkit-box;
display: flex
}
.o-usermenuPopover__item--profile>:first-child {
-webkit-box-flex: 2;
flex-grow: 2
}
.o-usermenuPopover__header {
display: block;
padding: 4px 16px;
color: #787c7b
}
.o-usermenuPopover__link {
display: block;
width: 100%;
padding: 8px 16px;
color: #222;
text-align: left
}
@media only screen and (max-width:479px) {
.o-usermenuPopover__link {
padding: 12px 16px
}
}
@media only screen and (min-width:769px) {
.o-usermenuPopover__link {
cursor: pointer
}
.o-usermenuPopover__link:hover {
background-color: #f7f9f9
}
}
.o-usermenuPopover__probanner {
display: block
}
@media only screen and (max-width:479px) {
.o-usermenuPopover__probanner {
margin: 14px 16px;
overflow: hidden;
border-radius: 4px
}
}
.o-usermenuPopover__probannerImage {
width: 100%;
vertical-align: top
}
.o-usermenuPopover__profile {
display: block;
font-weight: 700;
word-break: break-all
}
.o-usermenuPopover__summary {
display: block;
font-size: 12px;
color: #787c7b
}
.o-usermenuPopover__onboardingItem {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 16px
}
@media only screen and (min-width:769px) {
.o-usermenuPopover__onboardingItem {
cursor: pointer
}
.o-usermenuPopover__onboardingItem:hover {
background-color: #f7f9f9
}
}
.o-usermenuPopover__onboardingLink {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-align: center;
align-items: center
}
.o-usermenuPopover__onboardingIcon {
padding-left: 8px
}
.o-usermenuPopover__onboardingIconImage {
width: 24px;
height: 24px;
padding: 4px;
color: #fff;
border-radius: 50%
}
.o-usermenuPopover__onboardingIconImage[data-type=twitter] {
background-color: #55acee
}
.o-usermenuPopover__onboardingLabel {
font-size: 12px;
font-weight: 700
}
@media only screen and (min-width:769px) {
.o-usermenuPopover__onboardingLabel {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
}
@media only screen and (max-width:479px) {
.o-usermenuPopover__onboardingLabel {
font-size: 14px
}
}
.o-usermenuPopover__onboardingDescription {
margin-top: 4px;
color: #787c7b;
font-size: 12px
}
.o-usermenuPopover__onboardingClose {
position: absolute;
top: 8px;
right: 8px;
line-height: 1;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-usermenuPopover__onboardingClose:hover {
color: #787c7b;
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
}
.a-button:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-59f24ae5 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-59f24ae5 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-button {
display: inline-block;
display: -webkit-inline-box;
display: inline-flex;
min-height: 40px;
padding: 0 16px;
margin: 0;
font-weight: 700;
line-height: 1;
color: #787c7b;
text-align: center;
text-decoration: none;
white-space: nowrap;
vertical-align: top;
touch-action: manipulation;
cursor: pointer;
background: #fff;
border: none;
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.a-button,
.a-button .a-button__inner {
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center
}
.a-button .a-button__inner {
font-size: 14px;
display: -webkit-box;
display: flex
}
.a-button[data-type=none] {
color: #787c7b
}
@media only screen and (min-width:769px) {
.a-button[data-type=none] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=none]:hover {
color: #222
}
}
.a-button[data-type=disabled] {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc
}
@media only screen and (min-width:769px) {
.a-button[data-type=disabled] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=disabled]:hover {
background-color: #b3b3b3
}
}
.a-button[data-type=basic] {
color: #222;
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.a-button[data-type=basic] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=basic]:hover {
border: 1px solid #a8abb1
}
}
.a-button[data-type=primary] {
color: #fff;
background-color: #2cb696;
background-color: var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=primary] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=primary]:hover {
background-color: #228d74;
background-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=secondary] {
color: #2cb696;
color: var(--customPrimaryColor);
border: 1px solid #2cb696;
border: 1px solid var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=secondary] {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=secondary]:hover {
color: #2cb696;
color: var(--customPrimaryColor);
border-color: #228d74;
border-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=danger] {
color: #fff;
background-color: #ed4956
}
@media only screen and (min-width:769px) {
.a-button[data-type=danger] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=danger]:hover {
background-color: #e81b2b
}
}
.a-button[data-type=twitter] {
color: #fff;
background-color: #55acee
}
@media only screen and (min-width:769px) {
.a-button[data-type=twitter] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=twitter]:hover {
background-color: #2795e9
}
}
.a-button[data-type=facebook] {
color: #fff;
background-color: #1877f2
}
@media only screen and (min-width:769px) {
.a-button[data-type=facebook] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=facebook]:hover {
background-color: #0b5fcc
}
}
.a-button[data-size=small] {
min-height: 32px
}
@media only screen and (max-width:479px) {
.a-button[data-size=small] {
padding-right: 12px;
padding-left: 12px
}
}
.a-button[data-size=small] .a-button__inner {
font-size: 12px
}
.a-button[data-size=large] {
min-height: 48px
}
.a-button[data-size=large] .a-button__inner {
font-size: 16px
}
.a-button[data-width=fit] {
width: 100%
}
.a-button[data-width=square] {
width: 32px
}
.a-button[data-disable-focus=false]:active,
.a-button[data-disable-focus=false]:hover,
.a-button[data-disable-focus=true]:focus {
outline: none
}
.a-button:disabled {
color: hsla(0, 0%, 100%, .5);
cursor: not-allowed;
background-color: #ccc;
border: none;
-webkit-transition: none;
transition: none
}
@media only screen and (min-width:769px) {
.a-button:disabled:hover {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc;
border: none
}
}
.a-button--icon {
padding-right: 0;
padding-left: 0
}
.a-button--icon .a-button__icon {
margin-right: 0
}
.m-avatar:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-9346dab8 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-9346dab8 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-avatar {
display: block;
overflow: hidden;
border-radius: 4px
}
.m-avatar:active,
.m-avatar:hover {
outline: none
}
.m-avatar__image {
width: 100%;
max-width: 100%;
height: auto
}
.m-avatar--xsmall {
width: 16px;
height: 16px;
border-radius: 16px
}
.m-avatar--small {
width: 24px;
height: 24px;
border-radius: 24px
}
.m-avatar--medium {
width: 32px;
height: 32px;
border-radius: 32px
}
.m-avatar--large {
width: 56px;
height: 56px;
border-radius: 56px
}
.m-avatar--xlarge {
width: 80px;
height: 80px;
border-radius: 80px
}
.m-avatar--xxlarge {
width: 104px;
height: 104px;
border-radius: 104px
}
.m-avatar--fit {
width: 100%;
height: 100%;
border-radius: 100%
}
.o-postNote:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-3545bbc6 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3545bbc6 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-postNote__body {
width: 440px;
padding: 24px
}
@media only screen and (max-width:479px) {
.o-postNote__body {
width: auto
}
}
.o-postNote__list {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between
}
@media only screen and (max-width:479px) {
.o-postNote__list {
-webkit-box-pack: start;
justify-content: flex-start
}
}
.o-postNote__item {
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
margin-right: 8px;
margin-left: 8px;
white-space: nowrap
}
@media only screen and (min-width:769px) {
.o-postNote__item:hover .o-postNote__itemLabel {
color: #222;
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
}
@media only screen and (max-width:479px) {
.o-postNote__item {
width: 33.3333%;
margin-right: 0;
margin-bottom: 24px;
margin-left: 0
}
}
.o-postNote__item.is-disabled {
pointer-events: none;
cursor: default
}
.o-postNote__item.is-disabled .o-postNote__itemIcon--textnote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB2aWV3Qm94PSIwIDAgNjAgNjAiIHdpZHRoPSI2MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBvcGFjaXR5PSIuMyI+PHBhdGggZD0ibTYwIDMwYzAgMTYuNTY4LTEzLjQzMiAzMC0zMCAzMHMtMzAtMTMuNDMyLTMwLTMwIDEzLjQzMi0zMCAzMC0zMCAzMCAxMy40MzIgMzAgMzAiIGZpbGw9IiNkZWRlZGUiLz48cGF0aCBkPSJtMTcuODE4IDM1LjczMy0zLjgxOCAxMi4yNjcgMTIuMjY3LTMuODE4eiIgZmlsbD0iI2Y1ZjVmNSIvPjxwYXRoIGQ9Im00Ny4yNSAxNy41MDctNS42MDItNS42MDMtNC4xMzcgNC4xMzYtMTkuNjk0IDE5LjY5MyA1LjYwNCA1LjYwNCAyLjg0NiAyLjg0NSAxOS42OTMtMTkuNjkzIDQuMTM3LTQuMTM2eiIgZmlsbD0iI2U4ZThlOCIvPjxwYXRoIGQ9Im00Ny4yNSAxNy41MDctNS42MDItNS42MDMtNC4xMzcgNC4xMzYgOC40NDggOC40NDkgNC4xMzctNC4xMzZ6IiBmaWxsPSIjYzRjNGM0Ii8+PHBhdGggZD0ibTE0IDQ4IDUuNjA3LTEuNzQ1LTMuODYyLTMuODYzeiIgZmlsbD0iI2IwYWVhOSIvPjxwYXRoIGQ9Im0yMy40MiA0MS4zMzcgMi44NDcgMi44NDQgMTkuNjkzLTE5LjY5MS0yLjg0Ni0yLjg0NnoiIGZpbGw9IiNkYmRiZGIiLz48cGF0aCBkPSJtNDcuMjUgMTcuNTA3LTQuMTM2IDQuMTM2IDIuODQ2IDIuODQ2IDQuMTM2LTQuMTM2eiIgZmlsbD0iI2FiYWJhYiIvPjwvZz48L3N2Zz4=)
}
.o-postNote__item.is-disabled .o-postNote__itemIcon--soundnote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB2aWV3Qm94PSIwIDAgNjAgNjAiIHdpZHRoPSI2MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBvcGFjaXR5PSIuMyI+PHBhdGggZD0ibTYwIDMwYzAgMTYuNTY4LTEzLjQzMiAzMC0zMCAzMHMtMzAtMTMuNDMyLTMwLTMwIDEzLjQzMi0zMCAzMC0zMCAzMCAxMy40MzIgMzAgMzAiIGZpbGw9IiNkZWRlZGUiLz48cGF0aCBkPSJtMjAgNDMuMTRjMCAxLjAyNzI0OTYtLjgzMjc1MDQgMS44Ni0xLjg2IDEuODZoLTEuMjhjLTEuMDI3MjQ5NiAwLTEuODYtLjgzMjc1MDQtMS44Ni0xLjg2di0xNC4yOGMwLTEuMDI3MjQ5Ni44MzI3NTA0LTEuODYgMS44Ni0xLjg2aDEuMjhjMS4wMjcyNDk2IDAgMS44Ni44MzI3NTA0IDEuODYgMS44NnptMjQgMGMwIDEuMDI3MjQ5Ni0uODMyNzUwNCAxLjg2LTEuODYgMS44NmgtMS4yOGMtMS4wMjcyNDk2IDAtMS44Ni0uODMyNzUwNC0xLjg2LTEuODZ2LTE0LjI4YzAtMS4wMjcyNDk2LjgzMjc1MDQtMS44NiAxLjg2LTEuODZoMS4yOGMxLjAyNzI0OTYgMCAxLjg2LjgzMjc1MDQgMS44NiAxLjg2eiIgZmlsbD0iI2IwYjBiMCIvPjxwYXRoIGQ9Im0zMC4wOCAxNGM5LjIxNiAwIDEzLjkyIDMuODM2IDEzLjkyIDEyLjIwM3YxOS43OTdoMS4zOGMuNDYzIDAgNS42Mi0yLjM5NCA1LjYyLTUuNjk4di03LjcwN2MwLTMuMzAzLTIuNzg5LTUuODk2LTIuNzg5LTUuODk2cy0xLjE5NS0xNy4yMjUtMTguMTMtMTcuMjI1bC0uMDguMDU4di0uMDU4Yy0xNy4xODMgMC0xOC4xNzIgMTcuMjI1LTE4LjE3MiAxNy4yMjVzLTIuODI5IDIuNTkzLTIuODI5IDUuODk2djcuNzA3YzAgMy4zMDQgNS4xNTcgNS42OTggNS42MiA1LjY5OGguMzh2LTE5Ljc5N2MxLTguMzY3IDUuNDU0LTEyLjIwMyAxNS0xMi4yMDN6IiBmaWxsPSIjZjVmNWY1Ii8+PC9nPjwvc3ZnPg==)
}
.o-postNote__item.is-disabled .o-postNote__itemLabel {
color: #a8abb1
}
.o-postNote__itemLink {
display: block;
cursor: pointer
}
.o-postNote__itemIcon {
display: block;
width: 60px;
height: 60px;
margin-right: auto;
margin-bottom: 8px;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-postNote__itemIcon {
width: 72px;
height: 72px;
background-size: 72px
}
}
.o-postNote__itemIcon--talknote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB3aWR0aD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJtNjAgMzBjMCAxNi41NjktMTMuNDMxIDMwLTMwIDMwcy0zMC0xMy40MzEtMzAtMzAgMTMuNDMxLTMwIDMwLTMwIDMwIDEzLjQzMSAzMCAzMCIgZmlsbD0iIzJkY2RiNCIvPjxwYXRoIGQ9Im0zMC40NyAxMi41MDNjLTEwLjk4LS4xODEtMTkuOTg2IDcuNzEtMjAuMTIgMTcuNjI3LS4xMzMgOS45MTYgOC42NTggMTYuNjU3IDE5LjYzNiAxNi44MzggMS4wNTUuMDE3IDMuMTA0LS4xNjggMy4xMDQtLjE2OGw3LjQxIDUuN3YtNi41YzAtMS4xOTMtLjI4LTEuNjctLjU1Ni0uMjY2IDYuNzktNC4yODQgMTAuMDg1LTkuMzE0IDEwLjE2MS0xNC45NS4xMzQtOS45MTYtOC42NTctMTguMTAxLTE5LjYzNS0xOC4yOCIgZmlsbD0iI2ZmZiIvPjxwYXRoIGQ9Im0yMy42NjYgMzAuNWEyLjUgMi41IDAgMSAxIC00Ljk5OSAwIDIuNSAyLjUgMCAwIDEgNSAwbTkuMTY3IDBhMi41IDIuNSAwIDEgMSAtNSAwIDIuNSAyLjUgMCAwIDEgNSAwbTkuMTY2IDBhMi41IDIuNSAwIDEgMSAtNSAwIDIuNSAyLjUgMCAwIDEgNSAwIiBmaWxsPSIjNDk0ODQ2Ii8+PC9nPjwvc3ZnPg==)
}
.o-postNote__itemIcon--imagenote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB3aWR0aD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxtYXNrIGlkPSJhIiBmaWxsPSIjZmZmIj48cGF0aCBkPSJtLjgwNyAxaDEuMjc5di0uMDNoLTEuMjc5eiIgZmlsbD0iI2ZmZiIgZmlsbC1ydWxlPSJldmVub2RkIi8+PC9tYXNrPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PHBhdGggZD0ibTYwIDMwYzAgMTYuNTY4LTEzLjQzMiAzMC0zMCAzMHMtMzAtMTMuNDMyLTMwLTMwIDEzLjQzMi0zMCAzMC0zMCAzMCAxMy40MzIgMzAgMzAiIGZpbGw9IiNiZWU2ZjAiLz48cGF0aCBkPSJtMiAxIC4wODYtLjAwMmMtLjQyOS0uMDAxLS44NTMtLjAxNi0xLjI3OS0uMDI4LjM5Ny4wMTUuNzkzLjAzIDEuMTkzLjAzIiBmaWxsPSIjYmVlNmYwIiBtYXNrPSJ1cmwoI2EpIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgyOCA1OSkiLz48cGF0aCBkPSJtMzguMDQ0IDM5LjM0NyAxMS45MiAxMy4wNGEzMC4xNTQgMzAuMTU0IDAgMCAwIDUuMjI2LTYuMTAzbC0xMS43NDMtMTIuNzQxeiIgZmlsbD0iIzZlOGMyZSIvPjxwYXRoIGQ9Im0zMCA2MGM3LjY2NyAwIDE0LjY2LTIuODgxIDE5Ljk2My03LjYxM2wtMTEuOTE5LTEzLjA0LTExLjc0My0xMi44NDctMjAuNjIxIDIxLjA1NmM1LjQ1IDcuNTM2IDE0LjMwOSAxMi40NDQgMjQuMzIgMTIuNDQ0IiBmaWxsPSIjOTBiMjNkIi8+PHBhdGggZD0ibTQ1LjE1NiAyMC44NDVhMy44NDUgMy44NDUgMCAwIDEgLTMuODQ2IDMuODQ2IDMuODQ1IDMuODQ1IDAgMCAxIC0zLjg0Ny0zLjg0NiAzLjg0NSAzLjg0NSAwIDAgMSAzLjg0Ny0zLjg0NiAzLjg0NSAzLjg0NSAwIDAgMSAzLjg0NiAzLjg0NiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=)
}
.o-postNote__itemIcon--textnote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB3aWR0aD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJtNjAgMzBjMCAxNi41NjgtMTMuNDMyIDMwLTMwIDMwcy0zMC0xMy40MzItMzAtMzAgMTMuNDMyLTMwIDMwLTMwIDMwIDEzLjQzMiAzMCAzMCIgZmlsbD0iI2ZmZDAwMyIvPjxwYXRoIGQ9Im0xNy44MTggMzUuNzMzLTMuODE4IDEyLjI2NyAxMi4yNjctMy44MTh6IiBmaWxsPSIjZmZmIi8+PHBhdGggZD0ibTQ3LjI1IDE3LjUwNy01LjYwMi01LjYwMy00LjEzNyA0LjEzNi0xOS42OTQgMTkuNjkzIDUuNjA0IDUuNjA0IDIuODQ2IDIuODQ1IDE5LjY5My0xOS42OTMgNC4xMzctNC4xMzZ6IiBmaWxsPSIjZmZkMDAzIi8+PHBhdGggZD0ibTQ3LjI1IDE3LjUwNy01LjYwMi01LjYwMy00LjEzNyA0LjEzNiA4LjQ0OCA4LjQ0OSA0LjEzNy00LjEzNnoiIGZpbGw9IiNkZDcwNDciLz48cGF0aCBkPSJtMTQgNDggNS42MDctMS43NDUtMy44NjItMy44NjN6IiBmaWxsPSIjNDk0ODQ2Ii8+PHBhdGggZD0ibTIzLjQyIDQxLjMzNyAyLjg0NyAyLjg0NCAxOS42OTMtMTkuNjkxLTIuODQ2LTIuODQ2eiIgZmlsbD0iI2U0YmEyYSIvPjxwYXRoIGQ9Im00Ny4yNSAxNy41MDctNC4xMzYgNC4xMzYgMi44NDYgMi44NDYgNC4xMzYtNC4xMzZ6IiBmaWxsPSIjYzU2NTQ1Ii8+PC9nPjwvc3ZnPg==)
}
.o-postNote__itemIcon--soundnote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB3aWR0aD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJtNjAgMzBjMCAxNi41NjgtMTMuNDMyIDMwLTMwIDMwcy0zMC0xMy40MzItMzAtMzAgMTMuNDMyLTMwIDMwLTMwIDMwIDEzLjQzMiAzMCAzMCIgZmlsbD0iI2RkNzA0NyIvPjxwYXRoIGQ9Im0yMCA0My4xNGExLjg2IDEuODYgMCAwIDEgLTEuODYgMS44NmgtMS4yOGExLjg2IDEuODYgMCAwIDEgLTEuODYtMS44NnYtMTQuMjhhMS44NiAxLjg2IDAgMCAxIDEuODYtMS44NmgxLjI4YTEuODYgMS44NiAwIDAgMSAxLjg2IDEuODZ6bTI0IDBhMS44NiAxLjg2IDAgMCAxIC0xLjg2IDEuODZoLTEuMjhhMS44NiAxLjg2IDAgMCAxIC0xLjg2LTEuODZ2LTE0LjI4YTEuODYgMS44NiAwIDAgMSAxLjg2LTEuODZoMS4yOGExLjg2IDEuODYgMCAwIDEgMS44NiAxLjg2eiIgZmlsbD0iIzQ5NDg0NiIvPjxwYXRoIGQ9Im0zMC4wOCAxNGM5LjIxNiAwIDEzLjkyIDMuODM2IDEzLjkyIDEyLjIwM3YxOS43OTdoMS4zOGMuNDYzIDAgNS42Mi0yLjM5NCA1LjYyLTUuNjk4di03LjcwN2MwLTMuMzAzLTIuNzg5LTUuODk2LTIuNzg5LTUuODk2cy0xLjE5NS0xNy4yMjUtMTguMTMtMTcuMjI1bC0uMDguMDU4di0uMDU4Yy0xNy4xODMgMC0xOC4xNzIgMTcuMjI1LTE4LjE3MiAxNy4yMjVzLTIuODI5IDIuNTkzLTIuODI5IDUuODk2djcuNzA3YzAgMy4zMDQgNS4xNTcgNS42OTggNS42MiA1LjY5OGguMzh2LTE5Ljc5N2MxLTguMzY3IDUuNDU0LTEyLjIwMyAxNS0xMi4yMDN6IiBmaWxsPSIjZmZmIi8+PC9nPjwvc3ZnPg==)
}
.o-postNote__itemIcon--movienote {
background-image: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjYwIiB3aWR0aD0iNjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJtNjAgMzBjMCAxNi41NjgtMTMuNDMyIDMwLTMwIDMwcy0zMC0xMy40MzItMzAtMzAgMTMuNDMyLTMwIDMwLTMwIDMwIDEzLjQzMiAzMCAzMCIgZmlsbD0iIzQ5NDg0NiIvPjxwYXRoIGQ9Im00OSAxMS41aC0zNy43OTVjLS44ODYgMC0xLjcwNS42MTUtMS43MDUgMS41djMyLjg5N2MwIC44ODYuNzE3IDEuNjAzIDEuNjAzIDEuNjAzaDM3Ljc5NWMuODg0IDAgMS42MDItLjcxNyAxLjYwMi0xLjYwM3YtMzIuODk3YzAtLjg4NS0uNjE2LTEuNS0xLjUtMS41IiBmaWxsPSIjZTFlNWU3IiBvcGFjaXR5PSIuMyIvPjxwYXRoIGQ9Im0xMS41IDQ1LjVoNXYtNGgtNXptMC03aDV2LTRoLTV6bTAtN2g1di00aC01em0wLTdoNXYtNGgtNXptMC03aDV2LTRoLTV6bTMyIDI4aDV2LTRoLTV6bTAtN2g1di00aC01em0wLTdoNXYtNGgtNXptMC03aDV2LTRoLTV6bTAtN2g1di00aC01eiIgZmlsbD0iIzQ5NDg0NiIvPjxwYXRoIGQ9Im0yNiAyNHYxMC45bDkuMDgzLTUuNjY4eiIgZmlsbD0iI2ZmZiIvPjwvZz48L3N2Zz4=)
}
.o-postNote__itemLabel {
display: block
}
.o-postNote__attention,
.o-postNote__itemLabel {
color: #787c7b;
text-align: center;
font-size: 14px
}
.o-postNote__attention {
padding-top: 16px;
line-height: 1.5
}
.m-iconButton:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-45107202 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-45107202 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-iconButton .m-iconButton__labelWithIcon {
margin-right: 4px
}
.o-navbarMenu:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-7f1904c0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-7f1904c0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-navbarMenu__notification {
padding: 2px 4px;
margin-left: 4px;
line-height: 1;
color: #fff;
background-color: #787c7b;
border-radius: 4px;
font-size: 12px
}
.o-navbarMenu__menu {
display: -webkit-box;
display: flex;
-webkit-box-pack: start;
justify-content: flex-start;
margin-right: 24px;
margin-left: 8px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-navbarMenu__menu {
display: -webkit-box;
display: flex;
width: auto;
padding-left: 8px;
margin: 0 auto;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch
}
.o-navbarMenu__menu::-webkit-scrollbar {
display: none
}
.o-navbarMenu__menu .a-link {
-webkit-box-flex: 0;
flex: 0 0 auto
}
}
@media only screen and (max-width:768px) {
.o-navbarMenu__menu {
display: -webkit-box;
display: flex;
width: auto;
padding-left: 8px;
margin: 0 auto;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch
}
.o-navbarMenu__menu::-webkit-scrollbar {
display: none
}
}
.a-navItem:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-127cad20 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-127cad20 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-navItem {
display: -webkit-box;
display: flex;
-webkit-box-pack: start;
justify-content: flex-start
}
@media only screen and (max-width:768px) {
.a-navItem {
-webkit-box-flex: 0;
flex: 0 0 auto
}
}
.a-navItem__item {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
font-weight: 700;
line-height: 1;
color: #787c7b;
white-space: nowrap;
cursor: pointer
}
@media only screen and (min-width:769px) {
.a-navItem__item:hover {
color: #222;
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
}
.a-navItem__item:before {
position: absolute;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 2px;
pointer-events: none;
content: "";
background-color: transparent
}
@media only screen and (max-width:768px) {
.a-navItem__item {
-webkit-box-flex: 0;
flex: 0 0 auto
}
}
@media only screen and (min-width:769px) {
.a-navItem__item:hover:before {
background-color: #222;
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
}
.a-navItem__item.is-active {
color: #222
}
.a-navItem__item.is-active:before {
background-color: #222
}
.a-navItem__item--size_small {
height: 40px;
padding: 0 13px;
font-size: 13px
}
@media only screen and (max-width:768px) {
.a-navItem__item--size_small {
padding: 0 8px
}
}
.a-navItem__item--size_medium {
height: 48px;
padding: 0 16px;
font-size: 14px
}
@media only screen and (max-width:768px) {
.a-navItem__item--size_medium {
font-size: 13px;
height: 40px;
padding: 0 8px
}
}
.a-navItem__item--size_large {
height: 64px;
padding: 0 16px;
font-size: 14px
}
@media only screen and (max-width:768px) {
.a-navItem__item--size_large {
padding: 0 8px
}
}
.activationMessage:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-022e6afb {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-022e6afb {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.activationMessage {
width: 100%;
padding: 10px;
font-size: 12px;
line-height: 1;
color: #41c9b4;
text-align: center;
background-color: #f0fbf9;
border-bottom: 1px solid #e6e6e6;
box-shadow: 0 0 1px rgba(34, 34, 34, .08)
}
.activationMessage a:hover {
text-decoration: underline
}
@media only screen and (max-width:479px) {
.activationMessage {
padding: 5px;
font-size: 12px;
line-height: 1.4
}
}
.activationMessage .beforeResend .resend {
font-weight: 700;
text-decoration: underline;
cursor: pointer
}
.activationMessage .beforeResend .resend:hover {
text-decoration: none
}
.p-category:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-427da729 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-427da729 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.p-category {
min-height: 100vh
}
@media only screen and (min-width:768px) and (max-width:940px) {
.p-category {
padding-top: 16px
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.p-category {
padding-top: 16px
}
}
.p-timeline:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-1b97575b {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-1b97575b {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.p-timeline {
margin-top: 16px
}
.o-timelineCategory {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
width: 100%;
max-width: 1920px;
padding: 0 24px 0 8px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory {
display: block;
flex-wrap: wrap;
padding: 0 0 24px
}
}
@media only screen and (max-width:768px) {
.o-timelineCategory {
display: block;
flex-wrap: wrap;
padding: 0 0 24px
}
}
.o-timelineCategory__sideColumn {
-webkit-box-flex: 0;
flex: 0 0 260px;
padding-top: 24px;
padding-right: 0;
margin-left: 40px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__sideColumn {
-webkit-box-flex: 0;
flex: 0 0 240px;
margin-left: 24px
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__sideColumn {
-webkit-box-flex: 0;
flex: 0 0 240px;
margin-left: 24px
}
}
@media only screen and (min-width:769px) {
.o-timelineCategory__categoryMenu {
position: -webkit-sticky;
position: sticky;
top: 0;
width: 192px;
height: 100%;
max-height: 100vh;
padding-top: 24px;
padding-right: 16px;
padding-bottom: 24px;
margin-right: 24px;
overflow-y: auto
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__categoryMenu {
position: static;
top: auto;
width: 100%;
padding: 0;
margin-bottom: 24px;
overflow-y: visible
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__categoryMenu {
width: 100%;
margin-bottom: 24px
}
}
@media only screen and (max-width:479px) {
.o-timelineCategory__categoryMenu {
width: 100%;
margin-top: 16px;
margin-bottom: 16px;
height: 50px;
}
}
.o-timelineCategory__header {
width: 100%;
margin-right: auto;
margin-bottom: 24px;
margin-left: auto
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__header {
width: auto;
margin-right: 0;
margin-left: 0
}
}
@media only screen and (max-width:479px) {
.o-timelineCategory__header {
width: auto;
margin: 8px 16px
}
}
.o-timelineCategory__headerTitle {
margin-bottom: 24px
}
.o-timelineCategory__breadcrumb {
margin-bottom: 8px
}
.o-timelineCategory__title {
font-size: 24px;
font-weight: 700;
letter-spacing: .04em;
word-break: break-all;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1
}
.o-timelineCategory__headerNav {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
min-height: 24px
}
.o-timelineCategory__mainColumn {
-webkit-box-flex: 1;
flex: 1;
width: 100%;
padding-top: 24px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__mainColumn {
padding-top: 0;
padding-right: 16px;
padding-left: 16px
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__mainColumn {
padding-top: 0;
padding-right: 16px;
padding-left: 16px
}
}
@media only screen and (max-width:479px) {
.o-timelineCategory__sort {
background-color: #f7f9f9
}
}
.o-timelineCategory__rss {
color: #a8abb1
}
.o-timelineCategory__body {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-align: start;
align-items: flex-start;
-webkit-box-pack: start;
justify-content: flex-start;
width: auto;
margin-right: -12px;
margin-left: -12px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__body {
margin-right: -8px;
margin-left: -8px
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__body {
width: auto;
margin-right: -8px;
margin-left: -8px
}
}
@media only screen and (max-width:479px) {
.o-timelineCategory__body {
width: auto;
margin: 0
}
}
.o-timelineCategory__body:after,
.o-timelineCategory__body:before {
display: block;
-webkit-box-flex: 1;
flex: 1;
width: 100%;
min-width: 33.33333%;
height: 0;
content: ""
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__body:after,
.o-timelineCategory__body:before {
display: none
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__body:after,
.o-timelineCategory__body:before {
display: none
}
}
.o-timelineCategory__body:before {
-webkit-box-ordinal-group: 2;
order: 1
}
.o-timelineCategory__itemWrapper {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-pack: center;
justify-content: center;
width: 100%;
min-width: 320px;
margin-bottom: 48px
}
@media only screen and (min-width:940px) and (max-width:1280px) {
.o-timelineCategory__itemWrapper {
-webkit-box-flex: 0;
flex: 0 0 auto;
width: 50%;
min-width: 0
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__itemWrapper {
-webkit-box-flex: 0;
flex: 0 0 auto;
width: 50%;
min-width: 0
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__itemWrapper {
-webkit-box-flex: 0;
flex: 0 0 auto;
width: 50%;
min-width: 0
}
}
@media only screen and (max-width:479px) {
.o-timelineCategory__itemWrapper {
-webkit-box-flex: 0;
flex: 0 0 auto;
width: 100%;
min-width: 0
}
}
.o-timelineCategory__itemWrapper:empty {
margin-bottom: 0
}
.o-timelineCategory__item {
width: calc(100% - 24px)
}
@media only screen and (min-width:768px) and (max-width:940px) {
.o-timelineCategory__item {
width: calc(100% - 16px)
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-timelineCategory__item {
width: calc(100% - 16px)
}
}
.o-timelineCategory__loading {
padding-top: 24px
}
.m-categoryMenu:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-108a9501 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-108a9501 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-categoryMenu {
width: 100%;
margin-right: 40px
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu {
display: -webkit-box;
display: flex;
padding-right: 16px;
padding-left: 16px;
margin-right: 0;
overflow-x: scroll
}
.m-categoryMenu::-webkit-scrollbar {
display: none
}
.m-categoryMenu.is-open {
height: 100vh
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu {
display: -webkit-box;
display: flex;
padding-right: 16px;
padding-left: 16px;
margin-right: 0;
overflow-x: scroll
}
.m-categoryMenu::-webkit-scrollbar {
display: none
}
.m-categoryMenu.is-open {
height: 100vh
}
}
@media only screen and (max-width:479px) {
.m-categoryMenu {
padding-right: 16px;
padding-left: 16px
}
}
@media only screen and (min-width:769px) {
.m-categoryMenu__container {
margin-top: -8px;
margin-left: 0
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__container {
display: -webkit-box;
display: flex;
height: 34px;
margin-top: 0;
margin-left: 0
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__container {
display: -webkit-box;
display: flex;
height: 34px
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__section {
position: relative;
margin-right: 8px;
pointer-events: auto
}
.m-categoryMenu__section:last-child {
padding-right: 16px
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__section {
position: relative;
margin-right: 8px;
pointer-events: auto
}
}
@media only screen and (max-width:768px) and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__section:last-child .m-categoryMenu__subCategories {
right: 16px
}
}
@media only screen and (max-width:768px) and (max-width:768px) {
.m-categoryMenu__section:last-child .m-categoryMenu__subCategories {
right: 16px
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__section:last-child .m-categoryMenu__subCategories:before {
right: 30px;
left: auto
}
}
@media only screen and (max-width:479px) {
.m-categoryMenu__section:last-child {
padding-right: 16px
}
}
.m-categoryMenu__title {
display: -webkit-box;
display: flex;
width: 100%;
font-weight: 700;
color: #787c7b;
white-space: nowrap;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
@media only screen and (min-width:769px) {
.m-categoryMenu__title {
padding: 8px
}
.m-categoryMenu__title:focus,
.m-categoryMenu__title:hover {
color: #222;
outline: none
}
.m-categoryMenu__title:focus .m-categoryMenu__titleIcon,
.m-categoryMenu__title:hover .m-categoryMenu__titleIcon {
color: #222
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__title {
display: -webkit-box;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
flex-direction: row-reverse;
-webkit-box-align: center;
align-items: center;
padding: 4px 8px 4px 16px;
line-height: 1;
white-space: nowrap;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 18px;
font-size: 14px
}
.m-categoryMenu__title:focus {
outline: 0
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__title {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
flex-direction: row-reverse;
-webkit-box-align: center;
align-items: center;
padding: 4px 8px 4px 16px;
line-height: 1;
white-space: nowrap;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 18px;
font-size: 13px
}
.m-categoryMenu__title:focus {
outline: 0
}
}
.m-categoryMenu__titleIcon {
color: #ccc
}
@media only screen and (min-width:769px) {
.m-categoryMenu__titleIcon {
margin-right: 4px
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__titleIcon {
margin-right: 0;
-webkit-transform: rotate(90deg);
transform: rotate(90deg)
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__titleIcon {
margin-right: 0;
-webkit-transform: rotate(90deg);
transform: rotate(90deg)
}
}
.m-categoryMenu__titleIcon.is-rotated {
-webkit-transform: rotate(90deg);
transform: rotate(90deg)
}
.m-categoryMenu__subCategories {
z-index: 5;
display: none;
padding-bottom: 16px;
margin-left: 20px;
text-align: left
}
.m-categoryMenu__subCategories.is-block {
display: block
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__subCategories {
position: absolute;
top: 48px;
min-width: 200px;
padding: 8px 0;
margin-left: 0;
background-color: #fff;
border-radius: 4px;
box-shadow: 0 1px 2px rgba(34, 34, 34, .25), 0 0 1px rgba(34, 34, 34, .35)
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__subCategories {
position: absolute;
top: 48px;
min-width: 200px;
padding: 8px 0;
margin-left: 0;
background-color: #fff;
border-radius: 4px;
box-shadow: 0 1px 2px rgba(34, 34, 34, .25), 0 0 1px rgba(34, 34, 34, .35)
}
}
.m-categoryMenu__subCategories:before {
position: absolute;
top: -7px;
left: 32px;
display: none;
width: 12px;
height: 12px;
content: "";
background-color: #fff;
border-right: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg)
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__subCategories:before {
display: block
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__subCategories:before {
display: block
}
}
.m-categoryMenu__subTitle {
display: block;
padding: 4px 16px;
color: #787c7b;
white-space: nowrap;
cursor: pointer;
border-radius: 4px;
font-size: 14px
}
.m-categoryMenu__subTitle.is-active {
font-weight: 700;
color: #2cb696
}
@media only screen and (min-width:769px) {
.m-categoryMenu__subTitle:hover {
color: #222;
background-color: #f7f9f9
}
}
@media only screen and (min-width:768px) and (max-width:940px) {
.m-categoryMenu__subTitle {
padding: 8px 16px;
white-space: nowrap
}
.m-categoryMenu__subTitle:first-child {
margin-top: 0
}
}
@media only screen and (max-width:768px) {
.m-categoryMenu__subTitle {
padding: 8px 16px;
white-space: nowrap
}
.m-categoryMenu__subTitle:first-child {
margin-top: 0
}
}
.m-breadcrumb:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-486fe862 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-486fe862 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-breadcrumb__list {
display: -webkit-box;
display: flex;
overflow-x: auto
}
@media only screen and (max-width:768px) {
.m-breadcrumb__list {
-webkit-overflow-scrolling: touch
}
}
.m-breadcrumb__item {
font-size: 14px;
white-space: nowrap
}
.m-breadcrumb__item:last-child {
pointer-events: none
}
.m-breadcrumb__item:not(:first-child) {
margin-left: 4px
}
.m-breadcrumb__item:not(:first-child):before {
display: inline-block;
width: 10px;
height: 10px;
margin-right: 4px;
content: "";
border: solid #a8abb1;
border-width: 1px 1px 0 0;
-webkit-transform: rotate(45deg) scale(.8) skew(10deg, 10deg);
transform: rotate(45deg) scale(.8) skew(10deg, 10deg)
}
.m-breadcrumb__link {
color: #787c7b
}
@media only screen and (min-width:769px) {
.m-breadcrumb__link {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.m-breadcrumb__link:hover {
color: #222
}
}
.m-buttonGroup:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-0f4d58de {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-0f4d58de {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-buttonGroup {
display: -webkit-box;
display: flex;
-webkit-box-pack: start;
justify-content: flex-start
}
.m-buttonGroup__item {
margin-left: -1px
}
@media only screen and (min-width:769px) {
.m-buttonGroup__item:hover {
z-index: 2
}
}
.m-buttonGroup__item .btn {
display: inline-block;
display: -webkit-inline-box;
display: inline-flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
min-height: 40px;
padding: 0 16px;
margin: 0;
line-height: 1;
color: inherit;
color: #787c7b;
text-align: center;
text-decoration: none;
white-space: nowrap;
vertical-align: top;
background: #fff;
border: 1px solid #e6e6e6;
border-top-left-radius: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.m-buttonGroup__item .btn:active,
.m-buttonGroup__item .btn:hover {
outline: none
}
@media only screen and (min-width:769px) {
.m-buttonGroup__item .btn:hover {
color: #222
}
}
.m-buttonGroup__item .btn--size_small {
min-height: 32px;
font-size: 14px
}
.m-buttonGroup__item .btn--size_large {
min-height: 48px;
font-size: 16px
}
.m-buttonGroup__item:first-child .btn {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px
}
.m-buttonGroup__item:last-child .btn {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px
}
.m-buttonGroup__item .is-active {
color: #222;
background-color: #e6e6e6
}
.o-gridNote:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-55325607 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-55325607 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-gridNote {
width: 100%;
height: 100%
}
.o-gridNote__card {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
height: 100%;
cursor: pointer;
background-color: transparent
}
.o-gridNote__card[data-has-border=true] {
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.o-gridNote__card[data-has-border=true] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.o-gridNote__card[data-has-border=true]:hover {
border: 1px solid #ccc
}
.o-gridNote__card[data-has-border=true]:hover:before {
display: none
}
}
.o-gridNote__card[data-has-border=true] .o-gridNote__eyecatchInner,
.o-gridNote__card[data-has-border=true] .o-gridNote__eyecatchInner--sound {
border-radius: 3px 3px 0 0
}
.o-gridNote__card[data-has-border=true] .o-gridNote__body {
padding: 16px 16px 8px
}
.o-gridNote__card[data-has-border=true] .o-gridNote__footer {
padding: 0 16px 16px;
margin-top: auto
}
.o-gridNote__card[data-has-border=true] .o-gridNote__magazineAdd {
margin: 0 16px 16px
}
@media only screen and (min-width:769px) {
.o-gridNote__card:hover .o-gridNote__eyecatchImage,
.o-gridNote__card:hover .o-gridNote__eyecatchInner {
opacity: .5;
-webkit-transition: opacity .2s ease-in-out;
transition: opacity .2s ease-in-out
}
}
.o-gridNote__link {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 2;
display: block
}
.o-gridNote__eyecatchInner--sound {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 4px
}
.o-gridNote__eyecatchInner--sound:before {
display: block;
width: 100%;
height: 0;
padding-bottom: 100%;
content: ""
}
.o-gridNote__eyecatchInner--sound .o-gridNote__eyecatchImage {
-o-object-fit: cover;
object-fit: cover
}
.o-gridNote__eyecatchInner--sound .o-gridNote__eyecatchImage,
.o-gridNote__eyecatchInner--sound .o-gridNote__eyecatchSound {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%
}
.o-gridNote__eyecatchInner {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 4px
}
.o-gridNote__eyecatchInner:before {
display: block;
width: 100%;
height: 0;
padding-bottom: 52.34375%;
content: ""
}
.o-gridNote__eyecatchInner--image:before {
padding-bottom: 95%
}
.o-gridNote__eyecatchInner--movie {
position: relative;
height: 0;
padding-bottom: 56.25%
}
.o-gridNote__eyecatchInner img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover
}
.o-gridNote__eyecatchInner img.o-gridNote__userIcon {
width: 80px;
height: 80px;
margin: auto;
border: 4px solid #fff;
border-radius: 50%
}
.o-gridNote__eyecatchMovie {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 100%;
height: 100%
}
.o-gridNote__imageCount {
font-size: 12px;
position: absolute;
right: 4px;
bottom: 4px;
z-index: 1;
padding: 2px 4px;
font-weight: 700;
line-height: 1;
color: #fff;
background-color: rgba(34, 34, 34, .7);
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-gridNote__imageCount {
font-size: 10px;
right: 0;
bottom: 0;
border-radius: 4px 0 0 0
}
}
.o-gridNote__pinned {
position: absolute;
top: 8px;
left: 8px;
z-index: 1
}
.o-gridNote__body {
position: relative;
padding: 16px 0 0
}
.o-gridNote__body:last-child {
padding-bottom: 16px
}
.o-gridNote__notification {
position: relative;
z-index: 3;
margin-bottom: 8px
}
.o-gridNote__notification .o-timelineNotificationMessages__recommnededTitle {
margin-bottom: 0
}
.o-gridNote__status {
margin-top: 8px
}
.o-gridNote__footer {
position: relative;
z-index: 3;
padding: 0;
pointer-events: none
}
.o-gridNote__magazineAdd {
position: relative;
z-index: 3;
padding-top: 8px;
margin-top: 8px;
border-top: 1px solid #f2f2f2
}
.o-gridNote__magazineAdd:empty {
display: none
}
.o-gridNote__magazineAdd--position_top {
padding-top: 0;
margin-top: 0;
border-top: none
}
.o-timelinePinnedNote:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-62d239a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-62d239a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-timelinePinnedNote {
font-size: 12px;
color: #787c7b
}
.o-timelinePinnedNote__messageType__icon {
margin-right: 4px
}
@media only screen and (max-width:479px) {
.o-timelinePinnedNote__messageType__icon {
margin-right: 0
}
}
.o-timelinePinnedNote__iconType {
width: 28px;
height: 28px;
color: #787c7b;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 50%
}
.o-timelinePinnedNote__iconType__icon {
position: absolute;
top: 6px;
left: 6px
}
.o-textNote:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-707ac558 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-707ac558 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-textNote__title {
margin-bottom: 8px;
font-weight: 700;
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1;
font-size: 20px;
-webkit-line-clamp: 2
}
.o-textNote__description,
.o-textNote__title {
display: -webkit-box;
overflow: hidden;
line-height: 1.5;
word-break: break-all;
-webkit-box-orient: vertical
}
.o-textNote__description {
color: #787c7b;
text-align: justify;
font-size: 12px
}
.o-textNote__message {
font-size: 12px;
margin-bottom: 8px;
line-height: 1.5;
color: #787c7b
}
.o-noteStatus:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-7007d9d6 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-7007d9d6 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-noteStatus {
display: -webkit-box;
display: flex;
font-size: 14px
}
.o-noteStatus__item {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-right: 8px
}
.o-noteStatus__item--like {
color: #ea3f60
}
.o-noteStatus__item--comment {
color: #787c7b
}
.o-noteStatus__item--price {
color: #2cb696;
color: var(--customPrimaryColor)
}
.o-noteStatus__item--creatorName {
display: block;
overflow: hidden;
color: #787c7b;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 12px
}
.o-noteStatus__item--limitedSale {
margin-left: 8px
}
.o-noteStatus__icon {
height: 16px
}
.o-noteStatus__icon--price {
color: #2cb696;
color: var(--customPrimaryColor)
}
.o-noteStatus__label {
margin-left: 4px;
line-height: 1
}
.o-timelineFooter:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-6ac51c06 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-6ac51c06 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-timelineFooter {
position: relative;
z-index: 4;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 16px 0 0;
pointer-events: none
}
.o-timelineFooter,
.o-timelineFooter__avatar {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-timelineFooter__avatar {
min-width: 0
}
.o-timelineFooter__icon {
margin-right: 8px;
pointer-events: auto
}
.o-timelineFooter__name {
font-size: 14px;
overflow: hidden;
font-weight: 400;
line-height: 1.5;
color: #787c7b;
text-overflow: ellipsis;
white-space: nowrap;
pointer-events: auto
}
@media only screen and (max-width:479px) {
.o-timelineFooter__name {
font-size: 12px
}
}
.o-timelineFooter__action {
pointer-events: auto
}
.o-timelineNoteAction:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-1f35f45c {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-1f35f45c {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-timelineNoteAction {
pointer-events: auto
}
.o-timelineNoteAction__wrap {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 0;
margin-left: 8px;
border: none
}
.o-timelineNoteAction__item {
position: relative;
display: block;
margin-right: 16px;
line-height: 1;
color: #a8abb1;
white-space: nowrap
}
.o-timelineNoteAction__item:last-child {
margin-right: 0
}
.p-action:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-2aa571ba {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-2aa571ba {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.c-card__action {
pointer-events: auto
}
.p-action {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-align: stretch;
align-items: stretch;
padding: 0;
margin-right: 0;
border: none
}
.p-action__item {
position: relative;
display: block;
line-height: 1;
color: #a8abb1;
white-space: nowrap
}
.p-action .p-action__like {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
font-size: 12px;
line-height: 1;
cursor: pointer;
-webkit-tap-highlight-color: transparent
}
.o-noteActionPopover__report {
font-size: 16px;
color: #787c7b
}
.o-noteActionPopover__note {
font-size: 12px;
margin-top: 8px;
line-height: 1.5
}
.o-like:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-78eba018 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-78eba018 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-like {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-like.is-active .o-like__count,
.o-like.is-active .o-like__icon {
color: #ea3f60
}
.o-like__icon {
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-like__icon {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-like__icon:hover {
color: #787c7b
}
}
.o-like__icon.is-animate {
-webkit-animation: effectSuki-o-like .28s;
animation: effectSuki-o-like .28s
}
@-webkit-keyframes effectSuki-o-like {
20% {
opacity: 0;
-webkit-transform: scale(1);
transform: scale(1)
}
48% {
opacity: 1;
-webkit-transform: scale(1.6);
transform: scale(1.6)
}
56% {
-webkit-transform: scale(1.2);
transform: scale(1.2)
}
}
.o-like__icon[data-disable-focus=true]:active,
.o-like__icon[data-disable-focus=true]:focus {
outline: none
}
.o-like__count {
margin-left: 8px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-like__count {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-like__count:hover {
color: #787c7b
}
}
.o-like__pc {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: start;
justify-content: flex-start
}
.o-like__pc.is-active .o-like__pcCount,
.o-like__pc.is-active .o-like__pcIcon {
color: #ea3f60
}
.o-like__pcIcon {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-like__pcIcon {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-like__pcIcon:hover {
color: #787c7b
}
}
.o-like__pcIcon.is-animate {
-webkit-animation: effectSuki-o-like .28s;
animation: effectSuki-o-like .28s
}
@keyframes effectSuki-o-like {
20% {
opacity: 0;
-webkit-transform: scale(1);
transform: scale(1)
}
48% {
opacity: 1;
-webkit-transform: scale(1.6);
transform: scale(1.6)
}
56% {
-webkit-transform: scale(1.2);
transform: scale(1.2)
}
}
.o-like__pcIcon[data-disable-focus=true]:active,
.o-like__pcIcon[data-disable-focus=true]:focus {
outline: none
}
.o-like__pcCount {
margin-left: 8px;
line-height: 1;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-like__pcCount {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-like__pcCount:hover {
color: #787c7b
}
}
.o-like--color_red .o-like__icon {
color: #ea3f60
}
.m-likeThanks:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-2cd961ac {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-2cd961ac {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-likeThanks {
position: absolute;
bottom: 0;
left: -6px;
z-index: 100;
display: -webkit-box;
display: flex;
min-width: 300px;
visibility: hidden;
opacity: 0;
-webkit-transform-origin: 25px bottom;
transform-origin: 25px bottom
}
@media only screen and (max-width:479px) {
.m-likeThanks {
min-width: 270px
}
.m-likeThanks .m-likeThanks__message {
max-width: 190px
}
}
@media only screen and (max-width:479px) {
.m-likeThanks[data-type=spBooster] {
right: -7px;
bottom: 16px;
left: auto;
-webkit-transform-origin: 98% bottom;
transform-origin: 98% bottom
}
.m-likeThanks[data-type=spBooster] .m-likeThanks__balloon {
margin-left: auto
}
}
.m-likeThanks[data-type=pcBooster] {
bottom: -4px;
left: -9px
}
.m-likeThanks[data-type=comment],
.m-likeThanks[data-type=timeline] {
right: -9px;
bottom: -4px;
left: auto;
-webkit-transform-origin: 98% bottom;
transform-origin: 98% bottom
}
.m-likeThanks[data-type=comment] .m-likeThanks__body,
.m-likeThanks[data-type=timeline] .m-likeThanks__body {
padding: 12px
}
.m-likeThanks[data-type=comment] .m-likeThanks__balloon,
.m-likeThanks[data-type=timeline] .m-likeThanks__balloon {
margin-left: auto
}
@media only screen and (max-width:479px) {
.m-likeThanks[data-type=circleBoardComment],
.m-likeThanks[data-type=circleBoardPost] {
min-width: 240px
}
}
@media only screen and (max-width:359px) {
.m-likeThanks[data-type=circleBoardComment],
.m-likeThanks[data-type=circleBoardPost] {
min-width: 200px
}
}
.m-likeThanks__balloon {
position: relative;
text-align: left;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px
}
.m-likeThanks__balloon:before {
position: absolute;
display: block;
width: 12px;
height: 12px;
content: "";
background-color: #fff;
box-shadow: 1px 1px 0 0 #e6e6e6
}
.m-likeThanks__balloon[data-tail-position=bottomLeft]:before {
bottom: -12px;
left: 14px;
-webkit-transform: rotate(45deg) translate(-5px, -5px);
transform: rotate(45deg) translate(-5px, -5px)
}
.m-likeThanks__balloon[data-tail-position=bottomRight]:before {
right: 14px;
bottom: -12px;
-webkit-transform: rotate(45deg) translate(-5px, -5px);
transform: rotate(45deg) translate(-5px, -5px)
}
.m-likeThanks__body {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 16px
}
.m-likeThanks__avatar {
width: 32px;
margin-right: 16px;
line-height: 1
}
@media only screen and (max-width:479px) {
.m-likeThanks__avatar {
margin-right: 8px
}
}
.m-likeThanks__message {
max-width: 220px;
font-size: 14px;
font-weight: 700;
line-height: 1.5;
color: #222;
white-space: normal
}
@media only screen and (max-width:479px) {
.m-likeThanks__message {
font-size: 12px
}
}
.m-likeThanks__flag {
color: #ea3f60
}
.m-likeThanks__status {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-bottom: 8px;
font-weight: 700;
font-size: 12px
}
.m-likeThanks__status:last-child {
margin-bottom: 0
}
.m-likeThanks__status--type_firstLike {
color: #ea3f60
}
.m-likeThanks__statusText {
margin-left: 4px
}
.m-likeThanks__image {
max-width: 220px;
margin-bottom: 8px
}
.m-likeThanks__imageMain {
width: 100%;
max-height: 160px;
border-radius: 4px;
-o-object-fit: contain;
object-fit: contain
}
.m-likeThanks[data-is-shown=true] {
-webkit-animation: replyToLike-m-likeThanks 4s .16s;
animation: replyToLike-m-likeThanks 4s .16s
}
@-webkit-keyframes replyToLike-m-likeThanks {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
4.5% {
opacity: 0;
-webkit-transform: translateY(-24px);
transform: translateY(-24px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
6.75% {
-webkit-transform: translateY(-24px);
transform: translateY(-24px)
}
6.75% {
-webkit-transform: translateY(-48px);
transform: translateY(-48px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
11.25% {
-webkit-transform: translateY(-34px);
transform: translateY(-34px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
13.5% {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
81.25% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px)
}
87.5% {
-webkit-transform: translateY(-42px);
transform: translateY(-42px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
93.75% {
opacity: 1;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
to {
opacity: 0;
-webkit-transform: translateY(-20px) scale(.95);
transform: translateY(-20px) scale(.95);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
}
@keyframes replyToLike-m-likeThanks {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
4.5% {
opacity: 0;
-webkit-transform: translateY(-24px);
transform: translateY(-24px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
6.75% {
-webkit-transform: translateY(-24px);
transform: translateY(-24px)
}
6.75% {
-webkit-transform: translateY(-48px);
transform: translateY(-48px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
11.25% {
-webkit-transform: translateY(-34px);
transform: translateY(-34px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
13.5% {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
81.25% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px)
}
87.5% {
-webkit-transform: translateY(-42px);
transform: translateY(-42px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
93.75% {
opacity: 1;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
to {
opacity: 0;
-webkit-transform: translateY(-20px) scale(.95);
transform: translateY(-20px) scale(.95);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
}
.m-likeThanks[data-is-shown=true][data-has-reaction-image=true] {
-webkit-animation: replyToLikeWithImage-m-likeThanks 6s .16s;
animation: replyToLikeWithImage-m-likeThanks 6s .16s
}
@-webkit-keyframes replyToLikeWithImage-m-likeThanks {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
3% {
opacity: 0;
-webkit-transform: translateY(-24px);
transform: translateY(-24px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
4.5% {
-webkit-transform: translateY(-24px);
transform: translateY(-24px)
}
4.5% {
-webkit-transform: translateY(-48px);
transform: translateY(-48px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
7.5% {
-webkit-transform: translateY(-34px);
transform: translateY(-34px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
9% {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
87.5% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px)
}
91.66667% {
-webkit-transform: translateY(-42px);
transform: translateY(-42px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
95.83333% {
opacity: 1;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
to {
opacity: 0;
-webkit-transform: translateY(-20px) scale(.95);
transform: translateY(-20px) scale(.95);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
}
@keyframes replyToLikeWithImage-m-likeThanks {
0% {
opacity: 0;
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
3% {
opacity: 0;
-webkit-transform: translateY(-24px);
transform: translateY(-24px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
4.5% {
-webkit-transform: translateY(-24px);
transform: translateY(-24px)
}
4.5% {
-webkit-transform: translateY(-48px);
transform: translateY(-48px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
7.5% {
-webkit-transform: translateY(-34px);
transform: translateY(-34px);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
9% {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
87.5% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px)
}
91.66667% {
-webkit-transform: translateY(-42px);
transform: translateY(-42px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
95.83333% {
opacity: 1;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in
}
to {
opacity: 0;
-webkit-transform: translateY(-20px) scale(.95);
transform: translateY(-20px) scale(.95);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out
}
}
.m-likeAnimation:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-38df392f {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-38df392f {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-likeAnimation {
position: absolute;
top: -28px;
left: -28px;
width: 80px;
overflow: hidden;
background-size: 0 0
}
.m-likeAnimation,
.m-likeAnimation:before {
height: 80px;
background-image: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/img/like_animation_sprite.de8fca6.png)
}
.m-likeAnimation:before {
display: block;
width: 3040px;
content: "";
background-repeat: no-repeat;
background-position: 0 0;
background-size: 3040px 80px;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation: likeAnimation-m-likeAnimation 1s steps(38) forwards;
animation: likeAnimation-m-likeAnimation 1s steps(38) forwards
}
@-webkit-keyframes likeAnimation-m-likeAnimation {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0)
}
}
@keyframes likeAnimation-m-likeAnimation {
0% {
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0)
}
}
.o-timelineNotificationMessages:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-a2975b58 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-a2975b58 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-timelineNotificationMessages {
font-size: 12px;
color: #787c7b
}
.o-timelineNotificationMessages a {
text-decoration: none
}
.o-timelineNotificationMessages a:hover {
text-decoration: underline
}
.o-timelineNotificationMessages--cardType {
padding-bottom: 10px;
margin: -10px 0 15px;
border-bottom: 1px solid #e8eceb
}
.o-timelineNotificationMessages--cardType,
.o-timelineNotificationMessages--gridType,
.o-timelineNotificationMessages--itemType {
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1
}
.o-timelineNotificationMessages__icon {
margin-right: 8px;
line-height: 1
}
.o-timelineNotificationMessages__body {
width: 100%;
line-height: 1.5;
font-size: 12px;
letter-spacing: -.4em;
word-break: break-all;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1
}
.o-timelineNotificationMessages__text {
display: inline;
margin-left: -.2em;
letter-spacing: .04em
}
.o-timelineNotificationMessages__text:first-child {
margin-left: 0
}
.o-timelineNotificationMessages__item {
display: inline
}
.o-timelineNotificationMessages__link {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #787c7b;
letter-spacing: .04em
}
@media only screen and (min-width:769px) {
.o-timelineNotificationMessages__link:hover {
color: #222
}
}
.o-timelineNotificationMessages__link--inline {
display: inline-block
}
.o-timelineNotificationMessages--multi {
display: -webkit-box;
display: flex
}
.o-timelineNotificationMessages__recommnededTitle {
display: -webkit-box;
display: flex;
margin-bottom: 16px;
color: #787c7b;
letter-spacing: .04em;
font-size: 14px
}
@media only screen and (max-width:479px) {
.o-timelineNotificationMessages__recommnededTitle {
margin-bottom: 0
}
}
.m-infiniteScroll:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-04138d63 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-04138d63 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-infiniteScroll__spacer {
height: 1px
}
.o-footer:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-9dc516d4 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-9dc516d4 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-footer {
position: relative;
padding: 40px 16px 32px
}
@media print {
.o-footer {
display: none
}
}
.o-footer__menu {
display: -webkit-inline-box;
display: inline-flex;
flex-wrap: wrap;
-webkit-box-pack: center;
justify-content: center;
width: 100%
}
.o-footer__item {
margin-right: 8px;
margin-bottom: 8px;
margin-left: 8px;
font-size: 12px
}
.o-footer__item--strong {
font-weight: 700
}
.o-footer__link {
color: #787c7b
}
@media only screen and (min-width:769px) {
.o-footer__link:hover {
color: #222
}
}
.o-footer__powerdby {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
margin-top: 24px
}
.o-footer__powerdbyTitle {
margin-right: 8px;
font-size: 12px;
color: #787c7b
}
.o-footer__powerdbyLogo {
width: 54px;
height: 14px;
overflow: hidden;
text-indent: -9999px;
background-image: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/img/logo_powerdby_note.8ba28c9.svg);
background-repeat: no-repeat
}
.o-footer--article {
padding-bottom: 104px
}
.m-basicModalContent {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-5668a963 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-5668a963 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-basicModalContent {
position: relative;
margin: 56px auto;
background: #fff;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.m-basicModalContent {
margin: 80px auto 80px
}
}
.m-basicModalContent__header:not(:empty) {
padding: 16px;
color: #222;
text-align: center;
border-bottom: 1px solid #f2f2f2;
font-size: 16px
}
@media only screen and (max-width:479px) {
.m-basicModalContent__body {
width: 100%
}
}
.m-basicModalContent__body--height {
max-height: 440px
}
@media only screen and (max-width:479px) {
.m-basicModalContent__body--height {
height: calc(100vh - 240px)
}
}
.m-basicModalContent__body--scrollable {
max-height: 440px;
overflow-y: auto
}
@media only screen and (max-width:479px) {
.m-basicModalContent__body--scrollable {
max-height: calc(100vh - 240px)
}
}
.m-basicModalContent__footer {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
padding: 16px;
background-color: #f7f9f9;
border-top: 1px solid #f2f2f2;
border-radius: 0 0 4px 4px
}
.m-basicModalContent--size_small {
width: 470px
}
@media only screen and (max-width:479px) {
.m-basicModalContent--size_small {
width: calc(100% - 16px)
}
}
.m-basicModalContent--size_medium {
width: 580px
}
@media only screen and (max-width:479px) {
.m-basicModalContent--size_medium {
width: calc(100% - 16px)
}
}
.m-basicModalContent--size_large {
width: 100%
}
@media only screen and (max-width:479px) {
.m-basicModalContent--size_large {
width: calc(100% - 16px)
}
}
.m-formErrorList:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-14aff5a2 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-14aff5a2 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-formErrorList {
margin-top: 8px;
font-size: 14px;
color: #ed4956
}
.m-formErrorList>* {
margin-top: 4px;
margin-bottom: 4px
}
.m-formErrorList a {
color: #ed4956
}
@media only screen and (min-width:769px) {
.m-formErrorList a {
text-decoration: underline;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.m-formErrorList a:hover {
color: #e81b2b
}
}
.m-formItem {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-78cec4e8 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-78cec4e8 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-formItem__header {
display: -webkit-inline-box;
display: inline-flex;
-webkit-box-align: center;
align-items: center;
margin-bottom: 8px
}
.m-formItem__title {
font-size: 14px;
font-weight: 700
}
.m-formItem__required {
font-size: 12px;
margin-left: 8px;
color: #ed4956
}
.m-formItem__optional {
font-size: 12px;
margin-left: 8px;
line-height: 2;
color: #787c7b
}
.m-formItem__description {
font-size: 14px;
margin-bottom: 8px;
color: #787c7b
}
.m-formInput__field.is-error {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-65561d7e {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-65561d7e {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-formInput__field.is-error {
border: 1px solid #ed4956
}
.m-modalFooterButtonGroup {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-553e1356 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-553e1356 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-modalFooterButtonGroup {
display: -webkit-box;
display: flex;
-webkit-box-pack: end;
justify-content: flex-end;
width: 100%
}
.m-modalFooterButtonGroup__button:not(:root) {
margin-left: 16px
}
.m-modalFooterButtonGroup__button:not(:root):first-child {
margin-left: 0
}
.a-loadingDots:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-621c6dd6 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-621c6dd6 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-loadingDots {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 100%
}
.a-loadingDots__item {
background-color: #222;
border-radius: 8px;
opacity: .3
}
.a-loadingDots__item:first-child {
-webkit-animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out infinite;
animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out infinite
}
.a-loadingDots__item:nth-child(2) {
-webkit-animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out 666ms infinite;
animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out 666ms infinite
}
.a-loadingDots__item:nth-child(3) {
-webkit-animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out 1.3s infinite;
animation: loadingAnimation-data-v-621c6dd6 2s ease-in-out 1.3s infinite
}
.a-loadingDots__item--color_black {
background-color: #222
}
.a-loadingDots__item--color_primary {
background-color: #2cb696
}
.a-loadingDots__item--size_small {
width: 4px;
height: 4px;
margin-right: 2px;
margin-left: 2px
}
.a-loadingDots__item--size_medium {
width: 8px;
height: 8px;
margin-right: 4px;
margin-left: 4px
}
.a-loadingDots__item--size_large {
width: 16px;
height: 16px;
margin-right: 8px;
margin-left: 8px
}
.o-amazonWidget:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-801aeff4 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-801aeff4 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-amazonWidget__body {
padding: 40px
}
@media only screen and (max-width:479px) {
.o-amazonWidget__body {
padding: 24px
}
}
.o-amazonWidget__premiumLink {
color: #2cb696
}
.m-basicBalloonList:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-521281e2 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-521281e2 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-basicBalloonList {
max-width: 400px
}
@media only screen and (max-width:479px) {
.m-basicBalloonList {
max-width: 100vw
}
}
.m-basicBalloonList__item {
font-size: 14px;
text-align: left;
white-space: nowrap
}
.m-basicBalloonList__item+.m-basicBalloonList__item--delete,
.m-basicBalloonList__item+.m-basicBalloonList__item--separate {
padding-top: 8px;
margin-top: 8px;
border-top: 1px solid #f2f2f2
}
.m-basicBalloonList__item--delete .m-basicBalloonList__link {
color: #ed4956
}
@media only screen and (min-width:769px) {
.m-basicBalloonList__item--delete .m-basicBalloonList__link:hover {
color: #ed4956
}
}
.m-basicBalloonList__text {
color: #a8abb1
}
.m-basicBalloonList__link,
.m-basicBalloonList__text {
display: block;
padding: 8px 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.m-basicBalloonList__link {
width: 100%;
color: #787c7b;
cursor: pointer
}
.m-basicBalloonList__link:focus:active,
.m-basicBalloonList__link:focus:hover {
outline: none
}
@media only screen and (min-width:769px) {
.m-basicBalloonList__link:hover {
color: #222;
background-color: #f7f9f9
}
}
.a-balloon:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-607d4566 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-607d4566 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-balloon {
position: relative
}
.a-balloon__mask {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.a-balloon__body {
position: absolute;
left: 50%;
z-index: 2;
min-width: 160px;
padding-top: 8px;
padding-bottom: 8px;
background-color: #fff;
border-radius: 4px;
box-shadow: 0 1px 2px rgba(34, 34, 34, .25), 0 0 1px rgba(34, 34, 34, .35);
-webkit-transform: translate(-50%);
transform: translate(-50%)
}
.a-balloon__body:before {
content: ""
}
.a-balloon__body--popover {
z-index: 1000
}
.a-balloon--arrow_top .a-balloon__body {
top: 8px
}
.a-balloon--arrow_top .a-balloon__body:before {
position: absolute;
top: -6px;
right: 50%;
z-index: 1;
width: 12px;
height: 12px;
margin-right: -6px;
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .1);
border-bottom: 1px solid rgba(34, 34, 34, .1);
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg)
}
.a-balloon--arrow_topLeft .a-balloon__body {
bottom: -16px;
left: auto;
-webkit-transform: translateY(100%);
transform: translateY(100%)
}
.a-balloon--arrow_topLeft .a-balloon__body:before {
position: absolute;
top: -5px;
left: 16px;
width: 8px;
height: 8px;
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .1);
border-bottom: 1px solid rgba(34, 34, 34, .1);
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg)
}
.a-balloon--arrow_topRight .a-balloon__body {
right: -8px;
bottom: -16px;
left: auto;
-webkit-transform: translateY(100%);
transform: translateY(100%)
}
.a-balloon--arrow_topRight .a-balloon__body:before {
position: absolute;
top: -5px;
right: 16px;
width: 8px;
height: 8px;
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .1);
border-bottom: 1px solid rgba(34, 34, 34, .1);
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg)
}
.a-balloon--arrow_bottom .a-balloon__body {
top: -40px;
-webkit-transform: translate(-50%, -100%);
transform: translate(-50%, -100%)
}
.a-balloon--arrow_bottom .a-balloon__body:before {
position: absolute;
right: 50%;
bottom: -2px;
width: 8px;
height: 8px;
content: "";
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .3);
border-bottom: 1px solid rgba(34, 34, 34, .3);
-webkit-transform: rotate(45deg) translate(50%);
transform: rotate(45deg) translate(50%)
}
.a-balloon--arrow_bottomRight .a-balloon__body {
top: -40px;
right: -8px;
left: auto;
-webkit-transform: translateY(-100%);
transform: translateY(-100%)
}
.a-balloon--arrow_bottomRight .a-balloon__body:before {
position: absolute;
right: 16px;
bottom: -5px;
width: 8px;
height: 8px;
content: "";
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .3);
border-bottom: 1px solid rgba(34, 34, 34, .3);
-webkit-transform: rotate(45deg);
transform: rotate(45deg)
}
.a-balloon--arrow_bottomLeft .a-balloon__body {
top: -40px;
right: auto;
left: -8px;
-webkit-transform: translateY(-100%);
transform: translateY(-100%)
}
.a-balloon--arrow_bottomLeft .a-balloon__body:before {
position: absolute;
bottom: -5px;
left: 16px;
width: 8px;
height: 8px;
content: "";
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .3);
border-bottom: 1px solid rgba(34, 34, 34, .3);
-webkit-transform: rotate(45deg);
transform: rotate(45deg)
}
.a-balloon--arrow_rightBottom .a-balloon__body {
top: auto;
right: auto;
bottom: -21px;
left: -16px;
-webkit-transform: translate(-100%);
transform: translate(-100%)
}
.a-balloon--arrow_rightBottom .a-balloon__body:before {
position: absolute;
right: -5px;
bottom: 28px;
width: 8px;
height: 8px;
content: "";
background-color: #fff;
border-right: 1px solid rgba(34, 34, 34, .15);
border-bottom: 1px solid rgba(34, 34, 34, .15);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg)
}
.pika-single {
z-index: 9999;
display: block;
position: relative;
color: #333;
background: #fff;
border: 1px solid;
border-color: #ccc #ccc #bbb;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif
}
.pika-single:after,
.pika-single:before {
content: " ";
display: table
}
.pika-single:after {
clear: both
}
.pika-single {
*zoom: 1
}
.pika-single.is-hidden {
display: none
}
.pika-single.is-bound {
position: absolute;
box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5)
}
.pika-lendar {
float: left;
width: 240px;
margin: 8px
}
.pika-title {
position: relative;
text-align: center
}
.pika-label {
display: inline-block;
*display: inline;
position: relative;
z-index: 9999;
overflow: hidden;
margin: 0;
padding: 5px 3px;
font-size: 14px;
line-height: 20px;
font-weight: 700;
background-color: #fff
}
.pika-title select {
cursor: pointer;
position: absolute;
z-index: 9998;
margin: 0;
left: 0;
top: 5px;
filter: alpha(opacity=0);
opacity: 0
}
.pika-next,
.pika-prev {
display: block;
cursor: pointer;
position: relative;
outline: none;
border: 0;
padding: 0;
width: 20px;
height: 30px;
text-indent: 20px;
white-space: nowrap;
overflow: hidden;
background-color: transparent;
background-position: 50%;
background-repeat: no-repeat;
background-size: 75% 75%;
opacity: .5;
*position: absolute;
*top: 0
}
.pika-next:hover,
.pika-prev:hover {
opacity: 1
}
.is-rtl .pika-next,
.pika-prev {
float: left;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==");
*left: 0
}
.is-rtl .pika-prev,
.pika-next {
float: right;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=");
*right: 0
}
.pika-next.is-disabled,
.pika-prev.is-disabled {
cursor: default;
opacity: .2
}
.pika-select {
display: inline-block;
*display: inline
}
.pika-table {
width: 100%;
border-collapse: collapse;
border-spacing: 0;
border: 0
}
.pika-table td,
.pika-table th {
width: 14.285714285714286%;
padding: 0
}
.pika-table th {
color: #999;
font-size: 12px;
line-height: 25px;
font-weight: 700;
text-align: center
}
.pika-button {
cursor: pointer;
display: block;
box-sizing: border-box;
-moz-box-sizing: border-box;
outline: none;
border: 0;
margin: 0;
width: 100%;
padding: 5px;
color: #666;
font-size: 12px;
line-height: 15px;
text-align: right;
background: #f5f5f5
}
.pika-week {
font-size: 11px;
color: #999
}
.is-today .pika-button {
color: #3af;
font-weight: 700
}
.has-event .pika-button,
.is-selected .pika-button {
color: #fff;
font-weight: 700;
background: #3af;
box-shadow: inset 0 1px 3px #178fe5;
border-radius: 3px
}
.has-event .pika-button {
background: #005da9;
box-shadow: inset 0 1px 3px #0076c9
}
.is-disabled .pika-button,
.is-inrange .pika-button {
background: #d5e9f7
}
.is-startrange .pika-button {
color: #fff;
background: #6cb31d;
box-shadow: none;
border-radius: 3px
}
.is-endrange .pika-button {
color: #fff;
background: #3af;
box-shadow: none;
border-radius: 3px
}
.is-disabled .pika-button {
pointer-events: none;
cursor: default;
color: #999;
opacity: .3
}
.is-outside-current-month .pika-button {
color: #999;
opacity: .3
}
.is-selection-disabled {
pointer-events: none;
cursor: default
}
.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
color: #fff;
background: #ff8000;
box-shadow: none;
border-radius: 3px
}
.pika-table abbr {
border-bottom: none;
cursor: help
}
:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
@-webkit-keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
.a-checkbox:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-1da89e2a {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-1da89e2a {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-checkbox {
position: relative;
z-index: 1;
display: inline-block;
min-height: 20px;
padding-left: 20px;
line-height: 2;
cursor: pointer;
font-size: 14px
}
.a-checkbox__field {
position: absolute;
width: 0;
opacity: 0
}
.a-checkbox__field.is-error~.a-checkbox__check {
color: #ed4956
}
.a-checkbox__field.is-error~.a-checkbox__check:before {
border: 1px solid #ed4956
}
.a-checkbox__field:checked~.a-checkbox__check:after {
display: block
}
.a-checkbox__field:checked~.a-checkbox__check:before {
background-color: #2cb696;
background-color: var(--customPrimaryColor);
border: 1px solid #2cb696;
border: 1px solid var(--customPrimaryColor)
}
.a-checkbox__field:disabled~.a-checkbox__check {
color: #ed4956;
cursor: not-allowed
}
.a-checkbox__field:disabled~.a-checkbox__check:before {
background-color: #ccc;
border: 1px solid #ccc
}
.a-checkbox__field:focus~.a-checkbox__check:before {
border-color: #787c7b
}
.a-checkbox__field:checked:focus~.a-checkbox__check:before {
background-color: #228d74;
background-color: var(--customPrimaryDarkenColor);
border-color: #228d74;
border-color: var(--customPrimaryDarkenColor)
}
.a-checkbox__check {
cursor: pointer
}
@media only screen and (min-width:769px) {
.a-checkbox__check:hover:before {
border: 1px solid #787c7b
}
}
.a-checkbox__check:after {
position: absolute;
top: 6px;
left: 5px;
display: block;
display: none;
width: 10px;
height: 6px;
content: "";
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg)
}
.a-checkbox__check:before {
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: "";
background-color: #fff;
border: 1px solid #a8abb1;
border-radius: 4px
}
.a-checkbox__label {
margin-left: 8px;
line-height: 1.5
}
.m-accordion:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-13bb9076 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-13bb9076 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-accordion__header {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 8px 16px;
font-weight: 700;
color: #787c7b;
cursor: pointer;
font-size: 14px
}
.m-accordion__header.is-active {
color: #222
}
.m-accordion__header.is-active .m-accordion__icon {
color: #222;
-webkit-transform: rotate(0deg);
transform: rotate(0deg)
}
.m-accordion__icon {
color: #787c7b;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg)
}
.m-accordion__body {
padding: 16px
}
.m-accordion__size_small {
padding: 2px 8px
}
.o-magazineListForm:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-da1ba3f2 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-da1ba3f2 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-magazineListForm__empty {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 16px
}
.o-magazineListForm__emptyDescription {
font-size: 14px;
-webkit-box-flex: 1;
flex: 1
}
.o-magazineListForm__emptyImage {
display: block;
-webkit-box-flex: 0;
flex: 0 0 auto;
width: 150px;
height: 88px;
margin-left: 8px;
-o-object-fit: cover;
object-fit: cover
}
@media only screen and (max-width:479px) {
.o-magazineListForm__emptyImage {
width: 150px;
height: 82px
}
}
.o-magazineListForm__create {
padding: 16px;
border-top: 1px solid #f2f2f2
}
.o-magazineListForm__createIcon {
margin-right: 8px
}
.o-magazineListForm__full {
padding: 8px
}
.o-magazineListForm__edit {
padding: 16px;
border-top: 1px solid #f2f2f2
}
.o-magazineListForm__editForm {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: between;
justify-content: between
}
.o-magazineListForm__editFormInput {
-webkit-box-flex: 2;
flex-grow: 2
}
.o-magazineListForm__editFormButton {
padding: 0 8px
}
.o-magazineListForm__editFormCancel {
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-magazineListForm__editFormCancel {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-magazineListForm__editFormCancel:hover {
color: #787c7b
}
}
.o-magazineListForm__error {
margin-top: 8px;
color: #ed4956;
font-size: 14px
}
.o-magazineList {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-afd62386 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-afd62386 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-magazineList {
background-color: #fff
}
.o-magazineList__header {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 2;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
padding: 8px 16px;
background-color: #f7f9f9
}
.o-magazineList__icon {
margin-right: 4px;
color: #787c7b
}
.o-magazineList__title {
font-size: 12px;
margin-right: auto;
color: #787c7b
}
.o-magazineList__help {
line-height: 1;
color: #a8abb1
}
@media only screen and (min-width:769px) {
.o-magazineList__help:hover {
color: #787c7b
}
}
.o-advancedSetting {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-3d6548e7 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3d6548e7 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-advancedSetting {
background-color: #f7f9f9;
border: 1px solid #e6e6e6;
border-radius: 4px
}
.o-advancedSetting__item+.o-advancedSetting__item {
margin-top: 24px
}
.o-advancedSetting__item--disabled {
color: #a8abb1
}
.o-advancedSetting__time {
display: -webkit-inline-box;
display: inline-flex;
margin-top: 16px
}
.o-advancedSetting__timeItem {
min-width: 100px;
cursor: pointer
}
.o-advancedSetting__timeItem+.o-advancedSetting__timeItem {
margin-left: 8px
}
.o-advancedSetting__magazineList {
max-height: 400px;
overflow: hidden;
overflow: auto;
border: 1px solid #f2f2f2;
border-radius: 4px
}
.o-advancedSetting__premiumLink {
padding-bottom: 2px;
margin-right: 2px;
border-bottom: 1px solid #a8abb1
}
@media only screen and (min-width:769px) {
.o-advancedSetting__premiumLink:hover {
color: #787c7b;
border-bottom: 1px solid #787c7b
}
}
.a-tag {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-536dcd77 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-536dcd77 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.a-tag {
position: relative;
display: inline-block;
display: -webkit-inline-box;
display: inline-flex;
-webkit-box-align: center;
align-items: center;
max-width: 100%;
padding: 8px 12px;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
background: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px
}
.a-tag.is-winner {
border: 1px solid #eca726
}
@media only screen and (min-width:769px) {
.a-tag.is-winner:hover {
border: 1px solid #cd8c12
}
}
.a-tag.is-winner .a-tag__label {
color: #eca726
}
@media only screen and (min-width:769px) {
.a-tag:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-tag:hover .a-tag__close {
color: #787c7b;
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
}
.a-tag__badgeIcon {
margin-right: 4px;
color: #eca726
}
.a-tag__label {
font-size: 14px;
overflow: hidden;
line-height: 1.5;
color: #222;
text-overflow: ellipsis;
white-space: nowrap
}
.a-tag__close {
margin-left: 8px;
color: #a8abb1
}
.a-tag__link {
display: block
}
.a-tag__size_mini {
padding: 2px 8px
}
.a-tag__size_mini .a-tag__label {
font-size: 12px
}
.a-tag__size_small {
padding: 4px 10px
}
.a-tag__size_small .a-tag__label {
font-size: 14px
}
.m-tagInput {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-3dcb2f50 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3dcb2f50 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-tagInput__title {
font-size: 14px;
margin-bottom: 4px;
font-weight: 700
}
.m-tagInput__body {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-align: center;
align-items: center;
min-height: 40px;
padding: 8px 0 0 8px;
margin-bottom: 8px;
color: #222;
background: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px;
font-size: 14px
}
.m-tagInput__body.is--error {
border-color: #ed4956
}
.m-tagInput__item {
max-width: calc(100% - 8px);
margin: 0 8px 8px 0
}
.m-tagInput__alert {
font-weight: 700;
color: #f95;
font-size: 12px
}
.m-tagInput__field {
min-width: 180px;
margin: 0 8px 8px 0;
}
@media only screen and (max-width:479px) {
.m-tagInput__field {
width: 100%
}
}
.m-tagInput__fieldInput,
.m-tagInput__fieldInput:focus,
.m-tagInput__fieldInput:hover,
.m-tagInput__fieldInput:not(:disabled):hover {
border: 1px solid transparent
}
.m-tagInput__fieldInput.is--error {
color: #ed4956
}
.m-tagInput__autocomplete {
position: relative
}
.m-tagInput__autocompleteMenu {
position: absolute;
z-index: 2;
width: 100%;
max-height: 280px;
margin-top: -4px;
overflow: auto;
border: 1px solid #e6e6e6;
border-radius: 0 0 4px 4px
}
.m-tagInput__autocompleteItem {
padding: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
background-color: #fff;
font-size: 14px
}
@media only screen and (min-width:769px) {
.m-tagInput__autocompleteItem:hover {
background-color: #f7f9f9
}
}
.m-tagInput__autocompleteItem--active {
background-color: #f7f9f9
}
.suggestion-item__hashtag {
display: -webkit-box;
display: flex;
word-break: break-all;
white-space: normal
}
.suggestion-item__hashtagText {
-webkit-box-flex: 1;
flex-grow: 1;
padding-right: 8px
}
.suggestion-item__hashtagCount {
color: #787c7b;
text-align: right;
white-space: nowrap
}
.m-tagList__title {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-14fc9452 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-14fc9452 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-tagList__title {
font-size: 12px;
margin-bottom: 8px;
font-weight: 700
}
.hashtag-recommend-group__body {
display: -webkit-box;
display: flex;
flex-wrap: wrap
}
.hashtag-recommend-group__item {
display: inline-block;
max-width: 100%;
margin-right: 4px;
margin-bottom: 4px
}
.o-hashtagInput-CategoriesSelector {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-dc14f83c {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-dc14f83c {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-hashtagInput-CategoriesSelector {
margin-bottom: 24px
}
.o-hashtagInput-CategoriesSelector__label {
font-size: 13px;
display: block;
margin-bottom: 4px;
font-weight: 700
}
.o-hashtagInput-CategoriesSelector__selectorsContainer {
display: -webkit-box;
display: flex
}
.o-hashtagInput-CategoriesSelector__selectorsContainer .m-formItem {
-webkit-box-flex: 1;
flex: 1 1 0px
}
.o-hashtagInput-CategoriesSelector__selectorsContainer .m-formItem:first-child {
margin-right: 8px
}
.o-hashtagInput-CategoriesSelector__selectorsContainer .m-formItem:last-child {
margin-left: 8px
}
.o-hashtagInput {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-74d3cf95 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-74d3cf95 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-hashtagInput__title {
font-size: 12px;
margin-bottom: 8px;
font-weight: 700
}
.o-hashtagInput__item+.o-hashtagInput__item {
margin-top: 16px
}
.o-hashtagInput__contestInfo {
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-hashtagInput__contestInfo {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-hashtagInput__contestInfo:hover {
color: #787c7b
}
}
.o-hashtagInput__contest {
max-height: 300px;
padding: 16px;
overflow-y: auto;
background: #f7f9f9;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (max-width:768px) {
.o-hashtagInput__contest {
-webkit-overflow-scrolling: touch
}
}
.o-hashtagInput__contestItem {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between
}
.o-hashtagInput__contestItem+.o-hashtagInput__contestItem {
padding-top: 8px;
margin-top: 8px;
border-top: 1px solid #f2f2f2
}
.o-hashtagInput__itemTitle {
font-size: 12px;
margin-bottom: 8px;
font-weight: 700
}
.o-onboardingNotice {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-00d2a719 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-00d2a719 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-onboardingNotice {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 24px;
color: #222;
background-color: #fff;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-onboardingNotice {
padding: 16px
}
}
.o-onboardingNotice[data-type=basic] {
color: #222;
background-color: #fff;
border: 1px solid #e6e6e6
}
.o-onboardingNotice[data-type=basic] .o-onboardingNotice__description a,
.o-onboardingNotice[data-type=basic] .o-onboardingNotice__title a {
color: #2cb696
}
@media only screen and (min-width:769px) {
.o-onboardingNotice[data-type=basic] .o-onboardingNotice__description a:hover {
color: #228d74
}
}
.o-onboardingNotice[data-type=primary] {
color: #fff;
background-color: #2cb696
}
.o-onboardingNotice[data-type=primary] .o-onboardingNotice__close,
.o-onboardingNotice[data-type=primary] .o-onboardingNotice__description {
color: #fff
}
@media only screen and (min-width:769px) {
.o-onboardingNotice[data-type=primary] .o-onboardingNotice__close:hover {
color: #e8f9f5
}
}
.o-onboardingNotice[data-type=secondary] {
color: #222;
background-color: #f7f9f9;
border: none
}
.o-onboardingNotice[data-size=small] {
padding: 16px
}
.o-onboardingNotice[data-size=small] .o-onboardingNotice__thumb {
width: 56px;
height: 56px;
margin-right: 16px;
margin-left: 24px
}
.o-onboardingNotice[data-size=small] .o-onboardingNotice__title {
font-size: 14px
}
.o-onboardingNotice[data-size=small] .o-onboardingNotice__description {
margin-top: 4px;
font-size: 12px
}
.o-onboardingNotice[data-size=small] .o-onboardingNotice__description:empty {
margin-top: 0
}
.o-onboardingNotice[data-size=small] .o-onboardingNotice__actionList {
margin-top: 8px
}
.o-onboardingNotice[data-clickable] {
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-onboardingNotice[data-clickable] {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.o-onboardingNotice[data-clickable]:hover {
border-color: #ccc
}
}
.o-onboardingNotice__thumb {
width: auto;
max-width: 96px;
height: auto;
max-height: 96px;
margin-left: 16px
}
.o-onboardingNotice__thumbImg {
width: 100%;
height: auto;
background-color: transparent
}
.o-onboardingNotice__detail {
-webkit-box-flex: 1;
flex: 1
}
@media only screen and (max-width:479px) {
.o-onboardingNotice__detail {
display: block;
margin-left: 0
}
}
.o-onboardingNotice__title {
font-weight: 700;
font-size: 16px
}
@media only screen and (max-width:479px) {
.o-onboardingNotice__title {
font-size: 14px
}
}
.o-onboardingNotice__description {
margin-top: 8px;
color: #787c7b;
font-size: 14px
}
@media only screen and (max-width:479px) {
.o-onboardingNotice__description {
font-size: 12px
}
}
.o-onboardingNotice__description:empty {
margin-top: 0
}
@media only screen and (min-width:769px) {
.o-onboardingNotice__description a {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-onboardingNotice__close {
position: absolute;
top: 8px;
right: 8px;
color: #a8abb1
}
@media only screen and (min-width:769px) {
.o-onboardingNotice__close {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.o-onboardingNotice__close:hover {
color: #787c7b
}
}
.o-onboardingNotice__actionList {
margin-top: 16px
}
.o-onboardingNotice__actionItem+.o-onboardingNotice__actionItem {
margin-top: 8px
}
.o-onboardingNotice__onlyVisibleToYou {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-bottom: 8px;
color: #787c7b
}
.o-onboardingNotice__onlyVisibleToYouIcon {
margin-right: 4px;
color: #a8abb1
}
.o-onboardingNotice__body {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between
}
.o-onboardingNotice__bodyDetail {
-webkit-box-flex: 1;
flex: 1
}
.o-onboardingNotice__bodyAction {
-webkit-box-flex: 0;
flex: 0 0 auto;
margin-left: 16px
}
.m-formRadio:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-47678728 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-47678728 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-formRadio__description {
font-size: 14px;
margin-bottom: 8px;
color: #787c7b
}
.m-formRadio__item {
position: relative;
z-index: 1;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding-left: 32px;
cursor: pointer
}
.m-formRadio__label {
font-size: 16px;
font-weight: 700
}
.m-formRadio__field {
position: absolute;
width: 0;
opacity: 0
}
.m-formRadio__field:hover~.m-formRadio__check:after {
display: block;
background-color: #a8abb1
}
.m-formRadio__field:checked~.m-formRadio__check:before {
border: 1px solid #2cb696;
border: 1px solid var(--customPrimaryColor)
}
.m-formRadio__field:checked~.m-formRadio__check:after {
display: block;
background-color: #2cb696;
background-color: var(--customPrimaryColor)
}
.m-formRadio__field:checked:focus~.m-formRadio__check:before {
border-color: #228d74;
border-color: var(--customPrimaryDarkenColor)
}
.m-formRadio__field:checked:focus~.m-formRadio__check:after {
background-color: #228d74;
background-color: var(--customPrimaryDarkenColor)
}
.m-formRadio__check:before {
position: absolute;
top: 0;
left: 0;
z-index: 2;
width: 24px;
height: 24px;
content: "";
background-color: #fff;
border: 1px solid #a8abb1;
border-radius: 24px
}
.m-formRadio__check:after {
position: absolute;
top: 6px;
left: 6px;
z-index: 3;
display: none;
width: 12px;
height: 12px;
content: "";
background-color: #2cb696;
background-color: var(--customPrimaryColor);
border-radius: 12px
}
.m-formRadio__check.is-error:before {
border: 1px solid #ed4956
}
.o-priceSetting {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-42d5fa69 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-42d5fa69 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-priceSetting__selectBody {
display: -webkit-box;
display: flex
}
.o-priceSetting__selectItem+.o-priceSetting__selectItem {
margin-left: 16px
}
.o-priceSetting__inputPrise {
margin-top: 16px;
margin-bottom: 8px
}
.a-button:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
@-webkit-keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation {
0% {
opacity: 1
}
to {
opacity: .3
}
}
.a-button {
display: inline-block;
display: -webkit-inline-box;
display: inline-flex;
min-height: 40px;
padding: 0 16px;
margin: 0;
font-weight: 700;
line-height: 1;
color: #787c7b;
text-align: center;
text-decoration: none;
white-space: nowrap;
vertical-align: top;
touch-action: manipulation;
cursor: pointer;
background: #fff;
border: none;
border-radius: 4px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.a-button,
.a-button .a-button__inner {
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center
}
.a-button .a-button__inner {
font-size: 14px;
display: -webkit-box;
display: flex
}
.a-button[data-type=none] {
color: #787c7b
}
@media only screen and (min-width:769px) {
.a-button[data-type=none] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=none]:hover {
color: #222
}
}
.a-button[data-type=disabled] {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc
}
@media only screen and (min-width:769px) {
.a-button[data-type=disabled] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=disabled]:hover {
background-color: #b3b3b3
}
}
.a-button[data-type=basic] {
color: #222;
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.a-button[data-type=basic] {
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=basic]:hover {
border: 1px solid #a8abb1
}
}
.a-button[data-type=primary] {
color: #fff;
background-color: #2cb696;
background-color: var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=primary] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=primary]:hover {
background-color: #228d74;
background-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=secondary] {
color: #2cb696;
color: var(--customPrimaryColor);
border: 1px solid #2cb696;
border: 1px solid var(--customPrimaryColor)
}
@media only screen and (min-width:769px) {
.a-button[data-type=secondary] {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=secondary]:hover {
color: #2cb696;
color: var(--customPrimaryColor);
border-color: #228d74;
border-color: var(--customPrimaryDarkenColor)
}
}
.a-button[data-type=danger] {
color: #fff;
background-color: #ed4956
}
@media only screen and (min-width:769px) {
.a-button[data-type=danger] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=danger]:hover {
background-color: #e81b2b
}
}
.a-button[data-type=twitter] {
color: #fff;
background-color: #55acee
}
@media only screen and (min-width:769px) {
.a-button[data-type=twitter] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=twitter]:hover {
background-color: #2795e9
}
}
.a-button[data-type=facebook] {
color: #fff;
background-color: #1877f2
}
@media only screen and (min-width:769px) {
.a-button[data-type=facebook] {
-webkit-transition: background-color .2s cubic-bezier(1, 0, 0, 1);
transition: background-color .2s cubic-bezier(1, 0, 0, 1)
}
.a-button[data-type=facebook]:hover {
background-color: #0b5fcc
}
}
.a-button[data-size=small] {
min-height: 32px
}
@media only screen and (max-width:479px) {
.a-button[data-size=small] {
padding-right: 12px;
padding-left: 12px
}
}
.a-button[data-size=small] .a-button__inner {
font-size: 12px
}
.a-button[data-size=large] {
min-height: 48px
}
.a-button[data-size=large] .a-button__inner {
font-size: 16px
}
.a-button[data-width=fit] {
width: 100%
}
.a-button[data-width=square] {
width: 32px
}
.a-button[data-disable-focus=false]:active,
.a-button[data-disable-focus=false]:hover,
.a-button[data-disable-focus=true]:focus {
outline: none
}
.a-button:disabled {
color: hsla(0, 0%, 100%, .5);
cursor: not-allowed;
background-color: #ccc;
border: none;
-webkit-transition: none;
transition: none
}
@media only screen and (min-width:769px) {
.a-button:disabled:hover {
color: hsla(0, 0%, 100%, .5);
background-color: #ccc;
border: none
}
}
.a-button--icon {
padding-right: 0;
padding-left: 0
}
.a-button--icon .a-button__icon {
margin-right: 0
}
.c-button {
visibility: hidden
}
.o-noteContentText:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-3c6b5eaa {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3c6b5eaa {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.note-editor-placeholder {
position: relative;
cursor: text
}
@media only screen and (min-width:769px) {
.note-editor-placeholder:hover:after {
color: #a8abb1
}
}
.note-editor-placeholder:after {
position: absolute;
top: 50%;
left: 0;
z-index: 1;
color: #ccc;
pointer-events: none;
content: attr(data-placeholder);
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.o-noteContentText--device_windows .o-noteContentText__body,
.o-noteContentText--device_windows .o-noteContentText__body .note-editor-placeholder:after,
.o-noteContentText--device_windows .o-noteContentText__title,
.o-noteContentText--device_windows .o-noteContentText__title .note-editor-placeholder:after {
font-family: YakuHanJPs, Segoe UI, Arial, メイリオ, Meiryo, sans-serif
}
.o-noteContentText--font_sansserif .o-noteContentText__body,
.o-noteContentText--font_sansserif .o-noteContentText__body .note-editor-placeholder:after,
.o-noteContentText--font_sansserif .o-noteContentText__title,
.o-noteContentText--font_sansserif .o-noteContentText__title .note-editor-placeholder:after {
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif
}
.o-noteContentText__title {
min-height: 1em;
margin-top: 72px;
margin-bottom: 18px;
font-family: Hiragino Mincho ProN, ヒラギノ明朝 Pro W6, Hiragino Mincho Pro, HGS明朝E, Yu Mincho, YuMincho, ＭＳ Ｐ明朝, serif;
font-weight: 700;
line-height: 1.5;
color: #222;
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1;
pointer-events: auto;
font-size: 32px;
width: 100%;
}
.o-noteContentText__title:focus {
outline: none;
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__title {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__title {
font-size: 24px;
margin: 30px 16px 15px
}
}
.o-noteContentText__status {
position: relative;
display: -webkit-box;
display: flex;
flex-wrap: wrap;
margin-top: -8px;
margin-bottom: 20px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__status {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__status {
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__like {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-align: center;
align-items: center;
margin-right: 12px;
line-height: 1;
color: #ea3f60;
font-size: 14px
}
.o-noteContentText__likeIcon {
position: absolute;
font-size: 16px
}
.o-noteContentText__likeCount {
padding-left: 20px
}
.o-noteContentText__author {
width: 100%;
margin-bottom: 16px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__author {
width: calc(100% - 80px);
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__author {
width: calc(100% - 32px);
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__body {
font-family: Hiragino Mincho ProN, ヒラギノ明朝 Pro W6, Hiragino Mincho Pro, HGS明朝E, Yu Mincho, YuMincho, ＭＳ Ｐ明朝, serif;
color: #222;
pointer-events: auto
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__body {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body {
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__body b {
font-weight: 700
}
.o-noteContentText__body pre,
.o-noteContentText__body pre[data-name=preCode] {
padding: 36px;
margin-top: 36px;
margin-bottom: 36px;
font-family: note monospace, SFMono-Regular, Consolas, Menlo, Courier, monospace;
line-height: 18px;
color: #fff;
white-space: pre-wrap;
background-color: #282c34;
font-size: 12px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body pre,
.o-noteContentText__body pre[data-name=preCode] {
padding: 24px;
margin: 32px -16px
}
}
.o-noteContentText__body code,
.o-noteContentText__body code[data-name=code] {
display: block;
overflow-x: auto;
font-family: note monospace, SFMono-Regular, Consolas, Menlo, Courier, monospace;
line-height: 18px;
color: #fff;
word-wrap: normal;
white-space: pre;
-webkit-overflow-scrolling: touch;
font-size: 12px
}
.o-noteContentText__body code::-webkit-scrollbar,
.o-noteContentText__body code[data-name=code]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body blockquote,
.o-noteContentText__body figure,
.o-noteContentText__body h2,
.o-noteContentText__body h3,
.o-noteContentText__body p,
.o-noteContentText__body ul li {
margin-top: 36px;
margin-bottom: 36px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote,
.o-noteContentText__body figure,
.o-noteContentText__body h2,
.o-noteContentText__body h3,
.o-noteContentText__body p,
.o-noteContentText__body ul li {
margin-top: 30px;
margin-bottom: 30px
}
}
.o-noteContentText__body a {
text-decoration: underline;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-noteContentText__body a:hover {
color: #222;
text-decoration: none
}
}
.o-noteContentText__body img {
display: block;
max-width: 100%;
height: auto !important;
margin: 0 auto;
text-align: center;
cursor: pointer;
box-shadow: 0 0 1px rgba(34, 34, 34, .3)
}
.o-noteContentText__body img.is-slide {
cursor: -webkit-zoom-in;
cursor: zoom-in
}
.o-noteContentText__body h2,
.o-noteContentText__body h3 {
font-size: 24px;
margin-top: 50px;
margin-bottom: -18px;
font-weight: 700;
line-height: 1.75;
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1
}
@media only screen and (max-width:479px) {
.o-noteContentText__body h2,
.o-noteContentText__body h3 {
font-size: 20px;
margin-top: 36px;
margin-bottom: -20px
}
}
.o-noteContentText__body p,
.o-noteContentText__body ul li {
font-size: 18px;
line-height: 36px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body p,
.o-noteContentText__body ul li {
font-size: 16px;
line-height: 30px
}
}
.o-noteContentText__body blockquote {
font-size: 16px;
padding: 25px 36px;
line-height: 36px;
background-color: #f7f9f9
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote {
font-size: 14px;
padding: 18px 24px;
line-height: 30px
}
}
.o-noteContentText__body blockquote>* {
margin-top: 0;
margin-bottom: 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote>* {
font-size: 14px
}
}
.o-noteContentText__body .widget-cover {
width: 100% !important;
cursor: pointer
}
.o-noteContentText__body .widget-cover>* {
pointer-events: none
}
.o-noteContentText__body .widget-cover:before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
content: "";
border: 1px solid transparent;
border-radius: 4px;
opacity: 0
}
@media only screen and (min-width:769px) {
.o-noteContentText__body .widget-cover:hover:before {
opacity: 1
}
}
.o-noteContentText__body .widget-cover.is-selected:before {
background-color: rgba(#2cb696, .3);
background-color: rgba(var(--customPrimaryColor), .3);
border-color: #2cb696;
border-color: var(--customPrimaryColor);
opacity: 1
}
.o-noteContentText__body [embedded-service] {
position: relative;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;
border-radius: 4px
}
.o-noteContentText__body [embedded-service] ::-moz-selection {
background-color: transparent
}
.o-noteContentText__body [embedded-service] ::selection {
background-color: transparent
}
.o-noteContentText__body [embedded-service=googlemap] {
position: relative;
width: 100% !important;
height: 0;
padding-bottom: 75%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=googlemap] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=gist] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=gist]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=googleform] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=googleform]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=itunes] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=itunes]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=apple-music] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=apple-music]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=slideshare] {
width: 100%
}
.o-noteContentText__body [embedded-service=slideshare] iframe {
overflow: hidden;
vertical-align: top;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=speakerdeck] {
width: 100%
}
.o-noteContentText__body [embedded-service=speakerdeck] iframe {
overflow: hidden;
vertical-align: top;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=note] {
width: 100%;
max-width: auto;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body [embedded-service=note] iframe {
display: block !important;
width: 100% !important;
max-width: auto !important;
margin: 0 auto !important
}
.o-noteContentText__body [embedded-service=twitter] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body [embedded-service=twitter] .twitter-tweet {
margin-top: 0 !important;
margin-right: auto;
margin-bottom: 0 !important;
margin-left: auto
}
.o-noteContentText__body [embedded-service=twitterProfile] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
border: 1px solid #ccd6dd;
border-radius: 15px
}
.o-noteContentText__body [embedded-service=instagram] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=instagram]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=instagram] iframe {
display: block;
width: 100% !important;
max-width: 500px !important;
height: 590px;
padding: 8px;
margin: 0 auto !important;
overflow: hidden;
border: 1px solid #f2f2f2;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=tiktok] {
width: 100%;
max-width: 340px;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok] {
position: relative;
width: 100%;
max-width: none;
height: 0;
padding-bottom: 205.29412% !important
}
}
.o-noteContentText__body [embedded-service=tiktok] span div {
position: static !important;
left: auto !important;
max-width: none !important;
height: auto !important;
padding-top: 0 !important;
padding-bottom: 0 !important
}
.o-noteContentText__body [embedded-service=tiktok] iframe {
position: relative !important;
top: auto !important;
left: auto !important;
display: block;
width: 340px !important;
height: 700px !important;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok] iframe {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important
}
}
.o-noteContentText__body [embedded-service=tiktok-web] {
width: 100%;
max-width: 340px;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] {
position: relative;
width: 100%;
max-width: none
}
}
.o-noteContentText__body [embedded-service=tiktok-web] blockquote {
padding: 0;
margin: 0;
background-color: transparent
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] blockquote {
padding: 0
}
}
.o-noteContentText__body [embedded-service=tiktok-web] span div {
position: static !important;
left: auto !important;
max-width: none !important;
padding-top: 0 !important;
padding-bottom: 0 !important
}
.o-noteContentText__body [embedded-service=tiktok-web] iframe {
position: relative !important;
top: auto !important;
left: auto !important;
display: block;
width: 340px !important;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] iframe {
width: 100% !important
}
}
.o-noteContentText__body [embedded-service=soundcloud] {
width: 100% !important;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=niconico] {
position: relative;
width: 100% !important;
height: 0;
padding-bottom: 56.25%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=niconico] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=spotify] div {
max-width: none !important
}
.o-noteContentText__body [embedded-service=youtube] {
position: relative;
height: 0;
padding-bottom: 56.25%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=youtube] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=vimeo] {
position: relative;
width: 100% !important;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=vimeo] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=note-slide] {
position: relative;
height: auto
}
.o-noteContentText__body [embedded-service=note-slide]:after {
display: block;
padding-top: calc(75% + 92px);
content: ""
}
}
.o-noteContentText__body [embedded-service=note-slide] iframe {
height: 455px;
border: none
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=note-slide] iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%
}
}
.o-noteContentText__body [embedded-service=external-article] a {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
padding: 24px;
text-decoration: none
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] a {
padding: 16px
}
}
.o-noteContentText__body [embedded-service=external-article] a:first-child {
width: 100%
}
.o-noteContentText__body [embedded-service=external-article] a:nth-child(2) {
-webkit-box-flex: 0;
flex: 0;
min-width: 220px;
padding: 0;
background-position: 50%;
background-size: cover;
border-left: 1px solid #f2f2f2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] a:nth-child(2) {
min-width: 120px
}
}
.o-noteContentText__body [embedded-service=external-article] strong {
display: block;
margin-bottom: 8px;
font-weight: 700;
word-break: break-all;
font-size: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] strong {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] em {
display: block;
margin-bottom: 4px;
line-height: 1.5;
color: #787c7b;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] em:nth-child(3) {
margin-bottom: 0;
color: #222
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget {
display: table;
width: 100%;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget>a {
display: table-cell;
padding: 16px;
vertical-align: middle
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-title {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-title {
max-height: 2.8em;
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-description {
display: -webkit-box;
max-height: 3em;
overflow: hidden;
color: #787c7b;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-image {
width: 225px;
height: 150px;
vertical-align: middle;
background-repeat: no-repeat;
background-position: 50%;
background-size: cover;
border-left: 1px solid #e8eceb;
border-radius: 0 3px 3px 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-image {
width: 120px;
height: 120px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping>a:first-child {
-webkit-box-ordinal-group: 3;
order: 2
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-image {
display: -webkit-box;
display: flex;
width: 225px;
height: 225px;
padding: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-image {
-webkit-box-ordinal-group: 2;
order: 1;
width: 100%;
height: 190px;
padding: 16px 16px 0;
border: none
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-disclaimer {
text-decoration: underline
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-productImage {
display: block;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: 50%;
background-size: contain
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-price {
display: -webkit-box;
display: flex;
-webkit-box-align: end;
align-items: flex-end;
-webkit-box-pack: start;
justify-content: flex-start;
margin-top: 16px;
margin-bottom: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-price {
display: block;
margin-top: 8px;
margin-bottom: 8px
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-button .a-button__inner {
margin-top: 8px;
margin-bottom: 8px;
white-space: normal
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-regularprice,
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-saleprice {
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
font-weight: 700;
line-height: 1;
color: #222;
font-size: 16px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-saleprice+.external-article-widget-regularprice {
padding-left: 8px;
font-weight: 400;
color: #787c7b;
text-decoration: line-through;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-currency {
padding-left: 2px;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-update {
margin-left: 8px;
line-height: 1;
color: #787c7b;
font-size: 10px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-update {
display: block;
margin-top: 4px;
margin-left: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-url+.external-article-widget-button {
margin-top: 16px
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
overflow: hidden;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__link {
display: block !important;
width: 100%;
padding: 0 !important
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__header {
position: relative;
width: 100%;
height: 0;
padding-bottom: 52.3%;
overflow: hidden
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__cover {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__img {
width: 100% !important;
height: 100% !important;
border: none;
-o-object-fit: cover;
object-fit: cover
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__body {
display: block;
padding: 16px
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__title {
display: block;
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-weight: 700;
line-height: 1.5;
letter-spacing: .04em;
word-break: break-all;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
font-size: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__title {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__description {
display: block;
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 12px;
font-style: normal;
line-height: 1.5;
color: #787c7b;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__url {
display: block;
font-size: 10px;
font-style: normal;
line-height: 1.5
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
display: grid;
grid-template-areas: "detail aside""status aside";
grid-template-rows: 1fr auto;
grid-template-columns: 1fr 190px;
padding: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
grid-template-areas: "detail aside""status status";
grid-template-rows: 1fr auto;
grid-template-columns: 1fr 140px
}
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
grid-template-columns: 1fr 132px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__detail {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
grid-area: detail;
-webkit-box-pack: center;
justify-content: center;
padding-right: 16px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__domain {
margin-bottom: 4px;
color: #787c7b;
font-size: 10px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__title {
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 16px;
font-weight: 700;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__title {
font-size: 14px;
-webkit-line-clamp: 3
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__property {
display: -webkit-box;
display: flex
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__property {
display: block
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__owner {
display: -webkit-box;
font-size: 12px;
margin-right: 16px;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__owner {
display: block;
margin-right: 0;
word-break: break-all
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #787c7b;
white-space: nowrap;
font-size: 12px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
margin-top: 4px;
white-space: normal
}
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
font-size: 10px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__categoryIcon {
margin-right: 4px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__categoryIcon {
margin-right: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__aside {
grid-area: aside
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__thumbImg {
width: 100%;
height: auto;
margin-bottom: 16px;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__thumbImg {
margin-bottom: 8px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__status {
grid-area: status;
padding: 8px 16px 0 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__status {
padding: 16px 0 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusList {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusListItem {
margin-top: 0;
margin-right: 16px;
margin-bottom: 0;
line-height: 1
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusListItem--timeleft {
margin-right: 0;
margin-left: auto
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__currentAmount {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-bottom: 0;
line-height: 1;
color: #222;
font-size: 14px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__currentAmount {
font-size: 12px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supporters {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
font-size: 14px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supporters {
font-size: 12px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supportersIcon {
margin-right: 4px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supportersIcon {
margin-right: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleft {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #787c7b;
font-size: 12px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleft {
font-size: 10px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleftIcon {
margin-right: 4px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate {
position: relative;
margin-top: 8px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate:after {
position: absolute;
top: 2px;
left: 4px;
z-index: 1;
font-weight: 700;
color: #fff;
content: attr(title);
font-size: 10px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate {
height: 16px;
margin-right: -16px;
margin-bottom: -14px;
margin-left: -16px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value] {
width: 100%;
-webkit-appearance: none;
appearance: none;
-moz-appearance: none;
height: 16px;
overflow: hidden;
border: none;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value] {
border-radius: 0 0 3px 3px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-bar {
-webkit-appearance: none;
appearance: none;
overflow: hidden;
background-color: #f2f2f2;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-bar {
border-radius: 0 0 3px 3px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-value {
-webkit-appearance: none;
appearance: none;
background-color: #2cb696
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-moz-progress-bar {
-moz-appearance: none;
background-color: #2cb696
}
.o-noteContentText__body [embedded-service=attachment] {
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=attachment]:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__link {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 16px;
text-decoration: none;
cursor: pointer
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__link {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__info {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex-grow: 1;
-webkit-box-align: center;
align-items: center;
padding-right: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__info {
width: 100%;
padding-right: 0
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__icon {
padding-right: 16px;
color: #a8abb1
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__data {
-webkit-box-flex: 1;
flex-grow: 1
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__filename {
display: block;
margin-bottom: 8px;
font-weight: 700;
word-break: break-all;
font-size: 16px
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__loading {
font-size: 14px;
padding: 40px 16px 16px;
line-height: 1;
color: #787c7b;
text-align: center
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__loadingLabel {
padding-top: 24px;
background-image: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/img/loading_128x128.0f89a3b.gif);
background-repeat: no-repeat;
background-position: 50% 10%;
background-size: 32px
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__filesize {
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__note {
font-size: 10px;
color: #2cb696;
color: var(--customPrimaryColor);
text-decoration: none
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__note:hover {
color: #228d74;
color: var(--customPrimaryDarkenColor)
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__download {
width: 100%;
padding-top: 16px
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__download .a-icon {
margin-right: 8px
}
.o-noteContentText__body [embedded-service=hr],
.o-noteContentText__body [embedded-service=wantedly] {
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=hr]:hover,
.o-noteContentText__body [embedded-service=wantedly]:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget {
width: 100%;
text-align: left
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__link,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__link {
display: -webkit-box;
display: flex;
width: 100%;
padding: 16px;
overflow: visible;
text-decoration: none
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__info,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__info {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-pack: center;
justify-content: center
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__url,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__url {
position: relative;
display: block;
width: 100%;
margin-bottom: 8px;
font-size: 10px;
font-style: normal;
line-height: 1;
color: #787c7b;
text-indent: 48px
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__url:before,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__url:before {
position: absolute;
top: -1px;
left: 0;
width: 40px;
height: 14px;
padding: 2px 4px;
font-size: 10px;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
text-indent: 0;
white-space: nowrap;
content: "求人";
background-color: #2cb696;
background-color: var(--customPrimaryColor);
border-radius: 7px
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__title,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__title {
display: -webkit-box;
width: 100%;
max-height: 3em;
padding-right: 16px;
overflow: hidden;
font-size: 18px;
font-weight: 700;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__title,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__title {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__requirements,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__requirements {
width: 100%;
padding-top: 8px;
padding-right: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__requirements,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__requirements {
padding-top: 8px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__companyName,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__companyName {
display: block;
margin-bottom: 8px;
font-size: 12px;
font-weight: 700
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__companyName:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__companyName:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__location,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__location {
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 12px;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__location:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__location:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__occupations,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__occupations {
display: block;
margin-bottom: 4px;
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__occupations:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__occupations:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__employmentSystem,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__employmentSystem {
display: block;
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__aside,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__aside {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-pack: center;
justify-content: center;
width: 190px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__aside,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__aside {
width: 120px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__thumbnailImg,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__thumbnailImg {
width: 100%;
height: 100px !important;
border: none;
border-radius: 4px;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center center;
object-position: center center
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__thumbnailImg,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__thumbnailImg {
height: 64px !important
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__button,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__button {
width: 100%;
margin-top: 16px
}
.o-noteContentText__body [embedded-service=alu] {
max-width: 500px;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body .fude-iframe-ratio-widget__wrap {
position: relative;
width: 100%;
height: 0;
overflow: hidden;
border-radius: 4px
}
.o-noteContentText__body .fude-iframe-ratio-widget__inner {
position: static;
left: auto;
max-width: none;
height: auto;
padding-top: 0;
padding-bottom: 0
}
.o-noteContentText__body .fude-iframe-ratio-widget__iframe {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body .fude-iframe-ratio-widget__domain {
text-align: right
}
.o-noteContentText__body .fude-iframe-ratio-widget__link {
display: inline-block;
padding-top: 8px;
color: #787c7b;
text-decoration: none;
font-size: 12px
}
.o-noteContentText__body [embedded-service=oembed] {
border-radius: 0
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget {
margin: 0 auto
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__wrap {
position: relative;
width: 100%;
height: 0;
overflow: hidden
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__inner {
position: static;
left: auto;
max-width: none;
height: auto;
padding-top: 0;
padding-bottom: 0
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__iframe {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__domain {
text-align: right
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__link {
display: inline-block;
padding-top: 8px;
color: #787c7b;
text-decoration: none;
font-size: 12px
}
.o-noteContentText__body .fb-post {
display: block;
width: 100%;
max-width: 350px;
margin: 0 auto;
overflow-x: auto;
overflow-y: hidden
}
.m-basicEmptyContent:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-4e3f300f {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-4e3f300f {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-basicEmptyContent {
padding: 24px
}
.m-basicEmptyContent__title {
font-size: 16px;
margin-bottom: 8px;
font-weight: 700;
text-align: center
}
.m-basicEmptyContent__description {
font-size: 14px;
color: #787c7b;
text-align: center
}
.m-basicEmptyContent__image {
display: block;
width: 100%;
max-width: 200px;
height: auto;
margin-right: auto;
margin-bottom: 16px;
margin-left: auto;
background-color: transparent
}
.m-basicEmptyContent__icon {
display: block;
margin: 0 auto;
color: #a8abb1
}
.o-empty {
--noteGreen: #080808;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-6497ab1e {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-6497ab1e {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-empty__title--disabled {
color: #a8abb1
}
.o-empty__descriptionIcon {
margin-right: 4px;
margin-left: 4px;
vertical-align: text-bottom
}
.o-empty__action {
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
margin-top: 24px
}
.o-empty__action--vertical {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
max-width: 300px;
margin-right: auto;
margin-left: auto
}
.o-empty__action--vertical .o-empty__button {
margin: 0
}
.o-empty__action--vertical .o-empty__button+.o-empty__button {
margin-top: 16px
}
.o-empty__button {
margin: 0 8px
}
@font-face {
font-family: "swiper-icons";
src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff");
font-weight: 400;
font-style: normal
}
:root {
--swiper-theme-color: #007aff
}
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1
}
.swiper-container-vertical>.swiper-wrapper {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: flex;
-webkit-transition-property: -webkit-transform;
transition-property: -webkit-transform;
transition-property: transform;
transition-property: transform, -webkit-transform;
box-sizing: content-box
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
.swiper-container-multirow>.swiper-wrapper {
flex-wrap: wrap
}
.swiper-container-multirow-column>.swiper-wrapper {
flex-wrap: wrap;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
.swiper-container-free-mode>.swiper-wrapper {
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
margin: 0 auto
}
.swiper-slide {
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
-webkit-transition-property: -webkit-transform;
transition-property: -webkit-transform;
transition-property: transform;
transition-property: transform, -webkit-transform
}
.swiper-slide-invisible-blank {
visibility: hidden
}
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
height: auto
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: start;
align-items: flex-start;
-webkit-transition-property: height, -webkit-transform;
transition-property: height, -webkit-transform;
transition-property: transform, height;
transition-property: transform, height, -webkit-transform
}
.swiper-container-3d {
-webkit-perspective: 1200px;
perspective: 1200px
}
.swiper-container-3d .swiper-cube-shadow,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-wrapper {
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d
}
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, .5), transparent);
background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent)
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), transparent);
background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent)
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), transparent);
background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent)
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, .5), transparent);
background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent)
}
.swiper-container-css-mode>.swiper-wrapper {
overflow: auto;
scrollbar-width: none;
-ms-overflow-style: none
}
.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar {
display: none
}
.swiper-container-css-mode>.swiper-wrapper>.swiper-slide {
scroll-snap-align: start start
}
.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper {
-webkit-scroll-snap-type: x mandatory;
-ms-scroll-snap-type: x mandatory;
scroll-snap-type: x mandatory
}
.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper {
-webkit-scroll-snap-type: y mandatory;
-ms-scroll-snap-type: y mandatory;
scroll-snap-type: y mandatory
}
:root {
--swiper-navigation-size: 44px
}
.swiper-button-next,
.swiper-button-prev {
position: absolute;
top: 50%;
width: 27px;
width: calc(var(--swiper-navigation-size)/44*27);
height: 44px;
height: var(--swiper-navigation-size);
margin-top: -22px;
margin-top: calc(-1*var(--swiper-navigation-size)/2);
z-index: 10;
cursor: pointer;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
color: var(--swiper-theme-color);
color: var(--swiper-navigation-color, var(--swiper-theme-color))
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
opacity: .35;
cursor: auto;
pointer-events: none
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-size: 44px;
font-size: var(--swiper-navigation-size);
text-transform: none !important;
letter-spacing: 0;
text-transform: none;
-webkit-font-feature-settings: normal, ;
font-feature-settings: normal, ;
font-variant: normal;
line-height: 1
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
left: 10px;
right: auto
}
.swiper-button-prev:after,
.swiper-container-rtl .swiper-button-next:after {
content: "prev"
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
right: 10px;
left: auto
}
.swiper-button-next:after,
.swiper-container-rtl .swiper-button-prev:after {
content: "next"
}
.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
--swiper-navigation-color: #fff
}
.swiper-button-next.swiper-button-black,
.swiper-button-prev.swiper-button-black {
--swiper-navigation-color: #000
}
.swiper-button-lock {
display: none
}
.swiper-pagination {
position: absolute;
text-align: center;
-webkit-transition: opacity .3s;
transition: opacity .3s;
-webkit-transform: translateZ(0);
transform: translateZ(0);
z-index: 10
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0
}
.swiper-container-horizontal>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 10px;
left: 0;
width: 100%
}
.swiper-pagination-bullets-dynamic {
overflow: hidden;
font-size: 0
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
-webkit-transform: scale(.33);
transform: scale(.33);
position: relative
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
-webkit-transform: scale(1);
transform: scale(1)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
-webkit-transform: scale(.66);
transform: scale(.66)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
-webkit-transform: scale(.33);
transform: scale(.33)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
-webkit-transform: scale(.66);
transform: scale(.66)
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
-webkit-transform: scale(.33);
transform: scale(.33)
}
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: .2
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer
}
.swiper-pagination-bullet-active {
opacity: 1;
background: var(--swiper-theme-color);
background: var(--swiper-pagination-color, var(--swiper-theme-color))
}
.swiper-container-vertical>.swiper-pagination-bullets {
right: 10px;
top: 50%;
-webkit-transform: translate3d(0, -50%, 0);
transform: translate3d(0, -50%, 0)
}
.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 6px 0;
display: block
}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
width: 8px
}
.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
display: inline-block;
-webkit-transition: top .2s, -webkit-transform .2s;
transition: top .2s, -webkit-transform .2s;
transition: transform .2s, top .2s;
transition: transform .2s, top .2s, -webkit-transform .2s
}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 4px
}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
white-space: nowrap
}
.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
-webkit-transition: left .2s, -webkit-transform .2s;
transition: left .2s, -webkit-transform .2s;
transition: transform .2s, left .2s;
transition: transform .2s, left .2s, -webkit-transform .2s
}
.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
-webkit-transition: right .2s, -webkit-transform .2s;
transition: right .2s, -webkit-transform .2s;
transition: transform .2s, right .2s;
transition: transform .2s, right .2s, -webkit-transform .2s
}
.swiper-pagination-progressbar {
background: rgba(0, 0, 0, .25);
position: absolute
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background: var(--swiper-theme-color);
background: var(--swiper-pagination-color, var(--swiper-theme-color));
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: left top;
transform-origin: left top
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
-webkit-transform-origin: right top;
transform-origin: right top
}
.swiper-container-horizontal>.swiper-pagination-progressbar,
.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
width: 100%;
height: 4px;
left: 0;
top: 0
}
.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-container-vertical>.swiper-pagination-progressbar {
width: 4px;
height: 100%;
left: 0;
top: 0
}
.swiper-pagination-white {
--swiper-pagination-color: #fff
}
.swiper-pagination-black {
--swiper-pagination-color: #000
}
.swiper-pagination-lock {
display: none
}
.swiper-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, .1)
}
.swiper-container-horizontal>.swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%
}
.swiper-container-vertical>.swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, .5);
border-radius: 10px;
left: 0;
top: 0
}
.swiper-scrollbar-cursor-drag {
cursor: move
}
.swiper-scrollbar-lock {
display: none
}
.swiper-zoom-container {
width: 100%;
height: 100%;
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
text-align: center
}
.swiper-zoom-container>canvas,
.swiper-zoom-container>img,
.swiper-zoom-container>svg {
max-width: 100%;
max-height: 100%;
-o-object-fit: contain;
object-fit: contain
}
.swiper-slide-zoomed {
cursor: move
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
-webkit-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: swiper-preloader-spin 1s linear infinite;
animation: swiper-preloader-spin 1s linear infinite;
box-sizing: border-box;
border-left: 4px solid var(--swiper-theme-color);
border-bottom: 4px solid var(--swiper-theme-color);
border-right: 4px solid var(--swiper-theme-color);
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
border-radius: 50%;
border-top: 4px solid transparent
}
.swiper-lazy-preloader-white {
--swiper-preloader-color: #fff
}
.swiper-lazy-preloader-black {
--swiper-preloader-color: #000
}
@-webkit-keyframes swiper-preloader-spin {
to {
-webkit-transform: rotate(1turn);
transform: rotate(1turn)
}
}
@keyframes swiper-preloader-spin {
to {
-webkit-transform: rotate(1turn);
transform: rotate(1turn)
}
}
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
-webkit-transition-property: opacity;
transition-property: opacity
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube {
overflow: visible
}
.swiper-container-cube .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
visibility: hidden;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
width: 100%;
height: 100%
}
.swiper-container-cube .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-next+.swiper-slide,
.swiper-container-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible
}
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right,
.swiper-container-cube .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
background: #000;
opacity: .6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0
}
.swiper-container-flip {
overflow: visible
}
.swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1
}
.swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto
}
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right,
.swiper-container-flip .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
backface-visibility: hidden
}
.m-settings-sidebar__head:root {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
margin-bottom: 24px
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__head {
margin-bottom: 8px;
background-color: #fff
}
}
.m-settings-sidebar__title {
font-size: 24px;
font-weight: 700;
line-height: 1.5
}
.m-settings-sidebar__help {
margin-left: 8px;
color: #a8abb1
}
@media only screen and (min-width:769px) {
.m-settings-sidebar__help {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.m-settings-sidebar__help:hover {
color: #787c7b
}
}
.m-settings-sidebar__nav {
width: 100%
}
.m-settings-sidebar__nav::-webkit-scrollbar {
display: none
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__nav {
display: -webkit-box;
display: flex;
margin-left: -8px;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch
}
}
.m-settings-sidebar__list {
width: 100%;
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 1px solid #e6e6e6
}
.m-settings-sidebar__list:last-child {
border-bottom: none
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__list {
display: -webkit-box;
display: flex;
width: auto;
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none
}
.m-settings-sidebar__list:last-child {
border-right: none
}
.m-settings-sidebar__list+.m-settings-sidebar__list {
padding-left: 8px;
margin-left: 8px;
border-left: 1px solid #e6e6e6
}
}
.m-settings-sidebar__item {
position: relative;
width: 100%
}
.m-settings-sidebar__item[data-is-current=true] {
font-weight: 700;
color: #2cb696
}
@media only screen and (min-width:769px) {
.m-settings-sidebar__item:hover:before {
position: absolute;
top: 0;
right: -8px;
bottom: 0;
left: -8px;
display: block;
content: "";
background-color: #f2f2f2;
border-radius: 4px
}
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__item {
width: auto;
color: #787c7b;
white-space: nowrap
}
}
.m-settings-sidebar__link {
position: relative;
z-index: 1;
display: block;
width: 100%;
padding: 8px 0;
cursor: pointer;
font-size: 16px
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__link {
padding: 4px 8px;
font-size: 14px
}
}
.o-noteListHeader {
display: -webkit-box;
display: flex;
-webkit-box-align: start;
align-items: flex-start;
-webkit-box-pack: justify;
justify-content: space-between
}
.o-noteListHeader.active {
position: relative;
z-index: 20
}
@media only screen and (max-width:479px) {
.o-noteListHeader {
height: 100vh;
margin-bottom: calc(-100vh + 24px);
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
}
.o-noteListHeader__num {
font-size: 14px;
white-space: nowrap
}
@media only screen and (max-width:479px) {
.o-noteListHeader__num {
margin-right: 24px
}
}
.o-noteListHeader__list {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteListHeader__item {
margin-left: 32px;
font-size: 14px;
white-space: nowrap;
cursor: pointer
}
@media only screen and (max-width:479px) {
.o-noteListHeader__item {
margin-left: 16px
}
}
@media only screen and (max-width:479px) {
.o-noteListHeader__item:last-child {
margin-right: 16px
}
}
.o-noteListHeader__label {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteListHeader__sortPopup {
max-height: 315px;
overflow-y: auto;
-webkit-overflow-scrolling: touch
}
.t-settings:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-3d889b32 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3d889b32 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.t-settings {
padding: 40px 24px;
background-color: #f7f9f9
}
@media only screen and (max-width:768px) {
.t-settings {
padding: 0
}
}
.t-settings__body {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
width: 100%;
max-width: 940px;
margin: 0 auto
}
@media only screen and (max-width:768px) {
.t-settings__body {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
padding: 0
}
}
.t-settings__main {
-webkit-box-flex: 1;
flex: 1;
width: 100%
}
.t-settings__main[data-has-main-background=true] {
padding: 40px;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 8px
}
@media only screen and (max-width:768px) {
.t-settings__main[data-has-main-background=true] {
padding: 24px;
margin: 0;
border-width: 1px 0;
border-radius: 0
}
}
@media only screen and (max-width:479px) {
.t-settings__main[data-has-main-background=true] {
padding: 24px 16px
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.t-settings__main {
width: auto;
max-width: none;
margin: 8px 24px 24px;
border-radius: 0
}
}
@media only screen and (max-width:479px) {
.t-settings__main {
width: auto;
max-width: none;
margin: 8px 16px 16px;
border-radius: 0
}
}
.t-settings__aside {
width: 240px;
margin-right: 40px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.t-settings__aside {
width: 100%;
padding: 24px 24px 16px;
margin-right: 0;
margin-bottom: 8px;
background-color: #fff;
border-bottom: 1px solid #e6e6e6;
box-shadow: 0 0 1px rgba(34, 34, 34, .08)
}
}
@media only screen and (max-width:479px) {
.t-settings__aside {
width: 100%;
padding: 24px 16px 16px;
margin-right: 0;
margin-bottom: 8px;
background-color: #fff;
border-bottom: 1px solid #e6e6e6;
box-shadow: 0 0 1px rgba(34, 34, 34, .08)
}
}
.o-noteListNotes__nav {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-5f85fbc0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-5f85fbc0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-noteListNotes__nav {
padding-right: 16px;
padding-bottom: 8px;
padding-left: 16px;
border-bottom: 1px solid #f2f2f2
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteListNotes__nav {
padding-right: 0;
padding-left: 0
}
}
@media only screen and (max-width:479px) {
.o-noteListNotes__nav {
padding-right: 0;
padding-left: 0
}
}
.o-noteListNotes__loading {
padding: 48px 0
}
@media only screen and (max-width:479px) {
.o-noteListNotes__loading {
padding: 32px 0
}
}
.o-noteListNotes__loading:empty {
padding: 0
}
.o-noteListNotes__nocontents {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
height: 400px;
font-size: 14px;
color: #787c7b
}
.o-noteListNotes__body {
position: relative;
z-index: 6
}
.o-noteListFooter__body {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
padding-bottom: env(safe-area-inset-bottom);
pointer-events: none;
background-color: #fff;
border-top: 1px solid #e6e6e6;
-webkit-transition: all .2s ease-in;
transition: all .2s ease-in;
-webkit-transform: translateY(110%);
transform: translateY(110%)
}
.o-noteListFooter__body.is--active {
z-index: 10;
pointer-events: auto;
-webkit-transition: all .4s cubic-bezier(1, 0, 0, 1);
transition: all .4s cubic-bezier(1, 0, 0, 1);
-webkit-transform: translate(0);
transform: translate(0)
}
.o-noteListFooter__inner {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
max-width: 940px;
height: 72px;
margin: 0 auto
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteListFooter__inner {
padding: 0 16px
}
}
@media only screen and (max-width:479px) {
.o-noteListFooter__inner {
height: 64px;
padding: 0 16px
}
}
.o-noteListFooter__text {
font-size: 16px
}
.o-noteListFooter__badge,
.o-noteListFooter__text {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteListFooter__badge {
-webkit-box-pack: center;
justify-content: center;
padding: 4px 16px;
margin-right: 8px;
font-weight: 700;
line-height: 1;
color: #fff;
background: #2cb696;
border-radius: 100px;
font-size: 14px
}
.o-noteListFooter__action {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-left: auto
}
.o-noteListFooter__delete {
position: relative;
margin-right: 24px
}
.o-noteListFooter__delete:last-child {
margin-right: 0
}
.o-noteListFooter__close {
margin-right: 16px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-noteListFooter__close {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-noteListFooter__close:hover {
color: #787c7b
}
}
.o-header {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-8e25dd7a {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-8e25dd7a {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-header {
position: relative;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: end;
justify-content: flex-end;
min-height: 48px;
padding: 8px 16px;
background-color: #fff;
border-bottom: 1px solid #f2f2f2
}
@media only screen and (max-width:479px) {
.o-header {
padding: 8px
}
}
.o-header__logo {
position: absolute;
top: 14px;
left: 50%;
display: block;
line-height: 1;
-webkit-transform: translate(-50%);
transform: translate(-50%)
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-header__logo {
left: 16px;
-webkit-transform: translate(0);
transform: translate(0)
}
}
@media only screen and (max-width:479px) {
.o-header__logo {
left: 16px;
-webkit-transform: translate(0);
transform: translate(0)
}
}
@media only screen and (max-width:359px) {
.o-header__logo {
display: none
}
}
.o-header__logoImage {
width: 84px;
vertical-align: top
}
@media only screen and (max-width:479px) {
.o-header {
padding: 8px
}
}
.o-header__action {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-header__actionItem {
margin-left: 8px
}
.o-noteContentText {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-17c1b5a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-17c1b5a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-noteContentText--device_windows .o-noteContentText__body,
.o-noteContentText--device_windows .o-noteContentText__body .note-editor-placeholder:after,
.o-noteContentText--device_windows .o-noteContentText__title,
.o-noteContentText--device_windows .o-noteContentText__title .note-editor-placeholder:after {
font-family: YakuHanJPs, Segoe UI, Arial, メイリオ, Meiryo, sans-serif
}
.o-noteContentText--font_sansserif .o-noteContentText__body,
.o-noteContentText--font_sansserif .o-noteContentText__body .note-editor-placeholder:after,
.o-noteContentText--font_sansserif .o-noteContentText__title,
.o-noteContentText--font_sansserif .o-noteContentText__title .note-editor-placeholder:after {
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif
}
.o-noteContentText__title {
min-height: 1em;
margin-top: 72px;
margin-bottom: 18px;
font-family: Hiragino Mincho ProN, ヒラギノ明朝 Pro W6, Hiragino Mincho Pro, HGS明朝E, Yu Mincho, YuMincho, ＭＳ Ｐ明朝, serif;
font-weight: 700;
line-height: 1.5;
color: #222;
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1;
pointer-events: auto;
font-size: 32px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__title {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__title {
font-size: 24px;
margin: 30px 16px 15px
}
}
.o-noteContentText__status {
position: relative;
display: -webkit-box;
display: flex;
flex-wrap: wrap;
margin-top: -8px;
margin-bottom: 20px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__status {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__status {
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__like {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-align: center;
align-items: center;
margin-right: 12px;
line-height: 1;
color: #ea3f60;
font-size: 14px
}
.o-noteContentText__likeIcon {
position: absolute;
font-size: 16px
}
.o-noteContentText__likeCount {
padding-left: 20px
}
.o-noteContentText__author {
width: 100%;
margin-bottom: 16px
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__author {
width: calc(100% - 80px);
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__author {
width: calc(100% - 32px);
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__body {
font-family: Hiragino Mincho ProN, ヒラギノ明朝 Pro W6, Hiragino Mincho Pro, HGS明朝E, Yu Mincho, YuMincho, ＭＳ Ｐ明朝, serif;
color: #222;
pointer-events: auto
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-noteContentText__body {
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body {
margin-right: 16px;
margin-left: 16px
}
}
.o-noteContentText__body b {
font-weight: 700
}
.o-noteContentText__body pre,
.o-noteContentText__body pre[data-name=preCode] {
padding: 36px;
margin-top: 36px;
margin-bottom: 36px;
font-family: note monospace, SFMono-Regular, Consolas, Menlo, Courier, monospace;
line-height: 18px;
color: #fff;
white-space: pre-wrap;
background-color: #282c34;
font-size: 12px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body pre,
.o-noteContentText__body pre[data-name=preCode] {
padding: 24px;
margin: 32px -16px
}
}
.o-noteContentText__body code,
.o-noteContentText__body code[data-name=code] {
display: block;
overflow-x: auto;
font-family: note monospace, SFMono-Regular, Consolas, Menlo, Courier, monospace;
line-height: 18px;
color: #fff;
word-wrap: normal;
white-space: pre;
-webkit-overflow-scrolling: touch;
font-size: 12px
}
.o-noteContentText__body code::-webkit-scrollbar,
.o-noteContentText__body code[data-name=code]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body blockquote,
.o-noteContentText__body figure,
.o-noteContentText__body h2,
.o-noteContentText__body h3,
.o-noteContentText__body p,
.o-noteContentText__body ul li {
margin-top: 36px;
margin-bottom: 36px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote,
.o-noteContentText__body figure,
.o-noteContentText__body h2,
.o-noteContentText__body h3,
.o-noteContentText__body p,
.o-noteContentText__body ul li {
margin-top: 30px;
margin-bottom: 30px
}
}
.o-noteContentText__body a {
text-decoration: underline;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-noteContentText__body a:hover {
color: #222;
text-decoration: none
}
}
.o-noteContentText__body img {
display: block;
max-width: 100%;
height: auto !important;
margin: 0 auto;
text-align: center;
cursor: pointer;
box-shadow: 0 0 1px rgba(34, 34, 34, .3)
}
.o-noteContentText__body img.is-slide {
cursor: -webkit-zoom-in;
cursor: zoom-in
}
.o-noteContentText__body h2,
.o-noteContentText__body h3 {
font-size: 24px;
margin-top: 50px;
margin-bottom: -18px;
font-weight: 700;
line-height: 1.75;
letter-spacing: .04em;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1
}
@media only screen and (max-width:479px) {
.o-noteContentText__body h2,
.o-noteContentText__body h3 {
font-size: 20px;
margin-top: 36px;
margin-bottom: -20px
}
}
.o-noteContentText__body p,
.o-noteContentText__body ul li {
font-size: 18px;
line-height: 36px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body p,
.o-noteContentText__body ul li {
font-size: 16px;
line-height: 30px
}
}
.o-noteContentText__body blockquote {
font-size: 16px;
padding: 25px 36px;
line-height: 36px;
background-color: #f7f9f9
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote {
font-size: 14px;
padding: 18px 24px;
line-height: 30px
}
}
.o-noteContentText__body blockquote>* {
margin-top: 0;
margin-bottom: 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body blockquote>* {
font-size: 14px
}
}
.o-noteContentText__body .widget-cover {
width: 100% !important;
cursor: pointer
}
.o-noteContentText__body .widget-cover>* {
pointer-events: none
}
.o-noteContentText__body .widget-cover:before {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
content: "";
border: 1px solid transparent;
border-radius: 4px;
opacity: 0
}
@media only screen and (min-width:769px) {
.o-noteContentText__body .widget-cover:hover:before {
opacity: 1
}
}
.o-noteContentText__body .widget-cover.is-selected:before {
background-color: rgba(#2cb696, .3);
background-color: rgba(var(--customPrimaryColor), .3);
border-color: #2cb696;
border-color: var(--customPrimaryColor);
opacity: 1
}
.o-noteContentText__body [embedded-service] {
position: relative;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;
border-radius: 4px
}
.o-noteContentText__body [embedded-service] ::-moz-selection {
background-color: transparent
}
.o-noteContentText__body [embedded-service] ::selection {
background-color: transparent
}
.o-noteContentText__body [embedded-service=googlemap] {
position: relative;
width: 100% !important;
height: 0;
padding-bottom: 75%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=googlemap] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=gist] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=gist]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=googleform] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=googleform]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=itunes] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=itunes]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=apple-music] {
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=apple-music]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=slideshare] {
width: 100%
}
.o-noteContentText__body [embedded-service=slideshare] iframe {
overflow: hidden;
vertical-align: top;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=speakerdeck] {
width: 100%
}
.o-noteContentText__body [embedded-service=speakerdeck] iframe {
overflow: hidden;
vertical-align: top;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=note] {
width: 100%;
max-width: auto;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body [embedded-service=note] iframe {
display: block !important;
width: 100% !important;
max-width: auto !important;
margin: 0 auto !important
}
.o-noteContentText__body [embedded-service=twitter] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body [embedded-service=twitter] .twitter-tweet {
margin-top: 0 !important;
margin-right: auto;
margin-bottom: 0 !important;
margin-left: auto
}
.o-noteContentText__body [embedded-service=twitterProfile] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
border: 1px solid #ccd6dd;
border-radius: 15px
}
.o-noteContentText__body [embedded-service=instagram] {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
overflow-x: auto;
-webkit-overflow-scrolling: touch
}
.o-noteContentText__body [embedded-service=instagram]::-webkit-scrollbar {
display: none
}
.o-noteContentText__body [embedded-service=instagram] iframe {
display: block;
width: 100% !important;
max-width: 500px !important;
height: 590px;
padding: 8px;
margin: 0 auto !important;
overflow: hidden;
border: 1px solid #f2f2f2;
border-radius: 4px
}
.o-noteContentText__body [embedded-service=tiktok] {
width: 100%;
max-width: 340px;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok] {
position: relative;
width: 100%;
max-width: none;
height: 0;
padding-bottom: 205.29412% !important
}
}
.o-noteContentText__body [embedded-service=tiktok] span div {
position: static !important;
left: auto !important;
max-width: none !important;
height: auto !important;
padding-top: 0 !important;
padding-bottom: 0 !important
}
.o-noteContentText__body [embedded-service=tiktok] iframe {
position: relative !important;
top: auto !important;
left: auto !important;
display: block;
width: 340px !important;
height: 700px !important;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok] iframe {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important
}
}
.o-noteContentText__body [embedded-service=tiktok-web] {
width: 100%;
max-width: 340px;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] {
position: relative;
width: 100%;
max-width: none
}
}
.o-noteContentText__body [embedded-service=tiktok-web] blockquote {
padding: 0;
margin: 0;
background-color: transparent
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] blockquote {
padding: 0
}
}
.o-noteContentText__body [embedded-service=tiktok-web] span div {
position: static !important;
left: auto !important;
max-width: none !important;
padding-top: 0 !important;
padding-bottom: 0 !important
}
.o-noteContentText__body [embedded-service=tiktok-web] iframe {
position: relative !important;
top: auto !important;
left: auto !important;
display: block;
width: 340px !important;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=tiktok-web] iframe {
width: 100% !important
}
}
.o-noteContentText__body [embedded-service=soundcloud] {
width: 100% !important;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=niconico] {
position: relative;
width: 100% !important;
height: 0;
padding-bottom: 56.25%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=niconico] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=spotify] div {
max-width: none !important
}
.o-noteContentText__body [embedded-service=youtube] {
position: relative;
height: 0;
padding-bottom: 56.25%;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=youtube] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
.o-noteContentText__body [embedded-service=vimeo] {
position: relative;
width: 100% !important;
border: 1px solid #f2f2f2
}
.o-noteContentText__body [embedded-service=vimeo] iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100%
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=note-slide] {
position: relative;
height: auto
}
.o-noteContentText__body [embedded-service=note-slide]:after {
display: block;
padding-top: calc(75% + 92px);
content: ""
}
}
.o-noteContentText__body [embedded-service=note-slide] iframe {
height: 455px;
border: none
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=note-slide] iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%
}
}
.o-noteContentText__body [embedded-service=external-article] a {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
padding: 24px;
text-decoration: none
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] a {
padding: 16px
}
}
.o-noteContentText__body [embedded-service=external-article] a:first-child {
width: 100%
}
.o-noteContentText__body [embedded-service=external-article] a:nth-child(2) {
-webkit-box-flex: 0;
flex: 0;
min-width: 220px;
padding: 0;
background-position: 50%;
background-size: cover;
border-left: 1px solid #f2f2f2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] a:nth-child(2) {
min-width: 120px
}
}
.o-noteContentText__body [embedded-service=external-article] strong {
display: block;
margin-bottom: 8px;
font-weight: 700;
word-break: break-all;
font-size: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] strong {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] em {
display: block;
margin-bottom: 4px;
line-height: 1.5;
color: #787c7b;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] em:nth-child(3) {
margin-bottom: 0;
color: #222
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget {
display: table;
width: 100%;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget>a {
display: table-cell;
padding: 16px;
vertical-align: middle
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-title {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-title {
max-height: 2.8em;
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-description {
display: -webkit-box;
max-height: 3em;
overflow: hidden;
color: #787c7b;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-image {
width: 225px;
height: 150px;
vertical-align: middle;
background-repeat: no-repeat;
background-position: 50%;
background-size: cover;
border-left: 1px solid #e8eceb;
border-radius: 0 3px 3px 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-image {
width: 120px;
height: 120px
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping>a:first-child {
-webkit-box-ordinal-group: 3;
order: 2
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-image {
display: -webkit-box;
display: flex;
width: 225px;
height: 225px;
padding: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-image {
-webkit-box-ordinal-group: 2;
order: 1;
width: 100%;
height: 190px;
padding: 16px 16px 0;
border: none
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget--type_shopping .external-article-widget-disclaimer {
text-decoration: underline
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-productImage {
display: block;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: 50%;
background-size: contain
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-price {
display: -webkit-box;
display: flex;
-webkit-box-align: end;
align-items: flex-end;
-webkit-box-pack: start;
justify-content: flex-start;
margin-top: 16px;
margin-bottom: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-price {
display: block;
margin-top: 8px;
margin-bottom: 8px
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-button .a-button__inner {
margin-top: 8px;
margin-bottom: 8px;
white-space: normal
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-regularprice,
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-saleprice {
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
font-weight: 700;
line-height: 1;
color: #222;
font-size: 16px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-saleprice+.external-article-widget-regularprice {
padding-left: 8px;
font-weight: 400;
color: #787c7b;
text-decoration: line-through;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-currency {
padding-left: 2px;
font-size: 12px
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-update {
margin-left: 8px;
line-height: 1;
color: #787c7b;
font-size: 10px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-update {
display: block;
margin-top: 4px;
margin-left: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .external-article-widget-url+.external-article-widget-button {
margin-top: 16px
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget {
width: 100%;
max-width: 500px;
margin-right: auto;
margin-left: auto;
overflow: hidden;
border: 1px solid #e6e6e6;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__link {
display: block !important;
width: 100%;
padding: 0 !important
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__header {
position: relative;
width: 100%;
height: 0;
padding-bottom: 52.3%;
overflow: hidden
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__cover {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__img {
width: 100% !important;
height: 100% !important;
border: none;
-o-object-fit: cover;
object-fit: cover
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__body {
display: block;
padding: 16px
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__title {
display: block;
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-weight: 700;
line-height: 1.5;
letter-spacing: .04em;
word-break: break-all;
-webkit-font-feature-settings: "palt"1;
font-feature-settings: "palt"1;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
font-size: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__title {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__description {
display: block;
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 12px;
font-style: normal;
line-height: 1.5;
color: #787c7b;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=external-article] .summary-large-image-widget__url {
display: block;
font-size: 10px;
font-style: normal;
line-height: 1.5
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
display: grid;
grid-template-areas: "detail aside""status aside";
grid-template-rows: 1fr auto;
grid-template-columns: 1fr 190px;
padding: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
grid-template-areas: "detail aside""status status";
grid-template-rows: 1fr auto;
grid-template-columns: 1fr 140px
}
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__link {
grid-template-columns: 1fr 132px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__detail {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
grid-area: detail;
-webkit-box-pack: center;
justify-content: center;
padding-right: 16px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__domain {
margin-bottom: 4px;
color: #787c7b;
font-size: 10px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__title {
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 16px;
font-weight: 700;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__title {
font-size: 14px;
-webkit-line-clamp: 3
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__property {
display: -webkit-box;
display: flex
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__property {
display: block
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__owner {
display: -webkit-box;
font-size: 12px;
margin-right: 16px;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__owner {
display: block;
margin-right: 0;
word-break: break-all
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #787c7b;
white-space: nowrap;
font-size: 12px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
margin-top: 4px;
white-space: normal
}
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__category {
font-size: 10px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__categoryIcon {
margin-right: 4px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__categoryIcon {
margin-right: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__aside {
grid-area: aside
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__thumbImg {
width: 100%;
height: auto;
margin-bottom: 16px;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__thumbImg {
margin-bottom: 8px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__status {
grid-area: status;
padding: 8px 16px 0 0
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__status {
padding: 16px 0 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusList {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusListItem {
margin-top: 0;
margin-right: 16px;
margin-bottom: 0;
line-height: 1
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__statusListItem--timeleft {
margin-right: 0;
margin-left: auto
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__currentAmount {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
margin-bottom: 0;
line-height: 1;
color: #222;
font-size: 14px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__currentAmount {
font-size: 12px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supporters {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
font-size: 14px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supporters {
font-size: 12px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supportersIcon {
margin-right: 4px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__supportersIcon {
margin-right: 0
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleft {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
color: #787c7b;
font-size: 12px
}
@media only screen and (max-width:359px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleft {
font-size: 10px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__timeleftIcon {
margin-right: 4px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate {
position: relative;
margin-top: 8px
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate:after {
position: absolute;
top: 2px;
left: 4px;
z-index: 1;
font-weight: 700;
color: #fff;
content: attr(title);
font-size: 10px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__complateRate {
height: 16px;
margin-right: -16px;
margin-bottom: -14px;
margin-left: -16px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value] {
width: 100%;
-webkit-appearance: none;
appearance: none;
-moz-appearance: none;
height: 16px;
overflow: hidden;
border: none;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value] {
border-radius: 0 0 3px 3px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-bar {
-webkit-appearance: none;
appearance: none;
overflow: hidden;
background-color: #f2f2f2;
border-radius: 4px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-bar {
border-radius: 0 0 3px 3px
}
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-webkit-progress-value {
-webkit-appearance: none;
appearance: none;
background-color: #2cb696
}
.o-noteContentText__body [embedded-service=external-article] .crowdfunding-widget__progress[value]::-moz-progress-bar {
-moz-appearance: none;
background-color: #2cb696
}
.o-noteContentText__body [embedded-service=attachment] {
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=attachment]:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__link {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 16px;
text-decoration: none;
cursor: pointer
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__link {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__info {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex-grow: 1;
-webkit-box-align: center;
align-items: center;
padding-right: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__info {
width: 100%;
padding-right: 0
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__icon {
padding-right: 16px;
color: #a8abb1
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__data {
-webkit-box-flex: 1;
flex-grow: 1
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__filename {
display: block;
margin-bottom: 8px;
font-weight: 700;
word-break: break-all;
font-size: 16px
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__loading {
font-size: 14px;
padding: 40px 16px 16px;
line-height: 1;
color: #787c7b;
text-align: center
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__loadingLabel {
padding-top: 24px;
background-image: url(https://d291vdycu0ht11.cloudfront.net/nuxt/production/img/loading_128x128.0f89a3b.gif);
background-repeat: no-repeat;
background-position: 50% 10%;
background-size: 32px
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__filesize {
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__note {
font-size: 10px;
color: #2cb696;
color: var(--customPrimaryColor);
text-decoration: none
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__note:hover {
color: #228d74;
color: var(--customPrimaryDarkenColor)
}
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=attachment] .file-widget__download {
width: 100%;
padding-top: 16px
}
}
.o-noteContentText__body [embedded-service=attachment] .file-widget__download .a-icon {
margin-right: 8px
}
.o-noteContentText__body [embedded-service=hr],
.o-noteContentText__body [embedded-service=wantedly] {
border: 1px solid #e6e6e6
}
@media only screen and (min-width:769px) {
.o-noteContentText__body [embedded-service=hr]:hover,
.o-noteContentText__body [embedded-service=wantedly]:hover {
border: 1px solid #a8abb1;
-webkit-transition: border .2s cubic-bezier(1, 0, 0, 1);
transition: border .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget {
width: 100%;
text-align: left
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__link,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__link {
display: -webkit-box;
display: flex;
width: 100%;
padding: 16px;
overflow: visible;
text-decoration: none
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__info,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__info {
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-pack: center;
justify-content: center
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__url,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__url {
position: relative;
display: block;
width: 100%;
margin-bottom: 8px;
font-size: 10px;
font-style: normal;
line-height: 1;
color: #787c7b;
text-indent: 48px
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__url:before,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__url:before {
position: absolute;
top: -1px;
left: 0;
width: 40px;
height: 14px;
padding: 2px 4px;
font-size: 10px;
font-weight: 700;
line-height: 1;
color: #fff;
text-align: center;
text-indent: 0;
white-space: nowrap;
content: "求人";
background-color: #2cb696;
background-color: var(--customPrimaryColor);
border-radius: 7px
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__title,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__title {
display: -webkit-box;
width: 100%;
max-height: 3em;
padding-right: 16px;
overflow: hidden;
font-size: 18px;
font-weight: 700;
word-break: break-all;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__title,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__title {
font-size: 14px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__requirements,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__requirements {
width: 100%;
padding-top: 8px;
padding-right: 16px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__requirements,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__requirements {
padding-top: 8px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__companyName,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__companyName {
display: block;
margin-bottom: 8px;
font-size: 12px;
font-weight: 700
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__companyName:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__companyName:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__location,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__location {
display: -webkit-box;
margin-bottom: 8px;
overflow: hidden;
font-size: 12px;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__location:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__location:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__occupations,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__occupations {
display: block;
margin-bottom: 4px;
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__occupations:last-child,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__occupations:last-child {
margin-bottom: 0
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__employmentSystem,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__employmentSystem {
display: block;
font-size: 12px;
color: #787c7b
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__aside,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__aside {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
-webkit-box-pack: center;
justify-content: center;
width: 190px
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__aside,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__aside {
width: 120px
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__thumbnailImg,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__thumbnailImg {
width: 100%;
height: 100px !important;
border: none;
border-radius: 4px;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center center;
object-position: center center
}
@media only screen and (max-width:479px) {
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__thumbnailImg,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__thumbnailImg {
height: 64px !important
}
}
.o-noteContentText__body [embedded-service=hr] .recruitment-widget__button,
.o-noteContentText__body [embedded-service=wantedly] .recruitment-widget__button {
width: 100%;
margin-top: 16px
}
.o-noteContentText__body [embedded-service=alu] {
max-width: 500px;
margin-right: auto;
margin-left: auto
}
.o-noteContentText__body .fude-iframe-ratio-widget__wrap {
position: relative;
width: 100%;
height: 0;
overflow: hidden;
border-radius: 4px
}
.o-noteContentText__body .fude-iframe-ratio-widget__inner {
position: static;
left: auto;
max-width: none;
height: auto;
padding-top: 0;
padding-bottom: 0
}
.o-noteContentText__body .fude-iframe-ratio-widget__iframe {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body .fude-iframe-ratio-widget__domain {
text-align: right
}
.o-noteContentText__body .fude-iframe-ratio-widget__link {
display: inline-block;
padding-top: 8px;
color: #787c7b;
text-decoration: none;
font-size: 12px
}
.o-noteContentText__body [embedded-service=oembed] {
border-radius: 0
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget {
margin: 0 auto
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__wrap {
position: relative;
width: 100%;
height: 0;
overflow: hidden
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__inner {
position: static;
left: auto;
max-width: none;
height: auto;
padding-top: 0;
padding-bottom: 0
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__iframe {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__domain {
text-align: right
}
.o-noteContentText__body [embedded-service=oembed] .fude-iframe-oembed-widget__link {
display: inline-block;
padding-top: 8px;
color: #787c7b;
text-decoration: none;
font-size: 12px
}
.o-noteContentText__body .fb-post {
display: block;
width: 100%;
max-width: 350px;
margin: 0 auto;
overflow-x: auto;
overflow-y: hidden
}
.o-textEditor {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-17c1b5a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-17c1b5a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-textEditor {
position: relative;
padding-top: 48px
}
.o-textEditor__header {
position: fixed;
top: 0;
left: 0;
z-index: 4;
width: 100%
}
.o-textEditor__body {
position: relative;
z-index: 1;
width: 100%;
max-width: 800px;
margin-right: auto;
margin-left: auto;
margin-top: 75px;
}
@media only screen and (max-width:479px) {
.o-textEditor__body.is-ios {
padding-top: 44px
}
}
.o-textEditor__eyecatch {
width: 100%;
/*max-width: 620px;*/
margin-top: 40px;
margin-right: auto;
margin-left: auto
}
@media only screen and (min-width:480px) and (max-width:768px) {
.o-textEditor__eyecatch {
width: calc(100% - 80px);
margin-right: 40px;
margin-left: 40px
}
}
@media only screen and (max-width:479px) {
.o-textEditor__eyecatch {
width: calc(100% - 32px);
margin-right: 16px;
margin-left: 16px
}
}
.o-textEditor__tips {
position: fixed;
top: 80px;
right: 16px;
z-index: 1
}
@media only screen and (max-width:479px) {
.o-textEditor__tips {
display: none
}
}
.o-textEditor__counter {
font-size: 14px;
padding-right: 16px;
margin-bottom: 16px;
color: #787c7b;
text-align: right
}
.o-textEditor__gallery {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 100;
overflow: auto;
background-color: #f7f9f9;
-webkit-overflow-scrolling: touch
}
.o-textEditor__article {
padding-bottom: 50vh
}
.o-textEditor__articleEyecatch {
margin-top: 56px
}
@media only screen and (max-width:479px) {
.o-textEditor__articleEyecatch {
margin-top: 0
}
}
.o-textEditor__articleLoading {
position: relative;
margin-top: 56px
}
@media only screen and (max-width:479px) {
.o-textEditor__articleLoading {
margin-top: 0
}
}
.o-textEditor__articleLoading:before {
display: block;
width: 100%;
height: 0;
padding-bottom: 52.34375%;
content: ""
}
.o-textEditor__articleLoadingDots {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 100%;
height: 100%
}
.o-textEditor__browserError {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 5;
background-color: #fff
}
.o-eyecatchPopover__button {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 48px;
height: 48px;
color: #fff;
cursor: pointer;
background-color: #ccc;
border-radius: 48px
}
@media only screen and (min-width:769px) {
.o-eyecatchPopover__button {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.o-eyecatchPopover__button:hover {
background-color: #a8abb1
}
}
.o-eyecatchPopover__list {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
@media only screen and (max-width:359px) {
.o-eyecatchPopover__list {
max-width: 256px
}
}
.o-eyecatchPopover__icon {
-webkit-box-flex: 0;
flex: 0 0 auto;
margin-right: 8px
}
.o-eyecatchPopover__label {
-webkit-box-flex: 1;
flex: 1;
overflow: hidden;
line-height: 1;
text-align: left;
text-overflow: ellipsis;
white-space: nowrap
}
.o-eyecatchPopover__labelNote {
display: block;
margin-top: 4px;
font-size: 10px
}
.o-eyecatchPopover__buttonContainer {
position: relative
}
.o-eyecatchPopover__help {
position: absolute;
top: 50%;
right: 16px;
z-index: 3;
color: #a8abb1;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
@media only screen and (min-width:769px) {
.o-eyecatchPopover__help {
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
.o-eyecatchPopover__help:hover {
color: #787c7b
}
}
.o-noteTips {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
.o-noteTips {
position: relative
}
/*.o-noteTips__body {*/
/* position: absolute;*/
/* top: -8px;*/
/* right: -8px;*/
/* z-index: 3;*/
/* width: 270px;*/
/* max-height: calc(100vh - 132px);*/
/* padding: 24px;*/
/* overflow-y: auto;*/
/* background-color: #fff;*/
/* border: 1px solid #e6e6e6;*/
/* border-radius: 4px;*/
/* -webkit-transition: -webkit-transform .2s ease-in;*/
/* transition: -webkit-transform .2s ease-in;*/
/* transition: transform .2s ease-in;*/
/* transition: transform .2s ease-in, -webkit-transform .2s ease-in;*/
/* -webkit-transform: translate(110%);*/
/* transform: translate(110%)*/
/*}*/
/*.o-noteTips__body.is-active {*/
/* -webkit-transition: -webkit-transform .3s ease-in-out;*/
/* transition: -webkit-transform .3s ease-in-out;*/
/* transition: transform .3s ease-in-out;*/
/* transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;*/
/* -webkit-transform: translate(0);*/
/* transform: translate(0)*/
/*}*/
.o-noteTips__close {
position: absolute;
top: 24px;
right: 24px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-noteTips__close:hover {
color: #ccc;
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteTips__title {
font-size: 16px;
margin-bottom: 24px;
font-weight: 700;
color: #2cb696
}
.o-noteTips__item {
margin-bottom: 32px
}
.o-noteTips__item:last-child {
margin-bottom: 0
}
.o-noteTips__itemTitle {
font-size: 12px;
margin-bottom: 8px;
font-weight: 400
}
.o-noteTips__listItem {
font-size: 14px;
position: relative;
padding-left: 16px;
margin-bottom: 8px;
line-height: 1.5
}
@media only screen and (max-width:768px) {
.o-noteTips__listItem {
margin-bottom: 8px
}
}
.o-noteTips__listItem:last-child {
margin-bottom: 0
}
.o-noteTips__listItem:before {
position: absolute;
top: .65em;
left: 0;
display: inline-block;
width: 4px;
height: 4px;
content: "";
background-color: #787c7b
}
.o-noteTips__listLink {
color: #787c7b
}
@media only screen and (min-width:769px) {
.o-noteTips__listLink {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.o-noteTips__listLink:hover {
color: #222
}
}
.o-noteManual {
position: relative
}
.o-noteManual__title {
font-size: 16px;
margin-bottom: 24px;
font-weight: 700;
color: #2cb696
}
.o-noteManual__body {
position: absolute;
top: -8px;
right: -8px;
z-index: 3;
width: 440px;
max-height: calc(100vh - 172px);
padding: 24px;
overflow-y: auto;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 4px;
-webkit-transition: -webkit-transform .2s ease-in;
transition: -webkit-transform .2s ease-in;
transition: transform .2s ease-in;
transition: transform .2s ease-in, -webkit-transform .2s ease-in;
-webkit-transform: translate(110%);
transform: translate(110%)
}
.o-noteManual__body.is-active {
-webkit-transition: -webkit-transform .3s ease-in-out;
transition: -webkit-transform .3s ease-in-out;
transition: transform .3s ease-in-out;
transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
-webkit-transform: translate(0);
transform: translate(0)
}
.o-noteManual__close {
position: absolute;
top: 24px;
right: 24px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-noteManual__close:hover {
color: #ccc;
-webkit-transition: color .2s cubic-bezier(1, 0, 0, 1);
transition: color .2s cubic-bezier(1, 0, 0, 1)
}
}
.o-noteManual__columns {
display: -webkit-box;
display: flex
}
.o-noteManual__column {
width: 50%;
padding-right: 24px
}
.o-noteManual__column+.o-noteManual__column {
padding-right: 0;
padding-left: 24px;
border-left: 1px solid #f2f2f2
}
.o-noteManual__item+.o-noteManual__item {
margin-top: 32px
}
.o-noteManual__itemTitle {
font-size: 12px;
margin-bottom: 8px;
font-weight: 400
}
.o-noteManual__itemDescription {
font-size: 12px;
margin-bottom: 8px;
color: #787c7b
}
.o-noteManual__itemIcon {
margin-right: 8px
}
.o-noteManual__itemBody {
display: -webkit-inline-box;
display: inline-flex
}
.o-noteManual__itemLabel {
font-size: 14px;
line-height: 1
}
.o-noteManual__itemList {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center
}
.o-noteManual__itemList+.o-noteManual__itemList {
margin-top: 8px
}
.o-noteManual__key {
font-size: 14px;
padding: 4px;
line-height: 1;
background-color: #f7f9f9;
border: 1px solid #f2f2f2;
border-radius: 4px
}
.o-noteManual__keySeparate {
margin: 0 4px
}
.o-noteManual__footer {
margin-top: 16px
}
.medium-editor-editor-element {
-webkit-tap-highlight-color: transparent
}
.medium-editor-anchor-preview {
position: absolute;
z-index: 1;
max-width: 280px;
cursor: pointer;
visibility: hidden;
background-color: #222;
border-radius: 4px
}
@media only screen and (min-width:769px) {
.medium-editor-anchor-preview:hover {
background-color: #2cb696
}
.medium-editor-anchor-preview:hover:after {
border-color: #2cb696 transparent transparent
}
.medium-editor-anchor-preview:hover:before {
border-color: transparent transparent #2cb696
}
}
.medium-editor-anchor-preview a {
display: inline-block;
margin: 8px;
line-height: 1;
color: #fff;
font-size: 14px
}
.medium-editor-anchor-preview-active {
visibility: visible
}
.medium-editor-arrow-over:before,
.medium-editor-arrow-under:after {
position: absolute;
left: 50%;
display: block;
width: 0;
height: 0;
margin-left: -8px;
content: "";
border-style: solid
}
.medium-editor-arrow-under:after {
border-width: 8px 8px 0
}
.medium-editor-arrow-over:before {
top: -8px;
border-width: 0 8px 8px
}
.medium-editor-toolbar {
position: absolute;
z-index: 3;
padding: 1px;
font-size: 16px;
visibility: hidden;
background-color: #222;
border-radius: 4px;
box-shadow: none
}
.medium-editor-toolbar ul {
padding: 0;
margin: 0
}
.medium-editor-toolbar li {
float: left;
padding: 0;
margin: 0;
list-style: none
}
.medium-editor-toolbar li button {
min-width: 50px;
height: 50px;
padding: 0;
color: #fff;
cursor: pointer
}
@media only screen and (min-width:769px) {
.medium-editor-toolbar li button[data-tooltip]:focus,
.medium-editor-toolbar li button[data-tooltip]:hover {
position: relative
}
.medium-editor-toolbar li button[data-tooltip]:focus:after,
.medium-editor-toolbar li button[data-tooltip]:hover:after {
position: absolute;
display: block;
max-width: 200px;
padding: 4px 8px;
overflow: hidden;
font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Segoe UI, Hiragino Kaku Gothic ProN, Hiragino Sans, ヒラギノ角ゴ ProN W3, Arial, メイリオ, Meiryo, sans-serif;
font-weight: 400;
line-height: 1.5;
text-align: center;
text-overflow: ellipsis;
word-break: break-all;
white-space: nowrap;
pointer-events: none;
content: attr(data-tooltip);
border: 1px solid #f2f2f2;
border-radius: 4px;
opacity: 0;
font-size: 12px;
-webkit-animation: tooltipAnimation .2s cubic-bezier(1, 0, 0, 1) .2s forwards;
animation: tooltipAnimation .2s cubic-bezier(1, 0, 0, 1) .2s forwards;
top: -8px;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-100%);
transform: translateX(-50%) translateY(-100%);
color: #fff;
background-color: #222
}
@-webkit-keyframes tooltipAnimation {
0% {
opacity: 0
}
to {
opacity: 1
}
}
@keyframes tooltipAnimation {
0% {
opacity: 0
}
to {
opacity: 1
}
}
}
.medium-editor-toolbar li .medium-editor-button-active,
.medium-editor-toolbar li button:hover {
color: #2cb696
}
.medium-editor-action-bold {
font-weight: bolder
}
.medium-editor-toolbar-active {
visibility: visible
}
.medium-editor-toolbar-active.medium-editor-stalker-toolbar {
-webkit-animation: medium-editor-pop-upwards .16s linear forwards;
animation: medium-editor-pop-upwards .16s linear forwards
}
.medium-editor-toolbar-form {
display: none;
color: #898d8c;
background: #222;
border-radius: 4px
}
.medium-editor-toolbar-form-active {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between
}
.medium-editor-toolbar-form .medium-editor-toolbar-input {
box-sizing: border-box;
height: 50px;
padding: 15px;
color: #fff;
color: #ccc;
background: #222;
background: #242424
}
.medium-editor-toolbar-form .medium-editor-toolbar-input,
.medium-editor-toolbar-form label {
-webkit-box-flex: 1;
flex: 1
}
.medium-editor-toolbar-form .medium-editor-toolbar-save {
display: none
}
.medium-editor-toolbar-close {
display: -webkit-box;
display: flex;
-webkit-box-flex: 0;
flex: 0 0 auto;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 50px;
height: 50px;
color: #fff
}
.medium-editor-toolbar-form .medium-editor-toolbar-form-row {
display: none;
padding-bottom: 5px;
margin-left: 5px;
line-height: 14px
}
.medium-editor-dragover {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 100%;
height: 75px;
border: 2px dashed #2cb696
}
.medium-editor-dragover:before {
color: #2cb696;
content: "ここに画像をドラッグしてください";
font-size: 14px
}
.sp-toolbar {
position: fixed;
top: 48px;
z-index: 4;
width: 100%;
background: #fff;
border-top: 1px solid #e6e6e6
}
.sp-toolbar.is-ios {
top: 48px;
z-index: 1;
margin-top: 1px;
border-top: none;
border-bottom: 1px solid #e6e6e6
}
.sp-toolbar.is-tablet .add-mode button,
.sp-toolbar.is-tablet .sp-toolbar__add button,
.sp-toolbar.is-tablet .style-mode button {
width: 56px;
height: 56px
}
.sp-toolbar.is-tablet .add-mode button i,
.sp-toolbar.is-tablet .sp-toolbar__add button i,
.sp-toolbar.is-tablet .style-mode button i {
-webkit-transform: scale(1.3);
transform: scale(1.3)
}
.sp-toolbar .sp-toolbar__add {
display: none
}
.sp-toolbar .style-mode {
display: block;
width: calc(100% - 88px);
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch
}
.sp-toolbar .style-mode.is-active {
display: block
}
.sp-toolbar .style-mode ul {
display: -webkit-box !important;
display: flex !important
}
.sp-toolbar .style-mode li {
-webkit-box-flex: 0;
flex: 0 0 auto;
pointer-events: auto
}
.sp-toolbar .add-mode {
position: absolute;
top: 0;
right: 0;
display: block;
-webkit-box-flex: 1;
flex: 1
}
.sp-toolbar .add-mode:before {
position: absolute;
top: 50%;
left: 0;
display: block;
width: 1px;
height: 100%;
content: "";
background-color: #f2f2f2;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.sp-toolbar .add-mode.is-active {
display: block
}
.sp-toolbar .add-mode ul {
display: -webkit-box !important;
display: flex !important
}
.sp-toolbar .add-mode button,
.sp-toolbar .style-mode button,
.sp-toolbar__add button {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 44px;
height: 44px;
color: #a8abb1;
pointer-events: auto;
background: #fff
}
.sp-toolbar .add-mode button.is-active,
.sp-toolbar .style-mode button.is-active,
.sp-toolbar__add button.is-active {
color: #222
}
.sp-toolbar .add-mode button.medium-editor-button-active,
.sp-toolbar .style-mode button.medium-editor-button-active,
.sp-toolbar__add button.medium-editor-button-active {
color: #2cb696
}
.sp-toolbar .default-actions {
position: relative;
display: none
}
.sp-toolbar .default-actions.is-active {
display: block
}
.sp-toolbar .medium-editor-toolbar-input {
width: calc(100% - 44px);
height: 44px
}
.sp-toolbar .medium-editor-toolbar-form {
position: relative;
border-radius: 0
}
.sp-toolbar .medium-editor-toolbar-close {
position: absolute;
right: 0;
bottom: 0;
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 44px;
height: 44px;
margin: 0;
border-left: 1px solid #e6e6e6
}
.sp-toolbar li button:disabled {
color: #ccc
}
.sp-toolbar li .medium-editor-button-active {
color: #2cb696
}
.sp-toolbar__body {
width: 100%
}
.sp-toolbar__add {
position: absolute;
top: 0;
right: 0;
display: none
}
.sp-toolbar__add:before {
position: absolute;
top: 50%;
left: 0;
display: block;
width: 1px;
height: 100%;
content: "";
background-color: #f2f2f2;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.sp-toolbar__add button {
color: #a8abb1
}
.sp-toolbar__add button.is-active {
color: #222
}
.sp-toolbar__icon--undo {
position: relative
}
.sp-toolbar__icon--undo:before {
position: absolute;
top: 50%;
right: 0;
display: block;
width: 1px;
height: 75%;
content: "";
background-color: #f2f2f2;
-webkit-transform: translateY(-50%);
transform: translateY(-50%)
}
.embed-toolbar {
position: absolute;
z-index: 3;
margin-left: -8px;
visibility: hidden;
background-color: #fff
}
.embed-toolbar-buttons {
display: -webkit-inline-box;
display: inline-flex
}
.embed-toolbar .action {
display: block;
margin-left: 8px
}
.embed-toolbar .button-circle {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 40px;
height: 40px;
color: #a8abb1;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 50%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
@media only screen and (min-width:769px) {
.embed-toolbar .button-circle:hover {
color: #787c7b;
border: 1px solid #a8abb1
}
}
.embed-toolbar-active {
visibility: visible
}
.o-popover {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-362d48a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-362d48a0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-popover__icon {
color: #a8abb1
}
@media only screen and (min-width:769px) {
.o-popover__icon {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.o-popover__icon:hover {
color: #787c7b
}
}
.o-searchWindow:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-472b3468 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-472b3468 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-searchWindow {
width: 280px
}
@media only screen and (max-width:479px) {
.o-searchWindow {
width: auto
}
}
.o-searchWindow__header {
position: relative;
padding: 12px 16px;
cursor: default
}
.o-searchWindow__title {
font-size: 12px;
font-weight: 700;
cursor: default
}
.o-searchWindow__deleteAll {
position: absolute;
top: 12px;
right: 16px;
color: #2cb696;
color: var(--customPrimaryColor);
font-size: 12px;
cursor: pointer
}
.o-searchWindow__body {
width: 100%
}
@media only screen and (max-width:479px) {
.o-searchWindow__body {
padding-bottom: 16px
}
}
.o-searchWindow__item {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
width: 100%
}
.o-searchWindow__item:last-child {
border-radius: 0 0 4px 4px
}
.o-searchWindow__item--header {
border-bottom: 1px solid #f2f2f2
}
@media only screen and (min-width:769px) {
.o-searchWindow__item:hover {
background-color: #f7f9f9
}
}
.o-searchWindow__link {
position: relative;
display: block;
display: -webkit-box;
display: flex;
-webkit-box-flex: 1;
flex: 1;
-webkit-box-align: center;
align-items: center;
padding: 12px 16px;
overflow: hidden;
color: #787c7b;
text-overflow: ellipsis;
white-space: nowrap;
cursor: pointer;
font-size: 14px
}
@media only screen and (min-width:769px) {
.o-searchWindow__link:hover {
color: #222
}
}
.o-searchWindow__avatar {
margin-right: 8px
}
.o-searchWindow__label {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.o-searchWindow__hash {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
width: 32px;
min-width: 32px;
height: 32px;
margin-right: 8px;
background-color: #fff;
border: 1px solid #f2f2f2;
border-radius: 32px
}
.o-searchWindow__hash:before {
font-weight: 700;
color: #787c7b;
content: "#";
font-size: 16px
}
.o-searchWindow__official {
position: absolute;
top: 8px;
left: 8px;
color: #2cb696;
color: var(--customPrimaryColor)
}
.o-searchWindow__delete {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
padding: 12px 16px;
color: #a8abb1;
cursor: pointer
}
@media only screen and (min-width:769px) {
.o-searchWindow__delete:hover {
color: #787c7b
}
}
.t-simple:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-3d3b6d36 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3d3b6d36 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.t-simple {
background-color: #f7f9f9
}
.t-simple__inner {
max-width: 628px;
padding: 24px;
margin-right: auto;
margin-left: auto
}
@media only screen and (max-width:479px) {
.t-simple__inner {
padding: 8px 0;
margin-right: 8px;
margin-left: 8px
}
}
.t-simple__header {
padding: 40px 48px;
margin-bottom: 16px;
background-color: #fff;
border: 1px solid #f2f2f2
}
@media only screen and (max-width:479px) {
.t-simple__header {
padding: 24px 16px;
margin-bottom: 8px
}
}
.t-simple__item {
padding: 48px;
background-color: #fff;
border: 1px solid #f2f2f2
}
@media only screen and (max-width:479px) {
.t-simple__item {
padding: 16px
}
}
.t-simple__item+.t-simple__item {
margin-top: 16px
}
@media only screen and (max-width:479px) {
.t-simple__item+.t-simple__item {
margin-top: 8px
}
}
.t-simple__title {
font-weight: 400;
text-align: center;
font-size: 24px
}
.p-specified:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-ec0a623c {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-ec0a623c {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.p-specified > img {
width: 100%; margin-bottom: 24px;
}
.p-specified__comment {
text-align: right; font-size: 14px;
}
.p-specified>.p-specified__subTitle:first-child {
margin-top: 0
}
.p-specified__subTitle {
margin-top: 32px;
margin-bottom: 16px;
font-weight: 700;
font-size: 14px
}
.p-specified__link {
color: #2cb696
}
@media only screen and (min-width:769px) {
.p-specified__link:hover {
color: #228d74
}
}
.p-specified__text {
font-size: 14px;
margin-top: 16px;
margin-bottom: 16px;
line-height: 1.5
}
.t-creator:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-3e536ef2 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3e536ef2 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.t-creator {
position: relative
}
.t-creator--background {
background-color: #f7f9f9
}
@media only screen and (min-width:768px) and (max-width:940px) {
.t-creator--background {
background-color: #fff
}
}
@media only screen and (min-width:480px) and (max-width:768px) {
.t-creator--background {
background-color: #fff
}
}
.p-creator:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-12b4c512 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-12b4c512 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.p-creator--background {
background-color: #f7f9f9
}
.o-noteList:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-3085e21a {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-3085e21a {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-noteList {
display: -webkit-box;
display: flex
}
.o-noteList__main {
width: 100%
}
.m-settings-sidebar:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/* @-webkit-keyframes loadingAnimation-data-v-7d1a04d1 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-7d1a04d1 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.m-settings-sidebar__head {
display: -webkit-box;
display: flex;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: justify;
justify-content: space-between;
margin-bottom: 24px
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__head {
margin-bottom: 8px;
background-color: #fff
}
}
.m-settings-sidebar__title {
font-size: 24px;
font-weight: 700;
line-height: 1.5
}
.m-settings-sidebar__help {
margin-left: 8px;
color: #a8abb1
}
@media only screen and (min-width:769px) {
.m-settings-sidebar__help {
-webkit-transition: all .2s cubic-bezier(1, 0, 0, 1);
transition: all .2s cubic-bezier(1, 0, 0, 1)
}
.m-settings-sidebar__help:hover {
color: #787c7b
}
}
.m-settings-sidebar__nav {
width: 100%
}
.m-settings-sidebar__nav::-webkit-scrollbar {
display: none
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__nav {
display: -webkit-box;
display: flex;
margin-left: -8px;
overflow-x: scroll;
overflow-y: hidden;
-webkit-overflow-scrolling: touch
}
}
.m-settings-sidebar__list {
width: 100%;
padding-bottom: 16px;
margin-bottom: 16px;
border-bottom: 1px solid #e6e6e6
}
.m-settings-sidebar__list:last-child {
border-bottom: none
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__list {
display: -webkit-box;
display: flex;
width: auto;
padding-bottom: 0;
margin-bottom: 0;
border-bottom: none
}
.m-settings-sidebar__list:last-child {
border-right: none
}
.m-settings-sidebar__list+.m-settings-sidebar__list {
padding-left: 8px;
margin-left: 8px;
border-left: 1px solid #e6e6e6
}
}
.m-settings-sidebar__item {
position: relative;
width: 100%
}
.m-settings-sidebar__item[data-is-current=true] {
font-weight: 700;
color: #2cb696
}
@media only screen and (min-width:769px) {
.m-settings-sidebar__item:hover:before {
position: absolute;
top: 0;
right: -8px;
bottom: 0;
left: -8px;
display: block;
content: "";
background-color: #f2f2f2;
border-radius: 4px
}
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__item {
width: auto;
color: #787c7b;
white-space: nowrap
}
}
.m-settings-sidebar__link {
position: relative;
z-index: 1;
display: block;
width: 100%;
padding: 8px 0;
cursor: pointer;
font-size: 16px
}
@media only screen and (max-width:768px) {
.m-settings-sidebar__link {
padding: 4px 8px;
font-size: 14px
}
}
.o-noteListLibrary:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-38c49ed0 {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-38c49ed0 {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-noteListLibrary__body {
width: auto;
margin: 0 auto
}
.o-noteListLibrary__grid {
display: -webkit-box;
display: flex;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between
}
@media only screen and (max-width:479px) {
.o-noteListLibrary__grid {
display: block
}
}
.o-noteListLibrary__item {
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-direction: column;
width: calc(50% - 16px);
margin-bottom: 48px
}
.o-noteListLibrary__item:nth-last-child(-n+2) {
margin-bottom: 0
}
@media only screen and (max-width:479px) {
.o-noteListLibrary__item {
width: 100%;
padding: 0 0 16px;
margin: 0
}
.o-noteListLibrary__item+.o-noteListLibrary__item {
padding: 16px 0;
border-top: 1px solid #f2f2f2
}
}
.o-noteListLibrary__loading {
padding: 48px 0
}
@media only screen and (max-width:479px) {
.o-noteListLibrary__loading {
padding: 32px 0
}
}
.o-noteListLibrary__loading:empty {
padding: 0
}
.o-editTextNoteForm:root {
--noteGreen: #2cb696;
--noteDarkenGreen: #228d74;
--customPrimaryColor: #2cb696;
--customPrimaryDarkenColor: #228d74;
--z-index-modal: 9999;
--z-index-coast: 10000
}
/*
@-webkit-keyframes loadingAnimation-data-v-55b8d7ec {
0% {
opacity: 1
}
to {
opacity: .3
}
}
@keyframes loadingAnimation-data-v-55b8d7ec {
0% {
opacity: 1
}
to {
opacity: .3
}
} */
.o-editTextNoteForm__onboarding {
padding-right: 24px;
padding-left: 24px;
margin-top: 24px;
margin-bottom: 24px
}
@media only screen and (max-width:479px) {
.o-editTextNoteForm__onboarding {
padding-right: 16px;
padding-left: 16px;
margin-top: 16px;
margin-bottom: 16px
}
}
.o-editTextNoteForm__onboarding:empty {
padding: 0;
margin: 0
}
.o-editTextNoteForm__item {
padding-right: 24px;
padding-left: 24px;
margin-top: 24px;
margin-bottom: 24px
}
@media only screen and (max-width:479px) {
.o-editTextNoteForm__item {
padding-right: 16px;
padding-left: 16px;
margin-top: 16px;
margin-bottom: 16px
}
}
.o-editTextNoteForm__item:empty {
padding: 0;
margin: 0
}
.o-editTextNoteForm__loading {
margin: 32px 0
}
/* <-- added by sub end */
.psubt {
margin-top: 32px;
margin-bottom: 16px;
font-weight: 700;
font-size: 16px
}
.ptxt {
font-size: 14px;
margin-top: 16px;
margin-bottom: 16px;
line-height: 1.5
}