@charset "UTF-8";

/* -----------------------------------------------------------------------------

.sec_ourbusiness
私たちの仕事

----------------------------------------------------------------------------- */
.sec_ourbusiness {
  padding: 100px 0 0;
  margin-top: -110px;
  position: relative;
  padding: 0;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness {
    margin-top: -40px;
    padding: 0 30px;
  }
}

.sec_ourbusiness .ph {
  margin: 0 auto 40px;
  max-width: 100%;
  width: 800px;
  height: 500px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness .ph {
    width: 100%;
    height: 0;
    padding-bottom: 62%;
  }
}

.sec_ourbusiness > .in {
  position: relative;
  /*.feature_box {
		position: relative;
		z-index: 0;
		padding: 50px 0;
		margin-bottom: 90px;
		&:before,&:after {
			content: '';
			position: absolute;
			z-index: -1;
			top: 0;
			bottom: 0;
			left: 50%;
			right: 50%;
			display: block;
		}
		&:before {
			background-color: $bcf1;
			left: -50vw;
			right: -20px;
		}
		&:after {
			background-color: $bcb01;
			z-index: -2;
			top: 40px;
			bottom: -40px;
			left: -80px;
			right: -50vw;
		}
		> dt {
			position: relative;
			right: -150px;
			width: 600px;
			margin-left: 360px;
		}
		> dd {
			min-height: 400px;
			padding-left: 10px;
			padding-right: 510px;

			.ph {
				width: 600px;
				height: 400px;
				position: absolute;
				right: -150px;
			}
			.tit {
				position: relative;
				top: -10px;
				@include fz(24);
				letter-spacing: 0.2em;
				line-height: 1.8;
				color: $bcb02;
				padding-left: 40px;
				margin-bottom: 50px;
				&:before {
					content: '';
					position: absolute;
					left: 0;
					top: 10px;
					bottom: 10px;
					display: block;
					width: 10px;
					background-color: $bcb01;
				}
			}
			.txt {
				@include fz(14);
				letter-spacing: 0.06em;
				line-height: 2;
				text-align: justify;
				text-justify: inter-ideograph;
			}
		}
		&.rev {
			&:before {
				left: -20px;
				right: -50vw;
			}
			&:after {
				left: -50vw;
				right: -80px;
			}
			> dt {
				left: -150px;
				right: auto;
				margin-left: auto;
				margin-right: 360px;
			}
			> dd {
				padding-left: 510px;
				padding-right: 10px;
				.ph {
					right: auto;
					left: -150px;
				}
			}
		}

		//success用
		&.tp02 {
			padding: 80px 0 110px;
			margin-bottom: 0;
			&:before,&:after {
				content: none;
			}
			> dt {
				position: relative;
				right: auto;
				left: auto;
				margin: 0;
				margin-bottom: 90px;
				width: 100%;
			}
			> dd {
				position: relative;
				min-height: 500px;
				padding-left: 90px;
				padding-right: 620px;//570px;
				margin-bottom: 130px;
				&:before {
					content: '';
					position: absolute;
					display: block;
					border: 1px solid $bcf2;
					left: 40px;
					right: 50%;
					top: 50px;
					bottom: -65px;
					margin-right: -50vw;
				}
				.ph {
					width: 700px;
					height: 500px;
					position: absolute;
					right: -130px;
				}
				.tit {
					position: relative;
					top: auto;
					display: block;
					@include fz(30);
					letter-spacing: 0.2em;
					line-height: 1.8;
					color: $bcb02;
					text-align: right;
					padding: 0;
					padding-top: 120px;
					padding-bottom: 25px;
					margin-bottom: 50px;
					&:before {
						content: '';
						position: absolute;
						top: auto;
						bottom: 0;
						left: 0;
						right: -50px;
						display: block;
						height: 5px;
						width: auto;
						background-color: $bcb01;
					}
				}
				.txt {}

				&.rev {
					padding-left: 620px;//570px;
					padding-right: 90px;
					margin-bottom: 0;
					&:before {
						top: 60px;
						bottom: -55px;
						left: 50%;
						right: 40px;
						margin-right: auto;
						margin-left: -50vw;
					}
					.ph {
						right: auto;
						left: -130px;
					}
					.tit {
						text-align: left;
						&:before {
							left: -50px;
							right: 0;
						}
					}
				}
			}
		}
	}
	.success {
		background-color: $bcf1;
		padding-top: 85px;
		padding-bottom: 100px;
		> div {
			background-color: $bcff;
		}
	}*/
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in {
    padding-bottom: 50px;
  }
}

