@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&display=swap');
/*
Theme Name: web_solution
Author: 
Author URI: https://hp-compass.jp/web_solution/
*/
/* パスワード保護用 */
.post-password-form {
	position: absolute;
	z-index: 100000;
	width: 100%;
	height: 100vh;
	background: #FFF;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	padding: 30px;
	text-align: center;
}
/* ログイン表示が高さを変えるので非表示*/
#html_page {margin-top: 0 !important;}
#wpadminbar {display: none;}

/* reset.css */
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:inherit;
	vertical-align: inherit;
	font-weight: inherit;
}
img {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	vertical-align:top;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
} 
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, main, hgroup, menu, nav, section {
	display: block;
}
html,body {
	width: 100%;
	height: 100%;
    font-family: 'Noto Sans JP', sans-serif, "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif" !important;
}
html{
	font-size: 16px;
	scroll-behavior: smooth;
	scroll-padding-top: 80px;
}
body {
	margin: 0;
	padding: 0;
	background: #fff;
	color: #333;
	line-height: 1.6;
	overflow-x: hidden;
    background-image: url("https://hp-compass.jp/web-solution/wp-content/themes/web_solution/img/common/white_bg.jpg");
    background-size: cover;
    background-position: center top;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-color: #ebedf1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0;
	word-wrap: break-word;
	overflow-wrap: break-word;
}
th, td {
	vertical-align: middle;
}
iframe {
	width: 100%;
	border: none;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes:none;
}
a {
	margin:0;
	padding:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	text-decoration:none;
	color: inherit;
}
strong,
em,
span {
	font-weight: inherit;
	font-style: inherit;
}
ins {
	background-color:#ff9;
	color:#515151;
	text-decoration:none;
}
p:empty {
	display: none;
}
input[type="submit"],
input[type="reset"],
input[type="button"] {
	border: none;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration,
input[type="reset"]::-webkit-search-decoration {
	display: none;
}
input[type="text"],input[type="email"],input[type="number"],input[type="tel"],select,textarea{
	width: 100%;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding: 1.1em 1em;
	border: 1px solid #CCC;
	vertical-align: middle;
	/*-moz-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1) inset;
	-webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1) inset;
	box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.1) inset;*/
	background: #fff;
}
:focus-visible {
    outline-color: #2673ed;
}
#html_page .form-preview-dl select:not([multiple]) {
	background-color: #fff;
}
.invalid_btn {
	pointer-events: none;
}

/* スクロールCSS */
.fade-in {
	opacity: 0;
	transition-duration: .8s;
	transition-property: opacity, transform;
}
.fade-in-up {
	transform: translate(0, 50px);
}
.fade-in-down {
	transform: translate(0, -50px);
}
.fade-in-left {
	transform: translate(-50px, 0);
}
.fade-in-right {
	transform: translate(50px, 0);
}
.scroll-in {
	opacity: 1;
	transform: translate(0, 0);
}
.delay-1 {
	transition-delay: .2s;
}
.delay-2 {
	transition-delay: .4s;
}
.delay-3 {
	transition-delay: .6s;
}
.delay-4 {
	transition-delay: .7s;
}
.delay-5 {
	transition-delay: 1s;
}

/* animation */
.hover_zoom {
	will-change: color, background, transform;
	transition: color, background .5s;
	transition:1s all;
}
.hover_zoom:hover {
	transform:scale(1.06);
	transition:1s all;
}
.hover_zoom.btn_green:hover {
	background: #6baa1e!important;
}
.hover_zoom.btn_stn:hover {
	background: #221e1f!important;
}
@-webkit-keyframes flash {
	0%,100% {opacity: 1;}
	50% {opacity: 0;}
}
@-moz-keyframes flash {
	0%,100% {opacity: 1;}
	50% {opacity: 0;}
}
@keyframes flash {
	0%,100% {opacity: 1;}
	50% {opacity: 0;}
}
@-webkit-keyframes blink {
	0% {opacity:0;}
	100% {opacity:1;}
}
@-moz-keyframes blink {
	0% {opacity:0;}
	100% {opacity:1;}
}
@keyframes blink {
	0% {opacity:0;}
	100% {opacity:1;}
}
@-webkit-keyframes river {
	0% {transform: translateX(20%);	opacity: 1;}
	100% {transform: translateX(80%);}
}
@-moz-keyframes river {
	0% {transform: translateX(20%);	opacity: 1;}
	100% {transform: translateX(80%);}
}
@keyframes river {
	0% {transform: translateX(20%);	opacity: 1;}
	100% {transform: translateX(80%);}
}

/* font-size */
/* body {
	font-size: 16px;
}
@media screen and (max-width: 767px){
	body {
		font-size: 3.651vw;
	}
}
*/

