@charset "utf-8";

@media screen and (max-width : 767px ) {
/*============================================

	BASE

============================================*/
body {
	min-width: 100%;
	font-size: 14px;
	line-height: 1.8;
}
a {
	transition: none;
}
/*-------------------------------------

	HEADER

-------------------------------------*/
header .h_inner {
	padding-left: 5%;
}
header .h_left .logo_wrap {
	display: block;
}
header .logo_box img {
	height: 17px;
}
header .h_left .logo_box:nth-child(2) {
	margin-left: 0;
	margin-top: 2px;
}
.drawer-hamburger {
	width: 48px;
	height: 48px;
}
.drawer--right .drawer-hamburger {
	top: 10px;
	right: 10px;
}
.drawer-hamburger-icon, .drawer-hamburger-icon:before, .drawer-hamburger-icon:after {
	width: 30px;
}
.drawer--right .drawer-nav {
	width: 100%;
}
.drawer-hamburger:hover {
	background-color: #fff;
}
.drawer-menu li {
	width: 100%;
}
/*-------------------------------------

	FOOTER

-------------------------------------*/
footer .f_inner {
	display: block;
	padding: 20px 5%;
}
footer .f_top {
}
footer .f_logo {
	text-align: center;
}
	footer .f_logo:nth-child(1) {
		margin-right: 20px;
	}
	footer .f_nav {
		margin-top: 20px;
	}
footer .f_nav ul {
	margin-top: 0;
}
footer .f_nav ul li {
	width: 50%;
	text-align: center;
}
footer .f_nav_item {
	font-size: 13px;
	margin-right: 0;
	display: inline-block;
}
footer .copy {
	text-align: center;
	font-size: 10px;
	padding: 5px 0;
	line-height: 1.3;
	margin-top: 10px;
}
	footer .f_right .f_right_wrap {
		display: block;
	}
	footer .f_right .f_right_wrap .f_sns {
		display: flex;
		justify-content: center;
		margin-top: 10px;
	}
	footer .f_right .f_right_wrap .f_sns .item:nth-child(2) {
		margin: 0 0.5em;
	}
	footer .f_right .f_right_wrap .f_sns .item {
		margin: 0 0.5em;
	}
.totop {
	width: 40px;
	height: 40px;
	right: 10px;
}
.totop i {
	line-height: 40px;
}
/*============================================

	PAGE CSS  COMMON

============================================*/
.Inner {
	padding: 0 3%;
}
.container {
	padding: 50px 0;
}
.ttl_01 {
	margin-bottom: 25px;
	font-size: 22px;
	line-height: 1.3;
}
.ttl_01:before {
	font-size: 40px;
	bottom: 30px;
}
.ttl_02 {
	font-size: 18px;
	padding-left: 0;
	margin-bottom: 15px;
}
.ttl_01 .main {
	font-size: 24px;
}
.ttl_01 .sub {
	font-size: 18px;
}
.ttl_hand {
	padding-left: 42px;
}
.ttl_hand:before {
	background-size: 60%;
	background-repeat: no-repeat;
}
.btn_primary {
	max-width: 80%;
	min-width: 250px;
	padding: 10px 0;
}
.btn_primary:before {
	width: 49px;
	height: 26px;
	background-size: contain;
}
/*-----------------------------------------------------

	トップページ 	top

------------------------------------------------------*/
#nukumori, #careplan {
	padding: 0 1%;
}
.nukumori_wrap, .careplan_wrap {
	border-width: 5px;
}
/*    COMMON  &   MAINIMAGE
-------------------------------*/

