/*----------------------------------------------------------------------------*/
/* 	株式会社富士誇 事例 page						 	CSS      */
/*----------------------------------------------------------------------------*/
@charset "utf-8";

	main {
	}
	main#container {
/*		background-color: #FFF;	*/
	}

	main#container h1 {
		text-indent: -99999px;	/* テキスト非表示 */
	}
	#sviewerPC {			/* ●PC */
		height:210px;
	}

/* ■Category guide section ------------------------------------------*/

	#guide {
		margin:-30px auto 0 auto;
		display:block;
		width:100%;
		padding-top:20px;
		padding-bottom:20px;
	}
	#guide .left {
		width:90%;
	}
	#guide .left dl {
		margin:0 auto 20px auto;
		width:85%;
		border-left: 3px solid #444;
	}
	#guide .left dt {
		font-size:14px;
		font-weight:normal;
		color: #6E3919;		/* sopv-brown03 */
		color: #222;
		padding-left:15px;
	}
	#guide .left dd {
		margin:0 auto 0 auto;   
		font-size:12px;
		line-height:1.7em;
		font-display: swap;
		color:#222;
		padding-left:15px;
	}
	#guide .right {
		width:100%;
		height:auto;
		padding-bottom:30px;
	}
	#guide .right ul {
		margin: 0 auto 0 auto;
		width:95%;
	}
	#guide .right ul li {
		float:left;
		margin:0 1% 7px 1%;
		width:48%;
	}
	#guide .right ul li a {
		display:block;
		padding:10px;
		padding-left:35px;
		text-align:center;
		font-weight:bold;
		font-size:14px;
		color: #222;
		padding:10px 0px 10px 10px;
		background:url("../images/bg/titlesym03.svg") no-repeat;
		background-size:38px 38px;
		background-size:19px 19px;	/* 50% */
		background-position: left 15px center;
		background-color:#FFF;
/*		border:1px solid #BDC3C7;	*/	/* Siver */
	}
	#guide ul li a:hover {
		padding:5px 0px 5px 10px;
		background-color:#F3F3F3;
		color: #555;
	}

	@media screen and (min-width:768px) {

		#guide {
			margin:30px auto 0 17%;
			display: flex;
			flex-wrap:wrap;
			justify-content: center;
/*			align-items: top;	*/
			width:80%;
			width:85%;
			padding-top:30px;
			padding-bottom:50px;
		}
		#guide .left {
			width:20%;
		}
		#guide .left dl {
			margin:0 auto 0 auto;
			width:100%;
			padding-bottom:30px;
			border-left: 5px solid #444;
		}
		#guide .left dt {
			text-align:center;
			font-size:26px;
			font-weight:normal;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			color: #6E3919;		/* sopv-brown03 */
			color: #333;
			padding-top:0;
			padding-left:0;
		}
		#guide .left dd {
			margin:0px auto 0 auto;   
			width:100%;
			font-size:17px;
			line-height:1.8em;
			text-align:center;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			color:#222;
			padding-left:0;
		}
		#guide .right {
			width:80%;
		}
		#guide .right ul {
			margin: 0 auto 0 7%;
			width:70%;
		}
		#guide .right ul li {
			float:left;
			margin:0 40px 20px auto;
			width:auto;
		}
		#guide .right ul li a {
			display:block;
			width:auto;
			text-align:center;
			font-size:17px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			color: #222;
			padding:10px 30px 10px 40px;
			background:url("../images/bg/titlesym03.svg") no-repeat;
			background-size:38px 38px;
			background-size:19px 19px;	/* 50% */
			background-position: left 10px top 0;
			background-color:#FFF;
		}
		#guide .right ul li a:hover {
			display:block;
