body {
	color: #4e4c4d;
	font-family: "heisei-kaku-gothic-std", sans-serif;
	font-weight: 300;
	position: relative;
    left: -10px;
    overflow-x: hidden;
	-webkit-text-size-adjust: 100%; /* iphone横向き 文字拡大防止 */
}
img {
	display: block;
	width: 100%;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
a {
	text-decoration: none;
	color: #000;
	transition: all .3s;
}
a:hover {
	filter: brightness(1.1);
}
p {
	line-height: 1.6;
}


/*==================================================================================
ヘッダー
==================================================================================*/
header {
	width: 100%;
	padding: 30px 0!important;
	z-index: 9999;
}
header .logo {
	display: block;
	width: 240px;
}
nav.gnav ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
nav.gnav ul li {
	margin-left: 30px;
	position: relative;
}
nav.gnav ul li a {
	display: block;
	font-size: 14px;
}
nav.gnav ul li a:hover {
	color: #52c64b;
}
nav.gnav ul li a.btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: auto;
	height: 45px;
	padding: 0 40px;
	border-radius: 50px;
	background: #52c64b;
	color: #fff;
	font-size: 14px;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
}

/*==================================================================================
共通
==================================================================================*/
/* レイアウト */
section {
	padding: 60px 0!important;
	position: relative;
}
.container {
	width: calc(100% - 120px);
	padding: 0 60px;
	margin: auto;
}
.max680 {
	max-width: 680px;
	margin: auto;
}
.max960 {
	max-width: 960px;
	margin: auto;
}
.max1200 {
	max-width: 1200px;
	margin: auto;
}
.max1360 {
	max-width: 1360px;
	margin: auto;
}
.max1600 {
	max-width: 1600px;
	margin: auto;
}
.row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.row.align_start {
	align-items: flex-start;
}
.row.align_center {
	align-items: center;
}
.row.just_center {
	justify-content: center;
}
.row.just_start {
	justify-content: flex-start;
}
.col2 {
	width: 50%;
}
.col2.pd30 {
	width: calc(50% - 15px);
}
.col2.pd60 {
	width: calc(50% - 30px);
}
.col3 {
	width: calc(100% / 3 - 15px);
}

.mb_5 {
	margin-bottom: 5px;
}
.mb_10 {
	margin-bottom: 10px;
}
.mb_20 {
	margin-bottom: 20px;
}
.mb_30 {
	margin-bottom: 30px;
}
.mb_60 {
	margin-bottom: 60px;
}
.mb_120 {
	margin-bottom: 120px;
}
.mr_10 {
	margin-right: 10px;
}
.mr_30 {
	margin-right: 30px;
}
.shadow {
	box-shadow: 10px 10px 10px rgba(0,0,0,0.1);
}
a.shadow:hover {
	box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
}
.round_bg::before {
	content: "";
	display: block;
	width: calc(100% - 120px);
	height: 100%;
	border-radius: 0 20px 20px 0;
	background: #f7f7f7;
	position: absolute;
	bottom: 0;
	left: 0;
}
.round_bg.right::before {
	border-radius: 20px 0 0 20px;
	left: auto;
	right: 0;
}
.z2 {
	position: relative;
	z-index: 2;
}

/* フォント */
h1 {
	font-size: 76px;
	font-weight: 900;
	line-height: 1.4;
	letter-spacing: 0.03em;
	position: relative;
	z-index: 2;
}
h2 {
	font-size: 40px;
	font-weight: 900;
	letter-spacing: 0.1em;
	line-height: 1;
}
h2 span {
	display: inline-block;
	margin-left: 30px;
	color: #52c64b;
	font-weight: 500;
	letter-spacing: 0.05em;
}
h2.eng {
	padding-left: 25px;
	font-size: 20px;
	font-family: "acumin-pro-wide", sans-serif;
	font-weight: 500;
	position: relative;
}
h2.eng::before {
	content: "";
	display: block;
	width: 14px;
	height: 14px;
	background: #52c64b;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
h3 {
	font-size: 34px;
	font-weight: 700;
	line-height: 1.4;
}
h3 span {
	display: block;
	margin-bottom: 10px;
	color: #52c64b;
	font-size: 16px;
	font-family: "acumin-pro-wide", sans-serif;
	font-weight: 400;
	letter-spacing: 0.05em;
}
h3.second {
	padding-left: 45px;
	font-weight: 900;
	line-height: 1;
	letter-spacing: 0.1em;
	position: relative;
}
h3.second::before {
	content: "";
	display: block;
	width: 24px;
	height: 24px;
	background: #52c64b;
	position: absolute;
	top: 0;
	left: 0;
}
h4 {
	padding-bottom: 20px!important;
	font-size: 24px;
	font-weight: 900;
	text-align: center;
	line-height: 1.4;
	position: relative;
}
h4::after {
	content: "";
	display: block;
	width: 50px;
	border-bottom: 4px #129105 solid;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
}
.font_12 {
	font-size: 12px;
}
.font_14 {
	font-size: 14px;
}
.font_18 {
	font-size: 18px;
}
.font_20 {
	font-size: 20px;
}
.font_24 {
	font-size: 24px;
}
.font_34 {
	font-size: 34px;
	line-height: 1.4;
}
.font_46 {
	font-size: 46px;
	line-height: 1.4;
}
.font_60 {
	font-size: 60px;
	line-height: 1.4;
}
.txt_center {
	text-align: center;
}
.txt_right {
	text-align: right;
}
.medium {
	font-weight: 500;
}
.bold {
	font-weight: 700;
}
.black {
	font-weight: 900;
}
.eng {
	font-family: "acumin-pro-wide", sans-serif;
}
.gray {
	color: #969696;
}
.green {
	color: #129105;
}
.indent {
	padding-left: 1em;
	text-indent: -1em;
}
.indent2 {
	padding-left: 2em;
	text-indent: -2em;
}
.line2 {
	line-height: 2;
}

/* ボタン */
.btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: 360px;
	height: 60px;
	border-radius: 50px;
	background: #52c64b;
	color: #fff!important;
	font-size: 18px;
	text-decoration: none!important;
	box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
}
.btn:hover {
	box-shadow: 5px 5px 5px rgba(0,0,0,0.2);
}
.btn_detail {
	display: inline-block;
	padding: 10px 20px;
	border-radius: 30px;
	background: #f7f7f7;
	color: #000!important;
	text-decoration: none!important;
}
.btn_detail span {
	display: inline-block;
	padding-right: 60px;
	background: url("../img/icon_arrow.png") center right / 16px no-repeat;
}


.btn_detail:hover {
	background: #efefef;
	filter: none;
}

/* アニメーション -----------*/
.animated.fadeinup {
	animation: fadeinup .8s ease-out;
}
@keyframes fadeinup {
	0% {opacity: 0; transform: translateY(30px);}
	50% {opacity: 0; transform: translateY(30px);}
	100% {opacity: 1; transform: translateY(0);}
}
.animated.fadeinup.second {
	animation: fadeinup_2nd 1s ease-out;
}
@keyframes fadeinup_2nd {
	0% {opacity: 0; transform: translateY(30px);}
	60% {opacity: 0; transform: translateY(30px);}
	100% {opacity: 1; transform: translateY(0);}
}
.animated.fadeinup.third {
	animation: fadeinup_3rd 1.2s ease-out;
}
@keyframes fadeinup_3rd {
	0% {opacity: 0; transform: translateY(30px);}
	66.6% {opacity: 0; transform: translateY(30px);}
	100% {opacity: 1; transform: translateY(0);}
}
/* right */
.animated.fadeinright {
	animation: fadeinright .8s ease-out;
}
@keyframes fadeinright {
	0% {opacity: 0; transform: translateX(30px);}
	50% {opacity: 0; transform: translateX(30px);}
	100% {opacity: 1; transform: translateX(0);}
}
.animated.fadeinright.second {
	animation: fadeinright_2nd 1s ease-out;
}
@keyframes fadeinright_2nd {
	0% {opacity: 0; transform: translateX(30px);}
	60% {opacity: 0; transform: translateX(30px);}
	100% {opacity: 1; transform: translateX(0);}
}
/* left */
.animated.fadeinleft {
	animation: fadeinleft .8s ease-out;
}
@keyframes fadeinleft {
	0% {opacity: 0; transform: translateX(-30px);}
	50% {opacity: 0; transform: translateX(-30px);}
	100% {opacity: 1; transform: translateX(0);}
}
.animated.fadeinleft.second {
	animation: fadeinleft_2nd 1s ease-out;
}
@keyframes fadeinleft_2nd {
	0% {opacity: 0; transform: translateX(-30px);}
	60% {opacity: 0; transform: translateX(-30px);}
	100% {opacity: 1; transform: translateX(0);}
}

