@charset "UTF-8";
/* CSS Document */

/* ----- ブレイクポイント ---------------------------------------------------------------------------------------------------------------------------------
Lサイズ：パソコン
Mサイズ：タブレット向け：1024px
Sサイズ：スマホ向け：599px
 */
/* 【L】パソコン用 1024px〜 ----------------------------------------------------------- */
	@media screen and (min-width:1025px) {
		.L_none{display:none !important;}
	}
/* 【M】タブレット用 600px〜1023px -------------------------------------- */
	@media screen and (min-width:600px) and (max-width:1024px){
		.M_none{display:none !important;}
	}
/* 【S】スマホ用 〜599px ----------------------------------------------------- */
	@media screen and (max-width:599px) {
		.S_none{display:none !important;}
	}
/* 【M・S共通】 -------------------------------------- */
	@media screen and (max-width:1024px){
		.MS_none{display:none !important;}
	}



/* --- リセットCSS ------------------------------------------------------------------------------------------------------------------------------------- */

	html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, img, a, table, tr, th, td, input {
		margin: 0;
		padding: 0;
		border: 0;
		font-weight: normal;
		font-family:"メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		color:inherit;
		line-height:120%;}
	html,body{ /* 背景色が途切れないように */
		height:100%;
		min-height:100%;
		min-width:300px;
		color:#111;}
	html{
		font-size:62.5%;/* この指定により10px(=1rem)になる */}
	body{
		width:100%;
		height:100%;
		min-height:100%;
		font-size:1.6rem;/* 基本のフォントサイズをここで指定【16px】 */
		line-height:1.5;
		-ms-text-size-adjust:100%;
		-webkit-text-size-adjust:100%;}
	*, *::before, *::after { /* paddingとborderの値をオブジェクトのサイズに含める */
	    -webkit-box-sizing: border-box;
	       -moz-box-sizing: border-box;
	         -o-box-sizing: border-box;
	        -ms-box-sizing: border-box;
	            box-sizing: border-box;}
	article, header, footer, aside, figure, figcaption, nav, section { 
		display:block;}
	ol, ul {
		list-style: none;
		list-style-type: none;}
	figure{
		margin:0;
		padding:0;}
	
	/* すべての見出しやIDを持つ要素に対して、スクロール時の余白を作る */
	[id] {scroll-margin-top: 80px; /* ヘッダーの高さが60pxなら、少し余裕を持って80px程度に設定 */}
	
	/* リンクの設定は適宜変更する */
		a{
			text-decoration:none;
			color:#111;}
			a:link,a:visited,a:hover,a:active{color:#111;}

	/* フォームの初期設定リセット */
	input, button, textarea, select {
			-webkit-appearance:none;
			-moz-appearance:none;
		appearance:none;
		margin:0;
		padding:0;
		background:none;
		border:none;
		border-radius:0;
		outline:none;
		box-sizing:border-box;
		font-family:"ＭＳ Ｐゴシック","Hiragino Kaku Gothic Pro","Osaka",sans-serif;}
	select::-ms-expand {display: none;}
	button{cursor:pointer;}

	/* floatした親要素に高さを持たせる（親要素に指定する） */
	.clearfix::after {
		content: ".";
		display: block;
		clear: both;
		height: 0;
		visibility: hidden;}
		/* IE7,MacIE5 */
		.clearfix {display: inline-block;}
		/* WinIE6 below, Exclude MacIE5 \*/
		* html .clearfix {height: 1%;}
		.clearfix {display: block;}

/* --- END/リセットCSS ------------------------------------------------------------------------------------------------------------------------------------- */

/* ----- 共通設定 ---------------------------------------------------------------------------------------------------- */
	#sticky{position:relative;}
	.MT50{margin-top:50px;}
	#toTop{
		display:none;
		position:fixed;
		right:20px;
		bottom:80px;
		width:10%;
		max-width:130px;
		min-width:50px;
		cursor:pointer;
		z-index:1000;}
		#toTop img{width:100%;}
	button{
		font-family:Arial, Helvetica, sans-serif, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";
		font-weight:bold;}
	.jp > button{/* なぜか日本語だとfont-familyを指定すると動きがおかしくなるため */
		font-family:inherit;}
	.img_notsave{pointer-events:none;}
	@media print{
		/* 印刷しない */
		header{display:none;}
	}

/* ----- ヘッダー -------------------------------------------------- */
	header{
		position:-webkit-sticky;
		position:sticky;
		top:0;
		z-index:9999;}
	#header{
		width:100%;
		height:80px;
		background-color:rgba(199,199,199,0.3);
		border-bottom:1px solid rgba(0,0,0,0.1);
			display: -webkit-box;
			display: -ms-flexbox;
		display: flex;
			-webkit-box-orient: horizontal;
			-webkit-box-direction: normal;
			-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;
			-webkit-box-pack: justify;
			-ms-flex-pack: justify;
		justify-content: space-between;
			-webkit-box-align: center;
			-ms-flex-align: center;
		align-items: center;
		position:absolute;
		top:0;
		z-index: 999;}
	#header_rogo{padding-left:20px;}
		#header_rogo h1{
			line-height:0;
			display:block;}
	#header_menu{padding-right:30px;}
		#header_menu ul > li{
			display:inline-block;}
		#header_menu ul > li + li{margin-left:30px;}
			#header_menu ul > li a{
				text-align:center;
				display:inline-block;
				line-height:1;}
			#header_menu ul > li img{
				width:90%;}
			#header_menu ul > li p{
				position:relative;
				font-size:1.3rem;
				margin:3px -5px 0;/* borderを左右長くするためマイナス入れてる */
				padding-top:10px;}
				#header_menu ul > li p::after{
					/* 黄色の線 */
					content:'';
					display:block;
					width:26px;
					height:3px;
					position:absolute;
					top:0;
					left:0;
					background-color:#ff0;
					transition:.3s;}
					#header_menu ul > li:hover p::after{
						content:'';
						width:100%;}
				#header_menu ul > li p::before{
					/* 黒い線 */
					content:'';
					display:block;
					width:100%;
					height:3px;
					position:absolute;
					top:0;
					left:0;
					right:0;
					background-color:#000;}


	/* ----- レスポンシブ設定 -------------------------------------------------------------------------------------------------------- */
	/* （タブレット向け：1024px、スマホ向け：599px） */

	/* タブレット向け */
	@media only screen and (max-width: 1024px)  {
		/* ----- ヘッダー --------------------------------------------------（タブレット向け）--------------- */
							#header{height:60px;}
							#header_rogo h1 > img{width:80%;}
							#header_menu{}
								#header_menu ul > li{
									display:inline-block;}
								#header_menu ul > li:not(:last-child){margin-right:15px;}
								#header_menu ul > li + li{margin-left:0;}
									#header_menu ul > li a{
										text-align:center;
										display:inline-block;
										line-height:1;}
									#header_menu ul > li img{display:none;}
									#header_menu ul > li p{
										position:relative;
										font-size:1.3rem;
										margin:0;/**/
										padding-top:0;/**/}
										#header_menu ul > li p::after{content:none;}
											#header_menu ul > li:hover p::after{content:none;}
										#header_menu ul > li p::before{content:none;}
	}
	/* スマホ向け */
	@media only screen and (max-width: 599px) {
		/* ----- ヘッダー -----------------------------------------------（スマホ向け）------------------ */
/* スマホ向けのメニュー作成途中 */
								#header{
									width:100%;
									height:50px;
									background-color:transparent;
										-webkit-box-orient: horizontal;
										-webkit-box-direction: normal;
										-ms-flex-flow: column nowrap;
									flex-flow: column nowrap;}
									#header_rogo{
										width:100%;
										text-align:center;
										background-color:rgba(255,255,255,0.95);
										border-bottom:1px solid #f1f1f1;
										position:relative;
										z-index:9999;
										padding-left:0;
										padding-right:40px;}

									#header_rogo > a{
										display:block;
										padding:10px;
										height:50px;}
									#header_rogo h1 > img{
										width:180px;}
									#header_menu{
										width:100%;
										padding-right:0;}
										#header_menu ul{
											position:relative;
											z-index:999;}
											#header_menu ul > li{
												display:block;
												width:100%;
												background-color:rgba(0,0,0,0.5);
												transition:background-color .5s;}
												#header_menu ul > li:hover{background-color:rgba(0,0,0,0.7);}
											#header_menu ul > li,
											#header_menu ul > li:not(:last-child),
											#header_menu ul > li + li{
												margin:0;
												padding:0;
												border-top:1px solid rgba(255,255,255,0.2);}
												#header_menu ul > li a{
													display:block;
													padding:10px 0;}
												#header_menu ul > li p{
													font-size:1.6rem;
													color:#fff;
													display:block;
													width:100%;
													margin:0;
													padding-top:0;}
								/* ハンバーガーメニュー */
									.menu-trigger,
									.menu-trigger span{
										display:inline-block;
										box-sizing:border-box;}
									.menu-trigger span{transition:all .4s;}
								.menu-trigger{
										position:absolute;
										top:0;
										right:0;
										z-index:9999;
										display:block;
										width:32px;
										height:24px;
										padding:12px;
										/* このpaddingが無いと、ハンバーガーメニューぴったりにマウスを乗せないとリンクが反応しないため */
										box-sizing:content-box;
										cursor:pointer;}
									.menu-trigger span{
										position:absolute;
										left:12px;/* .menu-triggerのpadding */
										width:32px;
										height: 4px;
										background-color: #111;
										border-radius: 4px;}
										.menu-trigger span:nth-of-type(1){top:12px;}/* .menu-triggerのpadding分をプラスする(下の2つも同様) */
										.menu-trigger span:nth-of-type(2){top:22px;}
										.menu-trigger span:nth-of-type(3){bottom:12px;}
											input[type="checkbox"]:checked  + .menu-trigger span:nth-of-type(1){
												-webkit-transform:translateY(10px) rotate(-315deg);
												transform:translateY(10px) rotate(-315deg);}
											input[type="checkbox"]:checked  + .menu-trigger span:nth-of-type(2){opacity:0;}
											input[type="checkbox"]:checked  + .menu-trigger span:nth-of-type(3){
												-webkit-transform:translateY(-10px) rotate(315deg);
												transform:translateY(-10px) rotate(315deg);}
								input[type="checkbox"] ~ .menu-trigger + ul{/* inputと兄弟要素にしないとちゃんとならないので注意！ */
									transform:translateY(-100%);
									opacity:0;/* iPhoneでスワイプしたら画面の上にメニューが見えてしまうため */
									transition:.5s ease-out;}
								 input[type="checkbox"]:checked ~ .menu-trigger + ul{
									 transform:translateY(0);
									 opacity:1;}
	}

