@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/



/*特定のページの背景をグレーにする*/
/*
.page-id-50{
	background-color: #EFF1F5
}
.page-id-67{
	background-color: #EFF1F5
}
.page-id-56{
	background-color: #EFF1F5
}
*/

/*特定の要素の背景を指定する*/
.background-contact{
	background-color: #E1E4EC
}
.background-download{
	background-color: #1B224C
}

.background-main{
	background-color: #1B224C
}

/*グループの設定*/
.g_banner{
	border-top: 1px solid #E9E9E9;
    border-right: 1px solid #E9E9E9;
    border-left: 10px solid #1B224C;
	border-bottom: 1px solid #E9E9E9;
    border-radius: 5px;
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.25);
}

/*グループの設定*/
.g_border{
	border: 1px solid #E9E9E9;
    border-radius: 5px;
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.25);
}

/*グループの設定*/
.g_background{
	background-color: #F8F8F8;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
	padding-right: 40px;
}

/*グループの設定*/
.border{
	border: 1px solid #E9E9E9;
}

/*クリックできない*/
.notClickable {
  pointer-events: none;
}


/*ボタンの設定*/
.btn_banner{
	background-color: #FFFFFF;
    border-right: 1px solid #E9E9E9;
    border-left: 10px solid #1B224C;
	padding-top: 11px;
	padding-bottom: 10px;
	padding-left: 51px;
	font-weight: 500;
	font-size: 14px;
	font-family: "Noto Sans JP", "Hiragino Mincho ProN", serif;
	color: #000000;
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.25);
	transition: background-color 0.3s ease, color 0.3ease;
}
/*.btn_banner:hover{
	background-color: #1B224C;
	border-left-color: #FFFFFF;
	color: #FFFFFF;
}*/

.btn_main{
	background-color: #1B224C;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-left: 37px;
	padding-right: 37px;
	font-weight: 500px;
	max-width: 288px;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.btn_white{
	background-color: #FFFFFF;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-left: 37px;
	padding-right: 24px;
	font-weight: 500;
	border: 1px solid #1B224C;
	max-width: 288px;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

/*1pxの灰色ボーダー*/
.s_border{
	background-color: #E1E4EC;
}

/*パンくずリストの非表示*/
#breadcrumb {
 display: none;
}

.t_company {
font-size:0px;
}
.t_company:before {
font-size:15px;
content:'会社概要';
}

.t_news {
font-size:0px;
}

.t_news:before {
font-size:15px;
content:'お知らせ';
}

.t-background{
background-color: #F8F8F8;
	padding:1em;
}

.g_main{
	background-color: #0BBFD2;
	display: inline-block;
	padding-top: 1em;
	padding-bottom: 1em;
	padding-left: 2em;
	padding-right: 2em;
	box-shadow: 0px 6px 6px rgba(0, 0, 0, 0.25);
}

@media (max-width:522px) and (min-width:391px){
	.g_mainvisual{
		font-size: 9px;
	}
}

@media (max-width:695px) and (min-width:522px){
	.g_mainvisual{
		font-size: 12px;
	}
}

@media (max-width:390px){
	.g_mainvisual{
		font-size: 7px;
	}
}

@media screen and (max-width: 480px){
	.t_cd{
		font-size:1em;
	}
}

.-col4 .-type-card.-pc-col3 .p-postList__item, .-col4 .-type-thumb.-pc-col3 .p-postList__item{
    width: calc(100% / 5);
}

/* 記事内CTA */
.article-toc-cta {
  background-color: #fff;
	border: solid 2px;
  padding: 24px;
  margin-bottom: 40px;
  text-align: center;
	>div{
		margin-left: auto;
    margin-right: auto;
		 width: fit-content;
	}
   img {
    width: clamp(300px, 64%, 540px);
    display: block;
    margin-inline: auto;
  }
  h3 {
    color: black !important;
	margin-top: 20px;
  }
  p{
    margin-bottom: 10px;
		width: fit-content;
  }
	a {
    color: white !important;
   }
  button {
    text-align: center;
    margin-inline: auto;
    width: 300px;
    padding: 16px;
    border-radius: 36px;
    color: #ffffff;
    background-color: #1b224c;
    border: none;
    box-shadow: 0px 5px 0px rgb(33 33 37);
    margin-top: 32px;
	transition: transform 0.3s ease;
	&:hover {
    transform: translateY(4px);
    box-shadow: none;
     }
   }
   .fa-check:before {
    color: #1b224c;
   }
   i.fas.fa-check {
    margin-right: 8px;
}
}

/*グループの設定*/
.g_shadow{
    border-radius: 5px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.25);
	padding-top: 2em;
	padding-bottom: 2em;
	padding-left: 1.5em;
	padding-right: 1.5em;
}

@media (max-width:374px){
	.g_shadow{
		font-size: 10px;
	}
}

/*グループの設定*/
.g_F7F9FC{
	background-color: #F7F9FC;
	height: fit-content;
	padding-top: 1em;
	padding-bottom: 1em;
	padding-left: 1.75em;
	padding-right: 1.75em;
	align-items: center;
	gap: 0.5em;
}

