@charset "utf-8";
/* CSS Document */

#wrapper { overflow:inherit; }
@media screen and (min-width: 900px) {
	header { background: #fff; padding-bottom: 20px;}
	header h1 { color: #000; }
	header .in .h_flex .h_flex_L .h_logo .blk { display: block; }
	header .in .h_flex .h_flex_L .h_logo .wh { display: none; }
	
	.h_flex_R .h_nav li a         { resize: none; display: block; }
	.h_flex_R .h_nav li a:link    { color:#000; text-decoration: none; }
	.h_flex_R .h_nav li a:visited { color:#000; text-decoration: none; }
	.h_flex_R .h_nav li a:hover   { color:var(--base-color); text-decoration: none; }
	.h_flex_R .h_nav li a:active  { color:#000; text-decoration: none; }
}

/*-- headline ------------------------------------------------------------*/
#headline { }
@media screen and (max-width: 1089px) {
	#headline { position: relative; background: #000; min-height: 300px; background: url("../img/second/headline.png") center center no-repeat; background-size: cover; }
	#headline .in { background: var(--base-color); position: absolute; bottom: 20px; left: 20px; padding: 6% 6%; z-index: 10; }
	#headline .in:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;  background-image:radial-gradient(#05612e 10%, transparent 0%); background-size: 15px 15px; z-index: -1; }
	#headline .ttl01 { font-size: 1.8em; font-weight: 700; line-height: 1.0; margin-bottom: 10px; color: #fff; letter-spacing: 0.1em; position: relative; z-index: 1; text-align: left; }
	#headline .enTtl { font-size: 0.9em; font-weight: 700; line-height: 1.0; margin-bottom: 0px; color: #fff; z-index: 1; text-align: left; }	
}
@media screen and (min-width: 1090px) {
	#headline { position: relative; background: #000; min-height: 500px; background: url("../img/second/headline.png") center center no-repeat; background-size: cover; }
	#headline .in { background: var(--base-color); position: absolute; bottom: -80px; left: 6%; padding: 60px 80px; z-index: 10; }
	#headline .in:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;  background-image:radial-gradient(#05612e 10%, transparent 0%); background-size: 15px 15px; z-index: -1; }
	#headline .ttl01 { font-size: 3.0em; font-weight: 700; line-height: 1.0; margin-bottom: 20px; color: #fff; letter-spacing: 0.1em; position: relative; z-index: 1;}
	#headline .enTtl { font-size: 1.0em; font-weight: 700; line-height: 1.0; margin-bottom: 0px; color: #fff; z-index: 1; }	
}
@media screen and (min-width: 1090px) and (max-width: 1189px)  {
}
@media screen and (min-width: 1190px) and (max-width: 1189px)  {
}

#headline.companyHeadline { background: url("../img/second/headline-company.png") center center no-repeat; background-size: cover; }
#headline.serviceHeadline { background: url("../img/second/headline-service.png") center center no-repeat; background-size: cover; }
#headline.forestHeadline { background: url("../img/second/headline-forest.png") center center no-repeat; background-size: cover; }
#headline.lumberHeadline { background: url("../img/second/headline-lumber.png") center center no-repeat; background-size: cover; }
#headline.precutHeadline { background: url("../img/second/headline-precut.png") center center no-repeat; background-size: cover; }
#headline.factoryHeadline { background: url("../img/second/headline-factory.png") center center no-repeat; background-size: cover; }
#headline.recruitHeadline { background: url("../img/second/headline-recruit.png") center center no-repeat; background-size: cover; }
#headline.laminaHeadline { background: url("../img/second/headline-lamina.png") center center no-repeat; background-size: cover; }
#headline.oilHeadline { background: url("../img/second/headline-oil.png") center bottom no-repeat; background-size: cover; }
#headline.scmHeadline { background: url("../img/second/headline-scm.jpg") center center no-repeat; background-size: cover; }
#headline.newsHeadline { background: url("../img/second/headline-news.png") center center no-repeat; background-size: cover; }
#headline.contactHeadline { background: url("../img/second/headline-contact.png") center center no-repeat; background-size: cover; }

/*-- breadcrumbs ------------------------------------------------------------*/
#breadcrumbs { display: flex; justify-content: flex-end; align-items: center; padding: 10px 1%; background: #fff; border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; position: relative; }
#breadcrumbs li { font-size: 0.8rem; margin-right: 5px; display: inline-block; }
#breadcrumbs li:nth-child(1):before { content:"\f275"; font-family: "Font Awesome 5 Free"; font-weight: 700; margin-right: 5px; }
#breadcrumbs li:after { content: "〉"; margin-left: 20px; color: #666; }
#breadcrumbs li:last-child { margin-right: 0px; }
#breadcrumbs li:last-child:after { display: none; }
@media screen and (max-width: 599px) {
	#breadcrumbs { margin-bottom: 20px; }
	#breadcrumbs li { font-size: 0.8em; }
}
@media screen and (min-width: 600px) and (max-width: 1089px) {
	#breadcrumbs { margin-bottom: 20px; }
}
#breadcrumbs li a         { resize: none; }
#breadcrumbs li a:link    { color:#333; text-decoration: underline; }
#breadcrumbs li a:visited { color:#333; text-decoration: underline; }
#breadcrumbs li a:hover   { color:var(--base-color); text-decoration: underline; }
#breadcrumbs li a:active  { color:#333; text-decoration: underline; }

/*-- section ------------------------------------------------------------*/
@media screen and (max-width: 1089px){
	main { margin: 0 6%; }
	main section { margin-bottom: 10vh; }
	main .ttl01 { font-size: 1.5em; font-weight: 700; line-height: 1.0; margin-bottom: 10px; }
	main .enTtl { font-size: 4.0em; font-weight: 700; line-height: 1.0; margin-bottom: 30px; }
	
	main .ttlBox { margin-bottom: 30px; }
	main .ttl02 { font-size: 2.0em; font-weight: 700; line-height: 1.0; margin-bottom: 10px; }
	main .enTtl02 { font-size: 1.0em; font-weight: 700; line-height: 1.0; margin-bottom: 0; color: var(--base-color); margin-left: 10px; }

	.ttl03 { font-size: 1.5em; border-bottom: 1px solid var(--base-color); padding:5px 0; position: relative; margin-bottom: 20px; }
	.ttl03 span { position: absolute; top: -30px; right: -10px; font-size: 3.0em; font-family: "Oswald", sans-serif; font-weight: 700; z-index: -1; opacity: 0.1; line-height: 1.0; color: var(--base-color); }
	.ttl03:after { content: ""; position: absolute; bottom: -3px; left: 0; width: 20%; height: 3px; background:var(--base-color); }
	
	aside .side-in { padding: 0 6% 6%; }
	
	aside .side-in ul { margin-bottom: 20px; }
	aside .side-in ul li { border-left: 3px solid var(--base-color); padding: 5px 10px 5px 15px; /*border-bottom: 1px dotted #dedede;*/ margin-bottom: 10px; font-size: 0.9em; cursor: pointer; position: relative; overflow: hidden;}
	aside .side-in ul li.parent::before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: calc( 100% + 12px);
	  height: 100%;
	  background: var(--base-color);
	  transform: scaleX(0) ;
	  transform-origin: left center;   /* 初期は左基点 */
	  transition: transform 0.35s cubic-bezier(.4,0,.2,1);
	  z-index: 0;
	}
	
	aside .side-in ul li.childMenu { border-left:none; padding: 5px 0px 5px 5px; border-bottom: 1px dotted #dedede; margin-bottom: 10px; font-size: 0.85em; }
	aside .side-in ul li.childMenu:before { display: inline-block; content: "├"; margin-right: 0.5em;  vertical-align: top; }
	aside .side-in ul li.childMenu a { display: inline-block; }
	
	aside .side-in ul .sideTtl { border: 1px solid var(--base-color); padding: 5px 10px; text-align: center; font-size: 0.8em; background: var(--base-color); color: #fff; }
	aside .side-in ul .sideTtl:hover { pointer-events: none; background: var(--base-color); color: #fff; }
	
	aside .side-in ul li:hover { background:var(--base-color); color: #fff; }
	aside .side-in ul li a { resize: none; position: relative; z-index: 1; }
	aside .side-in ul li a:link    { color:#000; text-decoration: none; }
	aside .side-in ul li a:visited { color:#000; text-decoration: none; }
	aside .side-in ul li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li a:active  { color:#000; text-decoration: none; }
	
	aside .side-in ul li:hover a { color: #fff; }
	aside .side-in ul li:hover a:link    { color:#fff; text-decoration: none; }
	aside .side-in ul li:hover a:visited { color:#fff; text-decoration: none; }
	aside .side-in ul li:hover a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li:hover a:active  { color:#fff; text-decoration: none; }
			
	aside .side-in ul li.toggle { position: relative; }
	aside .side-in ul li.toggle:after { position: absolute; top: 50%; transform: translateY(-50%); right: 5px; font-family: "Font Awesome 5 Free"; content: "\f067"; font-weight: 700; opacity: 0.5;}
	aside .side-in ul li.active.toggle:after { content: "\f068"; }
	
	.sign { font-size: 1.0em; font-weight: 700; }
	.sign span.president { margin-left: 1em; font-size: 1.2em; }
}
@media screen and (max-width: 599px) {
	main .ttl02 { font-size: 1.6em; }
	main .enTtl02 { font-size: 0.9em; }
	.roboto.enTtl02.mb40 { margin-bottom: 20px !important; }
	.in-flex aside { margin-bottom: 5vh; }
	.in-flex aside .side-in .sp-toggle { background: #f4f4f4; text-align: center; padding: 5px 0; position: relative; margin-bottom: 0px; }
	.in-flex aside .side-in .sp-toggle:after { content: "\f107"; font-family: "Font Awesome 5 Free"; font-weight: 700; position: absolute; top: 50%; right: 2%; transform: translateY(-50%);}
	.in-flex aside .side-in .sp-toggle.active:after { content: "\f106"; font-family: "Font Awesome 5 Free"; font-weight: 700; position: absolute; top: 50%; right: 2%; transform: translateY(-50%);}
	.in-flex aside .side-in ul li { padding: 10px; border-bottom: 1px dotted #dedede; border-left: 5px solid var(--base-color); }
	.in-flex aside .side-in ul li a { resize: none; display: block; }
	.in-flex aside .side-in ul li a:link    { color:#000; text-decoration: none; }
	.in-flex aside .side-in ul li a:visited { color:#000; text-decoration: none; }
	.in-flex aside .side-in ul li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.in-flex aside .side-in ul li a:active  { color:#000; text-decoration: none; }
	.in-flex aside .side-in .sp-toggleContent { margin-bottom: 40px; }
	main section.recruitSection { margin-bottom: 0px; }
}
@media screen and (min-width: 600px) and (max-width: 889px){
	main .ttl02 { font-size: 1.8em; }
	main .enTtl02 { font-size: 0.95em; }
}
@media screen and (min-width: 600px) and (max-width: 1089px){
	.in-flex aside .side-in ul { display: flex; justify-content: center; align-items: center; margin: 5vh 0; } 
	.in-flex aside .side-in ul li { height: 40px; line-height: 40px; text-align: center; border: 3px solid #dedede; width: 15%; margin: 0 0.5%; font-size: 0.8em; }
	.in-flex aside .side-in ul.subMenu_tab li { width: 25%; font-size: 0.7em; }
	
	.in-flex aside .side-in ul li a { resize: none; display: block; }
	.in-flex aside .side-in ul li a:link    { color:#000; text-decoration: none; }
	.in-flex aside .side-in ul li a:visited { color:#000; text-decoration: none; }
	.in-flex aside .side-in ul li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.in-flex aside .side-in ul li a:active  { color:#000; text-decoration: none; }
	
	.in-flex aside .side-in ul li:hover a { color:#fff; text-decoration: none; }
	.in-flex aside .side-in ul li:hover a:link    { color:#fff; text-decoration: none; }
	.in-flex aside .side-in ul li:hover a:visited { color:#fff; text-decoration: none; }
	.in-flex aside .side-in ul li:hover a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	.in-flex aside .side-in ul li:hover a:active  { color:#fff; text-decoration: none; }
	
	aside .side-in ul { display: flex; justify-content: flex-start; flex-wrap: wrap; }
	aside .side-in ul li { margin-right: 20px;}
	
	aside .side-in ul .sideTtl { border: 1px solid var(--base-color); padding: 5px 10px; text-align: center; font-size: 0.8em; background: var(--base-color); color: #fff; }
	aside .side-in ul .sideTtl:hover { pointer-events: none; background: var(--base-color); color: #fff; }
}
@media screen and (min-width: 1090px){	
	#content { position: relative; }
	.second-flex { display: flex; justify-content: space-between; }
	.second main { max-width: 1400px; width: 96%; margin: 0 auto; position: relative; }
	
	main { padding: 10vh 8% 6%; }
	main section { margin-bottom: 10vh; padding-bottom: 10vh; border-bottom: 1px solid #333;}
	main section:last-child { padding-bottom: 0; border-bottom: none; }
	main section .in-max { max-width: 1200px; }

	main .ttlBox { display: flex; justify-content: flex-start; align-items:center; margin-bottom: 40px; }
	main .ttl02 { font-size: 2.4em; font-weight: 700; line-height: 1.0; margin-right: 40px; }
	main .enTtl02 { font-size: 1.2em; font-weight: 700; line-height: 1.0; margin-bottom: 0; color: var(--base-color); }
	
	.ttl03 { font-size: 1.5em; border-bottom: 1px solid var(--base-color); padding:5px 0; position: relative; margin-bottom: 20px; }
	.ttl03 span { position: absolute; top: -30px; right: -10px; font-size: 3.0em; font-family: "Oswald", sans-serif; font-weight: 700; z-index: -1; opacity: 0.1; line-height: 1.0; color: var(--base-color); }
	.ttl03:after { content: ""; position: absolute; bottom: -3px; left: 0; width: 20%; height: 3px; background:var(--base-color); }
	
	.sign { font-size: 1.1em; font-weight: 700; }
	.sign span.president { margin-left: 1em; font-size: 1.3em; }
	
	aside { width: 16%; margin-top: 40px; }
	aside .side-in { position: sticky; top: 30%; background: #fff; padding: 40px 10px; }
	aside .side-in ul { margin-bottom: 20px; }
	aside .side-in ul li { border-left: 3px solid var(--base-color); padding: 5px 10px 5px 15px; /*border-bottom: 1px dotted #dedede;*/ margin-bottom: 10px; font-size: 0.9em; cursor: pointer; position: relative; overflow: hidden;}
	aside .side-in ul li.parent::before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: calc( 100% + 12px);
	  height: 100%;
	  background: var(--base-color);
	  transform: scaleX(0) ;
	  transform-origin: left center;   /* 初期は左基点 */
	  transition: transform 0.35s cubic-bezier(.4,0,.2,1);
	  z-index: 0;
	}
	
	aside .side-in ul li.subMenu { border-left:none; padding: 5px 0px 5px 5px; border-bottom: 1px dotted #dedede; margin-bottom: 10px; font-size: 0.9em; }
	aside .side-in ul li.subMenu:before { content: "├"; margin-right: 0.25em; display: inline-block; vertical-align: top; }
	aside .side-in ul li.subMenu a { display: inline-block; }
	
	aside .side-in ul li:hover { background:var(--base-color); color: #fff; }
	aside .side-in ul li a { resize: none; display: block; position: relative; z-index: 1; }
	aside .side-in ul li a:link    { color:#000; text-decoration: none; }
	aside .side-in ul li a:visited { color:#000; text-decoration: none; }
	aside .side-in ul li a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li a:active  { color:#000; text-decoration: none; }
	
	aside .side-in ul li:hover a { color: #fff; }
	aside .side-in ul li:hover a:link    { color:#fff; text-decoration: none; }
	aside .side-in ul li:hover a:visited { color:#fff; text-decoration: none; }
	aside .side-in ul li:hover a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li:hover a:active  { color:#fff; text-decoration: none; }
	
	aside .side-in ul li.current { background:var(--base-color); color: #fff; }
	aside .side-in ul li.current:hover a { color: #fff; opacity: 0.7; }
	aside .side-in ul li.current a { resize: none; display: block; }
	aside .side-in ul li.current a:link    { color:#fff; text-decoration: none; }
	aside .side-in ul li.current a:visited { color:#fff; text-decoration: none; }
	aside .side-in ul li.current a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li.current a:active  { color:#fff; text-decoration: none; }
	aside .side-in ul li.current.subMenu a { display: inline-block; }
	
	aside .side-in ul li.active { background:var(--base-color); color: #fff; overflow:inherit; }
	aside .side-in ul li.active:hover a { color: #fff; opacity: 0.7; }
	aside .side-in ul li.active a { resize: none; display: block; }
	aside .side-in ul li.active a:link    { color:#fff; text-decoration: none; }
	aside .side-in ul li.active a:visited { color:#fff; text-decoration: none; }
	aside .side-in ul li.active a:hover   { color:#fff; text-decoration: none; background: var(--base-color); }
	aside .side-in ul li.active a:active  { color:#fff; text-decoration: none; }
	aside .side-in ul li.active::before { width: calc(100% + 12px); transform: scaleX(1) translateX(-12px); transform-origin: right center;  /* 表示時は右基点 */ }
	
	aside .side-in ul li.toggle { position: relative; }
	aside .side-in ul li.toggle:after { position: absolute; top: 50%; transform: translateY(-50%); right: 5px; font-family: "Font Awesome 5 Free"; content: "\f067"; font-weight: 700; opacity: 0.5;}
	aside .side-in ul li.active.toggle:after { content: "\f068"; }
	
	aside .side-in ul li.childMenu { border-left:none; padding: 5px 0px 5px 5px; border-bottom: 1px dotted #dedede; margin-bottom: 10px; font-size: 0.85em; }
	aside .side-in ul li.childMenu:before { display: inline-block; content: "├"; margin-right: 0.5em;  vertical-align: top; }
	aside .side-in ul li.childMenu a { display: inline-block; }
	
	aside .side-in ul .sideTtl { border: 1px solid var(--base-color); padding: 5px 10px; text-align: center; font-size: 0.8em; background: var(--base-color); color: #fff; }
	aside .side-in ul .sideTtl:hover { pointer-events: none; background: var(--base-color); color: #fff; }
}
@media screen and (min-width: 1090px) and (max-width: 1189px) {
	aside { width: 20%; }
	aside .side-in ul li.childMenu { font-size: 0.8em; }
}
@media screen and (min-width: 1190px) and (max-width: 1289px) {
	aside { width: 19%; }
	aside .side-in ul li.childMenu { font-size: 0.8em; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	aside { width: 18%; }
	aside .side-in ul li.childMenu { font-size: 0.8em; }
}
@media screen and (min-width: 1390px) and (max-width: 1489px) {
	aside { width: 17%; }
}
@media screen and (min-width: 1490px) {
}

/*-- company ------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.tbl01 { width: 100%; border-top: 1px solid #dedede; }
	.tbl01 th,.tbl01 td { padding: 10px; text-align: left; display: block; }
	.tbl01 th { text-align: center; border-bottom: 1px dotted #dedede; background: #dedede; }
	.tbl01 td { border-bottom: 1px solid #dedede; }
	
	.tbl02 { width: 100%; table-layout: fixed; max-width: 1200px;}
	.tbl02 th,.tbl02 td { padding: 10px; text-align: left; border: 1px solid #fff; vertical-align:middle; font-size: 0.9em;}
	.tbl02 th { text-align: center; background: #f4f4f4; border: 1px solid #dedede; }
	.tbl02 td { border: 1px solid #dedede; }
	
	.tbl03 { width: 100%;  }
	.tbl03 th,.tbl03 td { padding: 10px !important; text-align: left !important; display: block !important; }
	.tbl03 th { text-align: center !important; border-bottom: 1px dotted #dedede !important; background: #dedede !important; }
	.tbl03 td { border-bottom: 1px solid #dedede !important; vertical-align: middle !important; padding: 10px !important; }
	
	.rinen { font-size: 1.5em; line-height: 1.7; }
}
@media screen and (min-width: 600px) {
	.tbl01 { width: 100%;  }
	.tbl01 th,.tbl01 td { padding: 20px; text-align: left; }
	.tbl01 th { width: 20%; text-align: left; border-bottom: 3px solid #dedede; }
	.tbl01 td { width: 80%; border-bottom: 1px solid #dedede; }
	
	.tbl02 { width: 100%; table-layout: fixed; max-width: 1200px;}
	.tbl02 th,.tbl02 td { padding: 20px; text-align: left; border: 1px solid #fff; vertical-align:middle; font-size: 0.9em;}
	.tbl02 th { text-align: center; background: #f4f4f4; border: 1px solid #dedede; }
	.tbl02 td { border: 1px solid #dedede; }
	
	.tbl03 { width: 100%;  }
	.tbl03 th,.tbl01 td { padding: 20px !important; text-align: left !important; }
	.tbl03 th { width: 20%; text-align: center !important; border-bottom: 3px solid #dedede !important; }
	.tbl03 td { width: 80%; border-bottom: 1px solid #dedede !important; vertical-align: middle !important;}
	
	.rinen { font-size: 1.8em; }
}

/*-- service ------------------------------------------------------------*/
@media screen and (max-width: 767px) {
	.ttl04 { font-size: 1.3em; color: var(--base-color); margin-bottom: 20px; font-weight: bold; }
	.ttl04_bk { color: #000; margin-bottom: 20px; }
	.thirdFlex { display: flex; justify-content: space-between; flex-direction: column; margin-bottom: 0px; }
	.thirdFlex li { position: relative; width: 90%; margin: 0 auto 20px; }
	.thirdFlex li div { margin-bottom: 20px; border-radius: 8px; }
	.thirdFlex li div img {  }
	.thirdFlex li .listTtl { margin-bottom: 10px; text-align: center; font-weight: bold; font-size: 1.3em; color: var(--sub-color); }
	
	.serviceList li { position: relative; overflow: hidden; }
	.serviceList li .sl-in { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2; width: 90%; margin: 0 auto;}
	.serviceList li .serviceTtl { text-align: center; font-size: 1.3em; color: #fff; line-height: 1.5; font-weight: 700; margin-bottom: 10px; }
	.serviceList li .serviceTtl span { display: block; font-size: 0.75em; font-weight: normal; }
	.serviceList li .serviceTxt { color: #fff; margin-bottom: 0px; text-align: center; }
	.serviceList li .sl-img { margin-bottom: 0px; }
	.serviceList li:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.75); z-index: 1; }

	.photoHover div { overflow: hidden; }
	.photoHover img { transition: 1s all; }
	.photoHover:hover { opacity: 1;}
	.photoHover:hover img { transform:scale(1.1,1.1); transition:1s all; }
	.photoHover:hover:after { background: rgba(0,0,0,0.25); }
	.photoHover:hover .serviceTtl { text-shadow: 3px 3px 3px rgba(0,0,0,0.1), -3px -3px 3px rgba(0,0,0,0.1), -3px 3px 3px rgba(0,0,0,0.1), 3px -3px 3px rgba(0,0,0,0.1), 3px 0px 3px rgba(0,0,0,0.1), -3px -0px 3px rgba(0,0,0,0.1), 0px 3px 3px rgba(0,0,0,0.1), 0px -3px 3px rgba(0,0,0,0.1);}
	.photoHover:hover .serviceTxt { text-shadow: 3px 3px 3px rgba(0,0,0,0.1), -3px -3px 3px rgba(0,0,0,0.1), -3px 3px 3px rgba(0,0,0,0.1), 3px -3px 3px rgba(0,0,0,0.1), 3px 0px 3px rgba(0,0,0,0.1), -3px -0px 3px rgba(0,0,0,0.1), 0px 3px 3px rgba(0,0,0,0.1), 0px -3px 3px rgba(0,0,0,0.1); }
	
	.in-flex { display: flex; justify-content: space-between; flex-direction: column; }
	.in-flex-Txt { order: 2; padding: 6% 0; }
	.in-flex-Img { order: 1; }
	
	.swiper-card-containar { margin-top:2.5vh; }
	.swiper-slide-card dl { display: flex; justify-content: flex-start; align-items: center; border-left: 5px solid var(--base-color); padding: 5px 10px 5px 20px; margin-top: 20px; }
	.swiper-slide-card dl dt { font-size: 2.0em; font-family: "Oswald", sans-serif; font-weight: 700; margin-right: 20px; line-height: 1.0; color: var(--base-color); }
	.swiper-slide-card dl dd p { margin-bottom: 0px;}
	.swiper-slide-card dl dd .bold { font-size: 1.2em; margin-bottom: 5px; font-weight: bold; }

	.in-flex-start { }
	.in-flex-first { margin-bottom: 42px; }
	.in-flex-second {  }
	
	.ttl05 { font-size: 1.1em; margin-bottom: 10px; color: var(--base-color); border-left: 5px solid var(--base-color); padding-left: 10px; font-weight: bold;}
	.kiList { margin-left: 0px;}
	.kiList li { margin-bottom: 20px; }
	.kiList li .bold { margin-bottom: 5px; font-size: 1.0em; }
	.in-flex-box { border: 5px solid #dedede; padding: 4% 6%; margin-bottom: 40px;}
	
	.img960 { width: 100%; margin: 20px auto; }
}
@media screen and (min-width: 768px) {
	.ttl04 { font-size: 1.5em; color: var(--base-color); margin-bottom: 20px; font-weight: bold; }
	.ttl04_bk { color: #000; margin-bottom: 40px; }
	.thirdFlex { display: flex; justify-content: space-between; margin-bottom: 0px; }
	.thirdFlex li { width: 31%; position: relative; }
	.thirdFlex li div { margin-bottom: 20px; border-radius: 8px; }
	.thirdFlex li div img {  }
	.thirdFlex li .listTtl { margin-bottom: 10px; text-align: center; font-weight: bold; font-size: 1.3em; color: var(--sub-color); }
	
	.serviceList li { position: relative; overflow: hidden; width: 32%; }
	.serviceList li .sl-in { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 2; width: 90%; margin: 0 auto;}
	.serviceList li .serviceTtl { text-align: center; font-size: 1.3em; color: #fff; line-height: 1.5; font-weight: 700; margin-bottom: 10px; }
	.serviceList li .serviceTtl span { display: block; font-size: 0.75em; font-weight: normal; }
	.serviceList li .serviceTxt { color: #fff; margin-bottom: 0px; text-align: center; }
	.serviceList li .sl-img { margin-bottom: 0px; }
	.serviceList li:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.75); z-index: 1; }

	.photoHover div { overflow: hidden; }
	.photoHover img { transition: 1s all; }
	.photoHover:hover { opacity: 1;}
	.photoHover:hover img { transform:scale(1.1,1.1); transition:1s all; }
	.photoHover:hover:after { background: rgba(0,0,0,0.25); }
	.photoHover:hover .serviceTtl { text-shadow: 3px 3px 3px rgba(0,0,0,0.1), -3px -3px 3px rgba(0,0,0,0.1), -3px 3px 3px rgba(0,0,0,0.1), 3px -3px 3px rgba(0,0,0,0.1), 3px 0px 3px rgba(0,0,0,0.1), -3px -0px 3px rgba(0,0,0,0.1), 0px 3px 3px rgba(0,0,0,0.1), 0px -3px 3px rgba(0,0,0,0.1);}
	.photoHover:hover .serviceTxt { text-shadow: 3px 3px 3px rgba(0,0,0,0.1), -3px -3px 3px rgba(0,0,0,0.1), -3px 3px 3px rgba(0,0,0,0.1), 3px -3px 3px rgba(0,0,0,0.1), 3px 0px 3px rgba(0,0,0,0.1), -3px -0px 3px rgba(0,0,0,0.1), 0px 3px 3px rgba(0,0,0,0.1), 0px -3px 3px rgba(0,0,0,0.1); }
	
	.in-flex { display: flex; justify-content: space-between; }
	.in-flex-mb { margin-bottom: 5vh;}
	.in-flex-Txt { width: 56%; }
	.in-flex-Img { width: 40%; }
	.in-flex-Txt-pd { padding: 5vh 0;}
	
	.swiper-card-containar { margin-top:5vh; }
	.swiper-slide-card dl { display: flex; justify-content: flex-start; align-items: center; border-left: 5px solid var(--base-color); padding: 5px 10px 5px 20px; margin-top: 20px; }
	.swiper-slide-card dl dt { font-size: 3.0em; font-family: "Oswald", sans-serif; font-weight: 700; margin-right: 20px; line-height: 1.0; color: var(--base-color); }
	.swiper-slide-card dl dd p { margin-bottom: 0px;}
	.swiper-slide-card dl dd .bold { font-size: 1.5em; margin-bottom: 5px; font-weight: bold; }
	
	.in-flex-start { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 5vh; }
	.in-flex-first { margin-right: 40px; width: 40%; }
	.in-flex-second { margin-right: 40px; }
	
	.ttl05 { font-size: 1.2em; margin-bottom: 10px; color: var(--base-color); border-left: 5px solid var(--base-color); padding-left: 10px; font-weight: bold;}
	.kiList { margin-left: 10px;}
	.kiList li { margin-bottom: 20px; }
	.kiList li .bold { margin-bottom: 5px; font-size: 1.1em; }
	.in-flex-box { border: 5px solid #dedede; padding: 40px;}
	
	.img960 { max-width: 960px; width: 100%; margin: 40px auto; }
}
@media screen and (min-width: 768px) and (max-width: 899px) {
	.thirdFlex li { width: 32%; }
	.serviceList li .sl-in { width: 90%; }
	.serviceList li .serviceTtl { font-size: 1.15em; }
	.serviceList li .serviceTxt { font-size: 0.85em; }
}
@media screen and (min-width: 900px) and (max-width: 1089px) {
	.thirdFlex li { width: 32%; }
	.serviceList li .sl-in { width: 90%; }
	.serviceList li .serviceTtl { font-size: 1.15em; }
	.serviceList li .serviceTxt { font-size: 0.85em; }
}
@media screen and (min-width: 1090px) and (max-width: 1289px) {
	.thirdFlex li { width: 32%; }
	.serviceList li .sl-in { width: 90%; }
	.serviceList li .serviceTtl { font-size: 1.15em; }
	.serviceList li .serviceTxt { font-size: 0.9em; }
}
@media screen and (min-width: 1290px) and (max-width: 1389px) {
	.thirdFlex li { width: 32%; }
	.serviceList li .sl-in { width: 90%; }
	.serviceList li .serviceTtl { font-size: 1.2em; }
	.serviceList li .serviceTxt { font-size: 0.95em; }
}

.in-flex-Img-forestImg01 { background: url("../img/second/forestImg01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-forestImg02 { background: url("../img/second/forestImg02.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-forestImg03 { background: url("../img/second/forestImg03.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-forestImg04 { background: url("../img/second/forestImg04.jpg") center center no-repeat; background-size: cover; }

.in-flex-Img-lumberImg01 { background: url("../img/second/lumberImg01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-lumberImg02 { background: url("../img/second/lumberImg03.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-lumberImg03 { background: url("../img/second/lumberImg02.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-lumberImg04 { background: url("../img/second/lumberImg04.jpg") center center no-repeat; background-size: cover; }

.in-flex-Img-precutImg01 { background: url("../img/second/precut01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-precutImg02 { background: url("../img/second/precut02.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-precutImg03 { background: url("../img/second/precut03.jpg") center center no-repeat; background-size: cover; }

.in-flex-Img-laminaImg01 { background: url("../img/second/lamina01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-laminaImg02 { background: url("../img/second/lamina02.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-laminaImg03 { background: url("../img/second/lamina03.jpg") center center no-repeat; background-size: cover; }

.in-flex-Img-oilImg01 { background: url("../img/second/oil01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-oilImg02 { background: url("../img/second/oil02.jpg") center center no-repeat; background-size: cover; }

.in-flex-Img-scmImg01 { background: url("../img/second/scm01.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-scmImg02 { background: url("../img/second/scm02.jpg") center center no-repeat; background-size: cover; }
.in-flex-Img-scmImg03 { background: url("../img/second/scm03.jpg") center center no-repeat; background-size: cover; }

/*-- view button ------------------------------------------------------------*/
.view-button { transition: .3s; font-family:'Roboto Condensed', sans-serif; font-weight:bold; margin-bottom: 0px; }
.view-button a { display:inline-block; cursor:pointer; position: relative; text-decoration: none; font-size: 1.5em; margin-bottom: 0px; transition: .3s; color: #000; }
.view-button a::after { content: ""; display: block; position: absolute; top: calc(50%); left: 120%; width: 60px; height: 5px; border: none; border-right: 2px solid #000; border-bottom: 1px solid #000; transform: skew(45deg); transition: .3s; }
.view-button a:hover::after { position: absolute; top: calc(50%); left: 120%; width: 80px; height: 5px; }

@media screen and (max-width: 599px) {
	.view-button a { font-size: 1.5em; margin-bottom: 0px; padding: 5px 40px 5px 10px; }
	.view-button a::after { top: calc(30%); left: 95%; width: 30px; }
}

.view-button a:hover { color:var(--base-color); cursor: pointer; }
.view-button a:hover::after { border-right: 2px solid var(--base-color); border-bottom: 1px solid var(--base-color); }
.view-button a:hover::after { }

/*-- factory ------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.flex-photo { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; margin-bottom: 40px; }
	.flex-photo li { width: 50%;}
	.factDl { border-left: 5px solid var(--base-color); padding-left: 20px; margin-bottom: 40px;}
}
@media screen and (min-width: 600px) {
	.flex-photo { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 40px; }
	.factDl { border-left: 5px solid var(--base-color); padding-left: 20px; margin-bottom: 40px;}
}

/*-- Recruit ------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.jobList { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
	.jobList li { border: 5px solid #dedede; display: flex; justify-content: center; align-items: center; flex-direction: column; min-height: 90px; width: 49%; margin-right: 1%; margin-bottom: 20px; }
	.jobList li:nth-child(2n) { margin-right: 0; }
	.jobList li p { margin-bottom: 0px; font-size: 0.9em; }
	.jobList li p.bold { margin-bottom: 10px; font-size: 1.0em; text-align: center; }
	.jobList li:nth-child(2n) { margin-right: 0%; }
	.jobList li.not { background: rgba(0,0,0,0.75); }
	.jobList li.not p { color: #fff; }
	.jobList li.not p.bold { color: #fff; }
	
	.interviewList {  }
	.interviewList li { margin-bottom: 20px; }
	.interviewList li:nth-child(3n) { margin-right: 0px; }
	.interviewList li .nameBox { background: var(--base-color); padding: 20px; color: #fff; }
	.interviewList li .nameBox p { margin-bottom: 0px;}
	.interviewList li .nameBox .bold { margin-bottom: 5px; font-size: 1.1em;}
	.interviewList li .nameBox p .roboto { font-size: 1.2em; line-height: 1.0;}
	.box-in-Flex { display: flex; justify-content: flex-start; align-items: center; }
	.box-in-Flex .view-button { margin-left: 2em; color: #fff; font-size: 0.7em; margin-bottom: 0px; }
	
	.interviewList02 { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
	.interviewList02 li { width: 48%; margin-right: 4%; margin-bottom: 20px; }
	.interviewList02 li:nth-child(2n) { margin-right: 0px; }
	.interviewList02 li .nameBox { background: var(--base-color); padding: 10px; color: #fff; }
	.interviewList02 li .nameBox p { margin-bottom: 0px;}
	.interviewList02 li .nameBox .bold { margin-bottom: 0px; font-size: 0.8em;}
	
	.recDl { margin-bottom: 20px; border-left: 5px solid var(--base-color); padding-left: 20px; }
	.recDl dt { font-size: 1.1em; font-weight: bold; }
	.recDl dd { font-size: 0.9em; font-weight: bold; }
	.recTtl { font-size: 1.1em;}
}
@media screen and (min-width: 600px) {
	.jobList { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
	.jobList li { border: 5px solid #dedede; display: flex; justify-content: center; align-items: center; flex-direction: column; min-height: 120px; }
	.jobList li p { margin-bottom: 0px; font-size: 0.9em; }
	.jobList li p.bold { margin-bottom: 10px; font-size: 1.1em; text-align: center; }
	.jobList li.not { background: rgba(0,0,0,0.75); }
	.jobList li.not p { color: #fff; }
	.jobList li.not p.bold { color: #fff; }
	
	.interviewList { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
	.interviewList li { width: 48%; margin-right: 4%; margin-bottom: 40px; }
	.interviewList li:nth-child(2n) { margin-right: 0px; }
	.interviewList li .nameBox { background: var(--base-color); padding: 20px; color: #fff; }
	.interviewList li .nameBox p { margin-bottom: 0px;}
	.interviewList li .nameBox .bold { margin-bottom: 5px; font-size: 1.1em;}
	.interviewList li .nameBox p .roboto { font-size: 1.2em; line-height: 1.0;}
	.box-in-Flex { display: flex; justify-content: flex-start; align-items: center; }
	.box-in-Flex .view-button { margin-left: 2em; color: #fff; font-size: 0.7em; margin-bottom: 0px; }
	
	.interviewList02 { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
	.interviewList02 li { width: 23%; margin-right: 2%; margin-bottom: 40px; }
	.interviewList02 li:nth-child(4n) { margin-right: 0px; }
	.interviewList02 li .nameBox { background: var(--base-color); padding: 10px; color: #fff; }
	.interviewList02 li .nameBox p { margin-bottom: 0px;}
	.interviewList02 li .nameBox .bold { margin-bottom: 0px; font-size: 0.8em;}
	
	.recDl { margin-bottom: 40px; border-left: 5px solid var(--base-color); padding-left: 20px; }
	.recDl dt { font-size: 1.2em; font-weight: bold; }
	.recDl dd { font-size: 1.0em; font-weight: bold; }
	.recTtl { font-size: 1.2em;}
}
@media screen and (min-width: 600px) and (max-width: 899px) {
	.jobList li { width: 31%; margin-right: 1%; margin-bottom: 20px; }
	.jobList li:nth-child(3n) { margin-right: 0%; }
	
	.interviewList li .nameBox p { font-size: 0.9em; }
	.interviewList li .nameBox .bold { font-size: 1.0em;}
	.interviewList li .nameBox p .roboto { font-size: 1.1em; }
}
@media screen and (min-width: 900px) {
	.jobList li { width: 22.0%; margin-right: 1%; margin-bottom: 20px; }
	.jobList li:nth-child(4n) { margin-right: 0%; }
}

.box-in-Flex .view-button a { color: #fff; }
.box-in-Flex a::after { border-right: 2px solid #fff; border-bottom: 1px solid #fff; }
.view-button a:hover { color:#fff; }
.view-button a:hover::after { border-right: 2px solid #fff; border-bottom: 1px solid #fff; }


/*-- #anch088 -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	.newsList { margin-bottom: 40px;}
	.newsList li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.newsList li dl { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li dl dt { margin-right: 20px; font-family:'Roboto Condensed', sans-serif; font-weight:bold; line-height: 1.0;}
	.newsList li:before { display: none; padding-bottom: 10px; margin-bottom: 10px;}
	.arrow-button a { background: var(--opa-color);}
	.arrow-button a:hover { color:#000; background:var(--opa-color);  }
	.arrow-button a:hover::after { border-right: 2px solid #000; border-bottom: 1px solid #000; }
}
@media screen and (min-width: 600px) {
	.newsList { margin-bottom: 40px;}
	.newsList li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #dedede; }
	.newsList li dl { display: flex; justify-content: flex-start; align-items: center; }
	.newsList li dl dt { margin-right: 20px; font-family:'Roboto Condensed', sans-serif; font-weight:bold; line-height: 1.0;}
	.newsList li:before { display: none; padding-bottom: 10px; margin-bottom: 10px;}
	.arrow-button a { background: var(--opa-color);}
	.arrow-button a:hover { color:#000; background:var(--opa-color);  }
	.arrow-button a:hover::after { border-right: 2px solid #000; border-bottom: 1px solid #000; }
}

/*-- privacy -------------------------------------------------------------*/
@media screen and (max-width: 599px) {
	ul.sub-menu02 { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 20px; }
	ul.sub-menu02 li { border: 1px solid #000; width: 33%; text-align: center; margin-left: 0.5%; font-size: 0.7rem; align-items: center; display: flex; justify-content: center;}
	ul.sub-menu02 li:nth-child(1) { margin-left: 0px; }
	ul.sub-menu02 li.current { background: var(--base-color); color: #fff; border: 1px solid var(--base-color); }
	ul.sub-menu02 li a         { resize: none; display: block;}
	ul.sub-menu02 li a:link    { color:#000; text-decoration: none; }
	ul.sub-menu02 li a:visited { color:#000; text-decoration: none; }
	ul.sub-menu02 li a:hover   { color:#fff; text-decoration: none; background:var(--base-color);}
	ul.sub-menu02 li a:active  { color:#000; text-decoration: none; }
	ul.sub-menu02 li.current a { color: #fff; }
	
	.second-box { margin-bottom: 40px; }
}
@media screen and (min-width: 600px) {
	ul.sub-menu02 { display: flex; justify-content: flex-start; align-items: center; margin-bottom: 20px; }
	ul.sub-menu02 li { border: 1px solid #000; width: 200px; text-align: center; height: 30px; line-height: 30px; margin-left: 5px; font-size: 0.8rem; }
	ul.sub-menu02 li.current { background: var(--base-color); color: #fff; border: 1px solid var(--base-color); }
	ul.sub-menu02 li a         { resize: none; display: block;}
	ul.sub-menu02 li a:link    { color:#000; text-decoration: none; }
	ul.sub-menu02 li a:visited { color:#000; text-decoration: none; }
	ul.sub-menu02 li a:hover   { color:#fff; text-decoration: none; background:var(--base-color);}
	ul.sub-menu02 li a:active  { color:#000; text-decoration: none; }
	ul.sub-menu02 li.current a { color: #fff; }
	
	.second-box h4 { font-size: 1.6rem; color: var(--base-color); font-weight: bold; margin-bottom: 10px; }
}