/*==================================================================================
INDEX
==================================================================================*/
section#main .inner {
	padding: 0 60px;
}
section#main .img { 
	margin: -80px auto -60px;
	padding: 100px 60px;
	position: relative;
}
section#main .img::before { 
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #f7f7f7 url("../img/bg_dot.png") left top / 35px repeat;
	border-radius: 30px;
	position: absolute;
	top: 0;
	left: 0;
}
section#main.animated .img::before { 
	animation: main_bg .8s;
}
@keyframes main_bg {
	0% {opacity: 0; width: 0;}
	100% {opacity: 1; width: 100%;}
}
/* イラスト背景 */
section#main .img img {
	max-width: 1600px;
	margin: auto;
	position: relative;
	z-index: 2;
}
section#main.animated .img img {
	animation: main_ilst_bg 2s;
}
@keyframes main_ilst_bg {
	0% {opacity: 0;}
	30% {opacity: 0;}
	100% {opacity: 1;}
}
/* 人 */
section#main .img img[class^="ilst0"] {
	width: calc(100% - 120px);
	position: absolute;
	top: 100px;
	left: 50%;
	transform: translateX(-50%);
}
/* 人01 */
section#main.animated .img img.ilst01 {
	animation: main_ilst01 2s ease-out;
}
@keyframes main_ilst01 {
	0% {opacity: 0; transform: translateX(-50%) rotate(2deg);}
	30% {opacity: 0; transform: translateX(-50%) rotate(2deg);}
	50% {opacity: 1; transform: translateX(-50%) rotate(0);}
	100% {opacity: 1; transform: translateX(-50%) rotate(0);}
}
/* 人02 */
section#main.animated .img img.ilst02 {
	animation: main_ilst02 2s ease-out;
	transform-origin: right top;
}
@keyframes main_ilst02 {
	0% {opacity: 0; transform: translateX(-50%) rotate(-1deg);}
	40% {opacity: 0; transform: translateX(-50%) rotate(-1deg);}
	60% {opacity: 1; transform: translateX(-50%) rotate(0);}
	100% {opacity: 1; transform: translateX(-50%) rotate(0);}
}
/* 人03 */
section#main.animated .img img.ilst03 {
	animation: main_ilst03 2s ease-out;
}
@keyframes main_ilst03 {
	0% {opacity: 0; transform: translateX(-50%) rotate(-2deg);}
	50% {opacity: 0; transform: translateX(-50%) rotate(-2deg);}
	70% {opacity: 1; transform: translateX(-50%) rotate(0);}
	100% {opacity: 1; transform: translateX(-50%) rotate(0);}
}
/* 人04 */
section#main.animated .img img.ilst04 {
	animation: main_ilst04 2s ease-out;
	transform-origin: center bottom;
}
@keyframes main_ilst04 {
	0% {opacity: 0; transform: translateX(-50%) rotate(2deg);}
	40% {opacity: 0; transform: translateX(-50%) rotate(2deg);}
	60% {opacity: 1; transform: translateX(-50%) rotate(0);}
	100% {opacity: 1; transform: translateX(-50%) rotate(0);}
}
/* メインコピー */
section#main.animated h1 span.a1 {
	display: inline-block;
	animation: main_ttl1 2.4s;
}
@keyframes main_ttl1 {
	0% {opacity: 0; transform: translateY(30px);}
	70% {opacity: 0; transform: translateY(30px);}
	100% {opacity: 1; transform: translateY(0);}
}
section#main.animated h1 span.a2 {
	display: inline-block;
	animation: main_ttl2 2.4s;
}
@keyframes main_ttl2 {
	0% {opacity: 0; transform: translateY(30px);}
	80% {opacity: 0; transform: translateY(30px);}
	100% {opacity: 1; transform: translateY(0);}
}
/* セカンドコピー */
section#main .ttl {
	display: inline-block;
	padding: 10px 15px;
	color: #fff;
	font-size: 34px;
	font-weight: 700;
	line-height: 1.4;
	position: relative;
	z-index: 2;
}
section#main.animated .ttl {
	animation: main_ttl_2nd 2.5s;
}
@keyframes main_ttl_2nd {
	0% {opacity: 0;}
	80% {opacity: 0;}
	100% {opacity: 1; transform: translateY(0);}
}
section#main .ttl::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #129105;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
}
section#main.animated .ttl::before {
	animation: main_ttl_2nd_bf 2.5s;
}
@keyframes main_ttl_2nd_bf {
	0% {opacity: 0; width: 0;}
	80% {opacity: 0; width: 0;}
	100% {opacity: 1; width: 100%;}
}
section#main .ttl span {
	position: relative;
	z-index: 2;
}
section#main.animated .ttl + p {
	animation: main_ttl_2nd_p 2.6s;
}
@keyframes main_ttl_2nd_p {
	0% {opacity: 0;}
	80% {opacity: 0;}
	100% {opacity: 1;}
}

/* NEWS -------------------------*/
section#main .news {
	padding: 20px 30px;
	border-radius: 20px;
	background: #fff;
}
section#main .news .day {
	display: inline-block;
}
/* TOPICS ------------------------------------------------------------------------*/
section#top_topics {
	padding: 0 0 60px!important;
}
section#top_topics .txt {
	width: calc(100% - 60px);
	padding-right: 60px;
	color: #52c64b;
	font-size: 110px;
	font-family: "futura-pt", sans-serif;
	font-weight: 500;
	text-align: right;
	line-height: 1;
}
section#top_topics .txt span {
	position: relative;
}
section#top_topics .txt span::before {
	content: "";
	display: block;
	height: calc(100% + 20px);
	background: #52c64b;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	z-index: 2;
}
section#top_topics .txt.animated span::before {
	animation: working_sdgs .6s;
}
@keyframes working_sdgs {
	0% {opacity: 1; width: 100%;}
	100% {opacity: 0; width: 0;}
}
section#top_topics .ttl_btn {
	width: 75%;
	margin: 0 0 30px auto;
}
section#top_topics .scroll {
	display: block;
	width: 75%;
	margin: 0 0 60px auto;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
	padding: 0 0 20px;
}
section#top_topics .scroll::-webkit-scrollbar {
	height: 12px;
}
section#top_topics .scroll::-webkit-scrollbar-track {
	margin: 0 2px;
	background: #efefef;
	border-radius: 5px;
}
section#top_topics .scroll::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background: #ccc;
}
section#top_topics .scroll .row {
	min-width: 2310px;
}
section#top_topics .article {
	display: block;
	width: 360px;
}
section#top_topics .article .img {
	display: block;
	width: 360px;
	height: 360px;
	border-radius: 10px;
	overflow: hidden;
}
section#top_topics .article .img img {
	height: 100%!important;
	object-fit: cover;
}
.cate {
	display: inline-block;
	padding: 6px 15px;
	border-radius: 20px;
	background: #52c64b;
	color: #fff!important;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none!important;
}
/* Work style --------------------------------------------------------------------*/
section#top_workstyle {
	padding: 120px 0!important;
	background: linear-gradient(to right, #f0f7f0 0%, #fff 100%);
}
section#top_workstyle .col2 .img {
	position: relative;
}
section#top_workstyle .col2 .img img {
	width: calc(100% - 100px);
	max-width: 960px;
}
section#top_workstyle .col2 .img img[class^="ilst0"] {
	position: absolute;
	top: 0;
	left: 0;
}
section#top_workstyle .col2 .img.animated img.ilst01 {
	animation: ws_ilst01 .8s;
}
@keyframes ws_ilst01 {
	0% {opacity: 0; transform: translateX(-30px);}
	50% {opacity: 0; transform: translateX(-30px);}
	100% {opacity: 1; transform: translateX(0);}
}
section#top_workstyle .col2 .img.animated img.ilst02 {
	animation: ws_ilst02 1.2s;
}
@keyframes ws_ilst02 {
	0% {opacity: 0; transform: translateX(-30px);}
	50% {opacity: 0; transform: translateX(-30px);}
	100% {opacity: 1; transform: translateX(0);}
}

