@charset "UTF-8";

/* CSS Information
---------------------------------------------------------------
Site URL:http://envision.okayama.jp/
File name:pc.css
Summary:reset styles
Created:2021-10-26
--------------------------------------------------------------- */

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

/* Index */
/* ------------------------------------------------------------ */

/* Mainvisual */
main#index section#mainvisual {
	background: #000 url(../img/index/mainvisual.jpg) no-repeat center center;
	background-size: cover;
	display: flex;
	justify-content: center;
	align-items: center;
}

main#index section#mainvisual .inner {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

main#index section#mainvisual h2 {
	color: #fff;
	font-size: 120px;
	font-family: "Noto Serif JP";
}

main#index section#mainvisual h2 ruby[data-ruby] {
	position: relative;
	display: block;
	margin-bottom: 80px;
}

main#index section#mainvisual h2 ruby[data-ruby]:nth-of-type(3) {
	margin: 0;
}

main#index section#mainvisual h2 ruby[data-ruby]::before {
	content: attr(data-ruby);
	position: absolute;
	left: 0;
	bottom: -60px;
	font-size: 36px;
}

main#index section#mainvisual h2 rt {
	display: none;
}
  
/* Company upper */
.headline {
	max-width: 800px;
	height: auto;
	margin: auto;
}

main#index section#company_upper div.headline h2 {
	text-align: center;
	font-size: 40px;
	line-height: 2;
	font-family: "Noto Serif JP";
}

main#index section#company_upper h3 {
	margin: 0;
}

main#index section#company_upper .inner div {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#index section#company_upper .inner div figcaption {
	width: 480px;
	margin-left: 100px;
}

main#index section#company_upper .inner div figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#index section#company_upper .inner div figcaption p.comment {
	font-size: 20px;
	line-height: 3;
}

main#index section#company_upper .inner div figure {
	width: 576px;
}

/* Company lower */
main#index section#company_lower {
	background: #bd2135;
	color: #fff;
	margin-top: -80px;
	padding: 80px 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#index section#company_lower h2 {
	background: url(../img/index/bg_company_upper.jpg) no-repeat center top;
	background-size: cover;
	text-align: center;
	font-size: 40px;
	line-height: 2;
	font-family: "Noto Serif JP";
	height: 570px;
	display: flex;
	justify-content: center;
	align-items: center;
}

main#index section#company_lower h3 {
	text-align: center;
	font-size: 30px;
	font-family: "Noto Serif JP";
	position: relative;
	display: inline-block;
	padding: 0 40px;
	margin: 0 0 40px;
}

main#index section#company_lower h3::before,
main#index section#company_lower h3::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 30px;
	height: 1px;
	background: #fff;
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}

main#index section#company_lower h3::before {
	left: 0;
}

main#index section#company_lower h3::after {
	right :0;
}

main#index section#company_lower ul {
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#index section#company_lower ul li {
	width: 270px;
}

main#index section#company_lower ul li figure {
	width: 100%;
	position: relative;
	flex-shrink: 0;
}

main#index section#company_lower ul li figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#index section#company_lower ul li figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#index section#company_lower ul li p.comment {
	margin-top: 20px;
}

main#index section#company_lower .btn {
	width: 220px;
	margin: 40px auto 0;
}

/* Service upper */
main#index section#service_upper {
	background: url(../img/index/bg_logo.png) no-repeat;
	background-size: 444px 479px;
	background-position-x: calc(50% + 300px);
	background-position-y: 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 80px 0;
}

main#index section#service_upper h3 {
}

main#index section#service_upper .inner h4 {
	text-align: center;
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#index section#service_upper .inner p.comment {
	text-align: center;
	margin-top: 20px;
}

main#index section#service_upper ul {
	width: 100%;
	margin: 40px auto 0;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#index section#service_upper ul li {
	width: 300px;
}

main#index section#service_upper ul li figure {
	width: 100%;
	position: relative;
	flex-shrink: 0;
}

main#index section#service_upper ul li figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#index section#service_upper ul li figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#index section#service_upper ul li figcaption {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: rgba(189,33,53,0.4);
	color: #fff;
}

/* Service lower */
main#index section#service_lower {
	padding: 0 0 80px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#index section#service_lower .inner {
    width: 100%;
}

