/*
Theme Name: 多業種対応HPシステム(CMSテーマ)【Hide Professional Theme】ITツールNo:TL29-0042726
Theme URI:     https://yamato.studio/package/
Author: 株式会社大和(Yamato)
Author URI: https://yamato.studio/
Description: CMS(Wordpress)のスクラッチテーマです。 CMSホームページ導入により売上アップおよび業務効率化が可能です。（既存顧客の維持、新規顧客獲得、エンドユーザー様の利便性の向上、売上向上、顧客管理）ブログやホームページ内の更新はもちろん、メールフォームの追加や編集、予約機能の切り替え、受発注処理を行うことのできるパッケージテーマです。 お客様のビジョンを明確にし、目標設定、ブランディングからペルソナデザインまで行い、お客様にとっての最良のホームページという24時間不眠不休で働く営業マンを作成いたします。 それによりPRやお問合せ受付、社内でのお知らせによる情報共有、予約スケジュール、顧客管理と生産性を向上させます。 下記内容がサーバーにアップしテーマを有効化した状態で行いますので、すぐに運用を開始できます。 ・ブログの更新、お知らせの更新、ページ内の更新は、プログラムの言語が分からなくても直感的に行えます。 ・情報をカテゴリーごとに分けユーザーがほしい情報にたどりつきやすくなっております。 ・管理画面内で使用、不使用を選択できるので今後の展開も視野に入れてお使いいただけます。 ・メール機能も簡単にカスタマイズできるのでお問合せ以外に受注発注の処理も一貫して行うことができます。 ・メールにて収集したメールアドレスを管理することも可能です。 ・お客様の声など、現場の声をより簡単に更新が行えます ・タイムスケジュール、カレンダーの同期も行えます。
Version: 1.0.2
*/

:root { 
	--main:#0FD0C9;
	--sub:#F7FF38;
	--third:#FFAF17;
	--gray:#F3F6F8;
	--gray2:#EAEAEA;
	--gray3:#909090;
	--fc:#062542;
	--bgw:#FFFFFF;
	--gradation: linear-gradient(to right,#0EB291,#3FB4D5);
	--shadow: 0 3px 10px rgba(0,0,0,.16);
	--shadow2: 0px 5px 11px rgba(0,0,0,.16);
	--shadow3: 0px 0px 40px rgba(22,140,189,.30);
    --noto:"Noto Sans JP","小塚ゴシック Pro","游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	--os:"Oswald","游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
    --msd:'Mrs Saint Delafield', cursive,"游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	--poppins:"Poppins","游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	--cen: Futura,"Century Gothic","Noto Sans JP","小塚ゴシック Pro","游ゴシック", Meiryo, sans-serif;
    --fz0:1.2rem;
    --fz1:1.4rem;
    --fz2:1.6rem;
    --fz3:1.8rem;
    --fz4:2.4rem;
    --fz5:3.6rem;
    --fz6:20.0rem;
}

body {
  background: var(--bgw);
  color: var(--fc);
  font-family: var(--noto);
  font-size: 1.6rem;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
}


.os{font-family: var(--os);}
.msd{font-family: var(--msd);}

/* 背景色 */
.bg_gray{background-color: var(--gray);}
.bg_w{background-color: var(--bgw);}


/* アコーディオン */
.acMenu > dd{display: none;}

/* ------------------------------------------------------------------------- *
 *  WordPressのネイティブcss
/* ------------------------------------------------------------------------- */

.blog_article_area p {
    display: block;
    margin: 1em 0;
}
.blog_article_area h1, h2, h3, h4, h5, h6 ,ul,li,img,table,tr,th,td,dl,dt,dd{
	font-weight: normal;
	margin: 0px;
	padding: 0px;
	border: none;
	list-style-type: none;
}

.blog_article_area strong { font-weight: bold; }
.blog_article_area em { font-style: italic; }
.blog_article_area blockquote {
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 40px;
    -webkit-margin-end: 40px;
}


/*  base : img
/* ------------------------------------ */
.blog_article_area .aligncenter {
    display: block;
    margin: 0 auto;
}
.blog_article_area .alignright { float: right; }
.blog_article_area .alignleft { float: left; }
img[class*="wp-image-"],
.blog_article_area img[class*="attachment-"] {
    max-width: 100%;
    height: auto;
}

.breadcrumb {
    white-space: nowrap;
    overflow: hidden;
}


/* ------------------------------------------------------------------------- *
 *  WP-PageNavi
/* ------------------------------------------------------------------------- */
.wp-pagenavi {
    display: flex;
    justify-content: center;
}
.wp-pagenavi span,
.wp-pagenavi a {
    display: inline-block;
    min-width: 28px;
    padding: 0 2px;
    margin: 0 6px;
    text-align: center;
    border: 1px solid #000;
    font-size: 1.6rem;
    line-height: 32px;
}
.wp-pagenavi .pages {
    padding: 0 10px;
}
.wp-pagenavi .current {
    font-weight: bold;
    background-color: #ccc;
}






/* CSS Document */


.site_wrapper {
  width: 1200px;
  margin: 0 auto;
  text-align: left;
  position: relative;
}
@media screen and (max-width: 767px) {
  .site_wrapper {
    width: 100%;
    box-sizing: border-box;
  }
}

.indent_content {
  padding: 100px 0;position: relative;
}
@media screen and (max-width: 767px) {
  .indent_content {
    padding: 50px 15px;
  }
}

.sp_indent15_lr {}
@media screen and (max-width : 767px) {
  .sp_indent15_lr {
    padding: 0 15px;
  }
}

#wrapper_all {
  text-align: center;
  min-width: 1240px;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 767px) {
  #wrapper_all {
    min-width: 100%;
  }
}