/* common */
.disp_none {
	display: none;
}
.md_only,
.tb_only,
.sp_only {
	display: none;
}
.w_100 {
    width: 100% !important;
}
.ml0 {
	margin-left: 0 !important;
}
.mr0 {
	margin-right: 0 !important;
}
.w_100 {
    width: 100% !important;
}
.mt_0 {
    margin-top: 0 !important;
}
.mt_1 {
    margin-top: .5rem !important;
}
.mt_2 {
    margin-top: 1rem !important;
}
.mt_3 {
    margin-top: 1.5rem !important;
}
.mt_4 {
    margin-top: 2rem !important;
}
.mt_5 {
    margin-top: 2.5rem !important;
}
.mt_6 {
    margin-top: 3rem !important;
}
.mt_7 {
    margin-top: 3.5rem !important;
}
.mt_8 {
    margin-top: 4rem !important;
}
.mb_0 {
    margin-bottom: 0 !important;
}
.mb_1 {
    margin-bottom: .5rem !important;
}
.mb_2 {
    margin-bottom: 1rem !important;
}
.mb_3 {
    margin-bottom: 1.5rem !important;
}
.mb_4 {
    margin-bottom: 2rem !important;
}
.mb_5 {
    margin-bottom: 2.5rem !important;
}
.mb_6 {
    margin-bottom: 3rem !important;
}
.mr_0 {
    margin-right: 0 !important;
}
.mr_1 {
    margin-right: .5rem !important;
}
.mr_2 {
    margin-right: 1rem !important;
}
.mr_3 {
    margin-right: 1.5rem !important;
}
.mr_4 {
    margin-right: 2rem !important;
}
.mr_5 {
    margin-right: 2.5rem !important;
}
.mr_6 {
    margin-right: 3rem !important;
}
.ml_1 {
    margin-left: .5rem !important;
}
.ml_2 {
    margin-left: 1rem !important;
}
.pt_0 {
    padding-top: 0 !important;
}
.pt_1 {
    padding-top: .5rem !important;
}
.pt_2 {
    padding-top: 1rem !important;
}
.pt_3 {
    padding-top: 1.5rem !important;
}
.pt_4 {
    padding-top: 2rem !important;
}
.pt_5 {
    padding-top: 2.5rem !important;
}
.pt_6 {
    padding-top: 3rem !important;
}
.pb_0 {
    padding-bottom: 0 !important;
}
.pb_1 {
    padding-bottom: .5rem !important;
}
.pb_2 {
    padding-bottom: 1rem !important;
}
.pb_3 {
    padding-bottom: 1.5rem !important;
}
.pb_4 {
    padding-bottom: 2rem !important;
}
.pb_5 {
    padding-bottom: 2.5rem !important;
}
.pb_6 {
    padding-bottom: 3rem !important;
}
.pb_7 {
    padding-bottom: 3.5rem !important;
}
.pb_8 {
    padding-bottom: 4rem !important;
}
.span_wrap > span,
.span_wrap_lead > span {
	display: inline-block;
}
.text_right {
	text-align: right;
}
.text_left {
	text-align: left;
}
.text_center {
	text-align: center;
}
.img_scale {
    display: inline-block;
    border-radius: 3%;
    overflow: hidden;
}
.img_scale img {
    transform: scale(1);
    transition: all .5s ease-in-out;
}
.img_scale:hover img {
    transform: scale(1.2);
    transition: all .5s ease-in-out;
}


/* -----------------------
固定 
-------------------------*/
.fixed_bnr_contact {
    position: fixed;
    z-index: 999;
    right: 0;
    top: 20%;
    margin: auto;
    display: inline-block;
}
.fixed_bnr_contact > a {
    display: inline-block;
    padding: 2.2rem 0.7rem;
    background: #e5ce00;
    writing-mode: vertical-rl;
    font-size: 125%;
    font-weight: 500;
    letter-spacing: 1px;
    border-radius: 5px 0 0 5px;
	transition-duration: 0.2s;
}
.fixed_bnr_contact > a:hover {
    background: #ead944;
	transition-duration: 0.2s;
}
.diagnosis_banner {
display: inline-block;
    width: 10em;
    max-width: 20%;
    position: fixed;
    z-index: 999;
    right: 0.5rem;
    bottom: 6em;
    margin: auto;
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
}
.diagnosis_banner a {
	display: block;
}
.diagnosis_banner a:hover img {
    animation: bigsmall 2s ease;
}
@keyframes bigsmall {
  0% {
      transform: rotate(0);
  }
  100% {
      transform: rotate(-360deg);
  }
}






#pagetop {
    display: inline-block;
    position: fixed;
    z-index: 7;
    right: 0.5em;
    bottom: 2%;
}
#pagetop > a {
    width: 3rem;
    height: 3rem;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    border: 3px solid;
    background: #FFF;
    color: #231f20;
    transition: all 0.3s;
}
#pagetop > a:hover {
	background: #231f20;
	color: #FFF;
	transition: all 0.3s;
}
#pagetop > a > span {
    font-size: 300%;
}

