/*
Theme Name: Arkhe Child
Template: arkhe
Description: Arkheの子テーマです。
Version: 1.0
*/

/****************************************************************
* フォント用
****************************************************************/

.noto-sans-jp-<uniquifier> {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.roboto-<uniquifier> {
  font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

.roboto-condensed-<uniquifier> {
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

/****************************************************************
* 全体
****************************************************************/
body {
	font-family: "Noto Sans JP", sans-serif;
	font-feature-settings: "palt";
	font-weight: 300;
}
:root{
	--main-color: #00a6b1;
	--sub-color: #ffae32;
	--back-color: #e5f6f7;
	--text-color: #3e3a39;
}

/****************************************************************
* 矢印ボタン
****************************************************************/
.arrow-btn .wp-block-button__link{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.arrow-btn .wp-block-button__link::after{
	content: "→";
	position: absolute;
	right: 25px;
	top: 50%;
	transform: translateY(-50%);
	transition: transform .2s ease;
}

.arrow-btn .wp-block-button__link:hover::after{
	transform: translateY(-50%) translateX(5px);
}

/****************************************************************
* ヘッダー
****************************************************************/
#header{
	border-top:10px solid var(--main-color);
}
#header .l-container{
	max-width:1600px;
	height:100px;
}

.c-gnav li a{
	font-weight:400;
	font-feature-settings: normal;
	padding: 16px 20px!important;
	font-size:16px;
	position:relative;
}

.c-gnav li:not(:last-child) a::after{
	content:"";
	position:absolute;
	left:0;
	bottom:20px;
	width:100%;
	height:1px;
	background:var(--main-color);
	transform:scaleX(0);
	transform-origin:left;
	transition:transform .3s ease;
}

.c-gnav li:not(:last-child) a:hover::after{
	transform:scaleX(1);
}

.c-gnav .current-menu-item > a,
.c-gnav .current_page_item > a,
.c-gnav .current-menu-ancestor > a{
	color:var(--main-color);
}

/* お問い合わせボタン */
.c-gnav > .menu-item:last-child > a{
	height:45px;
	width:180px;
	margin-left:20px;
	background:var(--sub-color);
	color:#fff !important;
	border-radius:999px;
	padding:0 16px !important;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	flex-direction:row !important;
	gap:12px;
	box-shadow:0 6px 16px rgba(0,0,0,.15);
	transition:background .25s ease, transform .25s ease, box-shadow .25s ease;
}

/* 矢印 */
.c-gnav > .menu-item:last-child > a::after{
	content:"›";
	display:inline-flex;
	align-items:center;
	justify-content:center;
	position:static !important;
	width:auto;
	height:1em;
	margin-left:8px;
	background:none;
	font-size:30px;
	line-height:1;
	font-weight:400;
	transform:translateY(-4px) !important;
}

/* ホバー */
.c-gnav > .menu-item:last-child > a:hover{
	background:#ff9a1f;
	transform:translateY(-2px);
}

/* 矢印を少し動かす */
.c-gnav > .menu-item:last-child > a:hover::after{
    transform:translateX(4px);
}

/* 現在ページでも白文字 */
.c-gnav > .menu-item:last-child.current-menu-item > a{
    color:#fff !important;
}
/* お問い合わせボタンをヘッダー内で縦中央に */
.c-gnav > .menu-item:last-child{
	display:flex;
	align-items:center;
}

@media screen and (max-width: 767px) {
#header{
	border-top:5px solid var(--main-color);
}
#header .l-container{
	max-width:1600px;
	height:auto;
}
}	
@media screen and (max-width: 480px) {
[data-btns=r-l] .l-header__body {
    grid-template-columns: var(--ark-searchW) calc(5% - var(--ark-searchW)) 70% calc(25% - var(--ark-drawerW)) var(--ark-drawerW);
}
.c-iconBtn__icon {
    font-size: 30px;
	height: 30px;
	width: 30px;
}
}
/****************************************************************
*  ドロワー
****************************************************************/
.p-drawer {
    background: #fef2ea;
    color: #231815;
    font-size: .9rem;
    height: 100%;
    left: 0;
    padding: var(--ark-header_height) 0 1rem;
    position: fixed;
    top: 0;
    transition: opacity .5s, visibility .5s;
    width: 100%;
    z-index: 1;
}
.c-iconBtn{
    color: #231815;
}
.p-drawer{
	background-color:var(--back-color);
}
/****************************************************************
*  フッター
****************************************************************/
.l-footer{
	background-color:var(--back-color);
}
.l-footer__widgets{
	padding:0 1rem!important;
}
.l-footer .widget_nav_menu {
	text-align:center;
}
.l-footer .widget_nav_menu .menu {
  display: flex;
  flex-wrap: wrap;
  gap: 0 2em;
  list-style: none;
  margin: 0;
  padding: 0;
}