/*			padding-left:40px;*/
			text-align:center;
			font-size:17px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 400;
			font-style: normal;
			font-display: swap;
			padding:10px 30px 10px 40px;
			background:url("../images/bg/titlesym03.svg") no-repeat;
			background-size:19px 19px;	/* 50% */
			background-position: left 10px top 5px;
			background-color:#F3F3F3;
		}
		#guide .right ul li a.active {
			display:block;
			text-align:center;
			font-size:17px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			padding:7px 30px 7px 40px;
			padding:10px 30px 10px 60px;
			padding:10px 30px 10px 40px;
			background:url("../images/bg/titlesym03.svg") no-repeat;
			background-size:19px 19px;	/* 50% */
			background-position: left 10px top 5px;
			background-color:#F4F4F4;
		}
	}

	@media only screen and (min-width: 1020px) and (max-width: 1400px) {	/*◇ PC-S */

		#guide {
			margin:0 auto 0 10%;
			width:100%;
			padding-bottom:0px;
		}
		#guide .left dl {
			margin:0 auto 0 auto;
			width:100%;
			padding-bottom:15px;
			border-left: 5px solid #444;
		}
		#guide .left dt {
			font-size:20px;
		}
		#guide .left dd {
			font-size:13px;
		}
		#guide .right ul {
			margin: 0 auto 0 7%;
			width:80%;
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 767px) and (max-width: 1020px) {

		#guide {
			margin:0 auto 0 auto;
			width:100%;
			padding-top:20px;
			padding-bottom:0;
		}
		#guide .left {
			width:90%;
		}
		#guide .left dl {
			margin:0 auto 0 auto;
			width:100%;
			padding-bottom:10px;
			border-left: 5px solid #444;
		}
		#guide .left dt {
			font-size:22px;
		}
		#guide .left dd {
			font-size:13px;
		}
		#guide .right {
			margin:20px auto 0 auto;
			width:100%;
			height:auto;
			padding-bottom:20px;
		}
		#guide .right ul {
			margin: 0 auto 0 auto;
			width:100%;
			padding-left:10%;
		}
	}

/* ■ WORK list  section -----------------------------*/

	#list {
		margin:0 auto 0 auto;
		width:100%;
		padding-top:30px;
		padding-bottom:50px;
		background-color:#F3F3F3;
	}

	@media screen and (max-width:550px) {
		#list h2{
			margin:0 0 50px 0;
		}
	}
	#list h2 span.bgLRextend::before{
		background:#333;
	}
	#list #wkinf-area {
		margin:0px auto 0px auto;
		width:90%;
		padding:30px 2.5% 50px 2.5%;
	}
	#list .work-area {
		margin:0 auto 0 auto;
		width:100%;
	}
	#list .work-area .sectitle {
		margin: 0 auto 0 auto;
		width: 80%;
		padding-bottom:0;
		position:relative;
	}
	#list .work-area .sectitle h2 {
		margin:0 auto 50px auto;
		width:90%;
		font-size:34px;
		text-align:center;
		line-height:1.8em;
		letter-spacing:0.2px;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 600;
		font-style: normal;
		font-display: swap;
		color:#333;
		padding-top:30px;
		padding-bottom:25px;
		border-bottom: 2px solid #221815;	/* base-black */
	}
	#list .work-area .sectitle h2 span {
		font-size:26px;
		padding-left:50px;
	}
	#list .work-area .sectitle>.symt {
		display:block;
		position:absolute;
		top:40px;
		right:10%;
		font-size:30px;
		text-align:right;
		font-weight:bold;
		font-family: "Antro_Vectra";
		font-display: swap;
		color: #444;
	}
	@media screen and (max-width:590px) {
		#list .work-area{
			margin:0 auto 20px auto;   
		}
	}
	#list .work-area .cont01 {
		margin: 0 auto 0 auto;
		width:100%;
		display:flex;
		flex-wrap:wrap;
		flex-direction:row;
/*		justify-content: space-between;	*/	/* 両端のアイテムを余白を空けずに配置し、他の要素は均等に間隔を空けて配置 */
		justify-content: flex-start;		/* 両端のアイテムを余白を空けずに配置し、他の要素は均等に間隔を空けて配置 */