.sec_ourbusiness > .in .mod_wrap01 {
  background-color: #fff;
  padding-top: 75px;
  padding-bottom: 100px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .mod_wrap01 {
    margin-bottom: 40px;
    padding-top: 35px;
    padding-bottom: 0;
  }
}

.sec_ourbusiness > .in .prime {
  height: 420px;
  max-width: 1000px;
  margin: 60px auto 90px;
  position: relative;
  background-color: #273F68;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime {
    height: auto;
    margin: 20px auto 40px;
  }
}

.sec_ourbusiness > .in .prime .txt_box {
  position: relative;
  z-index: 1;
  width: 685px;
  color: #fff;
  padding: 35px 45px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

@media print, screen and (min-width: 768px) {
  .safari .sec_ourbusiness > .in .prime .txt_box {
    width: 690px;
    -webkit-font-feature-settings: "palt";
    font-feature-settings: "palt";
  }
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .txt_box {
    width: auto;
    padding: 20px;
  }
}

.sec_ourbusiness > .in .prime .txt_box > dt {
  font-size: 28px;
  font-size: 2.8rem;
  letter-spacing: 0.1em;
  line-height: 1.6;
  margin-bottom: 15px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .txt_box > dt {
    font-size: 19px;
    font-size: 1.9rem;
    letter-spacing: 0.18em;
    line-height: 1.3;
  }
}

.sec_ourbusiness > .in .prime .txt_box > dd {
  font-size: 14px;
  font-size: 1.4rem;
  letter-spacing: 0.06em;
  line-height: 2;
  text-align: justify;
  text-justify: inter-ideograph;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .txt_box > dd {
    font-size: 12px;
    font-size: 1.2rem;
    letter-spacing: 0.05em;
    line-height: 1.6;
  }
}

.sec_ourbusiness > .in .prime .txt_box > dd span > span {
  display: inline-block;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .txt_box > dd span > span {
    display: none;
  }
}

.sec_ourbusiness > .in .prime .txt_box .em0 {
  width: 0em;
}

.sec_ourbusiness > .in .prime .txt_box .em1 {
  width: 0.6em;
}

.sec_ourbusiness > .in .prime .txt_box .em2 {
  width: 1.2em;
}

.sec_ourbusiness > .in .prime .txt_box .em3 {
  width: 1.8em;
}

.sec_ourbusiness > .in .prime .txt_box .em4 {
  width: 2.4em;
}

.sec_ourbusiness > .in .prime .txt_box .em5 {
  width: 3.0em;
}

.sec_ourbusiness > .in .prime .txt_box .em6 {
  width: 3.6em;
}

.sec_ourbusiness > .in .prime .ph {
  position: absolute;
  z-index: 0;
  right: 0;
  top: 0;
  width: 375px;
  height: 420px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .ph {
    position: relative;
    width: 100%;
    height: 184px;
  }
}

.sec_ourbusiness > .in .prime .ph:before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 420px 110px 0 0;
  border-color: #273F68 transparent transparent transparent;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .prime .ph:before {
    right: 0;
    border-width: 32px calc(100vw - 32px) 0 0;
  }
}

.sec_ourbusiness > .in .business_box {
  position: relative;
  background-color: #F7F7F7;
  padding: 95px 0 50px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box {
    padding: 0 0 16px;
  }
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box + .business_box {
    padding: 16px 0;
  }
}

.sec_ourbusiness > .in .business_box:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 200px;
  background-color: #ececec;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box:before {
    height: 115px;
  }
}

.sec_ourbusiness > .in .business_box .detail {
  max-width: 1000px;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
}