/* hd_nav　ヘッダー
-------------------------------------------------------------------*/

.bg_h1 {width: 100%;
  padding: 5px;
  font-size: 1.2rem;
  background: var(--main);
  color: #fff;text-align: left;
}
.bg_f1 {
  background: var(--bgw);
  color: #000;text-align: center;
  padding: 15px 0;
  font-size: 1.6rem;
}
@media screen and (max-width: 767px) {
  .bg_h1, .bg_f1 {
    padding: 5px 15px;
    font-size: 1.2rem;
  }
}

header.header{position: relative;}

.header_02{display: none;}
.header_02{position: fixed;width: 100%;background-color: var(--bgw);z-index: 1000;}
/*
[data-scroll="true"] header.header{
	position: fixed;width: 100%;background-color: var(--bgw);z-index: 100;
}
[data-scroll="true"] header.header .bg_h1{display: none;}
*/
.header_in{position: relative;}

.head_mail_btn a{background: var(--gradation);width: 100%;text-align: center;color: #fff;padding: 15px 30px;border-radius: 10px;}
.head_mail_btn a img{margin-right: 10px;}
.cta_btn{width: 400px;max-width: 100%;margin-top: 20px;z-index: 200;}
.cta_btn a{background: var(--third);width: 100%;text-align: center;color: #fff;padding: 15px 30px;border-radius: 20px;font-weight: bold;font-size: 2.4rem;}
.cta_btn img{margin-right: 15px;vertical-align: middle;}

@media screen and (max-width: 767px) {
.head_mail_btn{width: 64px;height: 64px;top: 0;right: 64px;}
.head_mail_btn a{width: 100%;height: 64px;}
    .head_mail_btn a svg{width: 30px;}
	.cta_btn{max-width: 100%;margin: 40px auto;}
	.cta_btn a{font-size: 1.8rem;width: 310px;padding: 15px;margin: auto;display: block;}
}

.header_in .area_hd01{
display: flex;
justify-content: space-between;align-items: center;}
    
.area_hd01 .left_area{width: 100px;padding: 15px 0;}
.area_hd01 .right_area{}


@media screen and (max-width: 767px) {
.area_hd01 .left_area{width: 120px;padding: 20px 0 20px 15px;}
    .area_hd01 .right_area{width: 64px;height: 64px;margin: 0;text-align: center;align-items: center; background-color: var(--main);display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;justify-content: center;}
}

.g_nav > ul{
display: flex;
justify-content: space-between;
}/*
.g_nav >ul > li{border-left: 1px solid var(--gray2);}
.g_nav >ul > li:nth-child(1){border-left: none;}*/
.g_nav > ul > li > a {
  display: block;
  font-weight: 500;
  font-size: 1.8rem;
  text-align: center;
  line-height: 1.2;
	padding: 15px 30px;letter-spacing: 0.1em;
}
.g_nav li a:hover,.g_nav li.current a{
	color: #ccc;
}
.g_nav > ul > li > a svg{vertical-align: top;margin-right: 10px;}



/*ナビのスタイル*/
nav.NavMenu{
position: fixed;
z-index: 300;
top: 0;
left: 0;
background: var(--main);
text-align: center;
width: 100%;
height: 100%;
display: none;
}

nav.NavMenu ul{
width: 100%;
margin: 0 auto;
padding: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
}

nav.NavMenu ul li{
font-size: 24px;
list-style-type: none;
width: 100%;
padding-bottom: 0px;
}

nav.NavMenu ul li:last-child{
padding-bottom: 0;
}

nav.NavMenu ul li a{
display: block;
padding: 15px 0;
font-weight: bold;
font-size: 18px;color: var(--bgw);
}

/*ボタンのスタイル*/
.Toggle {
position: relative;
width: 30px;
height: 28px;
cursor: pointer;
z-index: 330;
display: block;
}

.Toggle span {
display: block;
position: absolute;
width: 30px;
border-bottom: solid 4px var(--bgw);
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
transition: .35s ease-in-out;
left: 0;
}

.Toggle span:nth-child(1) {
top: 0px;
}

.Toggle span:nth-child(2) {
top: 11px;
}

.Toggle span:nth-child(3) {
top: 22px;
}

.Toggle.active span:nth-child(1) {
top: 8px;
left: 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
border-bottom: solid 3px #fff;
}
.Toggle.active span:nth-child(2),
.Toggle.active span:nth-child(3) {
top: 8px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
border-bottom: solid 3px #fff;
}


.tit_cat {background-color: var(--main);text-align: center;padding: 10px 20px;font-weight: bold;font-size: 2.0rem;display: inline-block;}
@media screen and (max-width: 767px) {
    .tit_cat{font-size: 1.4rem;}
}

.bd_04{border-bottom: 4px solid var(--sub);}

.col_2{
display: flex;flex-wrap: wrap;justify-content: space-between;}
.col_2 > li{width: 47%;margin-bottom: 60px;}
@media screen and (max-width: 767px) {
.col_2 > li{width: 100%;margin-bottom: 60px;}
}

.col_3{display: flex;flex-wrap: wrap;justify-content: space-between;}
.col_3 > li{width: 30%;}

@media screen and (max-width: 767px) {
.col_3{justify-content: center;}
 .col_3 > li{width: 100%;margin-bottom: 60px;}
}

.col_3_center{display: flex;flex-wrap: wrap;justify-content: center;grid-gap:80px 5%;}
.col_3_center > li{width: 30%;}

@media screen and (max-width: 767px) {
.col_3_center{justify-content: center;grid-gap:0 0;}
 .col_3_center > li{width: 100%;margin-bottom: 60px;overflow: hidden;}
}

.col_3_service{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 100px;}
.col_3_service > li{width: 30%;position: relative;margin-bottom: 40px;}
.col_3_service > li figure{text-align: center;}
.col_3_service > li::before{content: ""; display: block;position: absolute;left: 0;bottom: -20px;width: 100%;height: 1px;background-color: var(--gray2);}
.col_3_service > li::after{content: ""; display: block;position: absolute;right: -25px;top: 0;width: 1px;height: 100%;background-color: var(--gray2);}
.col_3_service > li:nth-child(3):after,.col_3_service > li:nth-child(6):after{content: ""; display: none;}
.col_3_service > li:nth-child(4):before,.col_3_service > li:nth-child(5):before,.col_3_service > li:nth-child(6):before{content: ""; display: none;}

@media screen and (max-width: 767px) {
.col_3_service{justify-content: center;margin-bottom: 0px;}
.col_3_service > li{width: 100%;margin-bottom: 0;overflow: hidden;}
	.col_3_service > li:nth-child(6){margin-bottom: 0;}
.col_3_service > li::before{display: none;}
.col_3_service > li::after{display: none;}
}
.col_3_service .tit{font-size: 2.0rem;font-weight: bold;text-align: center;padding: 20px 0;}
.col_3_service .txt{margin-bottom: 40px;}


/* トップページ */
.main_slider_wrap{position: relative;}
.main_txt{background: url("img/top/bg_main.webp")no-repeat center center /cover;padding: 80px 0 180px 0;position: relative;}
.main_txt canvas{
	position:absolute;/*親のブロックを基準にして相対位置に配置する*/
	/*位置指定*/
	top:0;
	right:0;
	/*z-index:-1;重ね順を-1に　※1以上だとほかのコンテンツの上に被さってしまいます*/
}


.main_txt .main_txt_01{font-size: 6.0rem;font-weight: bold;    line-height: 1.3;
    margin-bottom: 40px;letter-spacing: 3px;}
.main_txt .main_txt_02{background:var(--gradation);font-size: 2.4rem;display: inline-block;clear: both;color: #fff;font-weight: bold;padding: 15px 30px;margin-bottom: 15px;}

@media screen and (max-width: 767px) {
.main_txt{padding: 40px 15px 40px 0px;}
.main_txt .main_txt_01{font-size: 2.4rem;font-weight: bold;padding: 0 0 0 15px;letter-spacing: 0.1em;}

.main_txt .main_txt_02{font-size: 1.8rem;font-weight: bold;padding: 10px 15px;margin-bottom: 10px;letter-spacing: 0.1em;}
}

.z_200{z-index: 200;}


.top_our_bg{background: url("img/top/bg_02.webp")no-repeat center center;background-attachment: fixed;}
.top_our{display: flex;flex-wrap: wrap;justify-content: space-between;padding: 100px 0 60px 0;}
.top_our .left_area {width: 44%;text-align: left;}
.top_our .right_area {width: 52%;}
.top_our_copy{font-size: 3.0rem;font-weight: bold;margin-bottom: 40px;line-height: 2.0;
    letter-spacing: 0.2rem;}
.top_our_copy span{display: inline-block;position: relative;}
.top_our_copy span::after{content: "";background:var(--gradation);height: 8px;width: 100%;left: 0;bottom: -5px;position: absolute;}
.top_our_txt_box{width: 610px;max-width: 100%;text-align: left;float: left;}
.item1 .top_our_txt_box {
	float: right;
}
.top_our_txt_box p,.top_our_txt_02 p{margin-bottom: 25px;font-size: 1.6rem;}
@media screen and (max-width: 767px) {
    .top_our{display: block;padding: 50px 0 50px;}
.top_our_copy{font-size: 2.2rem;margin-bottom: 40px;}
.top_our .left_area {width: 100%;margin-bottom: 20px;}
.top_our .right_area {width: 100%;}
    .top_our_txt_box{width: 100%;float: none;margin-bottom: 0px;}
	.top_our_txt_box p,.top_our_txt_02 p{margin-bottom: 15px;font-size: 1.4rem;}
}

.ttl_01_box{text-align: center;margin-bottom: 60px;position: relative;}
.ttl_01{font-size: var(--fz5);font-weight: bold;margin: 20px 0 10px 0;}
.ttl_01 span{display: inline-block;
    position: relative;}
.ttl_01 span::after {
    content: "";
    background: var(--gradation);
    height: 8px;
    width: 100%;
    left: 0;
    bottom: -5px;
    position: absolute;
}
.ttl_01_box .en{font-weight: bold;font-size:var(--fz3);position: relative;}
/*.ttl_01_box::after{content: ""; position: absolute;left: 50%;bottom: -15px;font-weight: bold;margin-left: -20px;width: 40px;height: 1px;background-color: var(--main);display: block;}*/

@media screen and (max-width: 767px) {
.ttl_01{font-size: var(--fz4);font-weight: bold;margin: 20px 0 10px 0;}
    .ttl_01_box .en{font-size: var(--fz2);}
}

.ttl_02{font-size: var(--fz5);text-align: center;font-weight: bold;margin: 20px 0 80px 0;text-transform: capitalize;position: relative;}
.ttl_02 .jp{font-weight: bold;font-size:var(--fz3);position: relative;}
.ttl_02::after{content: ""; position: absolute;left: 50%;bottom: -15px;font-weight: bold;margin-left: -20px;width: 40px;height: 1px;background-color: var(--main);display: block;}

@media screen and (max-width: 767px) {
.ttl_02{font-size: var(--fz4);font-weight: bold;margin: 20px 0 40px 0;}
    .ttl_02_box .en{font-size:var(--fz2);}
}

.ttl_03{font-size: var(--fz5);text-align: left;font-weight: bold;margin: 20px 0 80px 0;text-transform: capitalize;position: relative;}
.ttl_03 .jp{font-weight: bold;font-size:var(--fz3);position: relative;}
.ttl_03::after{content: ""; position: absolute;left: 0;bottom: -15px;font-weight: bold;margin-left: 0px;width: 40px;height: 1px;background-color: var(--main);display: block;}

@media screen and (max-width: 767px) {
.ttl_03{font-size: var(--fz4);font-weight: bold;margin: 20px 0 40px 0;}
    .ttl_03_box .en{font-size:var(--fz2);}
}


.ttl_04{font-size: var(--fz4);text-align: left;font-weight: bold;margin: 20px 0 80px 0;text-transform: capitalize;position: relative;}
.ttl_04::after{content: ""; position: absolute;left: 0;bottom: -15px;font-weight: bold;margin-left: 0px;width: 40px;height: 1px;background-color: var(--main);display: block;}

@media screen and (max-width: 767px) {
.ttl_04{font-size: var(--fz3);font-weight: bold;margin: 20px 0 40px 0;}
}

.ttl_0a{font-size: 1.8rem;font-weight: bold;margin-bottom: 80px;}
.ttl_0a span{
	font-size: 6.0rem;letter-spacing: 0.1em;
	margin-right: 15px;
	font-family: var(--poppins) ;
	background: var(--gradation);
    background: -webkit-var(--gradation);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;font-weight: 600;
}

.ttl_0b{font-size: 1.8rem;font-weight: bold;color: var(--bgw);margin-bottom: 60px;}
.ttl_0b span{
	font-size: 6.0rem;letter-spacing: 0.1em;
	margin-right: 15px;
	font-family: var(--poppins) ;
	color: var(--bgw);
	font-weight: 600;

}

@media screen and (max-width: 767px) {
	.ttl_0a,.ttl_0b{font-size: 1.2rem;margin-bottom: 30px;}
	.ttl_0a span,.ttl_0b span{font-size: 2.8rem;}
}

.y_circle figure{background-color: var(--main);width: 300px;height: 300px;margin: auto;text-align: center;align-items: center;border-radius: 50%;
display: flex;justify-content: center;}


/* パンくずリスト
-------------------------------*/
nav#breadcrumbs {
  padding: 10px 0 10px;
}
@media screen and (max-width: 767px) {
  nav#breadcrumbs {
    padding: 10px 15px 30px;
  }
}
nav#breadcrumbs ol{
display: flex;
    justify-content: flex-start;
}
nav#breadcrumbs ol li {
  display: inline;
  list-style-type: none;
  font-size: 1.2rem;
}
nav#breadcrumbs ol li:before {
  content: "　>　";
}
nav#breadcrumbs ol li:first-child:before {
  content: "";
}
nav#breadcrumbs ol li img{vertical-align: text-bottom;}

