@charset "utf-8";


/* 全体共通設定 */
body{
	margin:0;
	color:#2a2a2a;
	font-family:"Ryumin Medium KL";
	font-feature-settings:"palt" 1;
	font-size:20px;
}

@media screen and (max-width:779px){
	body{
		font-size:22px;
	}
}


/* mv設定 */

.mv{
	width: 100%;
	background: url("img/mv01.png")center/cover no-repeat;
	padding-bottom: 41.25%;
}


/* MV部分　ロゴ */
h1 {
	/*position: relative;*/
	top:30px;
	left: 2%;
	margin: 0;
}

h1 img {
	filter:drop-shadow(0px 0px 10px #fff);
	position: relative;
	top:3vh;
	left:2vw;
}



@media screen and (max-width:480px){
	h1 img {
		width: 43%;
		position: relative;
		top:0vh;
	}
}

@media screen and (min-width:481px) and ( max-width:648px){
	h1 img {
		width: 35%;
		position: relative;
		top:2vh;
	}
}

@media screen and (min-width:649px) and ( max-width:767px){
	h1 img {
		width: 30%;
	}
}

@media screen and (min-width:768px) and ( max-width:1023px){
	h1 img {
		width: 21%;
	}
}

@media screen and (min-width:1024px) and ( max-width:1479px){
	h1 img {
		width: 21%;
	}
}

@media screen and (min-width:1480px){
	h1 img {
		width: 21%;
	}
}


/* MV部分　テキスト */

div.mv h2 {
	/*position: relative;*/
	text-align:left;
	width: max-content;
}

h2.MV_text {
	margin-left: 1.5vw;
	font-size: 4vw;
	font-weight: 900;
	color: #fff;
	position: absolute;
	top: 25vw;
	left: 23vw;
	transform: translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	-ms-transform: translate(-50%, -50%);
}

h2.MV_text span {
	font-size: 2.5vw;	
}

@media screen and (max-width:480px){
	h2.MV_text {
		font-size: 6vw;
		position: absolute;
		top: 30vw;
		left: 32vw;
	}
	
	h2.MV_text span {
		font-size: 4.5vw;
	}
}


/* 各タイトル設定 */

h2.title {
	font-size:42px;
	margin: 15px 15px 25px;
	/*margin-bottom: 25px;*/
	/*margin: 25px 25px 30px 25px;*/
	font-weight: 500;
	text-align: center;
}

h3 {
	font-size:24px;
	margin: 0 15px 20px 15px;
	border-bottom: solid 4px #2a2a2a;
	font-weight: 600;
	text-align: center;
}

@media screen and (max-width:780px){
	h2.title {
		font-size:30px;
	}
	h3 {
		font-size:22px;
	}
}

/*h3::first-letter {
	border-bottom: solid 4px #f00;
}



/* コンテンツ部分 */

.bg1 , .bg2 {
	margin: 0 auto 0;
	background-color:#eff0f5;
}

.bg1{
	/*padding: 25px clamp(30px 15.7%, 150px) 0px;*/
	padding: 25px 2vw 0;
	}
.bg2{
	/*padding: 0px clamp(30px 15.7%, 150px) 85px;*/
	padding: 0 2vw 85px;
	}
/*
@media screen and (max-width:767px){
	
	.bg1{
		padding: 75px 10px;
	}

	.bg2{
		padding: 75px 10px;
	}
}

@media screen and (min-width:768px){
	.bg1{
		padding: 75px 125px;
	}

	.bg2{
		padding: 75px 125px;
	}
}*/



/* 各BOX設定 */

.baseBOX {
	display: flex;
	flex-direction: row;
	flex-flow: wrap;
	justify-content: space-between;
	padding-left: 0;
	margin: 0;
}


.baseBOX_01{
	background-color: #fff;
	border: 1px solid #272727;
	list-style: none;
	width: 100%;
	margin: 15px;	
	padding: 15px;
}


.baseBOX_02{
	background-color: #fff;
	border: 1px solid #272727;
	list-style: none;
	margin: 15px;
	padding: 15px;
	max-width: 917px;
}

@media screen and (min-width:1937px){
	.baseBOX_02{
		width: 46%;
	}
}

@media screen and (min-width:1456px) and (max-width:1936px){
	.baseBOX_02{
		width: 45.5%;
	}
}

@media screen and (min-width:1312px) and (max-width:1456px){
	.baseBOX_02{
		width: 45%;
	}
}

@media screen and (min-width:1193px) and (max-width:1311px){
	.baseBOX_02{
		width: 44.5%;
	}
}

@media screen and (min-width:1096px) and (max-width:1192px){
	.baseBOX_02{
		width: 44%;
	}
}

@media screen and (min-width:1012px) and (max-width:1095px){
	.baseBOX_02{
		width: 43.5%;
	}
}

@media screen and (min-width:941px) and (max-width:1011px){
	.baseBOX_02{
		width: 43%;
	}
}

@media screen and (min-width:878px) and (max-width:940px){
	.baseBOX_02{
		width: 42.5%;
	}
}

@media screen and (max-width:877px){
	.baseBOX_02{
		width: 93%;
	}
}



.inBOX {
	display: flex;
	flex-direction: row;
	flex-flow: wrap;
	justify-content: space-between;
	padding-left: 0;
	list-style: none;
}


.inBOX_color01 , .inBOX_color02 {
	margin: 15px;
	padding: 15px;
	list-style: none;
}

@media screen and (min-width:1861px){
	.inBOX_color01 , .inBOX_color02{
		width: 46.5%;
	}
}

@media screen and (min-width:1638px) and (max-width:1860px){
	.inBOX_color01 , .inBOX_color02{
		width: 46%;
	}
}

@media screen and (min-width:1464px) and (max-width:1637px){
	.inBOX_color01 , .inBOX_color02{
		width: 45.5%;
	}
}

@media screen and (min-width:1325px) and (max-width:1463px){
	.inBOX_color01 , .inBOX_color02{
		width: 45%;
	}
}

@media screen and (min-width:1212px) and (max-width:1324px){
	.inBOX_color01 , .inBOX_color02{
		width: 44.5%;
	}
}

@media screen and (min-width:1117px) and (max-width:1211px){
	.inBOX_color01 , .inBOX_color02{
		width: 44%;
	}
}

@media screen and (min-width:1037px) and (max-width:1116px){
	.inBOX_color01 , .inBOX_color02{
		width: 43.5%;
	}
}

@media screen and (min-width:968px) and (max-width:1036px){
	.inBOX_color01 , .inBOX_color02{
		width: 43%;
	}
}

@media screen and (min-width:909px) and (max-width:967px){
	.inBOX_color01 , .inBOX_color02{
		width: 42.5%;
	}
}

@media screen and (min-width:857px) and (max-width:908px){
	.inBOX_color01 , .inBOX_color02{
		width: 42%;
	}
}

@media screen and (min-width:811px) and (max-width:856px){
	.inBOX_color01 , .inBOX_color02{
		width: 41.5%;
	}
}

@media screen and (min-width:780px) and (max-width:810px){
	.inBOX_color01 , .inBOX_color02{
		width: 92%;
	}
}

@media screen and (max-width:779px){
	.inBOX_color01 , .inBOX_color02{
		width: 91%;
	}
}


.inBOX_color01 {
	background-color: #f1fbea;
	border: 1px soli #a5cb8b;
}

.inBOX_color02 {
	background-color: #e1ecfb;
	border: 1px soli #86a2c8;
}




.Lead_sentence {
	margin: 25px 15px 15px;
	/*margin: 0 25px 25px 25px;*/
	text-align: left;
}




.ininBOX {
	display: flex;
	flex-direction: row;
	flex-flow: wrap;
	justify-content: left;
	padding-left: 0;
}

.ininBOX li {
		width: 100%;
		/*max-width: 112px;*/
		background-color: #fff;
		list-style: none;
		text-align: center;
		vertical-align: middle;
		margin: 0 10px 10px 10px;
		padding: 10px 0px;
		font-weight: 500;
	}




/*価格表*/
.price_list {
	/*width: 100%;*/
	width: -webkit-fill-available;
	/*font-size: 18px;*/
	text-align: center;
	vertical-align: middle;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 25px;
}

.price_list tr:nth-child(2n+1) {
 background: #f8f8f8;
}

.price_list th {
	background-color: #989898;
	color: #fff;
	text-align: center;
	vertical-align: middle;
	padding: 10px 3px;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff ;
	border-bottom: 1px solid #6f6f6f;
}

.price_list td {
	padding: 10px 5px;
}


.price_list th:last-child {
 border-right: none;
}


.price_list tr {
	border-bottom: 1px solid #6f6f6f;
}

.price_list td {
 border-right: solid 1px #6f6f6f; 
}

.price_list td:last-child {
 border-right: none;
}


@media screen and (min-width:870px){
	.Annotation {
		/*margin: 5px 25px 25px 25px;*/
		line-height: 1.6em;
		text-indent: -1.3em;
		padding-left: 1.3em;
		padding-top: 30px;
		text-align: left;
	}
}

@media screen and (max-width:869px){
	.Annotation {
		font-size:21px;
		line-height: 1.6em;
		/*text-indent: -2.1em;*/
		padding: 30px 0 15px;
		/*padding-left: 40px;
		padding-top: 30px;
		padding-bottom: 15px;*/
		text-align: left;
	}
}



/*.Annotation {
	margin: 5px 25px 25px 25px;
	font-size: 12px;
	line-height: 1.6em;
	text-indent: -1.3em;
	padding-left: 1.3em;
	text-align: left;
}*/

@media screen and (min-width:1312px){
	.br1311 {
		display: none;
	}
}
@media screen and (max-width:1311px){
	.br1311 {
		display: block;
	}
}

/*FAQ*/
.QA {
	margin: 25px;
	/*width: 100%;*/
	padding: 0px;
}

.QA li{
	/*border: none;*/
	list-style: none;
	padding: 0;
	/*background-color: #f8f8f8;*/
	/*border: 1px solid #2a2a2a;*/
	margin: 0 0 25px 0;
	text-align: left;
	
}

.Q {
	display: inline-block;
	margin: 0 0 15px 0;
	padding-left: 2em;
	padding-top: 1vw;
	position: relative;
	/*width: 80%;*/
}

.Q::before {
	content: "Q";
	color: #1e64e6;
	font-size: 38px;
	font-weight: 900;
	position: absolute;
	left: 0px;
	top:-3px;
}

.A {
	display: inline-block;
	margin: 0 0 15px 0;
	padding-left: 2em;
	padding-top: 1vw;
	position: relative;
	/*width: 80%;*/
}

.A::before {
	content: "A";
	color: #fe0000;
	font-size: 38px;
	font-weight: 900;
	position: absolute;
	left: 0px;
	top:-3px;
}

/*会社概要*/
.outlin_list {
	/*width: 100%;*/
	/*text-align: center;*/
	vertical-align: top;
	border-collapse: collapse;
	border-spacing: 0;
	/*margin: 25px;*/
	margin-left: 62px;
	margin-right: 25px;
	list-style: none
}

.outlin_list li {
	margin-bottom: 10px;
}

@media screen and (min-width:780px){
	.outlin_list li p {
		/*display: none;*/
		margin-top: -30px;
		margin-left: -5px;
	}
}
@media screen and (max-width:779px){
	.outlin_list li p {
		/*display: block;*/
		margin-top: -30px;
		margin-left: 3px;
	}
}

.disable_tel a:[href^=“tel:”] {
	color:#fff;
    text_decoration:none;
    pointer-events:none;
}

.disable_tel a {
	color:#fff;
    text_decoration:none;
    pointer-events:none;
}

.outlin_list li.list01:before {
	content:'社　　名 ：';
	margin-left: -100px;
	margin-right: 10px;
}
.outlin_list li.list02:before {
	content:'代 表 者 ：';
	margin-left: -100px;
	margin-right: 10px;
}
.outlin_list li.list03:before {
	content:'所 在 地 ：';
	margin-left: -100px;
	margin-right: 10px;
}
.outlin_list li.list04:before {
	content:'設　　立 ：';
	margin-left: -100px;
	margin-right: 10px;
}
.outlin_list li.list05:before {
	content:'事業内容 ：';
	margin-left: -100px;
	margin-right: 10px;
}
.outlin_list li.list06:before {
	content:'お問合せ ：';
	margin-left: -100px;
	margin-right: 10px;
}


@media screen and (min-width:780px){
	.contact_area {
		margin-left: 0px;
		margin-top: -56px;
	}
}
@media screen and (max-width:779px){
	.contact_area {
		margin-left: 8px;
		margin-top: -60px;
	}
}
/*.contact_area {
	margin-left: 45px;
	margin-top: -70px;
	padding: 0;
	list-style: none;
}*/

.contact_area a {
	text-decoration: none;
	text-decoration-color: #2a2a2a;
}

.contact_area div {
	margin: -30px 0 20px;
	/*margin-bottom: 20px;*/
	padding-left: -30px;
}

.contact_area img {
	width: 45px;
	margin-right: 20px;
}



/*プロフィール*/
.prof {
	/*list-style-type :disc;*/
	counter-reset: list;
	list-style: none;
	margin: 25px;
	padding: 0;
	/*border-top: 1px solid #999;
	border-right: 1px solid #999;
	list-style-type: circle;
	list-style-position: inside;*/
}

.prof li {
	margin-bottom: 15px;
	position: relative;
	padding: 0 0 0 30px;
	
}

.prof li:before {
	counter-increment: list;
	content: "";
	/*display: inline-block;*/
	display: block;
	/*position: relative;*/
	position: absolute;
	left: 0px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color:#2a2a2a ;
	top: 23%;
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);	
}