main#index section#service_lower .inner > figure {
    height: 520px;
}

main#index section#service_lower .inner > figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

main#index section#service_lower .inner > div {
	width: 1200px;
	margin: -80px auto 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

main#index section#service_lower .inner > div figure {
	width: 590px;
	margin: 0 auto;
	/*flex-shrink: 0;*/
}

main#index section#service_lower .inner > div figcaption {
	background: #bd2135;
	color: #fff;
	width: 470px;
	padding: 40px;
}

main#index section#service_lower h3 {
	text-align: center;
	font-size: 30px;
	font-family: "Noto Serif JP";
	position: relative;
	display: inline-block;
	padding: 0 40px;
	margin: 0 0 40px;
}

main#index section#service_lower h3::before,
main#index section#service_lower h3::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 30px;
	height: 1px;
	background: #fff;
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}

main#index section#service_lower h3::before {
	left: 0;
}

main#index section#service_lower h3::after {
	right :0;
}

main#index section#service_lower .btn {
	width: 220px;
	margin: 40px auto 0;
}

/* Works */
main#index section#works {
	background: #bd2135;
	color: #fff;
	padding: 80px 0;
}

main#index section#works h3::before {
	filter: brightness(0) invert(1);
}

main#index section#works .inner > div {
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#index section#works .inner > div article {
	text-align: center;
	width: 270px;
}

main#index section#works .inner > div article a {
	display: block;
}

main#index section#works .inner > div article figure {
	width: 100%;
	position: relative;
	flex-shrink: 0;
}

main#index section#works .inner > div article figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#index section#works .inner > div article figure img {
	border-radius: 135px;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#index section#works .inner > div article figcaption {
	margin-top: 20px;
}

main#index section#works .inner > div article figcaption h1 {
	color: #fff;
	margin-bottom: 10px;
	padding-bottom: 10px;
	border-bottom: 1px #fff solid;
}

main#index section#works .inner > div article figcaption p.comment {
	margin-top: 20px;
	color: #fff;
}

main#index section#works .btn {
	width: 220px;
	margin: 40px auto 0;
}

/* Recruit upper */
main#index section#recruit_upper {
	background: url(../img/index/bg_logo.png) no-repeat;
	background-size: 444px 479px;
	background-position-x: calc(50% - 300px);
	background-position-y: 260px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 80px 0;
}

main#index section#recruit_upper h3 {
	margin-bottom: 0px;
}

main#index section#recruit_upper .inner div {
	width: 1000px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#index section#recruit_upper .inner div figcaption {
	width: 470px;
}

main#index section#recruit_upper .inner div figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#index section#recruit_upper .inner div figcaption p.comment {
	margin-top: 20px;
}

main#index section#recruit_upper .inner div figure {
	width: 470px;
}

/* Recruit lower */
main#index section#recruit_lower {
	margin-top: -120px;
	padding: 0 0 80px;
}

main#index section#recruit_lower .inner {
	background: #bd2135;
	color: #fff;
	width: 1200px;
	height: 370px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#index section#recruit_lower .inner figure {
	width: 660px;
	margin: -70px 0 0 40px;
	flex-shrink: 0;
	order: 1;
}

main#index section#recruit_lower .inner figcaption {
	color: #fff;
	padding: 0 40px;
	order: 2;
}

main#index section#recruit_lower h3 {
	text-align: center;
	font-size: 30px;
	font-family: "Noto Serif JP";
	position: relative;
	display: inline-block;
	padding: 0 40px;
	margin: 0 0 40px;
}

main#index section#recruit_lower h3::before,
main#index section#recruit_lower h3::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 30px;
	height: 1px;
	background: #fff;
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}

main#index section#recruit_lower h3::before {
	left: 0;
}

main#index section#recruit_lower h3::after {
	right :0;
}

main#index section#recruit_lower .btn {
	width: 220px;
	margin: 40px auto 0;
}

/* News */
main#index section#news {
	padding: 80px 0;
}

main#index section#news .inner {
	width: 1200px;
	min-height: 220px;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	position: relative;
}

main#index section#news h3 {
	width: 220px;
	margin: 70px 0 40px 100px;
}

main#index section#news .inner > div {
	width: 800px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
}