/*		border: 1px solid #BDC3C7;*/	/* Siver */
	}
	#list .work-area .cont01>dl,dt,dd {
	}
	#list .work-area .cont01>dl {
		margin: 0 auto 20px auto;
		width:32%;
		padding-bottom:60px;
		background-color:#FFF;
		position:relative;
		border: 1px solid #BDC3C7;	/* Siver */
	}
	#list .work-area .cont01>dl dt {
		margin: 20px 0 20px 5%;
		width:90%;
		text-align:center;
		font-size: 16px;
		line-height:1.0em;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
		color: #6E3919;		/* fujiken-brown01 */
		padding-left:0;
		padding-top:5px;
		padding-bottom:20px;
		border-bottom: 1px solid #BDC3C7;	/* Siver */
	}
	#list .work-area .cont01>dl:first-child dt {
		background-image:url("../images/top/sec02n01.png");
		background-size:	125px 41px;
		background-size:	81px 27px;	/* 65% */
		background-position:	left 0 top 0;
		background-repeat:no-repeat;
	}
	#list .work-area .cont01>dl dd {
		margin:0 auto 0 auto;   
		width:85%;
		font-size:13px;
		line-height:1.7em;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 400;
		font-style: normal;
		font-display: swap;
		color:#222;
	}
	#list .work-area .cont01>dl dd.category {
		margin:0 auto 0 auto;   
		width:85%;
		text-align:center;
		font-size:14px;
		font-family: "Noto Sans JP", serif;
		font-optical-sizing: auto;
		font-weight: 500;
		font-style: normal;
		font-display: swap;
		color:#fff;
		padding:10px 0 10px 0;
		background-color:#221815;		/* fujico-blk */
	}
	#list .work-area .cont01>dl dd.btn {
		position:absolute;
		bottom:15px;
		left:0;
		right:0;
		margin:auto;
		text-align: center;
		padding-top:30px;
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 767px) and (max-width: 1020px) {

		#list {
			margin:0 auto 0 auto;
			width:100%;
			padding-top:0;
			padding-bottom:0;
			background-color:#F3F3F3;
		}
		#list .work-area .sectitle {
			margin: 0 auto 0 auto;
			width: 80%;
			padding-bottom:0;
			position:relative;
		}
		#list .work-area .sectitle h2 {
			margin:0 auto 50px auto;
			width:90%;
			font-size:26px;
			text-align:center;
			padding-top:30px;
			padding-bottom:10px;
			border-bottom: 2px solid #221815;	/* base-black */
		}
		#list .work-area .sectitle h2 span {
			font-size:20px;
			padding-left:50px;
		}
		#list .work-area .sectitle>.symt {
			display:block;
			position:absolute;
			top:45px;
			right:6%;
			font-size:16px;
		}
		#list #wkinf-area{
			margin:0 auto 0 auto;   
			width:95%;
			padding:15px 2.5% 20px 2.5%;
		}
		#list .work-area{
			margin:0 auto 0 auto;
			width:100%;
		}
		#list .work-area h2{
			display:block;
			margin:0 auto 30px auto;
			font-size:17px;
			font-weight:bold;
			padding-top:10px;
			padding-bottom:20px;
			color:#444;
			letter-spacing: 0.1em;
		}
		#list .work-area h3{
			margin:0 auto 25px auto;
			text-align: center;
			font-weight:bold;
			font-size:13px;
			line-height:1.7em;
		}
		#list .work-area .cont01>dl {
			margin: 0 auto 20px auto;
			width:32%;
		}
		#list .work-area .cont01>dl dt {
			margin: 20px 0 20px auto;
			width:100%;
			font-weight:bold;
			font-size: 15px;
			line-height:1.7em;
		}
	}

	@media screen and (max-width:767px) {

		#list {
			margin:-20px auto 0 auto;
			width:100%;
			padding-top:30px;
			padding-bottom:10px;
		}
		#list #wkinf-area{
			margin:0 auto 0 auto;   
			width:90%;
			padding:0 2.5% 0 2.5%;
		}
		#list .work-area {
			margin:0 auto 0 auto;
			width:100%;
		}
		#list .work-area .sectitle {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0;
			position:relative;
		}
		#list .work-area .sectitle h2{
			margin:0 auto 20px auto;
			width:100%;
			font-size:15px;
			text-align:center;
			line-height:1.7em;
			font-weight:bold;
			font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "小塚ゴシック Pro","Kozuka Gothic Pro","メイリオ", 
							Meiryo, Osaka, helvetica, arial,
							"游ゴシック体", YuGothic,"ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
			font-display: swap;
			color:#222;
			padding-top:0;
			padding-bottom:10px;
			border-bottom: 2px solid #221815;	/* base-black */
		}
		#list .work-area .sectitle h2 span {
			font-size:13px;
			padding-left:20px;
		}
		#list .work-area .sectitle>.symt {
			display:block;
			position:absolute;
			top:0;
			right:10px;
			font-size:15px;
			text-align:right;
			color: #222;
		}
		#list .work-area .cont01 {
			margin: 20px auto 0 auto;
			width:100%;
			display:block;
			border:none;
		}
		#list .work-area .cont01>dl {
			margin: 0 auto 20px auto;
			width:100%;
			padding-bottom:50px;
			border: 1px solid #BDC3C7;	/* Siver */
		}
		#list .work-area .cont01>dl dt {
			margin: 20px auto 15px auto;
			width:90%;
			text-align:center;
			font-size: 13px;
			line-height:1.0em;
			font-weight:bold;
			padding-left:0px;
			padding-top:5px;
			padding-bottom:10px;
		}
		#list .work-area .cont01>dl:first-child dt {
			background-size:	125px 41px;
			background-size:	63px 21px;	/* 50% */
			background-position:	left 0 top 0;
			background-repeat:no-repeat;
		}
		#list .work-area .cont01>dl:nth-child(2) dt {
			background-image:url("../images/top/sec02n02.png");
			background-size:	126px 41px;
			background-size:	63px 21px;	/* 50% */
			background-position:	left 0 top 0;
			background-repeat:no-repeat;
		}
		#list .work-area .cont01>dl:nth-child(3) dt {
			background-image:url("../images/top/sec02n03.png");
			background-size:	126px 41px;
			background-size:	63px 21px;	/* 50% */
			background-position:	left 0 top 0;
			background-repeat:no-repeat;
		}
		#list .work-area .cont01>dl dd {
			margin:0 auto 0 auto;   
			width:90%;
			font-size:12px;
			line-height:1.6em;
			color:#222;
		}
		#list .work-area .cont01>dl dd.category {
			margin:0 auto 0 auto;   
			width:90%;
			text-align:center;
			font-size:12px;
			font-weight:bold;
			font-style: normal;
			padding:5px 0 5px 0;
		}
		#list .work-area .cont01>dl dd.btn {
			position:absolute;
			bottom:10px;
			left:0;
			right:0;
			margin:auto;
			text-align: center;
		}
	}

	@media screen and (max-width:590px) {

		#list .work-area .img{
			margin:0 auto 30px auto;   
			width:100%;
			z-index: 2;
			text-align:center;
		}
		#list .work-area .img img {

			width:85%;
			padding-left:5%;
		}
		#list .work-area .content{
			width:100%;
			top:-10px;
			top:-10px;
			animation:none;
			opacity: 1;
			z-index: 1;
		}
		#list .work-area:nth-of-type(2n) .content {
			margin-left:5%;
		}
	}