@media screen and (max-width:779px){
	.prof li:before {
		top: 14%;
	}
}


.name_img {
	margin: 25px;
	text-align: right;
}

p.name_img img {
	width: 15vw;
}

@media screen and (max-width:480px){
	p.name_img img {
		width: 30vw;
	}
}

@media screen and (min-width:481px) and (max-width:779px){
	p.name_img img {
		width: 26vw;
	}
}

.detail_link {
	width: 100%;
	margin: 45px auto 30px;
	text-align: center;
	/*padding: 25px;*/
	/*text-align: right;*/
	/*color: #2a2a2a;*/
}

.detail_link a {
	background-color: #000;
	opacity: 0.70;
	width: 80%;
	padding: 15px 7vw;
	color: #fff;
	text-decoration: none;
	/*font-weight: bold;*/
	transition: 1s;
}

.detail_link a:hover {
	font-weight: bold;
	transition: 1s;
	color:#ff0000;
}


/*詳しくはこちら*/
.to_detail {
	width: 80%;
	margin: 30px auto 15px;
	padding: 15px;
	background-color: #000;
	opacity: 0.55;
	color: #fff;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
    /*align-items: center;
    position: fixed;
    bottom: 45px;
    right: 20px;*/
}
/*詳しくはこちら ここまで*/
    

