@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@100;200;300;400;500;600;700;800;900&display=swap');




/********リセット********/
*{
	box-sizing:border-box;
	margin:0;
	padding:0;
	border:none;
	outline:none;
	color:inherit;
	font-size:inherit;
	font-weight:inherit;
	line-height:1.0;
	font-style:normal;
	text-decoration:none;
	word-break:break-all;
	word-wrap:break-word;
}
*:before,*:after{box-sizing:border-box;}
*:focus{outline:none;}
div{margin:0; padding:0; border:none; outline:none;}
h1,h2,h3,h4,h5,h6,strong,em,mark,b,small,sup,sub{margin:0; padding:0; font-size:inherit; font-weight:inherit;}
p,span{margin:0; padding:0;}
a{margin:0; padding:0; outline:none; font-weight:bold; text-decoration:none;}
a:link{outline:none; text-decoration:none;}
a:hover,a *:hover{cursor:pointer;}
mark{background:transparent; color:currentColor;}
img{margin:0; padding:0; border:none; outline:none;}
table,td,th{margin:0; padding:0; outline:none;}
hr{margin:0; padding:0;}
ul{margin:0; padding:0;}
li{list-style:none;}
form{margin:0; padding:0; border:none; outline:none;}
input{margin:0; padding:0; outline:none;}
textarea{display:block; margin:0; padding:0; outline:none;}
input,textarea,select,option{
	font-family:
		"游ゴシック体",
		YuGothic,
		"游ゴシック Medium",
		"Yu Gothic Medium",
		"游ゴシック",
		"Yu Gothic",
		"メイリオ",
		sans-serif
	;
}




/********文字色プリセット********/
a{color:<?= $hexColor_blue ?>;}
.orange{color:<?= $hexColor_orange ?>;}
.red{color:<?= $hexColor_red ?>;}
.yellow{color:<?= $hexColor_yellow ?>;}
.blue{color:<?= $hexColor_blue ?>;}
.white{color:<?= $hexColor_white ?>;}
.black{color:<?= $hexColor_brack ?>;}
.gray{color:<?= $hexColor_gray ?>;}
.dark_gray{color:<?= $hexColor_darkGray ?>;}
.em_color_01{color:<?= $hexColor_orange ?>;}
.em_color_02{color:;}




/********文字・行サイズプリセット********/
.s_small{font-size:10px;}
.small{font-size:12px;}
.b_small{font-size:14px;}
.normal{font-size:16px;}
.b_big{font-size:18px;}
.big{font-size:20px;}
.s_big{font-size:24px;}
.u_big{font-size:32px;}
.lh_def{line-height:1.68;}




/********その他プリセット********/
.floatLeft{float:left;}
.floatRight{float:right;}
.hidden{display:none;}
.hidden_v{visibility:hidden;}
.m_auto{margin:0 auto;}
.sg_2px{margin-left:2px; margin-right:2px;}	/****sg＝side gap****/
.sg_4px{margin-left:4px; margin-right:4px;}	/****sg＝side gap****/
.bold{font-weight:bold;}
.semiBold{text-shadow:0px 0px 0.8px rgba(0,0,0,0.32);}
.not_bold{font-weight:normal;}
.ta_center{text-align:center;}	/****ta＝text align****/
.ta_left{text-align:left;}	/****ta＝text align****/
.ta_right{text-align:right;}	/****ta＝text align****/
.underline{text-decoration:underline;}
.underline_bs{box-shadow:inset 0 -2px 0 0;}	/****bs＝box shadow****/
.hover_ul_bs:hover{box-shadow:inset 0 -2px 0 <?= $hexColor_white ?>,inset 0 -4px 0;}	/****ul＝under line、bs＝box shadow****/
.indent{text-indent:-9999px;}
.ff_def{	/****ff＝font family****/
	font-family:
		"游ゴシック体",
		YuGothic,
		"游ゴシック Medium",
		"Yu Gothic Medium",
		"游ゴシック",
		"Yu Gothic",
		"メイリオ",
		sans-serif
	;
}
.relative{position:relative;}
.absolute{position:absolute;}
.block{display:block;}
.inline_block{display:inline-block;}
.clear{clear:both;}
.t_shadow{text-shadow:1px 1px 0 rgba(<?= $rgbColor_black ?>,0.08);}
.t_shadow_strong{text-shadow:1px 1px 0 rgba(<?= $rgbColor_black ?>,0.16);}
.b_shadow{box-shadow:2px 2px 6px 0 rgba(<?= $rgbColor_black ?>,0.12);}
.b_shadow_around{box-shadow:0 0 6px 0 rgba(<?= $rgbColor_black ?>,0.12);}
.b_shadow_1px{box-shadow:1px 1px 0 rgba(<?= $rgbColor_black ?>,0.08);}
.sage_1px{position:relative; top:1px;}
.sage_2px{position:relative; top:2px;}
.flip_h{transform:scale(-1.0,1.0);}
.flip_v{transform:scale(1.0,-1.0);}
.flip_hv{transform:scale(-1.0,-1.0);}
.pc_only{display:unset;}
.sp_only{display:none;}




