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


/*---------------------
　TITLE
-----------------------*/
.secTitBox {
	margin-bottom: 5rem;
}
.animTxt {
	overflow: hidden;
}
.animInr {
    overflow: hidden;
    width: 100%;
    height: auto;
    display: block;
    transform: translateY(100%);
}
.animInr.ready {
    transform: translateY(0);
    transition: transform 1.5s cubic-bezier(.19,1,.22,1) 0s;
}
.secTitBox a {
	text-decoration: none;
	background: url("img/arr_base.png") no-repeat right center;
	background-size: 2.8rem auto;
	padding: 0 5rem 0 0;
	display: inline-block;
}
.blaLabel {
	background: #000;
	font-size: 2.4rem;
	color: #fff;
	text-align: center;
	font-weight: 700;
	line-height: 1.5;
	border-radius: 0.8rem;
	padding: 3px 10px 5px;
	display: inline-block;
	margin-bottom: 1.5rem;
}
.secTit {
	font-weight: 700;
	line-height: 1.5;
}
.grad {
	font-size: 4.8rem;
	font-weight: 700;
	line-height: 1.5;
	display: inline-block;
	background: linear-gradient(90deg, #31c4b6 0%, #1e63c9 100%);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

/*---------------------
　共通
-----------------------*/
header {
}



.line {
	position: relative;
}
.line:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0;
	left: 1.5rem;
}
.line:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -0.8rem;
	left: 0;
}
.eng {
	font-size: 3rem;
	font-family: "Jost", sans-serif;
	line-height: 1.3;
	display: inline-block;
	background: linear-gradient(90deg, #31c4b6 0%, #1e63c9 100%);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}


/*---------------------
　MV
-----------------------*/

/*---------------------
　SEC01
-----------------------*/
.sec01 {
	background: #f1f4f8 url("img/sec01_bg.png") no-repeat top center;
	background-size: 100% auto;
	padding: 21rem 0 16rem;
}
.sec01 .secTitBox {
	position: relative;
	left: -8rem;
}
.sec01 .secTit {
	font-size: 4.1rem;
}
.sec01 .secTit .large {
	font-size: 6.9rem;
}
.sec01 .secTit .grad {
    font-size: 100%;
}
.sec01 .by {
	color: #777;
	font-size: 1.2rem;
	line-height: 1.6;
	margin-top: 2rem;
}
.sec01 .txtArea {
	padding: 0 0 0 13rem;
	margin: 8rem 0 10rem;
}
.sec01 .txtArea p {
	font-size: 1.6rem;
	line-height: 2.22;
}
.sec01 .hostBox {
	background: #fff;
	border-radius: 1rem 0 0 1rem;
	position: relative;
	display: flex;
}
.sec01 .hostBox:before {
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec01 .hostBox .leftBox {
	width: 28rem;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 1.5rem;
}
.sec01 .hostBox .leftBox .tit {
	font-size: 1.8rem;
	font-weight: 700;
	line-height: 1;
}
.sec01 .hostBox .leftBox .logo {
	width: 14.8rem;
}
.sec01 .hostBox .rightBox {
	flex: 1;
	padding: 3rem 0 3rem 7rem;
	position: relative;
}
.sec01 .hostBox .rightBox:before {
	content: "";
	background: rgba(0,0,0,0.2);
	width: 1px;
	height: calc(100% - 10rem);
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}



/*---------------------
　SEC02
-----------------------*/
.sec02 {
	background: #f1f4f8 url("img/sec02_bg.png") no-repeat top center;
	background-size: 100% auto;
	padding: 2rem 0 12rem;
	overflow: hidden;
}
.sec02 .wi1100 {
	position: relative;
}
.sec02 .wi1100_01:before {
	content: "";
	background: url("img/sec02_g.png") no-repeat;
	background-size: 100%;
	width: 434px;
	height: 432px;
	position: absolute;
	top: -12rem;
	left: -30rem;
}
.sec02 .wi1100_02:after {
	content: "";
	background: url("img/sec02_tree.png") no-repeat;
	background-size: 100%;
	width: 677px;
	height: 621px;
	position: absolute;
	bottom: -12rem;
	right: -28rem;
}
.sec02 .flowTxt {
    white-space: nowrap;
    display: flex;
    align-items: center;
    overflow: hidden;
	margin-bottom: 20rem;
}
.sec02 .flowTxt .txtList {
    display: flex;
    align-items: center;
	gap: 10rem;
    animation: ticker 90s linear infinite;
}
.sec02 .flowTxt .txtList > div {
    width: auto;
	height: 14.5rem;
    white-space: nowrap;
	line-height: 1;
}
.sec02 .flowTxt .txtList > div img {
    height: 100%;
	width: auto;
	max-width: inherit;
}
@keyframes ticker {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-100%);
    }
}


.sec02 .introArea {
	margin: 0 0 0 20rem;
	position: relative;
}
.sec02 .introArea:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 200%;
	height: 1px;
	position: absolute;
	top: -10rem;
	left: 1.5rem;
}
.sec02 .introArea:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -10.8rem;
	left: 0;
}
.sec02 .secTit {
	font-size: 4rem;
}
.sec02 .secTit .grad {
	margin: 0 0 0 -2rem;
}
.sec02 .introArea .txtBox {
	width: 68.5rem;
}
.sec02 .consul {
	background: #fff;
	position: relative;
	padding: 5rem 0 5rem;
}
.sec02 .consul:before {
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec02 .consul:after {
	content: "";
	background: #fff;
	width: 5rem;
	height: 100%;
	position: absolute;
	top: 0;
	left: -5rem;
	border-radius: 1rem 0 0 1rem;
}
.sec02 .consulInr:before {
	content: "";
	background: url("img/eng_it_consulting.png") no-repeat;
	background-size: 100%;
	line-height: 1;
	width: 12.2rem;
	height: 67.5rem;
	position: absolute;
    top: 18.7rem;
    left: -18rem;
    word-break: break-all;
	z-index: 1;
}
.sec02 .consul:nth-child(2) .consulInr:before {
	background: url("img/eng_it_arch.png") no-repeat;
	background-size: 100%;
	width: 9.6rem;
	height: 59.1rem;
	left: -15rem;
}
.sec02 .consul:nth-child(3) .consulInr:before {
	background: url("img/eng_pm.png") no-repeat;
	background-size: 100%;
	width: 11.7rem;
	height: 86.2rem;
}
.sec02 .consul:nth-child(4) .consulInr:before {
	background: url("img/eng_sd.png") no-repeat;
	background-size: 100%;
	width: 12.3rem;
	height: 119rem;
}
.sec02 .consul:nth-child(5) .consulInr:before {
	background: url("img/eng_marketing.png") no-repeat;
	background-size: 100%;
	width: 12.2rem;
	height: 51.9rem;
}
.sec02 .consul:nth-child(6) .consulInr:before {
	background: url("img/eng_sales.png") no-repeat;
	background-size: 100%;
	width: 9.6rem;
	height: 26.9rem;
	left: -15rem;
}
.sec02 .consul:nth-child(7) .consulInr:before {
	background: url("img/eng_it_marketing.png") no-repeat;
	background-size: 100%;
	width: 11.7rem;
	height: 101.3rem;
}
.sec02 .consul:nth-child(8) .consulInr:before {
	background: url("img/eng_it_sp.png") no-repeat;
	background-size: 100%;
	width: 12rem;
	height: 62rem;
}
.sec02 .consul .label {
	background: #1a57b1;
	font-size: 3rem;
	color: #fff;
	font-weight: 700;
	border-radius: 0 1rem 1rem 0;
	position: relative;
	padding: 2.5rem 5rem 2.5rem 0;
	line-height: 1.5;
	display: inline-block;
	margin-bottom: 3rem;
	z-index: 1;
}
.sec02 .consul .label:before {
	content: "";
	background: #1a57b1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: -100%;
}
.sec02 .consul .subTit {
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.6;
	margin-bottom: 4rem;
}
.sec02 .consul .subTit .grad {
	font-size: 5.2rem;
}
.sec02 .consul .flexBox {
	display: flex;
	gap: 5rem;
	margin-bottom: 9rem;
	position: relative;
}
.sec02 .consul .flexBox:before {
	content: "";
	background: url("img/sec02_g_blue.png") no-repeat;
	background-size: 100%;
	width: 434px;
	height: 432px;
	position: absolute;
	top: 16rem;
	right: -30rem;
}
.sec02 .consul .flexBox .thumb {
	max-width: 43.4rem;
}
.sec02 .consul .flexBox .thumb img {
	border-radius: 1rem;
}
.sec02 .consul .flexBox .txtBox {
	flex: 1;
	position: relative;
	z-index: 1;
}
.sec02 .consul .cardWrap {
	display: flex;
}
.sec02 .consul .cardBox {
	width: 50%;
	padding: 1.5rem 7rem 2rem 4rem;
	border-right: solid 1px rgba(0,0,0,0.5);
	position: relative;
	background: url("/wp/wp-content/uploads/sec02_card_icon01.png") no-repeat top 1rem right 7rem;
	background-size: 12rem auto;
}
.sec02 .consul .cardBox:last-child {
	background: url("/wp/wp-content/uploads/sec02_card_icon02.png") no-repeat top 1rem right 4rem;
	background-size: 12rem auto;
	border-right: none;
	padding: 1.5rem 4rem 2rem 7rem;
}
.sec02 .consul .cardBox .cardTit {
	font-size: 2.6rem;
	font-weight: 700;
	line-height: 1.6;
	margin-bottom: 2rem;
}
.sec02 .consul .cardBox .blaLabel {
	font-size: 1.8rem;
	margin: 0 0 5px;
	padding: 1px 10px 3px;
}
.sec02 .consul .cardBox .list {
	margin: 0 0 3rem;
	padding: 0;
}
.sec02 .consul .cardBox .list li {
	padding: 0 0 0 3rem;
	margin: 0 0 1.5rem;
	background: none;
	position: relative;
}
.sec02 .consul .cardBox .list li:last-child {
	margin: 0;
}
.sec02 .consul .cardBox .list li:before {
	content: "";
	background: #1e2635;
	width: 1.8rem;
	height: 8px;
	border-radius: 4px;
	position: absolute;
	top: 0.8rem;
	left: 0;
}
.sec02 .consul .cardBox .etc {
	position: absolute;
	bottom: 2rem;
	right: 7rem;
	margin: 0;
}
.sec02 .consul .cardBox:last-child .etc {
	right: 4rem;
}
.sec02 .tabWrap {
	margin-top: 8rem;
	position: relative;
}
.sec02 .tab-area {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	position: relative;
}
.sec02 .tab-area:before {
	content: "";
	width: 100%;
	height: 4px;
	position: absolute;
	bottom: -4px;
	left: 0;
	background: linear-gradient(90deg,rgba(43, 172, 159, 1) 0%, rgba(26, 87, 177, 1) 100%);
}
.sec02 .tab {
	width: 27.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 5rem 1rem 5rem;
	background: #d9d9d9;
	border-radius: 1rem 1rem 0 0;
	color: rgba(0,0,0,0.5);
	font-weight: 700;
	font-size: 1.8rem;
	min-height: 6.4rem;
	line-height: 1.5;
	cursor: pointer;
	transition: all 0.4s;
}
.sec02 .tab:hover {
	opacity: 0.8;
}
.sec02 .tab.active {
	background: linear-gradient(90deg,rgba(43, 172, 159, 1) 0%, rgba(26, 87, 177, 1) 100%);
    color: #fff;
	min-height: 7.4rem;
}
.sec02 .panel-area {
	position: relative;
	padding: 4rem;
}
.sec02 .panel {
    display: none;
}
.sec02 .panel.active {
  display: block;
}
.sec02 .panel .titBox {
	display: flex;
	justify-content: space-between;
	margin-bottom: 4rem;
}
.sec02 .panel .titBox .tabName {
	font-size: 1.8rem;
	font-weight: 700;
	margin: 1rem 0 0;
}
.sec02 .panel .titBox .tabName span {
	font-size: 2.6rem;
}
.sec02 .panel .titBox .blueBox {
	background: #f1f4f8;
	border-radius: 8px;
	width: 60rem;
	padding: 1rem 3rem;
	display: flex;
	align-items: center;
}
.sec02 .panel .titBox .blueBox p {
	font-size: 2rem;
	font-weight: 700;
	color: #1a57b1;
	margin: 0;
	line-height: 1.6;
}
.sec02 .panel .btn-internal {
    margin: 4rem auto 0;
}

.otherArea {
	margin-bottom: 20rem;
}
.sec02 .case {
	position: relative;
}
.sec02 .wi1100_02:before {
	content: "";
	background: url("/wp/wp-content/uploads/eng_case.png") no-repeat;
	background-size: 100%;
	width: 94px;
	height: 1022px;
	position: absolute;
	top: -85px;
	left: -130px;
	z-index: 1;
}
.sec02 .case:after {
	content: "";
	background: url("img/deco_bokashi.png") no-repeat;
	background-size: 100%;
	width: 561px;
	height: 563px;
	position: absolute;
	top: -34rem;
	right: 0;
	z-index: 1;
}
.sec02 .caseInr:before {
	content: "";
	background: #e5eaf2;
	width: 115rem;
	height: 62rem;
	position: absolute;
	top: -6rem;
	left: 0;
	border-radius: 0 1rem 1rem 0;
}
.sec02 .caseInr:after {
	content: "";
	background: #e5eaf2;
	width: 100%;
	height: 62rem;
	position: absolute;
	top: -6rem;
	left: -100%;
}

.sec02 .case .label {
	background: #000;
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.5;
	padding: 3px 15px 5px;
	border-radius: 8px;
	color: #fff;
	display: inline-block;
	margin-bottom: 1rem;
	position: relative;
	z-index:2;
}
.sec02 .case .caseTit {
	font-size: 4.2rem;
	margin-bottom: 6rem;
	position: relative;
	z-index: 1;
}
.sec02 .case .boxWrap {
	position: relative;
	z-index: 1;
	margin-bottom: 10rem;
}
.sec02 .case .boxWrap .thumb {
	max-width: 37.4rem;
	position: absolute;
	top: 5.5rem;
	left: 0;
	z-index: 1;
}
.sec02 .case .boxWrap .thumb img {
	border-radius: 1rem;
}
.sec02 .case .boxWrap .txtBox {
	background: #fff;
	position: relative;
	border-radius: 1rem 0 0 1rem;
	margin: 0 0 0 10rem;
	padding: 10rem 0 8rem 33rem;
}
.sec02 .case .boxWrap .txtBox:before {
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec02 .case .boxWrap .txtBox .row {
	margin-bottom: 5rem;
}
.sec02 .case .boxWrap .txtBox .row:last-child {
	margin-bottom: 0;
}
.sec02 .case .sumArea {
	padding: 5.5rem 5rem;
	border-top: solid 1px rgba(0,0,0,0.5);
	border-bottom: solid 1px rgba(0,0,0,0.5);
	position: relative;
}
.sec02 .case .sumArea:before {
	content: "";
	background: url("img/sec02_arrow.png") no-repeat;
	background-size: 100%;
	width: 98px;
	height: 65px;
	position: absolute;
	top: -5rem;
	left: 50%;
	transform: translateX(-50%);
}
.sec02 .case .sumArea .sumTit {
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.7;
	text-align: center;
	margin-bottom: 3rem;
}
.sec02 .case .sumArea .sumTit span {
	font-size: 4.2rem;
}

.otherArea {
	margin-top: 6rem;
	position: relative;
	z-index: 2;
}
.otherArea .otherTit {
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.6;
	padding: 0 0 3rem;
	text-align: center;
	border-bottom: solid 1px rgba(0,0,0,0.5);
	margin-bottom: 3rem;
}
.otherArea .btnWrap{
	display: flex;
	flex-wrap: wrap;
	padding: 0 2rem;
	column-gap: 4rem;
	grid-row-gap: 2rem;
}
.otherArea .otherBtn {
	width: calc(100% / 3 - 3rem);
}
.otherArea .otherBtn a {
	padding: 2rem 4rem;
	text-align: center;
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.6;
	background: #fff url("img/arr_base_up.png") no-repeat right 2.5rem center;
	background-size: 1rem auto;
	border-radius: 4rem;
	display: block;
	text-decoration: none;
}
.midasi-wrapper {
  display: flex;
  align-items: center;
  gap: 1em; 
}

.midasi-wrapper::before,
.midasi-wrapper::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(0, 0, 0, 0.5);
}

.midasi {
white-space: nowrap;
    text-align: center;
    font-size: 2.6rem;
    color: #32373c;
    font-weight: bold;
    padding: 4rem 0;
}

.sec02 .treeArea {
	margin-bottom: 6rem;
}
.sec02 .treeBox {
	position: relative;
}
.sec02 .btn-tree {
	position: absolute;
}
.sec02 .btn01 {
	/*width: 415px;
	height: 233px;*/
	top: 5rem;
	left: 1rem;
}
.sec02 .btn02 {
	/*width: 490px;
	height: 201px;*/
	top:14rem;
	left: 29.5rem;
	z-index: 1;
}
.sec02 .arrow01:before {
	bottom: 5.8rem;
	left: 54%;
}
.sec02 .btn03 {
	/*width: 597px;
	height: 185px;*/
	top: 0;
	left: 18.7rem;
}
.sec02 .btn04 {
	/*width: 471px;
	height: 217px;*/
	top: 25rem;
	left: 26rem;
}
.sec02 .btn05 {
	/*width: 290px;
	height: 150px;*/
	top: 23.6rem;
	left: 0;
}
.sec02 .btn06 {
	/*width: 250px;
	height: 128px;*/
	top: 33.6rem;
	left: 2rem;
}
.sec02 .btn07 {
	/*width: 377px;
	height: 185px;*/
	top: 6rem;
	right: 12rem;
	left: auto;
	z-index: 2;
}
.sec02 .btn07 a:before {
	bottom: 3.5rem;
	left: 58%;
}
.sec02 .btn08 {
	/*width: 475px;
	height: 301px;*/
	top: 19rem;
	left: auto;
	right: 0;
}
.sec02 .btn08 a:before {
	bottom: 10.5rem;
	left: 58%;
}
.sec02 .btn-tree a:hover {
	opacity: 1;
}
.sec02 .btn-tree img {
	height: auto;
  left: 0;
  position: absolute;
  width: 100%;
}
.sec02 .btn-tree img:last-of-type {
  opacity: 0;
  transition: opacity .4s;
	z-index: 5;
}
.sec02 .btn-tree:hover img {
  opacity: 1;
}


.contImg {
	position: absolute;
	top: 0;
	left: 0;
}
.sec02 #hoverImage {
	position:absolute;
	pointer-events:none;
}
.hoverImage {
  opacity: 0;
	visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.hoverImage.visible {
  opacity: 1;
	visibility: visible;
	transition: opacity 0.3s ease, visibility 0s 0s;
}
.sec02 .hover01 {
	width: 403px;
	height: 232px;
	top: 4.5rem;
	left: 1rem;
}
.sec02 .hover02 {
	width: 389px;
	height: 179px;
	top:13.9rem;
	left: 37.5rem;
}
.sec02 .hover03 {
	width: 562px;
	height: 184px;
	top: 0;
	left: 18.6rem;
}
.sec02 .hover04 {
	width: 446px;
	height: 217px;
	top: 23.3rem;
	left: 26rem;
}
.sec02 .hover05 {
	width: 289px;
	height: 228px;
	top: 23.6rem;
	left: 0;
}
.sec02 .hover06 {
	width: 250px;
	height: 128px;
	top: 33rem;
	left: 0.8rem;
}
.sec02 .hover07 {
	width: 328px;
	height: 184px;
	top: 6rem;
	right: 12rem;
	left: auto;
	z-index: 2;
}
.sec02 .hover08 {
	width: 408px;
	height: 300px;
	top: 18.5rem;
	left: auto;
	right: 0;
}





.consul {
  display: none;
}
.consul.active {
  display: block;
}

.modal{
    display: none;
}



/*---------------------
　SEC03
-----------------------*/
.sec03 {
	background: url("img/sec03_bg.png") no-repeat top center;
	background-size: 100% auto;
	padding: 40rem 0 14rem;
	overflow: hidden;
	position: relative;
}
.sec03 .sec03Inr:before {
	content: "";
	background: url("img/eng_laying.png") no-repeat;
	background-size: 100% auto;
	position: absolute;
	top: -27rem;
	left: -20rem;
	width: 1440px;
	height: 164px;
	z-index: 1;
	white-space: nowrap;
}
.sec03 .wi1100 {
	position: relative;
}
.sec03 .wi1100:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 200%;
	height: 1px;
	position: absolute;
	top: -6rem;
	left: 1.5rem;
}
.sec03 .wi1100:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -6.8rem;
	left: 0;
}
.sec03 .introArea {
	position: relative;
}
.sec03 .introArea:before {
	content: "";
	background: url("img/sec03_pic_intro.jpg") no-repeat;
	background-size: 100%;
	width: 641px;
	height: 554px;
	border-radius: 1rem;
	position: absolute;
	top: -15rem;
	right: -25rem;
	z-index: -1;
}
.sec03 .leftBox {
	max-width: 68rem;
}
.sec03 .secTit {
	font-size: 4.8rem;
}
.sec03 .leftBox p {
	padding: 0 5rem 0 0;
}
.sec03 .tabWrap {
	margin-top: 16rem;
	position: relative;
}
.sec03 .tab-area {
    display: flex;
	flex-direction: column;
	background: #1a57b1;
	border-radius: 0 1rem 1rem 0;
	width: 35.5rem;
	padding: 4rem 3rem 4rem 0;
	gap: 2rem;
	position: absolute;
	top: -5rem;
	left: 0;
	z-index: 1;
}
.sec03 .tab-area:before {
    content: "";
	background: #1a57b1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: -100%;
}
.sec03 .tab.one {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 5rem 1rem 6rem;
	background: url("/wp/wp-content/uploads/sec03_icon_build01_wt.png") no-repeat left 2rem center, url("img/arr_base_wh.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: rgba(255,255,255,0.5);
	border-radius: 4rem;
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	min-height: 7.6rem;
	line-height: 1.5;
	transition: all 0.4s;
	cursor: pointer;
}
.sec03 .tab.two {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 5rem 1rem 6rem;
	background: url("/wp/wp-content/uploads/sec03_icon_build02_wt.png") no-repeat left 2rem center, url("img/arr_base_wh.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: rgba(255,255,255,0.5);
	border-radius: 4rem;
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	min-height: 7.6rem;
	line-height: 1.5;
	transition: all 0.4s;
	cursor: pointer;
}
.sec03 .tab.three {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 5rem 1rem 6rem;
	background: url("/wp/wp-content/uploads/sec03_icon_build03_wt.png") no-repeat left 2rem center, url("img/arr_base_wh.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: rgba(255,255,255,0.5);
	border-radius: 4rem;
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	min-height: 7.6rem;
	line-height: 1.5;
	transition: all 0.4s;
	cursor: pointer;
}
.sec03 .tab.four {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 1rem 5rem 1rem 6rem;
	background: url("/wp/wp-content/uploads/sec03_icon_build04_wt.png") no-repeat left 2rem center, url("img/arr_base_wh.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: rgba(255,255,255,0.5);
	border-radius: 4rem;
	color: #fff;
	font-weight: 700;
	font-size: 1.8rem;
	min-height: 7.6rem;
	line-height: 1.5;
	transition: all 0.4s;
	cursor: pointer;
}
.sec03 .tab:hover {
    opacity: 0.6;
}
.sec03 .tab.one.active {
	background: url("/wp/wp-content/uploads/sec03_icon_build01.png") no-repeat left 2rem center, url("img/arr_base.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: #fff;
    color: #1a57b1;
}
.sec03 .tab.two.active {
	background: url("/wp/wp-content/uploads/sec03_icon_build02.png") no-repeat left 2rem center, url("img/arr_base.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: #fff;
    color: #1a57b1;
}
.sec03 .tab.three.active {
	background: url("/wp/wp-content/uploads/sec03_icon_build03.png") no-repeat left 2rem center, url("img/arr_base.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: #fff;
    color: #1a57b1;
}
.sec03 .tab.four.active {
	background: url("/wp/wp-content/uploads/sec03_icon_build04.png") no-repeat left 2rem center, url("img/arr_base.png") no-repeat right 2rem center;
	background-size: 36px auto ,18px auto;
    background-color: #fff;
    color: #1a57b1;
}
.sec03 .panel-area {
	background-color: #f1f4f8;
    width: 850px; 
    border-radius: 0 0 0 1rem;
	position: relative;
	padding: 5rem 0 5rem 16rem;
	margin: 0 0 0 25rem;
}
.sec03 .panel-area:before {
    content: "";
    background-color: #f1f4f8;
    width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec03 .panel {
    display: none;
}
.sec03 .panel.active {
  display: block;
}
.sec03 .subTitBox {
	display: flex;
	align-items: center;
	gap: 2rem;
	margin-bottom: 2.5rem;
}
.sec03 .subTitBox .icon {
	background: #fff;
	border-radius: 50%;
	width: 10rem;
	height: 10rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.sec03 .subTitBox .icon img {
    width: 64%;
}
.sec03 .subTitBox .subTit {
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.6;
}
.sec03 .subTitBox .subTit span {
	font-size: 3rem;
}
.sec03 .pointBox {
	display: flex;
	border-radius: 1rem;
	overflow: hidden;
	margin-bottom: 4rem;
}
.sec03 .pointBox .titBox {
	background: linear-gradient(90deg,rgba(43, 172, 159, 1) 0%, rgba(26, 87, 177, 1) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 12.6rem;
}
.sec03 .pointBox .titBox img {
	width: 5.3rem;
	height: auto;
}
.sec03 .pointBox .txtBox {
	background: #fff;
	flex: 1;
	padding: 2rem 3rem 2rem 3.5rem;
}
.sec03 .pointBox .txtBox p {
	font-size: 1.6rem;
	font-weight: 700;
}
.sec03 .btn-internal {
	margin: 3rem auto 0;
}



/*---------------------
　SEC04
-----------------------*/
.sec04 {
	padding: 12rem 0 14rem;
	background: url("img/sec04_bg.jpg") no-repeat top center;
	background-size: 100% auto;
}
.sec04 .line {
	padding: 6rem 0 0;
	position: relative;
}
.sec04 .wi1100 {
	position: relative;
}
.sec04 .wi1100:after {
	content: "";
	background: url("img/eng_challenge.png") no-repeat;
	background-size: 100% auto;
	width: 163px;
	height: 1659px;
	position: absolute;
    top: -85px;
    right: -20rem;
    word-break: break-all;
}
.sec04 .secTit {
	font-size: 3.6rem;
}
.sec04 .flexBox {
	display: flex;
	justify-content: space-between;
	margin-bottom: 7rem;
}
.sec04 .flexBox .txtBox {
	max-width: 35rem;
}
.sec04 .flexBox .txtBox p:first-child {
	margin-top: 0;
}
.sec04 .parts_ivee {
	margin: 0;
	max-width: 67rem;
}
.sec04 .ivArea .eng {
	width: 11.8rem;
	line-height: 1;
}
.sec04 .ivArea .subTit {
	font-size: 3.6rem;
	font-weight: 700;
	line-height: 1.6;
	margin-bottom: 6rem;
}
.sec04 .ivArea .ivBox {
	position: relative;
	display: flex;
	justify-content: flex-end;
}
.sec04 .ivArea .ivBox .pic {
	width: 32.2rem;
	position: absolute;
	top: 3rem;
	left: 1rem;
	z-index: 1;
}
.sec04 .ivArea .txtBody {
	max-width: 85rem;
	background: #f1f4f8;
	border-radius: 1rem 0 0 1rem;
	padding: 7rem 0 5rem 13rem;
	position: relative;
}
.sec04 .ivArea .txtBody:before {
	content: "";
	background: #f1f4f8;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec04 .ivArea .txtBody:after {
	content: "";
	background: url("img/sec04_g.png") no-repeat;
	background-size: 100%;
	width: 39.2rem;
	height: 39rem;
	position: absolute;
	bottom: -6.5rem;
	left: -30rem;
	z-index: -1;
}
.sec04 .ivArea .txtBody p:first-child {
	margin-top: 0;
}
.sec04 .ivArea .txtBody .per {
	font-weight: 700;
}
.sec04 .ivArea .btn-internal{
	margin: 4rem auto 0;
}

/*---------------------
　SEC05
-----------------------*/
.contents .sec05 {
	overflow: hidden;
	margin: 0;
}
.contents .sec05:before {
    content: none;
}
.contents .sec05 .topBox {
	background: #141e32 url("img/sec05_bg_pic.png") no-repeat top center;
	background-size: cover;
    width: 100%;
    padding: 16rem 0 11rem;
    left: auto;
}
.contents .parts_sv .topBox:after {
    content: none;
}
.contents .parts_sv .topBox .wi1100 {
	position: relative;
}
.contents .parts_sv .topBox .wi1100:after {
	content: "";
    background: url("img/eng_spon.png") no-repeat;
	background-size: 100%;
	width: 97.5rem;
	height: 16.1rem;
    position: absolute;
    bottom: auto;
	top: -10rem;
    right: -22rem;
}
.contents .sec05 .topBox .tit:after {
    width: 200%;
    right: auto;
    left: 13rem;
}
.sec05 .secTit {
    font-size: 3.6rem;
	color: #fff;
}
.sec05 .secTit .grad {
    font-size: 4rem;
    display: inline-block;
    background: linear-gradient(90deg, #4ed2c6 0%, #3788ff 100%);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}
.contents .sec05 .txtArea {
    position: relative;
	margin-top: 3rem;
}
.sec05 .secTitBox {
    max-width: 64rem;
}
.sec05 .cap {
    width: 40rem;
	position: absolute;
	top: 0;
	right: 0;
}
.sec05 .txt {
    max-width: 64rem;
	color: #fff;
}
.sec05 .btmBox {
	background: #f1f4f8 url("img/sec05_bg_rep.png") repeat-y top center;
	background-size: 100% auto;
	padding: 0 0 12rem;
}
.sec05 .rowBoxWrap {
	margin-top: -6rem;
}
.sec05 .rowBox {
	position: relative;
	margin-bottom: 11rem;
}
.sec05 .rowBox:nth-child(2n) {
	display: flex;
    flex-direction: row-reverse;
}
.sec05 .rowBox:last-child {
	margin-bottom: 0;
}
.sec05 .rowBox .txtBox {
	background: #fff;
	max-width: 79rem;
	border-radius: 1rem;
	padding: 4rem 12rem 4rem 5rem;
	min-height: 39rem;
}
.sec05 .rowBox:nth-child(2n) .txtBox {
	padding: 4rem 5rem 4rem 12rem;
}
.sec05 .rowBox .pic {
	width: 37.4rem;
	position: absolute;
	top: -5rem;
	right: 0;
}
.sec05 .rowBox:nth-child(2n) .pic {
	right: auto;
	left: 0;
}
.sec05 .rowBox .pic img {
	border-radius: 1rem;
}
.contents .sec05 .btns-flex {
	margin-top: 6rem;
}




/*---------------------
　SEC06
-----------------------*/
.sec06 {
	padding: 30rem 0 10rem;
	overflow: hidden;
}
.sec06 .wi1100 {
	position: relative;
}
.sec06 .wi1100:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 200%;
	height: 1px;
	position: absolute;
	top: -7rem;
	left: 1.5rem;
}
.sec06 .wi1100:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -7.8rem;
	left: 0;
}
.sec06 .sec06Inr:before {
	content: "";
	background: url("img/eng_know.png") no-repeat;
	background-size: 100%;
	width: 77.3rem;
	height: 16.4rem;
	position: absolute;
	top: -22rem;
	right: -22rem;
	line-height: 1;
	z-index: -1;
}
.sec06 .itemBoxWrap {
	display: flex;
	flex-wrap: wrap;
	gap: 6rem;
}
.sec06 .itemBox {
	width: 52rem;
	border-top: solid 1px rgba(0,0,0,0.5);
}
.sec06 .itemBox a {
	padding: 3rem 1rem 2rem;
	display: block;
	text-decoration: none;
	background: url("img/arr_ccl.png") no-repeat bottom right;
	background-size: 7rem auto;
}
.sec06 .itemBox .titBox {
	display: flex;
	align-items: center;
	gap: 2rem;
}
.sec06 .itemBox .ccl {
	width: 9rem;
}
.sec06 .itemBox .ccl img {
	border-radius: 50%;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
}
.sec06 .itemBox .subTit {
	font-size: 1.8rem;
	font-weight: 700;
	line-height: 1.5;
}
.sec06 .itemBox .subTit span {
	font-size: 2.6rem;
}
.sec06 .itemBox .txtBox {
	padding: 0 1rem;
}







@media screen and (max-width: 480px) {

/*---------------------
　TITLE
-----------------------*/
.secTitBox {
	margin-bottom: 3rem;
}
.blaLabel {
	font-size: 1.6rem;
	font-weight: 700;
	border-radius: 0.6rem;
	padding: 4px 8px 5px;
	margin-bottom: 1.5rem;
}
.secTit {
	line-height: 1.6;
}
.secTitBox a {
	background: url("img/arr_base.png") no-repeat right center;
	background-size: 1.8rem auto;
	padding: 0 3rem 0 0;
}
.grad {
	font-size: 2.5rem;
	line-height: 1.5;
	display: inline;
}


/*---------------------
　共通
-----------------------*/
header {
}
header .rightBox {
	display: none;
}
header .menuList {
	display: flex;
	align-items: center;
	gap: 4rem;
}
header .menuList .menu {
	text-align: center;
	line-height: 1.6;
}
header .menuList .menu a {
	text-decoration: none;
	font-weight: 700;
}


.line {
	position: relative;
}
.line:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 100%;
	height: 1px;
	position: absolute;
	top: 0;
	left: 1.5rem;
}
.line:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -0.8rem;
	left: 0;
}
.eng {
	font-size: 3rem;
	font-family: "Jost", sans-serif;
	line-height: 1.3;
	display: inline-block;
	background: linear-gradient(90deg, #31c4b6 0%, #1e63c9 100%);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}


/*---------------------
　MV
-----------------------*/

/*---------------------
　SEC01
-----------------------*/
.sec01 {
	background: #f1f4f8 url("img/sec01_bg_sp.png") no-repeat top 1rem center;
	background-size: 100% auto;
	padding: 15rem 5.3% 6rem;
}
.sec01 .secTitBox {
	position: relative;
	left: auto;
}
.sec01 .secTit {
	font-size: 1.9rem;
}
.sec01 .secTit .large {
	font-size: 2.5rem;
}
.sec01 .secTit .grad {
    font-size: 3rem;
}
.sec01 .by {
	font-size: 1.1rem;
	line-height: 1.6;
	margin-top: 1.5rem;
}
.sec01 .txtArea {
	padding: 0;
	margin: 3rem 0 3rem;
}
.sec01 .txtArea p {
	font-size: 1.6rem;
	line-height: 2;
}
.sec01 .hostBox {
	border-radius: 0.6rem 0 0 0.6rem;
	display: flex;
	flex-direction: column;
	padding: 0 0 0 2rem;
}
.sec01 .hostBox .leftBox {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
	gap: 1.5rem;
	padding: 3rem 0 2.5rem;
}
.sec01 .hostBox .leftBox .tit {
	font-size: 1.3rem;
}
.sec01 .hostBox .leftBox .logo {
	width: 11rem;
}
.sec01 .hostBox .rightBox {
	flex: 1;
	padding: 1rem 0 2rem 0;
	position: relative;
}
.sec01 .hostBox .rightBox:before {
	width: 100%;
	height: 1px;
	top: 0;
	left: 0;
	transform: inherit;
}



/*---------------------
　SEC02
-----------------------*/
.sec02 {
	background: #f1f4f8 url("img/sec02_bg_sp.png") no-repeat top center;
	background-size: 100% auto;
	padding: 2rem 5.4% 6rem;
}
.sec02 .wi1100 {
	position: relative;
}
.sec02 .wi1100_01:before {
	content: "";
	background: url("img/sec02_g.png") no-repeat;
	background-size: 100%;
	width: 131px;
	height: 130px;
	position: absolute;
	top: -2rem;
	left: auto;
	right: -3rem;
}
.sec02 .wi1100_02:after {
	content: "";
	background: url("img/sec02_tree.png") no-repeat;
	background-size: 100%;
	width: 338px;
	height: 310px;
	position: absolute;
	bottom: -6rem;
	right: -9rem;
}
.sec02 .flowTxt {
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	margin-bottom: 7rem;
}
.sec02 .flowTxt .txtList {
	gap: 7rem;
}
.sec02 .flowTxt .txtList > div {
	height: 6.6rem;
}


.sec02 .introArea {
	margin: 0;
	position: relative;
}
.sec02 .introArea:before {
	top: -4rem;
	left: 1.5rem;
}
.sec02 .introArea:after {
	top: -4.9rem;
}
.sec02 .secTit {
	font-size: 2rem;
}
.sec02 .secTit .grad {
	margin: 0 0 0 -1rem;
}
.sec02 .introArea .txtBox {
	width: 100%;
}
.sec02 .consul {
	background: #fff;
	position: relative;
	padding: 3rem 0 3rem;
	border-radius: 0.6rem 0 0 0.6rem;
}
.sec02 .consul:before {
	content: "";
	background: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec02 .consul:after {
	content: none;
}
.sec02 .consulInr:before {
	background: url("img/eng_it_consulting_sp.png") no-repeat;
	background-size: 100%;
	width: 17rem;
	height: 3.1rem;
    top: 17rem;
    left: auto;
	right: 0;
}
.sec02 .consul:nth-child(2) .consulInr:before {
	background: url("img/eng_it_arch_sp.png") no-repeat;
	background-size: 100%;
	width: 14.8rem;
	height: 2.5rem;
	left: auto;
}
.sec02 .consul:nth-child(3) .consulInr:before {
	background: url("img/eng_pm_sp.png") no-repeat;
	background-size: 100%;
	width: 22rem;
	height: 3rem;
	top: 20rem;
	left: auto;
}
.sec02 .consul:nth-child(4) .consulInr:before {
	background: url("img/eng_sd_sp.png") no-repeat;
	background-size: 100%;
	width: 29.8rem;
	height: 3.1rem;
	left: auto;
	top: 20rem;
}
.sec02 .consul:nth-child(5) .consulInr:before {
	background: url("img/eng_marketing_sp.png") no-repeat;
	background-size: 100%;
	width: 13rem;
	height: 3rem;
	left: auto;
}
.sec02 .consul:nth-child(6) .consulInr:before {
	background: url("img/eng_sales_sp.png") no-repeat;
	background-size: 100%;
	width: 6.8rem;
	height: 2.5rem;
	left: auto;
}
.sec02 .consul:nth-child(7) .consulInr:before {
	background: url("img/eng_it_marketing_sp.png") no-repeat;
	background-size: 100%;
	width: 25.4rem;
	height: 3rem;
	left: auto;
	top: 20rem;
}
.sec02 .consul:nth-child(8) .consulInr:before {
	background: url("img/eng_it_sp_sp.png") no-repeat;
	background-size: 100%;
	width: 15.5rem;
	height: 3rem;
	left: auto;
}
.sec02 .consul .label {
	font-size: 1.6rem;
	border-radius: 0 0.6rem 0.6rem 0;
	padding: 2rem 2rem 2rem 1rem;
	display: inline-block;
	margin-bottom: 3rem;
}
.sec02 .consul .subTit {
	font-size: 1.8rem;
	margin-bottom: 5rem;
	text-align: left;
	padding: 0 0 0 2rem;
}
.sec02 .consul .subTit .grad {
	font-size: 2.5rem;
}
.sec02 .consul .flexBox {
	display: flex;
	flex-direction: column;
	gap: 3rem;
	margin-bottom: 3rem;
	position: relative;
	padding: 0 0 0 2rem;
}
.sec02 .consul .flexBox:before {
	content: none;
}
.sec02 .consul .flexBox .thumb {
	max-width: 26rem;
	margin: 0 auto;
}
.sec02 .consul .flexBox .thumb img {
	border-radius: 0.6rem;
}
.sec02 .consul .flexBox .txtBox {
}
.sec02 .consul .cardWrap {
	display: flex;
	flex-direction: column;
	padding: 0 0 0 2rem;
}
.sec02 .consul .cardBox {
	width: 100%;
	padding: 1.5rem 0 2rem 0;
	border-right: none;
	border-top: solid 1px rgba(0,0,0,0.5);
	position: relative;
	background: url("img/sec02_card_icon.png") no-repeat top 2rem right 0.5rem;
	background-size: 6rem auto;
}
.sec02 .consul .cardBox:last-child {
	background: url("img/sec02_card_icon.png") no-repeat top 2rem right 0.5rem;
	background-size: 6rem auto;
	border-bottom: solid 1px rgba(0,0,0,0.5);
	padding: 1.5rem 0 2rem 0;
}
.sec02 .consul .cardBox .cardTit {
	font-size: 2rem;
	line-height: 1.6;
	margin-bottom: 2rem;
}
.sec02 .consul .cardBox .blaLabel {
	font-size: 1.3rem;
	margin: 0 0 5px;
	padding: 1px 10px 3px;
}
.sec02 .consul .cardBox .list {
	margin: 0 0 3rem;
	padding: 0;
}
.sec02 .consul .cardBox .list li {
	padding: 0 0 0 2.5rem;
	margin: 0 0 1.5rem;
	background: none;
	position: relative;
}
.sec02 .consul .cardBox .list li:before {
	width: 1.5rem;
	height: 6px;
	border-radius: 4px;
	top: 0.9rem;
}
.sec02 .consul .cardBox .etc {
	position: absolute;
	bottom: 2rem;
	right: 0rem;
	margin: 0;
	text-align: right;
}
.sec02 .consul .cardBox:last-child .etc {
	right: 0rem;
}
.sec02 .tabWrap {
	margin-top: 4rem;
	padding: 0 0 0 2rem;
}
.sec02 .tab-area {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	flex-wrap: wrap;
	position: relative;
	grid-row-gap: 1.5rem;
	padding-bottom: 1.5rem;
}
.sec02 .tab {
	width: calc(100% / 2 - 0.5rem);
    padding: 0.5rem;
	border-radius: 0.6rem;
	font-size: 1.5rem;
	min-height: 5.3rem;
	line-height: 1.5;
	position: relative;
}
.sec02 .tab:hover {
	opacity: 1;
}
.sec02 .tab.active {
	min-height: 5.3rem;
}
.sec02 .tab.active:before {
	content: "";
	background: url("img/sec02_tab_arrow.png") no-repeat;
	background-size: 100%;
	width: 12px;
	height: 10px;
	position: absolute;
	bottom: -0.9rem;
	left: 50%;
	transform: translateX(-50%);
}
.sec02 .panel-area {
	position: relative;
	padding: 2rem 0 2rem;
}
.sec02 .panel .titBox {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	margin-bottom: 3rem;
}
.sec02 .panel .titBox .tabName {
	font-size: 1.3rem;
	margin: 1rem 0 0;
}
.sec02 .panel .titBox .tabName span {
	font-size: 2rem;
}
.sec02 .panel .titBox .blueBox {
	margin: 2rem 0 0;
	border-radius: 0.6rem;
	width: 100%;
	padding: 1rem 2rem;
	display: flex;
	align-items: center;
}
.sec02 .panel .titBox .blueBox p {
	font-size: 1.9rem;
	line-height: 1.6;
}
.sec02 .panel .btn-internal {
    margin: 3rem auto 0;
}


.sec02 .case {
	position: relative;
}
.sec02 .wi1100_02:before {
    width: 33px;
    height: 358px;
    top: 0px;
    left: auto;
    right: -15px;
    z-index: 2;
}
.sec02 .case:after {
	content: "";
	background: url("img/deco_bokashi.png") no-repeat;
	background-size: 100%;
	width: 280px;
	height: 280px;
	top: -18rem;
	right: -12%;
	z-index: 1;
}
.sec02 .caseInr:before {
	content: "";
	background: #e5eaf2;
	width: 100%;
	height: 48.5rem;
	position: absolute;
	top: -3rem;
	left: 0;
	border-radius: 0 0.6rem 0.6rem 0;
}
.sec02 .caseInr:after {
	content: "";
	background: #e5eaf2;
	width: 100%;
	height: 48.5rem;
	position: absolute;
	top: -3rem;
	left: -100%;
}
.sec02 .case .label {
	font-size: 1.6rem;
	padding: 3px 15px 5px;
	border-radius: 6px;
	margin-bottom: 1rem;
	width: 95%;
	position: relative;
	z-index: 3;
}
.sec02 .case .caseTit {
	font-size: 2.3rem;
	margin-bottom: 4rem;
}
.sec02 .case .boxWrap {
	position: relative;
	z-index: 1;
	margin-bottom: 6rem;
	margin-top: 13rem;
}
.sec02 .case .boxWrap .thumb {
	max-width: 18.7rem;
	position: absolute;
	top: -11rem;
	left: 26%;
	z-index: 1;
}
.sec02 .case .boxWrap .thumb img {
	border-radius: 0.6rem;
}
.sec02 .case .boxWrap .txtBox {
	background: #fff;
	position: relative;
	border-radius: 0.6rem 0 0 0.6rem;
	margin: 0;
	padding: 13rem 0 3rem 2rem;
}
.sec02 .case .boxWrap .txtBox .row {
	margin-bottom: 3rem;
}
.sec02 .case .sumArea {
	padding: 3rem 0rem;
	border-top: solid 1px rgba(0,0,0,0.5);
	border-bottom: solid 1px rgba(0,0,0,0.5);
	position: relative;
}
.sec02 .case .sumArea:before {
	width: 64px;
	height: 44px;
	position: absolute;
	top: -3rem;
}
.sec02 .case .sumArea .sumTit {
	font-size: 1.9rem;
	line-height: 1.7;
	margin-bottom: 3rem;
}
.sec02 .case .sumArea .sumTit span {
	font-size: 2.3rem;
}

.otherArea {
	margin-top: 4rem;
	margin-bottom: 12rem;
}
.otherArea .otherTit {
	font-size: 1.9rem;
	padding: 0 0 2rem;
	margin-bottom: 3rem;
}
.otherArea .btnWrap{
	display: flex;
	flex-wrap: wrap;
	padding: 0;
	column-gap: 1rem;
	grid-row-gap: 1.5rem;
}
.otherArea .otherBtn {
	width: calc(50% - 0.5rem);
}
.otherArea .otherBtn a {
	padding: 1rem 2rem 1rem 1rem;
	font-size: 1.3rem;
	background: #fff url("img/arr_base_up.png") no-repeat right 1.5rem center;
	background-size: 0.7rem auto;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.midasi-wrapper {
  display: flex;
  align-items: center;
  gap: 1em; 
	margin-top: 3rem;
}

.midasi {
        font-size: 2rem;
        padding: 0;
}
	
.sec02 .able-scr {
    text-align: center;
    margin: 2rem 0 2rem;
}
.sec02 .treeArea {
	margin-bottom: 2rem;
	overflow-y: hidden;
	overflow-x: auto;
	padding: 0 0 1rem;
}
.sec02 .treeBox {
	position: relative;
	width: 55rem;
}
.sec02 .btn-tree {
	position: absolute;
}
.sec02 .btn-tree a:before {
	content: none;
}
.sec02 .btn-tree a:hover:before {
	opacity: 1;
}
.sec02 .btn01 {
	width: 207px;
	height: 116px;
	top: 2.5rem;
	left: 0.5rem;
}
.sec02 .btn02 {
    width: 245px;
    height: 100px;
    top: 7rem;
    left: 14rem;
    z-index: 1;
}
.sec02 .btn03 {
	width: 30rem;
	height: 92px;
	top: 0;
	left: 9.3rem;
}
.sec02 .btn04 {
	width: 23.5rem;
	height: 108px;
	top: 12rem;
	left: 13rem;
}
.sec02 .btn05 {
	width: 145px;
	height: 75px;
	top: 11.8rem;
	left: 0;
}
.sec02 .btn06 {
	width: 125px;
	height: 64px;
	top: 16.8rem;
	left: 1rem;
}
.sec02 .btn07 {
	width: 188px;
	height: 92px;
	top: 2rem;
	right: 4rem;
	left: auto;
	z-index: 2;
}
.sec02 .btn08 {
	width: 237px;
	height: 75px;
	top: 8rem;
	left: auto;
	right: 0;
}
.sec02 .btn-tree a:hover {
	opacity: 1;
}
.sec02 .btn-tree img {
	height: auto;
  left: 0;
  position: absolute;
  width: 100%;
}
.sec02 .btn-tree img:last-of-type {
  display: none;
}
.sec02 .btn-tree:hover img {
  opacity: 1;
}
.sec02 #hoverImage {
    display: none;
}

.consul {
  display: none;
}
.consul.active {
  display: block;
}

	
.modal{
    display: none;
    height: 100vh;
    position: fixed;
    top: 0;
    width: 100%;
	z-index: 100;
	background: rgba(0,0,0,0.7); /* 半透明の黒背景 */
}
.modal__bg{
    height: 100vh;
    position: absolute;
    width: 100%;
}
.modal__content{
    background: #fff;
    left: 50%;
    padding: 20px 20px 30px;
    position: absolute;
    top: 50%;
    transform: translate(-50%,-50%);
    width: 89%;
    max-height: 88vh;
    border-radius: 0.6rem;
    overflow-y: auto;
}
.modal__content:before {
    content: "";
	background: url("img/sec07_modal_ribbon.png") no-repeat;
	background-size: 100%;
	width: 19rem;
	height: 19rem;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}
.modal__content:after {
    content: "";
	background: url("img/sec07_modal_plain.png") no-repeat;
	background-size: 100%;
	width: 14rem;
	height: 8.5rem;
	position: absolute;
	top: -5.5rem;
	left: 8rem;
}
.modal__content .ccl-close {
	position: absolute;
	top: 2rem;
	right: 2rem;
	width: 2rem;
}
.modal__content .tit {
    font-size: 2.1rem;
	line-height: 1.6;
	margin-bottom: 2rem;
	font-weight: 700;
}	
.modal__content .skill {
    font-size: 1.6rem;
	line-height: 1.6;
	margin-bottom: 2rem;
	font-weight: 700;
	background: #f1f4f8;
	border-radius: 4px;
	text-align: center;
	padding: 3px;
}	
.modal__content .list {
	margin: 0 0 1rem;
	padding: 0;
	flex-wrap: wrap;
	display: flex;
}
.modal__content .list li {
    padding: 0 1rem 0 1.2rem;
    margin: 0 0 1.5rem;
    background: none;
    position: relative;
	width: 50%;
	line-height: 1.6;
}
.modal__content .list li:nth-child(2n) {
    padding: 0 0 0 1.2rem;
}
.modal__content .list li:before {
	content: "";
	background: #1e2635;
	position: absolute;
	left: 0;
	width: 6px;
    height: 6px;
    border-radius: 4px;
    top: 1rem;
}	
.modal__content .btn-internal {
	margin: 1rem auto 0;
	padding: 0;
    width: 96%;
    position: relative;
}
	
.modal__content .btn-internal a {
    text-decoration: none;
    font-weight: 700;
    display: flex;
    align-items: center;
    color: #fff;
    position: relative;
    transition: .4s;
    box-shadow: 0 2px 8px 2px rgba(0, 0, 0, 0.2);
    padding: 1.5rem 6rem 1.5rem 2.5rem;
    line-height: 1.6;
    border-radius: 6rem;
    min-height: 7rem;
    font-size: 1.5rem;
	background: #1e2635 url(img/arr_ccl.png) no-repeat right 1.5rem center;
    background-size: 3.6rem auto;
}
	
	
	
/*---------------------
　SEC03
-----------------------*/
.sec03 {
	background: url("img/sec03_bg.png") no-repeat top center;
	background-size: 100% auto;
	padding: 17rem 5.4% 6rem;
}
.sec03 .sec03Inr:before {
	background: url("img/eng_laying.png") no-repeat;
	background-size: 100% auto;
	top: -14rem;
	left: 0rem;
	width: 630px;
	height: 72px;
}
.sec03 .wi1100 {
	position: relative;
}
.sec03 .wi1100:before {
	top: -4rem;
	left: 1.5rem;
}
.sec03 .wi1100:after {
	top: -4.8rem;
	left: 0;
}
.sec03 .introArea {
	position: relative;
}
.sec03 .introArea:before {
	content: "";
        background: url(img/sec03_pic_intro.jpg) no-repeat;
        background-size: 100%;
        width: 270px;
        height: 240px;
        border-radius: 0.6rem;
        position: absolute;
        top: 25rem;
        right: -2rem;
        z-index: -1;
}
.sec03 .leftBox {
	max-width: 100%;
}
.sec03 .leftBox p {
	padding: 0;
}
.sec03 .secTit {
	font-size: 2.5rem;
}
.sec03 .tabWrap {
	margin-top: 10rem;
	position: relative;
}
.sec03 .tab-area {
	border-radius: 0 0.6rem 0.6rem 0;
	width: 31.5rem;
	padding: 3rem 3rem 3rem 0;
	gap: 2rem;
	position: absolute;
	top: -5rem;
	left: 0;
	z-index: 1;
}
.sec03 .tab-area:before {
    content: "";
	background: #1a57b1;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: -100%;
}
.sec03 .tab {
        padding: 1rem 5rem 1rem 6rem !important;
        font-size: 1.5rem !important;
        min-height: 6.5rem !important;
        line-height: 1.5 !important;
    }
.sec03 .tab:hover {
    opacity: 1;
}
.sec03 .tab.active {
	background: url("img/sec03_icon_build.png") no-repeat left 2rem center, url("img/arr_base_down.png") no-repeat right 2rem center;
	background-size: 31px auto ,10px auto;
    background-color: #fff;
}
.sec03 .panel-area {
	background-color: #f1f4f8;
    width: 100%; 
    border-radius: 0 0 0 1rem;
	position: relative;
	padding: 37rem 0 4rem 2rem;
	margin: 0;
}
.sec03 .panel-area:before {
    content: "";
    background-color: #f1f4f8;
    width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: -100%;
}
.sec03 .subTitBox {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-bottom: 2.5rem;
}
.sec03 .subTitBox .icon {
	width: 7.5rem;
	height: 7.5rem;
}
.sec03 .subTitBox .subTit {
	font-size: 1.6rem;
	flex: 1;
}
.sec03 .subTitBox .subTit span {
	font-size: 2rem;
}
.sec03 .pointBox {
	display: flex;
	border-radius: 0.6rem;
	flex-direction: column;
	margin-bottom: 3rem;
}
.sec03 .pointBox .titBox {
	background: linear-gradient(90deg,rgba(43, 172, 159, 1) 0%, rgba(26, 87, 177, 1) 100%);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 4rem;
}
.sec03 .pointBox .titBox img {
	width: 5.3rem;
}
.sec03 .pointBox .txtBox {
	padding: 0 2rem;
}
.sec03 .otherArea {
    margin-top: 4rem;
    margin-bottom: 0;
}
.sec03 .otherArea .otherBtn {
	width: 100%;
}
.sec03 .otherArea .otherBtn a {
	padding: 1.5rem 2rem 1.5rem 1rem;
}

/*---------------------
　SEC04
-----------------------*/
.sec04 {
	padding: 6rem 5.4% 7rem;
	background: url("img/sec04_bg_sp.jpg") no-repeat top center;
	background-size: 100% auto;
}
.sec04 .line {
	padding: 4rem 0 0;
	position: relative;
}
.sec04 .wi1100 {
	position: relative;
}
.sec04 .wi1100:after {
	content: "";
	background: url("img/eng_challenge.png") no-repeat;
	background-size: 100% auto;
	width: 47px;
	height: 520px;
	position: absolute;
    top: -4rem;
    right: -7%;
}
.sec04 .secTit {
	font-size: 2rem;
}
.sec04 .flexBox {
	display: flex;
	flex-direction: column;
	margin-bottom: 5rem;
	gap: 3rem;
}
.sec04 .flexBox .txtBox {
	max-width: 100%;
}
.sec04 .parts_ivee {
	margin: 0;
	max-width: 100%;
}
.sec04 .ivArea .eng {
	width: 9rem;
}
.sec04 .ivArea .subTit {
	font-size: 2rem;
	margin-bottom: 6rem;
}
.sec04 .ivArea .ivBox {
	position: relative;
	display: flex;
	justify-content: flex-end;
}
.sec04 .ivArea .ivBox .pic {
	width: 13rem;
	position: absolute;
	top: -6rem;
	left: 35%;
	z-index: 1;
}
.sec04 .ivArea .txtBody {
	max-width: 100%;
	background: #f1f4f8;
	border-radius: 0.6rem 0 0 0.6rem;
	padding: 8.5rem 0 3rem 2rem;
	position: relative;
}
.sec04 .ivArea .txtBody:after {
	content: none;
}
.sec04 .ivArea .txtBody .per {
	font-size: 1.6rem;
}
.sec04 .ivArea .btn-internal{
	margin: 3rem auto 0;
}

/*---------------------
　SEC05
-----------------------*/
.contents .sec05 {
}
.contents .sec05 .topBox {
	background: #141e32 url("img/sec05_bg_pic.png") no-repeat top center;
	background-size: cover;
    width: 100%;
    padding: 4rem 5.4% 7rem;
    left: auto;
}
.contents .parts_sv .topBox .wi1100 {
	position: relative;
}
.contents .parts_sv .topBox .wi1100:after {
    width: 30.5rem;
    height: 5rem;
    position: absolute;
    bottom: auto;
    top: -2rem;
    right: -1rem;
}
.contents .sec05 .topBox .tit:after {
    width: 200%;
    right: auto;
    left: 11rem;
}
.sec05 .secTit {
    font-size: 2rem;
}
.sec05 .secTit .grad {
    font-size: 2.3rem;
}
.contents .sec05 .txtArea {
    position: relative;
	margin-top: 0;
}
.sec05 .secTitBox {
    max-width: 100%;
}
.sec05 .cap {
    width: 100%;
	max-width: 30rem;
	margin: 0 auto 3rem;
	position: static;
}
.sec05 .txt {
    max-width: 100%;
}
.sec05 .btmBox {
	background: #f1f4f8 url("img/sec05_bg_rep_sp.png") repeat-y top center;
	background-size: 100% auto;
	padding: 3rem 5.4% 6rem;
}
.sec05 .rowBoxWrap {
	margin-top: 0;
}
.sec05 .rowBox {
	position: relative;
	margin-bottom: 11rem;
}
.sec05 .rowBox:nth-child(2n) {
	display: flex;
    flex-direction: row-reverse;
}
.sec05 .rowBox:last-child {
	margin-bottom: 0;
}
.sec05 .rowBox .txtBox {
	background: #fff;
	max-width: 100%;
	border-radius: 0.6rem;
	padding: 11rem 2rem 2rem;
	min-height: inherit;
}
.sec05 .rowBox:nth-child(2n) .txtBox {
	padding: 11rem 2rem 2rem;
}
.sec05 .rowBox .pic {
	width: 29.5rem;
	position: absolute;
	top: -8rem;
	right: -1rem;
}
.sec05 .rowBox:nth-child(2n) .pic {
	right: auto;
	left: -1rem;
}
.sec05 .rowBox .pic img {
	border-radius: 0.6rem;
}
.contents .sec05 .btns-flex {
	margin-top: 4rem;
}




/*---------------------
　SEC06
-----------------------*/
.sec06 {
	padding: 14rem 5.4% 3rem;
}
.sec06 .wi1100 {
	position: relative;
}
.sec06 .wi1100:before {
	content: "";
	background: rgba(0,0,0,0.5);
	width: 200%;
	height: 1px;
	position: absolute;
	top: -4rem;
	left: 1.5rem;
}
.sec06 .wi1100:after {
	content: "";
	background: url("img/deco_h3_tri.png") no-repeat;
	background-size: 100%;
	width: 11px;
	height: 18px;
	position: absolute;
	top: -4.8rem;
	left: 0;
}
.sec06 .sec06Inr:before {
	content: "";
	background: url("img/eng_know.png") no-repeat;
	background-size: 100%;
	width: 33.9rem;
	height: 7.2rem;
	position: absolute;
	top: -10.5rem;
	right: -6.5rem;
	line-height: 1;
}
.sec06 .itemBoxWrap {
	display: flex;
	flex-wrap: wrap;
	gap: 3rem;
}
.sec06 .itemBox {
	width: 100%;
	border-top: solid 1px rgba(0,0,0,0.5);
}
.sec06 .itemBox a {
	padding: 2rem 0 2rem;
	background: url("img/arr_ccl.png") no-repeat bottom right;
	background-size: 5.6rem auto;
}
.sec06 .itemBox .titBox {
	display: flex;
	align-items: center;
	gap: 2rem;
}
.sec06 .itemBox .ccl {
	width: 6rem;
}
.sec06 .itemBox .subTit {
	font-size: 1.3rem;
	flex: 1;
	line-height: 1.5;
}
.sec06 .itemBox .subTit span {
	font-size: 2rem;
}
.sec06 .itemBox .txtBox {
	padding: 0;
}


}