@media all and (min-width:1201px) {
	.contents--wrap img {
		width: 39.43%;
	}
}
.breadcrumb {background: #f5f5f5;}
.breadcrumb .container {
    width: 1200px;
    margin: 0 auto;
    padding: 0;
}

.sp-br {display: none;}
.site-body {position: relative;z-index: 1;}
.grid {
    display: flex;
    height: 100%;
    position: absolute;
    width: 1200px;
    margin: 0 auto;
    left: 0;
    justify-content: space-between;
    right: 0;
    z-index: -1;
}
.grid span {
    border-right: 1px solid #ededed;
    height: 100%;
    width: 1px;
}
.history__items div {background: #fff;}


.site-body {padding-top: 0px;padding-bottom: 0;}
.widewidth {width: 1200px;margin: 0 auto;}
.txt--center {text-align: center;}
.flex {display: flex;}
.block {display: block;}
/* ====================================================
  /* FONT FAMIRY
==================================================== */
.icon {position: relative;}
i {margin: 0;}
.fa-chevron-circle-right::before {
	letter-spacing: 0;
    content: "\f138";
    color: #fff;
    font-weight: 800;
    background: #0087c3;
    border-radius: 50%;
    padding: 2px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
}
.fa-chevron-circle-right:nth-of-type(2) {display: none;}
.fa-external-link-alt::before {
	margin-left: 8px;
    content: "\f35d";
    font-weight: 800;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    right: 8px;
}
.fa-external-link-alt::before {
	position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}
.KozukaB {
	font-family: kozuka-gothic-pr6n, sans-serif;
	font-weight: 700;
	font-style: normal;
}
.KozukaL {
	font-family: kozuka-gothic-pr6n, sans-serif;
	font-weight: 300;
	font-style: normal;
}
.KozukaM {
	font-family: kozuka-gothic-pr6n, sans-serif;
	font-weight: 600;
	font-style: normal;
}
.KozukaR {
	font-family: kozuka-gothic-pr6n, sans-serif;
	font-weight: 400;
	font-style: normal;
}

@font-face {
  font-family: "UDREIMINPRO-BOLD";
  font-style: normal;
  src: local("UDREIMINPRO Bold"), 
    url("../font/UDREIMINPRO-BOLD.woff2") format("woff2"), 
    url("../font/UDREIMINPRO-BOLD.woff") format("opentype");
}
.ud-reimin {
/*	font-family: a-otf-ud-reimin-pr6n, sans-serif;*//*Reguler*/
	font-family: 'UDREIMINPRO-BOLD', sans-serif;
	font-style: normal;
	line-height: 1;
	font-weight: normal;
}
/* ====================================================
  /* CONTENTS
==================================================== */
body {
	font-size:clamp(0.875rem, 0.625rem + 1.25vw, 1rem);
	font-family: 'kozuka-gothic-pr6n','小塚ゴシック Pro','Kozuka Gothic Pro', sans-serif;
	font-weight: 600;
	font-style: normal;
}

/*btn compornent*/
.content__btn {
	width: 320px;
	margin: 56px auto 88px;
}
.content__btn a {
	line-height: 50px;
	background: url(../images/top/btn_320_50.jpg) no-repeat;
	background-size: cover;
	text-align: center;
	display: block;
	color: #fff;
	letter-spacing: -.02em;
}
/*icon area*/
.content__btn a,
.contact-width li .items {position: relative;}
.content__btn a .fa-chevron-circle-right,
.contact .contact-width li .items .fa-chevron-circle-right {
	position: absolute;
    right: 10px;
    top: 50%;
    transform: translate(-50% , -50%);
    width: 20px;
    line-height: 1;
}
.content__btn a .fa-chevron-circle-right::before {
    color: #2b7393;
    background: #fff;
    line-height: 1;
}
/*.contact .contact-width li .items .fa-chevron-circle-right {
	position: absolute;
    top: 50%;
    transform: translate(-50% , -50%);
    right: 10px;
    width: 22px;
}
*/





.history__items p {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.history__items .fa-chevron-circle-right::before {
    color: #fff;
    background: #000000;
    font-size: 18px;
    position: relative;
    top: 0;
    letter-spacing: 0;
    transform: translateY(0);
}

/* ====================================================
  /*MAIN VISUAL
==================================================== */
.mainVisual::before {
	position: absolute;
	bottom: 0;
	left: 0;
	content: "";
	width: 100%;
	height: 351px;
	background:url(../images/top/main_wave.png) no-repeat bottom left;
	background-size: cover;
	z-index: 2;
}
.mainVisual::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0 0 0 / 40%);
	z-index: 3;
}
.catch-txt {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	right: 0;
	margin: 0 auto;
	font-size:clamp(2rem, 1.364rem + 3.18vw, 3.75rem);
	width: 1200px;
	color: #fff;
	letter-spacing: .2em;
	z-index: 4;
}
.slide-caption {
    position: absolute;
    bottom: 20px;
    right: 10px;
    color: #ffffff;
    padding: 5px 10px;
	font-weight: normal;
    font-size: 16px;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
}
.swiper-slide {
    position: relative;
} 
.catch-txt span {display: block;line-height: 1;text-align: center;}
.catch-txt span:first-of-type {margin-bottom: 40px;}
 
/*以下フェードイン表示の指定*/
.fadein {
    opacity: 0;
    animation: fadein 6s ease forwards;
    -webkit-animation: fadein 6s ease forwards;
    -moz-animation: fadein 6s ease forwards;
}
@keyframes fadein {
    100% {  opacity: 1;}
}
@-moz-keyframes fadein {
    100% {  opacity: 1;}
}
@-webkit-keyframes fadein {
    100% {  opacity: 1;}
}
 
/*以下遅延の指定*/
.txt01 {animation-delay: 1s;}
.txt02 {animation-delay: 4s;}
/* ====================================================
  /* HISTORY
==================================================== */
.history {
	padding: 25px 0 100px;
}
.company--history .big {
	font-size: clamp(2rem, 0.773rem + 6.14vw, 5.375rem);
	text-shadow: 0 0 8px #fff;
	color: #000;
}
.company--history .small {font-size: 18px;letter-spacing: .08em;margin-top: 28px;}
.history__items {justify-content: space-between;}
.history__items div {
	border-radius: 30px;border: 1px solid #c6c6c6;
	width: calc(50% - 27px);
}
.history__items div figure {overflow: hidden;}
.history__items div img {border-radius: 30px 30px 0 0;transition: .3s;}
.history__items div p {padding: 52px 20px 41px 24px;}
  /* about
==================================================== */
.about {
	position: relative;
	margin-top: -60px;
	z-index: 2;
}
.know-common {
	width: 900px;
	margin-top: 120px;
}
.know-common .history__items div p {
	padding: 32px 24px;
}
/* ====================================================
  /* NEWS
==================================================== */
.news-container {
	width: 838px;
	margin: 0 auto;
	padding: 0;
}
.news-wrap {
	background: url(../images/top/news_bg.jpg) no-repeat;
	background-size: cover;
	padding: 48px 0 84px;
}
.news-wrap h2 {
	font-size: clamp(2rem, 1.636rem + 1.82vw, 3rem);
	margin-bottom: 42px;
}
.news-item {
	display: flex;
	margin-bottom: 44px;
}
.thumbnail-box {
	width: 200px;
	margin-right: 24px;
	position: relative;
	height: 123px;
	border: 1px solid #d6d6d6;
	background: #fff;
}
.thumbnail-box img {
	display: inline-block;
	width: auto;
	height: 100%;
	top: 50%;
    left: 50%;
    position: absolute;
    border: 1px solid #d6d6d6;
    transform: scale(1.1);
    transform: translate(-50%,-50% );
}
.thumbnail-box .new-mark {
	position: absolute;
	top: 0;
	left: 0;
	width: 50px;
	line-height: 20px;
	font-size: 12px;
	color: #fff;
	text-align: center;
	display: block;
	background:#b91c1c;
	font-family: din-2014-narrow, sans-serif;
	font-weight: 700;
	font-style: normal;
	letter-spacing: .04em;
}
.txt-box {
	border-bottom:1px solid #d6d6d6;
	position: relative;
	flex: 2;
}
.txt-box h3 {
	display: flex;
	margin: 0;
	font-size: 16px;
}
.news-wrap .content__btn {margin-bottom: 0;}
.txt-box .time {
    font-size: 16px;
    color: #a1a1a1;
    left: 0;
    margin-bottom: 16px;
}
.tagbox .tag-item {
	margin: 0 5px;
	padding: 5px 10px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 14px;
	background: #fff;
}
.tagbox .tag-item:first-of-type {
	margin-left: 0;
}
.tagbox .tag-item:last-of-type {
	margin-right: 0;
}
.archive-header-title {margin-bottom: 40px;}
.txt-box h3 {
    display: flex;
    margin: 0;
    font-size: 16px;
}

/* ====================================================
  /* SUSTAINABILITY
==================================================== */
.sustainability {
	padding: 24px 0 88px;
	background: #f0f0f0;
	position: relative;
}
.sustainability .grid {
	z-index: 1;
	top: 0;
}
.sustainability .grid span {border-right: 1px solid #fff;}
.sustainability .content__btn {margin-bottom: 0;position: relative;z-index: 2;}

/* ====================================================
  /* SERVICE
==================================================== */
.service {padding: 38px 0 126px;}
.swiper-pointer-events {
	position: relative;
}
.service .swiper-arrow-slider {position: relative;}
.service .swiper-button-prev {left: -21px;}
.service .swiper-button-next {right: -21px;}
.service .contents--wrap {
	position: relative;
	padding-bottom: 104px;
	padding: 0 70px;
}
.contents--wrap img {max-width: none;width: 757px;}
.service__txt {
	background: #fff;
	position: absolute;
	z-index: 3;
	bottom: -97px;
	right: 0%;
	width: 582px;
	padding: 30px 36px;
	box-shadow: 2px 1px 6px hsl(0deg 0% 0% / 28%);
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
	position: relative;
	margin-top: 137px;
}
.service .content__btn {margin:0 auto;margin-top: 80px;}
.swiper-pagination-bullet {
  background-color:#878787;
  height: 12px;
  width: 12px;
}
.service .swiper-slide {width: 1072px;}
.service .swiper-pointer-events {background: #fff;}
/* ====================================================
  /* RICRUIT
==================================================== */
.recruit {
	padding: 610px 0 157px;
	background: url(../images/top/recruit_bg.webp) no-repeat top center;
	background-size: cover;
}
.white-border {
	border: 4px solid #fff;
	width: 686px;
	margin: 0 auto;
	border-radius: 3px;
}
.white-border article {
	background:rgb(255 255 255 / 60%);
	padding: 53px 0 58px;
}
.recruit h2 {top: 0;}
.recruit .content__btn {margin:70px auto 0;}



/* ====================================================
  /* 出版物
==================================================== */
.product {position: relative;padding-bottom: 137px;}
.swiper-nav-wrap {
	position: absolute;
	transform: translateY(-50%);
	top: 50%;
	width: 1200px;
	margin: 0 auto;
	left: 0;
	right: 0;
	z-index: 4;
}
.product .swiper-container {
	overflow: hidden;
}
.product h2 {
	font-size: clamp(2rem, 1.636rem + 1.82vw, 3rem);
	padding-bottom: 82px;
	background: #fff;
}
.product .swiper-slide {width: 267px;/*margin: 0 15px;*/}
.product-thumbnail-box {
	margin-bottom: 16px;
	height: 386px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position:top center;
}
.product .txt-box {border: none;font-size: 16px;}
.product .txt-box ul li {
	font-weight: bold;
}
.product .content__btn {margin-top: 62px;margin-bottom: 0;}





@media all and (max-width:1200px) {
	.breadcrumb .container {
	    width: 100%;
	    margin: 0 auto;
	    padding: 0 20px;
	}
	.grid {width: 100%;}
	/*contents*/
	.widewidth {padding: 0 20px;width: 100%;}
	/*header*/

	/*mainvisual*/
	.swiper-nav-wrap {width: 100%;}
	.catch-txt {width: 100%;}
	/*news*/
	.news-container {padding: 0 20px;width: 100%;}
	/*serviuice*/
	.service .contents--wrap {}
	.contents--wrap img {width: 100%;}
	.service__txt {
		width: calc(100% - 40px);
		margin: 0 auto;
		position: relative;
		bottom: 72px;
	}
	.service .swiper-button-prev {left: 15%;}
	.service .swiper-button-next {right: 15%;}
	.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {margin-top: 0;}
	/*product*/
	.product .swiper-button-prev {left: 31px;}
	.product .swiper-button-next {right: 31px;}


	/*recruit*/
	.recruit {background-size:100%;padding:44% 0 11.73%;}
	.white-border {border-radius: 5px;box-shadow: 0 2px 4px #adadad;}
}
@media all and (max-width:1024px) {
	.catch-txt {font-size: clamp(2rem, 1.818rem + 0.91vw, 2.5rem);}
}/*1024px*/
@media all and (max-width:768px) {
	/*main*/
	.catch-txt {font-size:clamp(2rem, 0.364rem + 3.18vw, 3.75rem);}
	.catch-txt span:first-of-type {margin-bottom: 20px;}
	/*histry*/
	.about {margin-top: -40px;}
	.history__items {justify-content: space-around;}
	.know-common {margin-top: 24px;}
	.know-common .history__items div {border-radius: 15px;}
	.know-common .history__items div img {border-radius: 15px 15px 0 0;}
	.know-common .history__items div p {padding:16px;}
	/*service*/
	.service .contents--wrap {padding: 0;}
	.service .swiper-button-prev {left: 10%;}
	.service .swiper-button-next {right: 10%;}
	.service .swiper-button-next, .swiper-button-prev {
		width: 30px;
		height: 30px;
	}
	.service .service__txt {font-size: clamp(1rem, 0.911rem + 0.45vw, 1.125rem);}
	.swiper-slide p {font-size: clamp(0.875rem, 0.786rem + 0.45vw, 1rem);}
	/*product */
	.product {padding-bottom: 68px;}
	.product-thumbnail-box {height: auto;padding-top: 143%;}
	/*recruit*/
	.white-border {width: calc(100% - 40px);}
} /*768px*/
@media all and (max-width:540px) {
	.catch-txt {font-size: clamp(1.5rem, 1.318rem + 0.91vw, 2rem);}
}/*1024px*/
@media all and (max-width:480px) {
	.breadcrumb .container {
	    padding: 0 10px;
	}
	.grid {justify-content: center;}
	.grid span:not(:first-of-type) {display: none;}
	h2 img {padding: 0 20px;height: auto;max-height: none;}
	.widewidth {padding: 0 10px;}
	.content__btn {margin: 40px auto;width: 280px;}
	.content__btn a {font-size: 16px;}
	.sp-br {display: block;}
	.history h2, .service h2, .sustainability h2, .recruit h2 {top: 21px;}
	/*mainVisual*/
	.catch-txt {
		top: 40px;
		left: 20px;
		right: 20px;
		transform: translateY(0);
		width: calc(100% - 40px);
		font-size:clamp(1.938rem, 1.063rem + 4.38vw, 2.375rem);
	}
	.catch-txt span {text-align: left;line-height: 1.444;}
	.catch-txt span:first-of-type {margin-bottom: 80px;}
	/*history*/
	.history {padding-bottom: 50px;}
	.company--history .small {
		width: 270px;
		margin: 16px auto 0;
	}
	.about {margin-top: -20px;}
	.fa-chevron-circle-right::before {padding: 1px;line-height: 1;}
	.know-common {margin-top: 0;}
	.know-common .history__items div p,
	.know-common .history__items .fa-chevron-circle-right::before {font-size: 14px;}




	.history__items div {width: 100%;}
	.history__items {flex-wrap: wrap;}
	.history__items div p {
		font-size: 18px;
		padding: 25px 20px 20px 25px;
	}

	.history__items div:first-of-type {margin-bottom: 30px;}
	/*news*/
	.news-wrap {padding-bottom: 40px;}
	.news-wrap h2 {margin-bottom: 40px;}
	.thumbnail-box {
		margin-right: 18px;
		width: 133px;
		height: 81px;
	}
	.news-container {padding: 0 10px;}
	.news-item {
		border-bottom: 1px solid #d6d6d6;
		margin-bottom: 32px;
		padding-bottom: 10px;
	}
	.txt-box {border: none;}
	.tagbox .tag-item {font-size: 12px;padding: 3px 5px;margin: 0 2px;}
	.txt-box .time {margin-bottom: 8px;}
	.txt-box h3 {font-size: 14px;}
	.txt-box .time {font-size: 12px;margin-top: 8px;}


	/*sustainability*/
	.sustainability {padding-bottom: 40px;}

	/*service*/
	.service {padding-bottom: 40px;}
	.service .contents--wrap {width: 100%;}
	.service__txt {padding: 27px 16px;bottom: 34px;}
	.service .content__btn {margin-top: 20px;}
	.service .swiper-nav-wrap {display: none;}
	.swiper-slide p {font-size: 15px;}

	/*recruit*/
	.white-border {width: calc(100% - 20px);}
	.white-border article {padding: 24px 0;}
	.recruit .content__btn {margin-top: 45px;}
	/*product*/
	.product h2 {padding-bottom: 38px;}
	.product h2 span {line-height: 1.36;letter-spacing: -.02em;}
	.product-thumbnail-box {height: 225px;margin-bottom: 10px;}
	.product .content__btn {margin:28px auto 0;}
	.product .swiper-button-next, .product .swiper-button-prev {width: 25px;height: 26px;}
	.product .swiper-button-prev {left: 25px;}
	.product .swiper-button-next {right: 25px;}
	.product .txt-box {font-size: clamp(0.75rem, 3.75vw, 1.125rem);}
	.product .txt-box ul li {
		margin-bottom: 10px;
		line-height: 1.5;
	}



}/*480px*/