/* -----------------------
ヘッダーナビ 
-------------------------*/
.header_wrap {
	position: relative;
}
#header {
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 4em;
    background: rgba(255, 255, 255, 0.87);
    background: rgb(255 255 255 / 87%);
    /* -webkit-box-shadow: 0 3px 6px 0 rgb(0 0 0 / 15%); */
    /* box-shadow: 0 3px 6px 0 rgb(0 0 0 / 15%); */
}
#menulist {
    display: none;
}
.header_in {
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 2% 10px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    line-height: 1;
    height: 100%;
}
.header_in a {
    color: #231f20;
    display: block;
}
.header_in .header_title {
    width: 3.5em;
}
.gnav {
    -webkit-flex-grow: 1;
    flex-grow: 1;
}
.gnav_menu {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    gap: 10px 1em;
}
.gnav_menu li:not(.sp_nav_open) a {
    position: relative;
    z-index: 2;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    align-items: center;
    gap: 0.7em 0;
    text-align: center;
    color: #333;
}
.gnav_menu li:not(.sp_nav_open) a.active {
    color: #89c53f;
	pointer-events: none;
}
.gnav_menu li:not(.sp_nav_open):has(> div ~ ul a.active) > div a {
    color: #89c53f;
	pointer-events: none;
}
.gnav_menu li:not(.sp_nav_open) a:hover > em,
.gnav_menu li:not(.sp_nav_open) a:hover > span {
    color: #89c53f;
}
.gnav_menu li:not(.sp_nav_open) a > em {
	font-weight: 900;
	font-size: 120%;
	letter-spacing: .1em;
}
.gnav_menu li:not(.sp_nav_open) a > span {
	font-size: 70%;
	font-weight: 600;
	color: #787878;
}
.gnav_menu .btn_green {
	background: #89c53f;
	padding: 7px 2em 4px 1.5em;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	color: #FFF;
	font-size: 105%;
}
.gnav_menu a.btn_green::after {
	content: "";
    position: absolute;
    top:0;
    bottom: 0;
    left: auto;
    right: 1em;
    z-index: 2;
    display: block;
    width: 0.5em;
    height: 0.5em;
    border-left: 2px solid;
    border-bottom: 2px solid;
    transform: rotate(-135deg);
    margin: auto;
    font-size: 80%;
    background: none;
}
.sp_nav {
	display: block;
	position: absolute;
	z-index: 10;
	right: 0;
	width: 85%;
	max-width: 30em;
	height: calc(100vh - 4rem);
	background: #FFF;
	font-size: 120%;
	text-align: center;
	/* background: url(../img/top/main_bnr.jpg) repeat left center; */
	transform: translate(100%);
	transition: all .3s;
	-webkit-box-shadow: 0 3px 6px 0 rgb(0 0 0 / 15%);
	box-shadow: 0 3px 6px 0 rgb(0 0 0 / 15%);
	overflow-y: auto;
}
/* -----------------------
フッター 
-------------------------*/
#footer {
    padding: 3rem 1rem 2rem;
    background: #231f20;
    font-size: 100%;
}
.fnav_menu {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    gap: 3em;
}
.fnav_menu a {
	display: inline-block;
	line-height: 1;
	color: #FFF;
	border-bottom: 1px solid transparent;
	transition: all 0.3s;
}
.fnav_menu a:hover {
	border-bottom: 1px solid #FFF;
	transition : all 0.5s;
}
#footer > small {
    display: block;
    margin: 1rem auto 0;
    text-align: center;
    color: #939598;
}

/* -----------------------
ボタン 
-------------------------*/
.btn_arrow {
    position: relative;
    display: inline-block;
    min-width: 13.6em;
    padding: 0.8em 3.1em 0.8em 2.1em;
    font-size: 115%;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    letter-spacing: 0.1em;
    color: #89c53f;
    background: #FFF;
    border: 1px solid #FFF;
    border-radius: 30px;
    white-space: nowrap;
    transition-duration: 0.2s;
}
.btn_arrow::before {
	content: "";
	position: absolute;
	top:0;
	bottom: 0;
	left: auto;
	right: 1.5em;
	z-index: 2;
	display: block;
	width: 1em;
	height: 2px;
	margin: auto;
	font-size: 80%;
	background: #89c53f;
}
.btn_arrow::after {
	content: "";
	position: absolute;
	top:0;
	bottom: 0;
	left: auto;
	right: 1.4em;
	z-index: 2;
	display: block;
	width: 0.3em;
	height: 0.3em;
	border-left: 2px solid;
	border-bottom: 2px solid;
	transform: rotate(-135deg);
	margin: auto;
	font-size: 80%;
	background: none;
}
.btn_arrow:hover {
    color: #FFF;
    background: #74ca0a;
    transition-duration: 0.2s;
}
.btn_arrow:hover::before {
    background: #FFF;
}
.btn_arrow:hover::after {
    color: #FFF;
}
.btn_wblack {
    color: #333;
    background: #FFF;
    border: 1px solid;
}
.btn_wblack:hover {
    color: #FFF;
    background: #333;
}
.btn_wblack.btn_arrow::before {
    background: #333;
}
.btn_wblack.btn_arrow::after {
    color: #333;
}
.btn_wblack.btn_arrow:hover::before {
    background: #FFF;
}
.btn_wblack.btn_arrow:hover::after {
    color: #FFF;
}
.btn_green {
    color: #FFF;
    background: #82ac16;
    border: 1px solid #82ac16;
}
.btn_green:hover {
    color: #FFF;
    background: #a5d823;
    border: 1px solid #a5d823;
}
.btn_green.btn_arrow::before {
    background: #FFF;
}
.btn_green.btn_arrow::after {
    color: #FFF;
}
.btn_green.btn_arrow:hover::before {
    background: #FFF;
}
.btn_green.btn_arrow:hover::after {
    color: #FFF;
}
.btn_square {
    border-radius: 10px  !important;
}