/* ----- フッター -------------------------------------------------- */
	footer{
		background:#fff550;
		padding-top:100px;}
	#footer_rogo{
		margin-left:20px;}
	#footer_conte{
		background:#000;
		width:100%;
		height:50px;
		padding:0 20px;
			display: -webkit-box;
			display: -ms-flexbox;
		display: flex;
			-webkit-box-orient: horizontal;
			-webkit-box-direction: normal;
			-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;
			-webkit-box-pack: justify;
			-ms-flex-pack: justify;
		justify-content: space-between;
			-webkit-box-align: center;
			-ms-flex-align: center;
		align-items: center;}
	#footer_left{}
		#footer_left > p,
		#footer_left > div{
			display:inline-block;
			color:#fff;
			line-height:1.4;}
		#footer_left > p{padding-left:1em;}
	#footer_right{}
		#footer_right > ul li{display:inline-block;}
			#footer_right > ul li:not(:last-child){margin-right:1em;}
			#footer_right > ul li a{
				color:#e2e2e2;
				display:inline-block;
				font-size:0.8em;}
			#footer_right > ul li a::first-letter{
				font-size:0.5em;
				padding-right:0.5em;
				color:#ff0;
				vertical-align:top;}
	/* ----- レスポンシブ設定 -------------------------------------------------------------------------------------------------------- */
	/* （タブレット向け：1024px、スマホ向け：599px） */

	/* タブレット向け */
	@media only screen and (max-width: 1024px)  {
		/* ----- フッター --------------------------------------------------（タブレット向け）--------------- */
					#footer_conte{
						display:block;
						height:auto;
						padding:15px 20px;}
					#footer_right{margin-top:0.5em;}
	}
	/* スマホ向け */
	@media only screen and (max-width: 599px) {
		/* ----- フッター -----------------------------------------------（スマホ向け）------------------ */
					#footer_rogo > a img{width:60%;}
					#footer_left > div{font-size:1.2em;}
					#footer_left > p{display:block;}
	}