/* Our service -------------------------------------------------------------------*/
section#top_service {
	padding: 120px 0!important;
}
section#top_service::before {
	content: "";
	display: block;
	width: 35%;
	height: 78%;
	background: linear-gradient(to right, #fff 0%, #ddeddd 100%);
	position: absolute;
	top: 0;
	right: 0;
}
section#top_service .txt {
	width: calc(100% - 730px - 60px);
	position: relative;
	z-index: 2;
}
/* 管注くん */
.kanchu {
	width: calc(730px - 60px);
	padding: 30px;
	border-radius: 20px;
	background: #129105;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
	position: relative;
	z-index: 2;
}
.kanchu .bg_white {
	width: calc(50% + 30px - 40px);
	padding: 20px 20px 0;
	border-radius: 15px;
	background: #fff;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.1);
	position: relative;
	z-index: 2;
}
.kanchu .bg_white a {
	display: block;
}
.kanchu .ttl {
	padding-left: 90px;
	line-height: 1.6;
	position: relative;
}
.kanchu .ttl::before {
	content: "";
	display: block;
	width: 70px;
	height: 70px;
	background: url("../img/icon_kanchu.png") center center / contain no-repeat;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.kanchu .ttl span {
	display: inline-block;
	padding: 5px 10px;
	border: 1px #4e4c4d solid;
	border-radius: 30px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
}
.kanchu .app_txt {
	width: calc(50% - 30px - 40px);
	padding: 40px 20px;
	border-radius: 0 15px 15px 0;
	background: #047223;
	color: #fff;
	box-shadow: 10px 10px 10px rgba(0,0,0,0.1);
	position: relative;
	z-index: 1;
}
.kanchu .app_txt .border {
	border-bottom: 1px #fff solid;
}
section#top_service a.bana {
	display: block;
	position: relative;
	z-index: 2;
	filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.1));
}
/* ウィステリフォーム ---------------------------------------------------------------*/
section#wisteria {
	padding: 0 0 60px!important;
}
section#wisteria.round_bg::before {
	height: 920px;
	background: #f1f0f2 url("../img/bg_dot.png") left top / 35px repeat;
}
section#wisteria .img {
	width: calc(100% - 300px);
	border-radius: 0 20px 20px 0;
	overflow: hidden;
	position: relative;
	z-index: 2;
}
section#wisteria .z2 {
	padding: 100px 0 0;
	position: relative;
	z-index: 2;
}
section#wisteria .ttl {
	padding-bottom: 30px;
	font-weight: 900;
	text-align: center;
	line-height: 1;
	letter-spacing: 0.1em;
	position: relative;
}
section#wisteria .ttl::after {
	content: "";
	display: block;
	width: 120px;
	border-bottom: 2px #143666 solid;
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
}
section#wisteria .col3 {
	width: calc(100% / 3 - 60px - 20px);
	padding: 30px;
	border-radius: 20px;
	background: #fff;
}
section#wisteria .col3 .num {
	color: #a09bd8;
	line-height: 0.8;
}
section#wisteria .btn {
	background: #143666;
}
/* About us ---------------------------------------------------------------------*/
section#top_about .col4 {
	display: block;
	width: calc(100% / 4 - 15px - 60px);
	padding: 30px;
	border-radius: 20px;
	position: relative;
}
section#top_about .col4:hover {
	filter: brightness(1.02);
}
section#top_about .col4::after {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #f7f7f7 url("../img/icon_arrow.png") center center / 15px no-repeat;
	position: absolute;
	right: 15px;
	bottom: 15px;
}
section#top_about .col4 h2 {
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0.1em;
}
section#top_about .col4 h2 span {
	display: block;
	margin: 0 0 10px 0;
	color: #4e4c4d;
	font-weight: 500;
	letter-spacing: 0;
}
section#top_about .col4 img {
	width: 60%;
	transition: all .3s;
}
section#top_about .col4:hover img {
	transform: scale(1.03);
}
/* 採用情報 -----------------------------------------------------------------------*/
section#top_recruit {
	padding: 120px 0!important;
}
section#top_recruit a {
	display: block;
	padding: 40px;
	border-radius: 20px;
	background: #f4f4e9;
	position: relative;
}
section#top_recruit a::after {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #fff url("../img/icon_arrow.png") center center / 15px no-repeat;
	position: absolute;
	right: 20px;
	bottom: 20px;
}
section#top_recruit a:hover {
	filter: none;
	background: #f8f8f2;
}
section#top_recruit a h2 {
	color: #e0c12b;
	letter-spacing: 0.05em;
}
section#top_recruit a h2 span {
	display: block;
	margin: 0 0 15px 0;
	color: #4e4c4d;
	font-weight: 400;
	letter-spacing: 0;
}
section#top_recruit a .img {
	width: 260px;
	position: absolute;
	right: 50px;
	bottom: -30px;
}
section#top_recruit a .img.animated {
	animation: rec_ilst 2s;
}
@keyframes rec_ilst {
	0% {transform: translateY(0);}
	65% {transform: translateY(0);}
	75% {transform: translateY(-20px);}
	85% {transform: translateY(0);}
	100% {transform: translateY(0);}
}
section#top_recruit a .img img {
	transition: all .3s;
}
section#top_recruit a:hover .img img {
	transform: scale(1.03) translateY(-10px);;
}
/*==================================================================================
下層ページ共通
==================================================================================*/
section#top_2nd {
	padding: 120px 0!important;
	background: linear-gradient(to right, #f0f7f0 0%, #fff 100%);
	box-shadow: 0 -5px 10px rgba(0,0,0,0.1) inset;
}
section#top_2nd .container {
	position: relative;
}
section#top_2nd .container::after {
	content: "";
	display: block;
	width: 160px;
	height: 160px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}