#wrapper {
    /* max-width:  1600px; */
    margin: 0 auto;
    /* background: #FFF; */
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    min-height: 100vh;
    overflow-x: hidden;
}
.main_conts {
	-webkit-flex-grow: 1;
	flex-grow: 1;
}
.privacy .main_conts,
.company .main_conts {
	/* background: #f2f3f4; */
}
.bread_wrap {
	background: rgba(240, 240, 240, 0.6);
	box-shadow: inset 0 1px 5px 0 rgba(194, 194, 194, 0.15), inset 0 -1px 5px 0 rgba(194, 194, 194, 0.15);
}
.breadcrumb-area {
    max-width: 1200px;
    margin: 0 auto;
    padding: .7em 2%;
    line-height: 1.2;
}
.breadcrumb-area a {
    text-decoration: underline;
    transition: all 0.3s;
}
.breadcrumb-area a:hover {
    color: #89c53f;
}

/*
.bg_cover {
    position: relative;
    z-index: 1;
    background: url(../img/top/main_bnr.jpg) no-repeat center center;
    background-size: cover;
    overflow: hidden;
}
.cover_in {
    position: relative;
    z-index: 3;
    max-width: 1200px;
    margin: 0 auto;
    padding: 5rem 3% 10rem;
}
.cover_in > h2 > em {
	display: inline-block;
	background: #FFF;
	line-height: 1;
	padding: 18px 15px;
	margin-top: 15px;
	-webkit-transform:skew(-10deg, 0);
	-ms-skew:(-10deg, 0);
	transform: skew(-10deg, 0);
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 900;
	font-size: 580%;
}
.cover_in > p {
	margin-top: 2rem;
	font-size: 200%;
	font-weight: 800;
	-webkit-transform:skew(-10deg, 0);
	-ms-skew:(-10deg, 0);
	transform: skew(-10deg, 0);
}
.page_cover .cover_in > h2 > em {
	font-size: 400%;
}
.page_cover .cover_in {
    padding: 4.5rem 2% 5.5rem;
}

.bg_white {
	background: #fff;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
}
	*/
.bg_gray {
	background: #f2f3f4;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
}
.in_wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem 2% 4rem;
}
.in_wrap_nopt {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2% 4rem;
}
.in_wrap_nopb {
    max-width: 1200px;
    margin: 0 auto;
    padding: 4rem 2% 0;
}
.in_wrap_nop {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2%;
}
.in_wrap_lesspt {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 2% 4rem;
}
.in_wrap_lesspx {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem 2%;
}
.big_text {
	font-size: 650%;
	font-weight: 900;
	line-height: 1.2;
	letter-spacing: -0.03em;
	text-align: center;
	font-family: 'Noto Sans JP', sans-serif;
}
.bigger_text {
	font-size: 180%;
	font-weight: 900;
	letter-spacing: -0.03em;
	text-align: center;
}
.in_wrap_overflow .bigger_text {
	padding: 0.6em 0 0;
}
.inpage_cont .bigger_text:first-child {
	padding-top: 0;
}
.color_green {
	color: #89c53f;
}
.color_orange {
	color: #EFB94C;
}
/*
.contact_banner {
    position: relative;
    z-index: 1;
    margin-top: 4rem;
}
.in_wrap_nomt .contact_banner {
    margin-top: 0;
}
.contact_banner > a {
    position: absolute;
    z-index: 3;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.contact_banner dl {
	will-change: color, background, transform;
	transition: color .5s, background .5s;
	display: block;
	border: 2px solid #89c53f;
	text-align: center;
	padding: 35px 2% 25px;
	background: #FFF;
	box-shadow: 0px 0px 15px -8px #3a3a3a;
}
.contact_banner dl::after {
	content: "＞";
	display: block;
	position: absolute;
	right: 10px;
	bottom: 10px;
	width: 1.2em;
	height: 1.2em;
	padding: 4px;
	font-size: 70%;
	font-weight: bold;
	color: #FFF;
	background: #89c53f;
}
.contact_banner dt,
.sub_title em {
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0 0.5em 0 0;
    letter-spacing: -.02em;
    font-size: 240%;
    font-weight: 900;
    line-height: 1;
    font-family: 'Rubik', sans-serif;
}
.contact_banner dt::after,
.sub_title em::after {
    content: "";
    display: block;
    width: .5em;
    height: 3px;
    position: absolute;
    z-index: 2;
    bottom: 0;
    right: 0;
    background: #84be3d;
    -webkit-animation:blink 0.5s ease-in-out infinite alternate;
    -moz-animation:blink 0.5s ease-in-out infinite alternate;
    animation:blink 0.5s ease-in-out infinite alternate;
}
.contact_banner {
	transition:1s all;
}
.contact_banner:hover {
	transform:scale(1.025);
	transition:1s all;
}
.contact_banner:hover dl {
	transition: color .5s;
	transition: background .5s;
	color: #FFF;
	background: #89c53f;
}
.contact_banner:hover dl::after {
	color: #89c53f;
	background: #FFF;
}
.contact_banner:hover dt::after,
.sub_title:hover em::after {
    background: #FFF;
}
.contact_banner dd,
.sub_title > span {
	display: block;
	margin: 1rem auto 0;
	font-size: 157%;
	font-weight: 900;
}
.sub_title {
	text-align: center;
}
.sub_title > span {
    margin: 6px auto 0;
}
.diagonal_text {
	margin: 3rem auto 0;
}
.diagonal_text > p {
	padding: 8px 0 0;
    font-size: 110%;
    font-weight: bold;
}
.btn_center {
	position: absolute;
	z-index: 2;
	left: 0;
	right: 0;
	bottom: 25px;
	text-align: center;
}
.btn_stn {
	display: inline-block;
	padding: 5px 2em 3px;
	background: #221e1f;
	border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	color: #FFF;
}
.bottom_wrap {
    padding: 0 0 3rem;
}
	*/