main#index section#news .inner > div article {
	width: 370px;
	margin-right: 60px;
}

main#index section#news .inner > div article:nth-of-type(2n) {
	margin-right: 0;
}

main#index section#news .inner > div article:nth-of-type(n+3) {
	margin-top: 40px;
}

main#index section#news .inner > div article a {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

main#index section#news .inner > div article figure {
	width: 130px;
	position: relative;
	flex-shrink: 0;
	margin-right: 20px;
}

main#index section#news .inner > div article figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#index section#news .inner > div article figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#index section#news .inner > div article figcaption {
	width: 100%;
}

main#index section#news .inner > div article figcaption time {
	font-size: 14px;
}

main#index section#news .inner > div article figcaption h1 {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 20px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

main#index section#news .btn {
	width: 220px;
	position: absolute;
	bottom: 0;
	left: 100px;
}

/* Related */
main#index section#related {
	padding: 80px 0;
}

main#index section#related h3 {
	margin: 0 0 40px;
}

main#index section#related h3::before {
	content: none;
}

main#index section#related p.bnr {
	width: 800px;
	margin: 40px auto 20px;
}

main#index section#related p.comment {
	text-align: center;
	margin-top: 20px;
}

/* Service */
/* ------------------------------------------------------------ */

main#service section#mainvisual {
	background: #000 url(../img/service/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#service section#content1 {
	padding: 80px 0 0;
}

main#service section#content1 h2 {
	text-align: center;
	font-size: 24px;
    font-family: "Noto Serif JP";
	line-height: 2;
}

main#service section#content1 ul {
	width: 100%;
	margin-top: 40px;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#service section#content1 ul li {
	background: #bd2135;
	width: 294px;
}

main#service section#content1 ul li figure {
	width: 100%;
	position: relative;
}

main#service section#content1 ul li figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#service section#content1 ul li figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#service section#content1 ul li figcaption {
	color: #fff;
	padding: 20px;
}

main#service section#content1 ul li figcaption h3 {
	text-align: center;
	font-size: 24px;
	font-family: "Noto Serif JP";
	margin: 0 0 20px;
}

main#service section#content1 ul li figcaption h3::before {
	content: none;
}

main#service section#content2 {
	background: url(../img/index/bg_logo.png) no-repeat;
	background-size: 444px 479px;
	background-position-x: calc(50% - 379px);
	background-position-y: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 80px 0;
}

main#service section#content2 .inner div {
	width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#service section#content2 .inner div figcaption {
	width: 410px;
	margin-left: 100px;
}

main#service section#content2 .inner div figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#service section#content2 .inner div figcaption p.comment {
	margin-top: 20px;
}

main#service section#content2 .inner div figure {
	width: 630px;
}

main#service section#content3 {
	padding: 0 0 80px;
}

main#service section#content3 ul {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#service section#content3 ul li {
	width: 360px;
}

main#service section#content3 ul li figure {
	width: 100%;
	position: relative;
}

main#service section#content3 ul li figure::before {
	content: "";
	display: block;
	padding-top: 100%;
}

main#service section#content3 ul li figure img {
	border-radius: 180px;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#service section#content3 ul li figcaption h3 {
	text-align: center;
	font-size: 24px;
	font-family: "Noto Serif JP";
	margin: 40px 0 20px;
}

main#service section#content3 ul li figcaption h3::before {
	content: none;
}

main#service section#content4 {
	background: url(../img/service/bg_works.jpg) no-repeat center top;
	background-size: cover;
	width: 100%;
	height: 580px;
	display: flex;
	justify-content: center;
	align-items: center;
}

main#service section#content4 .inner {
	background: rgba(189,33,53,0.9);
	color: #fff;
	width: 550px;
	height: 410px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#service section#content4 h3::before {
    filter: brightness(0) invert(1);
}

main#service section#content5 {
	padding: 80px 0;
}

main#service section#content5 .inner {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#service section#content5 .inner div {
	width: 550px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}

main#service section#content5 figure {
	width: 100%;
}

main#service section#content5 h3 {
	margin: 40px 0;
}

main#service section#content5 h3::before {
	content: none;
}

main#service section#content6 {
	padding: 0 0 80px;
}

main#service section#content6 .inner div {
	width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#service section#content6 .inner div figcaption {
	width: 410px;
	margin-left: 100px;
}