section#top_2nd.company .container::after {
	background-image: url("../img/icon_company.png");
}
section#top_2nd.service .container::after {
	background-image: url("../img/icon_service.png");
}
section#top_2nd.workstyle .container::after {
	width: 240px;
	height: 240px;
	background-image: url("../img/icon_workstyle.png");
}
section#top_2nd.products .container::after {
	background-image: url("../img/icon_products.png");
}
section#top_2nd.recruit .container::after {
	width: 200px;
	height: 200px;
	background-image: url("../img/icon_recruit.png");
}
section#top_2nd.topics .container::after {
	width: 240px;
	height: 240px;
	background-image: url("../img/icon_topics.png");
}
section#top_2nd.not404 .container::after {
	background-image: url("../img/icon_404.png");
}
section#top_2nd.contact .container::after {
	background-image: url("../img/icon_contact.png");
}
section#top_2nd ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
} 
section#top_2nd ul li {
	margin: 0 15px 10px 0;
	padding-right: 15px;
	position: relative;
} 
section#top_2nd ul li::after {
	content: "/";
	display: block;
	color: #969696;
	font-size: 14px;
	position: absolute;
	top: 0;
	right: 0;
} 
section#top_2nd ul li:last-child::after {
	display: none;
} 
section#top_2nd ul li a {
	display: block;
	color: #969696;
	font-size: 14px;
} 
/*==================================================================================
会社案内
==================================================================================*/
section#message .img {
	border-radius: 20px;
	overflow: hidden;
}
section#message .img img {
	height: 100%;
	object-fit: cover;
}
/* 経営理念 ------------------------------------------------------------------------*/
section#motto.round_bg::before {
	height: calc(100% + 120px);
}
section#motto ul li {
	display: flex;
	align-items: center;
	width: calc(100% - 60px);
	height: calc(100px - 40px);
	padding: 20px 30px;
	border-radius: 20px;
	background: #fff;
}
section#motto ul li p {
	padding-left: 70px;
	position: relative;
}
section#motto ul li p span {
	color: #52c64b;
	line-height: 1;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-60%);
}
/* イトウの求める人物像 ----------------------------------------------------------------*/
section#wanted {
	padding: 120px 0!important;
}
section#wanted.round_bg::before {
	height: 100%;
	background: #eff4ef;
}
section#wanted .container {
	position: relative;
	z-index: 2;
}
.point_boad {
	padding: 40px 30px 40px 160px;
	border-radius: 20px;
	background: #fff;
	position: relative;
}
.point_boad .ttl {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-content: center;
	width: 160px;
	height: 70px;
	background: #52c64b;
	color: #fff;
	text-align: center;
	line-height: 1.4;
	position: absolute;
	top: 30px;
	left: -30px;
}
.point_boad .ttl::after {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
.point_boad .ttl.animated::after {
	animation: point_ttl .6s;
}
@keyframes point_ttl {
	0% {opacity: 1; width: 100%;}
	100% {opacity: 0; width: 0;}
}
.point_boad .ttl span {
	display: block;
	width: 100%;
	font-size: 28px;
}
/* 会社概要 -----------------------------------------------------------------------*/
table.company_info {
	width: 100%;
	line-height: 1.4;
}
table.company_info tr {
	border-bottom: 1px #4e4c4d solid;
}
table.company_info tr:last-child {
	border: none;
}
table.company_info th {
	padding: 20px;
	color: #969696;
	font-weight: 400;
	text-align: left;
}
table.company_info td {
	padding: 20px;
	line-height: 1.4;
}
section#company table.company_info {
	font-size: 18px;
}
section#company table.company_info th {
	width: calc(120px - 40px);
}
/* 沿革 ---------------------------------------------------------------------------*/
section#history {
	padding: 120px 0!important;
}
section#history table.company_info th {
	width: 200px;
}
/* 拠点のご案内バナー */
section#bnr a {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 360px;
	border-radius: 20px;
	overflow: hidden;
	position: relative;
}
section#bnr a img {
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	filter: brightness(0.5);
}
section#bnr a h3 {
	color: #fff;
	text-align: center;
	position: relative;
	z-index: 2;
}
/* 拠点案内 -----------------------------------------------------------------------*/
section#base .top_img {
	width: 100%;
	height: 300px;
	border-radius: 20px;
	overflow: hidden;
}
section#base .top_img img {
	height: 100%;
	object-fit: cover;
}
/* SDGs --------------------------------------------------------------------------*/
section#sdgs_top .top_img {
	width: 100%;
	height: 400px;
	border-radius: 20px;
	overflow: hidden;
}
section#sdgs_top .top_img img {
	height: 100%;
	object-fit: cover;
}
section#sdgs_rules.round_bg::before {
	height: calc(100% + 120px);
	background: #eff4ef;
}
section#sdgs_list .col2.img {
	height: 500px;
	border-radius: 20px;
	overflow: hidden;
}
section#sdgs_list .col2.img img {
	height: 100%;
	object-fit: cover;
}
section#sdgs_list .col2 .txt {
	padding: 0 60px;
}
section#sdgs_topics .txt {
	width: calc(100% - 60px);
	padding-right: 60px;
	color: #52c64b;
	font-size: 110px;
	font-family: "futura-pt", sans-serif;
	font-weight: 500;
	text-align: right;
	line-height: 1;
}
section#sdgs_topics .txt span {
	position: relative;
}
section#sdgs_topics .txt span::before {
	content: "";
	display: block;
	height: calc(100% + 20px);
	background: #52c64b;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	z-index: 2;
}
section#sdgs_topics .txt.animated span::before {
	animation: working_sdgs .6s;
}

/*==================================================================================
事業案内
==================================================================================*/
section#service .col2.img {
	height: 500px;
	border-radius: 20px;
	overflow: hidden;
}
section#service .col2.img img {
	height: 100%;
	object-fit: cover;
}
section#service .col2 .txt {
	padding: 0 60px;
}
/* 菅中くん */
section#kanchu {
	padding: 120px 0 0!important;
}
section#kanchu.round_bg::before {
	height: calc(100% - 120px);
	background: #eff4ef;
	top: 0;
	bottom: auto;
}
section#kanchu .txt {
	width: calc(100% - 730px - 60px);
}
/* 管材DEPO */
section#kanzai_depo {
	padding: 120px 0 0!important;
}
section#kanzai_depo.round_bg::before {
	height: calc(100% - 200px);
	top: 0;
	bottom: auto;
}
section#kanzai_depo .col2 .txt {
	width: calc(100% - 60px);
}
section#kanzai_depo .col2.img {
	height: 500px;
	border-radius: 20px;
	overflow: hidden;
}
section#kanzai_depo .col2.img img {
	height: 100%;
	object-fit: cover;
}
section#kanzai_depo .boad {
	width: calc(50% - 60px + 60px);
	margin-top: -260px;
	padding: 20px 30px 30px;
	border-radius: 20px;
	background: #fff;
}
section#kanzai_depo .boad .ttl span {
	display: inline-block;
	margin-bottom: 10px;
	padding: 5px 10px;
	border: 1px #4e4c4d solid;
	border-radius: 30px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
}
section#kanzai_depo .boad .btn {
	background: #143666;
}
/* イトウのこれから ----------------------------------------------------------------*/
section#prospect .top_img {
	width: 100%;
	height: 540px;
	border-radius: 20px;
	overflow: hidden;
}
section#prospect .top_img img {
	height: 100%;
	object-fit: cover;
}
section#prospect .prospect {
	padding: 20px;
	border-radius: 20px;
	background: #f7f7f7;
}
/*==================================================================================
仕事スタイル
==================================================================================*/
section#workstyle .col2.img {
	height: 500px;
	border-radius: 20px;
	overflow: hidden;
}
section#workstyle .col2.img img {
	height: 100%;
	object-fit: cover;
}
section#workstyle .col2 .txt {
	padding: 0 60px;
}
/* 福利厚生 */
section#benefit {
	padding: 120px 0!important;
}
section#benefit.round_bg::before {
	background: #eff4ef;
}
section#benefit .img {
	border-radius: 20px;
	overflow: hidden;
}
section#benefit .bene01 {
	width: calc(100% - 300px);
}
/*==================================================================================
取扱商品
==================================================================================*/
section[id^="products"] .img {
	border: 1px #4e4c4d solid;
	border-radius: 20px;
	overflow: hidden;
}
table.products_list {
	width: 100%;
}
table.products_list tr {
	border-bottom: 1px #c6c6c6 solid;
}
table.products_list tr:last-child {
	border-bottom: none;
}
table.products_list th {
	width: 300px;
	padding: 20px 0;
	text-align: left;
	vertical-align: middle;
}
table.products_list td {
	padding: 20px 0;
}
/*==================================================================================
採用情報
==================================================================================*/
section#job_list ul {
	display: flex;
	justify-content: flex-end;
	width: 100%;
}
section#job_list ul li {
	margin-left: 30px;
}
section#job_list ul li a {
	display: block;
	width: calc(180px - 60px);
	padding: 10px 30px;
	border-radius: 50px;
	background: #f7f7f7;
	font-size: 16px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.05em;
	position: relative;
}
section#job_list ul li a::after {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-right: 1px #4e4c4d solid;
	border-bottom: 1px #4e4c4d solid;
	position: absolute;
	top: 50%;
	right: 20px;
	transform: rotate(45deg) translateY(-50%);
}
section#job_list ul li a.on {
	background: #129105;
	color: #fff;
}
section#job_list ul li a.on::after {
	border-right: 1px #fff solid;
	border-bottom: 1px #fff solid;
}
section#job_top .img {
	max-height: 840px;
	border-radius: 20px;
	overflow: hidden;
}
section#job_top .img img {
	height: 100%;
	min-height: 680px;
	object-fit: cover;
}
/* 主な仕事内容 */
section#job_about.round_bg::before {
	height: calc(100% - 180px);
	top: 0;
	bottom: auto;
}
section#job_about table {
	width: 100%;
}
section#job_about table tr {
	border-bottom: 1px #c6c6c6 solid;
}
section#job_about table tr:last-child {
	border-bottom: none;
}
section#job_about table th {
	width: 240px;
	padding: 20px 0;
	text-align: left;
	vertical-align: top;
}
section#job_about table td {
	padding: 20px 0;
}
section#job_about .img {
	height: 680px;
	border-radius: 20px;
	overflow: hidden;
}
section#job_about .img img {
	height: 100%;
	object-fit: cover;
}
/* ポイント */
section#job_point.round_bg::before {
	background: #eff4ef;
}
/* 募集要項 */
section#job_style table {
	width: 100%;
}
section#job_style table tr {
	border-bottom: 1px #c6c6c6 solid;
}
section#job_style table tr:last-child {
	border-bottom: none;
}
section#job_style table th {
	width: 160px;
	padding: 20px 0;
	color: #969696;
	text-align: left;
	vertical-align: top;
}
section#job_style table td {
	padding: 20px 0;
}

