@charset "utf-8";

/* Navigation 固定
----------------------------------------------------------------------------------------------------*/
.header_box {
	top: 0;
	right: 0;
	z-index: 9999;
	position: fixed;
	width: 100%;
	transition: background-color 0.6s;
}
.header_box.view{
	background-color: #fff;
}
.header_box a {
	text-decoration: none;
	transition: .3s;
}
.header {
	padding-top: 0.4rem;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
@media screen and (max-width: 1199px){
.header {
	width: 85%;
	height: 7.6rem;
}
}
@media screen and (min-width: 1200px){
.header {
	width: 91.76470588235294%;
	height: 9.2rem;
}
}
/*logo*/
.header-logo{
	font-size: 1rem;
	z-index: 999999;
	line-height: 1;
	text-align: center;
	width: 70.58823529411765%;
	position: relative;
}
.header-logo a{
	display: block;
}
.header-logo img{
	max-width: 100%;
	height: auto;
}
@media screen and (max-width: 1199px){
	.header-logo{
		max-width: 21rem;
	}
}
@media screen and (min-width: 1200px){
	.header-logo{
		max-width: 28rem;
	}
}
/*header-menu-wrap*/
.header-menu-wrap{
	position: fixed;
	top: 0;
	z-index: 99999;
}
.scroll_tgl_wrap {
	display: block;
	width: 100%;
}
@media screen and (max-width: 991px){
	.header-menu-wrap{
		right: 0;
	}
}
@media screen and (min-width: 576px){
	.header-menu-wrap{
		right: calc(7.5% - 3rem);
	}
}
@media screen and (max-width: 1199px){
	.header-menu-wrap,.scroll_tgl_wrap{
		min-width: 8rem;
		height: 8.2rem;
	}
}
@media screen and (min-width: 1200px){
	.header-menu-wrap,.scroll_tgl_wrap{
		min-width: 8.2rem;
		height: 9.2rem;
	}
	.header-menu-wrap{
		right: calc(4.117647058823529% - 2.6rem);
	}
}

/* -head mail tel
--------------------------------------------------------------------------------------------- */
.header-mail-tel-wrap{
	display: flex;
	justify-content: space-between;
	position: relative;
	z-index: 999999;
	transition: .3s;
}
.fixed .header-mail-tel-wrap{
	opacity: 0;
	visibility: hidden;
}
.header-main-tel-item svg{
	max-width: 100%;
	height: auto;
}
.icon-mail-head{
    fill: none;
    stroke: #fff;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.9px;
	transition: .3s ease-in-out;
}
.icon-tel-head{
	fill: #fff;
	transition: .3s ease-in-out;
}
/* 色変更 */
.view .icon-mail-head,.head-black .icon-mail-head{
	stroke: #313131
}
.view .icon-tel-head,.head-black .icon-tel-head{
	fill: #313131
}
@media screen and (max-width: 1199px){
	.header-mail-tel-wrap{
		width: 5.2rem;
		margin-right: 3.3rem;
	}
	.header-main-tel-item{
		width: 2rem;
	}
}
@media screen and (min-width: 1200px){
	.header-mail-tel-wrap{
		width: 8rem;
		margin-right: 6.4rem;
	}
	.header-main-tel-item{
		width: 2.8rem;
	}
}

/* -togglemenu.css
--------------------------------------------------------------------------------------------- */
/*Toggle*/
.Toggle {
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
	cursor: pointer;
	z-index: 6666;
}
.Toggle span {
	display: block;
	position: absolute;
	transition: .3s ease-in-out;
	background-color: #fff;
}
.view .Toggle span{
	background-color: #313131;
}
.Toggle span:nth-child(2) {
	top: 50%;
}
@media screen and (max-width: 1199px){
	.Toggle span {
		width: 29.85074626865672%;
		height: 0.1rem;
		right: 35.07462686567164%;
	}
	.Toggle span:nth-child(1) {
		top: calc(50% - 0.6rem);
	}
	.Toggle span:nth-child(3) {
		top: calc(50% + 0.6rem);
	}
}
@media screen and (min-width: 1200px){
	.Toggle span {
		width: 37.5%;
		height: 0.2rem;
		right: 31.25%;
	}
	.Toggle span:nth-child(1) {
		top: calc(50% - 0.9rem);
	}
	.Toggle span:nth-child(3) {
		top: calc(50% + 0.9rem);
	}
}
/*Toggle.tgl-active*/
.Toggle.tgl-active span{
	background-color: #313131;
}
.Toggle.tgl-active span:nth-child(1) {
	top: 50%;
	transform: rotate(45deg);
	max-width: 2rem;
}
.Toggle.tgl-active span:nth-child(2) {
	top: 50%;
	opacity: 0;
}
.Toggle.tgl-active span:nth-child(3) {
	top: 50%;
	transform: rotate(-45deg);
	max-width: 2rem;
}
/*togglewrap*/
.togglewrap {
	position: fixed;
	z-index: 999;
	opacity: 0;
	visibility: hidden;
	transition: 0.6s ease-in-out;
	overflow-y: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	top: 0;
	right: 0;
	width: 100vw;
	height: 100vh;
}
.togglewrap::-webkit-scrollbar{
	display: none;
}
/*togglewrap.active*/
.togglewrap.active {
	opacity: 1;
	visibility: visible;
}
@media screen and (min-width: 1400px){
	.togglewrap{
		max-width: 51.1765%;
	}
	.togglewrap.active {
		box-shadow: -5px 5px 10px 0px rgba(0, 0, 0, 0.11);
	}
}
/*body.fixed*/
body.fixed {
	position: fixed;
	width: 100%;
	height: 100%;
}
/*tgl-content-wrap*/
.tgl-content-wrap{
	padding-top: 11rem;
}
.tgl-content-inner{
	margin-bottom: 4rem;
}
@media screen and (min-width: 768px){
	.tgl-content-wrap{
		display: grid;
		grid-template-columns: 46.57534246575342% 1fr;
		grid-template-rows: auto auto auto; /* これで各行の高さがコンテンツに合わせて自動調整されます */
		grid-column-gap: 0px;
		grid-row-gap: 0px;
	}
	.tgl-content-wrap .tgl-img-btn-wrap{
		grid-area: 1 / 1 / 2 / 2;
	}
	.tgl-content-wrap .tgl-content-inner{
		grid-area: 1 / 2 / 3 / 3;
		padding-left: 12.82051282051282%;
	}
	.tgl-content-wrap .common-tgl-foot-sns-wrap-wrap{
		grid-area: 3 / 2 / 4 / 3;
		padding-left: 12.82051282051282%;
	}
	.tgl-content-wrap .common-tgl-foot-add-wrap{
		grid-area: 2 / 1 / 5 / 2;
		text-align: left;
	}
	.tgl-content-wrap .common-tgl-foot-add-wrap .common-tgl-foot-add-logo{
		display: none;
	}
	.tgl-content-wrap .common-tgl-foot-add-wrap .common-tgl-foot-add-tel{
		margin-right: initial;
		margin-left: initial;
	}
	.tgl-content-wrap .common-tgl-foot-add-wrap .common-tgl-foot-add-tel a{
		justify-content: flex-start;
	}
	.tgl-content-wrap .common-tgl-foot-add-copy{
		grid-area: 4 / 2 / 5 / 3;
		padding-left: 12.82051282051282%;
	}
}
@media screen and (min-width: 1200px){
	.tgl-content-wrap.container-small-small{
		width: 83.908%;
	}
}
/* tgl contents
--------------------------------------------------------------------------------------------- */
/*+++++++++++++++++
tgl menu 共通
******************/
.tgl-content-inner a{
	transition: .3s;
}
.tgl-content-inner a:hover{
	opacity: 0.6;
}
.common-tgl-link-big,.common-tgl-link-small{
	letter-spacing: 0.06em;
	line-height: 1.2;
}
	.common-tgl-link-big{
		font-size: 3.2rem;
	}
	.common-tgl-link-small{
		font-size: 1.8rem;
	}

/*+++++++++++++++++
画像ボタン
******************/
.tgl-img-btn-wrap{
	display: flex;
	flex-wrap: wrap;
	margin-right: -1.5rem;
	margin-left: -1.5rem;
	padding-bottom: 3rem;
}
.tgl-img-btn-item{
	padding-right: 1.5rem;
	padding-left: 1.5rem;
	margin-bottom: 2.5rem;
	width: 50%;
}
.tgl-img-btn-item a{
	display: block;
	color: #313131;
}
.tgl-img-btn-item-img{
	margin-bottom: 1.5rem;
	aspect-ratio: 1 / 0.645;
}
.tgl-img-btn-item-ttl{
	display: flex;
	align-items: center;
}
.tgl-img-btn-item-ttl .common-circle-icon{
	margin-left: 0.8rem;
}
@media screen and (min-width: 1200px){
	.tgl-img-btn-item-ttl{
		font-size: 1.3rem;
	}
}

/*+++++++++++++++++
開閉メニュー 
******************/
.tcmf-open-wrap *, .tcmf-open-wrap *:after, .tcmf-open-wrap *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}
.tcmf-open-wrap {
	overflow-x: hidden;
	margin: 0 auto;
}
.tcmf-open-wrap label,.tcmf-not-open-btn a {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin-bottom: 0;
	padding-top: 2.4rem;
	padding-bottom: 2.4rem;
	padding-right: 3.5rem;
	font-size: 1.6rem;
	cursor: pointer;
	line-height: 1;
}
.tcmf-not-open-btn a{
	color: #313131;
}
.tcmf-open-wrap label .efont,.tcmf-not-open-btn a .efont{
	font-size: 1.1rem;
	display: inline-block;
	padding-top: 0.3em;
}
.tcmf-open-tab,.tcmf-not-open-btn{
	border-bottom: 1px rgba(220,220,220,0.60) solid;
}
.tcmf-open-wrap .tcmf-open-tab-content {
	font-size: 1em;
	position: relative;
	overflow: hidden;
	height: 0;
	-webkit-transition: 0.4s ease;
	        transition: 0.4s ease;
	opacity: 0;
}
.tcmf-open-wrap .tcmf-open-tab input[type=checkbox]:checked ~ .tcmf-open-tab-content {
	height: auto;
	opacity: 1;
	padding-bottom: 1rem;
}
.tcmf-open-wrap .tcmf-open-tab input[type=checkbox] {
  display: none;
}
.tcmf-open-wrap label::before,.tcmf-open-wrap label::after{
	content: " ";
	width: 1rem;
	height: 1px;
	background-color: rgba(49,49,49,0.60);
	position: absolute;
	top: 50%;
	right: 0;
	display: block;
}
.tcmf-open-wrap label::after{
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
	transition: 0.4s ease;
}
.tcmf-open-wrap .tcmf-open-tab input[type=checkbox]:checked ~ label::after{
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
}
/*list*/
.tcmf-open-tab-content .common-tgl-footer-list{
	display: flex;
	flex-wrap: wrap;
}
.tcmf-open-tab-content .common-tgl-footer-list li{
	list-style: none;
	margin-right: 2rem;
	margin-bottom: 1rem;
	font-size: 1.4rem;
}
.tcmfi-sp-3 .common-tgl-footer-list li:nth-of-type(2){
	width: calc(100% - 18rem);
}