main#service section#content6 .inner div figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#service section#content6 .inner div figcaption p.comment {
	margin-top: 20px;
}

main#service section#content6 .inner div figcaption .btn {
    width: 220px;
    margin: 40px auto 0;
}

main#service section#content6 .inner div figure {
	width: 630px;
}

/* Works */
/* ------------------------------------------------------------ */

main#works section#mainvisual {
	background: #000 url(../img/works/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#works section#construction1,
main#works section#construction2,
main#works section#construction3 {
	padding: 80px 0 0;
}

main#works section#construction4 {
	padding: 80px 0;
}

main#works section#construction1 h3,
main#works section#construction2 h3,
main#works section#construction3 h3,
main#works section#construction4 h3 {
    margin: 0 0 40px;
}

main#works section#construction1 h3::before,
main#works section#construction2 h3::before,
main#works section#construction3 h3::before,
main#works section#construction4 h3::before {
    content: none;
}

main#works section#construction1 .inner > div,
main#works section#construction2 .inner > div,
main#works section#construction3 .inner > div,
main#works section#construction4 .inner > div {
	width: 100%;
	margin-top: 40px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}

main#works section#construction1 article,
main#works section#construction2 article,
main#works section#construction3 article,
main#works section#construction4 article {
	width: 360px;
	margin-right: 60px;
}

main#works section#construction1 article:nth-of-type(3n),
main#works section#construction2 article:nth-of-type(3n),
main#works section#construction3 article:nth-of-type(3n),
main#works section#construction4 article:nth-of-type(3n) {
	margin-right: 0;
}

main#works section#construction1 article:nth-of-type(n+4),
main#works section#construction2 article:nth-of-type(n+4),
main#works section#construction3 article:nth-of-type(n+4),
main#works section#construction4 article:nth-of-type(n+4) {
	margin-top: 60px;
}

main#works section#construction1 article figure p,
main#works section#construction2 article figure p,
main#works section#construction3 article figure p,
main#works section#construction4 article figure p {
	width: 100%;
	position: relative;
}

main#works section#construction3 article figure ul.thumbnail_photo {
	margin-top: 10px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}

main#works section#construction3 article figure ul.thumbnail_photo li {
	width: 175px;
	margin-right: 10px;
	position: relative;
}

main#works section#construction3 article figure ul.thumbnail_photo li:nth-of-type(2) {
	margin-right: 0;
}

main#works section#construction3 article figure ul.thumbnail_photo li img:hover {
    cursor: pointer;
    opacity: 0.7;
}

main#works section#construction1 article figure p::before,
main#works section#construction2 article figure p::before,
main#works section#construction3 article figure p::before,
main#works section#construction4 article figure p::before,
main#works section#construction3 article figure ul.thumbnail_photo li::before {
	content: "";
	display: block;
	padding-top: 75%;
}

main#works section#construction1 article figure p img,
main#works section#construction2 article figure p img,
main#works section#construction3 article figure p img,
main#works section#construction4 article figure p img,
main#works section#construction3 article figure ul.thumbnail_photo li img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#works section#content1 article figcaption h1 {
	text-align: left;
	font-family: "Noto Serif JP";
	margin: 20px 0 10px;
}

main#works section#content2 {
	background: #bd2135;
	margin-bottom: 80px;
	padding: 80px 0;
}

main#works section#content2 .inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#works section#content2 h3 {
	color: #fff;
	margin: 0 0 40px;
}

main#works section#content2 h3::before {
	content: none;
}

main#works section#content2 ul {
	display: flex;
	justify-content: center;
	align-items: center;
}

main#works section#content2 ul li {
	margin: 0 10px;
}

main#works section#content2 ul li a {
	border-radius: 20px;
	border: 1px #fff solid;
	background: #bd2135;
	color: #fff;
    font-size: 18px;
	box-sizing: border-box;
	width: 160px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}

main#works section#content2 ul li a:hover,
main#works section#content2 ul li a.active {
	border: 1px #bd2135 solid;
	background: #fff;
	color: #bd2135;
}

/* Company */
/* ------------------------------------------------------------ */

main#company section#mainvisual {
	background: #000 url(../img/company/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#company section#content1 {
	padding: 80px 0;
}