/*==================================================================================
TOPICS
==================================================================================*/
section#topics .article_list {
	width: calc(100% - 180px - 60px);
}
section#topics .sideber {
	width: calc(180px - 31px);
	padding-left: 30px;
	border-left: 1px #c6c6c6 solid;
}
section#topics .article {
	display: block;
	width: calc(50% - 30px);
	margin-bottom: 40px;
}
section#topics .article .img {
	display: block;
	width: 100%;
	height: 300px;
	border-radius: 10px;
	overflow: hidden;
}
section#topics .article .img img {
	width: 100%!important;
	max-width: 100%!important;
	height: 100%!important;
	object-fit: cover;
}
.archive_list a {
	color: #969696;
}
/*==================================================================================
NEWS
==================================================================================*/
section#news article {
	padding-bottom: 20px;
	border-bottom: 1px #c6c6c6 solid;
}
section#news article:last-child {
	padding-bottom: 0;
	border-bottom: none;
}
/*==================================================================================
お問い合わせ
==================================================================================*/
section#contact {
	padding: 120px 0!important;
}
/*==================================================================================
社長のつぶやき
==================================================================================*/
section#tweet .article {
	display: block;
	width: calc(100% / 3 - 15px);
	margin-bottom: 40px;
}
section#tweet .article .img {
	display: block;
	width: 100%;
	height: 300px;
	border-radius: 10px;
	overflow: hidden;
}
section#tweet .article .img img {
	width: 100%!important;
	max-width: 100%!important;
	height: 100%!important;
	object-fit: cover;
}

/*==================================================================================
フッター
==================================================================================*/
footer {
	padding-top: 30px!important;
	border-top: 1px #c6c6c6 solid!important;
}
footer h3 {
	text-align: center;
}
/* お問い合わせ */
footer .contact {
	padding: 30px 0;
	background: #f7f7f7;
}
footer .contact .btn {
	margin-right: 60px;
}
footer .contact .tel {
	padding-left: 60px;
	border-left: 1px #c6c6c6 solid;
}
footer .contact .tel p {
	padding-left: 40px;
	position: relative;
}
footer .contact .tel p::before {
	content: "";
	display: block;
	width: 30px;
	height: 30px;
	background: url("../img/icon_tel.png") center / contain no-repeat;
	position: absolute;
	top: 0;
	left: 0;
}
footer .contact .tel p span {
	font-size: 40px;
	line-height: 0.7;
}
/* ------ */
footer .info a {
	text-decoration: underline;
}
footer ul.foot_nav {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	width: 450px;
}
footer ul.foot_nav li {
	margin: 0 0 20px 30px;
}
footer ul.foot_nav li a {
	display: block;
}
/* ------ */
footer .bg_green {
	padding: 15px 0;
	background: #129105;
	color: #fff;
}
footer .bg_green ul li:first-child {
	margin-right: 30px;
	padding-right: 30px;
	border-right: 1px #fff solid;
}
footer .bg_green ul li a {
	color: #fff;
	text-decoration: underline;
}


/* ページトップへ戻るボタン */
.btn_pagetop {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(0,0,0,0.1);
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 100;
}
.btn_pagetop img {
	width: 15px;
	transform: rotate(-90deg);
}



.tb {display: none;}
.pc {display: inline;}
.sp {display: none;}

@media screen and (max-width : 1200px) {
	/*==================================================================================
	ヘッダー
	==================================================================================*/
	header .container {
		width: calc(100% - 40px);
		padding: 0 20px;
	}
	/*==================================================================================
	共通
	==================================================================================*/
	.round_bg::before {
		width: calc(100% - 30px);
	}
	/* フォント */
	h1 {
		font-size: 60px;
	}
	/*==================================================================================
	INDEX
	==================================================================================*/
	section#main .img {
		margin: -60px auto -40px;
		padding: 60px;
	}
	section#main .img img[class^="ilst0"] {
		top: 60px;
	}
	/* TOPICS ------------------------------------------------------------------------*/
	section#top_topics .ttl_btn {
		width: 85%;
	}
	section#top_topics .scroll {
		width: 85%;
	}
	section#top_topics .scroll .row {
		min-width: 1710px;
	}
	section#top_topics .article {
		width: 260px;
	}
	section#top_topics .article .img {
		width: 260px;
		height: 260px;
	}
	.cate {
		font-size: 10px;
	}
	/* Our service -------------------------------------------------------------------*/
	section#top_service::before {
		width: 45%;
		height: 85%;
	}
	section#top_service .txt {
		width: 100%;
		max-width: 680px;
		margin: 0 auto 60px;
	}
	/* 管注くん */
	.kanchu {
		margin: 0 auto;
	}
	/* ウィステリフォーム ---------------------------------------------------------------*/
	section#wisteria .img {
		width: calc(100% - 120px);
	}
	/* About us ---------------------------------------------------------------------*/
	section#top_about .col4 h2 span {
		font-size: 28px;
	}
	/*==================================================================================
	事業案内
	==================================================================================*/
	/* 菅中くん */
	section#kanchu .txt {
		width: 100%;
		max-width: 680px;
		margin: 0 auto 30px;
	}
}