.l-footer .widget_nav_menu .menu > li {
  width: auto;
  margin: 0;
  padding: 0;
  border: none;
}

.l-footer .widget_nav_menu .menu > li > a {
  display: block;
  padding: 0.5em 0;
  text-decoration: none;
}
.widget_nav_menu .menu {
  border: none !important;
}
.fotter-column{
gap:50px!important;
max-width:1000px;
margin-left:auto;
margin-right:auto;
}
@media screen and (max-width: 767px) {
  .l-footer .widget_nav_menu .menu {
    display: block;
  }
.fotter-column{
	gap:10px!important;
}
.fotter-column .wp-block-column figure{
margin-left:auto;
margin-right:auto;
}
.fotter-column .wp-block-group{
margin-left:auto;
margin-right:auto;
	text-align:center;
	}
}
/****************************************************************
*  固定ページヘッダー
****************************************************************/
.p-topArea {
    min-height: 200px;
}
.p-topArea.-noimg {
	background:var(--back-color);
  background-image:
    radial-gradient(circle, rgba(255,255,255,.75) 1.35px, transparent 1.35px);
  background-size: 5px 5px;
  background-position: 0 0;
	padding:0!important;
}
.c-pageTitle__main{
	font-size:36px;
	color:var(--main-color);
	text-shadow:none;
	font-weight:600;
	font-feature-settings: normal;
}
@media screen and (max-width: 767px) {
.p-topArea {
    min-height: 150px;
}
.c-pageTitle__main{
	font-size:28px;
	font-feature-settings: "palt";
}
}

/****************************************************************
*  見出し
****************************************************************/
.midashi-h2{
	max-width:500px;
	margin-left:auto;
	margin-right:auto;
}
.midashi-h2 h2{
	font-size:38px;
	font-weight:500;
	border-bottom:1px solid var(--main-color);
	padding-bottom:15px;
	line-height:1.4em;
}
.midashi-h2 h3{
	font-size:22px;
  font-family: "Roboto Condensed", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
	padding-top:10px;
}
.midashi-h2 em{
	font-size:28px;
	font-style:normal;
}

@media screen and (max-width: 781px) {
.midashi-h2 h2{
	font-size:34px;
}
}

@media screen and (max-width: 480px) {
.midashi-h2 h2{
	font-size:28px;
	padding-bottom:15px;
}
.midashi-h2 h3{
	font-size:18px;
	}
.midashi-h2 em{
	font-size:26px;
	font-style:normal;
}
}
/****************************************************************
*  TOPヒーロー部分
****************************************************************/
.top-hero {
  background-color: #dff4f7;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.75) 1.35px, transparent 1.35px);
  background-size: 5px 5px;
  background-position: 0 0;
	padding:0!important;
}
.hero-columns{
	padding:40px 0;
	width:90vw!important;
	max-width:1100px;
}

.hero-img img {
	display: block;
	width: auto !important;
	height: 400px !important;
	max-width: 100%;
	object-fit: contain;
	border-radius: 10px;
	margin-inline: auto;
	margin-left:auto;
	margin-right:0;
}
.hero-h2{
	font-size:44px;
	font-weight:600;
	font-feature-settings: normal;
}
.hero-0yen{
max-width:385px;	
}