main#company section#content1 .inner {
	background: url(../img/company/bg_message.jpg) no-repeat;
	background-size: 950px 530px;
	background-position-x: calc(50% + 525px);
	background-position-y: 104px;
	width: 100%;
}

main#company section#content1 h3 {
}

main#company section#content1 .inner div {
	width: 1200px;
	margin: 0 auto;
}

main#company section#content1 .inner div figcaption {
	width: 600px;
}

main#company section#content1 .inner div figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#company section#content1 .inner div figcaption p.comment {
	margin-top: 20px;
}

main#company section#content1 .inner div figcaption p.sign {
	text-align: right;
	margin-top: 20px;
}

main#company section#content1 .inner div figcaption p.sign span {
	font-size: 30px;
	font-family: "Noto Serif JP";
	margin-left: 20px;
}

main#company section#content2 {
	background: #bd2135 url(../img/company/bg_logo.png) no-repeat center bottom 20px;
	background-size: 430px 465px;
	color: #fff;
	padding: 80px 0;
}

main#company section#content2 h3::before {
    filter: brightness(0) invert(1);
}

main#company section#content2 h4 {
	text-align: center;
	font-size: 48px;
	font-family: "Noto Serif JP";
	margin: 80px 0;
}

main#company section#content2 p.comment {
	text-align: center;
	font-size: 30px;
	line-height: 2;
}

main#company section#content3 {
	padding: 80px 0;
}

main#company section#content3 h3 {
}

main#company section#content3 figure {
	position: absolute;
	top: 0;
	right: 0;
	border-left: 30px #fff solid;
}

main#company section#content3 .dllist .dlbox .dtbox {
	width: 180px;
}

main#company section#content4 {
	background: #bd2135 url(../img/company/bg_logo.png) no-repeat;
	background-size: 860px 930px;
	background-position-x: calc(50% - 330px);
	background-position-y: 150px;
	color: #fff;
	padding: 80px 0;
}

main#company section#content4 h3::before {
    filter: brightness(0) invert(1);
}

main#company section#content4 .chronology > div {
    display: flex;
	justify-content: flex-start;
	align-items: stretch;
}

main#company section#content4 .chronology > div:last-of-type {
	padding-bottom: 0;
}

main#company section#content4 .chronology .circle {
	width: 100px;
    display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-shrink: 0;
	position: relative;
}

main#company section#content4 .chronology .circle::after {
	content: '';
	position: absolute;
	left: calc(50%);
	width: 1px;
	height: 100%;
	background: #fff;
}

main#company section#content4 .chronology .circle_S {
	border-radius: 15px;
	background: #fff;
	width: 30px;
	height: 30px;
	position: relative;
}

main#company section#content4 .chronology .circle_S::before {
	content: '';
	position: absolute;
	top: calc(50%);
	left: 30px;
	width: 100px;
	height: 1px;
	background: #fff;
}

main#company section#content4 .chronology .circle_b {
	border-radius: 50px;
	background: #fff;
	color: #bd2135;
	font-size: 30px;
	font-family: "Noto Serif JP";
	width: 100px;
	height: 100px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 40px 0;
}

main#company section#content4 .chronology dl {
    display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	margin-left: 100px;
}

main#company section#content4 .chronology dl dt {
	text-align: left;
	font-size: 16px;
	line-height: 1.7;
    width: 140px;
	display: block;
	flex-shrink: 0;
}

main#company section#content4 .chronology dl dt span {
	font-size: 32px;
	font-family: "Noto Serif JP";
	display: block;
}

main#company section#content4 .chronology dl dd  {
	text-align: left;
	width: 100%;
	line-height: 1.7;
	display: block;
	overflow-wrap: anywhere;
}

main#company section#content5 {
	background: url(../img/service/bg_works.jpg) no-repeat center top;
	background-size: cover;
	width: 100%;
	height: 580px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 80px 0 0;
}

main#company section#content5 .inner {
	background: rgba(189,33,53,0.9);
	color: #fff;
	width: 550px;
	height: 410px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#company section#content5 h3::before {
    filter: brightness(0) invert(1);
}

main#company section#content6 {
	padding: 80px 0;
}

main#company section#content6 .inner {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#company section#content6 .inner div {
	width: 550px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}