#top #mainimage {
	height: 30vh;
	min-height: 300px;
	background-image: url(../Image/mainimage_sp.png);
}
#top .mv_inner {
	padding: 0 5%;
}
#top #mainimage .mv_txt {
	padding-top: 5%;
}
#mainimage .logo_wrap {
	display: block;
	margin-top: 6%;
}
#mainimage .logo_wrap .logo_box:nth-child(2) {
	margin-left: 0;
	margin-top: 10px;
}
#mainimage .logo_wrap .logo_box {
	max-width: 150px;
}
@media (min-width: 500px) and (max-width: 767px) {
 #top #mainimage {
 height: 50vh;
}
 #top #mainimage .mv_txt {
 padding-top: 10%;
}
}
 @media (max-width: 325px) {
 #top #mainimage {
 min-height: 270px;
}
}
.drawer-menu nav {
	padding-top: 30px;
}
#top #mainimage .mv_txt .txt_main {
	width: 50%;
}
#top #mainimage .mv_txt .txt_sub {
	display: none;
}
header .h_left h1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background: #fff4b6;
	padding: 5px 5%;
	margin-top: 0;
	font-size: 11px;
}
#top .message .txt_ttl {
	font-size: 18px;
	margin-bottom: 15px;
}
#top .message .txt_box p {
	text-align: left;
}
#top .message .anchor_wrap {
	display: block;
	margin-top: 40px;
}
#top .message .btn_anchor {
	margin: 0 auto;
	width: 80%;
}
#top .message .btn_anchor:nth-child(2) {
	margin-top: 10px;
}
#top .message .btn_anchor a {
	width: 100%;
	padding: 10px 0 20px;
	background: #fff;
}
#top .message .btn_anchor a:after {
	bottom: 5px;
	background-size: contain;
	width: 20px;
	height: 11px;
}
#top .message .btn_anchor .anchor_txt {
	font-size: 12px;
	margin-top: 5px;
}
#top .message .btn_anchor .logo {
	height: 20px;
}
#top .message .Inner:before {
	width: 200px;
	height: 300px;
	top: -35px;
	left: -40px;
	background-size: contain;
}
#top .message .Inner:after {
	background-size: contain;
	height: 300px;
	width: 100px;
	right: 0;
	top: 75px;
}
/*    job 
-------------------------------*/
#top .job .ttl_01 {
	margin-bottom: 25px;
}
#top .job .ttl_01 img {
	height: 25px;
	margin-right: 5px;
}
#top .job_content {
	padding: 15px;
}
#top .job_wrap {
	margin-top: 30px;
}
#top .job_tab .tab_item {
	font-size: 14px;
	padding: 10px 0 13px;
}
#top .job_tab .tab_item.active {
	border-width: 3px;
}
#top .job_intro01 {
	display: block;
}
#top .job_intro01 .img_box {
	width: 100%;
	padding-right: 0;
	text-align: center;
}
#top .job_intro01 .txt_box {
	width: 100%;
	padding-left: 0;
}
#top .job_intro01 .txt_box .job_ttl {
	font-size: 16px;
	margin-bottom: 8px;
}
#top .job_intro02 {
	margin-top: 20px;
	padding: 20px 0;
}
#top .job_intro02 .ttl {
	font-size: 15px;
	margin-bottom: 6px;
}
#top .job_intro02 .list_wrap {
	display: block;
}
#top .job_intro02 .list_wrap .job_list {
	width: 100%;
	padding: 0 10px;
}
#top .job_intro02 .list_wrap .job_list li {
	padding-left: 1em;
	text-indent: -1em;
}
/*    info
-------------------------------*/
#top .recommend .recommend_list {
	display: block;
}
#top .recommend .recommend_list li {
	width: 100%;
	margin-right: 0;
	top: 0;
	left: 0;
	border-radius: 10px;
	background: #fffae8;
}
#top .recommend .recommend_list li:before {
	content: none;
}
#top .recommend .recommend_list li:not(:first-child) {
	margin-top: 20px;
}
#top .recommend .recommend_list li:after {
	content: none;
}
#top .recommend .recommend_list li .inner {
	padding: 15px;
	background-position: center;
	background-size: 50px;
}
#top .recommend .recommend_list li .ttl {
	font-size: 16px;
	text-align: left;
	margin-bottom: 10px;
}
/*    SECTION 04
-------------------------------*/
#top .merit .merit_wrap {
	display: block;
}
#top .merit .merit_wrap .img_box {
	display: none;
}
#top .merit .merit_wrap .txt_box {
	width: 100%;
	background: #fff;
	border-radius: 10px;
	padding: 15px;
}
#top .merit .merit_wrap .txt_box:after {
	content: none
}
#top .merit .merit_wrap .merit_list li {
	font-size: 14px;
	font-weight: 400;
	padding-left: 33px;
	margin-top: 13px;
	line-height: 1.8;
}
#top .merit .merit_wrap .merit_list li:before {
	background-size: contain;
	width: 28px;
	height: 28px;
	bottom: inherit;
	top: 0;
}
/*    SECTION 05
-------------------------------*/	
#top .staff {
	padding: 50px 3%;
	background: url(../Image/img_bg01_sp.jpg) no-repeat;/*background-size: contain;*/
}
#top .staff .ttl_01:before {
	content: 'staff';
	bottom: 0;
}
#top .staff .interview_box {
	width: 90vw;
	margin: 0 5vw;
	display: block;
	padding: 15px;
}
#top .staff .interview_box .r_box {
	width: 100%;
	padding: 15px;
	margin-top: 10px;
}
#top .staff .interview_box .r_box .txt_box {
	margin-top: 15px;
}
#top .staff .interview_box .r_box .txt_box .q {
	font-size: 16px;
	padding-right: 20px;
	position: relative;
	margin-bottom: 0;
}
#top .staff .interview_box .r_box .txt_box .q:after {
	content: "\f067";
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	font-size: 16px;
	color: #d8d8d8;
	position: absolute;
	right: 0;
	top: 5px;
}
#top .staff .interview_box .r_box .txt_box .q.open:after {
	content: "\f068";
}
#top .staff .interview_box .r_box .txt_box .q span {
	background: linear-gradient(transparent 80%, #ffec70 0%);
	display: inline;
}
#top .staff .interview_box .r_box .txt_box .q span:after {
	content: none;
}
#top .staff .interview_box .r_box .txt_box p {
	padding-top: 15px;
}
#top .staff .interview_box .l_box {
	display: flex;
	padding: 0 10px;
}
#top .staff .interview_box .l_box .profile_box {
	padding: 0;
	color: #333;
	min-width: auto;
}
#top .staff .interview_box .l_box .profile_box .name {
	font-size: 20px;
	margin-right: 8px;
}
#top .staff .interview_box .l_box .profile_box .old {
	font-size: 18px;
}
#top .staff .interview_box .l_box .profile_box .year {
	margin-top: 10px;
}
#top .staff .interview_box .l_box .profile_box .type {
	margin-top: 10px;
}
#top .staff .interview_box .l_box .icon_box {
	position: static;
	width: 80px;
	height: 80px;
	margin-left: 20px;
}
#top .staff .interview_box .l_box .icon_box img {
	width: 50px;
}
#top .staff .interview_box .l_box .profile_box:before {
	content: none;
}
.nukumori-arrow-box, .careplan-arrow-box {
	width: 100%;
	bottom: inherit;
	top: 50px;
}
#top .staff .slick-prev, #top .staff .slick-next {
	width: 30px;
	height: 30px;
}
#top .staff .slick-prev {
	left: -3%;
}
#top .staff .slick-next {
	right: -3%;
}
#top .staff .slick-prev:before, #top .staff .slick-next:before {
	background-size: contain;
	width: 10px;
	height: 18px;
	transform: translate(-50%, -50%);
	left: 50%;
}
#top .staff .slick-next:before {
	background-size: contain;
	right: 50%;
}
/*    SECTION 06
-------------------------------*/	
#top .schedule .ttl_01:before {
	content: 'schedule';
	bottom: 0;
}
#top .schedule .schedule_tab {
	display: block;
}
#top .schedule .schedule_tab .tab_item {
	font-size: 14px;
	width: 100%;
	border-radius: 8px;
	padding: 13px 0 16px;
	border-width: 3px;
}
#top .schedule .schedule_tab .tab_item.active {
	border-width: 3px;
}
#top .schedule .schedule_tab .tab_item:not(:first-child) {
	margin-top: 8px;
}
#top .schedule .content_wrap {
	margin-top: 10px;
}
#top .schedule .schedule_content {
	padding: 15px;
}
#top .schedule .schedule_content .top_txt .ttl {
	font-size: 16px;
}
#top .schedule .schedule_content .top_txt .txt {
	font-size: 16px;
}
#top .schedule .schedule_content .morning_box {
	padding: 15px;
	margin-top: 15px;
}
#top .schedule .schedule_content .table_schedule th {
	display: block;
	width: 100%;
	padding-left: 20px;
	font-size: 18px;
	font-weight: 500;
}
#top .schedule .schedule_content .table_schedule td {
	display: block;
	width: 100%;
	padding-bottom: 15px;
}
#top .schedule .schedule_content .table_schedule th:before {
	background-size: contain;
	width: 15px;
	height: 15px;
	top: 8px;
}
#top .schedule .schedule_content .table_schedule .main {
	font-size: 16px;
	font-weight: 400;
	padding: 5px 10px;
}
#top .schedule .schedule_content .noon_box {
	padding: 10px 15px;
}
#top .schedule .schedule_content .afternoon_box {
	padding: 15px;
}
#top .schedule .schedule_content .table_schedule .sub {
	padding-top: 0;
}
/*    SECTION 07
-------------------------------*/	
#top .qa {
	padding: 50px 15px;
}
#top .qa .ttl_01:before {
	bottom: 0;
}
#top .qa .Inner {
	padding: 0;
}
#top .qa .qa_wrap dl {
	border-bottom: solid 1px #d8d8d8;
}
#top .qa .question {
	font-size: 15px;
	padding: 10px 20px 10px 30px;
}
#top .qa .question:before {
	font-size: 20px;
	top: 12px;
}
#top .qa .answer {
	width: 100%;
	padding: 10px 10px 10px 25px;
	border-radius: 5px;
}
#top .qa .answer:before {
	font-size: 14px;
	left: 5px;
}
#top .qa .question:after, #top .qa .question.close:after {
	right: 0;
}
/*    SECTION 08
-------------------------------*/	
#top .sec_btn {
	padding: 40px 0;
}
.btn.btn_boshu img {
	height: 20px;
}
.btn.btn_boshu span {
	font-size: 14px;
	font-weight: 400;
	margin-top: 7px;
}