/* トップページ */

.col_3_center .tit{font-size: 2.0rem;font-weight: bold;text-align: center;margin-bottom: 20px;padding-bottom: 20px;border-bottom: 2px solid var(--fc);}

.nayami figure{border-radius: 10px;overflow: hidden;}

.bg_01{background: url("img/top/bg_01.webp")no-repeat center bottom;background-attachment: fixed;}
.box_service{background: var(--bgw);box-shadow: var(--shadow3);border-radius: 10px;padding: 120px 100px;margin-bottom: 100px;}

.top_interview_img{position: relative;min-height: 400px;margin-bottom: 50px;}
.top_interview_img .left_area{width: 490px;max-width: 100%;z-index: 2;position: relative;}
@media screen and (max-width: 767px) {
	.box_service{padding: 30px 20px;margin-bottom: 50px;}
}

.top_cace > li{background: var(--bgw);border-radius: 10px;position: relative;padding: 30px;}
.top_cace > li figure{text-align: center;margin-bottom: 20px;height: 80px;}
.top_cace > li .txt{font-size: 1.8rem;font-weight: bold;margin-bottom: 20px;min-height: 60px;text-align: center;}
.top_int_num_box{font-weight: 500;width: 60px;height: 60px;padding-top: 10px;border-radius: 30px;background: var(--sub);text-align: center;line-height: 1.1;font-size: 1.4rem;position: absolute;left: 20px;top: -30px;z-index: 1;font-family: var(--poppins);}
.top_int_num_box .num{display: block;font-size: 2.2rem;margin-bottom: 20px;letter-spacing: 0.2rem;}
.top_int_copy{background-color:var(--bgw);padding: 15px;font-size: 3.4rem;font-weight: bold;}
.top_int_name span{background-color: var(--sub);color: var(--bgw);padding: 5px 15px;font-weight: bold;}