main#company section#content6 ul li figure {
	width: 100%;
}

main#company section#content6 h3 {
	margin: 40px 0;
}

main#company section#content6 h3::before {
	content: none;
}

/* Recruit */
/* ------------------------------------------------------------ */

main#recruit section#mainvisual {
	background: #000 url(../img/recruit/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#recruit section#content1 {
	padding: 80px 0;
}

main#recruit section#content1 .inner {
	text-align: center;
}

main#recruit section#content1 h3 {
}

main#recruit section#content1 figure {
	width: 990px;
	margin: 40px auto;
}

main#recruit section#content1 h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#recruit section#content1 p.comment {
	margin-top: 20px;
}

main#recruit section#content2 {
	background: #bd2135;
	color: #fff;
	padding: 80px 0;
}

main#recruit section#content2 .inner {
	background: url(../img/recruit/business2.jpg) no-repeat;
	background-size: 900px 450px;
	background-position-x: calc(50% + 550px);
	background-position-y: 104px;
	width: 100%;
}

main#recruit section#content2 .inner > div {
	width: 1000px;
	margin: 0 auto;
}

main#recruit section#content2 .inner > div figure {
	width: 484px;
	height: 450px;
	display: flex;
	align-items: center;
}

main#recruit section#content2 h3::before {
    filter: brightness(0) invert(1);
}

main#recruit section#content2 .inner figcaption {
	width: 1000px;
	margin: 40px auto 0;
}

main#recruit section#content2 .inner figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#recruit section#content2 .inner figcaption p.comment {
	margin-top: 20px;
}

main#recruit section#content3 {
	padding: 80px 0;
}

main#recruit section#content3 .inner > div {
	width: 1000px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#recruit section#content3 .inner > div:nth-of-type(n+2) {
	margin-top: 40px;
}

main#recruit section#content3 .inner > div > figure {
	width: 142px;
	position: relative;
}

main#recruit section#content3 .inner > div:nth-of-type(n+2) figure::before {
    content: "";
    vertical-align: middle;
    margin: auto;
    position: absolute;
    left: calc(50% - 5px);
    top: -30px;
    width: 10px;
    height: 10px;
    border-bottom: 1px #de909a solid;
    border-right: 1px #de909a solid;
    transform: rotate(45deg);
}

main#recruit section#content3 .inner > div > figcaption {
	width: 790px;
}

main#recruit section#content3 .inner > div > figcaption h4 {
	color: #de909a;
	font-size: 24px;
	font-family: "Noto Serif JP";
	position: relative;
	margin: 0 0 20px;
	padding-bottom: 10px;
	border-bottom: 1px #de909a solid;
}

main#recruit section#content3 .inner > div > figcaption h4 span {
	font-size: 24px;
	font-family: "AlexBrush";
	margin-right: 20px;
}

main#recruit section#content3 .inner > div > figcaption p.comment {
	margin-top: 20px;
}

main#recruit section#content4 {
	background: #f2d3d7;
	padding: 80px 0;
}

main#recruit section#content4 .inner {
	background: #fff;
	box-sizing: border-box;
	padding: 80px 100px;
}

main#recruit section#content4 p.comment {
	text-align: center;
}

main#recruit section#content4 ul {
	width: 1000px;
	margin: 40px auto 0;
	display: flex;
	justify-content: space-between;
}

main#recruit section#content4 ul li {
	width: 300px;
}

main#recruit section#content5 {
	padding: 80px 0;
}

main#recruit section#content5 .inner > p.comment {
	text-align: center;
}

main#recruit section#content5 .inner > div {
	width: 1000px;
	margin: 40px auto 0;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#recruit section#content5 figure {
	width: 500px;
	margin-left: 50px;
	flex-shrink: 0;
}

main#recruit section#content5 figure img {
	border-radius: 250px;
}

main#recruit section#content5 figcaption {
	background: url(../img/recruit/bg_logo.png) no-repeat center center;
    background-size: 360px auto;
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

main#recruit section#content5 figcaption h4 {
	font-size: 20px;
	line-height: 1.7;
	font-family: "Noto Serif JP";
}

main#recruit section#content5 figcaption p.name {
	font-size: 24px;
	margin-top: 40px;
}