.request_btn {
    position: fixed;
    z-index: 5;
    right: 2%;
    bottom: 10%;
    display: inline-block;
    max-width: 30%;
}
.request_btn > a {
	will-change: transform;
	display: block;
	transition:.2s;
}
.request_btn > a:hover {
	transform:scale(1.025);
	transition:.2s;
}
.request_btn > span {
    position: absolute;
    z-index: 6;
    top: 0;
    right: -.4em;
    display: inline-block;
    font-size: 200%;
    line-height: 1;
    color: #1d2087;
    border: 2px solid;
    border-radius: 50%;
    background: #FFF;
}


/* inpage common */
/*
.inpage_cont {
	margin: 2rem auto 0;
}
	*/
.tel_link {
	pointer-events: none;
}
.text_link {
	color: #477d03;
}
.text_link:hover {
	text-decoration: underline;
}
.no_hover a {
	pointer-events: none;
}
.no_hover .icon_gopage {
	display: none;
}

/* privacy */
.privacybox {
	width: 94%;
}
.privacybox p span.txt_b{
	display: block;
	margin: 10px auto 0;
	font-weight: bold;
}

/* company */
.table {
	/* background: #fcfcfc; */
}
.table tr:nth-child(odd) {
	/* background: #f1f8e9; */
}
.table th {
	width: 26%;
	min-width: 8em;
	padding: 1rem 0 .8rem .5rem;
	border-top: 1px solid #FFF;
	vertical-align: top;
}
.table th > span {
	display: block;
	position: relative;
	z-index: 1;
	padding: 0.6rem 0.3rem 0.5rem;
	background: #FFF;
	font-weight: 500;
	vertical-align: middle;
    border-radius: 10px;
}
.table th:after{
	/* display: block; */
	content: "";
	width: 0px;
	height: 0px;
	position: absolute;
	top:calc(50% - 7px);
	right:-6px;
	border-left: 7px solid #89c53f;
	border-top: 7px solid transparent;
	border-bottom: 7px solid transparent;
}
.table td {
	padding: 1rem 1.5rem .8rem 1.5rem;
	vertical-align: middle;
	border-top: 1px solid #FFF;
}
.table tr:first-child th,
.table tr:first-child td {
	border-top: none;
}
.maparea {
	margin: 10px auto 0;
	height: 300px;
	height: 60vw;
	max-height: 450px;
}
.maparea iframe {
	height: 100%;
}
.grayscale_area {
    filter: grayscale(100%);
}

/* contact */
.page_read .bigger_text:first-child {
	padding-top: 0;
}
.page_read {
    padding: 2.5rem 1rem 1.8rem;
    /* background: #f2f3f4; */
    text-align: center;
    /* font-size: 110%; */
}
.page_read p {
    line-height: 1.6;
}
.page_read p + p {
	margin-top: 0.7em;
}
.contact_option {
	margin: 1.8rem auto 0;
}
.text_blue {
	color: #1d2087;
}
.middle_text {
	font-weight: bold;
	font-size: 120%;
}
.btn_blue {
	display: inline-block;
	position: relative;
	z-index: 3;
	padding: 0.7em 4rem 0.6em;
	background: #1d2087;
	color: #FFF;
	font-weight: bold;
	font-size: 120%;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
}
.btn_blue .tel_text::after {
	content: "｜";
	padding-left: .5em;
}
.btn_blue span {
	line-height: 1;
	vertical-align: middle;
	padding: 0 .5rem;
	font-weight: bold;
}
.btn_blue span.tel_num {
	display: inline-block;
	position: relative;
	z-index: 1;
	padding-left: 1.8em;
}
.btn_blue .material-icons {
	position: absolute;
	z-index: 2;
	width: 1em;
	height: 1em;
	left: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	font-size: 115%;
}
.contact_option > p {
	margin-top: .5em;
}
.contactbox th {
    font-weight: bold;
}
.contactbox label {
    cursor: pointer;
    vertical-align: baseline;
}
.contact_kind {
    text-align: center;
    margin-bottom: 3rem;
}
.contact_kind label span {
    font-size: 135%;
    font-weight: bold;
}
.tb_simple tr {
	border-top: .5rem solid #f2f3f4;
}
.tb_simple th {
	position: relative;
	z-index: 1;
	width: 33%;
	padding: 1rem 0.5rem 0.8rem 3rem;
	background: #89c53f;
	color: #FFF;
}
.tb_simple th.no_require {
	padding: 1rem 0.5rem 0.8rem;
}
.tb_simple th > label {
	font-weight: bold;
}
.tb_simple th > label > em {
	position: absolute;
	left: 0.6rem;
	top: 0;
	bottom: 0;
	margin: auto;
	display: inline-block;
	height: 1.6em;
	padding: 0.4em 0.4em 0.3em;
	background: #fff;
	margin-right: .5em;
	color: #89c53f;
	font-weight: bold;
	font-size: 70%;
	line-height: 1;
}
.tb_simple td {
	padding: 1rem 0.5rem 0.8rem;
	background: #FFF;
}
.tb_simple .item_in {
	padding-right: 1.5rem;
}
.contact_agreement {
	text-align: center;
	margin: 1rem auto 0;
	padding: 1rem;
}
.contactbox .wpcf7-not-valid-tip {
	margin-top: 5px;
	font-size: 90%;
}
.contactbox .wpcf7-not-valid-tip::before {
	content: "※";
}
#formwrap + .wpcf7-response-output {
	background: #FFF;
	padding: 1rem;
}
.btn_submit {
	position: relative;
	z-index: 1;
    max-width: 300px;
	margin: 1rem auto 0;
}
.btn_submit input[type="submit"] {
    display: block;
    width: 100%;
    padding: .8em 3em 0.7em;
    background: #89c53f;
    line-height: 1;
    font-size: 125%;
    font-weight: bold;
    color: #FFF;
    text-align: center;
    border-radius: 50px;
}
.btn_submit span {
	display: none;
}
.btn_submit:hover span {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	display: block;
	opacity: 0;
	width: 100%;
	height: 1em;
	content: "";
	color: rgba(255, 255, 255, 0.6);
	color: rgb(255 255 255 / 60%);
	animation: river .8s linear;
	pointer-events: none;
	font-size: 230%;
}