/* ----- 中身 -------------------------------------------------- */
	#contents_wrap{}
		#contents_wrap > section{
			min-height:100vh;
			padding:100px 0 50px;
			position:relative;}
	.contents_inner{
		position:relative;
		width:950px;
		padding-top:50px;
		margin:auto;}
		#toppage .contents_inner{padding-top:0;}
		.contents_inner.news{padding:100px 0 50px;}
		.contents_inner .index_h2{
			font-size:2.4rem;
			line-height:1.5;
			margin-bottom:50px;}
		.contents_inner .index_h2 > img{
			display:block;
			height:42px;
			max-height:inherit;}
		.contents_inner h3{
			font-size:2.6rem;
			line-height:1.5;
			font-weight:bold;
			margin-bottom:1em;}
			.contents_inner h3 > br{display:none;}
	/* トップページ */
	#contents_top{
		width:100%;
		height:100vh;
		position:relative;
		}
	#contents_top_words{
		width:100%;
		height:100%;
		position:relative;}
		#contents_top_words > img{
			width:85%;
			max-width:1000px;
			height:auto;
			position:absolute;
			z-index:2;
			top:30%;
			left:0;
			right:0;
			margin:auto;}
	#contents_top_bg{
		width:100%;
		height:100%;
		position:absolute;
		top:0;
		left:0;
		overflow:hidden;}
		.contents_top_bg_movie{
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100vh;
			background-color:#fff;}
			.contents_top_bg_movie > video{
				min-width:100%;
				min-height:100vh;
				z-index:1;}
/*
		.contents_top_bg1,
		.contents_top_bg2,
		.contents_top_bg3{
			width:100%;
			height:100%;
			overflow:hidden;
			position:absolute;
			top:0;
			left:0;
			z-index:-30;
			background:url(../images/kari_bg1.jpg) no-repeat center;
			background-size:cover;
			animation:anime_bg1 40s infinite;}
		.contents_top_bg2{
			opacity:0;
			z-index:-10;
			background:url(../images/kari_bg2.jpg) no-repeat center;
			background-size:cover;
			animation:anime_bg2 40s infinite;}
		.contents_top_bg3{
			opacity:0;
			z-index:-20;
			background:url(../images/kari_bg3.jpg) no-repeat center;
			background-size:cover;
			animation:anime_bg3 40s infinite;}
				 同じ秒数にする 
				@keyframes anime_bg1 {
					0% {opacity:1;}
					33% {opacity:1;
						transform: scale(1.1);}
					66% {opacity:1;}
					100% {opacity:1;}
					}
				@keyframes anime_bg2 {
					0% {opacity:0;}
					26% {opacity:0;
						transform: scale(1);}
					33% {opacity:1;}
					59% {opacity:1;}
					66% {opacity:0;
						transform: scale(1.1);}
					100% {opacity:0;}
					}
				@keyframes anime_bg3 {
					0% {opacity:0;}
					56% {opacity:0;}
					57% {opacity:1; bg2が59%から透明になり始めるからその前に不透明にする。そうしないとbg1がうっすら見える 
						transform: scale(1);}
					92% {opacity:1;}
					100% {opacity:0;
						transform: scale(1.1);}
					}
*/
		#contents_top_scroll{/* スクロールアイコン */
			width:200px;
			position:absolute;
			bottom:50px;
			left:30px;
			text-align:center;}
		.contents_top_scroll_1{
			width:60px;
			position:relative;
			top:-25px;
			animation:passing_7602 4s linear infinite;
			transform-origin:50% 50%;}
		.contents_top_scroll_2{
			width:160px;
			animation:passing_7602 4s linear infinite;
			transform-origin:50% 50%;}
			@keyframes passing_7602 {
				0%		{transform:translateY(-50%);opacity:0}
				20%		{transform:translateY(0%);opacity:1}
				40%		{transform:translateY(50%);opacity:1}
				80%		{transform:translateY(50%);opacity:1}
				100%	{transform:translateY(50%);opacity:0}
			}
		#contents_top_scroll_s{/* スクロールアイコン/モバイル */
			width:10%;
			min-width:50px;
			max-width:80px;
			display:inline-block;
			position:absolute;
			margin:auto;
			bottom:20%;
			left:0;
			right:0;}
			#contents_top_scroll_s img{
				width:100%;
				animation:contents_top_scroll_s 4s linear infinite;
				transform-origin:50% 50%;}
				@keyframes contents_top_scroll_s {
				  0%	{transform:translateY(80%);opacity:0 }
				  25%	{transform:translateY(0%);opacity:1}
				  50%	{transform:translateY(-80%);opacity:0}
				  100%	{transform:translateY(-80%);opacity:0}
				}
		.contents_top_bg4{/* 黄色の背景 */
			width:100%;
			height:100%;
			position:relative;
			z-index:1;
			/*background:url(../images/bg_yellow_left-UP_right-DOWN.svg) no-repeat bottom; */
			}
			.contents_top_bg4 > img{
				position:absolute;
				bottom:-1px;
				width:100%;
				height:auto;}
	.contents_text{
		position:relative;
		padding-right:2em;
		display:inline-block;
		vertical-align:top;}
		.contents_text + .contents_text{margin-top:100px;}
		#top_about .contents_text{width:55%;} 
		.contents_text > p{
			font-size:1.6rem;/* レスポンシブ設定あり(これは最小値) */
			line-height:1.5;
			text-align:justify;}
			.contents_text > p:not(:last-child){margin-bottom:1em;}
		.contents_text_link,
		.contents_text_link_bl{
			width:10em;
			height:3em;
			line-height:normal;
			display:inline-block;
			border:2px solid #000;
			text-align:center;}
		.contents_text_link{background-color:#fff;}
		.contents_text_link_bl{
			border:2px solid #fff;
			background-color:#000;
			margin-top:1em;}
			.contents_text_link + .contents_text_link,
			.contents_text_link_bl + .contents_text_link_bl{margin-left:20px;}
			.contents_text_link > button,
			.contents_text_link_bl > button{
				display:block;
				width:100%;
				height:100%;
				color:#000;
				font-size:1.3em;
				font-weight:bold;
				transition:letter-spacing .8s , background-color .4s;}
			.contents_text_link_bl > button{color:#fff550;}
				.contents_text_link > button:hover,
				.contents_text_link_bl > button:hover{
					background-color:#000;
					letter-spacing:2px;
					color:#fff;}
				.contents_text_link_bl > button:hover{
					background-color:#fff550;
					color:#000;}
/* 【M】タブレット用 600px〜1024px -------------------------------------- */
	@media screen and (min-width:600px) and (max-width:1024px){
		#contents_top_scroll{/* スクロールアイコン */
			width:100px;
			bottom:10px;
			left:20px;}
		.contents_top_scroll_1{width:35%;}
		.contents_top_scroll_2{width:100%;}

	}


	/* スマホ向け */
	@media only screen and (max-width: 599px) {
		/* ----- トップ画像 -----------------------------------------------（スマホ向け）------------------ */
					#contents_top{height:inherit;}
						#contents_top::before{
							content:'';
							padding-top:140%;
							display:block;}
					#contents_top_words{
						position:absolute;
						top:0;
						left:0;}
		.contents_top_bg_movie{
			background:url(../images/top_saikaibasi.jpg) no-repeat center center/cover;}

	}



	/* ----- トップページ【私たちについて】------------------------------------------------------------------------------------- */
	#top_about{
		position:relative;
		background:#fff url(../images/bg_yellow_right-TOP_left-BOTTOM.svg) no-repeat;
		background-size:100% auto;
		background-position:30% 70px;/* #top_about::beforeの高さに使用 */
			display:-webkit-box;
			display:-ms-flexbox;
		display:flex;
			-webkit-box-orient:horizontal;
			-webkit-box-direction:normal;
			-ms-flex-direction:row;
		flex-direction:row;
			-webkit-box-pack:center;
			-ms-flex-pack:center;
		justify-content:center;
			-webkit-box-align:center;
			-ms-flex-align:center;
		align-items:center;}
		#top_about::before{
			content:'';
			width:100%;
			height:71px;/* #top_aboutのbackground-position高さ+1px */
			position:absolute;
			top:0;
			left:0;
			background-color:#fff550;}
		#top_about > div.contents_inner{
			margin:0;}
		#top_about_image{
			display:inline-block;
			position:relative;}
			#top_about_image > img{
				position:relative;
				z-index:10;
				width:400px;/* 3:2になる画像を用意 */
				height:266px;}
			#top_about_image > span{
				display:block;
				width:100%;
				height:120px;
				background-color:#000;
				position:relative;
				z-index:0;
				bottom:100px;
				left:25px;}
	/* ----- トップページ【サービス】------------------------------------------------------------------------------------- */
	#top_service{
		position:relative;}
		#top_service::before{
			content:'';
			width:100%;
			height:100%;
			position:absolute;
			z-index:-2;
			top:0;
			left:0;
			background:url(../images/SERVICE_top_image.jpg) no-repeat center;
			background-size:cover;}
		#top_service::after{
			content:'';
			display:block;
			width:100%;
			height:100%;
			position:absolute;
			z-index:-1;
			top:0;
			left:0;
			background:url(../images/bg_white_left-TOP_right-BOTTOM.svg) no-repeat;
			background-size:100% auto;}
			#top_service .contents_inner,
			#top_news .contents_inner,
			#top_contact .contents_inner{
				width:55%;
				max-width:750px;
				text-align:center;
				margin:auto;
				background-color:rgba(255,245,80,0.75);}
			#top_service .contents_inner{
				padding:50px 0;}
			#top_service .index_h2,
			#top_news .index_h2,
			#top_contact .index_h2{
				text-align:center;
				margin-bottom:20px;}
			#top_service .index_h2 > img,
			#top_news .index_h2 > img,
			#top_contact .index_h2 > img{margin:auto;}
			#top_service .contents_text{
				width:90%;
				text-align:justify;
				padding:0;
				margin:auto;}
		.top_service_sentence{
			background-color:#000;
			color:#fff;
			padding:25px;
			position:relative;
			}
		.top_service_sentence:first-of-type{left:150px;}
		.top_service_sentence:nth-of-type(2){
			right:230px;
			text-align:right;}
		.top_service_sentence +	.top_service_sentence{margin-top:50px;}
			.top_service_sentence *{color:inherit;}
		.top_service_sentence h4{
			font-size:2em;
			margin-bottom:0.4em;}
		.top_service_sentence span{
			font-size:0.5em;
			margin-left:1em;
			color:#fff550;
			letter-spacing:0.2em;}
		.top_service_sentence p{
			font-size:0.9em;
			line-height:1.5;
			text-align:justify;}
		.top_service_sentence:nth-of-type(2) span{
			margin-right:0.7em;}

	/* ----- トップページ【お知らせ】------------------------------------------------------------------------------------- */
		#contents_wrap > section#top_news{
			min-height:inherit;
			padding-bottom:100px;}
		#top_news{
			overflow:hidden;
			padding:0;
			background:url(../images/bg_gray_left-UP_right-DOWN.svg) no-repeat;
			background-size:100% auto;
			background-position:bottom;}
		#top_news .contents_inner{/* serviceに共通設定あり */
			background-color:transparent;}
		#top_news .index_h2 > img{/* serviceに共通設定あり */}
		.top_news_content{
			margin:0;
			padding:0;}
		.top_news_content > article{
			margin-top:50px;
			background-color:#fff;
			font-size:1.2em;
			line-height:100%;
			transition:all .5s;
				-moz-box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.15);
				-webkit-box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.15);
				-ms-box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.15);
			box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.15);}
			.top_news_content > article:hover{
					-moz-box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, 0.25);
					-webkit-box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, 0.25);
					-ms-box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, 0.25);
				box-shadow: 0px 0px 20px 4px rgba(0, 0, 0, 0.25);}
		.top_news_content > article > a{
			padding:23px 20px 20px;
				display:-webkit-box;
				display:-ms-flexbox;
			display:flex;
				-webkit-box-orient:horizontal;
				-webkit-box-direction:normal;
				-ms-flex-direction:row;
			flex-direction:row;
				-webkit-box-align:center;
				-ms-flex-align:center;
			align-items:center;}
			.top_news_content > article > a:link,
			.top_news_content > article > a:visited,
			.top_news_content > article > a:hover,
			.top_news_content > article > a:active{color:#000;}
		.top_news_content > article time{
			width:8em;
			color:inherit;}
		.top_news_content > article p{
			width:calc( 100% - 8em );
			padding:10px 10px 10px 1em;
			border-left:1px solid #000;
			color:inherit;
			text-align:justify;}

	/* ----- トップページ【お問い合わせ】------------------------------------------------------------------------------------- */
		#top_contact{
			background:#f2f2f2 url(../images/bg_yellow_left-BOTTOM_right-TOP.svg) no-repeat right bottom;
			background-size:100% auto;
			padding-top:100px;}
		#top_contact .contents_inner{/* serviceに共通設定あり */
			width:55%;
			max-width:750px;
			margin:0 auto;
			background-color:transparent;}
		#top_contact .index_h2{/* serviceに共通設定あり */}
		#top_contact .index_h2 > img{/* serviceに共通設定あり */}
		#top_news_form_body{
			background-color:transparent;}
		.top_news_form_conte{}
		.top_news_form{
			font-size:1.4em;}
			.top_news_form input[type="text"],
			.top_news_form textarea{
				background-color:#fff;
				width:100%;
				height:44px;
				padding:10px;
				font-size:2rem;
				transition:.3s;
				resize:none;}
				.top_news_form input[type="text"]:focus,
				.top_news_form textarea:focus{
					box-shadow: 0 0 10px 0 #ccc inset;
					background-color:#fdfdfd;
					outline: 0;}
			.top_news_form textarea{
				height:160px;}
		.top_news_form_title{
			border-left:6px solid #000;
			padding-left:0.4em;}
		.top_news_form_input{
			margin:10px 0 30px;}
		.top_news_form_submit{
			text-align:center;}
			.top_news_form_submit button{
				position:relative;
				vertical-align:middle;
				width:80%;
				height:60px;
				padding:5px;
				background-color:#000;
				border:4px solid #000;
				color:#fff;
				font-size:1.2em;
				transition:background-color 2s, color .8s, opacity 3s;}
				.top_news_form_submit button:hover{
					background-color:#fff;
					color:#000;}
				.top_news_form_submit button::before{
					content:'▶';
					font-size:0.5em;
					color:#000;
					opacity:0;
					position:relative;
					top:-5px;}
				.top_news_form_submit button:hover::before{
					color:#000;
					opacity:1;}

	/* ----- トップページ【お問い合わせ/メールフォーム】------------------------------------------------------------------------------------- */

			#formWrap {
				width:100%;
				margin:0 auto;}
			table.formTable{
				width:100%;
				margin:10px auto 30px;
				border-collapse:collapse;}
				table.formTable tr{
					border-bottom:1px solid #000;}
				table.formTable tr:first-of-type{
					border-top:1px solid #000;}
				table.formTable tr:last-of-type{
					display:none;}
				table.formTable td,
				table.formTable th{
					padding:10px;}
				table.formTable th{
					width:150px;
					font-weight:normal;
					font-size:0.9em;
					background:#000;
					color:#fff;
					text-align:left;}
			p.error_messe{
				margin:5px 0;
				color:red;}
			.formText{
				text-align:justify;}
			.formText > h4{
				text-align:center;
				font-size:1.5em;
				margin:0 0 20px;}
			.formSubmit{
				text-align:center;
				margin-top:20px;}
			.formBtn_back{
				cursor:pointer;
				font-size:0.8em;}
			.formBtn_submit{
				margin-left:30px;
				padding:5px;
				width:10em;
				cursor:pointer;
				font-size:1.4em;
				background:#000;
				color:#fff;}
                .formBtn_submit:disabled{
                    opacity: .3;
                    pointer-events: none;}
		.mail_thanks{}
			.mail_thanks_top figure{text-align:center;}
			.mail_thanks_top figure > img{
				width:90%;
				max-width:300px;
				margin:auto;
				margin:0 auto 10px;}
			.mail_thanks p{
				line-height:1.5;
				text-align:justify;}
				.mail_thanks p + p{margin-top:0.5em;}
		.mail_thanks_top{
			margin:0 auto 1em;
			font-size:1.3em;}
			.mail_thanks_top > p{text-align:center;}

	/* ----- ページ内共通項目 --------------------------------------------------------------------------------------------------------- */
	.contents_inner > h2{
		line-height:1.5;
		margin-bottom:20px;}
		.contents_inner > h2 img{
			display:block;
			max-height:30px;
			max-width:300px;}
	.link_back{/* もどるボタン */
		padding-top:80px;}
		.link_back > button{
			width:50%;
			max-width:360px;
			min-width:200px;}
			.link_back > button img{width:100%;}

	/* ----- アバウトのページ -------------------------------------------------------------------------------------------------------- */
	#about{
		background:url(../images/bg_yellow_right-TOP_left-BOTTOM.svg) no-repeat;
		background-size:contain;
		position:relative;}
		#about::before{
			content:'';
			display:block;
			width:100%;
			height:100%;
			position:absolute;
			top:0;
			left:0;
			background:url(../images/bg_gray_left-UP_right-DOWN.svg) no-repeat center bottom;
			background-size:contain;}
	.pagetop_link{margin-bottom:40px;}
		.pagetop_link > li{display:inline-block;}
		.pagetop_link > li > a{
			font-size:1.2em;
			line-height:3;
			position:relative;}
			.pagetop_link > li > a::after{
				content:'';
				display:inline-block;
				position:absolute;
				bottom:-0.4em;
				left:-5%;/* width110%で5%分はみ出させるため */
				background-color:#000;
				width:110%;
				height:3px;
				transition:transform .5s ease;}
				.pagetop_link > li > a:hover::after{
					transform:scaleY(2);}
		.pagetop_link > li:not(:first-child){
			margin-left:50px;}
	#about_greeting{}
		#about_greeting > .contents_text{width:100%;}
			#about_greeting > .contents_text > p{
				font-size:1em;
				line-height:2.4;}
			#about_greeting > .contents_text > p:last-of-type{
				text-align:right;}
	.about_greeting_photo{
		position:relative;
		width:100%;
		margin:50px 0;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		display:block;}
		.about_greeting_photo::before{
			content:'';
			display:block;
			padding-top:30%;}
		.about_greeting_photo::after{
			content:'';
			background:url(../images/about_president.jpg) no-repeat center 25%;
			background-size:cover;
			display:block;
			width:100%;
			height:100%;
			position:absolute;
			top:0;
			left:0;}
		#about_gaiyou{
			background-color:#f2f2f2;}
		.about_gaiyou{
			width:100%;
			border-collapse:collapse;}
			.about_gaiyou dl{
				padding:24px 0;
				border-bottom:1px solid #000;
					display:-webkit-box;
					display:-ms-flexbox;
				display:flex;
					-webkit-box-orient:horizontal;
					-webkit-box-direction:normal;
					-ms-flex-direction:row;
				flex-direction:row; /* 子要素横並び */
					-webkit-box-align:center;
					-ms-flex-align:center;
				align-items:center;/* 子要素同士で中央並び */}
			.about_gaiyou dt{
				padding-left:1em;
				width:150px;
				text-align:left;
				white-space:nowrap;
				float:left;}
			.about_gaiyou dd{
				line-height:2;}
			.about_gaiyou a{
				text-decoration:underline;}
			.about_gaiyou ol{
				list-style-type:decimal;
				margin-left:1.2em;}
	#isms_gaiyou{
		position:relative;
		background:url(../images/bg_yellow_left-UP_right-DOWN.svg) no-repeat center bottom;
		background-size:contain;}
		#isms_gaiyou::before{
			content:'';
			display:block;
			width:100%;
			height:100%;
			position:absolute;
			top:0;
			left:0;
			background:url(../images/bg_gray_left-down_right-up.svg) no-repeat center top;
			background-size:contain;}
		#isms_gaiyou dl{margin-bottom:30px;}
		#isms_gaiyou dt{
			border-bottom:1px solid #000;
			font-weight:bold;
			font-size:1.2em;
			padding:10px 0;
			margin-bottom:10px;}
		#isms_gaiyou dd{
			line-height:2;
			text-align:justify;}
	.link_bl_big{
		text-align:center;
		margin:100px 0;}
		.link_bl_big > div + div{
			margin-top:50px;}
		.link_bl_big > div > button{
			font-size:inherit;
			display:block;
			width:100%;
			max-width:600px;
			margin:auto;
			padding:20px;
			background-color:#000;
			border:4px solid #000;
			color:#fff;
			transition:background-color 1s ease , letter-spacing .5s ease-in-out;}
		.link_bl_big > div > button:hover{
			background-color:#fff;
			color:#000;
			letter-spacing:4px;}
		/* プライバシーポリシーとISMS概要 */
		#about_pp{
			position:relative;
			background:url(../images/bg_yellow_left-UP_right-DOWN.svg) no-repeat center bottom;
			background-size:contain;}
			#about_pp::before{
				content:'';
				display:block;
				width:100%;
				height:100%;
				position:absolute;
				top:0;
				left:0;
				background:url(../images/bg_gray_left-down_right-up.svg) no-repeat center top;
				background-size:contain;}
			#about_pp dl{}
			#about_pp dt{
				font-size:1.2em;
				font-weight:bold;
				border-bottom:1px solid #000;
				padding-bottom:5px;
				margin-bottom:10px;}
				#about_pp dt:not(:first-of-type){margin-top:50px;}
			#about_pp dd{}
				#about_pp dd  p,
				#about_pp dd li{
					line-height:1.8;
					text-align:justify;}
				#about_pp dd > p + p,
				#about_pp dd li + li{padding-top:0.5em;}
			#about_pp dd ol{
				list-style:decimal;
				margin-left:1.4em;}
		.about_isms_intro{margin-bottom:80px;}
			.about_isms_intro p{
				line-height:1.8;
				text-align:justify;}
				.about_isms_intro p + p{margin-top:0.5em;}
		.about_isms_end{
			margin-top:50px;}
			.about_isms_end P{
				text-align:right;
				padding-top:0.2em;}
		.about_pp_cookie{}
			.about_pp_cookie li{font-weight: bold;}
			.about_pp_cookie li p{
				margin-left: 1em;
				font-size: .9em;}
			.about_pp_cookie li + li{margin-top: 1em;}
	.cookieLink{}
		.cookieLink a{
			color: #004097;
			margin-left: 2em;
			font-size: .9em;}
			.cookieLink a:hover{border-bottom: 1px dotted #004097;}
		.cookieLink > div + div{margin-top: .5em;}

	/* ----- ニュース ------------------------------------------------------------------------------------------------------------------- */
	#news_page{
		position:relative;
		background:url(../images/bg_yellow_left-UP_right-DOWN.svg) no-repeat center bottom;
		background-size:contain;}
		#news_page::before{
			content:'';
			display:block;
			width:100%;
			height:100%;
			position:absolute;
			top:0;
			left:0;
			background:url(../images/bg_gray_left-down_right-up.svg) no-repeat center top;
			background-size:contain;}
	.news_wrap{
		padding:80px 0;
		border-bottom:1px solid #000;}
		.news_wrap > p{line-height:1.8;}
			.news_wrap > p + p{margin-top:0.5em;}
		.news_wrap table{
			margin:30px 0;
			font-size:1.2em;
			line-height:1.3;}
			.news_wrap table td{
				padding:10px 0 0;
				line-height:1.5;}
	.news_title{
		font-size:1.5em;
		font-weight:bold;
		margin-bottom:1em;}
		.news_title > *{}
		.news_title > * + *{padding-left: 1em;}

	.news_oldlink{margin-top:80px;}
		.news_oldlink > a{
			display:inline-block;
			position:relative;}
		.news_oldlink > a + a{margin-left:30px;}
			.news_oldlink > a::before,
			.news_oldlink > a::after{
				content:'';
				position:absolute;
				bottom:-5px;
				left:-3%;
				height:4px;
			transition:.3s;}
			.news_oldlink > a::before{
				width:106%;
				background-color:#000;}
			.news_oldlink > a::after{
				width:20%;
				background-color:#ccc;}
			.news_oldlink > a:hover::before,
			.news_oldlink > a:hover::after{bottom:-2px;}
	.news_small{
		font-size:0.9em;
		line-height:1.2 !important;}


/* php用のcss */
#newsPHP{
	display: flex;
	flex-direction: column;
	min-height: 100vh;}
	#newsPHP > main{
		flex: 1;
		/* ↑余ったスペースをすべてメインコンテンツが占有する */}
	#newsPHP .contents_inner.news{
		padding: 100px 0 100px;}
	#newsPHP .news_wrap{
		padding: 80px 0 120px;
		border-bottom: none;}
	#newsPHP footer{}
	#newsPHP button{
		display: inline-block;
		padding: 12px 32px;
		background-color: #333; /* 濃いグレー。サイトの色に合わせて変更してください */
		color: #fff;
		text-decoration: none;
		border-radius: 4px;
		font-weight: bold;
		border: none;
		cursor: pointer;
		transition: background-color 0.3s, transform 0.2s;}
		#newsPHP button:hover{
			background-color: #555;
			transform: translateY(-1px); /* 軽く浮き上がる演出 */}
		#newsPHP button:active{
			transform: translateY(0); /* クリックした時に沈む */}