main#recruit section#content5 figcaption p.department {
	margin-top: 20px;
}

main#recruit section#content5 figcaption p.comment {
	margin-top: 40px;
}

main#recruit section#content6 {
	padding: 80px 0;
}

main#recruit section#content6 .inner {
	background: #bd2135;
	color: #fff;
	width: 1200px;
	height: 370px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

main#recruit section#content6 .inner figure {
	width: 620px;
	margin: -70px 0 0 40px;
	flex-shrink: 0;
}

main#recruit section#content6 .inner figcaption {
	color: #fff;
	width: 100%;
	order: 2;
}

main#recruit section#content6 h3::before {
    filter: brightness(0) invert(1);
}

main#recruit section#content6 .btn {
	width: 220px;
	margin: 40px auto 0;
}

main#recruit section#content7 {
	background: #f2d3d7;
	padding: 80px 0;
}

main#recruit section#content7 .inner {
	background: #fff;
	box-sizing: border-box;
	padding: 80px 100px;
}

main#recruit section#content7 .dllist .dlbox:nth-of-type(1) {
	border-top: 1px #221815 solid;
}

main#recruit section#content7 .dllist .dlbox .dtbox {
    width: 180px;
}

main#recruit section#content7 .dllist .dlbox .ddbox .wrap {
	display: block;
}

main#recruit section#content7 .dllist .dlbox .wrap dl {
    display: table;
}

main#recruit section#content7 .dllist .dlbox .wrap dt {
	line-height: 1.7;
    width: 6em;
	display: table-cell;
}

main#recruit section#content7 .dllist .dlbox .wrap dd {
	line-height: 1.7;
	display: table-cell;
}

main#recruit section#content7 .dllist p.timepoint {
    text-align: right;
    margin-bottom: 20px;
}

main#recruit section#content8 {
	background: url(../img/recruit/bg_entry.jpg) no-repeat center top;
	background-size: cover;
	width: 100%;
	height: 580px;
	display: flex;
	justify-content: center;
	align-items: center;
}

main#recruit section#content8 .inner {
	background: rgba(189,33,53,0.9);
	color: #fff;
	width: 550px;
	height: 410px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

main#recruit section#content8 h3::before {
    filter: brightness(0) invert(1);
}

main#recruit section#content8 p.comment {
	text-align: center;
}

main#recruit section#content8 .btn {
	margin-top: 40px;
}

/* News */
/* ------------------------------------------------------------ */

main#news section#mainvisual {
	background: #000 url(../img/news/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#news section#list {
	padding: 80px 0;
}

main#news section#list h3 {
    margin: 0 0 40px;
}

main#news section#list h3::before {
    content: none;
}

main#news section#list .inner article {
	background: #f2d3d7;
	width: 1000px;
	margin: 40px auto 0;
}

main#news section#list .inner article:nth-of-type(1) {
	margin-top: 0px;
}

main#news section#list .inner article a {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

main#news section#list .inner article figure {
	width: 370px;
	position: relative;
	flex-shrink: 0;
}

main#news section#list .inner article figure::before {
	content: "";
	display: block;
	padding-top: 61.804%;
}

main#news section#list .inner article figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#news section#list .inner article figcaption {
	width: 100%;
	padding: 0 40px;
	box-sizing: border-box;
}

main#news section#list .inner article figcaption time {
	font-size: 14px;
}

main#news section#list .inner article figcaption h1 {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 20px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

main#news section#list .inner article figcaption p.comment {
	margin-top: 20px;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

/* News Detail */
/* ------------------------------------------------------------ */

main#news_detail section#mainvisual {
	background: #000 url(../img/news/mainvisual.jpg) no-repeat center center;
	background-size: cover;
}

main#news_detail section#detail {
	padding: 80px 0;
}

main#news_detail section#detail .inner article {
	background: #f2d3d7;
	box-sizing: border-box;
	width: 1000px;
	margin: 0 auto;
	padding: 60px;
}

main#news_detail section#detail .inner article figure {
	width: 880px;
	position: relative;
	margin-top: 40px;
}

main#news_detail section#detail .inner article figure::before {
	content: "";
	display: block;
	padding-top: 75%;
}

main#news_detail section#detail .inner article figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
}

main#news_detail section#detail .inner article figcaption time {
	font-size: 18px;
}