@media screen and (max-width: 767px) {
	.top_cace > li{padding:30px 15px;}
}



.top_interview_img .right_area{position: absolute;right: 0;top: 0;z-index: 0;}

@media screen and (max-width: 767px) {
.top_interview_img{margin-bottom: 0;}
.top_interview_img  .left_area{margin-top: -60px;}
.top_int_num_box{width: 60px;font-size: 1.6rem;text-shadow: 0 0 4px #fff;}
.top_interview_img .right_area{position: relative;right: 0;top: 0;z-index: 0;}
    .top_int_copy{font-size: 2.4rem;padding: 5px 10px;}
}

.top_int_fax .acMenu{margin-bottom: 10px;}

.faq_q{font-size: 1.8rem;font-weight: bold;position: relative;padding: 25px 30px;background: var(--gray);	transition: 0.5s;}
.faq_q:hover{background: #e3e6e8;cursor: pointer;}
.faq_q.active{background: #e3e6e8;}
.faq_q .down_ar::before{position: absolute;top: 20px;right: 40px;font-size: 2.0rem;content: "＋";
display: flex;align-items: center;text-align: center;justify-content: center;width: 30px;height: 30px;transition: .35s ease-in-out;
}
.active .down_ar::before{/*content: "－";*/transform:rotate(45deg);
	
}

@media screen and (max-width: 767px) {
.top_int_fax{padding: 15px 0px;}
.faq_q{font-size: 1.5rem;padding:10px 50px 10px 40px;text-indent: -28px;}
    .faq_q .down_ar{font-size: 2.0rem;text-indent: 0;}
	.faq_q .down_ar::before{top: 25px;right: 10px;}
}

.faq_q .faq_ico{font-size: 1.8rem;}
.top_int_fax .faq_a{margin:0px 0 45px 0;padding-top: 30px;}

.infinite-slider{width: 100%;overflow: hidden;}

.infinite-slider .swiper-wrapper {
  transition-timing-function: linear;
}
.gallery_roop_list{margin-bottom: 200px;}
.gallery_roop_list > li{
     max-width: 400px;
    margin: 0 10px;
    margin-top: 0px;
    margin-right: 10px;
    margin-bottom: 0px;
    margin-left: 10px;
    border-radius: 10px;
    text-align: center;
}
@media screen and (max-width: 767px) {
.gallery_roop_list{margin-bottom: 100px;}
    .gallery_roop_list > li{
     max-width: 200px;
    }
}

.top_bnr_list{
display: flex;justify-content: space-between;flex-wrap: wrap;}
.top_bnr_list > li{width: 48%;}
.top_bnr_list > li > a figure{position: relative;}
.top_bnr_list > li > a figure > figcaption{position: absolute;left: 0;bottom: 40px;background-color: var(--bgw);font-weight: bold;padding: 5px 20px;font-size: 3.4rem;transition: 0.5s;}
.top_bnr_list > li > a figure > figcaption > span{font-size: 1.6rem; font-family: var(--os);}
.top_bnr_list > li > a:hover figure > figcaption{padding: 5px 30px;}
@media screen and (max-width: 767px) {
.top_bnr_list > li{width: 100%;margin-bottom: 30px;}
}



/* フッターお問い合わせ */
.bg_contact{background-color: var(--main);}

.con_tit {    font-size: 3.6rem;
    font-weight: bold;
    margin-bottom: 60px;text-align: center;
}
.contact_btn_ul{
display: flex;justify-content: space-between;flex-wrap: wrap;}
.contact_btn_ul > li{width: 47%;}
.contact_btn_ul > li a{display: block;background-color: var(--bgw);text-align: center;padding: 30px;}
.contact_btn_ul > li a span.svg{background-color:var(--sub) ;border-radius: 50%;width: 80px;height: 80px;text-align: center;
align-items: center;justify-content: center;margin: auto;transition: 0.5s;margin-bottom: 15px;
display: flex;}
.contact_btn_ul > li a span.text{font-size: 3.0rem;font-weight: bold;}
.contact_btn_ul > li  a svg{fill: var(--bgw);transition: 0.5s;}

.contact_btn_ul > li  a:hover {background-color: var(--sub);color: var(--bgw);padding: 20px 20px 30px 20px;}
.contact_btn_ul > li  a:hover span.svg{background-color: var(--bgw);width: 100px;height: 100px;margin-bottom: 5px;}
.contact_btn_ul > li  a:hover svg{fill: var(--sub);}

@media screen and (max-width: 767px) {
.con_tit {font-size: 2.4rem;
    margin-bottom: 40px;}
.contact_btn_ul > li{width: 100%;margin-bottom: 15px;}

.contact_btn_ul > li a{padding: 15px;}
.contact_btn_ul > li a span.svg{width: 60px;height: 60px;text-align: center;
align-items: center;justify-content: center;margin: auto;transition: 0.5s;margin-bottom: 15px;
display: flex;}
.contact_btn_ul > li  a svg{max-width: 30px;}
.contact_btn_ul > li a span.text{font-size: 2.0rem;font-weight: bold;}
}

.footer{background: var(--gradation);}
.footer h3{margin-bottom: 80px;text-align: center;}
.footer h3 a{display: inline-block;/*width: 150px;*/width: 100px;}
.ft_area{padding: 80px 0;/*
display: flex;justify-content: space-between;flex-wrap: wrap;*/
}
@media screen and (max-width: 767px) {
.ft_area{padding: 50px 15px;
display: block;
}
	.footer h3{margin-bottom: 40px;}
}

.ft_nav{
display: flex;justify-content: space-between;flex-wrap: wrap;width: 600px;margin: auto;max-width: 100%;
}

.ft_area .ft_nav li{margin-bottom: 15px;}
.ft_area .ft_nav li a{color: var(--bgw);font-weight: bold;}
@media screen and (max-width: 767px) {.ft_area .ft_nav li{width: 50%;}}
.ft_nav .ft_tel ,.ft_nav .ft_con {width: 44%;}
.ft_nav .ft_tel a,.ft_nav .ft_con a{display: block;font-size: 1.8rem;color: var(--bgw);padding: 15px 30px;text-align: center;border: 2px solid var(--bgw);border-radius: 20px;font-weight: bold;}

@media screen and (max-width: 767px) {
.ft_nav li.ft_tel ,.ft_nav li.ft_con {width: 100%;}
.ft_nav .ft_tel a,.ft_nav .ft_con a{border: 1px solid var(--bgw);padding: 10px;border-radius: 15px;}
}

/*　//フッターここまで　*/



/*　内部ページ　*/

.bg_ttl{background: url( "img/common/bg_ttl.webp")no-repeat center center;-webkit-background-size: cover;
background-size: cover;
position: relative;
	background-attachment: fixed;
}

.bg_ttl_contact{background: url( "img/contact/bg_ttl_contact.webp")no-repeat center center;-webkit-background-size: cover;
background-size: cover;
position: relative;
	background-attachment: fixed;
}

.bg_ttl_column{background: url( "img/media/bg_ttl_media.webp")no-repeat center center;-webkit-background-size: cover;
background-size: cover;
position: relative;
	background-attachment: fixed;
}

.bg_ttl .site_wrapper{padding: 165px 0;}
.bg_ttl .en{font-family: var(--cen);color: var(--bgw);font-size: 6.0rem;text-transform: capitalize;font-weight: 400;text-align: center;letter-spacing: 0.1em;}
.bg_ttl .ja{background-color: var(--bgw);padding: 15px 40px;font-size: 4rem;position: absolute;left: 0;bottom: 60px;font-weight: bold;}
@media screen and (max-width: 767px) {
    .bg_ttl{    background-size: auto 100%;}
    .bg_ttl .site_wrapper{padding: 60px 10px;}
    .bg_ttl .en{font-size: var(--fz5);bottom: 80px;left: 10px;}
    .bg_ttl .ja{font-size: var(--fz3);padding: 10px 20px;bottom: 30px;}
}

.in_copy{font-size: var(--fz5);font-weight: bold;}

/*　会社概要　*/

.company_bg{background: url( "img/company/bg_company.webp")no-repeat center top;background-attachment: fixed;}

.ttl_com{color: var(--bgw);font-size: 3.0rem;font-weight: bold;text-align: center;margin: 40px 0 90px;letter-spacing: 0.1em;}


.box_company{background: var(--bgw);box-shadow: var(--shadow3);width: 100%;border-radius: 10px;padding: 80px 60px;margin-bottom: 100px;}

.com_dl{width: 100%;}

.com_dl tr th{width: 20%;border-bottom: 1px solid var(--gray3);padding: 30px 0;font-weight: bold;font-size: 2.0rem;}
.com_dl tr td{width: 80%;border-bottom: 1px solid var(--gray3);padding: 30px 0;font-size: 2.0rem;}

@media screen and (max-width: 767px) {
.ttl_com{font-size: 2.4rem;margin: 0px 0 50px;letter-spacing: 0.1em;}

.box_company{padding: 30px 15px;margin-bottom: 80px;}
	
    .com_dl{display: block;}
    .com_dl tr{display: block;}
    .com_dl tr th{width: 100%;display: block;padding: 15px;font-size: 1.8rem;}
    .com_dl tr td{width: 100%;display: block;padding: 15px;font-size: 1.6rem;}
}


/* メディア */

.md_img{border-radius: 20px;overflow: hidden;margin-bottom: 40px;}
.cate {display: flex;justify-content: flex-start;flex-wrap: wrap;grid-gap: 25px 25px;margin: 80px 0 40px;}
@media screen and (max-width: 767px) {
.cate {grid-gap: 10px 10px;margin: 80px 0 40px;}
}
.cate .all a{display: block;min-width: 140px;border: 1px solid var(--main);text-align: center;padding: 8px 30px;color: var(--main);background: var(--bgw);border-radius: 20px;}
@media screen and (max-width: 767px) {
.cate .all a{display: block;min-width: 100px;padding: 5px 15px;}
}
.cate .cat-item a{display: block;min-width: 140px;text-align: center;padding: 8px 30px;color: var(--bgw);background: var(--gradation);border-radius: 20px;}
@media screen and (max-width: 767px) {
.cate .cat-item a{min-width: 100px;padding: 5px 15px;}
}

.cate .current-cat a{display: block;min-width: 140px;border: 1px solid var(--main);text-align: center;padding: 8px 30px;color: var(--main);background: var(--bgw);border-radius: 20px;}
@media screen and (max-width: 767px) {
.cate .current-cat a{display: block;min-width: 100px;padding: 5px 15px;}
}

.post-categories {margin-bottom: 25px;
display: flex;justify-content: flex-start;flex-wrap: wrap;grid-gap: 25px 25px;}
.post-categories a{display: block;min-width: 140px;text-align: center;padding: 8px 30px;color: var(--bgw);background: var(--gradation);border-radius: 20px;}
@media screen and (max-width: 767px) {
.post-categories a{padding: 5px 20px;}
}
.news_list{
display: flex;flex-wrap: wrap;justify-content: flex-start;grid-gap: 30px 30px;
margin-bottom: 40px;
}

/* サービス */
.service_bg{background: url("img/service/bg_service.webp")no-repeat center top;background-attachment: fixed;}
.ttl_ser{color: var(--bgw);font-size: 3.0rem;font-weight: bold;text-align: center;margin-bottom: 40px;letter-spacing: 0.1em;}
.sub_t_ser{color: var(--bgw);font-size: 1.8rem;font-weight: bold;text-align: center;margin: 0px 0 40px;letter-spacing: 0.1em;}
@media screen and (max-width: 767px) {
	.ttl_ser{font-size: 2.4rem;}
	.sub_t_ser{font-size: 1.6rem;}
}
.col_3_service_in{
display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 60px;}
.col_3_service_in > li{position: relative;width: 30%;padding-top: 440px;}
.col_3_service_in > li figure{position: absolute;top: 0;left: -30px;}

.col_3_service_in_box{background: var(--bgw);box-shadow: var(--shadow3);border-radius: 20px;padding: 30px;position: relative;z-index: 2;min-height: 300px;}
.col_3_service_in_box .tit{font-weight: bold;font-size: 2.4rem;text-align: center;margin-bottom: 20px;}
.col_3_service_in_box .txt{font-size: 1.6rem;}

@media screen and (max-width: 767px) {
.col_3_service_in{
display: block;margin-bottom: 60px;}
.col_3_service_in > li{position: relative;width: 100%;padding-top: 0px;}
.col_3_service_in > li figure{position: relative;top: 0;left: 0px; margin-bottom: -15px;width: 90%;}

.col_3_service_in_box{padding: 20px;position: relative;z-index: 2;min-height: auto;width:90%;margin: 0 0 0 auto;}
.col_3_service_in_box .tit{font-weight: bold;font-size: 1.8rem;margin-bottom: 15px;}
.col_3_service_in_box .txt{font-size: 1.4rem;}
}


.box_service_in{background: var(--bgw);box-shadow: var(--shadow3);border-radius: 20px;padding: 60px;}

.box_service_in dl{border-bottom: 1px solid var(--gray2);margin-bottom: 30px;padding-bottom: 30px;width: 100%;
display: flex;flex-wrap: wrap;justify-content: flex-start;}
.box_service_in dl:nth-child(3){margin-bottom: 0;padding-bottom: 0;border-bottom: none;}

.box_service_in dl dt{width: 100px;}
.box_service_in dl dd{width: 970px;}
.box_service_in dl dd .tit{font-size: 2.0rem;font-weight: bold;margin-bottom: 10px;}

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

.box_service_in{padding: 20px;}

.box_service_in dl{margin-bottom: 20px;padding-bottom: 20px;width: 100%;justify-content: space-between;
}
.box_service_in dl:nth-child(3){margin-bottom: 0;padding-bottom: 0;border-bottom: none;}

.box_service_in dl dt{width: 10%;}
.box_service_in dl dd{width: 86%;}	
.box_service_in dl dd .tit{font-size: 1.8rem;font-weight: bold;margin-bottom: 10px;}
	
}

.service_d .txt{margin-bottom: 30px;}

.col_1_2{clear: both;}
.col_1_2 .left_area{float: left;width: 44%;}
.col_1_2 .right_area{float: right;width: 50%;}

.col_2_1{clear: both;}
.col_2_1 .right_area{float: right;width: 44%;}
.col_2_1 .left_area{float: left;width: 50%;}

@media screen and (max-width: 767px) {
.col_1_2 .left_area{float: none;width: 100%;margin-bottom: 40px;}
.col_1_2 .right_area{float: none;width: 100%;}

.col_2_1 .right_area{float: none;width: 100%;margin-bottom: 40px;}
.col_2_1 .left_area{float: none;width: 100%;}
}

/* ビジネス */
.bg_business{position: relative;
  background: linear-gradient(90deg, var(--gray) 0%, var(--gray) 40%, var(--bgw) 40%, var(--bgw) 100%);

}

.biz_outer{position: relative;overflow: clip;margin-bottom: 50px;}
.biz_box{position: absolute;top: 0;left: 0;width: 100%;padding-top: 150px;}
@media screen and (max-width: 767px) {
.biz_box{position: relative;top: 0;left: 0;width: 100%;padding-top: 20px;}

}

.page_num_box{font-weight: bold;line-height: 1.1;font-size: var(--fz2);margin-bottom: 20px;font-family: var(--os);}
.page_num_box .num{display: inline-block;font-size: var(--fz5);color: var(--main);letter-spacing: 0.2rem;}

.biz_w_box{background-color: var(--bgw);padding: 40px;box-shadow: var(--shadow);width: 575px;max-width: 100%;}
.biz_w_box h4{
display: flex;align-items: center;font-size: var(--fz4);font-weight: bold;margin-bottom: 30px;}
.biz_w_box h4 span.ico{width: 70px;height: 70px;background-color: var(--main);border-radius: 50%;
display: flex;align-items: center;justify-content: center; margin-right: 20px;}
@media screen and (max-width: 767px) {
    .biz_w_box{padding: 15px;}
    .biz_w_box h4{font-size: 1.8rem;margin-bottom: 15px;}
.biz_w_box h4 span.ico{width: 40px;height: 40px; margin-right: 15px;}
    .biz_w_box h4 span.ico img{width: 20px;}
    
}

/*　お問い合わせ　*/
.box_tel {
	
  color:  var(--bgw) ;
  line-height: 1.4;
  display: inline-block;
}
@media screen and (max-width: 767px) {
  .box_tel {
    text-align: left;
  }
}
.contact_tel a {
  display: block;
}
.contact_tel {
  background: var(--gradation);
  text-align: center;
  padding: 20px;
  margin-bottom: 40px;
}
@media screen and (max-width: 767px) {
  .contact_tel {
    text-align: center;
    padding: 15px;
    margin-bottom: 20px;
  }
}

.ico_required {
  color: #fff;
  font-size: 1.2rem;
  background: #B20A0A;
  line-height: 1;
  padding: 4px 10px;float: right;border-radius: 15px;
}


.contact_form {
  background: var(--gray);
  padding: 20px 30px;
  line-height: 1;
}
@media screen and (max-width: 767px) {
  .contact_form {
    padding: 15px;
  }
}
.contact_form dt {
  display: table-cell;
  width: 215px;padding-right: 20px;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  .contact_form dt {
    display: block;
    width: 100%;padding-right: 0px;
    margin-bottom: 10px;
  }
}
.contact_form dd {
  display: table-cell;
  width: 705px;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  .contact_form dd {
    display: block;
    width: 100%;
  }
}
.contact_form input, .contact_form textarea {
  box-sizing: border-box;
  padding: 10px;
}
.contact_form input[type=text], .contact_form input[type=email] {
  width: 100%;
}
.contact_form textarea {
  width: 100%;
  height: 250px;
}
@media screen and (max-width: 767px) {
  .contact_form input, .contact_form textarea, .contact_form select {
    font-size: 1.6rem;margin: 4px 0;display: block;
    padding: 5px;
  }
  .contact_form textarea {
    height: 150px;
  }
}
select.time, select.lesson {
  padding: 10px;
  box-sizing: border-box;
}
@media screen and (max-width: 767px) {
  select.time, select.lesson {
    width: 100%;
  }
}
.contact_form select option {
  line-height: 2 !important;
  font-size: 1.6rem;
}

.btn_black_02{width: 400px;margin: auto;max-width: 100%;}

@media screen and (max-width: 767px) {.btn_black_02{width: 300px;margin: auto;max-width: 100%;}}
.btn_black_02 a, .btn_black_02 input {
  background: var(--gradation);
    font-size: 1.8rem;
    color: #fff;
    font-weight: 500;
    display: block;
    position: relative;
    text-align: center;
    border-radius: 35px;
    padding: 25px 30px;
    line-height: 1;
    border: 0;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    width: 100%;
    -webkit-appearance: none;
}
.btn_black_02 input:hover{
	cursor: pointer;border-radius: 0;}

.btn_black_02 a::after{
	content: "";position: absolute;right: 30px;top: 24px;
	width: 22px;height: 20px;
	background: url("img/common/arrow.webp")no-repeat center center;
	
	transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
}



.btn_black_02 a:hover:after{
	right: 20px;
}



.btn_03{width: 200px;margin: auto;max-width: 100%;}

.btn_03 a {
  background: var(--gradation);
position: relative;
  font-size: 1.4rem;
  color: #fff;
  display: block;
  text-align: center;font-weight: 600;
  padding: 15px 30px;border-radius: 30px;
  line-height: 1;
  border: 0;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  width: 100%;
  -webkit-appearance: none;
}
.btn_03 a::after{
	content: "";position: absolute;right: 20px;top: 16px;
	width: 13px;height: 13px;
	background: url("img/common/arrow.webp")no-repeat center center ;
	background-size: 100% auto;
	transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
}

.btn_03 a:hover:after{
	right: 15px;
}

/*ggmap
--------------------------------*/
  .ggmap iframe
	  {
		  border:none;
	  }
@media screen and (max-width: 767px) {
  .ggmap {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
  }
  .ggmap iframe, .ggmap object, .ggmap embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
}
.list_media{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
@media screen and (max-width: 767px) {
.list_media{
	display: block;
}
}
.list_media > li{
	width: 48%;
	margin-bottom: 60px;
	box-sizing: border-box;
}
@media screen and (max-width: 767px) {
.list_media > li{
	width: 100%;
	margin-bottom: 30px;
}
}
.ls_2{
	letter-spacing: 2px;
}
.small .post-categories {
	margin-bottom: 0;
}
.small .post-categories a {
    padding: 3px 15px;
	min-width: 100px;
    border-radius: 20px;
	font-size: 1.2rem;
}
.ttl_000{
	font-size: 3.2rem;
	font-weight: bold;
	letter-spacing: 2px;
	border-bottom: var(--main) 1px solid;
	padding-bottom: 15px;
}
@media screen and (max-width: 767px) {
	.ttl_000{
	font-size: 2.2rem;
}
}
.item1 { order: 1; }
.item2 { order: 2; }

/* Loading背景画面設定　*/
#splash {
/*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background:var(--gradation);
  text-align:center;
  color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
  width:260px;
}

/* fadeUpをするアイコンの動き */
.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}