@media screen and (max-width : 960px) {
	.pc {display: none;}
	.tb {display: inline;}
	
	p { font-size: 14px; }
	
	/*==================================================================================
	ヘッダー
	==================================================================================*/
	header {
		padding: 20px 0!important;
	}
	header .logo {
		width: 180px;
	}
	/* スマホ版 メニュー -----------------------*/
	nav.gnav {
	    z-index: 888;
	    width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.6);
		opacity: 0;
		visibility: hidden;
		transition: all 0.3s;
	    position: fixed;
	    top: 0;
	    left: 0;
	}
	nav.gnav.active {
	    opacity: 1;
		visibility: visible;
	}
	nav.gnav ul {
		display: block;
	    width: calc(100% - 40px);
		padding: 40px 20px;
	    background: #f7f7f7;
	}
	nav.gnav ul li {
		display: block;
	    width: 100%;
		max-width: 460px;
		margin: 0 auto;
	    border-bottom: 1px dotted #ccc;
	}
	/* 最後はラインを描かない */
	nav.gnav ul li:last-child {
		margin-top: 20px;
	    padding-bottom: 0;
	    border-bottom: none;
	}
	nav.gnav ul li a {
	    display: block;
		padding: 20px;
	}
	nav.gnav ul li a.btn {
		width: 100%;
		max-width: 100%;
		height: 50px;
		padding: 0;
	}
	/* バーガー */
	.gnavToggle {
	    z-index: 999;
	    display: flex;
		flex-wrap: wrap;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	    width: 42px;
	    height: 42px;
	    text-align: center;
	    cursor: pointer;
	    position: fixed;    /* bodyに対しての絶対位置指定 */
	    right: 15px;
	    top: 15px;
	}
	.gnavToggle span {
	    display: block;
	    width: 100%;
		margin-bottom: 5px;
	    border-bottom: solid 3px #129105;
	    -webkit-transition: .35s ease-in-out;
	    -moz-transition: .35s ease-in-out;
	    transition: .35s ease-in-out;
	}
	.gnavToggle.active span:nth-child(1) {
	    transform: translateY(8px) rotate(-20deg);
	}
	.gnavToggle.active span:nth-child(2) {
		opacity: 0;
	}
	.gnavToggle.active span:nth-child(3) {
	    transform: translateY(-8px) rotate(20deg);
	}
	/*==================================================================================
	共通
	==================================================================================*/
	/* レイアウト */
	section {
		padding: 40px 0!important;
	}
	.container {
		width: calc(100% - 40px);
		padding: 0 20px;
	}
	.max1200 {
		max-width: 680px;
	}
	.max960 {
		max-width: 540px;
	}
	.col2.pd30 {
		width: calc(50% - 10px);
	}
	.col2.pd60 {
		width: calc(50% - 15px);
	}
	.col3 {
		width: calc(50% - 15px);
	}
	.tb_100 {
		width: 100%!important;
	}
	.tb_max680 {
		max-width: 680px;
		margin: auto;
	}
	.tb_row {
		display: flex;
		flex-wrap: wrap;
	}
	.tb_row.just_center {
		justify-content: center;
	}
	.order2 {
		order: 2;
	}
	.mb_10 {
		margin-bottom: 8px;
	}
	.mb_20 {
		margin-bottom: 15px;
	}
	.mb_30 {
		margin-bottom: 20px;
	}
	.mb_60 {
		margin-bottom: 40px;
	}
	.mb_120 {
		margin-bottom: 80px;
	}
	.tb_mb_30 {
		margin-bottom: 30px;
	}
	.round_bg::before {
		width: 100%;
		border-radius: 0;
	}
	.round_bg.right::before {
		border-radius: 0;
	}
	/* フォント */
	h1 {
		font-size: 46px;
		line-height: 1.2;
	}
	h2 {
		font-size: 30px;
		letter-spacing: 0.05em;
	}
	h2 span {
		margin-left: 15px;
	}
	h2.eng {
		padding-left: 26px;
		font-size: 16px;
	}
	h2.eng::before {
		width: 12px;
		height: 12px;
	}
	h3 {
		font-size: 24px;
	}
	h3 span {
		margin-bottom: 8px;
		font-size: 14px;
	}
	h3.second {
		padding-left: 30px;
	}
	h3.second::before {
		width: 18px;
		height: 18px;
	}
	h4 {
		padding-bottom: 10px!important;
		font-size: 20px;
	}
	h4::after {
		border-bottom-width: 3px;
	}
	.font_12 {
		font-size: 10px;
	}
	.font_14 {
		font-size: 12px;
	}
	.font_18 {
		font-size: 16px;
	}
	.font_20 {
		font-size: 18px;
	}
	.font_24 {
		font-size: 20px;
		line-height: 1.2;
	}
	.font_24.sp_font_16 {
		font-size: 16px;
		line-height: 1.2;
	}
	.font_34 {
		font-size: 24px;
	}
	.font_46 {
		font-size: 30px;
	}
	.font_60 {
		font-size: 36px;
	}
	.line2 {
		line-height: 1.8!important;
	}
	/* ボタン */
	.btn {
		max-width: 300px;
		height: 50px;
		font-size: 16px;
	}
	.btn_detail {
		padding: 8px 15px;
	}
	.btn_detail span {
		padding-right: 40px;
		background-size: 14px;
	}

	/*==================================================================================
	INDEX
	==================================================================================*/
	section#main {
		padding: 60px 0 30px!important;
	}
	section#main .container {
		width: 100%;
		padding: 0!important;
	}
	section#main .inner {
		padding: 0 20px;
	}
	section#main .img {
		margin: -40px auto -20px;
		padding: 40px 20px;
	}
	section#main .img::before { 
		background-size: 20px;
		border-radius: 0;
	}
	section#main .img img[class^="ilst0"] {
		width: calc(100% - 40px);
		top: 40px;
	}
	section#main .ttl {
		font-size: 24px;
	}
	/* NEWS -------------------------*/
	section#main .news {
		display: block;
		padding: 15px 20px;
		border-radius: 15px;
	}
	section#main .news h2 {
		margin-bottom: 15px;
	}
	/* TOPICS ------------------------------------------------------------------------*/
	section#top_topics {
		padding: 0 0 30px!important;
	}
	section#top_topics .txt {
		width: calc(100% - 20px);
		padding-right: 20px;
		font-size: 80px;
	}
	section#top_topics .ttl_btn {
		width: 100%;
		margin: 0 0 20px;
	}
	section#top_topics .scroll {
		width: 100%;
		padding: 0 0 10px;
		position: relative;
	}
	section#top_topics .scroll::-webkit-scrollbar {
		height: 6px;
	}
	section#top_topics .scroll .row {
		min-width: 1300px;
	}
	section#top_topics .article {
		width: 200px;
	}
	section#top_topics .article .img {
		width: 200px;
		height: 200px;
	}
	/* Work style --------------------------------------------------------------------*/
	section#top_workstyle {
		padding: 60px 0!important;
	}
	section#top_workstyle .col2 img {
		width: 60%;
		min-width: 280px;
		margin: 0 auto 40px;
	}
	/* Our service -------------------------------------------------------------------*/
	section#top_service {
		padding: 60px 0!important;
	}
	section#top_service::before {
		height: 680px;
	}
	/* 管注くん */
	.kanchu {
		justify-content: center;
		width: calc(100% - 30px);
		max-width: 460px;
		margin: 0 auto;
		padding: 15px;
		border-radius: 15px;
	}
	.kanchu .bg_white {
		width: calc(100% - 40px);
		border-radius: 10px;
	}
	.kanchu .ttl {
		padding-left: 75px;
	}
	.kanchu .ttl::before {
		width: 60px;
		height: 60px;
	}
	.kanchu .ttl span {
		font-size: 14px;
	}
	.kanchu .bg_white .col2 {
		max-width: 160px;
	}
	.kanchu .app_txt {
		width: calc(100% - 30px - 20px);
		padding: 15px;
		border-radius: 0 0 10px 10px;
	}
	section#top_service .max960 {
		max-width: 100%;
	}
	/* ウィステリフォーム ---------------------------------------------------------------*/
	section#wisteria::before {
		height: 780px;
		background-size: 20px;
	}
	section#wisteria .img {
		width: calc(100% - 40px);
		border-radius: 0 15px 15px 0;
	}
	section#wisteria .z2 {
		padding: 60px 0 0;
	}
	section#wisteria .ttl {
		padding-bottom: 20px;
		line-height: 1;
	}
	section#wisteria .ttl::after {
		width: 80px;
	}
	section#wisteria .max960 {
		max-width: calc(100% - 20px);
	}
	section#wisteria .col3 {
		width: calc(100% / 3 - 40px - 6px);
		padding: 20px;
		border-radius: 15px;
	}
	/* About us ---------------------------------------------------------------------*/
	section#top_about .col4 {
		width: calc(100% / 2 - 10px - 40px);
		padding: 20px;
		border-radius: 15px;
	}
	section#top_about .col4 img {
		width: 55%;
		max-width: 120px;
	}
	/* 採用情報 -----------------------------------------------------------------------*/
	section#top_recruit {
		padding: 80px 0!important;
	}
	section#top_recruit .max960 {
		max-width: 680px;
	}
	section#top_recruit a {
		padding: 20px 240px 20px 20px;
		border-radius: 15px;
	}
	section#top_recruit a .img {
		width: 180px;
		bottom: -20px;
	}
	/*==================================================================================
	下層ページ共通
	==================================================================================*/
	section#top_2nd {
		padding: 60px 0!important;
		box-shadow: 0 -3px 6px rgba(0,0,0,0.1) inset;
	}
	section#top_2nd .container {
		width: calc(100% - 180px);
		max-width: calc(680px - 140px);
		padding: 0 160px 0 20px;
	}
	section#top_2nd .container::after {
		width: 80px;
		height: 80px;
		background-position: center bottom;
	}
	section#top_2nd.workstyle .container::after {
		width: 120px;
		height: 120px;
	}
	section#top_2nd.recruit .container::after {
		width: 100px;
		height: 100px;
	}
	section#top_2nd.topics .container::after {
		width: 120px;
		height: 120px;
	}
	section#top_2nd ul li {
		margin-right: 10px;
		padding-right: 10px;
	} 
	section#top_2nd ul li::after {
		font-size: 12px;
	} 
	section#top_2nd ul li a {
		font-size: 12px;
	} 
	/*==================================================================================
	会社案内
	==================================================================================*/
	section#message .img {
		height: 340px;
		border-radius: 15px;
	}
	/* 経営理念 ------------------------------------------------------------------------*/
	section#motto.round_bg::before {
		height: calc(100% + 60px);
	}
	section#motto ul li {
		display: block;
		width: calc(100% - 40px);
		height: auto;
		padding: 15px 20px;
		border-radius: 15px;
	}
	section#motto ul li p {
		padding-left: 50px;
	}
	section#motto ul li p span {
		top: -2px;
		transform: none;
	}
	/* イトウの求める人物像 ----------------------------------------------------------------*/
	section#wanted {
		padding: 60px 0!important;
	}
	section#wanted .max960 {
		max-width: 100%;
	}
	.point_boad {
		width: calc(100% - 150px - 20px);
		margin: 0 0 0 auto;
		padding: 30px 20px 30px 130px;
		border-radius: 15px;
	}
	.point_boad .ttl {
		width: 120px;
		height: 60px;
		top: 30px;
		left: -15px;
	}
	.point_boad .ttl span {
		font-size: 24px;
	}
	/* 会社概要 -----------------------------------------------------------------------*/
	table.company_info{
		font-size: 14px;
	}
	table.company_info th {
		padding: 15px 0;
	}
	table.company_info td {
		padding: 15px 0;
	}
	section#company table.company_info {
		font-size: 14px;
	}
	/* 沿革 ---------------------------------------------------------------------------*/
	section#history {
		padding: 60px 0!important;
	}
	section#history table.company_info th {
		display: block;
		width: 100%;
		padding: 10px 0 0;
	}
	section#history table.company_info td {
		display: block;
		width: 100%;
		padding: 0 0 10px;
	}
	/* 拠点のご案内バナー */
	section#bnr a {
		height: 200px;
		border-radius: 15px;
	}
	/* 拠点案内 -----------------------------------------------------------------------*/
	section#base .container.max1600 {
		width: 100%;
		padding: 0;
	}
	section#base .top_img {
		height: 200px;
		border-radius: 0;
	}
	/* SDGs --------------------------------------------------------------------------*/
	section#sdgs_top .container.max1600 {
		width: 100%;
		padding: 0;
	}
	section#sdgs_top .top_img {
		height: 200px;
		border-radius: 0;
	}
	section#sdgs_rules .max960 {
		max-width: 100%;
	}
	section#sdgs_list .container {
		max-width: 680px;
	}
	section#sdgs_list .col2.img {
		height: 340px;
		margin-bottom: 30px;
		border-radius: 15px;
	}
	section#sdgs_list .col2 .txt {
		width: calc(100% - 40px);
		padding: 0 20px;
	}
	section#sdgs_topics .txt {
		width: calc(100% - 20px);
		padding-right: 20px;
		font-size: 80px;
	}
	/*==================================================================================
	事業案内
	==================================================================================*/
	section#service .container.max1600 {
		max-width: 680px;
	}
	section#service .col2.img {
		height: 340px;
		margin-bottom: 30px;
		border-radius: 15px;
	}
	section#service .col2 .txt {
		width: calc(100% - 40px);
		padding: 0 20px;
	}
	/* 菅中くん */
	section#kanchu {
		padding: 60px 0 0!important;
	}
	section#kanchu.round_bg::before {
		height: calc(100% - 60px);
	}
	/* 管材DEPO */
	section#kanzai_depo {
		padding: 60px 0 0!important;
	}
	section#kanzai_depo.round_bg::before {
		height: calc(100% - 200px);
	}
	section#kanzai_depo .col2 .txt {
		width: 100%;
		margin-bottom: 20px;
	}
	section#kanzai_depo .col2.img {
		height: 240px;
		border-radius: 15px;
	}
	section#kanzai_depo .boad {
		width: calc(100% - 40px - 40px);
		max-width: calc(470px - 40px);
		margin: -60px 0 0 20px;
		padding: 15px 20px 15px;
		border-radius: 15px;
	}
	section#kanzai_depo .boad .ttl span {
		font-size: 14px;
	}
	/* イトウのこれから ----------------------------------------------------------------*/
	section#prospect .container.max1600 {
		width: 100%;
		padding: 0;
	}
	section#prospect .top_img {
		height: 300px;
		border-radius: 0;
	}
	section#prospect .prospect {
		border-radius: 15px;
	}
	/*==================================================================================
	仕事スタイル
	==================================================================================*/
	section#workstyle .container.max1600 {
		max-width: 680px;
	}
	section#workstyle .col2.img {
		height: 340px;
		margin-bottom: 30px;
		border-radius: 15px;
	}
	section#workstyle .col2 .txt {
		width: calc(100% - 40px);
		padding: 0 20px;
	}
	/* 福利厚生 */
	section#benefit {
		padding: 60px 0!important;
	}
	section#benefit .img {
		border-radius: 15px;
	}
	section#benefit .bene01 {
		width: calc(100% - 180px);
	}
	/*==================================================================================
	取扱商品
	==================================================================================*/
	section[id^="products"] .img {
		border-radius: 15px;
	}
	table.products_list th {
		display: block;
		width: 100%;
		padding: 15px 0 0;
	}
	table.products_list td {
		display: block;
		width: 100%;
		padding: 10px 0 15px;
	}
	/*==================================================================================
	採用情報
	==================================================================================*/
	section#job_list ul li {
		margin-left: 10px;
	}
	section#job_list ul li a {
		width: calc(140px - 60px);
		padding: 10px 20px;
		font-size: 14px;
	}
	section#job_list ul li a::after {
		width: 4px;
		height: 4px;
		right: 15px;
	}
	section#job_top .img {
		height: 300px;
		border-radius: 15px;
	}
	section#job_top .img img {
		min-height: 0;
	}
	/* 主な仕事内容 */
	section#job_about.round_bg::before {
		height: calc(100% - 120px);
	}
	section#job_about table th {
		display: block;
		width: 100%;
		padding: 15px 0 10px;
	}
	section#job_about table td {
		display: block;
		width: 100%;
		padding: 0 0 15px;
	}
	section#job_about .img {
		height: 460px;
		border-radius: 15px;
	}
	/* ポイント */
	section#job_point .container {
		max-width: 100%;
	}
	/* 募集要項 */
	section#job_style table th {
		width: 120px;
		padding: 15px 0;
	}
	section#job_style table td {
		padding: 15px 0;
	}
	/*==================================================================================
	TOPICS
	==================================================================================*/
	section#topics .article_list {
		width: 100%;
		margin-bottom: 40px;
	}
	section#topics .sideber {
		width: 100%;
		padding: 20px 0 0 0;
		border-left: none;
		border-top: 1px #c6c6c6 solid;
	}
	section#topics .article {
		width: calc(50% - 10px);
		margin-bottom: 30px;
	}
	section#topics .article .img {
		height: 240px;
	}
	/*==================================================================================
	お問い合わせ
	==================================================================================*/
	section#contact {
		padding: 60px 0!important;
	}
	/*==================================================================================
	社長のつぶやき
	==================================================================================*/
	section#tweet .article {
		width: calc(50% - 10px);
		margin-bottom: 30px;
	}
	section#tweet .article .img {
		height: 240px;
	}
	/*==================================================================================
	フッター
	==================================================================================*/
	footer {
		padding-top: 20px!important;
	}
	/* お問い合わせ */
	footer .contact {
		padding: 15px 0;
	}
	footer .contact .btn {
		margin-right: 30px;
	}
	footer .contact .tel {
		padding-left: 30px;
	}
	footer .contact .tel p {
		padding-left: 34px;
	}
	footer .contact .tel p::before {
		width: 24px;
		height: 24px;
		top: 2px;
	}
	footer .contact .tel p span {
		font-size: 34px;
	}
	/* ------ */
	footer .container.max960 {
		max-width: 680px;
	}
	footer .info {
		width: 100%;
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px #c6c6c6 solid;
	}
	footer ul.foot_nav {
		justify-content: flex-start;
		width: 100%;
	}
	footer ul.foot_nav li {
		margin: 0 20px 15px 0;
	}
	/* ------ */
	footer .bg_green {
		padding: 10px 0;
	}
	footer .bg_green ul {
		justify-content: flex-start;
		width: 100%;
		margin-bottom: 10px;
	}
	footer .bg_green ul li:first-child {
		margin-right: 20px;
		padding-right: 20px;
	}
	.btn_pagetop {
		display: none!important;
	}
}