/********カスタムエレメント********/
flex{display:flex;}
space{display:block; height:0.8em;}	/****少し行間を空けたいとき****/
bs{display:inline-block; width:0.8em;}	/****感嘆符などの後ろにスペースをとりたいとき****/
align-left{display:block; width:100%; text-align:left;}	/****簡潔に左寄せしたいとき****/
align-right{display:block; width:100%; text-align:right;}	/****簡潔に右寄せしたいとき****/
align-center{display:block; width:100%; text-align:center;}	/****簡潔に中央寄せしたいとき****/
ann{display:block; margin:8px 0 0 0; font-size:14px; text-align:right; opacity:0.48;}	/****注釈****/




/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/




/********アニメーション＞スクロールに伴うフェードイン(JQueryと併用)********/
.fadeIn{
	opacity:0;
	transform:translate(0,160px);
	transition:all 480ms <?= $easeOutExpo ?>;
}

.fadeIn.scrollIn{
	opacity:1.0;
	transform:scale(1.0,1.0) translate(0,0) rotate(0);
}




/********アニメーション＞点滅********/
.blink{animation:blink 1.6s linear infinite;}
	@keyframes blink{
		0%{opacity:1.0;}
		64%{opacity:1.0;}
		76%{opacity:0;}
		88%{opacity:0;}
		100%{opacity:1.0;}
	}

.flicker{animation:flicker 2.4s linear infinite;}
	@keyframes flicker{
		0%{opacity:1.0;}
		40%{opacity:1.0;}
		60%{opacity:0.32;}
		100%{opacity:1.0;}
	}




/********アニメーション＞ゆらゆら(左右)********/
.swing_h{animation:swing_h 1.6s linear infinite;}
	@keyframes swing_h{
		0%{transform:translate(0,0);}
		25%{transform:translate(4px,0);}
		50%{transform:translate(0,0);}
		75%{transform:translate(-4px,0);}
		100%{transform:translate(0,0);}
	}




/********アニメーション＞ゆらゆら(上下)********/
.swing_v{animation:swing_v 1.2s linear infinite;}
	@keyframes swing_v{
		0%{transform:translate(0,0);}
		25%{transform:translate(0,4px);}
		50%{transform:translate(0,0);}
		75%{transform:translate(0,-4px);}
		100%{transform:translate(0,0);}
	}




/********アニメーション＞ふわふわ********/
.fluffy{animation:fluffy 1.6s linear infinite;}
	@keyframes fluffy{
		0%{transform:scale(1.0,1.0);}
		50%{transform:scale(1.04,1.04);}
		100%{transform:scale(1.0,1.0);}
	}




/********アニメーション＞跳ねる********/
.bounce{animation:bounce 1.6s linear infinite;}
	@keyframes bounce{
		0%{transform:translate(0,0);}
		72%{transform:translate(0,0);}
		76%{transform:translate(0,-12px);}
		84%{transform:translate(0,0);}
		92%{transform:translate(0,-12px);}
		100%{transform:translate(0,0);}
	}




/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/




/********ボディ・コンテナ********/
html{}

body{
	position:relative;
	width:100%;
	background:<?= $hexColor_yellow_B ?>;
	font-family:
		"游ゴシック体",
		YuGothic,
		"游ゴシック Medium",
		"Yu Gothic Medium",
		"游ゴシック",
		"Yu Gothic",
		"メイリオ",
		sans-serif
	;
	color:<?= $hexColor_black ?>;
	font-size:16px;
	letter-spacing:0.4px;
	font-feature-settings:"palt";
	overflow-x:hidden;
}