.g_gradation{
  background-image: linear-gradient(90deg, #dbe0e6, #f1f5f8);
}

.g_achieve{
	font-size: clamp(12px, 4vw, 16px);
}

@media(min-width:768px){
	.g_gradation{
		padding-left:10vw;
		padding-right:10vw;
	}
}

@media(min-width:600px){
	.g_split-band{
	background: linear-gradient(90deg, #F5F6FA 0%, #F5F6FA 60%, #ffffff 60%, #ffffff 100%);
	padding-top: 133px;
	padding-bottom: 133px;
	padding-left: 12%;
	}
}

@media (min-width:320px){
	.g_split-band{
		background-color: #F5F6FA;
		padding-left: 8%;
	}
}

/* .page-id-7670 h1.c-pageTitle{
display:none;
} */

.g_yellow{
	background: #FF8B08;
}

.g_1B224C{
	background-color: #1B224C;
	padding-top: 48px;
	padding-bottom: 48px;
	padding-left: 24px;
	padding-right: 24px;
	border-radius: 20px;
}

.g_1B224C_outline{
	padding-top: 48px;
	padding-bottom: 48px;
	padding-left: 24px;
	padding-right: 24px;
	border-radius: 20px;
	border-style: solid;
	border-width: 2px;
	border-color: #1B224C;
}

.t_yellow{
	background-color: #FFF8E2;
	border-style: solid;
	border-width: 2px;
	border-color: #FBA80B;
	border-radius: 10px;
	padding: 1em;
}

.g_blue{
	background-color: #EDEEF5;
	border-style: solid;
	border-color: #D4D8EE;
	border-radius: 20px;
	font-size: clamp(12px, 4vw, 18px);
}

@media (max-width: 662px){
	.g_blue{
		font-size: 14px;
	}
}

.g_padding{
	padding: 2em;
	gap: 1em;	
}

.g_container{
	font-size: clamp(12px, 4vw, 16px);
}

@media (max-width:581px){
	.g_container{
		font-size: 12px;
	}
}

@media (max-width:420px){
	.g_simulation{
		font-size: 9.5px;
	}
}

@media (max-width:768px){
	.g_1B224C{
	padding-top: 32px;
	padding-bottom: 32px;
	padding-left: 32px;
	padding-right: 32px;
	border-radius: 32px;
	}
}

@media (max-width:768px){
	.g_1B224C_outline{
	padding-top: 32px;
	padding-bottom: 32px;
	padding-left: 32px;
	padding-right: 32px;
	border-radius: 32px;
	}
}

.g_100vh{
	align-items: center;
	display: flex;
}

.g_shadow_center{
	align-items: center;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
	padding-top: 30px;
	padding-bottom: 48px;
	padding-left:40px;
	padding-right: 40px;
	gap: 42px;
}

.g_100width{
	width: 100%;
}

@media (max-width: 768px){
	.g_shadow_center{
		align-items: center;
		box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.25);
		width: 100vw;
		padding-top: 30px;
		padding-bottom: 48px;
		gap: 42px;
	}
}

.g_fvPC{
	font-size: 16px;
}

@media (max-width: 1130px){
	.g_fvPC{
		font-size: 12px;
	}
}

/*開発実績、お客様の声、ブログの青いボタンの文字を白に*/
.swell-block-button a span {
  color: #fff !important;
}

/* footer ボタンを白に、文字を青色に */
.footer_white a {
  background: #fff !important;
}

.footer_white a span.swl-inline-color {
  color: #1b224c !important;
}

.footer_white a svg {
  stroke: #1b224c !important;
}

/* デフォルト（PC含む） */
html{
  font-size: 16px;
}

/* タブレット以下 */
@media (max-width: 1024px){
  html{ font-size: 15px; }
}
	
.t_12px_19px{
	font-size: clamp(12px, 4vw, 19px);
}

.t_16px_33px{
	font-size: clamp(16px, 4vw, 24px);
}

.t_20px_30px{
	font-size: clamp(20px, 4vw, 30px);
}

@media(max-width:946px){
	.t_20px_30px{
		font-size: 24px;
	}
}

@media(max-width:777px){
	.t_20px_30px{
		font-size: 17.5px;
	}
}

@media(max-width:600px){
	.t_20px_30px{
		font-size: clamp(20px, 4vw, 30px);
	}
}

/*フッターのウィジェット設定*/
.w-footer__box{
	padding: 0em;
}

/* footer CTAをコンテンツ直後から表示する */
.l-footer__widgetArea,
.l-footer__widgetArea .w-footer__box {
	padding-top: 0 !important;
}

.w-footer {
  display: block !important;
}

/* 共通の相談エリアは、見出しと余白を控えめにする。 */
#footer .footer_CTA_SP {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}
#footer .footer_CTA_SP h2 {
  font-size: 32px !important;
  line-height: 1.5;
}
#footer .footer_CTA_SP .nc-footer-cta-break {
  display: none;
}
#footer .footer_CTA_SP .CTA_comment {
  font-size: 16px !important;
  line-height: 1.7;
  margin-top: 12px !important;
  margin-bottom: 0 !important;
}
#footer .footer_CTA_SP .swell-block-columns {
  margin-top: 28px !important;
  margin-bottom: 0 !important;
}
@media (max-width: 767px) {
  #footer .footer_CTA_SP {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  #footer .footer_CTA_SP h2 {
    font-size: 22px !important;
  }
  #footer .footer_CTA_SP .nc-footer-cta-break {
    display: inline;
  }
  #footer .footer_CTA_SP .CTA_comment {
    font-size: 14px !important;
  }
  #footer .footer_CTA_SP .swell-block-columns {
    margin-top: 24px !important;
  }
}

/* 本文の基準フォントサイズ（サイト全体） */
html{
  font-size: clamp(10px, 1.2vw + 10px, 16px);
}

/* contact-thankyou button */
.swell-block-button.blue_.is-style-btn_line a span {
    color: #1b224c !important;
}
.swell-block-button.blue_.is-style-btn_line a:hover span {
    color: #fff !important;
}

/* SWELLのオレンジ系CTAをブランドカラーの単色に統一 */
.swell-block-button.red_ .swell-block-button__link,
.swell-block-button.orange_ .swell-block-button__link,
.swell-block-button.yellow_ .swell-block-button__link {
	background: #FF8B08 !important;
	background-image: none !important;
}