@charset "utf-8";

/*all*/
		html{
			overflow-x:hidden;
			overflow-y:auto;
			background:#ccc;
		}
		body{
			width:100vw;
			position:relative;
			overflow-x:hidden;
			overflow-y:auto;
			font-family: 'M PLUS Rounded 1c', sans-serif;
		}

	:link,:visited{color:#444;}
	#navi li :link,#navi li :visited{color:var(--Ntext-color);}

/*fonts*/


/* color */
	:root {
	/* navigation */
		--Ntitl-color: #fff;
		--Nback-color: #111;
		--Ntext-color: #fff;
	/* index */
		--Index-back: #222;
	/* intro */
		--Iback-color: #aeddf0;
		--Itext-color: #4c4948;
		/*short button*/
			--Isbtn-color: #4c4948;
			--Isbtt-color: #fff;
		/*large button*/
			--Ilbtn-color: #000033;
			--Ilbtt-color: #fff;
	/* work */	
		--Wback-color: #aeddf0;
		--Wtext-color: #4c4948;
	/* company */
		--Cback-color: #4c4948;
		--Cacce-color: #000099;
		--Ctext-color: #111;
	/* form */
		--Fback-color: #4c4948;
		--Facce-color: #000099;
		--Ftext-color: #111;
		--Fbtnb-color: #000033;
	/* form result */
		--Rback-color: #4c4948;
		--Racce-color: #000099;
		--Rtext-color: #111;
		--Rbtnb-color: #000099;
	} 



/* ---responsive----- */

/* ---PC ------*/
@media only screen and (min-width: 768px) {

	/* ---navigation----- */
		#navi a, h1,#navi li{
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
			text-decoration:none;
		}
		#navi{
			color:var(--Ntext-color);
		}
		#navi h1{
			user-select:none;
			display:block;
			width:100vw;
			height:5vw;
			padding:1vw 0;
			z-index:100;
			position:fixed;
			background:var(--Ntitl-color);
			color:rgba(0,0,0,0);
			top:0;
			left:0;
		}
		#navi h1 a{
			background-image:url(../img/h_logo.png);
			background-size:auto 100%;
			background-position:center;
			background-repeat:no-repeat;
			display:block;
			width:7.5vw;
			height:5vw;
			margin-left:46.2vw;
		}
		h1 :link,h1 :visited{
			color:rgba(0,0,0,0);
		}
		#naviButton{display:none;}
		#navi ul{
			margin-top:5vw;
			display: table;
			padding:2vw 10vw 0 10vw;
			background:var(--Nback-color);
			width:81vw;
			height:2vw;
			z-index:90;
			position:fixed;
			box-shadow: 0 .5vh .5vh rgba(0,0,0,0.4);
			-webkit-transition: all .3s ease;
			-moz-transition: all .3s ease;
			-o-transition: all .3s ease;
			transition: all  .3s ease;
		}
		#navi li{
			display: table-cell;
			text-align: center;
			width:14vw;
			font-size:1.5vw;
			line-height:2vw;
			height:2vw;
			font-family: 'M PLUS 1p', sans-serif;
		}
		#navi li:link,#navi li:visited{
			color:#fff;
		}
		#navi li:hover,#navi li a:hover{
			color:#3366ff;
		}
		.sc_navi,.sc_navi h1{
			background:#111;
			box-shadow: 0 .5vh .5vh rgba(0,0,0,0.4);
		}
		.sc_navi h1 a{
			background-image:url(../img/bk_logo.png);
			background-size:auto 100%;
			background-position:center;
			background-repeat:no-repeat;
		}
		.sc_navi ul{
			z-index:90;
			position:fixed;
			top:-5vw;
			left:0;
		}
		.sc_navi:hover > h1{
			background:#fff;
		}
		.sc_navi:hover > h1 a{
			background-image:url(../img/h_logo.png);
		}
		.sc_navi:hover > ul{
			top:0;
		}
		
		#topW,#topI,#topC{
			margin-top:7vw;
			padding:2vw 0 0 10%;
			width:90%;
			font-size:2.5vw;
			line-height:7vw;
			background-position:center center;
			background-size:100% auto;
			background-position:center;
			background-repeat:no-repeat;
			color:#fff;
		}
		#topW{background-image:url(../img/title/1.png);}
		#topI{background-image:url(../img/title/2.png);}
		#topC{background-image:url(../img/title/3.png);}
	
	/* ---maintxt----*/
		#main_txt{
		}
		.main_txt{
		}

	/* ---roading----*/
		#container {
			margin: 60vh 0 0 44.2vw;
			width: 12vw;
			height: 8px;
		}

		#indexCoverWH,#indexCoverLB,#indexCoverBL{
			display:inline-block;
			height:100vh;
			width:100vw;
			position:fixed;
			top:0;
			left:0;
			-webkit-transition: all 1s ease;
			-moz-transition: all 1s ease;
			-o-transition: all 1s ease;
			transition: all  1s ease;
		}
		#indexCoverLB{
			z-index:499;
			background: #aeddf0;
		}

		#indexCoverBL{
			z-index:498;
			background: #ccc;
		}

		#indexCoverWH{
			z-index:500;
			background:#ffffff;
			background-image:url(../img/h_logo.png);
			background-size:auto 10vw;
			background-position:center;
			background-repeat:no-repeat;
		}
		.naviIdTOP,.naviIdINTR,.naviIdWORK,.naviIdCOMP,.naviIdFORM{ cursor: pointer; user-select: none;}

	
	/* ---index----- */
		#main_txtI{
			display:inline-block;
			width:100%;
			height:100vh;
			overflow-x:hidden;
			overflow-y:hidden;
			background:var(--Index-back);
			position:fixed;
			z-index:1;
			top:0;
			left:0;
		}
		#indexComment{
			color:#fff;
			font-size:2.5vw;
			display:inline-block;
			width:100vw;
			position:fixed;
			z-index:100;
			top:9vw;
			left:0;
			text-align:left;
			font-family: 'Sawarabi Gothic', sans-serif;
			margin:20vh 0 0 50vw;
			text-shadow: 0 .5vh .5vh rgba(0,0,0,0.4);
		}
		#indexNavi li :link,#indexNavi li :visited{
			color:#111;
		}
		#indexNavi li :link:hover,#indexNavi li :visited:hover{
			color:#3366ff;
		}
		h1 :link,h1 :visited{
			color:rgba(0,0,0,0);
		}

		#back1,#back2,#back3,#back4,#back5{
			background:#fff;
			display:inline-block;
			background-size:auto 100%;
			background-position:center;
			background-repeat:no-repeat;
			margin-bottom:5vh;
			box-shadow: 0 .5vh .5vh rgba(0,0,0,0.4);
			height:70vh;
			width:30vw;
			opacity:.8;
		}
		#back1{
			background-image:url(../img/main_visual.jpg);
			background-size:120% auto;
			background-position:right top;
		}
		#back2{
			background-image:url(../img/regal_shop.jpg);
		}
		#back3{
			background-image:url(../img/museum.jpg);
			background-size:auto 100%;
			background-position:right center;
		}
		#back4{
			background-image:url(../img/godiva_shop.png);
			background-position:right center;
		}
		#back5{
			background-image:url(../img/lasud_shop.png);
		}
		.loop{
			display:inline-block;
			position:fixed;
			top:-137.5vh;
			left:-2vw;
			-webkit-transform-origin: center center;
			-ms-transform-origin: center center;
			transform-origin: center center;
			-webkit-transform: rotate(-20deg);
			-ms-transform: rotate(-20deg);
			transform: rotate(-20deg);
		}
		.loopUp,.loopDown{
			display:inline-block;
			width:30vw;
			height:375vh;
			position:fixed;
			z-index:2;
			top:0;
			font-size:0;
		}
		.loopUp{
			left:0;
		}
		.Down1{
			left:-30vw;
			margin-left:-5vh;
		}
		.Down2{
			left:30vw;
			margin-left:5vh;
		}
		.loopUp div,.loopDown div{
			display:inline-block;
			width:100%;
			height:375vh;
		}
		.loopUp div:first-child {
			-webkit-animation: loopUp 100s -50s linear infinite;
			animation: loopUp 100s -50s linear infinite;
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
			will-change: transform;
		}
		.loopUp div + div {
			-webkit-animation: loopUp2 100s  linear infinite;
			animation: loopUp2 100s linear infinite;
		}
		@-webkit-keyframes loopUp {
			0% {
				-webkit-transform: translateY(100%);
				-ms-transform: translateY(100%);
				transform: translateY(100%);
			}
			100% {
				-webkit-transform: translateY(-100%);
				-ms-transform: translateY(-100%);
				transform: translateY(-100%);
			}
		}
		
		@keyframes loopUp {
			0% {
				-webkit-transform: translateY(100%);
				-ms-transform: translateY(100%);
				transform: translateY(100%);
			}
			100% {
				-webkit-transform: translateY(-100%);
				-ms-transform: translateY(-100%);
				transform: translateY(-100%);
			}
		}
		
		@-webkit-keyframes loopUp2 {
			0% {
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
			}
			100% {
				-webkit-transform: translateY(-200%);
				-ms-transform: translateY(-200%);
				transform: translateY(-200%);
			}
		}
		
		@keyframes loopUp2 {
			0% {
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
			}
			100% {
				-webkit-transform: translateY(-200%);
				-ms-transform: translateY(-200%);
				transform: translateY(-200%);
			}
		}
		.loopDown div:first-child {
			-webkit-animation: loopDown 100s -50s linear infinite;
			animation: loopDown 100s -50s linear infinite;
			-webkit-backface-visibility: hidden;
			backface-visibility: hidden;
			will-change: transform;
		}
		
		.loopDown div + div {
			-webkit-animation: loopDown2 100s  linear infinite;
			animation: loopDown2 100s linear infinite;
		}
		@-webkit-keyframes loopDown {
			0% {
				-webkit-transform: translateY(-100%);
				-ms-transform: translateY(-100%);
				transform: translateY(-100%);
			}
			100% {
				-webkit-transform: translateY(100%);
				-ms-transform: translateY(100%);
				transform: translateY(100%);
			}
		}
		
		@keyframes loopDown {
			0% {
				-webkit-transform: translateY(-100%);
				-ms-transform: translateY(-100%);
				transform: translateY(-100%);
			}
			100% {
				-webkit-transform: translateY(100%);
				-ms-transform: translateY(100%);
				transform: translateY(100%);
			}
		}
		
		@-webkit-keyframes loopDown2 {
			0% {
				-webkit-transform: translateY(-200%);
				-ms-transform: translateY(-200%);
				transform: translateY(-200%);
			}
			100% {
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
			}
		}
		
		@keyframes loopDown2 {
			0% {
				-webkit-transform: translateY(-200%);
				-ms-transform: translateY(-200%);
				transform: translateY(-200%);
			}
			100% {
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
			}
		}

		#blogBox{
			position: fixed;
			z-index: 200;
			top:85vh;
			left:0;
			display:inline-block;
			width:100vw;
			height:15vh;
			background:rgba(0,0,0,.7);
			color:#fff;
		}
		#blogBox p{
			display:inline-block;
			margin:3vh 0 0 12vw;
			line-height: 5vh;
			font-size:2.6vh;
			width:50vw;
		}
		#blogBox a{
			display:inline-block;
			margin:4vh 0 0 0;
			vertical-align: top;
			background:#3366ff;
			text-decoration: none;
			text-align: center;
			width:20vw;
			height:7vh;
			line-height: 7vh;
			font-size: 3vh;
			font-weight: bold;
			border-radius: 3.5vh;
			-webkit-transition: all .3s ease;
			-moz-transition: all .3s ease;
			-o-transition: all .3s ease;
			transition: all  .3s ease;
		}
		#blogBox :link,#blogBox :visited{
			color:#fff;
		}
		#blogBox a:hover{
			background: #93b4ff;
		}
		#blogBox .blogCancel{
			display: inline-block;
			position: absolute;
			margin: 2vh 0 0 4vh;
			cursor: pointer;
			opacity: 1;
			width: 2.8vh;
			height: 2.8vh;
			background:rgba(255,255,255,.1);
			border-radius: 0.5vh;
		}
		#blogBox .blogCancelButton{
			display: inline-block;
			padding: 0;
			width: 0.5vh;
			height: 2.5vh;
			margin: 0.1vh 0 0 1.3vh;
			border-radius: 0.3vh;
			background: #fff;
			transform: rotate(45deg);
		}
		#blogBox .blogCancelButton:before{
			display: block;
			content: "";
			position: absolute;
			top: 50%;
			width: 2.5vh;
			height: 0.5vh;
			border-radius: 0.3vh;
			margin-left: -1vh;
			margin-top: -0.2vh;
			background: #fff;
		}
		#blogBox .blogCancel:hover{
			opacity: .5;
		}
		
		
		
	/* ---intro----- */
		.main_txtN{
			padding:9vw 0 5vw;
			background:var(--Iback-color);
		}
		#onestop{
			display:inline-block;
			width: 95vw;
			margin-left: 5vw;
			margin-top: 5vh;
		}
		.stop_txt{
			color:var(--Iback-color);
			display:inline-block;
			padding:5vh 0 0 0;
			width:50%;
			background:var(--Itext-color);
			box-shadow: 0 1vh 1vh rgba(0,0,0,0.3);
		}
		.stop_txt h2{
			display:inline-block;
			margin:3vh 0 4vh 5%;
			font-weight:600;
			font-size:3vw;
			line-height:4vw;
			width:30vw;
			font-family: 'Raleway', sans-serif;
		}
		.stop_txt div{
			display:inline-block;
			padding-bottom: 8vh;
			margin-left:5%;
			width:40vw;
		}
		.stop_txt div p{
			margin-bottom:3vh;
			width:auto;
			font-weight:500;
			font-size:1.4vw;
			line-height:3vw;
			text-align:left;
			font-family: 'Noto Sans SC', sans-serif;
		}
		.stop_txt a{
			display:none;
		}
		#stop_img1{
			display:inline-block;
			margin: 0 0 0 12vw;
			width:30vw;
			vertical-align: bottom;
			box-shadow: 0 1vh 1vh rgba(0,0,0,0.3);
		}
		#stop_img2{
			display:inline-block;
			margin: 5vh 0 0 -48vw;
			width:35vw;
			vertical-align: top;
			box-shadow: 0 2vh 2vh rgba(0,0,0,0.3);
		}
		#introCategory{
			position:relative;
			display:block;
			width:98vw;
			height:80vh;
			padding:5vh 5vh 0;
			-webkit-transition: all 0.4s ease;
			-moz-transition: all 0.4s ease;
			-o-transition: all 0.4s ease;
			transition: all  0.4s ease;
		}
		#introCategory div{
			position:relative;
			display:inline-block;
			width:32%;
		}
		#introCategory div h2{
			position:absolute;
			margin-top:2vh;
			display:inline-block;
			text-align:center;
			width:100%;
			color:var(--Itext-color);
			font-size:3vh;
			line-height:3vh;
			font-family: 'Kosugi Maru', sans-serif;
		}
		#introCategory div p{
			position:absolute;
			display:inline-block;
			width:60%;
			padding:5vh 5% 0;
			height:50vh;
			margin:6vh 0 0 15%;
			border:solid 2px var(--Itext-color);
			border-radius:3px;
			color:var(--Itext-color);
			font-size:1.4vw;
			line-height:2.5vw;
			font-family: 'Noto Sans SC', sans-serif;
		}
		#introCategory a{
			top:0;
			left:0;
			position:absolute;
			display:inline-block;
			width:60%;
			line-height:5vw;
			font-size:2vw;
			margin:77vh 0 0 20vw;
			text-align:center;
			border-radius:2.5vw;
			text-decoration:none;
			font-family: 'Noto Sans SC', sans-serif;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
			background:var(--Ilbtn-color);
			color:var(--Ilbtt-color);
			box-shadow: 0 .5vh .5vh rgba(0,0,0,0.2);
		}
		#introCategory div a{
			width:60%;
			line-height:4vw;
			font-size:1.2vw;
			margin:50vh 0 0 20%;
			border-radius:2vw;
			background:var(--Isbtn-color);
			color:var(--Isbtt-color);
		}
		#introCategory a:hover{
			background:#9999ff;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
		}
		#introCategory div a:hover{
			background:#999;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
		}
	
	
	/* ---work----- */
		.main_txtW{
			color:var(--Wtext-color);
			padding-top:15vh;
			background:var(--Wback-color);
		}
		#ankerInk,#ankerLED,#ankerSign{
			padding:5vh;
			display:block;
			height:10vh;
			width:100%;
			margin-top:-10vh;
		}
		.workTile{
			position:relative;
			padding:3vw 0 0 7vw;
			border-top:solid 1px var(--Wtext-color);
			height:80vh;
		}
		.workTile h2{
			display:inline-block;
			position:absolute;
			text-align:center;
			font-size:2vw;
			line-height:4vw;
			height:3.5vw;
			top:-2vw;
		}
		#workInk h2{
			width:34vw;
			margin:0 30vw 0 26vw;
			background:var(--Wback-color);
		}
		#workMuseum h2{
			width:18vw;
			margin:0 30vw 0 34vw;
			background:var(--Wback-color);
		}
		#workLED h2{
			width:34vw;
			margin:0 30vw 0 26vw;
			background:var(--Wback-color);
		}
		#workSign h2{
			width:18vw;
			margin:0 30vw 0 34vw;
			background:var(--Wback-color);
		}
		.workTile a{
			background:rgba(50,50,50,.4);
			background-image:url(../img/glass.png);
			background-size:40px;
			background-position:center;
			background-repeat:no-repeat;
			display:inline-block;
			width:100%;
			height:100%;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
			opacity:0;
		}
		.workTile a:hover{
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
			opacity:1;
		}
		.workTile img{
			display:inline-block;
			width:100%;
			height:100%;
			opacity:0;
		}
		/* ---image--- */
			#workInk div{
				background-position:center center;
				position:absolute;
				background-size:100% auto;
				background-position:center;
				background-repeat:no-repeat;
			}
			#workInk .img_box1{
				background-position:top center;
				display:inline-block;
				width:18vw;
				height:70vh;
				background-image:url(../img/ex/01.jpg);
			}
			#workInk .img_box2{
				display:inline-block;
				width:30.5vw;
				height:34vh;
				left:25.5vw;
				background-image:url(../img/ex/02.jpg);
			}
			#workInk .img_box3{
				display:inline-block;
				width:18vw;
				height:34vh;
				left:56.5vw;
				background-image:url(../img/ex/03.jpg);
			}
			#workInk .img_box4{
				background-position:top center;
				display:inline-block;
				width:18vw;
				height:34vh;
				left:75vw;
				background-image:url(../img/ex/04.jpg);
			}
			#workInk .img_box5{
				display:inline-block;
				width:18vw;
				height:34vh;
				margin-top:3vw;
				top:36vh;
				left:25.5vw;
				background-image:url(../img/ex/05.jpg);
			}
			#workInk .img_box6{
				display:inline-block;
				width:30.5vw;
				height:34vh;
				margin-top:3vw;
				top:36vh;
				left:44vw;
				background-image:url(../img/ex/06.jpg);
			}
			#workInk p{
				position:absolute;
				display:inline-block;
				border-top:solid 0.5vh var(--Wtext-color);
				border-bottom:solid 0.5vh var(--Wtext-color);
				width:16vw;
				height:31vh;
				padding:2vh 1vw 0;
				margin-top:3vw;
				top:36vh;
				left:75vw;
				color:var(--Wtext-color);
				text-align:left;
				font-size:1.1vw;
				font-weight:600;
				line-height:2vw;
				vertical-align:top;
			}
			#workMuseum div{
				background-position:center center;
				position:absolute;
				background-size:100% auto;
				background-position:center;
				background-repeat:no-repeat;
			}
			#workMuseum .img_box1{
				background-size:auto 100%;
				background-position:top center;
				display:inline-block;
				width:25vw;
				height:50vh;
				background-image:url(../img/ex/m1.jpg);
			}
			#workMuseum .img_box2{
				display:inline-block;
				width:30vw;
				height:34vh;
				margin-top:3vw;
				top:35vh;
				left:63vw;
				background-image:url(../img/ex/m2.jpg);
			}
			#workMuseum .img_box3{
				background-size:auto 100%;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				left:63vw;
				background-image:url(../img/ex/m3.jpg);
			}
			#workMuseum .img_box4{
				background-size:auto 100%;
				background-position:top center;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				left:78.25vw;
				background-image:url(../img/ex/m4.jpg);
			}
			#workMuseum .img_box5{
				background-size:auto 100%;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				margin-top:3vw;
				top:35vh;
				left:32.5vw;
				background-image:url(../img/ex/m5.jpg);
			}
			#workMuseum .img_box6{
				background-size:auto 100%;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				margin-top:3vw;
				top:35vh;
				left:47.75vw;
				background-image:url(../img/ex/m6.jpg);
			}
			#workMuseum .img_box7{
				background-size:auto 100%;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				left:32.5vw;
				background-image:url(../img/ex/m7.jpg);
			}
			#workMuseum .img_box8{
				background-size:auto 100%;
				background-position:top center;
				display:inline-block;
				width:14.75vw;
				height:34vh;
				left:47.75vw;
				background-image:url(../img/ex/m8.jpg);
			}
			#workMuseum p{
				position:absolute;
				display:inline-block;
				width:25vw;
				height:auto;
				padding:2vh 0 ;
				margin-top:3vw;
				top:50vh;
				color:var(--Wtext-color);
				text-align:left;
				font-size:1.1vw;
				font-weight:600;
				line-height:2vw;
				vertical-align:top;
			}
			#workLED div{
				position:absolute;
				background-size:100% auto;
				background-position:center;
				background-repeat:no-repeat;
			}
			#workLED .img_box1{
				display:inline-block;
				width:42.7vw;
				height:34vh;
				margin:0 0.2vw 0.6vw 0;
				background-image:url(../img/ex/11.jpg);
			}
			#workLED .img_box2{
				display:inline-block;
				width:42.7vw;
				height:34vh;
				left:50.3vw;
				margin-bottom:0.6vw;
				background-image:url(../img/ex/12.jpg);
			}
			#workLED .img_box3{
				display:inline-block;
				width:42.7vw;
				height:34vh;
				margin-top:3.8vw;
				top:34vh;
				margin-right:0.6vw;
				background-image:url(../img/ex/13.jpg);
			}
			#workLED .img_box4{
				display:inline-block;
				width:17.4vw;
				height:34vh;
				margin-top:3.8vw;
				top:34vh;
				left:50.3vw;
				background-image:url(../img/ex/14.jpg);
			}
			#workLED p{
				position:absolute;
				display:inline-block;
				border-top:solid 0.5vh var(--Wtext-color);
				border-bottom:solid 0.5vh var(--Wtext-color);
				width:20.7vw;
				height:28vh;
				padding:5vh 2vw 0;
				margin-top:3.8vw;
				top:34vh;
				left:68.3vw;
				color:var(--Wtext-color);
				text-align:left;
				font-size:1.1vw;
				font-weight:600;
				line-height:2vw;
				vertical-align:top;
			}
			#workSign div{
				position:absolute;
				background-size:auto 100%;
				background-position:center;
				background-repeat:no-repeat;
			}
			#workSign .img_box1{
				display:inline-block;
				width:30vw;
				height:50vh;
				top:3vw;
				left:7vw;
				background-image:url(../img/ex/22.jpg);
			}
			#workSign .img_box2{
				display:inline-block;
				width:15vw;
				height:70vh;
				left:37.6vw;
				background-image:url(../img/ex/23.jpg);
			}
			#workSign .img_box3{
				display:inline-block;
				width:15vw;
				height:70vh;
				left:53.2vw;
				background-image:url(../img/ex/25.jpg);
			}
			#workSign .img_box4{
				display:inline-block;
				width:25vw;
				height:34vh;
				left:68.8vw;
				background-image:url(../img/ex/24.jpg);
				}
			#workSign .img_box5{
				display:inline-block;
				width:25vw;
				height:34vh;
				left:68.8vw;
				top:36vh;
				margin-top:3vw;
				background-image:url(../img/ex/21.jpg);
			}
			#workSign p{
				position:absolute;
				top:52vh;
				width:30vw;
				margin-top:3vw;
				display:inline-block;
				padding:2vh 0 0;
				color:var(--Wtext-color);
				text-align:left;
				font-size:1.1vw;
				font-weight:600;
				line-height:2vw;
				vertical-align:top;
			}
	
	/* ---company--- */
		.main_txtC{
			width:80vw;
			margin:11vw 0 0 10vw;
			padding-bottom:5vw;
			color:var(--Ctext-color);
		}
		.main_txtC h2{
				font-size:2vw;
				border-left:solid 1px var(--Cacce-color);
				padding-left:2vw;
				margin:5vh 0 0 5vw;
		}
	
		/* ---table--- */
		#comp_list{
			margin:0 0 0 10vw;
			border-collapse: separate;
			border-spacing:0 5vh;
		}
		#comp_list th{
			width:20vw;
			vertical-align:top;
		}
		#comp_list tr{
			border-style:solid;
			border-width:2vh 0;
		}
		#comp_list .maker{
			display:inline-block;
			width:50%;
			text-align:left;
		}
		#comp_list .spec{
			display:inline-block;
			width:50%;
			text-align:right;
		}
	
	/* ---form------- */
		.main_txtF{
			display:block;
			padding-top:25vh;
			width:100%;
			padding-bottom:5vw;
		}
		form{
			display:inline-block;
			width:100%;
		}
		.formDatin{
			display:inline-block;
			margin-left:10%;
			width:35vw;
			height:auto;
			vertical-align:top;
		}
		.lead-form{
			text-align: center;
			font-size:1.4vw;
		}
		.item{
		  margin-bottom: 5vh;
		}
		.label{
			display:inline-block;
			width:35vw;
			border-left: solid 1px var(--Facce-color);
			padding-left: 10px;
		}
		.inputs{
			display:inline-block;
			width:35vw;
			margin-top: 1vh;
		}
		input[type="text"],input[type="email"]{
		  border: solid 1px #aaa;
		  border-radius:0.2vw;
		  padding:0.5vw;
		  font-size: 1.1vw;
		}
		textarea{
		  border: solid 1px #aaa;
		  border-radius:0.2vw;
		  padding:0.5vw;
		  height: 25vh;
		  font-size: 1.1vw;
		}
		.btn-area{
		  text-align: center;
		}
		input[type="submit"]{
			background: var(--Fbtnb-color);
			border: none;
			color: #fff;
			font-size:1.5vw;
			line-height:3vw;
			border-radius:3vw;
			font-weight:bold;
			padding:0 1.5vw;
			margin-top:5vh;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
			cursor : pointer;
		}
		input[type="submit"]:hover{
			background:#9999ff;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
		}
	
	/* ---form result */
	#formResult div{
		display:inline-block;
		margin:30vh 0 0 15vw;
		padding:10vh 10vw;
		width:50vw;
		border:1px solid var(--Racce-color);
		border-radius:1vw;
	}
	#formResult p{
		display:inline-block;
		width:100%;
		text-align:left;
		margin-top:2vh;
		font-size:1.2vw;
		line-height:2vw;
	}
	#formResult a{
		display:inline-block;
		text-align:center;
		width:10vw;
		margin:5vh 0 0 20vw;
	}
	
	/* ---footer----- */
		footer{
			background:#111;
			color:#fff;
		}
		footer ul{
			display: table;
			padding:0 7.5vw 0 7.5vw;
			background:#111;
			height:2vw;
			width:85vw;
		}
		footer li{
			display: table-cell;
			text-align: center;
			width:15vw;
			font-size:1.5vw;
			line-height:2vw;
			font-family: 'M PLUS 1p', sans-serif;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
		}
		footer li :link,footer li :visited{
			color:#fff;
			text-decoration:none;
			-webkit-transition: all 0.3s ease;
			-moz-transition: all 0.3s ease;
			-o-transition: all 0.3s ease;
			transition: all  0.3s ease;
		}
		footer li:hover, footer li :link:hover,footer li :visited:hover{
			color:#3366ff;
		}
		footer p{
			text-align:center;
		}
		.footer_add{
			line-height:5vw;
		}
	/*scrollbar*/
		::-webkit-scrollbar {
			width:10px;
		}
		::-webkit-scrollbar-track {
			background-color:rgba(0,0,0,0);
		}
		::-webkit-scrollbar-thumb {
			background:rgba(64,64,64,.5);
			border-radius: 10px;
			box-shadow:0 0 0 1px rgba(255, 255, 255, .3);
		}
		::-webkit-scrollbar-thumb:hover {
			background:rgba(64,64,64,1);
		}

/* ---縦置き(縦長)の場合 -----*/

@media screen and (orientation: portrait) {

	/* ---navigation----- */
	

	/* ---index----- */
	

	/* ---about----- */
	

	/* ---contact----- */
	

	/* ---footer----- */
	
	
	}/*縦置き終了*/
}