@media screen and (max-width : 680px) {
	/*==================================================================================
	INDEX
	==================================================================================*/
	/* TOPICS ------------------------------------------------------------------------*/
	section#top_topics .txt {
		margin-bottom: 20px;
		font-size: 50px;
	}
	/* ウィステリフォーム ---------------------------------------------------------------*/
	section#wisteria::before {
		height: 900px;
	}
	section#wisteria .ttl {
		letter-spacing: 0;
	}
	section#wisteria .col3 {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		width: calc(100% - 40px);
		margin-bottom: 10px;
	}
	section#wisteria .col3 .num  {
		display: inline-block;
		margin: 0 15px 15px 0;
	}
	section#wisteria .col3 p.font_24  {
		display: inline-block;
		margin-bottom: 5px;
	}
	/*==================================================================================
	会社概要
	==================================================================================*/
	/* SDGs --------------------------------------------------------------------------*/
	section#sdgs_topics .txt {
		margin-bottom: 20px;
		font-size: 50px;
	}

	/*==================================================================================
	フッター
	==================================================================================*/
	/* お問い合わせ */
	footer .contact .container {
		max-width: 300px;
	}
	footer .contact .btn {
		margin: 0 auto 20px;
	}
	footer .contact .tel {
		width: 100%;
		padding: 20px 0 0;
		border-left: none;
		border-top: 1px #c6c6c6 solid;
	}
	footer .contact .tel p {
		padding-left: 34px;
	}
	footer .contact .tel p::before {
		width: 24px;
		height: 24px;
		top: 2px;
	}
	footer .contact .tel p span {
		font-size: 34px;
	}
}