#column_1088px{
	position:relative;
	width:1088px;
	margin:0 auto;
}




/********ヘッダー********/
header{
	posiion:relative;
	width:100%;
	height:480px;
	overflow:hidden;
}

header #vegas{width:100%; height:100%; background:#000000;}

header #logoWrapper{
	position:absolute; left:50%; top:0;
	width:1088px;
	height:480px;
	margin-left:calc(-1088px / 2);
}

header #logoWrapper a{
	position:relative;
	display:block;
	width:320px;
	height:360px;
}

header #logoWrapper a:after{
	content:"";
	position:absolute; left:0; bottom:0;
	display:block;
	width:100%;
	height:6px;
	margin:0 0 -6px 0;
	background:linear-gradient(to right,#ff6f00,#df004f);
}

header #logoWrapper h1{
	width:100;
	height:100%;
	background:url(/images/logo.png) center center / 64% auto no-repeat #ffffff;
	text-indent:-9999px;
}




/********ナビ********/
nav{width:100%; background:#000000;}
nav ul{display:flex; width:1088px; margin:0 auto;}
nav ul li{width:calc(100% / 3); height:96px;}

nav ul li a{
	display:flex; justify-content:center; align-items:center;
	width:100%;
	height:100%;
	color:#ffffff;
	font-family:"Noto Sans JP";
	font-size:18px;
	font-weight:500;
}
nav ul li a:hover{background:#ef3525; transition:0.8s;}




/********ヘッドライン********/
.headline{
	padding:80px 0;
	color:#000000;
	text-align:center;
}
#section_company .headline{color:#ffffff;}

.headline p{
	display:block;
	font-family:"Barlow";
	font-size:64px;
	font-weight:900;
}

.headline span{
	display:block;
	margin-top:12px;
	font-family:"Noto Sans JP";
	font-size:24px;
	font-weight:500;
}




/********WORK(事業内容)********/
#section_work{padding:40px 0 200px 0;}

.ul_work{
	display:flex; flex-wrap:wrap;
	width:1088px;
	margin:0 auto;
}

.ul_work li{width:calc(calc(100% - 40px) / 2); background:#000000;}
.ul_work li:nth-of-type(even){margin-left:40px;}
.ul_work li:nth-of-type(n+3){margin-top:60px;}

.ul_work li:before{
	content:"";
	display:block;
	width:100%;
	height:6px;
	background:linear-gradient(to right,#ff6f00,#df004f);
}

.ul_work li figure{
	display:block;
	width:100%;
	height:480px;
	background:center center / cover no-repeat;
}
.ul_work li:nth-of-type(1) figure{background-image:url(/images/work_01.png);}
.ul_work li:nth-of-type(2) figure{background-image:url(/images/work_02.png);}
.ul_work li:nth-of-type(3) figure{background-image:url(/images/work_03.png);}
.ul_work li:nth-of-type(4) figure{background-image:url(/images/work_04.png);}

.ul_work li p{
	display:block;
	padding:40px;
	background:#000000;
	color:#ffffff;
	font-family:"Noto Sans JP";
	font-size:20px;
	font-weight:500;
}




/********COMPANY(会社概要)********/
#section_company{
	padding:40px 0 200px 0;
	background:url(/images/section_company.png) center center / cover no-repeat #000000;
}
.table_company{
	width:1088px;
	margin:0 auto;
	border-collapse:collapse;
	color:#ffffff;
}
.table_company th,
.table_company td{padding:40px; border:solid 2px #ffffff; font-size:18px;}
.table_company th{text-align:center;}
.table_company td{}




/********RECRUIT(採用情報)********/
#section_recruit{padding:40px 0 200px 0;}
.table_recruit{
	width:1088px;
	margin:0 auto;
	border-collapse:collapse;
	color:#000000;
}
.table_recruit th,
.table_recruit td{padding:40px; border:solid 2px #e5e5e5; font-size:18px;}
.table_recruit th{background:#fafafa; text-align:center;}
.table_recruit td{}




/********フッター********/
footer{padding-bottom:80px;}
footer p{color:#bfbfbf; font-size:16px; text-align:center;}