/* ■ WORK detail  section01 ----------------------------*/

	 #worksection {
		margin: -30px auto 0 auto;
		width: 100%;
		padding-bottom:30px;
		background:linear-gradient(90deg,#F5F5F5 0%,#F5F5F5 30%,white 30%,white 100%);	/* ★ */
	}
	 #worksection h1,h2,h3,h4,h5,h6{
		font-size:100%;
		font-weight:normal;
	}
	#wksec{
		margin: 0 auto 0 auto;
		width: 100%;
		padding-bottom:10px;
	}
	#wksec #wksecsym01 {
		display:none;
	}
	 #worksection #wksectitle01 {
		margin: 0 auto 0 auto;
		width: 90%;
	}
	 #worksection #wksectitle01 h2 {
		font-size:16px;
		font-weight:bold;
		color: #777;
		padding-top:15px;
		padding-left:15px;
		padding-bottom:15px;
	}
	#worksection #wksectitle01 h2 span {
		color: #222;
	}
	 #worksection #wksectitle01 p {
		width: 100%;
		font-size:12px;
		color:#222;
		line-height:22px;
		padding-top:10px;
		padding-left:20px;
	}
	#wksec #cont {
		margin: 0 auto 0 auto;
		width: 90%;
		padding-top:20px;
		padding-bottom:0px;
		background-color:rgba( 255,255,255,0.98 ); 	/*  White  透過98% */
			box-shadow: 0px 1px 2px 1px #aaa;
			-webkit-box-shadow: 0px 1px 2px 1px #aaa;
			-moz-box-shadow: 0px 1px 2px 1px #aaa;
	}
	#wksec #cont h3 {
		display:block;
		margin: 0 auto 20px auto;
		width: 90%;
		font-size:13px;
		font-weight:bold;
		color:#222;
		line-height:18px;
		padding-left:10px;
		padding-bottom:5px;
		border-left: 5px solid #BD1A20;	/* cacielo-red02 */
		border-bottom: 1px solid #BDC3C7;	/* Siver */
	}
	#wksec #cont .textitem {
		margin: 0 auto 0 auto;
		width: 100%;
		padding-bottom:5px;
	}
	#wksec #cont .textitem h4 {
		margin: 0 auto 0 auto;
		width: 90%;
		font-size:12px;
		line-height:1.7em;
		color:#222;
		padding-bottom:10px;
	}
	#wksec #cont .textitem .txt {
		margin: 0 auto 0 auto;
		width: 90%;
		font-size:12px;
		line-height:1.7em;
		color:#222;
		padding-bottom:10px;
	}
	#wksec #cont dl,dt,dd {
		display:block;
	}
	#wksec #cont .textitem dl {
		display:block;
		margin: 10px auto 10px auto;
		width: 90%;
	}
	#wksec #cont .textitem dt {
		margin: 0 auto 0 auto;
		width: 100%;
		font-size:12px;
		font-weight:bold;
		color:#222;
	}
	#wksec #cont .textitem dd {
		margin: 10px auto 10px auto;
		width: 100%;
		font-size:12px;
		line-height:1.7em;
		font-style: normal;
		color:#222;
	}
	#wksec #cont .textitem ul {
		margin: 0 auto 0 auto;
		width: 100%;
	}
	#wksec #cont .textitem ul li {
		float:left;
		margin: 0 5px 0 auto;
		text-align:center;
		font-size:12px;
		font-weight: bold;
		color:#FFF;
		padding:5px 10px 5px 10px;
		background-color:#0F1419;		/* cacielo-blk */
	}
	#wksec #cont .wkdt-img {
		margin: 20px auto 0 auto;
	}
	#wksec #cont .wkdt-img img {
		display:block;
		margin: 0 auto 0 auto;
	}
	#wksec .nlall {		/* 一覧に戻る */
		display: block;
		margin: 20px auto 45px auto;
		position:relative;
	}
	#wksec .nlall a {
		display: block;
		position:absolute;
		top:0;
		left:0;
		right:0;
		margin:auto;
		width:140px;
		font-size:12px;
		line-height:1.5em;
		color: #FFF;
		background	: url("../images/icon/btn-arrow.png") no-repeat;
		background-size:8px 8px;
		background-position: 10px  12px; 
	}
	#wksec .nlall a:hover {
		background	: url("../images/icon/btn-arrow.png") no-repeat;
		background-size:8px 8px;
		background-position: 150px 12px; 
	}

	@media only screen and  (max-width: 360px) {

	}

	@media only screen and (min-width:767px) {

		 #worksection {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:50px;
			background-color:#FFF;
			background:linear-gradient(90deg,white 0%,white 10%,#F5F5F5 10%,#F5F5F5 40%,white 40%,white 100%);	/* ★ */
		}
		#wksec{
			margin: 30px auto 0 auto;
			width: 100%;
			padding-bottom:50px;
			position:relative;
		}
		#wksec #wksecsym01 {
			display:block;
			position: absolute;
			top: 0px;
			right: 50px;
			z-index:9;
		}
		 #worksection #wksectitle01{
			margin: 0 auto 0 auto;
			width: 80%;
			padding-bottom:0;
		}
		 #worksection #wksectitle01 h2 {
			text-align:center;
			font-size:30px;
			letter-spacing:1px;
			font-weight:normal;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			color: #777;
			padding-top:0px;
			padding-bottom:0px;
		}
		 #worksection #wksectitle01 h2 span {
			color: #333;
		}
		 #worksection #wksectitle01 p {
			width: 100%;
			font-size:16px;
			color:#222;
			line-height:30px;
			padding-bottom:20px;
			padding-left:80px;
		}
		#wksec #cont {
			margin: 30px auto 0 15%;
			width: 70%;
			padding-top:20px;
			padding-bottom:50px;
			background-color:rgba( 255,255,255,0.98 ); 	/*  White  透過98% */
				box-shadow: 0px 1px 3px 1px #aaa;
				-webkit-box-shadow: 0px 1px 3px 1px #aaa;
				-moz-box-shadow: 0px 1px 3px 1px #aaa;
			position: relative;
		}
		#wksec #cont  h3 {
			display:block;
			margin: 30px auto 30px auto;
			width: 70%;
			font-size:24px;
			font-weight:normal;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			color:#222;
			line-height:30px;
			padding-left:30px;
			padding-bottom:15px;
			border-left:8px solid BD1A20;		/* cacielo-red02 */
			border-bottom: 1px solid #BDC3C7;	/* Siver */
		}
		#wksec #cont .textitem {
			margin: 0 auto 0 auto;
			width: 75%;
			padding-bottom:0;
		}
		#wksec #cont .textitem h4 {
			margin: 0 auto 0 auto;
			width: 85%;
			font-size:18px;
			line-height:25px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			color:#222;
			padding-bottom:25px;
		}
		#wksec #cont .textitem .txt {
			margin: 0 auto 0 auto;
			width: 85%;
			font-size:16px;
			line-height:1.8em;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 400;
			font-style: normal;
			font-display: swap;
			color:#222;
		}
		#wksec #cont .textitem dl {
			display:block;
			margin: 20px auto 20px auto;
			width: 85%;
		}
		#wksec #cont .textitem dt {
			margin: 0 auto 0 auto;
			width: 100%;
			font-size:16px;
			line-height:25px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			color:#222;
		}
		#wksec #cont .textitem dd {
			margin: 20px auto 20px auto;
			width: 100%;
			font-size:16px;
			line-height:1.8em;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 400;
			font-style: normal;
			font-display: swap;
			color:#222;
		}
		#wksec #cont .textitem ul {
			margin: 0 auto 0 auto;
			width: 100%;
		}
		#wksec #cont .textitem ul li {
			float:left;
			margin: 0 20px 0 auto;
			font-size:14px;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 500;
			font-style: normal;
			font-display: swap;
			padding:10px 25px 10px 25px;
		}
		#wksec #cont .wkdt-img {
			margin: 50px auto 30px auto;
			width: auto;
		}
		#wksec .nlall {		/* 一覧に戻る */
			display: block;
			margin: 50px auto 30px auto;
			position:relative;
		}
		#wksec .nlall a {
			display: block;
			position:absolute;
			top:0;
			left:0;
			right:0;
			margin:auto;
			width:200px;
			font-size:14px;
			font-weight:600;
			line-height:1.5em;
			color: #FFF;
			background	: url("../images/icon/btn-arrow.png") no-repeat;
			background-size:8px 8px;
			background-position: 15px  16px;
		}
		#wksec .nlall a:hover {
			background	: url("../images/icon/btn-arrow.png") no-repeat;
			background-size:8px 8px;
			background-position: 170px 16px; 
		}
	}
	@media only screen and (min-width: 1020px) and (max-width: 1400px) {	/*◇ PC-S */

		 #worksection {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0px;
			background:linear-gradient(90deg,white 0%,white 5%,#F5F5F5 5%,#F5F5F5 40%,white 40%,white 100%);	/* ★ */
		}
		#wksec #cont {
			margin: 30px auto 0 7.5%;
			width: 80%;
			padding-top:20px;
			padding-bottom:50px;
			background-color:rgba( 255,255,255,0.98 ); 	/*  White  透過98% */
				box-shadow: 0px 1px 3px 1px #aaa;
				-webkit-box-shadow: 0px 1px 3px 1px #aaa;
				-moz-box-shadow: 0px 1px 3px 1px #aaa;
			position: relative;
		}
	}
	/* Tablet Layout ◇ */
	@media only screen and (min-width: 767px) and (max-width: 1020px) {

		 #worksection {
			margin: 0 auto 0 auto;
			width: 100%;
			padding-bottom:0px;
			background:linear-gradient(90deg,white 0%,white 5%,#F5F5F5 5%,#F5F5F5 40%,white 40%,white 100%);	/* ★ */
		}
		#wksec{
			margin: 50px auto 0 auto;
			width: 100%;
			padding-bottom:50px;
			position:relative;
		}
		 #worksection #wksectitle01{
			margin: 70px auto 0 17%;
			width: 80%;
			padding-bottom:0px;
		}
		 #worksection #wksectitle01 h2 {
			font-size:24px;
			font-weight:bold;
			font-family: "Noto Sans JP", serif;
			font-optical-sizing: auto;
			font-weight: 700;
			font-style: normal;
			font-display: swap;
			padding-left:0;
			padding-bottom:0px;
		}
		#wksec #cont {
			margin: 30px auto 0 8%;
			width: 85%;
			padding-top:20px;
			padding-bottom:20px;
			background-color:rgba( 255,255,255,0.90 ); 	/*  White  透過95% */
			position: relative;
		}
		#wksec #cont  p.category01 {	/* NEWS & RELEASE カテゴリー */
			margin: 10px auto 10px 5%;
		}
		#wksec #cont  h3 {
			width: 80%;
			font-size:18px;
			font-weight:bold;
			padding-left:25px;
			padding-bottom:5px;
		}
		#wksec #cont dl.wkitem {
			margin: 0 auto 0 auto;
			width: 90%;
		}
		#wksec #cont .textitem h4 {
			margin: 0 auto 0 auto;
			width: 100%;
			font-size:16px;
			line-height:1.7em;
			padding-bottom:20px;
		}
		#wksec #cont .textitem .txt {
			margin: 0 auto 0 auto;
			width: 100%;
			font-size:14px;
			line-height:1.7em;
		}
		#wksec #cont .textitem dl {
			display:block;
			margin: 20px auto 20px auto;
			width: 100%;
		}
		#wksec #cont dl.wkitem dt {
			margin: 0 auto 0 auto;
			width: 90%;
			font-size:14px;
			padding:15px;
			padding-top:0px;
			padding-left:25px;
			line-height:27px;
			color:#444;
			background	: url("../images/icon/arrow01.png") no-repeat;
			background-size:14px 13px;
			background-position:left 0 top 6px;
		}
		#wksec #cont dl.wkitem dd {
			margin: 0 auto 0 auto;
			width: 100%;
			font-size:13px;
			line-height:20px;
			padding-top:0px;
			padding-left:50px;
			padding-right:50px;
			padding-bottom:10px;
		}
		#wksec .nlall {		/* 一覧に戻る */
			display: block;
			margin: 20px auto 45px auto;
			position:relative;
		}
		#wksec .nlall a {
			display: block;
			position:absolute;
			top:0;
			left:0;
			right:0;
			margin:auto;
			width:160px;
			font-size:12px;
			line-height:1.5em;
			color: #FFF;
			background	: url("../images/icon/btn-arrow.png") no-repeat;
			background-size:8px 8px;
			background-position: 10px  12px; 
		}
	}