.sec_ourbusiness > .in .business_box .detail > dt {
  position: absolute;
  top: -35px;
  left: 50%;
  right: -50vw;
  z-index: 2;
  margin-left: -30px;
  font-size: 28px;
  font-size: 2.8rem;
  font-family: 'Palanquin',"Yu Gothic",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",verdana,"メイリオ",Meiryo, sans-serif;
  font-weight: 400;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: 1;
  color: #fff;
  background-color: #273F68;
  height: 120px;
  padding: 0 60px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dt {
    position: static;
    margin-left: 0;
    font-size: 22px;
    font-size: 2.2rem;
    height: 60px;
    padding: 0;
    text-align: center;
  }
}

.sec_ourbusiness > .in .business_box .detail > dt span:before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.sec_ourbusiness > .in .business_box .detail > dd {
  position: relative;
  padding-left: 540px;
  padding-top: 105px;
}

@media print, screen and (min-width: 768px) and (max-width: 1100px) {
  .sec_ourbusiness > .in .business_box .detail > dd {
    padding-left: 50%;
  }
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd {
    width: calc(100% - 32px);
    margin-left: 16px;
    margin-right: 16px;
    padding: 0;
    background-color: #fff;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd:before {
  content: '';
  display: block;
  height: 350px;
  position: absolute;
  z-index: 0;
  left: 210px;
  right: -110px;
  top: -65px;
  border: 1px solid #DCDCDC;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd:before {
    content: none;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd:before {
  content: none;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd {
    padding: 0 20px !important;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd .ph {
  position: absolute;
  top: 35px;
  width: 470px;
  height: 285px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd .ph {
    position: relative !important;
    top: 0;
    z-index: 1;
    width: 100%;
    height: 0;
    padding-bottom: 60%;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd .txt_box {
  max-width: 505px;
  top: -10px;
  min-height: 0;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd .txt_box {
    max-width: 100%;
    position: static;
    padding-left: 0;
    padding-right: 0;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r {
  padding-left: 495px;
  padding-right: 0;
}

@media print, screen and (min-width: 768px) and (max-width: 1100px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r {
    padding-left: 50%;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .ph {
  left: 70px !important;
  right: auto !important;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .ph {
    left: 0 !important;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .txt_box {
  top: -30px;
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .txt_box .mod_under_ttl04 {
  text-align: left;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .txt_box .mod_under_ttl04 {
    text-align: center;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .txt_box .mod_under_ttl04:after {
  right: auto;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_r .txt_box .mod_under_ttl04:after {
    right: 0;
    left: 0;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_l {
  padding-left: 0;
  padding-right: 495px;
}

@media print, screen and (min-width: 768px) and (max-width: 1100px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_l {
    padding-right: 50%;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_l .ph {
  right: 70px !important;
  left: auto !important;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd + dd.ph_l .ph {
    right: 0 !important;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd + dd.ph_l .txt_box {
  top: -40px;
}

.sec_ourbusiness > .in .business_box .detail > dd .txt_box {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  padding: 45px;
  max-width: 460px;
  min-height: 440px;
  position: relative;
  z-index: 0;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd .txt_box {
    padding: 20px;
    max-width: 100%;
    min-height: 0;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd .txt_box:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.8);
}

.sec_ourbusiness > .in .business_box .detail > dd .ph {
  width: 820px;
  height: 520px;
  position: absolute;
  z-index: 0;
  left: -200px;
  top: 0;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd .ph {
    width: 100%;
    height: 0;
    padding-bottom: 60%;
    position: static;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd .mod_under_ttl04 {
  z-index: 1;
  text-align: left;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd .mod_under_ttl04 {
    text-align: center;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd .mod_under_ttl04:after {
  right: auto;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd .mod_under_ttl04:after {
    right: 0;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd .txt {
  position: relative;
  z-index: 1;
  text-align-last: left;
  text-align: justify;
  text-justify: inter-ideograph;
  font-size: 1.6rem;
  line-height: 1.7;
  letter-spacing: .02em;
}

.ie .sec_ourbusiness > .in .business_box .detail > dd .txt {
  -webkit-font-feature-settings: normal;
          font-feature-settings: normal;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box .detail > dd .txt {
    font-size: 1.2rem;
    line-height: 1.5;
    letter-spacing: .02em;
  }
}

.sec_ourbusiness > .in .business_box .detail > dd .txt + .txt {
  margin-top: 1em;
}

.sec_ourbusiness > .in .business_box.rev .detail > dt {
  text-align: right;
  left: -50vw;
  right: 50%;
  margin-left: auto;
  margin-right: -30px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dt {
    text-align: center;
    position: static;
    margin: 0;
  }
}

.sec_ourbusiness > .in .business_box.rev .detail > dd {
  padding-left: 0;
  padding-right: 540px;
}

@media print, screen and (min-width: 768px) and (max-width: 1100px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd {
    padding-right: 50%;
  }
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd {
    padding: 0;
  }
}

.sec_ourbusiness > .in .business_box.rev .detail > dd:before {
  left: -110px;
  right: 210px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd:before {
    content: none;
  }
}

.sec_ourbusiness > .in .business_box.rev .detail > dd .mod_under_ttl04 {
  text-align: right;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd .mod_under_ttl04 {
    text-align: center;
  }
}

.sec_ourbusiness > .in .business_box.rev .detail > dd .mod_under_ttl04:after {
  left: auto;
  right: 0;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd .mod_under_ttl04:after {
    left: 0;
  }
}

.sec_ourbusiness > .in .business_box.rev .detail > dd .ph {
  left: auto;
  right: -200px;
}

@media screen and (max-width: 767px) {
  .sec_ourbusiness > .in .business_box.rev .detail > dd .ph {
    position: static;
  }
}

.sec_ourbusiness > .in #INFRA {
  /*
			@include sc(pc){
			margin-top:-80px;
			padding-top:80px !important;
			}
*/
}

/*
.mod_project {
	padding:100px 0 65px;
	background-color: $bcff;

	@include sc(sp) {
		padding:40px 16px;
	}

	.mod_txt01 {

		@include sc(pc) {
			margin-bottom:80px;
		}
	}

	.stories {
		@include sc(pc) {
			display:flex;
			justify-content:space-between;
		}
		li {

			@include sc(pc) {
				width:calc(100% / 3);
			}
			@include sc(sp) {
				& + li {
					margin-top:4px;
				}//& + li
			}
			&.current {
				a {
					filter:brightness(1.4);
					opacity:.8;
					pointer-events:none;
				}
			}
		}//li

		a {
			display:block;
			height:430px;
			color:$bcff;
			text-align:center;
			position:relative;
			transition:filter .5s,opacity .5s;
			@extend %vertmiddle;

			@include sc(sp) {
				height:210px;
			}

			.no-touchevents &:hover {
				filter:brightness(1.4);
				opacity:.8;
			}//.no-touvevents &:hover
		}
		dl {
			&:after {
				content:"";
				display:block;
				width:0;
				height:0;
				border-left:10px solid transparent;
				border-top:10px solid transparent;
				border-right:10px solid $bcr01;
				border-bottom:10px solid $bcr01;
				position:absolute;
				right:0;
				bottom:0;
				@include sc(sp) {
					border-left-width:5px;
					border-top-width:5px;
					border-right-width:5px;
					border-bottom-width:5px;
				}
			}//&:after
		}
		dt {
			position:relative;
			@include f_pala;
			@include fz(46);
			line-height:1;
			padding-bottom:20px;

			@include sc(sp) {
				padding-bottom:10px;
				@include fz(23);
			}
			&:after {
				content:"";
				display:block;
				margin:0 auto;
				width:30px;
				height:2px;
				background-color:$bcr01;
				position:absolute;
				left:0;
				right:0;
				bottom:0;
			}
		}//dt
		dd {
			@include fz(16);
			letter-spacing:.1em;
			font-weight:600;

			@include sc(sp) {
				@include fz(11);
			}
			span {
				@include f_pala;
				@include fz(34);

				@include sc(sp) {
					@include fz(18);
				}
			}//span
		}//dd
	}//.stories
}//.sec_project
*/