@charset "utf-8"; /* CSS Information ========================================= style.css components.css page.css ========================================================= */ /* ========================================================= style.css ========================================================= */ /* ----------------------------------------------- */ body { font-family: 'Noto Sans Japanese', 'Lucida Grande', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif; line-height: 1.5; } /* template ----------------------------------------------- */ @media (max-width: 480px) { } @media (min-width: 481px) { } /* common ----------------------------------------------- */ @media (max-width: 480px) { .inner-.-header, .inner-.-nav, .inner-.-breadcrumbs, .inner-.-footer, .hierar-.-mypage- .inner-.-main, .hierar-.-mypage- .inner-.-sub, .hierar-.-home .sec-.-lv-2 > .inner-.-sec, .hierar-.-about .sec-.-lv-2 > .inner-.-sec, .hierar-.-price .sec-.-price > .inner-.-sec > ._heading, .hierar-.-price .sec-.-lv-2 > .inner-.-sec, .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading, .hierar-.-service_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading, .hierar-.-safety .sec-.-lv-2 > .inner-.-sec, .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading, .hierar-.-member_registration_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-sitting_guideline_compliance .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_movies .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_search .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter .sec-.-lv-2 > .inner-.-sec, .hierar-.-member .sec-.-member > .inner-.-sec, .hierar-.-member_login .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_login .sec-.-lv-1 > .inner-.-sec { box-sizing: border-box; padding: 0 0.5rem; } } @media (min-width: 481px) { .st-.-wrapper { width: auto; min-width: 1152px; } .inner-.-header, .inner-.-nav, .inner-.-breadcrumbs, .inner-.-footer, .hierar-.-mypage- .inner-.-contents, .hierar-.-home .sec-.-lv-2 > .inner-.-sec, .hierar-.-about .sec-.-lv-2 > .inner-.-sec, .hierar-.-price .sec-.-price > .inner-.-sec > ._heading, .hierar-.-price .sec-.-lv-2:not(.-price_details) > .inner-.-sec, .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading, .hierar-.-service_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading, .hierar-.-safety .sec-.-lv-2:not(.-index) > .inner-.-sec, .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading, .hierar-.-member_registration_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-sitter_movies .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_search .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter .sec-.-lv-2 > .inner-.-sec, .hierar-.-member .sec-.-member > .inner-.-sec, .hierar-.-member_login .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_login .sec-.-lv-1 > .inner-.-sec { box-sizing: border-box; margin: 0 auto; width: 1152px; } .inner-.-header, .inner-.-nav, .inner-.-breadcrumbs, .inner-.-footer, .hierar-.-mypage- .inner-.-main, .hierar-.-mypage- .inner-.-sub, .hierar-.-about .sec-.-lv-2 > .inner-.-sec, .hierar-.-price .sec-.-price > .inner-.-sec > ._heading, .hierar-.-price .sec-.-lv-2:not(.-price_details) > .inner-.-sec, .hierar-.-service_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading, .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading, .hierar-.-safety .sec-.-lv-2 > .inner-.-sec, .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading, .hierar-.-member_registration_flow .sec-.-lv-2 > .inner-.-sec, .hierar-.-sitter_movies .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_search .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter .sec-.-lv-2 > .inner-.-sec, .hierar-.-member .sec-.-member > .inner-.-sec, .hierar-.-member_login .sec-.-lv-1 > .inner-.-sec, .hierar-.-sitter_login .sec-.-lv-1 > .inner-.-sec { padding: 0 1rem; } } /* wrapper ----------------------------------------------- */ @media (max-width: 480px) { .st-.-wrapper { font-size: 14px; } } @media (min-width: 481px) { } /* header ----------------------------------------------- */ .st-.-header { background-color: rgba( 255, 255, 255, 0.7 ); position: relative; z-index: 2; } .st-.-header ._title { float: left; } .st-.-header ._catchphrase { color: #666; } .st-.-header ._tel { float: left; color: #9cf; } .st-.-header ._tel ._number a { color: #9cf; text-decoration: none; } .st-.-header ._cart a { color: #dd616f; text-decoration: none; } @media (max-width: 480px) { .st-.-header .inner-.-header { height: auto; min-height: 36px; overflow: hidden; position: relative; } .st-.-header ._title { margin-top: 6px; width: 72px; } .st-.-header ._catchphrase { display: none; } .st-.-header ._tel { margin-left: 8px; } .st-.-header ._tel ._business_hours { font-size: 8px; } .st-.-header ._tel ._number i { font-size: 22px; margin-left: 16px; } .st-.-header ._tel ._number span { display: none; } .st-.-header ._cart { position: absolute; top: 12px; left: 160px; } .st-.-header ._cart span { display: none; } .st-.-header ._cart i { font-size: 20px; } } @media (min-width: 481px) { .st-.-header .inner-.-header { overflow: hidden; } .st-.-header ._title { width: 116px; } .st-.-header ._title img { vertical-align: top; width: 100%; height: auto; } .st-.-header ._catchphrase { float: left; font-size: 10px; margin-left: 1em; padding-top: 10px; } .st-.-header ._tel { background: url("../img/common/freedial.png") no-repeat 0 50%; margin-top: 6px; margin-left: 3em; padding-left: 64px; } .st-.-header ._tel ._business_hours { font-size: 12px; line-height: 1; } .st-.-header ._tel ._number { font-size: 20px; font-weight: bold; height: 20px; line-height: 1; } .st-.-header ._tel ._number i { margin-left: 0.5em; } .st-.-header ._cart { float: right; font-size: 20px; line-height: 1; margin-top: 18px; } } /* nav ----------------------------------------------- */ .st-.-nav { background-color: rgba( 255, 255, 255, 0.7 ); box-shadow: 0 2px 2px #999; position: relative; z-index: 2; } .st-.-nav ._username { color: #666; } .st-.-nav ._login a { color: #666; text-decoration: none; } .st-.-nav ._nav_main > ul > li > a { color: #666; text-decoration: none; } @media (max-width: 480px) { .st-.-nav { position: absolute; top: 36px; width: 100%; } .st-.-nav .inner-.-nav { position: relative; } .st-.-nav ._login, .st-.-nav ._username { position: absolute; top: -22px; right: 0.5rem; } .st-.-nav ._login a { font-size: 12px; } .st-.-nav ._nav_main > ul { clear: both; display: flex; } .st-.-nav ._nav_main > ul > li:not(:last-child) { margin-right: 1em; } .st-.-nav ._nav_main > ul > li > a { display: block; text-align: center; } .st-.-nav ._nav_main > ul > li > a i { font-size: 24px; line-height: 1; } .st-.-nav ._nav_main > ul > li > a span { display: block; font-size: 6px; } } @media (min-width: 481px) { .st-.-nav { position: absolute; top: 40px; width: 100%; min-width: 1152px; } .st-.-nav .inner-.-nav { overflow: hidden; padding-top: 0.75em; padding-bottom: 0.25em; } .st-.-nav ._login, .st-.-nav ._username { float: right; } .st-.-nav ._nav_main { float: left; } .st-.-nav ._nav_main > ul { display: flex; } .st-.-nav ._nav_main > ul > li:not(:last-child) { margin-right: 2em; } } /* page ----------------------------------------------- */ @media (max-width: 480px) { .st-.-page { margin-top: -36px; } } @media (min-width: 481px) { .st-.-page { margin-top: -40px; } } /* breadcrumbs ----------------------------------------------- */ .st-.-breadcrumbs { background-color: #eee; box-shadow: 0 2px 2px #999; color: #666; position: relative; z-index: 1; } .st-.-breadcrumbs a { color: #666; text-decoration: none; } @media (max-width: 480px) { .st-.-breadcrumbs { padding-top: calc( 37px + 36px ); } .st-.-breadcrumbs .inner-.-breadcrumbs { padding-top: 0.25em; } .st-.-breadcrumbs .inner-.-breadcrumbs p { font-size: 12px; } } @media (min-width: 481px) { .st-.-breadcrumbs { padding-top: 80px; } .st-.-breadcrumbs .inner-.-breadcrumbs { padding-top: 0.5em; padding-bottom: 0.25em; } .st-.-breadcrumbs .inner-.-breadcrumbs p { font-size: 12px; } } /* contents ----------------------------------------------- */ .st-.-contents { padding-top: 1em; } /* main ----------------------------------------------- */ /* footer ----------------------------------------------- */ .st-.-footer { background: #eee url("../img/common/bg_logo_white.png") 50% -2em; } .st-.-footer ._nav a { color: #666; text-decoration: none; } .st-.-footer ._copyright { color: #666; padding: 0.25em 0; text-align: center; } .st-.-footer ._copyright small { font-size: 12px; } @media (max-width: 480px) { .st-.-footer { background-size: 160px 112px; border-top: 4px solid #f99; } .st-.-footer ._nav { margin: 1em 0; } .st-.-footer ._nav a { font-size: 12px; display: block; } .st-.-footer ._nav > ul > li { border-bottom: 1px solid #fff; padding: 0.25em 0.5em; } .st-.-footer ._info { display: flex; align-items: flex-end; justify-content: center; } .st-.-footer ._info ._logo { width: 88px; } .st-.-footer ._info ._privacy_mark { margin-left: 0.5em; width: 32px; } } @media (min-width: 481px) { .st-.-footer { background-size: 320px 224px; border-top: 8px solid #f99; padding-top: 1.5em; } .st-.-footer .inner-.-footer { position: relative; } .st-.-footer ._nav { margin-bottom: 1em; } .st-.-footer ._nav a { font-size: 14px; } .st-.-footer ._nav > ul { display: flex; flex-wrap: wrap; width: 720px; } .st-.-footer ._nav > ul > li { margin-bottom: 0.25em; width: 240px; } .st-.-footer ._info { display: flex; align-items: flex-end; position: absolute; bottom: 3em; right: 3em; } .st-.-footer ._info ._logo { width: 160px; } .st-.-footer ._info ._privacy_mark { margin-left: 0.5em; width: 56px; } } /* other ----------------------------------------------- */ .st-.-invisible { display: none; } .go_top { display: none; z-index: 2; } .go_top a { color: #afd3fe; } @media (max-width: 480px) { .go_top { position: fixed; bottom: 16px; right: 16px; } .go_top img { width: 40px; } } @media (min-width: 481px) { .go_top { position: fixed; bottom: 16px; right: 32px; } .go_top img { width: 64px; } } .hierar-.-home .sec-.-information ._to_pickup_sitter, .hierar-.-home .sec-.-sitter_recruit, .hierar-.-schedule .sec-.-schedule_regular, .st-.-invisible, .st-.-nav ._nav_main ._sitter_list { display:none; } /* temorary ----------------------------------------------- */ /* ========================================================= components.css ========================================================= */ /* .c-sitter-profile ----------------------------------------------- */ .c-sitter-profile { border-radius: 1em; box-shadow: 0 0 4px #999; overflow: hidden; position: relative; } .c-sitter-profile__contents { background-color: rgba( 242, 129, 129, 0.8 ); color: #fff; overflow: hidden; padding: 0.25em 0.5em; position: absolute; bottom: 0; width: 100%; } .c-sitter-profile__name { float: left; margin-right: 0.5em; } .c-sitter-profile__fee { float: left; } .c-sitter-profile__area { float: left; } .c-sitter-profile__message { clear: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .c-sitter-profile__message, .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._text p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .c-sitter-profile, .c-sitter-profile__contents, .c-sitter_recruit__contents, .hierar-.-price .sec-.-price_details ._simulation ._definitions > dl, .hierar-.-safety .sec-.-safety_item ._interview ._interviewer ._definitions > dl, .hierar-.-sitter .sec-.-profile ._details ._info.-options ._required ._list > ul { overflow: hidden; } @media (min-width: 481px) { .c-sitter-profile { width: auto; max-width: 304px; } .c-sitter-profile__fee { margin-right: 0.5em; } .c-sitter-profile__message { font-size: 14px; } } /* .c-sitter_recruit ----------------------------------------------- */ .c-sitter_recruit__contents { background-color: #fff; color: #999; } .c-sitter_recruit__title { font-weight: bold; margin-bottom: 0.5em; } .c-sitter_recruit.-single .c-sitter_recruit__title { color: #0c9; } .c-sitter_recruit.-regular .c-sitter_recruit__title { color: #f99; } .c-sitter_recruit__submit a { background-color: #6cc; color: #fff; font-weight: bold; font-size: 12px; text-align: center; text-decoration: none; } .c-sitter_recruit__submit a::after { content: "\f1d9"; font-family: 'FontAwesome'; font-size: 22px; margin-left: 0.75rem; vertical-align: middle; } @media (max-width: 480px) { .c-sitter_recruit { border-bottom: 3px dashed #fadede; padding: 1em 0 1.5em; } .c-sitter_recruit__contents { margin-bottom: 1em; } .c-sitter_recruit__title { font-size: 16px; font-weight: bold; } .c-sitter_recruit__area { float: left; margin-right: 2em; } .c-sitter_recruit__fee { float: left; } .c-sitter_recruit__limit { clear: left; } .c-sitter_recruit__limit time { margin-left: 1em; } .c-sitter_recruit__submit { text-align: center; } .c-sitter_recruit__submit a { border-radius: 1em; box-shadow: 0 0 2px #999; display: inline-block; padding: 0.125rem 3rem; } } @media (min-width: 481px) { .c-sitter_recruit { border-radius: 1em; box-shadow: 0 0 4px #999; overflow: hidden; width: auto; max-width: 256px; } .c-sitter_recruit__contents { padding: 1em 1em 0.75em; } .c-sitter_recruit__title { font-size: 24px; line-height: 1.25; } .c-sitter_recruit__title span { display: block; } .c-sitter_recruit__area { float: left; } .c-sitter_recruit__fee { float: right; } .c-sitter_recruit__limit { clear: both; } .c-sitter_recruit__submit a { box-shadow: 0 -2px 2px #999; display: block; padding: 0.25rem 0; } } /* .c-schedule_calendar ----------------------------------------------- */ .c-schedule_calendar { background-color: #fff; border: 1px solid #ccc; border-radius: 0.5em; color: #666; } .c-schedule_calendar__error_message { color: #f00; } .c-schedule_calendar__title { margin-bottom: 0.5em; text-align: center; } .c-schedule_calendar__year { text-align: center; } .c-schedule_calendar__month { display: flex; justify-content: space-around; margin-bottom: 0.5em; } .c-schedule_calendar__month a { color: #666; text-decoration: none; } .c-schedule_calendar__month_prev a::before { content:"\f0d9"; font-family:FontAwesome; } .c-schedule_calendar__month_next a::after { content:"\f0da"; font-family:FontAwesome; } .c-schedule_calendar__table_list > ol{ min-height:calc(34px * 28); } .c-schedule_calendar__table_list > ol > li { border-bottom: 1px solid #ccc; } .c-schedule_calendar__table_header { background-color: #999; padding: 0.25em 0; } .c-schedule_calendar__table_header_display { color: #fff; text-align: center; } .c-schedule_calendar__table_header_input { color: #ff6; text-align: center; } .c-schedule_calendar__table_display { display: flex; align-items: center; padding: 0.25em 0; } .c-schedule_calendar__table_display_day, .c-schedule_calendar__table_display_day_of_the_week, .c-schedule_calendar__table_display_possible { text-align: center; width: 2em; } .c-schedule_calendar__table_display_day_of_the_week + p{ padding:5px 0; } .c-schedule_calendar__table_item { display: flex; justify-content:space-between; align-items:center; } .c-schedule_calendar__table_item ul{ flex:1 0 auto; } .c-schedule_calendar__table_item li{ display: flex; justify-content:space-between; align-items:center; } .c-schedule_calendar__table_item.-saturday .c-schedule_calendar__table_display_day_of_the_week { color: #00a0df; } .c-schedule_calendar__table_item.-sunday .c-schedule_calendar__table_display_day_of_the_week { color: #e51c2d; } .c-schedule_calendar__registration, .c-schedule_calendar__table_item.-possible .c-schedule_calendar__table_display_possible, .c-schedule_calendar__table_item.-possible .c-schedule_calendar__table_display_time > ul > li { color: #f28181; } .c-schedule_calendar__table_display_time { margin-left: 1em; } .c-schedule_calendar__table_input { display: flex; justify-content: center; align-items: center; background-color: #ffe; padding: 0.25em; } .c-schedule_calendar__table_input_submit { margin-left: 0.5em; } .c-schedule_calendar__table_input_submit button { background-color: transparent; border: 0; font-size: 12px; margin: 0 0.5em; } .c-schedule_calendar__table_input_submit button i { font-size: 20px; vertical-align: -3px; } .c-schedule_calendar__delete { color: #00a0df; } body #overlay{ position:fixed; top:0; width:100%; height:100vh; background:rgba(0,0,0,0.4); z-index:9999; transition:all 0.3s; } body .overlay_hide{ opacity:0; pointer-events:none; } body .modal{ position:fixed; top:calc(50vh - 100px); left:calc(50% - 150px); width:300px; height:200px; padding:1em; background:#fff; color:#666; z-index:9999; } body .modal > div{ text-align:center; } body .modal > div label{ display:inline-block; margin-top:1em; } body .modal button{ position:absolute; min-width:92px; padding:5px; line-height:1em; } body .modal button[name="update"], body .modal button[name="registration"]{ right:calc(2em + 92px); bottom:1em; background:#F28181; border:solid 1px rgb(170, 89, 89); color:#fff; } body .modal button[name="cancel"]{ right:1em; bottom:1em; border:solid 1px rgb(126, 126, 126); background:#fff; } .f-gray{ color:#aaa; } /* スクロールで上部に張り付くスタイル start */ .fixed .c-schedule_calendar__year, .fixed .c-schedule_calendar__month, .fixed .c-schedule_calendar__table_header{ position:fixed; } @media (max-width:480px) { .fixed .c-schedule_calendar__title{ margin-bottom:calc(79px); } .fixed .c-schedule_calendar__year{ top:0; background:#fff; padding-top:0.5em; } .fixed .c-schedule_calendar__month{ top:28px; background:#fff; padding-bottom:0.5em; } .fixed .c-schedule_calendar__table_header{ top:56px; } } @media (min-width: 481px) { .fixed .c-schedule_calendar__title{ margin-bottom:calc(96px); } .fixed .c-schedule_calendar__year{ top:0; background:#fff; padding-top:0.5em; } .fixed .c-schedule_calendar__month{ top:32px; background:#fff; padding-bottom:0.5em; } .fixed .c-schedule_calendar__table_header{ top:64px; } } /* スクロールで上部に張り付くスタイル end */ @media (max-width: 336px) { .c-schedule_calendar__table_input_submit button i { display: block; } } @media (max-width: 480px) { .c-schedule_calendar { padding: 0.5em; } .c-schedule_calendar__table_header_display { display: none; } .c-schedule_calendar__table_input_submit button { font-size: 10px; } } @media (min-width: 481px) { .c-schedule_calendar { padding: 1em; } .c-schedule_calendar__table_header_display { width: calc( 100% - 368px ); } .c-schedule_calendar__table_header { display: flex; justify-content: space-between; } .c-schedule_calendar__table_header_input { width: 368px; } .c-schedule_calendar__table_input { width: 368px; } } /* .c-login_form ----------------------------------------------- */ .c-login_form { background-color: #ccc; padding: 1.5em 1em; } .c-login_form__error_message { color: #f00; display: none; padding: 1em 0; } .c-login_form__input p { margin-bottom: 1.5em; } .c-login_form__input input { box-sizing: border-box; padding: 0.5em; width: 100%; } .c-login_form__submit { text-align: center; } .c-login_form__submit button[name="submit"] { border: 0; border-radius: 0.25rem; box-shadow: 2px 2px 2px #999; display: inline-block; font-weight: bold; padding: 0.75rem 0; text-align: center; } @media (max-width: 480px) { .c-login_form__logo { margin: 0 auto 1em; width: 80px; } .hierar-.-mypage- .inner-.-main { padding-top: 1em; padding-bottom: 1em; } } @media (min-width: 481px) { .c-login_form { margin: 0 auto; width: 672px; } .c-login_form__logo { margin: 0 auto 1em; width: 112px; } } /* .c-news_list ----------------------------------------------- */ .c-news_list { color: #666; } .c-news_list > ul > li { border-bottom: 2px dashed #ccc; } .c-news_list > ul > li > a { color: #666; } .c-news_list__category_item { border: 2px solid #999; text-align: center; width: 7em; } .c-news_list__category_item.-news { background-color: #cff0f9; } .c-news_list__category_item.-media { background-color: #e6d0f7; } .c-news_list__title { margin-bottom: 0.5em; } .c-news_list__text { color: #999; } @media (max-width: 480px) { .c-news_list > ul > li { padding: 1.5em 0; } .c-news_list__item::after { clear: both; content: ""; display: block; } .c-news_list__thumbnail { float: left; width: 96px; } .c-news_list__category { float: right; width: calc( 100% - 104px ); } .c-news_list__category_item { font-size: 10px; } .c-news_list__post_info { float: right; width: calc( 100% - 104px ); } .c-news_list__date { color: #999; font-size: 12px; margin-top: 2px; } .c-news_list__title { font-size: 12px; } .c-news_list__text { /*display: none;*/ } } @media (min-width: 481px) { .c-news_list > ul > li { padding: 1.5em 6em; } .c-news_list__item::after { clear: both; content: ""; display: block; } .c-news_list__thumbnail { float: left; width: 128px; } .c-news_list__category { float: left; margin-left: 2em; } .c-news_list__category_item { font-size: 14px; } .c-news_list__post_info { float: right; margin-left: 2em; width: 40em; } .c-news_list__date { font-size: 14px; } .c-news_list__title { font-weight: bold; } .c-news_list__text { font-size: 14px; } } /* ========================================================= page.css ========================================================= */ /* common(mypage) ----------------------------------------------- */ .hierar-.-mypage- .st-.-contents { color: #666; } .hierar-.-mypage- .st-.-sub ._nav ._list a { color: #dd616f; } .hierar-.-mypage- .st-.-sub ._nav ._list a[href] { color: #666; } .hierar-.-mypage- .st-.-sub ._nav ._list a[href]:hover { color: #dd616f; } .hierar-.-mypage- .st-.-sub ._nav ._list ._new { color: #dd616f; font-size: 12px; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li::before { content: "・"; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li { padding-left: 2em; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li:nth-of-type(n+2) { padding-top: 1em; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li > ul{ padding-left: 1em; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li > ul > li:before { content:"\f2bd"; font-family:FontAwesome; display:inline-block; width:1em; text-align:center; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li > ul > li:last-of-type:before { content:"\f055"; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li > ul > li > ul > li a{ display:inline-block; width:calc(100% - 1em); } @media (max-width: 480px) { .hierar-.-mypage- .st-.-contents { overflow:hidden; } .hierar-.-mypage- .inner-.-contents { position:relative; } .hierar-.-mypage- .st-.-main { padding-top: 1em; padding-bottom: 1em; } .hierar-.-mypage- .st-.-sub { position:absolute; top:-1em; display:flex; justify-content:right; align-items:flex-start; width:100%; height:calc(100% + 1em); transition:all 0.3s ease-in-out; } .hierar-.-mypage- .st-.-contents.active .st-.-sub { pointer-events:auto; } .hierar-.-mypage- .inner-.-sub { position:absolute; left:100%; width:200px; padding-top:1em; background:#eee; transition:all 0.3s ease-in-out; } .hierar-.-mypage- .st-.-contents.active .inner-.-sub { transform:translateX(-100%); } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li { margin-bottom: 1em; } .hierar-.-mypage- #sidebar-overlay { width:100%; height:100%; background:rgba(0,0,0,0.6); position:relative; opacity:0; transition:opacity 0.3s; } .hierar-.-mypage- .st-.-contents.active #sidebar-overlay { opacity:1; } .hierar-.-mypage- .st-.-nav ._nav_main > ul{ position:relative; } .hierar-.-mypage- #burger{ position:absolute; right:0; width:35px; height:35px; margin-right:0; } .hierar-.-mypage- #burger span{ position:absolute; left:calc(50% - 12px); width:24px; height:2px; background:#666; transition:all 0.3s; } .hierar-.-mypage- #burger span:nth-of-type(1){ top:calc(50% - 1px - 8px); } .hierar-.-mypage- #burger span:nth-of-type(2){ top:calc(50% - 1px); } .hierar-.-mypage- #burger span:nth-of-type(3){ top:calc(50% - 1px + 8px); } .hierar-.-mypage- #burger.active span:nth-of-type(1){ transform:translateY(8px) rotate(135deg); } .hierar-.-mypage- #burger.active span:nth-of-type(2){ opacity:0; } .hierar-.-mypage- #burger.active span:nth-of-type(3){ transform:translateY(-8px) rotate(-135deg); } } @media (min-width: 481px) { .hierar-.-mypage- .inner-.-contents { display: flex; flex-direction: row-reverse; } .hierar-.-mypage- .st-.-main { width: 832px; } .hierar-.-mypage- .inner-.-main { padding-top: 2em; padding-bottom: 2em; } .hierar-.-mypage- .st-.-sub { width: 320px; } .hierar-.-mypage- .inner-.-sub { padding-top: 2em; } .hierar-.-mypage- .st-.-sub ._nav ._list > ul > li { line-height: 2; margin-bottom: 2em; } } /* common(button) ----------------------------------------------- */ .hierar-.-home .sec-.-sitter_search ._link button[type="submit"], .hierar-.-sitter_search .sec-.-sitter_search button[type="submit"], .hierar-.-sitter .sec-.-profile ._offer_links ._form ._submit input[type="submit"], .hierar-.-sitter .sec-.-profile ._offer_links a, .hierar-.-member .sec-.-member_profile ._links a, .hierar-.-update_user .sec-.-update_user_input button[name="submit"], .hierar-.-update_kids .sec-.-update_kids_input button[type="submit"], .hierar-.-update_emergency .sec-.-update_emergency_input button[type="submit"], .hierar-.-update_sitter .sec-.-update_sitter_input button[name="submit"], .hierar-.-request_box .sec-.-sitter_select ._form ._submit input[type="submit"], .hierar-.-request_box .sec-.-sitter_select ._link a, .hierar-.-request_box .sec-.-request_input ._form ._submit input[type="submit"], .hierar-.-request .sec-.-request_contents ._action a, .hierar-.-message .sec-.-message_input ._form ._submit input[type="submit"] { border: 0; border-radius: 0.25rem; box-shadow: 2px 2px 2px #999; box-sizing: border-box; display: inline-block; font-weight: bold; padding: 0.75rem 1em; text-align: center; } .hierar-.-sitter .sec-.-profile ._offer_links ._form ._submit input[type="submit"], .hierar-.-sitter .sec-.-profile ._offer_links a, .hierar-.-member .sec-.-member_profile ._links a, .hierar-.-update_user .sec-.-update_user_input button[name="submit"], .hierar-.-update_kids .sec-.-update_kids_input button[name="submit"], .hierar-.-update_emergency .sec-.-update_emergency_input button[name="submit"], .hierar-.-update_sitter .sec-.-update_sitter_input button[name="submit"], .hierar-.-message .sec-.-message_input ._form ._submit input[type="submit"], .hierar-.-request .sec-.-request_contents ._action a, .hierar-.-request_box .sec-.-request_input ._form ._submit input[type="submit"], .hierar-.-request_box .sec-.-sitter_select ._form ._submit input[type="submit"], .hierar-.-request_box .sec-.-sitter_select ._link a { background-color: #f28181; color: #fff; } .hierar-.-home .sec-.-sitter_search ._link button[type="submit"], .hierar-.-sitter_search .sec-.-sitter_search button[type="submit"]{ background-color: #7dc7ae; color: #fff; } /* home ----------------------------------------------- */ .hierar-.-home .st-.-breadcrumbs { display: none; } .hierar-.-home .st-.-contents { padding-top: 0; } .hierar-.-home .heading-1 { display: none; } .hierar-.-home .sec-.-information > .inner-.-sec > ._heading { display: none; } .hierar-.-home .sec-.-information_contents > .inner-.-sec > ._heading { display: none; } .hierar-.-home .sec-.-information_contents ._text p { color: #fff; text-shadow: 1px 1px 2px #333; } .hierar-.-home .sec-.-information_contents ._registration_info { background-color: #fff; display: flex; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration a { color: #fff; display: block; font-weight: bold; text-align: center; text-decoration: none; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration_about { font-weight: bold; text-align: center; } .hierar-.-home .sec-.-information_contents ._registration_info ._member ._registration a { background-color: #7dc7ae; } .hierar-.-home .sec-.-information_contents ._registration_info ._member ._registration_about a { color: #7dc7ae; } .hierar-.-home .sec-.-information_contents ._registration_info ._sitter ._registration a { background-color: #ef9191; } .hierar-.-home .sec-.-information_contents ._registration_info ._sitter ._registration_about a { color: #ef9191; } .hierar-.-home .sec-.-information_contents ._links > ul > li > a { border-radius: 3em; box-shadow: 0 0 2px #999; color: #fff; display: block; font-weight: bold; padding: 0.25em 1em; text-align: center; text-decoration: none; } .hierar-.-home .sec-.-information_contents ._links > ul > li:nth-child(1) > a { background-color: rgba( 0, 151, 205, 0.7 ); } .hierar-.-home .sec-.-information_contents ._links > ul > li:nth-child(2) > a { background-color: rgba( 0, 189, 163, 0.7 ); } .hierar-.-home .sec-.-information_contents ._links > ul > li:nth-child(3) > a { background-color: rgba( 255, 113, 117, 0.7 ); } .hierar-.-home .sec-.-information_contents ._links > ul > li:nth-child(4) > a { background-color: rgba( 255, 154, 201, 0.7 ); } .hierar-.-home .sec-.-sitter_search { width: 304px; float: right; } .hierar-.-home .sec-.-sitter_search > .inner-.-sec > ._heading { background: url("../img/home/heading_bg_pink.png") no-repeat 50% 100%; background-size: 264px 16px; color: #f28181; font-size: 16px; font-weight: bold; padding-bottom: 0.75em; text-align: center; } .hierar-.-home .sec-.-sitter_search .-sec-contents { position: relative; } .hierar-.-home .sec-.-sitter_search .-sec-contents img._baby { position: absolute; top: -80px; left: 10px; width: 112px; height: 168px; } .hierar-.-home .sec-.-sitter_search .-sec-contents > div { position: relative; margin: 80px 0 0 10px; padding: 10px 10px 5px 10px; box-sizing: border-box; background: #ffe; border: 1px solid #71462e; box-shadow: 0 2px 2px #999; color: #71462e; font-size: 14px; } .hierar-.-home .sec-.-sitter_search .-sec-contents dl { display: flex; flex-wrap: wrap; align-items: center; color: #999; } .hierar-.-home .sec-.-sitter_search .-sec-contents dt { flex-basis: calc(30% - 1em); flex-grow: 0; flex-shrink: 0; padding-right: 1em; text-align: right; box-sizing: border-box; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd { flex: 0 0 70%; margin-left: 0; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd .wday_wrap, .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="date"], .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="time"], .hierar-.-home .sec-.-sitter_search .-sec-contents dd select{ width: 80%; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="text"]{ width: 100%; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="text"], .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="date"], .hierar-.-home .sec-.-sitter_search .-sec-contents dd input[type="time"], .hierar-.-home .sec-.-sitter_search .-sec-contents dd select{ padding: 0.5em; border: solid 1px #999; border-radius: 2px; box-sizing: border-box; font-family: sans-serif; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd .wday_wrap { position: relative; display: inline-block; } .hierar-.-home .sec-.-sitter_search .-sec-contents dd .wday_wrap span { position: absolute; top: calc(50% - 7px); right: 4px; line-height: 1em; font-size:14px; color: #999; } .hierar-.-home .sec-.-sitter_search .-sec-contents dt:nth-of-type(n+2), .hierar-.-home .sec-.-sitter_search .-sec-contents dd:nth-of-type(n+2) { margin-top: 0.5em; } .hierar-.-home .sec-.-sitter_search .-sec-contents ._link { text-align: center; } .hierar-.-home .sec-.-sitter_search .-sec-contents ._link button { width: 100%; max-width: 250px; margin: 1em 0 0.5em; } .hierar-.-home .sec-.-sitter_search .-sec-contents > div > ._goods { text-align: right; } .hierar-.-home .sec-.-sitter_search .-sec-contents > div > ._goods img { width: 152px; height: 80px; } .hierar-.-home .sec-.-pickup_sitter { background: url("../img/home/half_oval.png") repeat-x 50% 0; background-size: 192px 16px; } .hierar-.-home .sec-.-pickup_sitter > .inner-.-sec > ._heading { background: url("../img/home/heading_bg_pink.png") no-repeat 50% 100%; color: #f28181; font-weight: bold; text-align: center; } .hierar-.-home .sec-.-pickup_sitter ._text p { color: #f28181; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li > a { transition: 0.15s; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li > a:hover { opacity: 0.6; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3 > .inner-.-sec > ._heading { background: url("../img/common/bg_flower.png") 50% 50% repeat-x; color: #fc6; margin-bottom: 1em; text-align: center; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3 > .inner-.-sec > ._heading span { background-color: #fff; padding: 0 1em; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3 > .inner-.-sec > ._heading em { color: #f90; font-style: normal; margin-right: 0.25em; } .hierar-.-home .sec-.-pickup_sitter .sec-.-pickup_sitter_new > .inner-.-sec > ._heading { display: none; } .hierar-.-home .sec-.-about { background: url("../img/home/about_bg_wrap.png") no-repeat 50% 50%, url("../img/home/about_bg.jpg") no-repeat 50% 50%; border-top: 3px dashed #ffd279; border-bottom: 3px dashed #ffd279; } .hierar-.-home .sec-.-about > .inner-.-sec > ._heading { color: #fff; font-weight: bold; margin-bottom: 0.75rem; text-align: center; text-shadow: 1px 1px 2px #666; } .hierar-.-home .sec-.-about ._text.-about p { color: #fff; font-weight: bold; text-shadow: 1px 1px 2px #666; } .hierar-.-home .sec-.-about ._links > ul > li > a { border-radius: 1em; color: #fff; display: block; margin: 0 auto; text-decoration: none; } .hierar-.-home .sec-.-about ._links > ul > li > a:hover { background-color: rgba( 255, 255, 255, 0.6 ); } .hierar-.-home .sec-.-about ._links ._item { background-color: rgba( 255, 255, 255, 0.7 ); border-radius: 1em; box-shadow: 0 0 4px #999; box-sizing: border-box; padding: 8px 4px; } .hierar-.-home .sec-.-about ._links ._item.-about { background-color: rgba( 0, 151, 205, 0.7 ); } .hierar-.-home .sec-.-about ._links ._item.-fee { background-color: rgba( 255, 153, 51, 0.7 ); } .hierar-.-home .sec-.-about ._links ._item.-how_to_use { background-color: rgba( 0, 189, 163, 0.7 ); } .hierar-.-home .sec-.-about ._links ._item.-safety { background-color: rgba( 255, 113, 117, 0.7 ); } .hierar-.-home .sec-.-about ._links ._item ._inner { border: 2px dashed #fff; border-radius: 1em; } .hierar-.-home .sec-.-registration { background: url("../img/home/bg_logo_gray.png") 50% -2em; } .hierar-.-home .sec-.-registration > .inner-.-sec > ._heading { color: #dd616f; } .hierar-.-home .sec-.-registration ._text p { color: #666; line-height: 2; } .hierar-.-home .sec-.-registration ._image { box-shadow: 1px 1px 2px #999; background-color: #fff; padding: 0.75em 0.5em; } .hierar-.-home .sec-.-registration ._links a { text-decoration: none; } .hierar-.-home .sec-.-registration ._links a:hover { background-color: #fff; } .hierar-.-home .sec-.-registration ._links ._btn { background-color: #7dc7ae; box-shadow: 1px 1px 2px #999; color: #fff; font-weight: bold; padding: 0.5em 0.75em; text-align: center; } .hierar-.-home .sec-.-registration ._links ._btn:hover { opacity: 0.6; } .hierar-.-home .sec-.-registration ._links ._btn ._inner { border: 1px solid #fff; display: block; padding: 0.5em 1.5em; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec > ._heading { background: url("../img/home/heading_bg_white.png") no-repeat 50% 100%; color: #fff; font-weight: bold; text-align: center; text-shadow: 0 0 2px #999; } .hierar-.-home .sec-.-sitter_recruit ._text p { color: #fff; text-shadow: 0 0 2px #999; } .hierar-.-home .sec-.-sitter_recruit ._view_all a { color: #fff; font-weight: bold; text-decoration: none; } .hierar-.-home .sec-.-sitter_recruit ._view_all a::after { content: "＞＞＞"; margin-left: 1em; } .hierar-.-home .sec-.-review { background-color: #ffc; padding: 1em 0 1.5em; } .hierar-.-home .sec-.-review > .inner-.-sec > ._heading { color: #f90; font-weight: normal; margin-bottom: 0.5em; text-align: center; } .hierar-.-home .sec-.-review ._list ._item { background-color: #fff; border: 4px solid #fc6; border-radius: 1em; color: #999; padding: 1.75em 1em 1em; } .hierar-.-home .sec-.-review ._list ._item ._contents { box-shadow: 2px 2px 4px #999; font-size: 14px; height: 200px; margin-bottom: 1.5em; overflow: hidden; padding: 1em; } .hierar-.-home .sec-.-review ._list ._item ._contents ._member_name { margin-bottom: 0.5em; } .hierar-.-home .sec-.-review ._list ._item ._contents ._review { line-height: 1.7; } .hierar-.-home .sec-.-review ._list ._item ._sitter_info { display: flex; } .hierar-.-home .sec-.-review ._list ._item ._sitter_info ._thumbnail { border-radius: 0.125em; box-shadow: 0 0 2px #999; height: 48px; overflow: hidden; width: 48px; } .hierar-.-home .sec-.-review ._list ._item ._sitter_info ._sitter_name { color: #f90; padding: 0.25em 1em; } .hierar-.-home .sec-.-review ._list ._item ._sitter_info ._sitter_name > ._heading { font-size: 12px; } .hierar-.-home .sec-.-review ._list ._item ._sitter_info ._sitter_name ._name { font-size: 14px; } .hierar-.-home .sec-.-news > .inner-.-sec > ._heading { background: url("../img/common/heading_bg_gray.png") no-repeat 50% 100%; color: #666; font-weight: bold; text-align: center; } .hierar-.-home .sec-.-news ._view_all { margin-top: 1em; } .hierar-.-home .sec-.-news ._view_all a { color: #999; text-decoration: none; } .hierar-.-home .sec-.-news ._view_all a::after { content: "＞＞＞"; margin-left: 0.25em; } @media (max-width: 480px) { .hierar-.-home .sec-.-lv-2 { margin-bottom: 4em; } .hierar-.-home .sec-.-information { background: url("../img/home/visual_sp.jpg") no-repeat 50% 0; background-size: 480px 460px; margin-bottom: 2em; padding-top: calc( 71px + 1em ); } .hierar-.-home .sec-.-information_contents { float: none; height: auto; min-height: calc( 460px - 85px ); margin-bottom: 1.5em; padding: 0 calc( 25% - 68px ); position: relative; } .hierar-.-home .sec-.-information_contents ._text { margin-bottom: 128px; } .hierar-.-home .sec-.-information_contents ._text p:first-child { text-align: center; } .hierar-.-home .sec-.-information_contents ._text p:nth-child(2) { display: none; } .hierar-.-home .sec-.-information_contents ._registration_info { background-color: rgba( 255, 255, 255, 0.9 ); display: flex; justify-content: space-between; padding: 1em; } .hierar-.-home .sec-.-information_contents ._registration_info ._member { width: calc( 50% - 1em ); } .hierar-.-home .sec-.-information_contents ._registration_info ._sitter { width: calc( 50% - 1em ); } .hierar-.-home .sec-.-information_contents ._registration_info ._registration a { box-shadow: 1px 1px 1px #999; font-size: 12px; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration ._inner { display: block; padding: 0.75em 0; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration_about { margin-top:0.5em; font-size:12px; } .hierar-.-home .sec-.-information_contents ._to_pickup_sitter { padding: 0 calc( 25% - 68px ); position: absolute; bottom: 72px; left: 0; width: 100%; } .hierar-.-home .sec-.-information_contents ._to_pickup_sitter a { background-color: rgba( 221, 97, 111, 0.8 ); border: 4px solid #dd616f; color: #fff; display: block; font-weight: bold; padding: 0.25em 2em; position: relative; } .hierar-.-home .sec-.-information_contents ._to_pickup_sitter a::after { content: "\f103"; font-family: 'FontAwesome'; font-size: 28px; position: absolute; top: -4px; right: 0.5rem; } .hierar-.-home .sec-.-information_contents ._links { position: absolute; bottom: 0; left: 0; width: 100%; } .hierar-.-home .sec-.-information_contents ._links > ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-home .sec-.-information_contents ._links > ul > li { margin-bottom: 0.5em; width: 50%; } .hierar-.-home .sec-.-information_contents ._links > ul > li > a { font-size: 12px; margin: 0 auto; width: 112px; } .hierar-.-home .sec-.-sitter_search { width: 100%; float: none; } .hierar-.-home .sec-.-sitter_search .-sec-contents > div { margin: 80px 0 0 0; } .hierar-.-home .sec-.-pickup_sitter { padding-top: 3em; } .hierar-.-home .sec-.-pickup_sitter > .inner-.-sec > ._heading { background-size: 132px 8px; font-size: 16px; margin-bottom: 1rem; padding-bottom: 8px; } .hierar-.-home .sec-.-pickup_sitter ._text { margin-bottom: 2em; } .hierar-.-home .sec-.-pickup_sitter ._list > ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li { margin-bottom: 1em; width: calc( 50% - 0.5em ); } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3:not(:last-child) { margin-bottom: 2em; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3 > .inner-.-sec > ._heading { background-size: 32px 8px; font-size: 16px; } .hierar-.-home .sec-.-about { background-size: cover; } .hierar-.-home .sec-.-about > .inner-.-sec { border-top: 8px solid #fff; border-bottom: 8px solid #fff; padding-top: 2.5em; padding-bottom: 1.5em; } .hierar-.-home .sec-.-about > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-home .sec-.-about > .inner-.-sec > ._heading span { display: inline-block; } .hierar-.-home .sec-.-about ._text.-about { margin-bottom:2em; } .hierar-.-home .sec-.-about ._text.-about p { font-size: 12px; } .hierar-.-home .sec-.-about ._links > ul > li:not(:last-child) { margin-bottom: 1em; } .hierar-.-home .sec-.-about ._links ._item ._inner { height: auto; min-height: 4.5em; padding: 0.5rem; position: relative; } .hierar-.-home .sec-.-about ._links ._item ._image { position: absolute; top: calc( 50% - 20px ); text-align: center; width: 35%; } .hierar-.-home .sec-.-about ._links ._item ._image i { font-size: 24px; } .hierar-.-home .sec-.-about ._links ._item.-about ._image img { width: 56px; } .hierar-.-home .sec-.-about ._links ._item ._heading { font-size: 10px; position: absolute; top: calc( 50% + 8px ); text-align: center; width: 35%; } .hierar-.-home .sec-.-about ._links ._item ._text { padding-left: 40%; } .hierar-.-home .sec-.-about ._links ._item ._text p { font-size: 10px; } .hierar-.-home .sec-.-registration { background-size: 160px 112px; } .hierar-.-home .sec-.-registration > .inner-.-sec { padding-top: 2em; padding-bottom: 2em; } .hierar-.-home .sec-.-registration > .inner-.-sec > ._heading { font-size: 16px; margin-bottom: 1.5em; text-align: center; } .hierar-.-home .sec-.-registration ._text { margin-bottom: 2rem; } .hierar-.-home .sec-.-registration ._text p { font-size: 12px; } .hierar-.-home .sec-.-registration ._image { display: none; } .hierar-.-home .sec-.-registration ._links { text-align: center; } .hierar-.-home .sec-.-registration ._links a { display: inline-block; } .hierar-.-home .sec-.-registration ._links ._btn { display: inline-block; } .hierar-.-home .sec-.-sitter_recruit { background: url("../img/home/sitter_recruit_bg_sp.jpg") no-repeat 50% 8px,url("../img/home/sitter_recruit_pink.jpg") no-repeat 50% 0; background-size: 480px 160px,480px 176px; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec { padding-top: 1.5em; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec > ._heading { background-size: 144px 8px; font-size: 16px; margin-bottom: 1rem; padding-bottom: 8px; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec > ._heading span:last-child { margin-left: 2em; } .hierar-.-home .sec-.-sitter_recruit ._text { height: auto; min-height: 7.5em; margin-bottom: 0.5em; } .hierar-.-home .sec-.-sitter_recruit ._list { margin-bottom: 1.25em; } .hierar-.-home .sec-.-sitter_recruit ._view_all { text-align: center; } .hierar-.-home .sec-.-sitter_recruit ._view_all a { background-color: #6cc; box-shadow: 2px 2px 2px #999; font-size: 16px; display: inline-block; padding: 0.25em 3em; } .hierar-.-home .sec-.-review > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-home .sec-.-review ._list > ul > li:not(:last-child) { margin-bottom: 1em; } .hierar-.-home .sec-.-news > .inner-.-sec > ._heading { background-size: 144px 8px; font-size: 16px; margin-bottom: 1rem; padding-bottom: 8px; } } @media (min-width: 481px) { .hierar-.-home .sec-.-news, .hierar-.-home .sec-.-review{ margin-bottom:4em; } .hierar-.-home .sec-.-registration{ padding-bottom: 4em; } .hierar-.-home .sec-.-information { background: url("../img/home/visual_pc.jpg") calc( 50% - 352px ) 0 / 1216px 512px no-repeat; box-sizing: border-box; margin-bottom: 1em; padding-top: calc( 80px + 1em ); } .hierar-.-home .sec-.-information > .inner-.-sec { padding: 0 1em; position: relative; } .hierar-.-home .sec-.-information > .inner-.-sec::after { clear: both; content: ""; display: block; } .hierar-.-home .sec-.-information_contents { float: left; height: auto; min-height: calc( 512px - 96px ); width: 800px; } .hierar-.-home .sec-.-information_contents ._text { margin-bottom: 1.5em; } .hierar-.-home .sec-.-information_contents ._text p:first-child { margin-bottom: 2rem; font-size: 20px; } .hierar-.-home .sec-.-information_contents ._registration_info { padding: 1em 1em 0.5em; position: absolute; } .hierar-.-home .sec-.-information_contents ._registration_info ._sitter { margin-left: 1em; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration a { box-shadow: 0 2px 2px #999; margin-bottom: 0.5em; padding: 0.25rem; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration ._inner { border: 1px solid #fff; display: block; padding: 0.75em 1em; text-align: center; width: 176px; } .hierar-.-home .sec-.-information_contents ._registration_info ._registration_about { font-size: 14px; } .hierar-.-home .sec-.-information_contents ._to_pickup_sitter { display: none; } .hierar-.-home .sec-.-information_contents ._links { position: absolute; bottom: 1em; } .hierar-.-home .sec-.-information_contents ._links > ul { display: flex; justify-content: space-between; width: 800px; } .hierar-.-home .sec-.-information_contents ._links > ul > li { width: 160px; } .hierar-.-home .sec-.-information_contents ._links > ul > li > a { font-size: 14px; padding: 0.5em 0; } .hierar-.-home .sec-.-pickup_sitter { padding-top: 3.5em; padding-bottom:4em; } .hierar-.-home .sec-.-pickup_sitter > .inner-.-sec > ._heading { background-size: 264px 16px; font-size: 24px; margin-bottom: 3.5rem; padding-bottom: 12px; width: 264px; } .hierar-.-home .sec-.-pickup_sitter > .inner-.-sec > .inner-.-sec-contents { position: relative; } .hierar-.-home .sec-.-pickup_sitter ._text { position: absolute; top: -7em; right: 1em; width: 816px; } .hierar-.-home .sec-.-pickup_sitter ._list > ul::after { clear: both; content: ""; display: block; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li { float: left; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li:not(:nth-child(3n)) { margin-right: 120px; } .hierar-.-home .sec-.-pickup_sitter ._list > ul > li:nth-child(3) ~ li { margin-top: 2.5em; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3:not(:last-child) { margin-bottom: 4em; } .hierar-.-home .sec-.-pickup_sitter .sec-.-lv-3 > .inner-.-sec > ._heading { background-size: 64px 16px; font-size: 24px; } .hierar-.-home .sec-.-about { background-size: 1920px 560px; } .hierar-.-home .sec-.-about > .inner-.-sec { padding: 5em 0; } .hierar-.-home .sec-.-about > .inner-.-sec > ._heading { font-size: 24px; } .hierar-.-home .sec-.-about ._text.-about { margin-bottom: 3em; } .hierar-.-home .sec-.-about ._links > ul { display: flex; justify-content: space-between; padding: 0 2em; } .hierar-.-home .sec-.-about ._links > ul > li > a { width: 224px; } .hierar-.-home .sec-.-about ._links ._item { width: 224px; } .hierar-.-home .sec-.-about ._links ._item ._inner { padding: 1em 1.25em; } .hierar-.-home .sec-.-about ._links ._item ._image { margin-bottom: 0.5rem; text-align: center; } .hierar-.-home .sec-.-about ._links ._item ._image i { font-size: 48px; } .hierar-.-home .sec-.-about ._links ._item.-about ._image img { width: 112px; } .hierar-.-home .sec-.-about ._links ._item ._heading { margin-bottom: 1em; text-align: center; } .hierar-.-home .sec-.-about ._links ._item ._text p { font-size: 14px; } .hierar-.-home .sec-.-registration { background-size: 320px 224px; } .hierar-.-home .sec-.-registration > .inner-.-sec { height: auto; min-height: 480px; padding: 4em 4em 2em; position: relative; } .hierar-.-home .sec-.-registration > .inner-.-sec > ._heading { font-size: 24px; margin-bottom: 1.5em; } .hierar-.-home .sec-.-registration ._image { position: absolute; top: 4em; right: 1.5em; width: 368px; } .hierar-.-home .sec-.-registration ._links { position: absolute; top: calc( 5.5em + 264px ); right: 1.5em; } .hierar-.-home .sec-.-registration ._links a { display: block; width: 368px; } .hierar-.-home .sec-.-registration ._links ._btn ._inner { font-size: 24px; } .hierar-.-home .sec-.-sitter_recruit { background-color: #f99; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec { background: url("../img/home/sitter_recruit_bg_pc.jpg") no-repeat 50% 0; background-size: 1152px 384px; border-top: 8px solid #f99; border-bottom: 8px solid #f99; padding: 1.5em 1em 0.5em; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec > ._heading { background-size: 264px 16px; font-size: 24px; margin-bottom: 1rem; padding-bottom: 12px; width: 264px; } .hierar-.-home .sec-.-sitter_recruit > .inner-.-sec > .inner-.-sec-contents { position: relative; } .hierar-.-home .sec-.-sitter_recruit ._text { position: absolute; top: -4.5em; right: 1em; width: 816px; } .hierar-.-home .sec-.-sitter_recruit ._text p { display: inline; } .hierar-.-home .sec-.-sitter_recruit ._list > ul { display: flex; justify-content: space-between; margin-bottom: 1.5em; width: 832px; } .hierar-.-home .sec-.-sitter_recruit ._view_all a { text-shadow: 0 0 2px #999; } .hierar-.-home .sec-.-review { background: #ffc url("../img/home/review_bg.png") 0 50% no-repeat; } .hierar-.-home .sec-.-review > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-home .sec-.-review > .inner-.-sec > ._heading br { display: none; } .hierar-.-home .sec-.-review ._list { padding: 0 1em; } .hierar-.-home .sec-.-review ._list > ul::after { clear: both; content: ""; display: block; } .hierar-.-home .sec-.-review ._list > ul > li { float: left; } .hierar-.-home .sec-.-review ._list > ul > li:not(:nth-child(3n)) { margin-right: 80px; } .hierar-.-home .sec-.-review ._list > ul > li:nth-child(3) ~ li { margin-top: 2.5em; } .hierar-.-home .sec-.-review ._list ._item { width: 320px; } .hierar-.-home .sec-.-news > .inner-.-sec > ._heading { background-size: 264px 16px; font-size: 24px; margin-bottom: 1rem; margin-left: auto; margin-right: auto; padding-bottom: 12px; width: 264px; } .hierar-.-home .sec-.-news ._view_all { margin-left: 1em; } } /* about ----------------------------------------------- */ .hierar-.-about .st-.-breadcrumbs { display: none; } .hierar-.-about .st-.-contents { padding-top: 0; } .hierar-.-about .sec-.-about { background: url("../img/about/about_bg.jpg") no-repeat 50% 0; color: #666; } .hierar-.-about .sec-.-about > .inner-.-sec > ._heading { color: #fff; text-align: center; } .hierar-.-about .sec-.-about > .inner-.-sec > .inner-.-sec-contents > ._text p { color: #fff; text-align: center; } .hierar-.-about .sec-.-example > .inner-.-sec > ._heading { text-align: center; } .hierar-.-about .sec-.-example > .inner-.-sec > ._heading::before { content: "○●○"; } .hierar-.-about .sec-.-example > .inner-.-sec > ._heading::after { content: "○●○"; } .hierar-.-about .sec-.-area { background-color: #ffffde; } .hierar-.-about .sec-.-area > .inner-.-sec > ._heading em { color: #f28181; font-style: normal; } .hierar-.-about .sec-.-area ._notes > ul > li { margin-left: 1em; text-indent: -1em; } .hierar-.-about .sec-.-area ._notes > ul > li::before { content: "※"; } .hierar-.-about .sec-.-support { background: url("../img/about/support_bg.jpg") no-repeat 50% 0; } .hierar-.-about .sec-.-service > .inner-.-sec > ._heading { text-align: center; } .hierar-.-about .sec-.-service > .inner-.-sec > ._heading::before { content: "○●○"; } .hierar-.-about .sec-.-service > .inner-.-sec > ._heading::after { content: "○●○"; } .hierar-.-about .sec-.-service { background: url("../img/about/rainbow.jpg") no-repeat 50% 0; } .hierar-.-about .sec-.-service ._list ._item ._image { margin: 0 auto; } .hierar-.-about .sec-.-service ._list ._item > ._heading { color: rgba( 0, 102, 153, 0.8 ); text-align: center; } @media (max-width: 480px) { .hierar-.-about .sec-.-about { background-size: 1280px 341px; padding-top: calc( 80px + 1em ); } .hierar-.-about .sec-.-about > .inner-.-sec > ._heading { margin-bottom: 1em; } .hierar-.-about .sec-.-about ._text { margin-bottom: 4em; } .hierar-.-about .sec-.-about ._text p { font-size: 12px; } .hierar-.-about .sec-.-example > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-about .sec-.-example ._list ._item { display: flex; align-items: center; justify-content: space-around; } .hierar-.-about .sec-.-example ._list ._item ._image { width: 144px; } .hierar-.-about .sec-.-area { padding: 2em 0; } .hierar-.-about .sec-.-area > .inner-.-sec { position: relative; } .hierar-.-about .sec-.-area > .inner-.-sec > ._heading { font-size: 14px; position: absolute; top: 0; right: 1em; } .hierar-.-about .sec-.-area ._image { margin: 0 auto; width: 272px; } .hierar-.-about .sec-.-support { background-size: cover; margin: 2em 0; } .hierar-.-about .sec-.-support > .inner-.-sec > ._heading { font-size: 14px; padding-top: 2em; padding-bottom: 1em; } .hierar-.-about .sec-.-support > .inner-.-sec > ._heading br { display: none; } .hierar-.-about .sec-.-support ._notes { padding-bottom: 1em; } .hierar-.-about .sec-.-service { background-size: cover; padding: 2em 0; } .hierar-.-about .sec-.-service > .inner-.-sec > ._heading { font-size: 14px; margin-bottom: 1em; } .hierar-.-about .sec-.-service ._list > ul { display: flex; flex-wrap: wrap; } .hierar-.-about .sec-.-service ._list > ul > li { margin-bottom: 2em; width: calc( 100% / 4 ); } .hierar-.-about .sec-.-service ._list ._item ._image { width: 48px; } .hierar-.-about .sec-.-service ._list ._item ._heading { font-size: 10px; } .hierar-.-about .sec-.-service ._attention { margin-bottom: 2em; } } @media (min-width: 481px) { .hierar-.-about .st-.-contents { padding-top: 0; } .hierar-.-about .sec-.-about { background-size: 1920px 512px; padding-top: calc( 80px + 1em ); } .hierar-.-about .sec-.-about > .inner-.-sec > ._heading { font-size: 24px; margin-top: 3rem; margin-bottom: 3rem; } .hierar-.-about .sec-.-about > .inner-.-sec > .inner-.-sec-contents > ._text { margin-bottom: 6em; } .hierar-.-about .sec-.-about > .inner-.-sec > .inner-.-sec-contents > ._text p { line-height: 2; } .hierar-.-about .sec-.-about > .inner-.-sec > .inner-.-sec-contents > ._text p:nth-child(2) { margin-bottom: 2em; } .hierar-.-about .sec-.-example { padding: 3em 0; } .hierar-.-about .sec-.-example ._list > ul { display: flex; justify-content: space-around; } .hierar-.-about .sec-.-example ._list > ul > li { width: 208px; } .hierar-.-about .sec-.-example ._list ._item > ._heading { text-align: center; } .hierar-.-about .sec-.-area > .inner-.-sec { overflow: hidden; } .hierar-.-about .sec-.-area > .inner-.-sec > ._heading { background: url("../img/about/area_bg.png") no-repeat; background-size: 304px 268px; font-size: 20px; float: left; margin-top: 1em; margin-bottom: 3em; padding: 5em 0; text-align: center; width: 304px; } .hierar-.-about .sec-.-area ._image { float: right; width: 688px; } .hierar-.-about .sec-.-area ._notes { float: left; width: 384px; } .hierar-.-about .sec-.-support { background-size: 1920px 256px; height: 256px; margin: 4em 0; } .hierar-.-about .sec-.-support > .inner-.-sec > ._heading { color: #333; font-size: 24px; padding-top: 3em; text-align: center; } .hierar-.-about .sec-.-support ._notes { text-align: center; } .hierar-.-about .sec-.-service { background-size: 1920px 960px; border-top: 16px solid #88d9e8; border-bottom: 16px solid #88d9e8; } .hierar-.-about .sec-.-service > .inner-.-sec > ._heading { font-size: 24px; margin: 3rem 0; } .hierar-.-about .sec-.-service ._list > ul { display: flex; flex-wrap: wrap; } .hierar-.-about .sec-.-service ._list > ul > li { margin-bottom: 4em; width: calc( 100% / 6 ); } .hierar-.-about .sec-.-service ._list ._item ._image { width: 96px; } .hierar-.-about .sec-.-service ._attention { margin-bottom: 4em; text-align: center; } } /* price ----------------------------------------------- */ .hierar-.-price .sec-.-price { color: #666; } .hierar-.-price .sec-.-price > .inner-.-sec > ._heading { color: #f28181; } .hierar-.-price .sec-.-fee { margin-bottom: 3em; } .hierar-.-price .sec-.-fee > .inner-.-sec > ._heading { display: none; } .hierar-.-price .sec-.-fee ._catchphrase { background-color: #9c6; border-radius: 0.5em; color: #fff; margin-top: 1em; text-align: center; padding: 0.25em 0.5em; } .hierar-.-price .sec-.-price_details ._index { background: #f28181 url("../img/price/toy.png") repeat-x 0 32px; } .hierar-.-price .sec-.-price_details ._index ._item { background-color: #fff; border-radius: 0.5rem; box-shadow: 2px 2px 2px #999; text-align: center; } .hierar-.-price .sec-.-price_details ._index > ul > li:not(:first-child)::before { color: #fff; content: "\f067"; font-family: 'FontAwesome'; } .hierar-.-price .sec-.-price_details ._index ._item.-sitting { color: #00a0df; } .hierar-.-price .sec-.-price_details ._index ._item.-option { color: #9e0d82; } .hierar-.-price .sec-.-price_details ._index ._item.-system { color: #ed811b; } .hierar-.-price .sec-.-price_details ._index ._item.-expenses { color: #00984b; } .hierar-.-price .sec-.-price_details ._index ._item ._heading { font-weight: bold; } .hierar-.-price .sec-.-price_details ._definitions-price { padding: 2em 0; } .hierar-.-price .sec-.-price_details ._definitions-price > dl > dt { font-weight: bold; text-align: center; margin-bottom: 2em; } .hierar-.-price .sec-.-price_details ._definitions-price > dl > dd { margin-bottom: 2em; text-align: center; } .hierar-.-price .sec-.-price_details ._definitions-price > dl > dd em { font-style: normal; } .hierar-.-price .sec-.-price_details ._definitions-price ._sitting, .hierar-.-price .sec-.-price_details ._definitions-price ._sitting + dd em { color: #00a0df; } .hierar-.-price .sec-.-price_details ._definitions-price ._option, .hierar-.-price .sec-.-price_details ._definitions-price ._option + dd em { color: #9e0d82; } .hierar-.-price .sec-.-price_details ._definitions-price ._system, .hierar-.-price .sec-.-price_details ._definitions-price ._system + dd em { color: #ed811b; } .hierar-.-price .sec-.-price_details ._definitions-price ._expenses, .hierar-.-price .sec-.-price_details ._definitions-price ._expenses + dd em { color: #00984b; } .hierar-.-price .sec-.-price_details ._notes > ul > li::before { content: "※"; } .hierar-.-price .sec-.-price_details ._simulation { background-color: #f28181; border-radius: 1em; box-shadow: 2px 2px 2px #999; color: #fff; } .hierar-.-price .sec-.-price_details ._simulation ._heading { text-align: center; } .hierar-.-price .sec-.-price_details ._simulation ._heading::before { content: "・・・"; } .hierar-.-price .sec-.-price_details ._simulation ._heading::after { content: "・・・"; } .hierar-.-price .sec-.-price_details ._simulation ._text p { text-align: center; } .hierar-.-price .sec-.-price_details ._simulation ._definitions > dl { overflow: hidden; } .hierar-.-price .sec-.-price_details ._simulation ._definitions > dl > dt { clear: left; float: left; } .hierar-.-price .sec-.-price_details ._simulation ._definitions > dl > dd { float: right; } .hierar-.-price .sec-.-price_details ._simulation ._definitions ._sum, .hierar-.-price .sec-.-price_details ._simulation ._definitions ._sum + dd { color: #ffb; } .hierar-.-price .sec-.-cancel { background-color: #eee; } .hierar-.-price .sec-.-cancel .inner-.-sec > ._heading { text-align: center; } .hierar-.-price .sec-.-cancel ._summary p { text-align: center; } .hierar-.-price .sec-.-cancel ._list > ul > li { margin-left: 1em; text-indent: -1em; } .hierar-.-price .sec-.-cancel ._list > ul > li::before { content: "・"; } .hierar-.-price .sec-.-payment .inner-.-sec > ._heading { text-align: center; } .hierar-.-price .sec-.-payment ._summary p { text-align: center; } .hierar-.-price .sec-.-payment ._list > ul > li { margin-left: 1em; text-indent: -1em; } .hierar-.-price .sec-.-payment ._list > ul > li::before { content: "・"; } .hierar-.-price .sec-.-payment ._card ._brand > ul { display: flex; } .hierar-.-price .sec-.-payment ._card ._brand > ul > li:not(:first-child)::before { content: "/"; } .hierar-.-price .sec-.-payment ._card ._brand_image > ul { display: flex; } @media (max-width: 480px) { .hierar-.-price .sec-.-price > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 0.25rem; } .hierar-.-price .sec-.-fee > .inner-.-sec > .inner-.-sec-contents { background-color: #ffc; color: #9c6; padding: 1em; } .hierar-.-price .sec-.-price_details ._index { margin-bottom: 2em; padding: 0.5em ; } .hierar-.-price .sec-.-price_details ._index ._item { padding: 1em 0.5em; } .hierar-.-price .sec-.-price_details ._index > ul > li { text-align: center; } .hierar-.-price .sec-.-price_details ._index > ul > li:not(:first-child)::before { display: block; font-size: 24px; margin-bottom: 1rem; } .hierar-.-price .sec-.-price_details ._index > ul > li:not(:last-child) { margin-bottom: 1rem; } .hierar-.-price .sec-.-price_details ._notes { margin-bottom: 2em; } .hierar-.-price .sec-.-price_details ._simulation { margin-bottom: 2em; padding: 1em; } .hierar-.-price .sec-.-price_details ._text { margin-bottom: 1em; } .hierar-.-price .sec-.-cancel { padding: 2em 0; } .hierar-.-price .sec-.-cancel > .inner-.-sec > ._heading { margin-bottom: 1em; } .hierar-.-price .sec-.-cancel ._summary { margin-bottom: 1em; } .hierar-.-price .sec-.-cancel ._list > ul > li { margin-bottom: 0.5em; } .hierar-.-price .sec-.-payment { padding: 2em 0; } .hierar-.-price .sec-.-payment > .inner-.-sec > ._heading { margin-bottom: 1em; } .hierar-.-price .sec-.-payment ._brand_image > ul > li { padding: 0 0.25rem; } .hierar-.-price .sec-.-payment ._brand_image i { font-size: 32px; } } @media (min-width: 481px) { .hierar-.-price .sec-.-price > .inner-.-sec > ._heading { font-size: 32px; margin-bottom: 0.25rem; padding-top: 1rem; padding-bottom: 1rem; } .hierar-.-price .sec-.-fee { background: url("../img/price/fee_bg.jpg") no-repeat 50% 0; background-size: 1920px 352px; padding: 4em 0; } .hierar-.-price .sec-.-fee > .inner-.-sec > .inner-.-sec-contents { background-color: #ffc; color: #9c6; padding: 3em; width: 480px; } .hierar-.-price .sec-.-fee ._text { font-weight: bold; } .hierar-.-price .sec-.-fee ._catchphrase { font-weight: bold; font-size: 24px; } .hierar-.-price .sec-.-price_details ._index { background-size: 320px 208px; } .hierar-.-price .sec-.-price_details ._index > ul { display: flex; justify-content: space-between; padding: 80px 1em; margin: 0 auto; width: 1152px; } .hierar-.-price .sec-.-price_details ._index > ul > li { position: relative; } .hierar-.-price .sec-.-price_details ._index > ul > li:not(:first-child)::before { font-size: 48px; position: absolute; top: 3rem; left: -5.5rem; } .hierar-.-price .sec-.-price_details ._index ._item { height: 176px; padding: 3em 0.5em; width: 176px; } .hierar-.-price .sec-.-price_details ._definitions-price > dl > dt { font-size: 20px; } .hierar-.-price .sec-.-price_details ._notes { margin: 0 auto 3em; padding-left: 3em; width: 768px; } .hierar-.-price .sec-.-price_details ._simulation { margin: 0 auto 2em; padding: 2em 0; width: 672px; } .hierar-.-price .sec-.-price_details ._simulation ._text { margin-bottom: 1.5em; } .hierar-.-price .sec-.-price_details ._simulation ._definitions { margin: 0 auto; width: 400px; } .hierar-.-price .sec-.-cancel { padding: 3em 0; } .hierar-.-price .sec-.-cancel > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 1em; } .hierar-.-price .sec-.-cancel ._summary { margin-bottom: 1em; } .hierar-.-price .sec-.-cancel ._list > ul > li { margin-bottom: 0.5em; } .hierar-.-price .sec-.-payment { padding: 3em 0; } .hierar-.-price .sec-.-payment ._summary { margin-bottom: 1.5em; } .hierar-.-price .sec-.-payment > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 1em; } .hierar-.-price .sec-.-payment > .inner-.-sec { position: relative; } .hierar-.-price .sec-.-payment ._brand_image { position: absolute; bottom: 1em; right: 4em; } .hierar-.-price .sec-.-payment ._brand_image > ul > li { padding: 0 1em; } .hierar-.-price .sec-.-payment ._brand_image i { font-size: 64px; } } /* service_flow ----------------------------------------------- */ .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading { color: #f28181; } .hierar-.-service_flow .sec-.-index { background-color: #eee; } .hierar-.-service_flow .sec-.-index .inner-.-sec > ._heading { display: none; } .hierar-.-service_flow .sec-.-index ._list-ordered > ol > li { counter-increment: count; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item { background-color: #fff; box-shadow: 0 2px 2px #999; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents { padding: 0.75em; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents > ._heading { color: #333; font-weight: normal; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents > ._heading::before { content: counter(count) "."; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents ._text p { color: #666; font-size: 12px; } .hierar-.-service_flow .sec-.-flow .inner-.-sec > ._heading { display: none; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li { counter-increment: count; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item { background-color: #f28181; color: #fff; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item > ._heading::before { content: counter(count) "."; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._notes > ul > li { margin-left: 1em; text-indent: -1em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._notes > ul > li::before { content: "※"; } .hierar-.-service_flow .sec-.-registration { color: #fff; margin-bottom: 2em; } .hierar-.-service_flow .sec-.-registration .inner-.-sec > ._heading { display: none; } .hierar-.-service_flow .sec-.-registration ._catchphrase { font-weight: bold; text-align: center; } .hierar-.-service_flow .sec-.-registration ._link { text-align: center; } .hierar-.-service_flow .sec-.-registration ._link a { background-color: #7dc7ae; box-shadow: 0 2px 2px #999; color: #fff; display: inline-block; font-weight: bold; text-decoration: none; } .hierar-.-service_flow .sec-.-registration ._link a span { border: 1px solid #fff; display: inline-block; text-align: center; } .hierar-.-service_flow .sec-.-registration ._contact > ._heading { text-align: center; } .hierar-.-service_flow .sec-.-registration ._contact ._list > ul > li > a { color: #fff; font-weight: bold; text-decoration: none; } @media (max-width: 480px) { .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 0.25rem; } .hierar-.-service_flow .sec-.-index > .inner-.-sec { padding-top: 1em; padding-bottom: 1em; } .hierar-.-service_flow .sec-.-index ._list-ordered > ol > li { margin-bottom: 1em; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item { display: flex; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._image { flex-shrink: 0; width: 96px; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents > ._heading { font-size: 14px; } .hierar-.-service_flow .sec-.-flow { padding-top: 1em; padding-bottom: 1em; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li { position: relative; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li:not(:last-child) { margin-bottom: 2rem; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li:not(:last-child)::before { border: 24px solid transparent; border-top: 24px solid #f28181; content: ""; position: absolute; bottom: -48px; left: calc( 50% - 24px ); } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item { overflow: hidden; padding: 1em 0.5em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._image { display: none; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item > ._heading { margin-bottom: 0.5em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._text { margin-bottom: 1em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._text p { font-size: 12px; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._notes > ul > li { font-size: 12px; } .hierar-.-service_flow .sec-.-registration { background: url("../img/service_flow/registration_bg_sp.jpg") no-repeat 50% 0; background-size: 480px 224px; height: auto; min-height: 224px; } .hierar-.-service_flow .sec-.-registration > .inner-.-sec > .inner-.-sec-contents { padding-top: 2em; } .hierar-.-service_flow .sec-.-registration ._catchphrase { margin-bottom: 1.25em; } .hierar-.-service_flow .sec-.-registration ._link { margin-bottom: 1.5em; } .hierar-.-service_flow .sec-.-registration ._link a { padding: 0.5em; } .hierar-.-service_flow .sec-.-registration ._link a span { padding: 0.5em 0; width: 208px; } .hierar-.-service_flow .sec-.-registration ._contact > ._heading { margin-bottom: 0.25em; } .hierar-.-service_flow .sec-.-registration ._contact ._list > ul > li { margin-bottom: 0.25em; text-align: center; } } @media (min-width: 481px) { .hierar-.-service_flow .sec-.-service_flow > .inner-.-sec > ._heading { font-size: 32px; margin-bottom: 0.25rem; padding-top: 1rem; padding-bottom: 1rem; } .hierar-.-service_flow .sec-.-index > .inner-.-sec { padding-top: 3em; padding-bottom: 3em; } .hierar-.-service_flow .sec-.-index ._list-ordered > ol { display: flex; justify-content: space-between; } .hierar-.-service_flow .sec-.-index ._list-ordered > ol > li { width: 192px; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._image { box-shadow: 0 2px 2px #999; } .hierar-.-service_flow .sec-.-index ._list-ordered ._item ._contents > ._heading { margin-top: 0.25em; margin-bottom: 0.5em; } .hierar-.-service_flow .sec-.-flow { padding-top: 5em; padding-bottom: 5em; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li { position: relative; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li:not(:last-child) { margin-bottom: 6em; } .hierar-.-service_flow .sec-.-flow ._list-ordered > ol > li:not(:last-child)::before { border: 48px solid transparent; border-top: 48px solid #f28181; content: ""; position: absolute; bottom: -96px; left: calc( 50% - 48px ); } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item { overflow: hidden; padding: 2.5em 2em; padding-right: 1em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._image { float: left; width: 288px; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item > ._heading, .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._text, .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._notes { float: right; width: calc( 100% - 320px ); } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item > ._heading { font-size: 24px; margin-bottom: 0.5em; } .hierar-.-service_flow .sec-.-flow ._list-ordered ._item ._text { margin-bottom: 2em; } .hierar-.-service_flow .sec-.-registration { background: url("../img/service_flow/registration_bg_pc.jpg") no-repeat 50% 0; background-size: 1920px 320px; height: auto; min-height: 320px; } .hierar-.-service_flow .sec-.-registration > .inner-.-sec > .inner-.-sec-contents { margin-left: 480px; padding-top: 3em; width: 448px; } .hierar-.-service_flow .sec-.-registration ._catchphrase { font-size: 24px; margin-bottom: 2rem; } .hierar-.-service_flow .sec-.-registration ._link { margin-bottom: 3em; } .hierar-.-service_flow .sec-.-registration ._link a { font-size: 24px; font-weight: bold; padding: 0.75rem 0.5rem; } .hierar-.-service_flow .sec-.-registration ._link a span { padding: 0.5rem 0; width: 368px; } .hierar-.-service_flow .sec-.-registration ._contact ._list > ul { display: flex; justify-content: space-between; } } /* safety ----------------------------------------------- */ .hierar-.-safety .sec-.-safety { color: #666; } .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading { color: #f28181; } .hierar-.-safety .sec-.-index { background: url("../img/safety/index_bg.jpg") no-repeat 50% 50%; } .hierar-.-safety .sec-.-index > .inner-.-sec > ._heading { display: none; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._text p { text-align: center; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._heading { text-align: center; } .hierar-.-safety .sec-.-safety_item ._interview { background-color: #ffc; } .hierar-.-safety .sec-.-safety_item ._interview ._contents { border-radius: 0.5em; background-color: #fff; } .hierar-.-safety .sec-.-safety_item ._interview ._interviewer ._definitions > dl > dt { clear: left; float: left; } .hierar-.-safety .sec-.-safety_item ._interview ._interviewer ._definitions > dl > dt::after { content: " :"; margin-right: 0.25em; } @media (max-width: 480px) { .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 0.25rem; } .hierar-.-safety .sec-.-index { padding: 2em 0; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._text { margin-bottom: 1em; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._text p img { vertical-align: bottom; width: 80px; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._heading { margin-bottom: 1em; } .hierar-.-safety .sec-.-index ._list ._item { display: flex; align-items: center; } .hierar-.-safety .sec-.-index ._list ._item > ._heading { flex-shrink: 0; margin-right: 0.5em; padding-top: 4em; text-align: center; width: 6em; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(1) ._item > ._heading { background: url("../img/safety/index_01.png") no-repeat 50% 0; background-size: 56px 48px; color: #069; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(2) ._item > ._heading { background: url("../img/safety/index_02.png") no-repeat 50% 0; background-size: 56px 48px; color: #9e0d82; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(3) ._item > ._heading { background: url("../img/safety/index_03.png") no-repeat 50% 0; background-size: 56px 48px; color: #e40075; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(4) ._item > ._heading { background: url("../img/safety/index_04.png") no-repeat 50% 0; background-size: 56px 48px; color: #f60; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(5) ._item > ._heading { background: url("../img/safety/index_05.png") no-repeat 50% 0; background-size: 56px 48px; color: #4ea200; } .hierar-.-safety .sec-.-safety_item { margin-top: 3em; } .hierar-.-safety .sec-.-safety_item ._interview { margin-top: 2em; } .hierar-.-safety .sec-.-safety_item ._interview ._contents ._definitions dt { font-size: 16px; margin-bottom: 0.5em; } } @media (min-width: 481px) { .hierar-.-safety .sec-.-safety > .inner-.-sec > ._heading { font-size: 32px; margin-bottom: 0.25rem; padding-top: 1rem; padding-bottom: 1rem; } .hierar-.-safety .sec-.-index { background-size: 1920px 640px; margin-bottom: 2em; padding: 3em 0; } .hierar-.-safety .sec-.-index > .inner-.-sec > .inner-.-sec-contents > ._text p img { vertical-align: bottom; width: 144px; } .hierar-.-safety .sec-.-index ._text { margin-bottom: 2em; } .hierar-.-safety .sec-.-index ._text + ._heading { font-size: 24px; margin-bottom: 1em; } .hierar-.-safety .sec-.-index ._list > ul { display: flex; justify-content: space-between; margin: 0 auto; padding: 0 1em; width: 1152px; } .hierar-.-safety .sec-.-index ._list > ul > li { width: 144px; } .hierar-.-safety .sec-.-index ._list ._item > ._heading { padding-top: 4em; text-align: center; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(1) ._item > ._heading { background: url("../img/safety/index_01.png") no-repeat 50% 0; background-size: 112px 96px; color: #069; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(2) ._item > ._heading { background: url("../img/safety/index_02.png") no-repeat 50% 0; background-size: 112px 96px; color: #9e0d82; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(3) ._item > ._heading { background: url("../img/safety/index_03.png") no-repeat 50% 0; background-size: 112px 96px; color: #e40075; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(4) ._item > ._heading { background: url("../img/safety/index_04.png") no-repeat 50% 0; background-size: 112px 96px; color: #f60; } .hierar-.-safety .sec-.-index ._list > ul > li:nth-child(5) ._item > ._heading { background: url("../img/safety/index_05.png") no-repeat 50% 0; background-size: 112px 96px; color: #4ea200; } .hierar-.-safety .sec-.-index + .sec-.-safety_item ~ .sec-.-safety_item { margin-bottom: 4em; } .hierar-.-safety .sec-.-index + .sec-.-safety_item ~ .sec-.-safety_item > .inner-.-sec > ._heading span { display: block; } .hierar-.-safety .sec-.-index + .sec-.-safety_item ~ .sec-.-safety_item > .inner-.-sec { position: relative; height: auto; min-height: 320px; } .hierar-.-safety .sec-.-index + .sec-.-safety_item ~ .sec-.-safety_item ._text { margin-top: 1em; width: 528px; } .hierar-.-safety .sec-.-index + .sec-.-safety_item ~ .sec-.-safety_item ._image { box-shadow: 2px 2px 2px #999; position: absolute; top: 0; right: 0; width: 480px; } .hierar-.-safety .sec-.-safety_item { margin-bottom: 6em; } .hierar-.-safety .sec-.-safety_item > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-safety .sec-.-safety_item > .inner-.-sec > .inner-.-sec-contents > ._text { margin-bottom: 1em; } .hierar-.-safety .sec-.-safety_item ._interview { border-radius: 1em; display: flex; justify-content: space-between; padding: 1em 2em; } .hierar-.-safety .sec-.-safety_item ._interview ._contents { border-radius: 1em; box-shadow: 1px 1px 1px #999; padding: 1em; width: 688px; } .hierar-.-safety .sec-.-safety_item ._interview ._contents ._definitions dt { font-size: 20px; margin-bottom: 0.5em; } .hierar-.-safety .sec-.-safety_item ._interview ._interviewer { width: 320px; } } /* member_registration_flow ----------------------------------------------- */ .hierar-.-member_registration_flow { color: #666; } .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading { color: #f28181; font-weight: normal; } .hierar-.-member_registration_flow .sec-.-about { background-color: #ffc; } .hierar-.-member_registration_flow .sec-.-about > .inner-.-sec > ._heading { display: none; } .hierar-.-member_registration_flow .sec-.-about ._about > ._heading { font-weight: bold; } .hierar-.-member_registration_flow .sec-.-about ._about > ._heading em { color: #f28181; font-style: normal; } .hierar-.-member_registration_flow .sec-.-about ._about ._text { background-color: #fff; } .hierar-.-member_registration_flow .sec-.-about ._link a { background-color: #7dc7ae; color: #fff; display: inline-block; font-weight: bold; } .hierar-.-member_registration_flow .sec-.-about ._link span { border: 1px solid #fff; display: block; text-align: center; } .hierar-.-member_registration_flow .sec-.-flow > .inner-.-sec > ._heading { display: none; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li { background-color: #eee; counter-increment: count; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li:last-child { background: #eee url("../img/member_registration_flow/illustration_02.png") no-repeat; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._heading::before { content: counter(count); margin-right: 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._image { border: 2px solid #fff; box-shadow: 2px 2px 2px #999; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._notes > ul > li { padding-left: 1em; text-indent: -1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._notes > ul > li::before { content: "※"; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._notes strong { color: #f28181; font-weight: normal; } .hierar-.-member_registration_flow .sec-.-notes ._text em { color: #f28181; font-style: normal; } .hierar-.-member_registration_flow .sec-.-notes > .inner-.-sec > ._heading { color: #f28181; text-align: center; } .hierar-.-member_registration_flow .sec-.-notes ._text p { padding-left: 1em; text-indent: -1em; } @media (max-width: 480px) { .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading { font-size: 16px; margin-bottom: 0.5em; } .hierar-.-member_registration_flow .sec-.-lv-2 { margin-bottom: 2em; } .hierar-.-member_registration_flow .sec-.-lv-2 ._pc { display: none; } .hierar-.-member_registration_flow .sec-.-about > .inner-.-sec { padding-top: 0.5em; padding-bottom: 1em; } .hierar-.-member_registration_flow .sec-.-about ._about { margin-bottom: 1em; } .hierar-.-member_registration_flow .sec-.-about ._about > ._heading { background: url("../img/member_registration_flow/illustration_01.png") 0 calc( 100% + 68px ) / 90px 144px no-repeat; font-size: 14px; padding: 1em 0 0.5em; padding-left: 96px; } .hierar-.-member_registration_flow .sec-.-about ._about ._text { padding: 0.5em; } .hierar-.-member_registration_flow .sec-.-about ._link { text-align: center; } .hierar-.-member_registration_flow .sec-.-about ._link a { padding: 0.25em; } .hierar-.-member_registration_flow .sec-.-about ._link span { padding: 0.25em 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li { margin-bottom: 1em; padding: 0.5em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li:last-child { background-position: calc( 100% - 0.5em ) calc( 100% - 0.5em ); background-size: 76px 52px; padding-bottom: calc( 0.5em + 52px ); } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item > ._heading { margin-bottom: 0.5em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._text { margin-bottom: 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._text p { font-size: 12px; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._image { margin-bottom: 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._notes > ul > li { font-size: 12px; } .hierar-.-member_registration_flow .sec-.-notes > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-member_registration_flow .sec-.-notes > .inner-.-sec > ._heading { font-size: 16px; margin-bottom: 1.5em; } .hierar-.-member_registration_flow .sec-.-notes ._text p:not(:last-child) { margin-bottom: 1em; } } @media (min-width: 481px) { .hierar-.-member_registration_flow .sec-.-member_registration_flow > .inner-.-sec > ._heading { font-size: 32px; margin-top: 1rem; margin-bottom: 2rem; } .hierar-.-member_registration_flow .sec-.-lv-2 ._sp { display: none; } .hierar-.-member_registration_flow .sec-.-about { margin-bottom: 3em; } .hierar-.-member_registration_flow .sec-.-about .inner-.-sec > .inner-.-sec-contents { padding: 1.5em 0; position: relative; } .hierar-.-member_registration_flow .sec-.-about ._about { width: 640px; } .hierar-.-member_registration_flow .sec-.-about ._about > ._heading { background: url("../img/member_registration_flow/illustration_01.png") 24px calc( 100% + 92px ) / 120px 192px no-repeat; font-size: 20px; padding: 1rem 0 1.5rem; padding-left: 160px; } .hierar-.-member_registration_flow .sec-.-about ._about ._text { padding: 0.5em 3em; } .hierar-.-member_registration_flow .sec-.-about ._link { position: absolute; top: 80px; left: calc( 640px + 48px ); } .hierar-.-member_registration_flow .sec-.-about ._link a { padding: 0.75em 0.5em; } .hierar-.-member_registration_flow .sec-.-about ._link span { font-size: 24px; padding: 0.75rem 3rem; } .hierar-.-member_registration_flow .sec-.-flow { margin-bottom: 4em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li { display: flex; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li:not(:last-child) { background: #eee url("../img/member_registration_flow/registration_flow_arrow.png") 118px 180px / 40px 224px no-repeat; margin-bottom: 3em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li:last-child { background-position: 80px calc( 100% - 64px ); background-size: 152px 104px; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered > ol > li::before { background: url("../img/member_registration_flow/registration_flow_no_bg.png") 50% 16px / 144px 144px no-repeat; color: #f28181; content: counter(count); display: block; flex-shrink: 0; font-size: 48px; font-weight: bold; padding-top: 48px; text-align: center; text-shadow: 0 4px 2px #999; width: 272px; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item { padding: 1.5em 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item > ._heading { margin-bottom: 1em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._text p { font-size: 14px; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._text { margin-bottom: 1.5em; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._image + ._text { margin-bottom: 0; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._image { margin-bottom: 1.5em; width: 640px; } .hierar-.-member_registration_flow .sec-.-flow ._list_ordered ._item ._notes > ul > li { font-size: 14px; } .hierar-.-member_registration_flow .sec-.-notes > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 1.5rem; } .hierar-.-member_registration_flow .sec-.-notes { margin-bottom: 4em; } .hierar-.-member_registration_flow .sec-.-notes ._text p { text-align: center; } .hierar-.-member_registration_flow .sec-.-notes ._text p:not(:last-child) { margin-bottom: 1em; } } /* sitting_guideline_compliance ----------------------------------------------- */ .hierar-.-sitting_guideline_compliance .sec-.-sitting_guideline_compliance { color: #666; } .hierar-.-sitting_guideline_compliance .sec-.-sitting_guideline_compliance > .inner-.-sec > ._heading { border-bottom: 1px solid #666; text-align: center; } .hierar-.-sitting_guideline_compliance .sec-.-about ._text a { color: #0071bc; text-decoration: none; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl > dt { counter-increment: count; font-weight: bold; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl > dt::before { content: "(" counter(count) ")"; display: inline-block; width: 2em; } @media (max-width: 480px) { .hierar-.-sitting_guideline_compliance .sec-.-sitting_guideline_compliance > .inner-.-sec > ._heading { font-size: 16px; margin-bottom: 1.25em; padding: 1.5em 0; } .hierar-.-sitting_guideline_compliance .sec-.-lv-2 > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-sitting_guideline_compliance .sec-.-about { margin-bottom: 3em; } .hierar-.-sitting_guideline_compliance .sec-.-about > .inner-.-sec > ._heading { margin-bottom: 0.25em; } .hierar-.-sitting_guideline_compliance .sec-.-about ._text p { line-height: 2; } .hierar-.-sitting_guideline_compliance .sec-.-details > .inner-.-sec > ._heading { margin-bottom: 2em; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions { padding-bottom: 3em; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl { line-height: 2; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl > dd:not(:last-of-type) { margin-bottom: 3em; } } @media (min-width: 481px) { .hierar-.-sitting_guideline_compliance .st-.-contents { background: url("../img/common/bg_gradation_light_bllue.jpg") repeat-y 0 0 / contain; } .hierar-.-sitting_guideline_compliance .sec-.-sitting_guideline_compliance > .inner-.-sec { margin: 0 auto; width: 800px; } .hierar-.-sitting_guideline_compliance .sec-.-sitting_guideline_compliance > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 1.25em; padding: 2em 0; } .hierar-.-sitting_guideline_compliance .sec-.-lv-2 > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-sitting_guideline_compliance .sec-.-about { margin-bottom: 6em; } .hierar-.-sitting_guideline_compliance .sec-.-about > .inner-.-sec > ._heading { margin-bottom: 0.75em; } .hierar-.-sitting_guideline_compliance .sec-.-about ._text p { line-height: 3; } .hierar-.-sitting_guideline_compliance .sec-.-details > .inner-.-sec > ._heading { margin-bottom: 4em; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions { padding-bottom: 6em; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl { line-height: 3; } .hierar-.-sitting_guideline_compliance .sec-.-details ._definitions > dl > dd:not(:last-of-type) { margin-bottom: 6em; } } /* sitter_movies ----------------------------------------------- */ .hierar-.-sitter_movies { color: #666; } .hierar-.-sitter_movies .sec-.-sitter_movies > .inner-.-sec > ._heading { background: url("../img/common/bg_flower.png") 50% 50% repeat-x; background-size: 64px 16px; color: #fc6; text-align: center; } .hierar-.-sitter_movies .sec-.-sitter_movies > .inner-.-sec > ._heading span { background-color: #fff; padding: 0 1em; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list > ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._movie { position:relative; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._movie .ytbtn{ position: absolute; top: calc(50% - 20px); left: calc(50% - 30px); width:60px; height:40px; pointer-events: none; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._movie iframe { height: 100%; width: 100%; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._sitter_info::after { clear: both; content: ""; display: block; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._sitter_info ._name { float: left; margin-right: 0.5em; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._sitter_info ._fee { float: left; margin-right: 0.5em; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._sitter_info ._area { float: left; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._sitter_info ._message { clear: left; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._link a { color: #fc6; } @media (max-width: 480px) { .hierar-.-sitter_movies .sec-.-sitter_movies > .inner-.-sec > ._heading { font-size: 20px; margin-bottom: 0.5rem; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list > ul > li { margin-bottom: 2em; } } @media (min-width: 481px) { .hierar-.-sitter_movies .sec-.-sitter_movies > .inner-.-sec > ._heading { font-size: 24px; margin-bottom: 1em; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list > ul > li { margin-bottom: 4em; width: 432px; } .hierar-.-sitter_movies .sec-.-sitter_movies ._list ._item ._movie { height: 240px; background: #ddd; display: flex; justify-content: center; align-items: center; } } /* sitter_search ----------------------------------------------- */ .hierar-.-sitter_search .sec-.-sitter_search > .inner-.-sec > ._heading { display: none; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap { position: relative; margin: 1em 0 2em; padding: 1em 0; background: #ffe; border: 1px solid #71462e; box-shadow: 0 2px 2px #999; overflow: hidden; text-align: center; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap .br_sp { display: none; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap .wday_wrap { position: relative; display: inline-block; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap .wday_wrap span { position: absolute; z-index: 1; top: calc(50% - 7px); right: 4px; line-height: 1em; font-size:14px; color: #999; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap input, .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap select { position: relative; z-index: 1; padding: 0.5em; border: solid 1px #999; border-radius: 2px; box-sizing: border-box; line-height: 1.5em; font-family: sans-serif; font-size:16px; color:#666; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap button { position: relative; z-index: 1; width: 250px; line-height: 1em; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap ._baby { position: absolute; top: calc( 100% - 84px); left: 0; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap ._baby img { width: 112px; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap ._goods { position: absolute; top: calc( 100% - 75px); right: 0; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap ._goods img { width: 152px; } .hierar-.-sitter_search .sec-.-sitter_search ._list ul{ display: flex; flex-wrap: wrap; } .hierar-.-sitter_search .sec-.-sitter_search ._list li{ flex: 0 0 auto; margin: 0 104px 54px 0; text-align: center; } .hierar-.-sitter_search .sec-.-sitter_search ._list li:nth-of-type(3n){ margin-right: 0; } .hierar-.-sitter_search .sec-.-sitter_search ._list .sitter_empty { margin-bottom:10em; } @media (max-width: 480px) { .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap { margin: 0 0 1em; padding: 0.5em 0; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap .br_sp { display: inline; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap input[type="date"], .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap select { padding: 0.25em; font-size: 14px; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap input[type="date"] { width: 250px; margin-bottom: 0.5em; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap select { width: 8em; } .hierar-.-sitter_search .sec-.-sitter_search .searchform_wrap button { margin-top: 0.5em; } .hierar-.-sitter_search .sec-.-sitter_search ._list li, .hierar-.-sitter_search .sec-.-sitter_search ._list li:nth-of-type(3n) { flex-basis: calc(50% - 0.5em); margin: 0 1em 2em 0; } .hierar-.-sitter_search .sec-.-sitter_search ._list li:nth-of-type(2n) { margin-right: 0; } .hierar-.-sitter_search .sec-.-sitter_search ._list .sitter_empty { margin-bottom:2em; } } /* sitter ----------------------------------------------- */ .hierar-.-sitter .sec-.-sitter > .inner-.-sec > ._heading { display: none; } .hierar-.-sitter .sec-.-profile { color: #666; } .hierar-.-sitter .sec-.-profile > .inner-.-sec > ._heading { display: none; } .hierar-.-sitter .sec-.-profile ._summary ._message p { font-weight: bold; } .hierar-.-sitter .sec-.-profile ._registration { background-color: #f28181; color: #fff; padding: 1em; } .hierar-.-sitter .sec-.-profile ._sittervideo { padding: 0; } .hierar-.-sitter .sec-.-profile ._registration > ._heading { font-weight: bold; margin-bottom: 0.5em; } .hierar-.-sitter .sec-.-profile ._registration ._list { margin-bottom: 0.5em; } .hierar-.-sitter .sec-.-profile ._registration ._list > ul > li { font-weight: bold; } .hierar-.-sitter .sec-.-profile ._registration ._list > ul > li::before { content: "・"; } .hierar-.-sitter .sec-.-profile ._registration ._list > ul > li:not(:last-child) { margin-bottom: 0.5em; } .hierar-.-sitter .sec-.-profile ._registration ._link a { background-color: #fff; box-shadow: 2px 2px 2px #999; color: #f28181; display: block; font-weight: bold; text-align: center; text-decoration: none; } .hierar-.-sitter .sec-.-profile ._offer_links > ul > li:not(:last-child) { margin-bottom: 1em; } .hierar-.-sitter .sec-.-profile ._offer_links a { width: 100%; } .hierar-.-sitter .sec-.-profile ._fees { border: 1px solid #999; border-radius: 0.5em; color: #666; padding: 0.75em 0.5em; } .hierar-.-sitter .sec-.-profile ._fees > ._heading { margin-bottom: 0.5em; text-align: center; } .hierar-.-sitter .sec-.-profile ._fees ._definitions > dl { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto; width: 208px; } .hierar-.-sitter .sec-.-profile ._fees ._definitions > dl > dd { font-weight: bold; margin-left: 1em; flex: 1 0 85px; } .hierar-.-sitter .sec-.-profile ._details ._profile { background-color: #6cc; color: #fff; padding: 1em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._individual { background-color: #fff; color: #666; margin-bottom: 1.5em; padding: 1em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._individual ._definitions > dl { display: flex; flex-wrap: wrap; } .hierar-.-sitter .sec-.-profile ._details ._profile ._individual ._definitions > dl > dt { width: 6em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._individual ._definitions > dl > dd { margin-left: 1em; width: calc( 100% - 7em ); } .hierar-.-sitter .sec-.-profile ._details ._profile ._individual ._definitions ._rating, .hierar-.-sitter .sec-.-profile ._details ._profile ._individual ._definitions ._rating + dd { color: #f28181; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info.-basic { border-bottom: 1px dashed #fff; margin-bottom: 1.5em; padding-bottom: 1.5em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info > ._heading { margin-bottom: 1em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info > ._heading::before { content: "・"; } .hierar-.-sitter .sec-.-profile ._details ._info > ._heading::before { content: "・"; } .hierar-.-sitter .sec-.-profile ._details ._info.-options ._required ._list > ul > li { float: left; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info.-options ._definitions { margin-bottom: 1.5em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info ._definitions > dl { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info ._definitions > dl > dt { width: 8em; } .hierar-.-sitter .sec-.-profile ._details ._profile ._info ._definitions > dl > dd { width: calc( 100% - 10em ); } .hierar-.-sitter .sec-.-profile ._schedule { border: 1px solid #999; border-radius: 0.5rem; font-size: 12px; padding: 1em; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item.-sunday ._day_of_the_week { color: #e51c2d; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item.-saturday ._day_of_the_week { color: #00a0df; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item ul{ flex:1 0 auto; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li { display:flex; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li a{ display:flex; flex:0 0 100%; color:#666; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li ._time, .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li ._request{ flex:0 0 50%; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li ._request{ text-align:right; padding-right:1em; } .hierar-.-sitter .sec-.-profile ._schedule ._list ._item li ._request span{ color: #f28181; font-size: 10px; } .hierar-.-sitter .sec-.-profile ._schedule.-regular > ._heading { margin-bottom: 0.5em; text-align: center; } .hierar-.-sitter .sec-.-profile ._schedule.-regular > ._heading { text-align: center; } .hierar-.-sitter .sec-.-profile ._schedule.-regular ._list > ul { display: flex; justify-content: space-around; } .hierar-.-sitter .sec-.-profile ._schedule.-regular ._list ._item { display: flex; flex-direction: column-reverse; font-size: 14px; font-weight: bold; align-items: center; } .hierar-.-sitter .sec-.-profile ._schedule.-regular ._list ._item ._possible{ padding: 3px; } .hierar-.-sitter .sec-.-profile ._schedule.-regular ._list ._item ._possible.OK{ border-radius: 3px; background: #f27070; color: #fff; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly > ._heading { margin-bottom: 0.5em; text-align: center; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._month { display: flex; justify-content: space-around; margin-bottom: 0.5em; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._month a { color: #666; text-decoration: none; cursor: pointer; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._month ._prev a::before { content:"\f0d9"; font-family:FontAwesome; margin-right:5px; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._month ._next a::after { content:"\f0da"; font-family:FontAwesome; margin-left:5px; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list ._item { display: flex; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list ._item ._day, .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list ._item ._day_of_the_week, .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list ._item ._possible { text-align: center; width: 2em; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list > ul { border-top: 1px solid #ccc; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list > ul > li { border-bottom: 1px solid #ccc; padding: 0.25em 0; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly ._list ._item ._time { text-align: center; width: auto; min-width: 9em; } .hierar-.-sitter .sec-.-review { background-color: #fc6; color: #666; padding: 1em 0; } .hierar-.-sitter .sec-.-review > .inner-.-sec { background-color: #fff; padding-top: 1em; padding-bottom: 1em; } .hierar-.-sitter .sec-.-review > .inner-.-sec > ._heading { color: #c90; margin-bottom: 0.5em; } .hierar-.-sitter .sec-.-review ._list > ul { border-top: 1px solid #fc6; } .hierar-.-sitter .sec-.-review ._list > ul > li { border-bottom: 1px solid #fc6; padding: 0.75em 0; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._rating { color: #c90; font-weight: bold; } @media (max-width: 480px) { .hierar-.-sitter .sec-.-profile .inner-.-sec .inner-.-sec-contents > ._sittervideo { position: relative; padding-top: 56.25%; } .hierar-.-sitter .sec-.-profile .inner-.-sec .inner-.-sec-contents > ._sittervideo iframe { position: absolute; top: 0; left: 0; width: 100%!important; height: 100%!important; } .hierar-.-sitter .sec-.-profile .inner-.-sec .inner-.-sec-contents > div { margin-bottom: 1.5em; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul > li:first-child { margin-bottom: 1em; width: 100%; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul > li:first-child ~ li { width: 30%; } .hierar-.-sitter .sec-.-profile ._summary ._message p { font-size: 16px; } .hierar-.-sitter .sec-.-profile ._registration ._link a { font-size: 16px; padding: 0.5em 0; } .hierar-.-sitter .sec-.-profile ._details ._info.-options ._required { font-size: 10px; } .hierar-.-sitter .sec-.-profile ._details > div { margin-bottom: 1.5em; } .hierar-.-sitter .sec-.-profile ._details ._individual ._definitions ._rating, .hierar-.-sitter .sec-.-profile ._details ._individual ._definitions ._rating+dd, .hierar-.-sitter .sec-.-profile ._details ._individual ._name { font-size: 16px; } .hierar-.-sitter .sec-.-review ._list ._item ._profile { overflow: hidden; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._name { float: left; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._rating { float: left; font-size: 12px; margin-top: 2px; margin-left: 1em; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._date { float: right; font-size: 12px; margin-top: 2px; } } @media (min-width: 481px) { .hierar-.-sitter .sec-.-profile > .inner-.-sec > .inner-.-sec-contents { position: relative; } .hierar-.-sitter .sec-.-profile > .inner-.-sec > .inner-.-sec-contents::after { clear: both; content: ""; display: block; } .hierar-.-sitter .sec-.-profile ._summary ._images { margin-bottom: 0.75em; width: 768px; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul { overflow: hidden; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul > li:first-child { float: left; width: 576px; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul > li:first-child ~ li { float: right; width: 176px; } .hierar-.-sitter .sec-.-profile ._summary ._images > ul > li:first-child ~ li:not(:last-child) { margin-bottom: 1em; } .hierar-.-sitter .sec-.-profile ._summary ._message { margin-bottom: 0.25em; } .hierar-.-sitter .sec-.-profile ._summary ._message p { font-size: 20px; } .hierar-.-sitter .sec-.-profile ._registration { position: absolute; top: 0; right: 0; width: 336px; } .hierar-.-sitter .sec-.-profile ._registration ._link a { font-size: 20px; padding: 0.5rem 0; } .hierar-.-sitter .sec-.-profile ._offer_links { position: absolute; top: 0; right: 0; width: 336px; } .hierar-.-sitter .sec-.-profile ._fees { position: absolute; top: 256px; right: 0; width: 336px; } .hierar-.-sitter .sec-.-profile ._fees ._definitions > dl > dd time { font-size: 12px; } .hierar-.-sitter .sec-.-profile ._details ._individual ._definitions ._rating, .hierar-.-sitter .sec-.-profile ._details ._individual ._definitions ._rating+dd, .hierar-.-sitter .sec-.-profile ._details ._individual ._name { font-size: 20px; } .hierar-.-sitter .sec-.-profile ._details ._info.-options ._required { font-size: 12px; padding: 0 1rem; position: absolute; bottom: 1rem; left: 0; width: 100%; } .hierar-.-sitter .sec-.-profile ._text { float: left; margin-left: 1em; width: 352px; } .hierar-.-sitter .sec-.-profile ._details { float: left; width: 768px; } .hierar-.-sitter .sec-.-profile ._details > div { margin-bottom: 1em; } .hierar-.-sitter .sec-.-profile ._details ._profile { float: left; width: 400px; } .hierar-.-sitter .sec-.-profile ._details ._text { float: right; width: 352px; } .hierar-.-sitter .sec-.-profile ._details ._movie { float: right; height: 224px; width: 352px; } .hierar-.-sitter .sec-.-profile ._details ._movie iframe { height: 100%; width: 100%; } .hierar-.-sitter .sec-.-profile ._details ._notes { clear: both; } .hierar-.-sitter .sec-.-profile ._schedule.-monthly { float: right; margin-bottom: 1rem; width: 336px; min-height: 775px; } .hierar-.-sitter .sec-.-profile ._schedule.-regular { clear: right; float: right; margin-bottom: 1rem; width: 336px; } .hierar-.-sitter .sec-.-review ._list ._item { display: flex; } .hierar-.-sitter .sec-.-review ._list ._item ._profile { flex-shrink: 0; margin-right: 3em; overflow: hidden; width: 9em; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._rating { float: right; font-size: 14px; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._date { float: right; font-size: 14px; } .hierar-.-sitter .sec-.-review ._list ._item ._profile ._name { float: left; } } /* sitter requestform ----------------------------------------------- */ .hierar-.-requestform .contactform, .hierar-.-requestcheck .contactform, .hierar-.-request_reply .contactform{ background:#fff; margin:0 auto; box-shadow:none; } .hierar-.-requestform .formwrap2 select{ font-family:initial; } .hierar-.-requestform .formwrap2 { padding: 20px; } .hierar-.-requestform .formwrap2 dl { display: flex; flex-wrap: wrap; text-align: left; } .hierar-.-requestform .formwrap2 dd, .hierar-.-requestform .formwrap2 dt { margin-bottom: 20px; } .hierar-.-requestform .formwrap2 dt { flex: 0 0 25%; } .hierar-.-requestform .formwrap2 dd { flex: 0 0 75%; } .hierar-.-requestform .formwrap2 dd label{ padding:0.5em; } .hierar-.-requestform .formwrap2 dd textarea { width: 100%; height: 15em; resize: vertical; } .formwrap .btnwrap, .hierar-.-requestform .formwrap2 .btnwrap { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-requestform .formwrap2 dl dl dt{ flex:0 0 40%; } .hierar-.-requestform .formwrap2 dl dl dd{ flex:0 0 60%; } .hierar-.-requestform .mt1em{ margin-top:1em; } .hierar-.-requestform .mb1em{ margin-bottom:1em; } .hierar-.-requestform .kidsnametweak, .hierar-.-requestcheck .kidsnametweak, .hierar-.-request_reply .kidsnametweak{ display:inline-block; width:11em; } .hierar-.-requestform dt.subtotal, .hierar-.-requestform dd.subtotal{ padding-top: 1em; border-top: solid 1px #666; } .hierar-.-requestform .caption, .hierar-.-requestcheck .caption, .hierar-.-request_reply .caption{ color:#666; font-size:14px; } .hierar-.-requestform .formwrap2 dl dl dt.w100{ margin-bottom:0; } .hierar-.-requestform .formwrap2 dl dl dt.w100, .hierar-.-requestform .formwrap2 dl dl dd.w100{ flex:0 0 100%; } .hierar-.-requestform .formwrap2 dl dl dd{ text-align:right; } .hierar-.-requestform .formwrap2 .estimate_calc > span{ display: inline-block; } .hierar-.-requestform .formwrap2 .estimate_calc > span:nth-of-type(1){ width: 4em; padding-right: 0.5em; } .hierar-.-requestform .formwrap2 .estimate_calc > span:nth-of-type(2){ width: 6em; padding-right: 0.5em; } .hierar-.-requestform .formwrap2 .estimate_calc > span:nth-of-type(3){ width: 5em; } @media (min-width: 481px) { .hierar-.-requestform .sp_br, .hierar-.-request_reply .sp_br{ display:none; } .hierar-.-requestform dd.subtotal{ padding-top: 1em; border-top: solid 1px #666; } .hierar-.-requestform .sum, .hierar-.-requestcheck .sum, .hierar-.-request_reply .sum{ color:#00984b; font-size:20px; } } @media (max-width: 480px) { .hierar-.-requestform .sp_br, .hierar-.-request_reply .sp_br{ display:inline; } .hierar-.-requestform .btn_showdetail{ display: block; margin: 0 auto; text-align:center; } .hierar-.-requestform .formwrap2 { padding: 0; } .hierar-.-requestform .formwrap2 dd, .hierar-.-requestform .formwrap2 dt { flex-shrink: 0; flex-grow: 0; } .hierar-.-requestform .formwrap2 dt{ flex-basis:100%; font-weight:bold; } .hierar-.-requestform .formwrap2 dd{ flex-basis:calc(100% - 1em); } .hierar-.-requestform .formwrap2 dd textarea{ width:100%; } .hierar-.-requestform .formwrap2 dl dl dt{ flex:0 0 60%; } .hierar-.-requestform .formwrap2 dl dl dd{ flex:0 0 40%; } .hierar-.-requestform .kidsnametweak, .hierar-.-requestcheck .kidsnametweak{ width:9em; } .hierar-.-requestform .sum, .hierar-.-requestcheck .sum, .hierar-.-request_reply .sum{ color:#00984b; font-size:16px; } } /* sitter requestcheck, request_reply ----------------------------------------------- */ .hierar-.-requestcheck .formwrap, .hierar-.-request_reply .formwrap{ max-width: 500px; } .hierar-.-requestcheck .formwrap > dl, .hierar-.-request_reply .formwrap > dl{ display:flex; flex-wrap:wrap; } .hierar-.-requestcheck .formwrap > dl > dt, .hierar-.-request_reply .formwrap > dl > dt{ flex:0 0 35%; } .hierar-.-requestcheck .formwrap > dl > dd, .hierar-.-request_reply .formwrap > dl > dd{ flex:0 0 65%; } .hierar-.-requestcheck .formwrap > dl > dd.w100, .hierar-.-request_reply .formwrap > dl > dd.w100{ flex:0 0 100%; } .hierar-.-requestcheck .formwrap > dl > dt.w100, .hierar-.-request_reply .formwrap > dl > dt.w100{ flex:0 0 100%; border-bottom:none; } .hierar-.-request_reply .mt1em{ margin-top:1em; } .hierar-.-requestcheck .estimate, .hierar-.-requestcheck .estimate_calc, .hierar-.-request_reply .estimate, .hierar-.-request_reply .estimate_calc{ display:flex; flex-wrap: wrap; justify-content:space-between; } .hierar-.-requestcheck .estimate_calc > span:last-of-type > span, .hierar-.-request_reply .estimate_calc > span:last-of-type > span{ display: inline-block; text-align: right; } .hierar-.-requestcheck .estimate_calc > span:last-of-type > span:nth-of-type(1), .hierar-.-request_reply .estimate_calc > span:last-of-type > span:nth-of-type(1){ width: 4em; padding-right: 0.5em; } .hierar-.-requestcheck .estimate_calc > span:last-of-type > span:nth-of-type(2), .hierar-.-request_reply .estimate_calc > span:last-of-type > span:nth-of-type(2){ width: 6em; padding-right: 0.5em; } .hierar-.-requestcheck .estimate_calc > span:last-of-type > span:nth-of-type(3), .hierar-.-request_reply .estimate_calc > span:last-of-type > span:nth-of-type(3){ width: 5em; } .hierar-.-requestcheck .formwrap .btnwrap, .hierar-.-request_reply .formwrap .btnwrap { display: flex; flex-wrap: wrap; justify-content: space-between; } .hierar-.-request_reply .formwrap input{ margin-top: 0px; padding: 5px; line-height: 1em; text-align: right; font-size:16px; border-radius:0; border:solid 1px #bdbdbd; box-shadow:none; } .hierar-.-request_reply .formwrap textarea{ margin-top: 0px; padding: 5px; line-height: 1em; font-size:16px; border-radius:0; border:solid 1px #bdbdbd; box-shadow:none; } .hierar-.-request_reply .formwrap input[type=radio]{ width:auto; } @media (max-width: 480px) { .hierar-.-requestcheck .estimate_calc span:last-of-type, .hierar-.-request_reply .estimate_calc span:last-of-type{ flex: 0 0 100%; text-align: right; } } /* news ----------------------------------------------- */ /* news_list ----------------------------------------------- */ /* member ----------------------------------------------- */ .hierar-.-member { color: #666; } .hierar-.-member .sec-.-member > .inner-.-sec > ._heading { display: none; } .hierar-.-member .sec-.-member_profile ~ .sec-.-lv-2 > .inner-.-sec > ._heading { background-color: #999; color: #fff; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._image figcaption { font-weight: bold; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dt { font-weight: bold; } .hierar-.-member .sec-.-member_profile .inner-.-sec > ._heading { background-color: #6cc; color: #fff; } .hierar-.-member .sec-.-member_profile ._links { text-align: center; } .hierar-.-member .sec-.-member_children ._list > ul > li { counter-increment: count; } .hierar-.-member .sec-.-member_children ._list > ul > li::before { content: counter(count) "人目"; } @media (max-width: 480px) { .hierar-.-member .sec-.-lv-2 { margin-bottom: 1.5em; } .hierar-.-member .sec-.-lv-2 > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-member .sec-.-lv-2 .inner-.-sec > ._heading { margin-bottom: 0.5em; padding: 0.5em; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions { margin-bottom: 0.5em; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dd:not(:last-of-type) { margin-bottom: 0.5em; } .hierar-.-member .sec-.-member_profile ._image { width:304px; height:456px; margin-bottom: 0.5em; text-align:center; } .hierar-.-member .sec-.-member_profile ._image img{ max-height:100%; } .hierar-.-member .sec-.-member_profile ._text { margin-bottom: 0.5em; } .hierar-.-member .sec-.-member_children ._list > ul > li:not(:first-child) { border-top: 4px solid #ccc; padding-top: 1em; } .hierar-.-member .sec-.-member_children ._list > ul > li:not(:last-child) { margin-bottom: 1em; } } @media (min-width: 481px) { .hierar-.-member .sec-.-lv-2 { margin-bottom: 2.5em; } .hierar-.-member .sec-.-lv-2 > .inner-.-sec > ._heading { font-size: 16px; margin-bottom: 1em; } .hierar-.-member .sec-.-member_profile ~ .sec-.-lv-2 > .inner-.-sec > ._heading { padding: 0.75em 2em; } .hierar-.-member .sec-.-member_profile ~ .sec-.-lv-2 > .inner-.-sec > .inner-.-sec-contents { padding-left: 160px; padding-right: 64px; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._image figcaption { margin-bottom: 0.75em; text-align: center; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._image { text-align:center; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._image img { max-height:100%; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl::after { clear: both; content: ""; display: block; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dt { clear: left; float: left; margin-right: 5em; width: 10em; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dt:not(:last-of-type) { margin-bottom: 2.5em; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dd { float: left; width: calc( 100% - 15em ); } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions > dl > dd:not(:last-of-type) { margin-bottom: 2.5em; } .hierar-.-member .sec-.-member .sec-.-lv-2 ._definitions + ._image { border-left: 4px solid #ccc; flex-shrink: 0; margin-left: 3em; padding: 0.5em 0 2em; padding-left: 4em; } .hierar-.-member .sec-.-member_profile { margin-top: 1em; } .hierar-.-member .sec-.-member_profile .inner-.-sec > ._heading { padding: 1em 2em 0.5em; padding-left: calc( 3em + 192px ); } .hierar-.-member .sec-.-member_profile .inner-.-sec > .inner-.-sec-contents { padding: 0 1em; } .hierar-.-member .sec-.-member_profile .inner-.-sec > .inner-.-sec-contents::after { clear: both; content: ""; display: block; } .hierar-.-member .sec-.-member_profile ._image { float: left; width:192px; height:288px; margin-top: -3em; } .hierar-.-member .sec-.-member_profile ._text { float: right; margin-bottom: 2em; width: calc( 100% - 14em ); } .hierar-.-member .sec-.-member_profile ._links { float: right; width: calc( 100% - 14em ); } .hierar-.-member .sec-.-member_profile ._links ._message a { width: 336px; } .hierar-.-member .sec-.-member_children ._list > ul > li { position: relative; } .hierar-.-member .sec-.-member_children ._list > ul > li:not(:last-child) { margin-bottom: 1.5em; } .hierar-.-member .sec-.-member_children ._list > ul > li::before { position: absolute; top: 0; left: -8em; } .hierar-.-member .sec-.-member_children ._list ._item { display: flex; justify-content: space-between; } .hierar-.-member .sec-.-member_support_place .inner-.-sec > .inner-.-sec-contents { display: flex; justify-content: space-between; } } /* member_login ----------------------------------------------- */ .hierar-.-member_login .sec-.-member_login { background: url("../img/home/bg_logo_gray.png") 50% -2em; } .hierar-.-member_login .sec-.-member_login > .inner-.-sec > ._heading { display: none; } .hierar-.-member_login .sec-.-member_login button[name="submit"] { background-color: #7dc7ae; color: #fff; } @media (max-width: 480px) { .hierar-.-member_login .sec-.-member_login { background-size: 160px 112px; padding: 2em 0 2em; } .hierar-.-member_login .sec-.-member_login button[name="submit"] { width: 128px; } } @media (min-width: 481px) { .hierar-.-member_login .sec-.-member_login { background-size: 320px 224px; padding: 4em 0 8em; } .hierar-.-member_login .sec-.-member_login button[name="submit"] { width: 176px; } } /* sitter_login ----------------------------------------------- */ .hierar-.-sitter_login .sec-.-sitter_login { background: url("../img/home/bg_logo_gray.png") 50% -2em; } .hierar-.-sitter_login .sec-.-sitter_login > .inner-.-sec > ._heading { display: none; } .hierar-.-sitter_login .sec-.-sitter_login button[name="submit"] { background-color: #ef9191; color: #fff; } @media (max-width: 480px) { .hierar-.-sitter_login .sec-.-sitter_login { background-size: 160px 112px; padding: 2em 0 2em; } .hierar-.-sitter_login .sec-.-sitter_login button[name="submit"] { width: 128px; } } @media (min-width: 481px) { .hierar-.-sitter_login .sec-.-sitter_login { background-size: 320px 224px; padding: 4em 0 8em; } .hierar-.-sitter_login .sec-.-sitter_login button[name="submit"] { width: 176px; } } /* mypage ----------------------------------------------- */ .hierar-.-mypage .sec-.-mypage > .inner-.-sec > ._heading { display: none; } .hierar-.-mypage .sec-.-news > .inner-.-sec > ._heading { color: #dd616f; margin-bottom: 1em; } .hierar-.-mypage .sec-.-news ._list > ul { border-top: 1px solid #dd616f; } .hierar-.-mypage .sec-.-news ._list > ul > li { border-bottom: 1px solid #dd616f; padding: 0.5em 0; } .hierar-.-mypage .sec-.-news ._list ._item ._new { color: #dd616f; } .hierar-.-mypage .sec-.-news ._list ._item ._category > p { background-color: #f99; color: #fff; display: inline-block; padding: 0.25em 0.5em; } @media (max-width: 480px) { .hierar-.-mypage .sec-.-news > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-mypage .sec-.-news ._list ._item ._category > p { font-size: 12px; } } @media (min-width: 481px) { .hierar-.-mypage .sec-.-news > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-mypage .sec-.-news ._list ._item ._category > p { font-size: 14px; } .hierar-.-mypage .sec-.-news ._list ._item { display: flex; } .hierar-.-mypage .sec-.-news ._list ._item ._category { width: 9em; } .hierar-.-mypage .sec-.-news ._list ._item ._post_info { width: calc( 100% - 9em ); } } /* schedule ----------------------------------------------- */ .hierar-.-schedule .sec-.-schedule { color: #666; } .hierar-.-schedule .sec-.-schedule > .inner-.-sec > ._heading { display: none; } .hierar-.-schedule .sec-.-lv-2 { margin-bottom: 1em; } .hierar-.-schedule .sec-.-lv-2 > .inner-.-sec > ._heading { margin-bottom: 0.25em; text-align: center; } .hierar-.-schedule .sec-.-schedule_single { background-color: #ffe; } .hierar-.-schedule .sec-.-schedule_single_month { background-color: #fff; border: 1px solid #ccc; border-radius: 0.5em; margin-bottom: 1em; } .hierar-.-schedule .sec-.-schedule_single_month > .inner-.-sec > ._heading { font-weight: normal; margin-bottom: 0.5em; text-align: center; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month > ._heading { font-weight: bold; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table { background-color: #ffe; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._header { background-color: #999; color: #ff6; padding: 0.25em 0; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._header p { text-align: center; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list > ul > li { border-bottom: 1px solid #ccc; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list ._item { display: flex; align-items: center; justify-content: space-around; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list ._item ._day_of_the_week { text-align: center; width: 2em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list ._item.-saturday ._day_of_the_week { color: #00a0df; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list ._item.-sunday ._day_of_the_week { color: #e51c2d; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit button { border: 0; border-radius: 0.25em; box-shadow: 2px 2px 2px #999; color: #fff; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit ._registration { background-color: #f28181; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit ._delete { background-color: #00a0df; } .hierar-.-schedule .sec-.-schedule_single_day > .inner-.-sec > ._heading { display: none; } .hierar-.-schedule .sec-.-schedule_regular { background-color: #fee; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week { background-color: #fff; border: 1px solid #ccc; border-radius: 0.5em; margin-bottom: 1em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week > .inner-.-sec > ._heading { display: none; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._header { background-color: #999; color: #fff; padding: 0.25em 0; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._header ._h_input { color: #fcc; text-align: center; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._list ._item.-saturday ._day_of_the_week { color: #00a0df; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._list ._item.-sunday ._day_of_the_week { color: #e51c2d; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._display { padding-top: 0.5em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._display ._list > ul { display: flex; justify-content: space-around; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._display ._list ._item { display: flex; flex-direction: column-reverse; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._input { background-color: #fee; padding-top: 0.75em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._input ._list > ul { display: flex; justify-content: space-around; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._input ._list ._item label { display: flex; flex-direction: column-reverse; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._input ._list ._item ._day_of_the_week { margin-top: 0.5em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit button { border: 0; border-radius: 0.25em; box-shadow: 2px 2px 2px #999; color: #fff; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit ._registration { background-color: #f28181; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit ._delete { background-color: #00a0df; } @media (max-width: 480px) { .hierar-.-schedule .sec-.-schedule_single > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-schedule .sec-.-schedule_single_month { padding: 1em 0.5em 0.5em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month { display: flex; align-items: center; justify-content: center; margin-bottom: 0.5em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month input[type="text"]{ display:none; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month input[type="month"]{ display:inline; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month select { margin-left: 0.5em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table { margin-bottom: 1em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list > ul > li { padding: 0.5em 0; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit { margin-bottom: 0.5em; text-align: center; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit button { margin-bottom: 0.75em; padding: 0.25em 0; width: 224px; } .hierar-.-schedule .sec-.-schedule_single_month ._text p { font-size: 12px; } .hierar-.-schedule .sec-.-schedule_regular > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week { padding: 1em 0.5em 0.5em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table { position: relative; padding-bottom: 7em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._header ._h_display { display: none; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit { position: absolute; bottom: 0; text-align: center; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit button { margin-bottom: 0.75em; padding: 0.25em 0; width: 224px; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form .fontctrl{ font-size:16px; transform:scale(0.9); } } @media (min-width: 481px) { .hierar-.-schedule .st-.-main { margin: 0 auto; width: 816px; } .hierar-.-schedule .sec-.-schedule_single > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-schedule .sec-.-lv-2 { padding: 0.75em 1em; } .hierar-.-schedule .sec-.-schedule_single_month { padding: 1em; } .hierar-.-schedule .sec-.-schedule_single_month ._form { margin-bottom: 1em; overflow: hidden; position: relative; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month { position: absolute; top: 4em; left: 7.5em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month > ._heading { margin-bottom: 0.5em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month input[type="text"]{ display:inline; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._year_month input[type="month"]{ display:none; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table { float: right; width: 368px; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._table ._list > ul > li { padding: 0.25em 0; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit { position: absolute; bottom: 0; left: 3em; } .hierar-.-schedule .sec-.-schedule_single_month ._form ._submit button { display: block; font-weight: bold; margin-bottom: 0.75em; padding: 0.75em 0; text-align: center; width: 256px; } .hierar-.-schedule .sec-.-schedule_single_month ._text p { font-size: 14px; } .hierar-.-schedule .sec-.-schedule_regular > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week { padding: 1em; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table { display: flex; flex-wrap: wrap; padding-bottom: 4em; position: relative; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._header { display: flex; width: 100%; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._header p { text-align: center; width: 50%; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._display { width: 50%; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._schedule_table ._input { background-color: #fee; padding-bottom: 0.5em; width: 50%; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit { display: flex; justify-content: center; position: absolute; bottom: -1em; left: 0; width: 100%; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit button { display: block; font-weight: bold; margin-bottom: 0.75em; padding: 0.75em 0; text-align: center; width: 256px; } .hierar-.-schedule .sec-.-schedule_regular_day_of_the_week ._form ._submit button:not(:last-child) { margin-right: 1em; } } /* message ----------------------------------------------- */ .hierar-.-message { color: #666; } .hierar-.-message .st-.-main { background-color: #ffe; } .hierar-.-message .sec-.-lv-2 { margin-bottom: 2em; } .hierar-.-message .sec-.-message > .inner-.-sec > ._heading { display: none; } .hierar-.-message .sec-.-message_input > .inner-.-sec > ._heading { border-bottom: 1px solid #dd616f; color: #dd616f; margin-bottom: 1em; padding: 0.25em 0; } .hierar-.-message .sec-.-message_input ._form ._input { margin-bottom: 1em; } .hierar-.-message .sec-.-message_input ._form ._input textarea { box-sizing: border-box; width: 100%; } .hierar-.-message .sec-.-message_input ._form ._submit { text-align: center; margin-bottom: 0.75em; } .hierar-.-message .sec-.-message_input ._form ._submit input[type="submit"] { width: 256px; } .hierar-.-message .sec-.-message_history > .inner-.-sec > ._heading { color: #232288; } .hierar-.-message .sec-.-message_history ._list { background-color: #fff; } .hierar-.-message .sec-.-message_history ._list > ul > li:not(:last-child) { margin-bottom: 1em; } .hierar-.-message .sec-.-message_history ._list ._item ._header { background-color: #aaa; color: #fff; display: flex; justify-content: space-between; width: 100%; } .hierar-.-message .sec-.-message_history ._list ._item ._contents { background-color: #fff; padding: 0.25em 0.5em; } @media (max-width:480px) { .hierar-.-message .st-.-main { padding: 1em 0; } .hierar-.-message .sec-.-message_input > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-message .sec-.-message_history > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-message .sec-.-message_history ._list ._item ._header { padding: 0.25em 0.5em; } .hierar-.-message .sec-.-message_history ._list ._item ._contents { padding: 0.25em 0.5em; } .hierar-.-message .sec-.-message_history ._list ._item ._contents ._text p { font-size: 12px; } } @media (min-width: 481px) { .hierar-.-message .sec-.-message_input > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-message .sec-.-message_history > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-message .sec-.-message_history ._list ._item ._header { padding: 0.5em 1em; } .hierar-.-message .sec-.-message_history ._list ._item ._contents { padding: 1em; } .hierar-.-message .sec-.-message_history ._list ._item ._contents ._text p { font-size: 14px; } } /* message_list ----------------------------------------------- */ .hierar-.-message_list .sec-.-message_list > .inner-.-sec > ._heading { display: none; } .hierar-.-message_list .sec-.-message_user_list > .inner-.-sec > ._heading { color: #232288; margin-bottom: 1.5em; } .hierar-.-message_list .sec-.-message_user_list ._list > ul { border-top: 1px solid #232288; } .hierar-.-message_list .sec-.-message_user_list ._list > ul > li { border-bottom: 1px solid #232288; padding: 0.75em 0; } .hierar-.-message_list .sec-.-message_user_list ._list > ul > li > a { color: #666; text-decoration: none; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._link { text-align: right; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._text p { height: 3em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._link::after { content: "＞＞＞"; margin-left: 1em; } @media (max-width: 480px) { .hierar-.-message_list .sec-.-message_user_list > .inner-.-sec > ._heading { font-size: 14px; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._header { display: flex; justify-content: space-between; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._link { font-size: 10px; } } @media (min-width: 481px) { .hierar-.-message_list .sec-.-message_user_list > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-message_list .sec-.-message_user_list ._list ._item { display: flex; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._header { display: flex; width: calc( 100% - 480px ); } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._header ._date { width: 7em; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents { width: 480px; } .hierar-.-message_list .sec-.-message_user_list ._list ._item ._contents ._link { font-size: 12px; } } /* profile_edit(update_user,update_kids,update_emergency) ----------------------------------------------- */ .hierar-.-update_user .sec-.-update_user > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter > .inner-.-sec > ._heading { color: #E0616F; margin-bottom: 0.5em; text-align: center; } .hierar-.-update_user .sec-.-update_user_input > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids_input > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency_input > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter_input > .inner-.-sec > ._heading { margin-bottom: 1.5em; text-align: center; } .hierar-.-update_user .sec-.-update_user_input .mt2em, .hierar-.-update_kids .sec-.-update_kids_input .mt2em, .hierar-.-update_emergency .sec-.-update_emergency_input .mt2em, .hierar-.-update_sitter .sec-.-update_sitter_input .mt2em { margin-top:2em; } .hierar-.-update_user .sec-.-update_user_input .mb2em, .hierar-.-update_kids .sec-.-update_kids_input .mb2em, .hierar-.-update_emergency .sec-.-update_emergency_input .mb2em, .hierar-.-update_sitter .sec-.-update_sitter_input .mb2em { margin-bottom:2em; } .hierar-.-update_user .sec-.-update_user_input .msg, .hierar-.-update_kids .sec-.-update_kids_input .msg, .hierar-.-update_emergency .sec-.-update_emergency_input .msg, .hierar-.-update_sitter .sec-.-update_sitter_input .msg { color:red; } .hierar-.-update_user .sec-.-update_user_input dl, .hierar-.-update_kids .sec-.-update_kids_input dl, .hierar-.-update_emergency .sec-.-update_emergency_input dl, .hierar-.-update_sitter .sec-.-update_sitter_input dl { display:flex; flex-wrap:wrap; width:100%; } .hierar-.-update_user .sec-.-update_user_input dt, .hierar-.-update_kids .sec-.-update_kids_input dt, .hierar-.-update_emergency .sec-.-update_emergency_input dt, .hierar-.-update_sitter .sec-.-update_sitter_input dt { flex:0 0 19%; } .hierar-.-update_user .sec-.-update_user_input dl:nth-of-type(n+2), .hierar-.-update_kids .sec-.-update_kids_input dl:nth-of-type(n+2), .hierar-.-update_sitter .sec-.-update_sitter_input dl:nth-of-type(n+2) { margin-top:3em; } .hierar-.-update_user .sec-.-update_user_input dd, .hierar-.-update_kids .sec-.-update_kids_input dd, .hierar-.-update_emergency .sec-.-update_emergency_input dd, .hierar-.-update_sitter .sec-.-update_sitter_input dd { flex:1 0 81%; } .hierar-.-update_user .sec-.-update_user_input dt:nth-of-type(n+2), .hierar-.-update_user .sec-.-update_user_input dd:nth-of-type(n+2), .hierar-.-update_kids .sec-.-update_kids_input dt:nth-of-type(n+2), .hierar-.-update_kids .sec-.-update_kids_input dd:nth-of-type(n+2), .hierar-.-update_emergency .sec-.-update_emergency_input dt:nth-of-type(n+2), .hierar-.-update_emergency .sec-.-update_emergency_input dd:nth-of-type(n+2), .hierar-.-update_sitter .sec-.-update_sitter_input dt:nth-of-type(n+2), .hierar-.-update_sitter .sec-.-update_sitter_input dd:nth-of-type(n+2) { margin-top:2em; } .hierar-.-update_user .sec-.-update_user_input .caption, .hierar-.-update_kids .sec-.-update_kids_input .caption, .hierar-.-update_emergency .sec-.-update_emergency_input .caption, .hierar-.-update_sitter .sec-.-update_sitter_input .caption { color:#888; font-size:14px; } .hierar-.-update_user .sec-.-update_user_input .btn_submit, .hierar-.-update_kids .sec-.-update_kids_input .btn_submit, .hierar-.-update_emergency .sec-.-update_emergency_input .btn_submit, .hierar-.-update_sitter .sec-.-update_sitter_input .btn_submit { text-align:center; margin:4em 0; } .hierar-.-update_user .sec-.-update_user_input textarea, .hierar-.-update_kids .sec-.-update_kids_input textarea, .hierar-.-update_emergency .sec-.-update_emergency_input textarea, .hierar-.-update_sitter .sec-.-update_sitter_input textarea { width:100%; height:200px; resize: vertical; } @media (max-width: 480px) { .hierar-.-update_user .sec-.-update_user > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-update_user .sec-.-update_user_input > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids_input > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency_input > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter_input > .inner-.-sec > ._heading { font-size: 16px; } .hierar-.-update_user .sec-.-update_user_input dt, .hierar-.-update_kids .sec-.-update_kids_input dt, .hierar-.-update_emergency .sec-.-update_emergency_input dt, .hierar-.-update_sitter .sec-.-update_sitter_input dt { flex:0 0 100%; } .hierar-.-update_user .sec-.-update_user_input dd, .hierar-.-update_kids .sec-.-update_kids_input dd, .hierar-.-update_emergency .sec-.-update_emergency_input dd, .hierar-.-update_sitter .sec-.-update_sitter_input dd { flex:0 0 100%; } .hierar-.-update_user .sec-.-update_user_input dd:nth-of-type(n+2), .hierar-.-update_kids .sec-.-update_kids_input dd:nth-of-type(n+2), .hierar-.-update_emergency .sec-.-update_emergency_input dd:nth-of-type(n+2), .hierar-.-update_sitter .sec-.-update_sitter_input dd:nth-of-type(n+2) { margin-top:0; } .hierar-.-update_user .sec-.-update_user_input .btn_submit, .hierar-.-update_kids .sec-.-update_kids_input .btn_submit, .hierar-.-update_emergency .sec-.-update_emergency_input .btn_submit, .hierar-.-update_sitter .sec-.-update_sitter_input .btn_submit { margin:2em 0; } .hierar-.-update_kids .sec-.-update_kids_input button[name="submit_del"], .hierar-.-update_emergency .sec-.-update_emergency_input button[name="submit_del"] { margin-top:2em; } .hierar-.-update_user .sec-.-update_user_input input, .hierar-.-update_user .sec-.-update_user_input textarea, .hierar-.-update_user .sec-.-update_user_input select, .hierar-.-update_kids .sec-.-update_kids_input input, .hierar-.-update_kids .sec-.-update_kids_input textarea, .hierar-.-update_emergency .sec-.-update_emergency_input input, .hierar-.-update_sitter .sec-.-update_sitter_input input, .hierar-.-update_sitter .sec-.-update_sitter_input textarea{ border-radius:0; border:solid 1px #666; padding:5px; box-sizing:border-box; } } @media (min-width: 481px) { .hierar-.-update_user .sec-.-update_user > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-update_user .sec-.-update_user_input > .inner-.-sec > ._heading, .hierar-.-update_kids .sec-.-update_kids_input > .inner-.-sec > ._heading, .hierar-.-update_emergency .sec-.-update_emergency_input > .inner-.-sec > ._heading, .hierar-.-update_sitter .sec-.-update_sitter_input > .inner-.-sec > ._heading { font-size: 20px; } .hierar-.-update_kids .sec-.-update_kids_input button[name="submit_del"], .hierar-.-update_emergency .sec-.-update_emergency_input button[name="submit_del"] { margin-left:2em; } } /* update_user ----------------------------------------------- */ .hierar-.-update_user .sec-.-update_user_input dd li{ margin-bottom:1em; } .hierar-.-update_user .sec-.-update_user_input dd ul.station li{ display:flex; } .hierar-.-update_user .sec-.-update_user_input .edituserimg{ display:flex; flex-wrap:wrap; margin-top:2em; padding-top:2em; border-top:solid 1px #ddd; } .hierar-.-update_user .sec-.-update_user_input .edituserimg div div label{ display:none; } .hierar-.-update_user .sec-.-update_user_input .edituserimg > p{ flex:0 0 100%; margin-top:1em; } .hierar-.-update_user .sec-.-update_user_input .edituserimg > div input[type=file]{ width:100%; border:solid 1px #bbb; } .hierar-.-update_user .sec-.-update_user_input input[name="usersurname"], .hierar-.-update_user .sec-.-update_user_input input[name="userlastname"], .hierar-.-update_user .sec-.-update_user_input input[name="usersurnamekana"], .hierar-.-update_user .sec-.-update_user_input input[name="userlastnamekana"], .hierar-.-update_user .sec-.-update_user_input input[name="userbirthday"]{ background:#ddd; border:solid 1px #bbb; } .hierar-.-update_user .sec-.-update_user_input .btn_del{ background:rgb(218, 70, 70); border:none; border-radius:2px; box-shadow: 2px 2px 2px #999; } .hierar-.-update_user .sec-.-update_user_input .btn_del span{ color:#fff; font-weight:bold; } @media (max-width: 480px) { .hierar-.-update_user .sec-.-update_user_input dt{ flex:0 0 100%; } .hierar-.-update_user .sec-.-update_user_input dd{ flex:0 0 100%; } .hierar-.-update_user .sec-.-update_user_input dd:nth-of-type(n+2){ margin-top:0; } .hierar-.-update_user .sec-.-update_user_input dd ul.station li{ flex-direction:column; position:relative; width:90%; margin-bottom:1em; } .hierar-.-update_user .sec-.-update_user_input dd ul.station li button.btn_del{ position:absolute; top:0; right:-10%; width:10%; height:100%; } .hierar-.-update_user .sec-.-update_user_input dd ul.station li:last-of-type{ width:100%; } .hierar-.-update_user .sec-.-update_user_input .edituserimg{ flex-direction:column; } .hierar-.-update_user .sec-.-update_user_input .edituserimg > div{ flex:0 0 100%; } .hierar-.-update_user .sec-.-update_user_input .edituserimg > div:nth-of-type(n+2){ margin-top:2em; } } @media (min-width: 481px) { .hierar-.-update_user .sec-.-update_user_input .edituserimg{ justify-content:space-between; } .hierar-.-update_user .sec-.-update_user_input .edituserimg > div{ flex:0 1 30%; } } /* update_kids ----------------------------------------------- */ .hierar-.-update_kids .sec-.-update_kids_input .mt2emmb-2em{ margin-top:2em; margin-bottom:-2em; } /* update_emergency ----------------------------------------------- */ .hierar-.-update_emergency .sec-.-update_emergency_input dl { padding:1.5em 0; } @media (max-width: 480px) { .hierar-.-update_emergency .sec-.-update_emergency_input dt:nth-of-type(n+2) { margin-top:0.5em; } } /* update_sitter ----------------------------------------------- */ .hierar-.-update_sitter .sec-.-update_sitter_input input[name="sitterprheadline"], .hierar-.-update_sitter .sec-.-update_sitter_input input[name="sittersupportarea"] { width:100%; } .hierar-.-update_sitter .sec-.-update_sitter_input #option > div{ display:flex; } .hierar-.-update_sitter .sec-.-update_sitter_input #option > div:nth-of-type(n+2){ margin-top:2em; } .hierar-.-update_sitter .sec-.-update_sitter_input #option .option_category{ flex:0 0 128px; margin-right:1em; padding-left:1em; } .hierar-.-update_sitter .sec-.-update_sitter_input #option .option_item li{ display:inline-block; } .hierar-.-update_sitter .sec-.-update_sitter_input #option .option_item label{ display:inline-block; padding:0.5em; } .hierar-.-update_sitter .sec-.-update_sitter_input #option .option_item label input[type="checkbox"]{ display:inline-block; margin-right:0.5em; } .hierar-.-update_sitter .sec-.-update_sitter_input .price dl{ margin-top:2em; } .hierar-.-update_sitter .sec-.-update_sitter_input .sitterregularday{ display: flex; justify-content: space-between; max-width: 400px; } .hierar-.-update_sitter .sec-.-update_sitter_input .sitterregularday label{ display:flex; flex-direction:column-reverse; padding:0.75em; } .hierar-.-update_sitter .sec-.-update_sitter_input .sitterregularday label:first-of-type{ color:#e51c2d } .hierar-.-update_sitter .sec-.-update_sitter_input .sitterregularday label:last-of-type{ margin-left:0; color:#00a0df; } .hierar-.-update_sitter .sec-.-update_sitter_input .sitterregularday label span{ margin-bottom:0.5em; } @media (max-width: 480px) { .hierar-.-update_sitter .sec-.-update_sitter_input #option > div{ flex-direction:column; } .hierar-.-update_sitter .sec-.-update_sitter_input #option .option_category{ flex:0 0 auto; } .hierar-.-update_sitter .sec-.-update_sitter_input input[name="sitterprheadline"]{ width:100%; } .hierar-.-update_sitter .sec-.-update_sitter_input input[type="number"]{ width:50%; } .hierar-.-update_sitter .sec-.-update_sitter_input .price dl{ margin-top:1em; margin-left:1em; } .hierar-.-update_sitter .sec-.-update_sitter_input .price dt:nth-of-type(n+2){ margin-top:1em; } } /* end of file */