.contactbox {
	text-align: left;
}
.tb_simple_vert,
.tb_simple_vert tr,
.tb_simple_vert th,
.tb_simple_vert td {
    display: block;
}
.tb_simple_vert tr:not(:first-child) {
    margin: 2rem auto 0;
}
.tb_simple_vert th {
    /* font-weight: bold; */
    letter-spacing: .1em;
}
.tb_simple_vert td {
	margin: .6rem auto 0
}
.contactbox .any,
.contactbox .req {
    display: inline-block;
    font-size: 70%;
    line-height: 1;
    margin: 0 0.8em 0 0;
    padding: 0.3em 0.3em;
    background: #333333;
    color: #FFF;
    vertical-align: middle;
}
.contactbox .req {
    display: inline-block;
    background: #2673ed;
}
.contactbox input[type="text"], 
.contactbox input[type="email"],
.contactbox input[type="number"],
.contactbox input[type="tel"],
.contactbox select,
.contactbox textarea {
    
}
.tb_simple_vert .item_in {
    background: #FFF;
    padding: 1.5rem 1rem;
}
.tb_simple_vert .item_in .wpcf7-checkbox {
    display: flex;
	flex-wrap: wrap;
	gap: .6rem .5rem;
}
.tb_simple_vert .item_in .wpcf7-checkbox > span {
	flex: 1;
	white-space: nowrap;
	text-align: left;
	font-size: 92%;
	font-weight: 500;
}
.tb_simple_hn01 th {
	width: 17em;
	padding: .5em 0;
}
.tb_simple_hn01 td {
	padding: .5em 0 .5em 1em;
}
.tb_simple_hn01 label,
.tb_simple_hn01 .label_wrap {
    display: block;
    background: #FFF;
    padding: 0.7em 1em;
    border-radius: 8px;
}
.hopes_area {
    margin: 0.7rem auto 0;
    border-radius: 10px;
    overflow: hidden;
    background: #FFF;
}
.tb_simple_hn02 {
    background: #FFF;
}
.tb_simple_hn02 th, 
.tb_simple_hn02 td {
    padding: 1em 1em 1em;
}
div:has( > .hopes_wrap ) {
    border-top: 1px solid #CCC;
}
.hopes_wrap {
    margin: 0 auto;
    max-width: 44em;
    padding: 1.5rem 2rem 2rem;
}
.hopes_gaiyo1 {
    font-weight: bold;
    font-size: 90%;
    text-align: center;
}
.hopes_gaiyo2 {
    margin: .5em auto 0;
    font-weight: bold;
    font-size: 80%;
    color: #787878;
    text-align: center;
}
.hopes_gaiyo2 > br {
    display: none;
}
.hopes_time {
    margin: 1.5rem auto 0;
    background: #555555;
    padding: 1rem;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 10px;
}
.hopes_time > dt {
    white-space: nowrap;
    padding: 0 1rem 0 0;
    font-weight: bold;
    color: #FFF;
}
.date_set {
    display: flex;
    max-width: 25em;
}
.date_set .dateonly {
    width: 60%;
}
.date_set .timeonly {
    width: 40%;
}
.help_icon {
    display: inline-block;
    width: 1.3rem;
    height: 1.3rem;
    vertical-align: bottom;
}

/* contact */
#wrapper .in_wrap_narrow {
    max-width: 800px;
}
.gray_wrap {
    padding: 1.8rem 4%;
    background: #f6f6f6;
    border-radius: 20px;
    border: 1px solid #FFF;
}
.contact_tel_wrap {
	max-width: 1000px;
	margin: 0 auto;
	padding: 2.5rem 1rem;
	font-size: 130%;
	background: #FFF;
	border: 1px solid #e1e1e1;
	border-radius: 20px;
}
.contact_tel_wrap > h3 {
	font-size: 115%;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1;
}
.contact_tel_wrap .c_icon_tel {
	margin: .2em auto .15em;
	position: relative;
}
.pe_tel {
	pointer-events: none;
}