/* phpニュース一覧用 */
#newsPHP_list{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 100vh;}
	#newsPHP_list > main#contents_wrap{
			flex: 1;}
		#newsPHP_list > main#contents_wrap > section{
			min-height: inherit;
			width: 60%;
			margin: 120px auto 50px;
			padding: 0;}
	#newsPHP_list h2{
		margin: 0 0 1em;
		font-weight: bold;}

	#newsList{
		min-width: 300px;}
		#newsList > li:not(.newsPHPList_bottom){
			display: flex;
			padding: 12px 4px 8px;
			border-bottom: 1px dotted #333;
			font-size: 1.2em;}
			#newsList .title{
				padding-left: 1em;
				flex: 1;}
				#newsList .title a{
					display: block;
					transition: color .3s;}
				#newsList .title a:hover{color: #BCBC2C;}

	.newsPHPList_bottom{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
		margin: 24px 0 80px;}

	/* ----- 事業内容 ------------------------------------------------------------------------------------------------------------------- */
	#service{}
		#service::before{
			content:'';
			width:100%;
			height:100%;
			position:absolute;
			z-index:-2;
			top:0;
			left:0;
			font-size:0;
			background:url(../images/bg_yellow_left-TOP_right-BOTTOM.svg) no-repeat;
			background-size:contain;}
		#service::after{
			content:'';
			width:100%;
			height:100%;
			position:absolute;
			z-index:-2;
			top:0;
			left:0;
			background:url(../images/bg_yellow_left-BOTTOM_right-TOP.svg) no-repeat 0 center;
			background-size:cover;}
		#service_bg{
			width:680px;
			height:680px;
			overflow:hidden;/* 回るアニメーションのせいで画面端にスクロールが出てしまうのを防ぐ */
			position:absolute;
			z-index:-1;
			top:0;
			right:0;}
			#service_bg_1,
			#service_bg_2,
			#service_bg_3,
			#service_bg_4{
				opacity:0.2;
				position:absolute;
				top:0;
				right:0;
				transform-origin:50% 50%;
				pointer-events:none;}
			#service_bg_1{
				animation:bg_1 160s linear infinite;}
				@keyframes bg_1 {
				  0%   { transform: rotate(0deg); }
				  100% { transform: rotate(360deg); }
				}
			#service_bg_2{
				animation:bg_2 140s linear infinite;}
				@keyframes bg_2 {
				  0%   { transform: rotate(0deg); }
				  100% { transform: rotate(360deg); }
				}
			#service_bg_3{
				animation:bg_3 190s linear infinite;}
				@keyframes bg_3 {
				  0%   { transform: rotate(0deg); }
				  100% { transform: rotate(-360deg); }
				}
			#service_bg_4{
				animation:bg_4 220s linear infinite;}
				@keyframes bg_4 {
				  0%   { transform: rotate(0deg); }
				  100% { transform: rotate(360deg); }
				}
	#about_greeting,
	#service_system,
	#serice_support,
	#system_fa{padding-top:100px;}
	.system_support_conte{
			display:-webkit-box;
			display:-ms-flexbox;
		display:flex;
			-webkit-box-orient:horizontal;
			-webkit-box-direction:normal;
			-ms-flex-direction:row;
		flex-direction:row; /* 子要素横並び */
			-webkit-box-pack:center;
			-ms-flex-pack:center;
		justify-content:center; /* 親要素に対して中央並び */}
	.system_support_img{
		margin-left:1em;
		min-width:240px;}
		.system_support_img > img{width:100%;}
	/* ----- システム開発のページ --------------------------------------------- */
	.system_soft_container{position:relative;}
		.system_soft_container + .system_soft_container{margin-top:50px;}
		.system_soft_container p{
			text-align:justify;
			line-height:1.4;}
			.system_soft_container p + p{margin-top:1em;}
		.system_soft_container > h4{
			position:relative;
			z-index:1;
			display:inline-block;
			padding:15px;
			background-color:#000;
			min-width:500px;
			font-size:2em;
			color:#ff0;}
			.system_soft_container > h4 > span{
				font-size:.5em;
				vertical-align:middle;
				padding-right:1em;}
	.system_sectionTop{}
		div.system_sectionTop > h3{
			font-size:2.4em;
			margin-bottom:10px;}
		div.system_sectionTop > h3 + p{
			margin-bottom:50px;}
	.system_soft{
		position:relative;
		top:-20px;
		left:30px;
		z-index:0;
		background-color:#ccc;
		padding:40px 30px 30px;
		font-size:0;}
	.system_soft_img{
		display:inline-block;
		vertical-align:top;
		width:200px;}
	.system_soft_img + .system_soft_honbun{
		display:inline-block;
		padding-left:30px;
		width:calc(100% - 200px);}
	.system_soft_honbun{font-size:1.6rem;}
	.system_morelink{
		margin-top:30px;
		text-align:center;}
		.system_morelink > button{
			display:inline-block;
			width:80%;
			background-color:#ff0;
			border:1px solid #fff;
			font-size:1.4em;
			padding:6px;
			transition:background-color .4s, letter-spacing .8s;}
			.system_morelink > button:hover{
				letter-spacing:2px;
				background-color:#000;
				color:#fff;}
			.system_morelink::after{
				content:'※開発元のグループ会社HPに移動します。';
				display:block;
				font-size:0.8em;
				margin-top:1em;}
	.system_soft_honbun_p{position:relative;}
	/* ↑スマホ(~600px以下)ではタップで拡大するようにしてる */
		.system_soft_honbun_p a{pointer-events:none;}
		.system_soft_honbun_p img{width:100%;}
	.system_soft_donyu{
		display:inline-block;
		background-color:#ff0;
		padding:4px 30px;
		margin:40px 0 10px;}
		.system_soft_donyu + p{
			font-weight:bold;
			font-size:1.2em;
			margin:0;}

	/* ----- レスポンシブ設定 -------------------------------------------------------------------------------------------------------- */
	/* （タブレット向け：1024px、スマホ向け：599px） */

	/* タブレット向け */
	@media only screen and (max-width: 1024px)  {
		/* -------------------------------------------------------（タブレット向け）--------------- */
								.contents_inner{
									position:relative;
									width:80%;}
								.contents_text{padding-right:0;}
									#top_about .contents_text{width:100%;}
								.contents_text_link,
								.contents_text_link_bl{
									width:100%;
									display:block;}
									.contents_text_link + .contents_text_link,
									.contents_text_link_bl + .contents_text_link_bl{
										margin-left:0;
										margin-top:20px;}
								.contents_text_link > button,
								.contents_text_link_bl > button{font-size:1em;}
								#about_greeting,
								#service_system,
								#system_fa{
									padding-top:50px;}
								#top_about_image{
									display:block;
									text-align:center;
									margin-top:2em;}
								#top_service .contents_inner,
								#top_news .contents_inner,
								#top_contact .contents_inner{width:80%;}
								.top_service_sentence:first-of-type{
									left:auto;
									margin-top:3em;}
								.top_service_sentence:nth-of-type(2){
									right:auto;
									text-align:left;}
								.pagetop_link > li > a{font-size:1em;}
									.pagetop_link > li > a::after{
										left:-2%;
										width:104%;}
								.pagetop_link > li:not(:first-child){margin-left:20px;}


	}
	/* スマホ向け */
	@media only screen and (max-width: 599px) {
		/* ----------------------------------------------------（スマホ向け）------------------ */
								.top_news_content > article > a{display:block;}
								.top_news_content > article time{width:100%;}
								.top_news_content > article p{
									width:100%;
									padding:10px;
									margin-top:5px;
									border-top:1px solid #000;
									border-left:none;}
								#top_about_image > img{
									width:100%;
									height:auto;}
								.about_gaiyou dl{
									display:block;
									padding:0;
									border:none;}
									.about_gaiyou dl:not(:last-child){margin-bottom:40px;}
								.about_gaiyou dt{
									padding-left:0;
									padding-bottom:5px;
									margin-bottom:10px;
									width:auto;
									float:none;
									font-size:1.2em;
									font-weight:bold;
									border-bottom:1px solid #000;}
								.about_gaiyou li + li{padding-top:0.5em;}
								.contents_inner > h2{margin-bottom:40px;}
								.contents_inner h3{font-size:2.2rem;}
								.contents_inner h3 > br{display:inline;}
								.contents_inner .index_h2 > img{height:34px;}
								#about_greeting,
								#service_system,
								#system_fa{
									padding-top:30px;}
								.system_soft_container > h4{
									width:100%;
									min-width:inherit;}
									.system_soft_container > h4 > span{
										display:block;
										padding-right:0;}
								.system_soft{
									top:0;
									left:0;
									padding:30px;
									display:block;}
								.system_soft_img{display:none;}
								.system_soft_img + .system_soft_honbun{
									display:block;
									padding-left:0;
									width:100%;}
								.system_morelink > button{width:100%;}
								.system_support_img{display:none;}
								table.formTable{
									margin-bottom:10px;}
								table.formTable tr{
									border-bottom:none;
									display:block;}
								table.formTable tr:first-of-type{border-top:none;}
								table.formTable th{
									text-align:center;
									background-color:#666;}
								table.formTable td{padding:14px 10px;}
								table.formTable th,
								table.formTable td{
									width:100%;
									display:block;}
								.formSubmit{margin:0;}
								.formSubmit > input{
									display:block;
									margin:auto;}
								.formSubmit > input + input{
									margin-top:20px;}
								.formBtn_submit{
									margin-left:0;/**/
									width:100%;/**/;}
								.system_soft_honbun_p::before,
								.system_soft_honbun_p::after{
									pointer-events:none;
									content:'';
									position:absolute;
									top:0;
									bottom:0;
									left:0;
									right:0;
									margin:auto;
									display:block;
									font-size:2rem;
									color:#fff;
									text-align:center;}
								.system_soft_honbun_p::after{
									content:'タップで拡大';
									height:1em;}
								.system_soft_honbun_p::before{
									background-color:rgba(0,0,0,.3);}
								.system_soft_honbun_p a{pointer-events:auto;}


		/* ----- ニュースページ ------------------------------------------ */
						.news_wrap table td{display:block;}

	}






	/* ----- フォントのレスポンシブ設定 -------------------------------------------------------------------------------------------------------- */
	/* https://kuzlog.com/2019/05/12/3669/#i */
	/* font-size: calc(Ｘ + ((1vw – Ｙ)*Ｚ));
		X：ここには文字サイズに指定したい最小値を入れます。
		Y：最小値を適用したい横幅の1%です。今回は640px未満の環境から文字サイズを固定したいので、100/640=6.4pxです。
			こうすることで1vw-6.4px=0となり、先程のXに入れた値が文字サイズの最小値となります。
		Z：最大値を適用したい横幅の1% – 最小値を適用したい横幅の1%）× ○ = 文字サイズの最大値と最小値の差
			今回の例で言うと…（12 – 6.4）× ○ = 20　＝　20 ÷ ( 12 - 6.4 )　【文字サイズの最大値と最小値の差 ÷（ 横幅最大値の1% - 横幅最小値の1% ）】
	*/
			
			@media (min-width: 640px) {
				.link_bl_big{font-size:calc(18px + ((1vw - 6.4px)*1.4285714));}
				.contents_text > p{font-size:calc(16px + ((1vw - 6.4px)*0.714285));}
				}
			@media (min-width: 1200px) {
				.link_bl_big{font-size: 2.6rem;}
				.contents_text > p{font-size: 2rem;}
				}




