@charset "utf-8";

:root {
	--hase-color: #1488B4;
	--taki-color: #38BAB3;
}
/* 汎用 */
a:hover img { opacity: 0.8; filter: alpha(opacity=80); -moz-opacity: 0.8; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb25 { margin-bottom: 25px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb45 { margin-bottom: 45px; }
.mb50 { margin-bottom: 50px; }
.mb60 { margin-bottom: 60px; }
.mb70 { margin-bottom: 70px; }
.mb80 { margin-bottom: 80px; }
.mb90 { margin-bottom: 90px; }
.mb100 { margin-bottom: 100px; }
.mr10 { margin-right: 10px; }
.mr15 { margin-right: 15px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }
.tal { text-align: left; }
.tac { text-align: center; }
.tar { text-align: right; }
.st { font-weight: bold; }
.fl { float: left; }
.fr { float: right; }
.fs16 { font-size: 16px; }
.fs18 { font-size: 18px; }
.fs20 { font-size: 20px; }
.fs22 { font-size: 22px; }
.fs24 { font-size: 24px; }
.fw300 { font-weight: 300; }
.fw400 { font-weight: 400; }
.fw500 { font-weight: 500; }
.fw600 { font-weight: 600; }
.fw700 { font-weight: 700; }
.fw800 { font-weight: 800; }
.flex { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; }
.flex_not_justify { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; }

/* メインの日本語フォント */
.f_min { font-family: "游明朝", "Yu Mincho", "Hiragino Mincho Pro", serif; }
.f_hira { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", sans-serif; }
.f_gothic { font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "Yu Gothic M", "YuGothic", sans-serif; }
.f_hirago { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", sans-serif; }
.f_noto_serif { font-family: "Noto Serif JP", serif; }


/* 英字用フォント */
.f_times { font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif; }
.f_arial { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

/* 画像フィット用 */
.fit_img { display: flex; justify-content: center; align-items: center; /*IE用*/ flex-direction: column; }
.fit_img img { max-width: 100%; max-height: 100%; width: auto; height: auto; }
.regacy_fit_img { display: relative; overflow: hidden; }
.regacy_fit_img img { position: absolute; left: -50%; right: -50%; top: -50%; bottom: -50%; margin: auto; max-width: 100%; max-height: 100%; width: auto; height: auto; }
.ofi { object-fit: cover; font-family: 'object-fit:cover; '; }

/*===========
inview
===========*/

.inview {
  opacity: 0;
  transform: translate(0, 20%);
  transition: 1s;
}
.inview.is-show {
  transform: translate(0, 0);
  opacity: 1;
}
/* ズレ表示用sample */
.works_list .parts:nth-child(2) {
  transition-delay: .2s;
}
.works_list .parts:nth-child(3) {
  transition-delay: .4s;
}



/*PC用*/
@media print, screen {
	.pc { display: block !important }
	.sp { display: none !important }
	.h_menu, #sp_global_nav { display: none; }
	.inner1200 {
		margin: 0 auto;
		width: 1200px;
		max-width: 95%;
	}
	.mtpt{
		margin-top: -8.2rem;
		padding-top: 8.2rem;
	}
	
	.mv {
		text-align: center;
	}
	#message {
		text-align: center;
		padding-bottom: 6.45rem;
		background: url(../../images/src/top/message_bg.webp) no-repeat center top / cover;
	}
	#message .img01 {
		margin: 0 14.86rem 0 26.95rem;
	}
	#message .img02 {
		margin: 10.5rem 0 3rem;
	}

	#about {
		position: relative;
		z-index: 1;
		text-align: center;
		padding: 13.2rem 0 0;
		background: url(../../images/src/top/about_bg01.webp) no-repeat center top / 100%;
	}
	#about h2 {
		padding: 0 4.1rem;
	}
	#about .img01 {
		padding: 0 7rem;
	}

	#about .about_reason {
		margin-top: -20.5rem;
		padding: 27.3rem 0 11.8rem;
		text-align: center;
		background: url(../../images/src/top/about_reason_bg01.webp) no-repeat center top / cover;
	}
	#about .about_reason h2 {
		margin: 0 auto 1.6rem;
		padding: 0;
		width: 10.9rem;
	}
	#about .about_reason h2 img {
		width: 100%;
	}
	#about .about_reason .ttl_jp {
		margin-bottom: 2.7rem;
		font-size: 4.6rem;
		font-weight: 600;
	}
	#about .about_reason .txt {
		font-size: 2rem;
		font-weight: 350;
		line-height: 2;
	}
	#about .about_reason ul {
		margin: 6rem 40rem 0;
		/*width: 1120px;
		max-width: 95%;*/
	}
	#about .about_reason ul li + li {
		margin-top: 4rem;
	}
	#about .about_reason ul li img {
		width: 100%;
		box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.16);
	}
	#flow {
		text-align: center;
	}
	#flow .flow_wrapper {
		padding: 3.5rem 0 11rem;
		background: url(../../images/src/top/flow_bg.webp) repeat-y center top / 100%;
	}
	#flow h2 {
		margin: 0 auto 5rem;
		width: 54.5rem;
	} 
	#flow .img {
		margin: 0 36rem;
	} 
	#flow .flow_lo01,
	#flow .flow_lo02 {
		position: relative;
	}
	#flow .flow_lo02 {
		margin-top: -10.4%;
		z-index: -1;
	}
	#reason .reason_box {
		border-top: 1px solid #c9c9c9;
		align-items: center;
		justify-content: left;
		gap: 0 6.7rem;
	}
	#reason .reason_box.even {
		justify-content: right;
		background-color: #F4F4F4;
	}
	#reason .reason_box .img {
		width: calc(50%);
	}
	#reason .reason_box .txtarea {
		width: 54rem;
	}
	#reason .reason_box .txtarea .ttl {
		margin: 1.6rem 0 1.8rem;
		font-size: 4rem;
		font-weight: 600;
		line-height: 1.4;
	}
	#reason .reason_box .txtarea .txt {
		font-size: 1.8rem;
		font-weight: 350;
		line-height: 2.22;
	}
	
	#reason .reason_box .reason_box_parts {
		margin: 5.3rem 18.75% 6.5rem;
	}
	#reason .reason_box .reason_box_parts img {
		width: 100%;
	}
	#reason .reason_box .reason_whitebx {
		margin: 5rem 36rem 0;
		padding: 4.6rem 5rem 4rem;
		background-color: #fff;
	}
	#reason .reason_box .reason_whitebx.mb60 {
		margin-bottom: 6rem;
	}
	#reason .reason_box .reason_whitebx.gray {
		background: #F4F4F4;
	}
	#reason .reason_box .reason_whitebx h4 {
		margin-bottom: 1.5rem;
		padding-left: 1.4rem;
		border-left: 0.4rem solid var(--hase-color);
		font-size: 2.6rem;
		font-weight: 700;
	}
	#reason .reason_box .reason_whitebx .txt {
		margin-bottom: 3rem;
		font-size: 1.8rem;
		font-weight: 350;
		line-height: 2;
	}
	#reason .reason_box .reason_whitebx .kome {
		margin-top: 2.2rem;
	}
	#reason .reason_box .reason_whitebx .kome li {
		font-size: 1.6rem;
		font-weight: 300;
		line-height: 1.87;
		margin-left: 1.6rem;
		text-indent: -1.6rem;
	}
	
	#reason .reason_box .reason_whitebx .price {
		display: inline-block;
		margin-bottom: 1.6rem;
		padding: 3px 8px 3px 18px;
		border-radius: 180px;
		background-color: var(--hase-color);
		color: #fff;
		font-size: 1.8rem;
		font-weight: 700;
	}
	#reason .reason_box .reason_whitebx .kometxt {
		font-size: 1.6rem;
		font-weight: 300;
	}
	#reason .reason_box .reason_whitebx .sp_scroll_ttl {
		margin: 4.6rem 0 2rem;
		font-size: 2.2rem;
		font-weight: 700;
	}
	#reason .re_text {
		margin-top: 6.4rem;
		padding: 6.4rem 0;
		text-align: center;
		border-top: 1px solid #C9C9C9;
	}
	#reason .re_text img {
		width: 1166px;
		max-width: 95%;
	}

	#faq {
		margin: -8.2rem auto 0;
		padding: 16.2rem 0 8rem;
		width: 1200px;
		max-width: 95%;
	}
	#faq h2 {
		margin-bottom: 5rem;
		text-align: center;
	}
	#faq dl {
		position: relative;
		padding: 4.65rem 0;
		border-top: 1px solid #C9C9C9;
		cursor: pointer;
	}
	#faq dl::after {
		content:'';
		position: absolute;
		top: 4.65rem;
		right: 0;
		width: 4.8rem;
		height: 4.9rem;
		background: url(../../images/src/top/faq_plus.svg) no-repeat right top / 100%;
	}
	#faq dl.active::after {
		background-image: url(../../images/src/top/faq_minus.svg);
	}
	#faq dl:last-of-type {
		border-bottom: 1px solid #C9C9C9;
	}
	#faq dl dt {
		position: relative;
		padding-left: 3.6rem;
		font-size: 2.6rem;
		font-weight: 600;
	}
	#faq dl dt::before {
		content:'';
		position: absolute;
		left: 0;
		top: -18px;
		width: 6.674rem;
		height: 8.554rem;
		background: url(../../images/src/top/faq_q.svg) no-repeat left top / 100%;
	}
	#faq dl dd {
		display: none;
		padding-right: 13rem;
		margin-top: 4.7rem;
		font-size: 1.8rem;
		font-weight: 350;
		line-height: 2;
	}

	.contact {
		padding: 0 0 9rem;
		background: url(../../images/src/top/contact_bg.webp) repeat center top / cover;
	}
	.contact h2 {
		padding-top: 8.2rem;
		margin-top: 8.2rem;
		text-align: center;
		margin-bottom: 4rem;
	}
	.contact .box {
		margin: 0 auto;
		width: 1100px;
		max-width: 95%;
		padding: 5rem 6rem;
		background: #FFF;
		box-shadow: 3px 4px 4px 0 rgba(0, 0, 0, 0.16);
		gap: 0 5.6rem;
		align-items: flex-end;
	}
	.contact .box + .box {
		margin-top: 4rem;
	}
	.contact .box .left,
	.contact .box .right {
		flex: 1;
	}
	.contact .box .ttl_bx {
		margin-bottom: 2.4rem;
		align-items: baseline;
		justify-content: left;
		gap: 0 2rem;
		flex-wrap: nowrap;
	}

	.contact .box .tel_area {
		margin-top: 2.3rem;
		padding: 2.6rem 0 2.2rem;
		text-align: center;
	}
	.contact .box.hase .tel_area {
		background: #E3EEF2;
	}
	.contact .box.taki .tel_area {
		background: #E6F5F4;
	}
	.contact .box .tel_area a {
		display: block;
	}
	.contact .box .tel_area .btn {
		margin-top: 1.8rem;
	}
	.contact .box .address {
		margin-bottom: 1.4rem;
		font-size: 1.8rem;
		font-weight: 350;
		line-height: 1.77;
	}
	.contact .box .tar {
		margin: 0 0 3.7rem;
	}
	.contact .box .tar a {
		font-size: 1.6rem;
		font-weight: 500;
		text-decoration: underline;
	}
	.contact .box iframe {
		width: 100%;
		height: 244px;
	}
}