/*モーダルウィンドウ用*/
.modal-window {
	position:fixed;
	top:0;
	left:0;
	z-index:100;
	display:flex;
	justify-content:center;
	align-items:center;
	width:100vw;
	height:100vh;
	background-color:rgba(0, 0, 0, 0.7);
	backdrop-filter:blur(5px);
}

.modal-window[aria-hidden="true"] {
	display:none;
}


@media screen and (max-width:479px){
	/* モーダル　本体 */
	.modal-window .content {
		position:relative;
		box-sizing:border-box;
		margin:20px;
		padding:1px;
		width: 88%;
		/*height: 15vh;*/
		/*max-width:600px;*/
		background-color:#fff;
	}
	
	/* モーダル　コンテンツ */
	.modal-window .content .body {
			border: 1px solid #2a2a2a;
			padding: 0px;
			margin: 30px 25px 25px;
			
		}
}
@media screen and (min-width:480px){
	/* モーダル　本体 */
	.modal-window .content {
		position:relative;
		box-sizing:border-box;
		margin:20px;
		padding:20px;
		width: 95%;
		/*height: 15vh;*/
		/*max-width:600px;*/
		background-color:#fff;
	}
	
	/* モーダル　コンテンツ */
	.modal-window .content .body {
			border: 1px solid #2a2a2a;
			padding: 25px;
			margin: 30px 25px 25px;
			
		}
}	
	
		

		.title_underline {
			margin: 0 25px 25px;
			color: #2a2a2a;
		}

		.detail_list {
			margin: 25px;
			list-style-type: none;
			padding: 0;
		}

		.detail_list li {
			margin-bottom: 30px;

}
		.detail_list li p {
			/*font-family: 'Shin Go Medium';*/
			font-weight: 600;
		}


		.list_No {
			list-style-type: decimal;
			/*margin-left: 25px;*/
		}

		.list_alp {
			list-style-type: lower-alpha;
			/*margin-left: 25px;*/
		}


		.last_right {
			text-align: right;
			margin: 25px;
		}



		/* 閉じるボタン */
		.modal-window .content .close {
			position:absolute;
			top:-10px;
			right:-10px;
			border-radius:50%;
			width:40px;
			height:40px;
			background:linear-gradient(#fff, #fff) 50% 50% / 3px 66% no-repeat, #333 linear-gradient(#fff, #fff) 50% 50% / 66% 3px no-repeat;
			font-size:0;
			transform:rotate(45deg);
			transition:background-color 0.2s;
		}

		.modal-window .content .close:hover,
		.modal-window .content .close:focus {
			background-color:#444;
		}


.ScrollContent {
	overflow-y: scroll;  /* コンテンツ量が多くなってもスクロールできるようになります */
	height: 80vh;  /* ウィンドウ内部のコンテンツの高さ */
	width: 95%;
	border-radius: 20px;
}
::-webkit-scrollbar {
  border-radius: 10px;
  width: 10px;  /* スクロールバーの幅 */
}

/* スクロールバーのツマミ部分 */
::-webkit-scrollbar-thumb {
  background-color: #b6b6b6;  /* ツマミの色を変更 */
  border-radius: 10px;  /* 角を丸くする */
}

/*モーダルウィンドウここまで*/




/* ここから下がハンバーガーメニューに関するCSS */
  
/* チェックボックスを非表示にする */
.drawer_hidden {
	display: none;
}

/* ハンバーガーアイコンの設置スペース */

@media screen and (min-width:781px){
	.drawer_open,.nav_content {
		display: none;
	}
}

@media screen and (max-width:780px){
.drawer_open {
	display: flex;
	height: 65px;
	width: 65px;
	background-color: #000;
	opacity: 0.55;
	border-radius: 10px;
	justify-content: center;
	align-items: center;
	position: fixed;
	top:10px;
	right: 20px;
	z-index: 100;/* 重なり順を一番上にする */
	cursor: pointer;
}



.drawer_open {
	display: flex;
	height: 65px;
	width: 65px;
	background-color: #000;
	opacity: 0.55;
	border-radius: 10px;
	justify-content: center;
	align-items: center;
	position: fixed;
	top:10px;
	right: 20px;
	z-index: 100;/* 重なり順を一番上にする */
	cursor: pointer;
}

/* ハンバーガーメニューのアイコン */
.drawer_open span,
.drawer_open span:before,
.drawer_open span:after {
	content: '';display: block;
	height: 4px;
	width: 40px;
	border-radius: 3px;
	background: #fff;
	transition: 0.5s;
	position: absolute;
}

/* 三本線の一番上の棒の位置調整 */
.drawer_open span:before {
	bottom: 15px;
}

/* 三本線の一番下の棒の位置調整 */
.drawer_open span:after {
	top: 15px;
}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer_input:checked ~ .drawer_open span {
	background: rgba(255, 255, 255, 0);
}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer_input:checked ~ .drawer_open span::before {
	bottom: 0;
	transform: rotate(45deg);
}

#drawer_input:checked ~ .drawer_open span::after {
	top: 0;
	transform: rotate(-45deg);
}
  
/* メニューのデザイン*/
.nav_content {
	width: 182px;
	/*height: 100%;*/
	background-color: #000;
	opacity: 0.55;
	border-radius: 10px;
	
	margin: 0;
	padding: 0;
	
	position: fixed;
	top: 80px;
	left: 100%; /* メニューを画面の外に飛ばす */
	z-index: 99;
	transition: .5s;
}


/* メニュー黒ポチを消す */
.nav_list {
	list-style: none;
	margin: 0 auto ;
	padding: 0;
}
		
.nav_item {
	margin: 15px;
	border-bottom: 1px #fff dotted;
}
		
.nav_item a {
	text-decoration: none;
	color: #fff;
}
		
.nav_item a:active {
	color: #f00;
}
		
.nav_item a:hover {
	color: #fff;
}
		
.nav_item a:visited {
	color: #fff;
}

/* アイコンがクリックされたらメニューを表示 */
#drawer_input:checked ~ .nav_content {
	left: 73vw;/* メニューを画面に入れる */
	/*right: 100px;*/
}

	@media screen and (min-width:501px) and (max-width:630px){
/* アイコンがクリックされたらメニューを表示 */
		#drawer_input:checked ~ .nav_content {
			left: 67vw;/* メニューを画面に入れる */
		}
	}
	
	@media screen and (min-width:481px) and (max-width:500px){
/* アイコンがクリックされたらメニューを表示 */
		#drawer_input:checked ~ .nav_content {
			left: 57vw;/* メニューを画面に入れる */
		}
	}
	
	@media screen and (max-width:480px){
/* アイコンがクリックされたらメニューを表示 */
		#drawer_input:checked ~ .nav_content {
			left: 46vw;/* メニューを画面に入れる */
		}
	}
	
}
/* メニューここまで */



/*PageTOPへ　ここから*/
.totop {
			width: 65px;
			height: 65px;
			background-color:#000 ;
			opacity: 0.55;
			color: #fff;
			border-radius: 90px;
			/*border: 2px solid #7ec9cf;*/
			font-size: 16px;
			font-weight: 600;
			text-align: center;
			align-items: center;
			position: fixed;
			/*top: 700px;*/
			bottom: 45px;
			right: 20px;
			line-height: 1.0;
		}
/*PageTOPへ　ここまで*/

.footer {
	width:100%;
	background-color: #000;
	font-size:12px;
	color:#fff;
	border-top:1px solid #f00;
	padding: 20px 0px;
	text-align: center;
}