/* gnav */
.gnav_menu > li {
    position: relative;
    z-index: 1;
}
.gnav_menu > li > div > a {
    padding: 1rem 0.8rem;
}
.gnav_child {
    display: flex;
    flex-direction: column;
    gap: 1px 0;
    width: 130%;
    position: absolute;
    z-index: 3;
    top: 100%;
    left: -50%;
    right: -50%;
    margin: auto;
    padding: 11px 0 0 0;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}
.gnav_menu > li:hover .gnav_child {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}
.gnav_child > li {
    background: rgba(255, 255, 255, 0.8);
}
#wrapper .gnav_child a {
    gap: 0.5em 0;
    min-width: 100%;
    padding: .5rem 1rem;
    font-size: 80%;
    white-space: nowrap;
}


/* sidenav、他 */
.inqtel_box {
	padding: 0 1rem 4.2rem;
}
.inqtel_box a {
	display: block;
	width: 18em;
	max-width: 100%;
	margin: .5rem auto 0;
	padding: .5em;
	background: #89c53f;
	border-radius: 50px;
	font-weight: bold;
	color: #FFF;
}
.inqtel_box a > span {
	font-size: 120%;
	line-height: 1;
	vertical-align: middle;
	padding-right: .5em;
}

/* footer */
.fnav_column_menu {
    max-width: 1200px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2rem;
	color: #FFF;
}
.fnav_column_menu > li {
    flex-grow: 1;   
}
.fnav_column_menu > li > p {
    position: relative;
    z-index: 1;
    display: inline-block;
    font-weight: bold;
    font-size: 90%;
    color: #939393;
}
.fnav_column_menu > li > p::after {
    content: "";
    position: absolute;
    right: -1.5rem;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 2;
    display: block;
    width: 1rem;
    height: 1px;
    background: #939393;
}
.fnav_column_menu .fnav_child {
	margin-top: .6rem;
}
.fnav_column_menu .fnav_child > li {
    margin: .3rem;
    margin-left: 1rem;
}
.fnav_column_menu .fnav_child > li a:hover {
	text-decoration: underline;
}
#footer .inqtel_box > li > a {
    text-align: center;
    background: #8c8c8c;
}
.inqtel_box_biko {
    margin: .4rem auto 0;
    color: #FFF;
}
.inqtel_box_biko > span {
    display: block;
    text-align: center;
}


/*============★★★画面サイズ変更(ここから)★★★============*/
@media screen and (min-width: 1201px){
	html {
		font-size: 110%;
	}
}

@media screen and (max-width: 1200px){
	html {
		font-size: 100%;
	}
}

@media screen and (max-width: 1040px) {
	html {
		font-size: 93.75%;
	}
}