/*小さめ画面 */
@media screen and (max-width:1280px) {
	#message .img01 {
		margin: 0 0 0 5rem; 
	}
	#about h2 {
		padding: 0 0 10rem;
	}
	#about .about_reason ul {
		margin: 6rem 6rem 0;
	}
	#about .img01 {
		padding: 0 2.8rem;
	}
	#flow .img {
		margin: 0 6rem;
	}
	#reason .reason_box .img img{
		height: 666px;
	}
	#reason .reason_box .sp_order3 {
		width: 100%;
	}
	#reason .reason_box .reason_box_parts {
		margin: 5.3rem auto 6.5rem;
		width: 1200px;
		max-width: 95%;
	}
	#reason .reason_box .reason_whitebx {
		margin: 5rem auto 0;
		width: 1200px;
		max-width: 95%;
	}
	#faq {
		padding: 8rem 0;
	}
}

/*タブレット */
@media screen and (max-width:1180px) {
	
	#reason .reason_box .txtarea {
		width: calc(50% - 10rem);
	}
	#reason .reason_box .txtarea .ttl {
		font-size: 3.5rem;
	}
}

/*SP用*/
@media screen and (max-width:828px) {
	.pc { display: none !important }
	.sp { display: block !important }
	img { max-width: 100%; height: auto; width: auto; }
	body { min-width: auto !important; overflow: inherit !important; }
	.sp_tac { text-align: center !important; }
	.sp_tar { text-align: right !important; }
	.sp_mb15 { margin-bottom: 15px !important; }
	.sp_mb20 { margin-bottom: 20px !important; }
	.sp_mb30 { margin-bottom: 30px !important; }
	.sp_mb40 { margin-bottom: 40px !important; }
	.sp_mb45 { margin-bottom: 45px !important; }
	.sp_mb50 { margin-bottom: 50px !important; }
	.sp_mb60 { margin-bottom: 60px !important; }
	.sp_mb70 { margin-bottom: 70px !important; }
	.sp_mb80 { margin-bottom: 80px !important; }
	.sp_mb90 { margin-bottom: 90px !important; }
	.sp_mb100 { margin-bottom: 100px !important; }
	div, p, dd, dl, dt, th, td, span, li { box-sizing: border-box; }

	/* メインの日本語フォント 太字 */
	.f_min_bold { font-weight: 700; }
	.f_hira_bold { font-weight: 700; }
	.f_gothic_bold { font-weight: 700; }
	.f_hirago_bold { font-weight: 700; }
	.inner1200 {
		margin: 0 4.831vw;
		width: auto;
		max-width: initial;
	}
	.mtpt {
		margin-top: 0;
		padding-top: 0;
	}
	
	.mtpt::before {
		content:'';
		visibility: hidden;
		display: block;
		height: 18.116vw;
		margin-top: -18.116vw;
	}
	#message .img01 {
		margin: 0;
	}
	#message .img02 {
		margin: 8.454vw 0 4.831vw;
	}
	#about {
		padding: 18vw 0 0;
		background: url(../../images/src/top/sp/about_bg01.webp) no-repeat center top / 100%;
	}
	#about h2 {
		padding: 4.831vw 0 12.077vw;
	}
	#about .img01 {
		padding: 0 4.831vw 8.454vw;
	}
	#about .about_reason {
		margin-top: 0;
		padding: 6.522vw 4.831vw 7.367vw ;
		text-align: left;
		background-image: url(../../images/src/top/sp/about_reason_bg01.webp);
	}
	#about .about_reason h2 {
		margin-bottom: 1.208vw;
		padding: 0;
		text-align: center;
		width: 18.841vw;
	}
	#about .about_reason .ttl_jp {
		margin-bottom: 3.382vw;
		font-size: 6.763vw;
		text-align: center;
	}
	#about .about_reason .txt {
		font-size: 3.382vw;
		line-height: 1.78;
	}
	#about .about_reason ul {
		margin: 9.42vw 0 0;
		width: auto;
		max-width: initial;
	}
	#about .about_reason ul li + li {
		margin-top: 3.623vw;
	}
	#flow {
	}
	#flow .flow_wrapper {
		padding: 0 0 8.454vw;
		background-image: url(../../images/src/top/sp/flow_bg01.webp);
	}
	#flow h2 {
		margin: 0 auto 4.831vw;
		width: 77.174vw;
	} 
	#flow .img {
		margin: 0 3.623vw;
	}
	#flow .flow_lo02 {
		margin-top: -11.836vw;
	}
	#reason .reason_box {
		gap: 3.623vw 0;
		padding-bottom: 8.454vw;
	}
	#reason .reason_box .reason_whitebx.mb60 {
		margin-bottom: 0;
	}
	#reason .reason_box .img {
		order: 1;
		width: 100%;
	}
	#reason .reason_box .img img {
		height: auto;
	}
	#reason .reason_box .txtarea {
		order: 2;
		margin: 0 4.831vw;
		width: 100%;
	}
	#reason .reason_box .txtarea .num {
		width: 26.208vw;
	}
	#reason .reason_box .txtarea .ttl {
		margin: 1.57vw 0 2vw;
		font-size: 6.039vw;
	}
	#reason .reason_box .txtarea .txt {
		font-size: 3.382vw;
		line-height: 1.78;
	}
	#reason .reason_box .reason_box_parts {
		margin: 6.039vw 4.831vw 0;
		order: 3;
	}
	
	#reason .reason_box .sp_order3 {
		order: 3;
	}
	#reason .reason_box .reason_whitebx {
		margin: 6.039vw 4.831vw 0;
		padding: 6.039vw 4.831vw 4.831vw;
		width: auto;
		max-width: initial;
	}
	#reason .reason_box .reason_whitebx h4 {
		margin-bottom: 2.295vw;
		padding-left: 1.812vw;
		border-left-width: 0.483vw;
		font-size: 4.106vw;
	}
	#reason .reason_box .reason_whitebx .txt {
		margin-bottom: 3.623vw;
		font-size: 3.382vw;
		line-height: 1.78;
	}
	#reason .reason_box .reason_whitebx .kome {
		margin-top: 3.623vw;
	}
	#reason .reason_box .reason_whitebx .kome li {
		font-size: 3.14vw;
		line-height: 1.61;
		margin-left: 3.14vw;
		text-indent: -3.14vw;
	}
	#reason .reason_box .sp_scroll {
		padding: 4.831vw;
		overflow-x: scroll;
		background: #E3EEF2;
	}
	#reason .reason_box .sp_scroll img {
		width: 172.343vw;
		max-width: initial;
	}

	#reason .reason_box .reason_whitebx .price {
		margin-bottom: 2.295vw;
		padding: 1.208vw 0.966vw 1.208vw 3.019vw;
		border-radius: 32.902vw;
		font-size: 3.382vw;
	}
	#reason .reason_box .reason_whitebx .price.p02 {
		border-radius: 1.208vw;
	}
	#reason .reason_box .reason_whitebx .kometxt {
		font-size: 3.14vw;
		margin-left: 3.14vw;
		text-indent: -3.14vw;
	}
	#reason .reason_box .reason_whitebx .kometxt.mb25 {
		margin-bottom: 4.831vw;
	}
	#reason .reason_box .reason_whitebx .sp_scroll_ttl {
		margin: 6.039vw 0 4.831vw;
		font-size: 3.865vw;
	}
	#reason .reason_box .reason_whitebx .re05_01 {
		padding: 0;
		background: none;
	}
	#reason .reason_box .reason_whitebx .re05_01 img {
		width: 219.324vw;
	}
	#reason .re_text {
		margin-top: 0;
		padding: 0 14.372vw 8.454vw;
		border-top: none;
	}
	#reason .re_text img {
		width: 100%;
		max-width: initial;
	}
	#faq {
		width: auto;
		max-width: initial;
		margin-top: -18.116vw;
		padding: 26.126vw 4.831vw 0;
	}
	#faq h2 {
		margin: 0 auto 7.246vw;
		width: 26.812vw;
	}
	#faq dl {
		padding: 6.039vw 0;
	}
	#faq dl::after {
		top: 9.039vw;
		width: 8.213vw;
		height: 8.213vw;
	}
	#faq dl dt {
		padding-left: 4.348vw;
		font-size: 4.348vw;
	}
	#faq dl dt::before {
		top: -2vw;
		width: 9.058vw;
		height: 11.594vw;
	}
	#faq dl dd {
		padding: 0 0 0 4.348vw;
		margin-top: 1.932vw;
		font-size: 3.382vw;
		line-height: 1.78;
	}
	.contact {
		padding: 0 4.831vw 9.058vw;
		background-image: url(../../images/src/top/sp/contact_bg.webp);
	}
	.contact h2 {
		padding-top: 10.116vw;
    	margin-top: 13.116vw;
		text-align: center;
		margin-bottom: 4.589vw;
	}
	.contact .box {
		width: auto;
		max-width: initial;
		padding: 6.039vw 4.831vw 4.831vw;
		gap: 4.831vw 0;
	}
	.contact .box + .box {
		margin-top: 11.594vw;
	}
	.contact .box .left,
	.contact .box .right {
		flex: auto;
	}
	.contact .box .ttl_bx {
		margin-bottom: 7.246vw;
		align-items: center;
		justify-content: space-between;
		gap: 0;
	}
	.contact .box.hase .ttl_bx h3 {
		width: 53.744vw;
	}
	.contact .box.taki .ttl_bx h3 {
		width: 65.097vw;
	}

	.contact .box .tel_area {
		margin-top: 4.831vw;
		padding: 3.623vw 5.676vw;
	}
	.contact .box .tel_area .btn {
		margin: 2.174vw auto 0;
		width: 53.382vw;
	}
	.contact .box .address {
		margin-bottom: 2.415vw;
		font-size: 3.382vw;
		line-height: 1.5;
	}
	.contact .box .tar {
		margin: 0 0 6.039vw;
	}
	.contact .box .tar a {
		font-size: 3.14vw;
	}
	.contact .box iframe {
		height: 42.271vw;
	}

}


/* pcのみのhoverアクションはここ */
@media (hover: hover) and (pointer: fine) {
	a:hover {
	  opacity: 0.7
	}
}
  
 /*IE11用に以下のコードも追加*/
  @media (-ms-high-contrast: none), (-ms-high-contrast: active) {
	a:hover {
	  opacity: 0.7
	}
}



/* 印刷用 */
@media print {
	body { zoom: 0.6; -webkit-print-color-adjust: exact; }
}

/* 印刷用 IE10以上 */
@media print and (-ms-high-contrast:none) {
	@page { size: A4; margin: 12.7mm 9.7mm; }
	body { zoom: 1.8; width: 1200px; transform: scale(0.5); transform-origin: 0 0; }
}