.btn.btn_contact .btn_txt {
	font-size: 17px;
}
.btn.btn_contact .btn_txt_bottom {
	margin-top: 8px;
}
/*    careplan
-------------------------------*/
#careplan {
	margin-top: 15px;
}
#careplan .job .ttl_01:before {
	bottom: 0;
}
#careplan .staff .interview_box .r_box .txt_box .q span {
	background: linear-gradient(transparent 80%, #ffd9b4 0%);
}
/*-----------------------------------------------------

	下層共通CSS

------------------------------------------------------*/
	

/*-----------------------------------------------------

	お問い合わせ			　contact

------------------------------------------------------*/
#contact .lead {
	text-align: left;
}
#contact .list input {
	margin-left: 0;
}
.form_wrap #mailformpro th, .form_wrap #mailformpro td {
	display: block;
	width: 100%;
	padding: 10px;
}
.form_wrap #mailformpro th {
	padding-left: 0;
}
.form_wrap #mailformpro td {
	margin-bottom: 10px;
}
.form_wrap #mailformpro .middle {
 width: 10sta0%;
}
.mfp_element_all {
	max-width: 100%;
}
.form_wrap #mailformpro textarea {
	height: 200px!important;
}
.mfp_element_submit, .mfp_element_reset, .mfp_element_button {
	margin: 0 auto;
}
.mfp_element_submit:hover, .mfp_element_reset:hover, .mfp_element_button:hover, button.mfp_next:hover, button.mfp_prev:hover {
	background: transparent;
	box-shadow: none;
}
#contact .thanks .ttl {
	font-size: 17px;
}
#contact .thanks .txt_box {
	text-align: left;
}
/*-----------------------------------------------------

	送信完了画面			　thanks

------------------------------------------------------*/
#thanks #sec_01 .message {
	font-size: 14px;
	text-align: left;
	margin-bottom: 40px;
	line-height: 2;
}
/*-----------------------------------------------------

	各フォーム共通CSS			

------------------------------------------------------*/
.formWrap #mailformpro th, .formWrap #mailformpro td {
	font-size: 14px;
	vertical-align: middle;
	display: block;
	width: 100%;
	box-sizing: border-box;
}
.formWrap #mailformpro th {
	width: 100%;
	border-bottom: none;
	padding: 15px 10px 0;
}
.formWrap #mailformpro td {
	width: 100%;
	padding: 10px 0 15px;
}
.formWrap #mailformpro .short {
	width: 50%;
}
.formWrap #mailformpro .middle {
	width: 100%;
}
.formWrap #mailformpro .long {
	width: 100%;
}
form#mailformpro label {
	margin: 15px;
}
.formWrap #mailformpro #other_label {
	margin-top: 20px;
}
.formWrap #mailformpro .otherTxt {
	margin-top: 10px;
	width: 100%;
}
div.mfp_buttons {
	margin-top: 30px;
}
/*  Mailform pro Reset CSS 
-------------------------------*/
.formWrap #mailformpro .mfp_element_textarea {
	width: 100%;
	height: 200px;
}
.mfp_element_submit, .mfp_element_reset, .mfp_element_button {
	font-size: 14px;
	padding: 16px 0;
	width: 80%;
}
#mfp_confirm_table tr {
	border-bottom: none;
}
table#mfp_confirm_table tr th, table#mfp_confirm_table tr td {
	display: block;
}
table#mfp_confirm_table tr th {
	width: 100%;
	font-size: 12px;
	padding: 15px 10px;
}
table#mfp_confirm_table tr td {
	font-size: 12px;
	padding: 15px 10px;
	width: 100%;
}
div#mfp_phase_confirm .mfp_buttons button {
	display: block;
	float: none;
	margin: 0 auto;
}
div#mfp_phase_confirm .mfp_buttons button:nth-child(1) {
	margin-right: auto;
	margin-bottom: 15px;
}
div#mfp_phase_confirm .mfp_buttons {
	font-size: 0;
}
div#mfp_phase_confirm h4 {
	font-size: 20px;
	margin-bottom: 20px;
}
}