main#news_detail section#detail .inner article figcaption h1 {
	color: #bd2135;
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 40px;
	padding-bottom: 20px;
	border-bottom: 1px #bd2135 solid;
}

main#news_detail section#detail .inner article figcaption p.comment {
	font-size: 18px;
	margin-top: 40px;
}

main#news_detail ul.pagination {
	width: 100%;
	padding: 60px 0 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

main#news_detail ul.pagination li {
	font-size: 24px;
	letter-spacing: 0;
}

main#news_detail ul.pagination li.prev {
	margin-right: 60px;
}

main#news_detail ul.pagination li.next {
	margin-left: 60px;
}

main#news_detail ul.pagination li a {
	color: #221815;
}

main#news_detail ul.pagination li a span {
	position: relative;
}

main#news_detail ul.pagination li a span::after {
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	position: absolute;
	bottom: 0px;
	left: 0;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
}

main#news_detail ul.pagination li a:hover span::after {
	background: #000;
	bottom: -3px;
}

/* Contact */
/* ------------------------------------------------------------ */

main#contact section#mainvisual {
	background: #bd2135;
}

main#contact section#content1 {
	background: #f8e8ea;
	padding: 80px 0;
}

main#contact section#content1 h3 {
	margin: 0 0 50px;
}

main#contact section#content1 h3::before {
    content: none;
}

main#contact section#content1 h3::after {
	content: '';
	position: absolute;
	bottom: -10px;
	left: calc(50% - 330px);
	width: 660px;
	border-bottom: 1px #595757 solid;
}

main#contact section#content1 .inner > ul {
	width: 100%;
	margin-top: 40px;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}

main#contact section#content1 .inner > ul li {
	background: #fff;
	width: 270px;
	padding: 20px;
	box-sizing: border-box;
	position: relative;
}

main#contact section#content1 .inner > ul li figure {
	text-align: center;
	width: 60px;
	margin: 20px auto;
}

main#contact section#content1 .inner > ul li figcaption {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}

main#contact section#content1 .inner > ul li figcaption h4 {
	color: #bd2135;
	font-size: 18px;
	margin: 20px auto;
}

main#contact section#content1 .inner > ul li figcaption p.comment {
	text-align: left;
}

main#contact section#content1 .inner > ul li:nth-of-type(n+2):before {
	content: "";
	vertical-align: middle;
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: -38px;
	width: 20px;
	height: 20px;
	border-top: 1px #595757 solid;
	border-right: 1px #595757 solid;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}

main#contact section#content2 {
	padding: 80px 0;
}

main#contact section#content2 h3 {
	margin: 0 0 50px;
}

main#contact section#content2 h3::before {
    content: none;
}

main#contact section#content2 h3::after {
	content: '';
	position: absolute;
	bottom: -10px;
	left: calc(50% - 330px);
	width: 660px;
	border-bottom: 1px #595757 solid;
}

main#contact section#content2 p.comment {
	text-align: center;
}

main#contact section#content2 ul {
	margin-top: 40px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

main#contact section#content2 ul li {
    position: relative;
}

main#contact section#content2 ul li.active,
main#contact section#content2 ul li a {
    font-size: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 360px;
	height: 80px;
	box-sizing: border-box;
}

main#contact section#content2 ul li.active {
    background: #bd2135;
    color: #fff;
}

main#contact section#content2 ul li.active::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 13px 13px 0 13px;
	border-color: #bd2135 transparent transparent transparent;
	position: absolute;
	bottom: -13px;
	left: 50%;

	transform: translateX(-50%);
	margin: 0 auto;
}

main#contact section#content2 ul li a {
    background: #fff;
    color: #bd2135;
    border: 1px #bd2135 solid;
}

main#contact section#content2 ul li a:hover {
    background: #bd2135;
    color: #fff;
}

main#contact section#content2 ul li a:hover::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 13px 13px 0 13px;
	border-color: #bd2135 transparent transparent transparent;
	position: absolute;
	bottom: -13px;
	left: 50%;
    -webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	margin: 0 auto;
}

main#contact section#form {
	padding: 0 0 80px;
}

main#contact section#form .dllist .dlbox:nth-of-type(1) {
	border-top: 1px #221815 solid;
}

}