@media screen and (max-width: 950px) {
	.pc_only {
		display: none;
	}
	.md_only {
		display: inline-block;
	}
	.header_in {
		position: relative;
		z-index: 3;
		padding: 0;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.header_in .header_title {
		padding: 2px 1rem 0;
		width: 5em;
		max-width: 5em;
	}
	.gnav_menu {
		margin: 0 0 0 auto;
		gap: 10px 1.5em;
	}
	.sp_nav_open > a:hover::after {
		content: none;
	}
	.sp_nav_open > a {
		display: block;
		position: relative;
		background: #000;
		height: 4rem;
		display: flex;
		align-items: center;
	}
	.sp_nav_open span {
		color: #FFF;
		font-size: 200%;
		font-size: 5vw;
		padding: 0 0.4em 0;
		line-height: 1;
		display: block;
		height: 1em;
	}
	.gnav_menu .btn_green {
		padding: .6em 2em .4em 1.5em;
	}
	.close_icon {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		opacity: 0;
	}
	.menu_icon {
		transition: .5s;
		opacity: 1;
	}
	.active .sp_nav {
		transition: all .3s;
		transform: translateZ(0);
	}
	.active .close_icon {
		transition: .5s;
		opacity: 1;
	}
	.active .menu_icon {
		opacity: 0;
	}
	body.active {
		position: fixed;
		left: 0px;
		right: 0px;
		top: 0px;
		bottom:0px;
    }
	.active .sp_nav_bg {
		content: "";
		display: block;
		position:fixed;
		z-index: 9;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		width: 100%;
		height: 100%;
		background: #00000091;
	}
	.sp_nav_menu {
		padding: 2.3rem 1rem 1rem;
	}
	.sp_nav_menu > li {
		padding: 0.7rem 0 0.5rem;
	}
	.sp_nav_menu > li > a > em {
		padding-right: .2rem;
		color: #9c9c9c;
		font-size: 90%;
	}
	.sp_nav_menu > .nav_in_hash {
		display: inline-block;
		padding: 1rem 4rem 0.6rem;
		margin: -.2rem auto .7rem;
		background: #ffffff54;
	}
	.sp_nav_menu .nav_in_hash li {
		padding: .1em 0;
	}
	.sp_nav_menu a {
		font-weight: bold;
		text-shadow:
			1px 1px 1px #FFF, -1px -1px 1px #FFF,
			-1px 1px 1px #FFF,  1px -1px 1px #FFF;
	}
	.sp_nav_menu a:hover {
		text-decoration: underline;
		text-decoration-color: #89c53f;
	}
	.sp_nav_menu .is-open > a {
		color: #89c53f;
		text-decoration: none;
	}
	.sp_nav_child {
		margin: .5rem auto 0;
	}
	.sp_nav_child li > a {
		margin: .2rem auto 0;
		display: block;
		padding: .5em .5em .6em;
		border-radius: 0.3rem;
		background: #ececec;
	}
.sp_nav_child {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.1s ease-in;
    margin: .5rem auto 0;
}
.dropdown.is-open > .sp_nav_child {
    max-height: 100vh;
    transition: max-height 0.5s ease-out;
}
.sp_nav_child li > a {
    margin: .2rem auto 0;
    display: block;
    padding: .5em .5em .6em;
    border-radius: 0.3rem;
    background: #ececec;
}


	
	/* contact */
	.contactbox {
		margin-top: 2rem;
	}
	.contact_kind {
		margin-bottom: 1rem;
	}
	.tb_simple th,
	.tb_simple th.no_require,
	.tb_simple td {
		width: 100%;
		display: block;
		padding: .5rem;
	}
}

@media screen and (max-width: 768px) {
	html {
		font-size: 87.5%;
	}
	.sp_nav_open span {
		font-size: 6vw;
	}

	/* inpage common */
	.tel_link {
		pointer-events: auto;
	}
	
	/* company */
	.company .tel_link {
		color: #477d03;
	}

	/* contact */
	.tb_simple_hn01 tr,
	.tb_simple_hn02 tr,
	.tb_simple_hn01 th,
	.tb_simple_hn02 th,
	.tb_simple_hn01 td,
	.tb_simple_hn02 td {
		display: block;
		width: 100%;
	}
	.tb_simple_hn01 tr,
	.tb_simple_hn02 tr {
		background: #FFF;
		border-radius: 10px;
	}
	.tb_simple_hn01 tr {
		margin: 1rem auto 0;
		padding: 0.2em 1em 1em;
	}
	.tb_simple_hn01 th,
	.tb_simple_hn01 td{
		padding: 0;
	}
	.tb_simple_hn01 tr:first-child {
		margin-top: 0;
	}
	.tb_simple_hn02 tr {
		margin: 1.3rem auto 0;
		padding: 0.2em 1em 1em;
	}
	.tb_simple_hn02 th,
	.tb_simple_hn02 td {
		text-align: center;
	    padding: 0em 1em .5rem;
	}
	.hopes_gaiyo2 > br {
	    display: block;
	}
}

@media screen and (max-width: 650px) {
	.tb_none {
		display: none;
	}
	.tb_only {
		display: inline-block;
	}

	/* contact */
	.btn_blue .tel_text {
		font-size: 90%;
	}
	.btn_blue .tel_text::after {
		content: "\A";
		white-space: pre;
	}
	.btn_blue .tel_num {
		margin-top: .1em;
		font-size: 120%;
	}
	.pe_tel {
		pointer-events: initial;
	}
	#footer {
	    padding: 1rem 1rem 0.8rem;
	    font-size: 75%;
	}
	#footer > small {
		margin: .4rem auto 0;
	}
}

@media screen and (max-width: 479px) {
	html {
		font-size: 81.25%;
	}
	.sp_only {
		display: inline-block;
	}
	#pagetop {
		display: none!important;
	}
	.sp_nav_open span {
		font-size: 7vw;
	}
	.gnav_menu {
		gap: 10px .8em;
	}
	.gnav_menu .btn_green {
		font-size: 95%;
	}
		
	/* スクロールCSS */
	.fade-in {
		transition-duration: .3s;
	}
	.delay-1,
	.delay-2,
	.delay-3,
	.delay-4,
	.delay-5 {
		transition-delay: unset;
	}
	.sp_nomove .fade-in {
		opacity: 1;
		transform: translate(0, 0);
		transition-duration: 0s;
	}

	/* table(company) */
	.table th,
	.table td {
		display: block;
		width: 100%;
	}
	.table th {
		padding: .7rem .5rem .5rem;
	}
	.table th:after{
		top:auto;
		bottom: -6px;
		left: 0;
		right: 0;
		margin: auto;
		border-top: 7px solid #89c53f;
		border-right: 7px solid transparent;
		border-left: 7px solid transparent;
		border-bottom: none;
	}

	.span_wrap_lead > span {
		display: inline;
	}

	/* footer */
	.fnav_column_menu > li {
		min-width: calc((100%  - 2rem) / 2);
		max-width: calc((100%  - 2rem) / 2);
		font-size: 140%;
	}
	.fnav_column_menu .fnav_child > li > a {
		padding: 0.3rem;
        display: inline-block;
	}
	#footer .inqtel_box {
		padding: 0 1rem 4.2rem;
		font-size: 150%;
	}
	#footer .inqtel_box > li {
		font-size: 120%;
	}
}

@media screen and (max-width: 399px) {
	html {
		font-size: 75%;
	}
}
/*============★★★画面サイズ変更(ここまで)★★★============*/