@media (max-width: 1200px) {
.hero-h2{
	font-size:4vw;
	font-feature-settings: "palt";
}
.hero-img img {
	display: block;
	width: auto !important;
	height: auto !important;
	max-width: 100%;
	object-fit: contain;
	border-radius: 10px;
	margin-inline: auto;
}
}
@media (max-width: 781px) {
.hero-columns{
	padding:30px 0 0 0;
	width:100vw!important;
}
.hero-h2{
font-size:min(7vw,45px)!important;
}
.hero-0yen{
max-width:500px;
width:80vw;	
margin-left:auto;
margin-right:auto;
}
.hero-img img {
width: 100% !important;
}
.hero-img {
height: 70vw !important;
overflow:hidden;
}
}

@media screen and (max-width: 500px) {
.hero-h2{
font-size:min(8.5vw,40px)!important;

}
.hero-img {
height: 70vw !important;
overflow:hidden;
}
}

/****************************************************************
*  TOPコンテンツ部分
****************************************************************/
.catch-txt{
	font-size:18px;
}
h4.top-service-h4{
	font-size:26px;
	font-weight:500;
}
.top-service-kingaku{
	font-weight:400;
	font-size:18px;
}
.top-service-kingaku strong{
	font-weight:400!important;
	font-size:28px;
}
.kuwashiku-btn a{
	font-size:16px;
	padding:10px 30px!important;
	transition: transform .2s, background .2s!important;
}
.kuwashiku-btn a:hover{
    background-color: #007c8a!important;
    transform: translateY(-2px);
	opacity:1!important;
}
.onayami-h2,
.kaiketsu-h2{
	font-weight:500;
	font-size:36px;
	line-height:1.35;
}
.onayami-div {
  position: relative;
  border-radius: 10px;
	padding:30px 70px!important;
	max-width:1000px;
	margin-left:auto;
margin-right:auto;
}
/* 下の三角形 */
.onayami-div::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -40px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
border-left: 90px solid transparent;
border-right: 90px solid transparent;
  border-top: 40px solid var(--back-color);
}
.onayami-image img{
	max-height:310px;
	width:auto;
}

.check-column .wp-block-group{
margin-left:auto;
margin-right:auto;
}
.check-list {
  margin: 0;
  padding: 0;
  list-style: none;
	margin-top:20px!important;
}

.check-list li {
  position: relative;
  padding-left: 50px;
  margin-bottom: 18px;
  font-size: 18px;
  line-height: 1.35;
}

.check-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 40px;
  height: 40px;
  transform: translateY(-50%);
  background: url("/test-page/wp-content/uploads/2026/07/check.png") no-repeat center / contain;
}

.kaiketsu-image img{
	width:auto;
	max-height:315px;
}
.kaiketsu-image-sp img{
	width:auto;
	max-height:200px;
	padding-left:10%;
}
.kaiketsu-txt{
	font-size:18px;
}
.contact-btn a {
	font-size:18px!important;
  background: #fff !important;
  transition: background-color 0.3s ease !important;
	transition: transform .2s, background .2s!important;
	  box-shadow: 0 0 10px 0 rgba(0, 0, 0, .2);
}

.contact-btn a:hover {
	opacity:1!important;
  background: var(--sub-color) !important;
	color:#fff!important;
    transform: translateY(-3px);
}

@media screen and (max-width: 768px) {
.onayami-h2,
.kaiketsu-h2{
	text-align:center!important;
}
.onayami-div {
  border-radius: 10px;
	padding:30px 20px!important;
}
}
@media screen and (max-width: 480px) {
.catch-txt{
	font-size:16px;
	text-align:left!important;
}
h4.top-service-h4{
	font-size:24px;
	line-height:1.35;
}
.top-service-kingaku{
	font-size:16px;
}
.top-service-kingaku strong{
	font-size:26px;
}
.onayami-h2,
.kaiketsu-h2{
	font-size:7.5vw;
}
.check-list li {
  position: relative;
  padding-left: 40px;
  margin-bottom: 18px;
  font-size: 17px;
}
.check-list li::before {
  width: 30px;
  height: 30px;
}
.kaiketsu-txt{
	font-size:16px;
}
}