@media screen and (max-width : 460px) {
	.tb {display: none;}
	.sp {display: inline;}
	p {font-size: 12px;}
	/*==================================================================================
	共通
	==================================================================================*/
	/* レイアウト */
	.col2.sp_100 {
		width: 100%;
	}
	.col2.pd30 {
		width: calc(50% - 5px);
	}
	.col2.pd30.sp_100 {
		width: 100%;
	}
	.sp_order2 {
		order: 2;
	}
	/* フォント */
	h1 {
		font-size: 40px;
	}
	h2 {
		font-size: 24px;
	}
	h3 {
		font-size: 20px;
	}
	h3 span {
		font-size: 12px;
	}
	h4 {
		font-size: 18px;
	}
	.font_18 {
		font-size: 14px;
	}
	.font_20 {
		font-size: 16px;
	}
	.font_24 {
		font-size: 18px;
	}
	.font_24.sp_font_16 {
		font-size: 14px;
	}
	.font_34 {
		font-size: 20px;
	}
	.font_46 {
		font-size: 26px;
	}
	.font_60 {
		font-size: 30px;
	}
	.line2 {
		line-height: 1.8;
	}
	/* ボタン */
	.btn {
		font-size: 14px;
		font-weight: 500;
	}
	/*==================================================================================
	INDEX
	==================================================================================*/
	section#main .ttl {
		padding: 8px 10px;
		font-size: 20px;
	}
	/* TOPICS ------------------------------------------------------------------------*/
	section#top_topics .txt {
		font-size: 40px;
	}
	/* Our service -------------------------------------------------------------------*/
	/* 管注くん */
	.kanchu .ttl span {
		font-size: 12px;
	}
	/* ウィステリフォーム ---------------------------------------------------------------*/
	section#wisteria::before {
		height: 900px;
	}
	section#wisteria .col3 .num  {
		margin: 0 15px 12px 0;
	}
	/* About us ---------------------------------------------------------------------*/
	section#top_about .col4::after {
		width: 34px;
		height: 34px;
		background-size: 12px;
	}
	section#top_about .col4 h2 span {
		font-size: 24px;
	}
	/* 採用情報 -----------------------------------------------------------------------*/
	section#top_recruit a {
		padding: 20px 20px 220px 20px;
	}
	section#top_recruit a::after {
		width: 34px;
		height: 34px;
		background-size: 12px;
	}
	section#top_recruit a .img {
		width: 180px;
		right: auto;
		left: 40px;
		bottom: -20px;
	}
	/*==================================================================================
	下層ページ共通
	==================================================================================*/
	section#top_2nd {
		padding: 40px 0!important;
	}
	section#top_2nd .container {
		width: calc(100% - 160px);
		max-width: calc(100% - 160px);
		padding: 0 140px 0 20px;
	}
	section#top_2nd .container::after {
		top: auto;
		bottom: 0;
		transform: none;
	}
	section#top_2nd.contact .container::after,
	section#top_2nd.privacy .container::after {
		bottom: -30px;
	}
	section#top_2nd h2 {
		margin-bottom: 30px;
	}
	section#top_2nd h2 span {
		display: block;
		margin: 5px 0 0;
		font-size: 18px;
	}
	section#top_2nd ul li {
		margin-right: 10px;
		padding-right: 10px;
	} 
	section#top_2nd ul li::after {
		font-size: 12px;
	} 
	section#top_2nd ul li a {
		font-size: 12px;
	} 
	/*==================================================================================
	会社案内
	==================================================================================*/
	/* 経営理念 ------------------------------------------------------------------------*/
	section#motto ul li {
		width: calc(100% - 30px);
		padding: 15px;
	}
	section#motto ul li p {
		padding-left: 34px;
	}
	/* イトウの求める人物像 ----------------------------------------------------------------*/
	.point_boad {
		width: calc(100% - 40px);
		padding: 15px 20px 20px;
	}
	.point_boad .ttl {
		display: inline-block;
		width: auto;
		height: auto;
		margin-bottom: 15px;
		padding: 2px 15px;
		text-align: left;
		position: relative;
		top: 0;
		left: -30px;
	}
	.point_boad .ttl span {
		display: inline-block;
		width: auto;
		margin-right: 10px;
		font-size: 20px;
	}
	/* 拠点のご案内バナー */
	section#bnr a {
		height: 140px;
	}
	/* 拠点案内 -----------------------------------------------------------------------*/
	section#base .top_img {
		height: 140px;
	}
	/* SDGs --------------------------------------------------------------------------*/
	section#sdgs_top .top_img {
		height: 140px;
	}
	section#sdgs_list .col2.img {
		height: 240px;
	}
	section#sdgs_topics .txt {
		font-size: 40px;
	}
	/*==================================================================================
	事業案内
	==================================================================================*/
	section#service .col2.img {
		height: 240px;
	}
	/* 管材DEPO */
	section#kanzai_depo .col2.img {
		height: 140px;
	}
	section#kanzai_depo .boad {
		margin-top: -40px;
	}
	section#kanzai_depo .boad .ttl span {
		font-size: 12px;
	}
	/* イトウのこれから ----------------------------------------------------------------*/
	section#prospect .container:first-child {
		width: 100%;
		max-width: 100%;
		padding: 0;
	}
	section#prospect .top_img {
		height: 140px;
	}
	/*==================================================================================
	仕事スタイル
	==================================================================================*/
	section#workstyle .col2.img {
		height: 240px;
	}
	/* 福利厚生 */
	section#benefit .link {
		width: 100%;
		margin-bottom: 30px;
	}
	section#benefit .bene01 {
		width: 100%;
	}
	/*==================================================================================
	採用情報
	==================================================================================*/
	section#job_list ul li a {
		width: calc(120px - 60px);
		padding: 8px 20px;
		font-size: 12px;
	}
	section#job_list ul li a::after {
		width: 3px;
		height: 3px;
	}
	/* 主な仕事内容 */
	section#job_about .img {
		height: 340px;
	}
	/* 募集要項 */
	section#job_style table th {
		width: 100px;
	}
	/*==================================================================================
	TOPICS
	==================================================================================*/
	section#topics .article {
		width: calc(50% - 5px);
		margin-bottom: 30px;
	}
	section#topics .article .img {
		height: 140px;
	}
	/*==================================================================================
	社長のつぶやき
	==================================================================================*/
	section#tweet .article {
		width: calc(50% - 5px);
		margin-bottom: 30px;
	}
	section#tweet .article .img {
		height: 140px;
	}
}