/**********************
request contact
**********************/
.tgl-request-contact-wrap{
	display: flex;
	margin-right: -0.9rem;
	margin-left: -0.9rem;
	margin-top: 4rem;
	max-width: 40rem;
	margin-right: auto;
	margin-left: auto;
}
.tgl-request-contact-item{
	width: 50%;
	padding-right: 0.9rem;
	padding-left: 0.9rem;
}

/**********************
sns※footer共通
**********************/
.common-tgl-foot-sns-wrap{
	display: flex;
	padding-bottom: 5rem;
	max-width: 23.4rem;
	margin-right: auto;
	margin-left: auto;
}
.common-tgl-foot-sns-item{
	padding-right: 0.8rem;
	padding-left: 0.8rem;
}
@media screen and (max-width: 991px){
	.common-tgl-foot-sns-wrap-inner{
		border-bottom: 1px rgba(220,220,220,0.5) solid;
	}
}
@media screen and (max-width: 1199px){
	.common-tgl-foot-sns-wrap-wrap{
		margin-bottom: 5rem;
	}
}
@media screen and (min-width: 1200px){
	.common-tgl-foot-sns-wrap-wrap{
		margin-bottom: 2rem;
	}
}

/**********************
add※footer共通
**********************/
.common-tgl-foot-add-wrap{
	text-align: center;
}
/*logo*/
.common-tgl-foot-add-logo{
	width: 82.35294117647059%;
	margin-right: auto;
	margin-left: auto;
	max-width: 28rem;
	margin-bottom: 5rem;
}
/*name*/
.common-tgl-foot-add-name{
	margin-bottom: 3rem;
}
@media screen and (min-width: 1200px){
	.common-tgl-foot-add-name{
		font-size: 1.3rem;
	}
}
/*tel*/
.common-tgl-foot-add-tel{
	font-size: 2.9rem;
	line-height: 1;
	margin-bottom: 0.8rem;
	max-width: 24rem;
	margin-right: auto;
	margin-left: auto;
}
.common-tgl-foot-add-tel a{
	display: flex;
	align-items: center;
	justify-content: center;
	color: #313131;
	text-decoration: none;
}
.ctfat-icon{
	display: inline-block;
	max-width: 2rem;
	margin-bottom: 0.1em;
	margin-right: 0.3em;
}
/*time*/
.common-tgl-foot-add-time{
	margin-bottom: 6.4rem;
}
@media screen and (max-width: 1199px){
	.common-tgl-foot-add-time{
		font-size: 1.4rem;
	}
}
@media screen and (min-width: 1200px){
	.common-tgl-foot-add-time{
		font-size: 1.2rem;
	}
}
/*copy*/
.common-tgl-foot-add-copy{
	font-size: 1rem;
	line-height: 1;
	padding-bottom: 10rem;
}

/**********************
ヘッダーの色をheader.phpテンプレートごとに変更
**********************/
.head-black .Toggle span{
	background-color: #000;
}
/*tgl開いたら*/
.fixed .head-black .Toggle span{
	background-color: #000;
}

/**********************
ページ ヘッダー
**********************/
.page-head{
	display: flex;
	padding-top: 8.8rem;
	justify-content: center;
	align-items: center;
}
@media screen and (max-width: 1199px){
	.page-head{
		display: flex;
		min-height: 24.2rem;
		padding-bottom: 2rem;
	}
}
@media screen and (min-width: 1200px){
	.page-head{
		display: flex;
		min-height: 40rem;
	}
}
/*font*/
.head-bfont{
	line-height: 1;
	font-weight: 400;
}
.head-bfont .d-block{
	padding-top: 0.6em;
}
@media screen and (max-width: 1199px){
	.head-bfont .efont{
		font-size: 4.5rem;
	}
	.head-bfont.head-bfont-small .efont{
		font-size: 4.5rem;
	}
	.head-bfont{
		font-size: 1.7rem;
	}
}
@media screen and (min-width: 1200px){
	.head-bfont .efont{
		font-size: 7rem;
	}
	.head-bfont{
		font-size: 1.78rem;
	}
}