@charset "UTF-8"; /*** The new CSS reset - version 1.7.3 (last updated 7.8.2022) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; appearance: revert; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } html { font-family: "Noto Sans CJK JP", "游ゴシック", "Yu Gothic", "游ゴシック体", Avenir, "Open Sans", "Helvetica Neue", Helvetica, Arial, Verdana, Roboto, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳＰゴシック", "MS PGothic", sans-serif; font-size: 10px; font-weight: 400; } body { background-color: #F1EFE5; display: flex; font-size: 1.6rem; min-height: 100vh; justify-content: center; } .display { background-color: #FFFFFF; height: 100%; max-width: 42rem; width: 100%; } header { align-items: center; border: 0.1rem solid #DCE0E0; border-width: 0.1rem 0; display: flex; height: 6.5rem; justify-content: space-between; padding: 0 2.4rem; } header .title-logo { height: 3.6rem; width: 12.6rem; } header .write-button { height: 3.8rem; width: 7.2rem; } footer > section { padding: 4rem 2.4rem 0; color: #2C2D48; } footer > section.about { padding-bottom: 4rem; display: flex; align-items: center; flex-direction: column; } footer > section.about .sub-heading { font-size: 1.2rem; letter-spacing: 0.4rem; } footer > section.about .heading { margin-top: 0.4rem; font-size: 2rem; font-weight: bold; } footer > section.about .description { margin-top: 1.6rem; font-size: 1.5rem; line-height: 2.6rem; } footer > section.about .yomimono-link { margin-top: 1.5rem; text-decoration: underline; } footer > section.recommendations { padding: 0; border-bottom: 1px solid #DCE0E0; } footer > section.recommendations::before { content: ""; background: url("/assets/spacer-begin-5ad8d687e8ee1fb12bfd64261aaede9421eb54b5.png"); background-repeat: no-repeat; background-size: cover; display: block; height: 5rem; } footer > section.recommendations .recommendations-inner-content { padding: 0 2.4rem 4rem; display: flex; align-items: center; flex-direction: column; background-color: #F9F8F4; } footer > section.recommendations .sub-heading { font-size: 1.6rem; } footer > section.recommendations .heading { font-size: 2rem; font-weight: bold; } footer > section.recommendations ul { margin-top: 1.6rem; width: 100%; display: flex; flex-direction: column; gap: 0.8rem; } footer > section.recommendations ul li > a { display: block; border: 1px solid #2C2D48; border-radius: 0.8rem; padding: 1.2rem 1.6rem; background-color: #FFFFFF; } footer > section.recommendations ul li > a .recommendation-item { display: flex; gap: 1.6rem; position: relative; } footer > section.recommendations ul li > a .recommendation-item::after { content: ""; background: url("/assets/black-right-d926e26621d2e6a20d75b371d52a834306efbaea.png"); background-repeat: no-repeat; background-size: cover; display: block; height: 1.6rem; width: 1.6rem; position: absolute; top: calc(50% - 0.8rem); right: 0; } footer > section.recommendations ul li > a .icon { width: 4.8rem; height: 4.8rem; border-radius: 4rem; position: relative; } footer > section.recommendations ul li > a .icon::before { content: ""; display: block; position: absolute; } footer > section.recommendations ul li > a .icon.remedy { background-color: #92DCEC; } footer > section.recommendations ul li > a .icon.remedy::before { height: 2.4rem; width: 2.4rem; top: calc(50% - 1.2rem); left: 1.4rem; background: url("/assets/medicine-icon-ec9b49f0920b395942631a9b550c2039b37b9593.png"); background-repeat: no-repeat; background-size: cover; } footer > section.recommendations ul li > a .icon.meal { background-color: #FFC065; } footer > section.recommendations ul li > a .icon.meal::before { height: 2.2rem; width: 3.1rem; top: calc(50% - 1.1rem); left: 0.8rem; background: url("/assets/meal-icon-6e00c0639a8ecff5f8ece9626e6f7bf5ad7ec1fe.png"); background-repeat: no-repeat; background-size: cover; } footer > section.recommendations ul li > a .icon.story { background-color: #A7D052; } footer > section.recommendations ul li > a .icon.story::before { height: 2.4rem; width: 2.4rem; top: calc(50% - 1.2rem); left: 1.2rem; background: url("/assets/talk-icon-8980a234e6cd27301efd1c67da99b7c096870f01.png"); background-repeat: no-repeat; background-size: cover; } footer > section.recommendations ul li > a .icon.discussion { background-color: #FBA5A3; } footer > section.recommendations ul li > a .icon.discussion::before { height: 2.6rem; width: 2.7rem; top: calc(50% - 1.5rem); left: 1.1rem; background: url("/assets/discussion-icon-ba328a8127d4ffae9dde5991c3b800f700ba64da.png"); background-repeat: no-repeat; background-size: cover; } footer > section.recommendations ul li > a .title { display: flex; align-items: center; line-height: 1.8rem; } footer > section.recommendations ul li > a .arrow { position: relative; } footer > section.recommendations ul li > a .arrow::before { position: absolute; top: 1.6rem; background: url("/assets/black-right-d926e26621d2e6a20d75b371d52a834306efbaea.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 1.6rem; width: 1.6rem; } footer > section.footer-links li { align-items: center; display: flex; height: 4.4rem; justify-content: center; width: 100%; } .new-message-link { align-items: center; background-color: #F0805D; border-radius: 2.2rem; display: flex; flex-direction: row; height: 4.4rem; justify-content: center; margin-top: 0.8rem; width: 100%; } .new-message-link .write-label { height: 2.4rem; width: 12rem; } .flash-container { margin-bottom: 0.8rem; } .flash { border-radius: 0.4rem; border-style: solid; border-width: 1px; margin: 0 auto; padding: 1rem; width: 87rem; } .flash.notice { border-color: #D9D9D9; color: #2C2D48; } .flash.alert { border-color: #F0805D; color: #F0805D; } body > main.moded { height: 100vh; overflow-y: hidden; } dialog[open] { background-color: rgba(0, 0, 0, 0); left: max(8.5%, (100% - 35rem) / 2); margin-top: 10.8rem; max-width: 35rem; position: absolute; top: 0; width: 83%; } dialog[open]::backdrop { background-color: #333333; opacity: 0.6; } dialog[open] .modal { border-radius: 0.8rem; overflow: hidden; width: 100%; } dialog[open] .modal .main { align-items: center; background-color: #F9F8F4; display: flex; flex-direction: column; padding: 3.2rem 2.4rem 2.4rem; } dialog[open] .modal .main.message-before-body > p { font-size: 1.8rem; line-height: 2.52rem; padding: 4rem 0; width: 100%; } dialog[open] .modal .main h1 { font-size: 2rem; font-weight: bold; text-align: center; } dialog[open] .modal .main .message-sent { height: 11.4rem; margin: 0.6rem 0 0.8rem; width: 10.3rem; } dialog[open] .modal .main .feedback-sent { height: 9rem; margin: 2.4rem 0; width: 18.9rem; } dialog[open] .modal .main .inquiry-sent { height: 10.5rem; margin: 0.8rem 0 1.2rem; width: 17.9rem; } dialog[open] .modal .main > p { font-weight: 400; font-size: 1.5rem; line-height: 2.22rem; text-align: center; } dialog[open] .modal .buttons { background-color: #FFFFFF; padding: 1.6rem 2.3rem; } dialog[open] .modal .buttons .close-modal-button, dialog[open] .modal .buttons #message_before_yes { background-color: #F0805D; border-radius: 2.2rem; color: #FFFFFF; cursor: pointer; font-size: 1.6rem; font-weight: bold; height: 4.4rem; line-height: 4.4rem; text-align: center; width: 100%; } dialog[open] .modal .buttons #message_before_no { border: solid 0.1rem #F0805D; border-radius: 2.2rem; color: #F0805D; cursor: pointer; font-size: 1.6rem; font-weight: bold; height: 4.4rem; line-height: 4.4rem; margin-top: 1.6rem; text-align: center; width: 100%; } .pages { background-color: #F9F8F4; line-height: 2.6rem; padding: 4rem 2.4rem; } .pages > h1 { font-size: 1.8rem; font-weight: 700; line-height: 2.7rem; margin-bottom: 2.4rem; } .pages > section { margin-top: 2.4rem; } .pages > section h1 { font-size: 1.8rem; font-weight: bold; line-height: 2.7rem; margin-bottom: 0.8rem; } .pages > section p { margin-top: 2.7rem; } .pages > section p::first-child { margin-top: 0; } .card { background-color: #FFFFFF; border: 0.1rem solid #9596A3; border-radius: 0.8rem; display: flex; flex-direction: column; padding: 1.6rem; } .card .message-body { font-size: 1.5rem; line-height: 2.6rem; margin-bottom: 1.2rem; } .card .message-body .card-read-more { color: #979797; cursor: pointer; } .card .message-body .card-read-more::before { color: #2C2D48; display: inline; content: "…"; margin-right: 0.8rem; } .card .message-body .card-read-more.hidden { display: none; } .card .message-body .message-rest-part { display: none; } .card .message-body .message-rest-part.shown { display: inline; } .card .message-footer { align-items: end; display: flex; flex-direction: row; justify-content: space-between; } .card .message-footer .message-name { font-size: 1.5rem; line-height: 1.5rem; } .card .message-footer .message-properties { display: flex; align-items: end; } .card .message-footer .message-properties .message-category { border-radius: 1.3rem; color: #FFFFFF; display: block; font-weight: bold; font-size: 1.2rem; height: 2.6rem; line-height: 2rem; min-width: 4.4rem; padding: 0.4rem 1rem; } .card .message-footer .message-properties .message-category.remedy { background-color: #7EC1D0; } .card .message-footer .message-properties .message-category.meal { background-color: #F9B552; } .card .message-footer .message-properties .message-category.work { background-color: #CD7F37; } .card .message-footer .message-properties .message-category.school { background-color: #D27E7C; } .card .message-footer .message-properties .message-category.family { background-color: #FBA5A3; } .card .message-footer .message-properties .message-category.future { background-color: #A7D052; } .card .message-footer .message-properties .message-category.event { background-color: #647195; } .card .message-footer .message-properties .message-category.other { background-color: #9B94CF; } .card .message-footer .message-properties .message-likes { align-items: center; cursor: pointer; display: flex; flex-direction: column; margin-left: 1.2rem; } .card .message-footer .message-properties .message-likes .message-like-count { color: #F0805D; font-size: 1.2rem; font-weight: bold; margin-bottom: -0.2rem; } .card .message-footer .message-properties .message-likes::after { background: url("/assets/heart-592ffd2acfc54c65d933ffc0fb8992a695a07273.png"); background-repeat: no-repeat; background-size: contain; content: ""; display: block; height: 1.779rem; width: 2rem; } .card .message-tags { display: flex; flex-wrap: wrap; margin-top: 0.8rem; gap: 0.8rem; font-size: 1.4rem; } .card .message-tags a { text-decoration: underline; color: #006284; } #index #title { align-items: center; background-color: #F9F8F4; color: #2C2D48; display: flex; flex-direction: column; } #index #title h1 > img { display: block; } #index #title .description { width: 100%; display: flex; flex-direction: column; gap: 0.8rem; } #index #title p { font-size: 1.5rem; line-height: 2.6rem; padding: 0 2.4rem; } #index #title .yomimono-link { margin-top: 1.6rem; text-decoration: underline; } #index #title .buttons { padding: 2.4rem 2.4rem 0; width: 100%; } #index #title::after { background: url("/assets/spacer-end-6903c4e93f527bf78f77a7535335b9601ab1d26e.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 5rem; margin-top: 3.2rem; width: 100%; } #index #top_card { align-items: center; display: flex; flex-direction: column; padding: 0 2.4rem; width: 100%; } #index #top_card .sub-heading { font-size: 1.2rem; letter-spacing: 0.4rem; } #index #top_card h2 { margin-top: 0.4rem; align-items: center; display: flex; font-size: 2rem; font-weight: bold; justify-content: center; line-height: 3rem; text-align: center; } #index #top_card h2::before { background: url("/assets/message-icon-ae30d5a9df5f672da224c5c0cf9ac9127514add9.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #index #top_card .open-search-modal { margin-top: 2.4rem; } #index #top_card .top-cards { padding: 1.6rem 0; width: 100%; display: flex; flex-direction: column; gap: 1.6rem; } #index #top_card .more-messages-link { align-items: center; background-color: #F0805D; border-radius: 2.2rem; display: flex; flex-direction: row; height: 4.4rem; justify-content: center; margin-top: 0.8rem; width: 100%; } #index #top_card .more-messages-link .more-messages-label { height: 2.4rem; width: 10.4rem; } #index #introduction { background-color: #F9F8F4; margin-top: 4rem; } #index #introduction::before { background: url("/assets/spacer-begin-5ad8d687e8ee1fb12bfd64261aaede9421eb54b5.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 5rem; width: 100%; } #index #introduction::after { background: url("/assets/spacer-end-6903c4e93f527bf78f77a7535335b9601ab1d26e.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 5rem; margin-top: 4rem; width: 100%; } #index #introduction .buttons { padding: 0 2.4rem; } #categories { background-color: #FFFFFF; padding-top: 4rem; } #categories .sub-heading { text-align: center; font-size: 1.2rem; letter-spacing: 0.4rem; } #categories h2 { margin-top: 0.4rem; align-items: center; display: flex; font-weight: bold; font-size: 2rem; justify-content: center; line-height: 3rem; } #categories h2::before { background: url("/assets/message-icon-ae30d5a9df5f672da224c5c0cf9ac9127514add9.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #categories ul { display: flex; flex-wrap: wrap; justify-content: space-between; margin: 1.6rem 2.4rem 0; } #categories ul li { height: 5.6rem; margin-top: 0.8rem; width: calc((100% - 0.8rem) / 2); } #categories ul li .category-link { align-items: center; border: 0.1rem solid #2C2D48; border-radius: 0.8rem; display: flex; height: 100%; justify-content: space-between; padding: 0 1.6rem; width: 100%; } #categories ul li .category-link > span { max-width: calc(100% - 1.6rem); } #categories ul li .category-link::after { background: url("/assets/black-right-d926e26621d2e6a20d75b371d52a834306efbaea.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 1.6rem; width: 1.6rem; } #categories .buttons { padding: 1.6rem 2.4rem 0; } #messages { background-color: #F9F8F4; padding: 4rem 2.4rem; } #messages .sub-heading { text-align: center; font-size: 1.2rem; letter-spacing: 0.4rem; } #messages > h1 { margin-top: 0.4rem; align-items: center; display: flex; font-weight: bold; font-size: 2rem; justify-content: center; line-height: 3rem; } #messages > h1::before { content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #messages > h1.index::before { background: url("/assets/message-icon-ae30d5a9df5f672da224c5c0cf9ac9127514add9.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.remedy::before { background: url("/assets/message-remedy-icon-7ac38f6e8c9422bba15da381f99dd9c86f269723.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.meal::before { background: url("/assets/message-meal-icon-6a22e66deb800eb6533f089f560b1fc210cc22ba.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.work::before { background: url("/assets/message-work-icon-42a46d25d91f2f185ea3415f447d28b3feefd414.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.school::before { background: url("/assets/message-school-icon-d829678b185ac7b9745bee965a179bbee7973b1f.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.family::before { background: url("/assets/message-family-icon-1ba3cbc1ac7a4be0206f6f51335c8883c83daded.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.future::before { background: url("/assets/message-future-icon-53833a51df18ee21ee5c636403ff0661cbdddc89.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.event::before { background: url("/assets/message-event-icon-eda69e7f4bbb773a3e72accbeb1ebaffca1e8957.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.other::before { background: url("/assets/message-other-icon-79c110bfa4eb1a764340eedbbda2378f5bf00ab7.png"); background-repeat: no-repeat; background-size: cover; } #messages > h1.search-result::before { mask-image: url("/assets/ic_magnifying-glass-4781e5ccf2cf9d1d97f8e128d7913954c50a22f6.svg"); background-color: #2C2D48; } #messages > h1.tag::before { width: 0; height: 0; margin-right: 0; } #messages .lead { line-height: 2.6rem; margin-top: 0.8rem; text-align: center; } #messages .total-count { color: #676767; line-height: 2.6rem; text-align: center; } #messages .open-search-modal-container { margin-top: 2.4rem; } #messages .open-search-modal { margin: 0 auto; } #messages .cards { margin-top: 0.8rem; } #messages .cards .each-card { margin-top: 1.6rem; } #messages .cards .each-card::first-child { margin-top: 0; } #messages .pagination { align-items: center; display: flex; justify-content: center; margin-top: 2.4rem; } #messages .pagination .page { color: #9596A3; display: block; height: 2.4rem; line-height: 2.4rem; margin-left: 0.2rem; text-align: center; width: 2.4rem; } #messages .pagination .page.current { background-color: #9596A3; border-radius: 0.4rem; color: #FFFFFF; } #messages .buttons { margin-top: 4rem; } #messages_new { background-color: #F9F8F4; padding: 4rem 2.4rem; } #messages_new .sub-heading { text-align: center; font-size: 1.2rem; letter-spacing: 0.4rem; } #messages_new > h1 { align-items: center; display: flex; font-weight: bold; font-size: 2rem; justify-content: center; line-height: 3rem; margin-bottom: 3.2rem; } #messages_new > h1::before { background: url("/assets/write-icon-494bc6d73438f23d4ecb734a4cb7887c3f426164.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #messages_confirm { background-color: #F9F8F4; padding: 4rem 2.4rem; } #messages_confirm .sub-heading { text-align: center; font-size: 1.2rem; letter-spacing: 0.4rem; } #messages_confirm > h1 { align-items: center; display: flex; font-weight: bold; font-size: 2rem; justify-content: center; line-height: 3rem; margin-bottom: 3.2rem; } #messages_confirm > h1::before { background: url("/assets/write-icon-494bc6d73438f23d4ecb734a4cb7887c3f426164.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #messages_confirm label[for=message_agree] { max-width: calc(100% - 3rem); } #messages .introduction, #messages_new .introduction { background-color: #F9F8F4; } #messages .introduction.shorten::before, #messages_new .introduction.shorten::before { background-image: none; border-top: 0.1rem solid #DCE0E0; height: 4rem; } #messages .introduction #intro_accordion, #messages_new .introduction #intro_accordion { display: none; } #messages .introduction #intro_accordion.open, #messages_new .introduction #intro_accordion.open { display: block; animation: appear 0.5s ease; } @keyframes appear { 0% { opacity: 0; } 100% { opacity: 1; } } #messages .introduction #intro_accordion .intro-block, #messages_new .introduction #intro_accordion .intro-block { padding-top: 4rem; } #messages .introduction .buttons, #messages_new .introduction .buttons { margin-top: 1.6rem; } #messages .introduction .buttons #toggle_introduction, #messages_new .introduction .buttons #toggle_introduction { align-items: center; background-color: #FFFFFF; border: 1px solid #F0805D; border-radius: 2.2rem; display: flex; flex-direction: row; height: 4.4rem; justify-content: center; margin-top: 1.6rem; width: 100%; } #messages .introduction .buttons #toggle_introduction #intro_open_label, #messages_new .introduction .buttons #toggle_introduction #intro_open_label { cursor: pointer; display: block; height: 2.4rem; } #messages .introduction .buttons #toggle_introduction #intro_close_label, #messages_new .introduction .buttons #toggle_introduction #intro_close_label { display: none; height: 2.4rem; width: 7.2rem; } #messages .introduction .buttons #toggle_introduction.open #intro_open_label, #messages_new .introduction .buttons #toggle_introduction.open #intro_open_label { display: none; } #messages .introduction .buttons #toggle_introduction.open #intro_close_label, #messages_new .introduction .buttons #toggle_introduction.open #intro_close_label { cursor: pointer; display: block; } #inquiry { background-color: #F9F8F4; padding: 4rem 2.4rem; } #inquiry > h1 { align-items: center; display: flex; font-weight: bold; font-size: 2rem; justify-content: center; line-height: 3rem; } #inquiry > h1::before { background: url("/assets/inquiry-icon-b386aa034858b8da7ae2c55c8d51bc3e6e062985.png"); background-repeat: no-repeat; background-size: cover; content: ""; display: block; height: 2rem; margin-right: 0.4rem; width: 2rem; } #inquiry .privacy-link { display: inline-block; font-size: 1.6rem; font-weight: 400; line-height: 2.4rem; text-align: center; text-decoration: underline; width: 100%; } .form input[type=text], .form input[type=email], .form textarea { background-color: #FFFFFF; border: 0.1rem solid #9596A3; border-radius: 0.8rem; display: block; margin-top: 0.4rem; width: 100%; } .form input[type=text]::placeholder, .form input[type=email]::placeholder, .form textarea::placeholder { color: #9596A3; } .form input[type=text], .form input[type=email] { padding: 0.8rem 1.6rem; } .form textarea { height: 8rem; padding: 1.6rem; } .form input[type=text][disabled], .form input[type=email][disabled], .form textarea[disabled] { border-color: #FFFFFF; } .form .form-row { margin-top: 2.4rem; } .form .form-row .form-label { font-size: 1.5rem; line-height: 2.6rem; color: #2C2D48; } .form .form-row .form-label .notice { font-size: 1.3rem; font-weight: 400; } .form .form-row .form-categories label { background-color: #FFFFFF; border: 0.1rem solid #9596A3; border-radius: 1.5rem; color: #9596A3; color: #9596A3; cursor: pointer; display: inline-block; font-size: 1.5rem; font-weight: bold; height: 3rem; line-height: 2.2rem; margin: 0.8rem 0.8rem 0 0; padding: 0.4rem 1.2rem; } .form .form-row .form-categories input[type=radio]:checked + label, .form .form-row .form-categories input[type=checkbox]:checked + label { color: #FFFFFF; } .form .form-row .form-categories input[type=radio][value=remedy]:checked + label.remedy, .form .form-row .form-categories input[type=checkbox][value=remedy]:checked + label.remedy { background-color: #7EC1D0; border-color: #7EC1D0; } .form .form-row .form-categories input[type=radio][value=meal]:checked + label.meal, .form .form-row .form-categories input[type=checkbox][value=meal]:checked + label.meal { background-color: #F9B552; border-color: #F9B552; } .form .form-row .form-categories input[type=radio][value=work]:checked + label.work, .form .form-row .form-categories input[type=checkbox][value=work]:checked + label.work { background-color: #CD7F37; border-color: #CD7F37; } .form .form-row .form-categories input[type=radio][value=school]:checked + label.school, .form .form-row .form-categories input[type=checkbox][value=school]:checked + label.school { background-color: #D27E7C; border-color: #D27E7C; } .form .form-row .form-categories input[type=radio][value=family]:checked + label.family, .form .form-row .form-categories input[type=checkbox][value=family]:checked + label.family { background-color: #FBA5A3; border-color: #FBA5A3; } .form .form-row .form-categories input[type=radio][value=future]:checked + label.future, .form .form-row .form-categories input[type=checkbox][value=future]:checked + label.future { background-color: #A7D052; border-color: #A7D052; } .form .form-row .form-categories input[type=radio][value=event]:checked + label.event, .form .form-row .form-categories input[type=checkbox][value=event]:checked + label.event { background-color: #647195; border-color: #647195; } .form .form-row .form-categories input[type=radio][value=other]:checked + label.other, .form .form-row .form-categories input[type=checkbox][value=other]:checked + label.other { background-color: #9B94CF; border-color: #9B94CF; } .form .form-row .form-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.8rem; } .form .form-row .form-tags label { background-color: #FFFFFF; border: 0.1rem solid #9596A3; border-radius: 0.4rem; color: #9596A3; color: #9596A3; cursor: pointer; display: inline-block; font-size: 1.5rem; font-weight: bold; height: 4rem; line-height: 2.2rem; padding: 0.9rem 1.2rem; } .form .form-row .form-tags input[type=radio], .form .form-row .form-tags input[type=checkbox] { display: none; } .form .form-row .form-tags input[type=radio]:checked + label, .form .form-row .form-tags input[type=checkbox]:checked + label { color: #FFFFFF; background-color: #006284; border-color: #006284; } .form .agree-row label { align-items: center; display: flex; justify-content: start; } .form .agree-row label::before { background: url("/assets/unchecked-47a6790d7d87be3916b52fe764b01a55e1cb194f.png") no-repeat; background-size: cover; content: ""; display: block; flex: none; height: 2rem; margin-right: 0.8rem; width: 2rem; } .form .agree-row.checked label::before { background: url("/assets/checked-89655773ec728b80023fbc8c2d3e0d5a4019e414.png") no-repeat; background-size: cover; } .form .submit-button { align-items: center; background-color: #D9D9D9; border-radius: 2.2rem; display: flex; height: 4.4rem; justify-content: center; margin-top: 2.4rem; width: 100%; color: #FFFFFF; font-weight: bold; text-align: center; } .form .submit-button.active { background-color: #F0805D; cursor: pointer; } .form .submit-button img { height: 2.4rem; } .form .submit-button img.confirm { width: 18.4rem; } .form .submit-button img.post { width: 8.8rem; } .form .submit-button img.search { margin-right: 0.4rem; } .form .back-to-input-button { align-items: center; background-color: #FFFFFF; border: 0.2rem solid #F0805D; border-radius: 2.2rem; cursor: pointer; display: flex; height: 4.4rem; justify-content: center; margin-top: 1.6rem; width: 100%; } .form .back-to-input-button img { height: 2.4rem; width: 18.4rem; } .form .post-notice { font-size: 1.5rem; font-weight: bold; line-height: 2.6rem; } .form .post-notice a { text-decoration: underline; margin: 0 0.5rem; } .admin_inquiries_controller main { background-color: #FFFFFF; padding: 3.2rem 0; width: 100%; } .admin_inquiries_controller main header { border: none; display: flex; justify-content: space-between; } .admin_inquiries_controller main header h1 { font-size: 2.2rem; font-weight: bold; padding: 0 3.2rem; } .admin_inquiries_controller main header nav ul { display: flex; justify-content: flex-end; } .admin_inquiries_controller main header nav ul li { border-left: 0.2rem solid #9596A3; padding: 0.8rem 1.6rem; } .admin_inquiries_controller main header nav ul li:first-child { border-left: none; } .admin_inquiries_controller main #admin_inquiries { background-color: #F9F8F4; margin-top: 3.2rem; padding: 3.2rem; } .admin_inquiries_controller main #admin_inquiries h2 { font-size: 1.8rem; font-weight: bold; padding: 0 1.6rem; } .admin_inquiries_controller main #admin_inquiries nav { line-height: 2.4rem; margin: 1.6rem 0; } .admin_inquiries_controller main #admin_inquiries nav .current-filters { list-style: disc inside; } .admin_inquiries_controller main #admin_inquiries nav a { text-decoration: underline; } .admin_inquiries_controller main #admin_inquiries .pagination { font-size: 2.1rem; text-align: right; } .admin_inquiries_controller main #admin_inquiries .pagination a { text-decoration: underline; } .admin_inquiries_controller main #admin_inquiries table { width: 100%; } .admin_inquiries_controller main #admin_inquiries table tr { border-top: 0.1rem solid #9596A3; } .admin_inquiries_controller main #admin_inquiries table tr:last-child { border-bottom: 0.1rem solid #9596A3; } .admin_inquiries_controller main #admin_inquiries table th, .admin_inquiries_controller main #admin_inquiries table td { max-width: 6rem; padding: 0.8rem; vertical-align: middle; word-break: break-all; } .admin_inquiries_controller main #admin_inquiries table th.inquiry-body, .admin_inquiries_controller main #admin_inquiries table td.inquiry-body { min-width: 40rem; } .admin_inquiries_controller main #admin_inquiries table th.inquiry-read-at, .admin_inquiries_controller main #admin_inquiries table td.inquiry-read-at { min-width: 8rem; } .admin_inquiries_controller main #admin_inquiries table th { font-weight: bold; text-align: center; } .admin_inquiries_controller main #admin_inquiries table .inquiry-id, .admin_inquiries_controller main #admin_inquiries table .inquiry-created-at, .admin_inquiries_controller main #admin_inquiries table .inquiry-remote-ip, .admin_inquiries_controller main #admin_inquiries table .inquiry-read-at, .admin_inquiries_controller main #admin_inquiries table .inquiry-detail { text-align: center; } .admin_inquiries_controller main #admin_inquiries table .inquiry-detail a { text-decoration: underline; } .admin_inquiries_controller main #admin_inquiries table button { border: 0.2rem solid #A7D052; cursor: pointer; margin-left: 1.2rem; padding: 1.2rem; } .admin_inquiries_controller main #admin_inquiries table button.unread-button { border-color: #F0805D; color: #F0805D; } .admin_inquiries_controller main #admin_inquiry { background-color: #F9F8F4; margin: 0 auto; padding: 2.4rem; width: 87rem; } .admin_inquiries_controller main #admin_inquiry h2 { font-size: 1.8rem; font-weight: bold; padding: 1.6rem; } .admin_inquiries_controller main #admin_inquiry dl div { align-items: center; display: flex; justify-content: flex-start; padding: 0.8rem; word-break: break-all; } .admin_inquiries_controller main #admin_inquiry dl div dt { width: 20rem; } .admin_inquiries_controller main #admin_inquiry dl div dd { width: 60rem; } .admin_inquiries_controller main #admin_inquiry dl div dd button { border: 0.2rem solid #A7D052; cursor: pointer; margin-left: 1.2rem; padding: 1.2rem; } .admin_inquiries_controller main #admin_inquiry dl div dd button.unread-button { border-color: #F0805D; color: #F0805D; } .admin_inquiries_controller main #admin_inquiry dl div.inquiry-mail-address a { text-decoration: underline; } .admin_messages_controller main { background-color: #FFFFFF; padding: 3.2rem 0; width: 100%; } .admin_messages_controller main header { border: none; display: flex; justify-content: space-between; } .admin_messages_controller main header h1 { font-size: 2.2rem; font-weight: bold; padding: 0 3.2rem; } .admin_messages_controller main header nav ul { display: flex; justify-content: flex-end; } .admin_messages_controller main header nav ul li { border-left: 0.2rem solid #9596A3; padding: 0.8rem 1.6rem; } .admin_messages_controller main header nav ul li:first-child { border-left: none; } .admin_messages_controller main #admin_messages { background-color: #F9F8F4; margin-top: 3.2rem; padding: 3.2rem; } .admin_messages_controller main #admin_messages h2 { font-size: 1.8rem; font-weight: bold; padding: 0 1.6rem; } .admin_messages_controller main #admin_messages nav { line-height: 2.4rem; margin: 1.6rem 0; } .admin_messages_controller main #admin_messages nav .current-filters { list-style: disc inside; } .admin_messages_controller main #admin_messages nav p { margin-top: 0.4rem; } .admin_messages_controller main #admin_messages nav p.total_count { margin-bottom: 1rem; } .admin_messages_controller main #admin_messages nav .reviews a { border-radius: 1.5rem; color: #FFFFFF; background-color: #006284; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; } .admin_messages_controller main #admin_messages nav .reviews a.inactive { background-color: #FFFFFF; border: 0.1rem solid #9596A3; color: #2C2D48; } .admin_messages_controller main #admin_messages nav .categories a { border-radius: 1.5rem; color: #FFFFFF; background-color: #006284; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; } .admin_messages_controller main #admin_messages nav .categories a.remedy { background-color: #7EC1D0; } .admin_messages_controller main #admin_messages nav .categories a.meal { background-color: #F9B552; } .admin_messages_controller main #admin_messages nav .categories a.work { background-color: #CD7F37; } .admin_messages_controller main #admin_messages nav .categories a.school { background-color: #D27E7C; } .admin_messages_controller main #admin_messages nav .categories a.family { background-color: #FBA5A3; } .admin_messages_controller main #admin_messages nav .categories a.future { background-color: #A7D052; } .admin_messages_controller main #admin_messages nav .categories a.event { background-color: #647195; } .admin_messages_controller main #admin_messages nav .categories a.other { background-color: #9B94CF; } .admin_messages_controller main #admin_messages nav .categories a.inactive { background-color: #FFFFFF; border: 0.1rem solid #9596A3; color: #2C2D48; } .admin_messages_controller main #admin_messages nav .tags a { border-radius: 1.5rem; color: #FFFFFF; background-color: #006284; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; } .admin_messages_controller main #admin_messages nav .tags a.inactive { background-color: #FFFFFF; border: 0.1rem solid #9596A3; color: #2C2D48; } .admin_messages_controller main #admin_messages .pagination { font-size: 2.1rem; text-align: right; } .admin_messages_controller main #admin_messages .pagination a { text-decoration: underline; } .admin_messages_controller main #admin_messages table { width: 100%; } .admin_messages_controller main #admin_messages table tr { border-top: 0.1rem solid #9596A3; } .admin_messages_controller main #admin_messages table tr:last-child { border-bottom: 0.1rem solid #9596A3; } .admin_messages_controller main #admin_messages table th, .admin_messages_controller main #admin_messages table td { padding: 0.8rem; vertical-align: middle; word-break: break-all; } .admin_messages_controller main #admin_messages table th a, .admin_messages_controller main #admin_messages table td a { text-decoration: underline; } .admin_messages_controller main #admin_messages table th.message-id, .admin_messages_controller main #admin_messages table td.message-id { width: 6rem; } .admin_messages_controller main #admin_messages table th.message-posted-at, .admin_messages_controller main #admin_messages table td.message-posted-at { width: 10rem; } .admin_messages_controller main #admin_messages table th.message-posted-at .posted-at-container, .admin_messages_controller main #admin_messages table td.message-posted-at .posted-at-container { display: flex; flex-direction: column; } .admin_messages_controller main #admin_messages table th.message-category, .admin_messages_controller main #admin_messages table td.message-category { width: 16rem; } .admin_messages_controller main #admin_messages table th.message-tags, .admin_messages_controller main #admin_messages table td.message-tags { width: 15rem; } .admin_messages_controller main #admin_messages table th.message-tags .tags-wrapper, .admin_messages_controller main #admin_messages table td.message-tags .tags-wrapper { display: flex; align-items: center; flex-direction: column; gap: 0.4rem; } .admin_messages_controller main #admin_messages table th.message-tags .tags-wrapper .tag, .admin_messages_controller main #admin_messages table td.message-tags .tags-wrapper .tag { border-radius: 1.5rem; color: #FFFFFF; background-color: #006284; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; } .admin_messages_controller main #admin_messages table th.message-name, .admin_messages_controller main #admin_messages table td.message-name { max-width: 12rem; } .admin_messages_controller main #admin_messages table th.message-mail-address, .admin_messages_controller main #admin_messages table td.message-mail-address { max-width: 10rem; } .admin_messages_controller main #admin_messages table th.message-body, .admin_messages_controller main #admin_messages table td.message-body { max-width: 40rem; } .admin_messages_controller main #admin_messages table th.message-like-count, .admin_messages_controller main #admin_messages table td.message-like-count { max-width: 6.4rem; } .admin_messages_controller main #admin_messages table th.message-read-at, .admin_messages_controller main #admin_messages table td.message-read-at { min-width: 12rem; line-height: 1; } .admin_messages_controller main #admin_messages table th.message-read-at button, .admin_messages_controller main #admin_messages table td.message-read-at button { margin-top: 1rem; } .admin_messages_controller main #admin_messages table th.message-reviewed-at, .admin_messages_controller main #admin_messages table td.message-reviewed-at { min-width: 12rem; line-height: 1; } .admin_messages_controller main #admin_messages table th.message-reviewed-at button, .admin_messages_controller main #admin_messages table td.message-reviewed-at button { margin-top: 1rem; } .admin_messages_controller main #admin_messages table th.message-detail, .admin_messages_controller main #admin_messages table td.message-detail { max-width: 8rem; } .admin_messages_controller main #admin_messages table th { font-weight: bold; text-align: center; } .admin_messages_controller main #admin_messages table .message-id, .admin_messages_controller main #admin_messages table .message-posted-at, .admin_messages_controller main #admin_messages table .message-category, .admin_messages_controller main #admin_messages table .message-like-count, .admin_messages_controller main #admin_messages table .message-read-at, .admin_messages_controller main #admin_messages table .message-reviewed-at, .admin_messages_controller main #admin_messages table .message-detail { text-align: center; } .admin_messages_controller main #admin_messages table .message-category span { border-radius: 1.5rem; color: #FFFFFF; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; } .admin_messages_controller main #admin_messages table .message-category span.remedy { background-color: #7EC1D0; } .admin_messages_controller main #admin_messages table .message-category span.meal { background-color: #F9B552; } .admin_messages_controller main #admin_messages table .message-category span.work { background-color: #CD7F37; } .admin_messages_controller main #admin_messages table .message-category span.school { background-color: #D27E7C; } .admin_messages_controller main #admin_messages table .message-category span.family { background-color: #FBA5A3; } .admin_messages_controller main #admin_messages table .message-category span.future { background-color: #A7D052; } .admin_messages_controller main #admin_messages table .message-category span.event { background-color: #647195; } .admin_messages_controller main #admin_messages table .message-category span.other { background-color: #9B94CF; } .admin_messages_controller main #admin_messages table .message-detail a { text-decoration: underline; } .admin_messages_controller main #admin_messages table button { border: 0.2rem solid #A7D052; cursor: pointer; padding: 1.2rem; } .admin_messages_controller main #admin_messages table button.unreview-button, .admin_messages_controller main #admin_messages table button.unread-button { border-color: #F0805D; color: #F0805D; } .admin_messages_controller main #admin_message { background-color: #F9F8F4; margin: 0 auto; padding: 2.4rem; width: 87rem; } .admin_messages_controller main #admin_message h2 { font-size: 1.8rem; font-weight: bold; padding: 1.6rem; } .admin_messages_controller main #admin_message dl div { align-items: center; display: flex; justify-content: flex-start; padding: 0.8rem; word-break: break-all; } .admin_messages_controller main #admin_message dl div dt { width: 20rem; } .admin_messages_controller main #admin_message dl div dd { width: 60rem; } .admin_messages_controller main #admin_message dl div dd button { border: 0.2rem solid #A7D052; cursor: pointer; margin-left: 1.2rem; padding: 1.2rem; } .admin_messages_controller main #admin_message dl div dd button.unreview-button, .admin_messages_controller main #admin_message dl div dd button.unread-button { border-color: #F0805D; color: #F0805D; } .admin_messages_controller main #admin_message dl div.message-category dd { display: flex; flex-wrap: wrap; gap: 0.8rem; } .admin_messages_controller main #admin_message dl div.message-category label { border-radius: 1.5rem; color: #FFFFFF; display: inline-block; font-weight: bold; font-size: 1.5rem; height: 3rem; line-height: 2.2rem; padding: 0.4rem 1.2rem; text-decoration: none; width: revert; } .admin_messages_controller main #admin_message dl div.message-category label.remedy { background-color: #7EC1D0; } .admin_messages_controller main #admin_message dl div.message-category label.meal { background-color: #F9B552; } .admin_messages_controller main #admin_message dl div.message-category label.work { background-color: #CD7F37; } .admin_messages_controller main #admin_message dl div.message-category label.school { background-color: #D27E7C; } .admin_messages_controller main #admin_message dl div.message-category label.family { background-color: #FBA5A3; } .admin_messages_controller main #admin_message dl div.message-category label.future { background-color: #A7D052; } .admin_messages_controller main #admin_message dl div.message-category label.event { background-color: #647195; } .admin_messages_controller main #admin_message dl div.message-category label.other { background-color: #9B94CF; } .admin_messages_controller main #admin_message dl div.message-tag-group dd { display: flex; flex-wrap: wrap; gap: 0.8rem; } .admin_messages_controller main #admin_message dl div .radio-container, .admin_messages_controller main #admin_message dl div .check-box-container { cursor: pointer; } .admin_messages_controller main #admin_message dl div input[type=radio], .admin_messages_controller main #admin_message dl div input[type=checkbox] { appearance: revert; } .admin_messages_controller main #admin_message dl div.message-mail-address a { text-decoration: underline; } .admin_message_tag_groups_controller main { background-color: #FFFFFF; padding: 3.2rem 0; width: 100%; } .admin_message_tag_groups_controller main header { border: none; display: flex; justify-content: space-between; } .admin_message_tag_groups_controller main header h1 { font-size: 2.2rem; font-weight: bold; padding: 0 3.2rem; } .admin_message_tag_groups_controller main header nav ul { display: flex; justify-content: flex-end; } .admin_message_tag_groups_controller main header nav ul li { border-left: 0.2rem solid #9596A3; padding: 0.8rem 1.6rem; } .admin_message_tag_groups_controller main header nav ul li:first-child { border-left: none; } .admin_message_tag_groups_controller main #admin_message_tag_groups { background-color: #F9F8F4; margin-top: 3.2rem; padding: 3.2rem; } .admin_message_tag_groups_controller main #admin_message_tag_groups h2 { font-size: 1.8rem; font-weight: bold; padding: 0 1.6rem; } .admin_message_tag_groups_controller main #admin_message_tag_groups nav { line-height: 2.4rem; margin: 1.6rem 0; } .admin_message_tag_groups_controller main #admin_message_tag_groups nav .current-filters { list-style: disc inside; } .admin_message_tag_groups_controller main #admin_message_tag_groups nav a { text-decoration: underline; } .admin_message_tag_groups_controller main #admin_message_tag_groups .pagination { font-size: 2.1rem; text-align: right; } .admin_message_tag_groups_controller main #admin_message_tag_groups .pagination a { text-decoration: underline; } .admin_message_tag_groups_controller main #admin_message_tag_groups table { width: 100%; } .admin_message_tag_groups_controller main #admin_message_tag_groups table tr { border-top: 0.1rem solid #9596A3; } .admin_message_tag_groups_controller main #admin_message_tag_groups table tr:last-child { border-bottom: 0.1rem solid #9596A3; } .admin_message_tag_groups_controller main #admin_message_tag_groups table th, .admin_message_tag_groups_controller main #admin_message_tag_groups table td { padding: 0.8rem; vertical-align: middle; word-break: break-all; } .admin_message_tag_groups_controller main #admin_message_tag_groups table th.id, .admin_message_tag_groups_controller main #admin_message_tag_groups table td.id { width: 10rem; } .admin_message_tag_groups_controller main #admin_message_tag_groups table th.operations, .admin_message_tag_groups_controller main #admin_message_tag_groups table td.operations { width: 20rem; } .admin_message_tag_groups_controller main #admin_message_tag_groups table th.operations a + a:before, .admin_message_tag_groups_controller main #admin_message_tag_groups table td.operations a + a:before { content: " | "; } .admin_message_tag_groups_controller main #admin_message_tag_groups table th { font-weight: bold; text-align: center; } .admin_message_tag_groups_controller main #admin_message_tag_groups .new_tag_group_container { margin-top: 1rem; } .admin_message_tag_groups_controller main #admin_message_tag_group { background-color: #F9F8F4; margin: 0 auto; padding: 2.4rem; width: 87rem; } .admin_message_tag_groups_controller main #admin_message_tag_group h2 { font-size: 1.8rem; font-weight: bold; padding: 1.6rem; } .admin_message_tag_groups_controller main #admin_message_tag_group ul > li { list-style: disc; margin-left: 2rem; } .admin_message_tag_groups_controller main #admin_message_tag_group input[type=checkbox] { appearance: revert; margin-left: 0.2rem; transform: scale(1.5); cursor: pointer; } .admin_message_tag_groups_controller main #admin_message_tag_group select { appearance: revert; } .admin_message_tag_groups_controller main #admin_message_tag_group .hint { color: #9596A3; margin-top: 0.5rem; } .admin_message_tag_groups_controller main #admin_message_tag_group label { cursor: pointer; } .admin_message_tag_groups_controller main #admin_message_tag_group .errors { color: #F0805D; } .admin_message_tags_controller main { background-color: #FFFFFF; padding: 3.2rem 0; width: 100%; } .admin_message_tags_controller main header { border: none; display: flex; justify-content: space-between; } .admin_message_tags_controller main header h1 { font-size: 2.2rem; font-weight: bold; padding: 0 3.2rem; } .admin_message_tags_controller main header nav ul { display: flex; justify-content: flex-end; } .admin_message_tags_controller main header nav ul li { border-left: 0.2rem solid #9596A3; padding: 0.8rem 1.6rem; } .admin_message_tags_controller main header nav ul li:first-child { border-left: none; } .admin_message_tags_controller main #admin_message_tags { background-color: #F9F8F4; margin-top: 3.2rem; padding: 3.2rem; } .admin_message_tags_controller main #admin_message_tags h2 { font-size: 1.8rem; font-weight: bold; padding: 0 1.6rem; } .admin_message_tags_controller main #admin_message_tags nav { line-height: 2.4rem; margin: 1.6rem 0; } .admin_message_tags_controller main #admin_message_tags nav .current-filters { list-style: disc inside; } .admin_message_tags_controller main #admin_message_tags nav a { text-decoration: underline; } .admin_message_tags_controller main #admin_message_tags .pagination { font-size: 2.1rem; text-align: right; } .admin_message_tags_controller main #admin_message_tags .pagination a { text-decoration: underline; } .admin_message_tags_controller main #admin_message_tags table { width: 100%; } .admin_message_tags_controller main #admin_message_tags table tr { border-top: 0.1rem solid #9596A3; } .admin_message_tags_controller main #admin_message_tags table tr:last-child { border-bottom: 0.1rem solid #9596A3; } .admin_message_tags_controller main #admin_message_tags table th, .admin_message_tags_controller main #admin_message_tags table td { padding: 0.8rem; vertical-align: middle; word-break: break-all; } .admin_message_tags_controller main #admin_message_tags table th.id, .admin_message_tags_controller main #admin_message_tags table td.id { width: 10rem; } .admin_message_tags_controller main #admin_message_tags table th.operations, .admin_message_tags_controller main #admin_message_tags table td.operations { width: 20rem; } .admin_message_tags_controller main #admin_message_tags table th.operations a + a:before, .admin_message_tags_controller main #admin_message_tags table td.operations a + a:before { content: " | "; } .admin_message_tags_controller main #admin_message_tags table th { font-weight: bold; text-align: center; } .admin_message_tags_controller main #admin_message_tags .new_tag_container { margin-top: 1rem; } .admin_message_tags_controller main #admin_message_tag { background-color: #F9F8F4; margin: 0 auto; padding: 2.4rem; width: 87rem; } .admin_message_tags_controller main #admin_message_tag h2 { font-size: 1.8rem; font-weight: bold; padding: 1.6rem; } .admin_message_tags_controller main #admin_message_tag ul > li { list-style: disc; margin-left: 2rem; } .admin_message_tags_controller main #admin_message_tag input[type=checkbox] { appearance: revert; margin-left: 0.2rem; transform: scale(1.5); cursor: pointer; } .admin_message_tags_controller main #admin_message_tag select { appearance: revert; } .admin_message_tags_controller main #admin_message_tag .hint { color: #9596A3; margin-top: 0.5rem; } .admin_message_tags_controller main #admin_message_tag label { cursor: pointer; } .admin_message_tags_controller main #admin_message_tag .errors { color: #F0805D; } button.open-search-modal { align-items: center; background-color: #FFFFFF; border-radius: 0.8rem; border: 1px solid #979797; cursor: pointer; display: flex; gap: 0.8rem; padding: 1rem 2.4rem; } button.open-search-modal img { height: 2rem; width: 2rem; } button.open-search-modal span { font-size: 1.4rem; } button.open-search-modal .count { background-color: #006284; border-radius: 1rem; color: #FFFFFF; font-size: 1.4rem; height: 2rem; line-height: 1.4rem; min-width: 2rem; padding: 0.3rem 0.5rem; text-align: center; } .search-modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.2); opacity: 0; transition: opacity 0.1s ease-in-out; display: none; z-index: 999; } .search-modal-overlay.show { display: block; opacity: 1; } .search-modal { position: fixed; bottom: 0; left: 50%; transform: translate(-50%, 100%); width: 100%; max-width: 42rem; height: 90%; background-color: #FFFFFF; border-radius: 12px 12px 0 0; transition: transform 0.2s ease-in-out; z-index: 1000; } .search-modal.show { transform: translate(-50%, 0); } .search-modal .form { display: flex; flex-direction: column; height: 100%; } .search-modal .search-modal-header { display: flex; flex-direction: row; flex-wrap: nowrap; margin-top: 2.6rem; margin: 2.6rem 2.4rem 1rem; column-gap: 0.8rem; align-items: center; } .search-modal .search-modal-header .icon { width: 2rem; height: 2rem; } .search-modal .search-modal-header h2 { font-size: 1.6rem; flex-grow: 1; line-height: 2.6rem; } .search-modal .search-modal-header .close-modal { font-size: 2.2rem; cursor: pointer; } .search-modal .search-modal-content { padding: 0 2rem; overflow-y: scroll; flex-grow: 1; } .search-modal .search-modal-content .form-row:first-child { margin-top: 0; } .search-modal .search-modal-content .form-row label { color: #2C2D48; font-weight: normal; } .search-modal .search-modal-content .form-row .form-tags label { height: unset; font-size: 1.5rem; padding: 0.7rem 1.2rem; line-height: 1.5rem; } .search-modal .search-modal-footer { width: 100%; padding: 1.6rem 2.4rem; box-shadow: 0 0.1rem 0.4rem rgba(0, 0, 0, 0.1); } .search-modal .search-modal-footer button[type=submit] { margin: 0; } .no-scroll { overflow: hidden; }