/****************************************************************
*  サービスページ
****************************************************************/
.contents-top-columns h2{
	font-size:32px;
	font-weight:600;
	line-height:1.65em;
}
.contents-top-columns p{
	font-size:16px;
	line-height:2em;
}
.contents-top-columns img{
	border-radius:7px;
}
.service-columns{
	
}
.service-columns .txt{
	font-size:18px;
	line-height:2em;
}
.riyo-columns{
	border:solid 4px #e0f4f6;
	padding:15px;
	row-gap:15px!important;
}
.riyo-columns h4{
	font-size:18px;
	font-weight:400;
	padding-bottom:3px;
	background:var(--main-color);
	color:#fff;
	margin-top:5px!important;
	max-width:150px!important;
	margin-left:auto;
	margin-right:auto;
}
.riyo-columns .riyo-list{
	line-height:2em;
	font-feature-settings: normal;
	font-size:18px;
}
.riyo-columns strong{
	font-weight:600;
}

.taio-h4{
	font-size:22px;
	font-weight:400;
	padding:5px 0 8px 0;
	background:var(--main-color);
	color:#fff;
	margin-top:5px!important;
	max-width:125px!important;
	margin-left:auto;
	margin-right:auto;
}
.taio-grid .icon-group{
	margin:8px;
	padding:8px 8px 15px 8px;
}
.price-group{
	font-size:23px;
	line-height:3em;
	border-radius:10px;
	max-width:900px;
	margin-left:auto;
	margin-right:auto;
}
.price-group mark{
	font-size:28px;
	font-weight:600;
	padding-left:15px;
}
.price-group mark strong{
	font-size:48px;
}
.price-group .caution{
	font-size:14px;
	line-height:1.5em;
	margin-bottom:30px!important;
}
.service-columns{
	column-gap:80px!important;
}
@media screen and (max-width: 768px) {
.contents-top-columns h2{
	font-size:28px;
}
.price-group{
	line-height:2.5em;
}
.price-group mark{
	line-height:1em;
}
}
@media screen and (max-width: 570px) {
.taio-grid{
    --smb-grid--column-min-width: 140px!important;
}
}
@media screen and (max-width: 480px) {
.contents-top-columns h2{
	font-size:26px;
}
.contents-top-columns p{
	font-size:16px;
}
.service-columns .txt{
	font-size:16px;
}
.riyo-columns .riyo-list{
	font-size:16px;
}
.taio-grid{
    --smb-grid--column-min-width: 100px!important;
}
.taio-grid .icon-group{
	margin:4px;
	padding:0px 1px 10px 1px;
	font-size:12px;
}
.price-group{
	font-size:22px;
}
.price-group .caution{
	margin-bottom:20px!important;
}
}

/****************************************************************
*  会社概要
****************************************************************/
.over-view{
	max-width:900px;
	margin-left:auto;
	margin-right:auto;
}
.over-view div{
	border-color:#9f9d9c!important;
	border-left:none!important;
	border-right:none!important;
}
.over-view .smb-information__item .smb-information__item__label{
	padding:10px 20px!important;
	background-color:var(--back-color);
}
.over-view .smb-information__item__body{
	padding:10px 20px!important;
}

@media screen and (max-width: 639px) {
.over-view .smb-information__item .smb-information__item__label{
	padding:5px 20px!important;
	border-bottom:0;
}
.over-view .smb-information__item__body{
	padding:5px 20px!important;
}
}

/****************************************************************
*  お問い合わせ
****************************************************************/
.page-id-18 .p-topArea{
	min-height: 100px;
}
.page-id-18 .c-pageTitle__main {
font-size: 28px;
}
.contact-tel a{
	text-decoration:none;
}
/****************************************************************
*  お問い合わせ フォーム
****************************************************************/
/* Snow Monkey Formsに必須マークをつける */
.smf-item__label__text {
    position: relative;
}
.smf-item__controls p{
	margin-top:5px;
}
.smf-item:has([data-validations~="required"]) .smf-item__label__text::after {
  position: absolute;
  top: 50%;
  right: -50px;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 40px;
  height: 23px;
  border-radius: 0px;
  content: "必須";
  font-size: 12px;
  color: #fff;
  background:var(--sub-color);
}
.smf-checkboxes-control__control{
	display: flex!important;
align-items: center;
justify-content: center;
}