@charset "UTF-8";
/*
 * style_sp.css
 *
 *  version --- 1.0
 *  updated --- 2017/11/30
 */


/* !wrapper
---------------------------------------------------------- */
#wrapper {
	width: 100%;
	overflow: hidden;
	min-width: 320px;
	position: relative;
	z-index: 999;
	background: #fff;
}

.menuOpen {
	overflow: hidden;
	height: 100vh;
}

.menuOpen #wrapper {
	position: fixed;
}

.inner {
	box-sizing: border-box;
	position: relative;
	padding: 0 10px;
	margin: 0 auto;
}

.l-flex-cont {
	display: flex;
}

/* !header
---------------------------------------------------------- */
#header {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
	z-index: 99;
	background: rgba(0, 0, 0, 0.7);
	height: 50px;
}

#headerIn {}

#headerLogo {
	float: left;
	padding-top: 12px;
	width: 68px;
}


.btnMenu {
	position: fixed;
	right: 0px;
	top: 0px;
	z-index: 999;
}

.btnMenu a {
	display: block;
	width: 50px;
	height: 50px;
	box-sizing: border-box;
	position: relative;
	background: #7847BE;
}

.btnMenu a span {
	display: block;
	width: 20px;
	height: 2px;
	position: absolute;
	left: 15px;
	transition: all 0.4s;
	-webkit-transition: all 0.4s;
	-moz-transition: all 0.4s;
}

.btnMenu a span:before {
	content: "";
	background-color: #fff;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	box-sizing: border-box;
}

.btnMenu a span:first-child {
	top: 22px;
}

.btnMenu a span:nth-child(2) {
	top: 30px;
}

.btnMenu a span:nth-child(3) {
	top: 38px
}

.btnMenu.active a span {
	width: 26px;
	left: 12px;
}

.btnMenu.active a span:first-child {
	-webkit-transform: translateY(8px) rotate(45deg);
	-moz-transform: translateY(8px) rotate(45deg);
	-ms-transform: translateY(8px) rotate(45deg);
	transform: translateY(8px) rotate(45deg);
}

.btnMenu.active a span:nth-child(2) {
	opacity: 0;
}

.btnMenu.active a span:nth-child(3) {
	-webkit-transform: translateY(-9px) rotate(-45deg);
	-moz-transform: translateY(-9px) rotate(-45deg);
	-ms-transform: translateY(-9px) rotate(-45deg);
	transform: translateY(-9px) rotate(-45deg);
}

.btnMenu a em {
	font-size: 0.7rem;
	letter-spacing: 0;
	line-height: 1;
	position: absolute;
	left: 0;
	top: 7px;
	z-index: 2;
	width: 100%;
	color: #fff;
	text-align: center;
}

.btnMenu.active a em {}

.btnMenu a em:nth-of-type(2) {
	display: none
}

.btnMenu.active a em:nth-of-type(1) {
	display: none
}

.btnMenu.active a em:nth-of-type(2) {
	display: block;
}

/* !breadcrumb
---------------------------------------------------------- */
#breadcrumb {}

/* !gNavi
---------------------------------------------------------- */
#gNavi {
	display: none;
	position: fixed;
	z-index: 998;
	width: 100%;
	height: 100vh;
	height: var(--view-height, 100vh);
	top: 0;
	right: 0;
	-webkit-overflow-scrolling: touch;
	overflow: auto;
	background: rgba(0, 0, 0, 0.9);
	box-sizing: border-box;
	padding: 80px 30px 50px;
}

.overlay {
	display: none;
	position: fixed;
	left: 0;
	top: 0px;
	width: 100vw;
	height: 100%;
	/*background: rgba(35,35,35,0.4);*/
	z-index: 997;
	text-indent: -9999px;
}

.headerUl01 li {
	margin-bottom: 0px;
	box-sizing: border-box;
	/*padding: 0px 20px 0;*/
	border-radius: 8px;
	position: relative;
}

.headerUl01 .link {
	font-size: 1.4rem;
	font-weight: bold;
	display: block;
	padding: 10px 0;
	background: url(../img/common/arrow02.png)no-repeat right 16px center;
	background-size: 7px auto;
}

.headerUl01 .parent .link {
	background: none
}

.headerUl01 li span {
	position: absolute;
	z-index: 2;
	right: 0px;
	top: 0px;
	height: 40px;
	width: 40px;
	background: url(../img/common/open.png) center center no-repeat;
	background-size: 10px auto;
}

.headerUl01 li span.active {
	background: url(../img/common/close.png) center center no-repeat;
	background-size: 10px auto;
}

.headerUl01 a {
	color: #fff
}

.headerUl01 a:hover {
	text-decoration: none;
}

.linkMenu {
	display: none;
}

.linkList {
	padding: 5px 0
}

.linkList a {
	display: block;
	box-sizing: border-box;
	padding: 0px 25px;
	font-size: 1.15rem;
	letter-spacing: 0.12em;
	color: #fff;
	position: relative;
}

.linkList a:before {
	content: '-';
	position: absolute;
	left: 20px;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

.linkEn,
.linkJp {
	display: none;
}

/* !mainVisual
---------------------------------------------------------- */
#mainVisual {
	height: 90vw;
	max-height: 640px;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}

.mvVideo {
	position: fixed;
	position: absolute;
	z-index: -1;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100vh;
	height: 100%;
	/*min-height: 600px;*/
	display: flex;
	justify-content: center;
	align-items: center;
}

.mvVideo video {
	object-fit: fill;
	width: 100%;
	height: 100%;
}

.mvBox {
	background: rgba(0, 0, 0, 0.7);
	width: 300px;
	height: 85px;
	margin-top: 20px;
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	font-size: 0rem;
	color: #fff;
}

.mvBox .en span {
	font-size: 2.3rem;
	font-weight: bold;
}

.mvBox .jp span {
	font-size: 1.3rem;
}

@keyframes letter-glow {
	0% {
		opacity: 0;
		text-shadow: 0px 0px 1px rgba(255, 255, 255, 0.1);
	}

	66% {
		opacity: 1;
		text-shadow: 0px 0px 20px rgba(255, 255, 255, 0.9);
	}

	77% {
		opacity: 1;
	}

	100% {
		text-shadow: 0px 0px 20px rgba(255, 255, 255, 0);
	}
}

.animated .mast__title span {
	animation: letter-glow 0.7s 0s ease both;
}

.mast__title span:nth-child(1) {
	animation-delay: 0.05s;
}

.mast__title span:nth-child(2) {
	animation-delay: 0.1s;
}

.mast__title span:nth-child(3) {
	animation-delay: 0.15s;
}

.mast__title span:nth-child(4) {
	animation-delay: 0.2s;
}

.mast__title span:nth-child(5) {
	animation-delay: 0.25s;
}

.mast__title span:nth-child(6) {
	animation-delay: 0.3s;
}

.mast__title span:nth-child(1) {
	animation-delay: 0.35s;
}

.mast__title span:nth-child(2) {
	animation-delay: 0.4s;
}

.mast__title span:nth-child(3) {
	animation-delay: 0.45s;
}

.mast__title span:nth-child(4) {
	animation-delay: 0.5s;
}

.mast__title span:nth-child(5) {
	animation-delay: 0.55s;
}

.mast__title span:nth-child(6) {
	animation-delay: 0.6s;
}

.mast__title span:nth-child(7) {
	animation-delay: 0.65s;
}

.mast__title span:nth-child(8) {
	animation-delay: 0.7s;
}

.mast__title span:nth-child(9) {
	animation-delay: 0.75s;
}

.mast__title span:nth-child(10) {
	animation-delay: 0.8s;
}

.mast__title span:nth-child(11) {
	animation-delay: 0.85s;
}

.mast__title span:nth-child(12) {
	animation-delay: 0.9s;
}

.mast__title span:nth-child(13) {
	animation-delay: 0.95s;
}

.mast__title span:nth-child(14) {
	animation-delay: 1s;
}

.mast__title span:nth-child(15) {
	animation-delay: 1.05s;
}

.mast__title span:nth-child(16) {
	animation-delay: 1.1s;
}

.mast__title span:nth-child(17) {
	animation-delay: 1.15s;
}

.mast__title span:nth-child(18) {
	animation-delay: 1.2s;
}

.mast__title span:nth-child(19) {
	animation-delay: 1.25s;
}

/* !teaser
---------------------------------------------------------- */
#teaser {
	background: url(../img/company/top_company.jpg)no-repeat center center;
	background-size: cover;
	height: 160px;
	color: #fff;
	font-size: 1.15rem;
	padding-top: 80px;
	box-sizing: border-box;
	position: relative;
	text-align: center;
}

#teaser .enFt {
	font-size: 3rem;
	line-height: 1.2;
}

#philosophy #teaser {
	background: url(../img/philosophy/top_companyphilosophy.jpg)no-repeat center center;
	background-size: cover;
}

#profile #teaser {
	background: url(../img/profile/top_companyprofile.jpg)no-repeat center center;
	background-size: cover;
}

#representative #teaser {
	background: url(../img/representative/top_representativegreetings_sp.jpg)no-repeat center center;
	background-size: cover;
}

#history #teaser {
	background: url(../img/history/top_history_sp.jpg)no-repeat center center;
	background-size: cover;
}

#recruit #teaser {
	background: url(../img/recruit/top_recruit.jpg)no-repeat center center;
	background-size: cover;
}

#technology #teaser {
	background: url(../img/technology/top_technology.jpg)no-repeat center center;
	background-size: cover;
}

#business #teaser {
	background: url(../img/business/top_business.jpg)no-repeat center center;
	background-size: cover;
}

#original #teaser {
	background: url(../img/original/top_original.jpg)no-repeat center center;
	background-size: cover;
}

#case #teaser {
	background: url(../img/case/top_casestudy.jpg)no-repeat center center;
	background-size: cover;
}

#contact #teaser {
	background: url(../img/contact/top_contact_sp.jpg)no-repeat center center;
	background-size: cover;
}

/* !contents
---------------------------------------------------------- */
#contents {}

#particles-js {
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative;
}

.particles-js-canvas-el {
	right: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: -1;
}

.pg-canvas {
	position: fixed;
	position: absolute;
	z-index: -99;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100vh;
	height: 100%;
	opacity: .2
}

/* !pageTop
---------------------------------------------------------- */
.pageTop {}

/* !footer
---------------------------------------------------------- */
#footer {
	border-top: 5px solid #7847BE;
	padding: 38px 0 15px;
	background: #fff;
	text-align: center;
}

#footer .footerIn {}

.ftUl {
	margin-bottom: 38px;
}

.ftUl li+li {
	margin-top: 18px;
}

.ftUl .btnLink01 {}

#footer .box02 {}

#footer .box03 {
	font-weight: bold;
	margin-top: 30px;
}

#footer .ftP01 {
	font-size: 1.3rem;
	padding: 5px 0 15px;
}

#footer .ftP02 {
	font-size: 1.3rem;
	line-height: 1.375;
	padding-bottom: 5px;
}

#footer .ftP02 font {
	font-size: 1.15rem
}

#footer .ftP03 {
	font-size: 1.3rem;
}

#copyright {
	font-size: 0.8rem;
	padding-top: 25px;
}

/* !h(n)eading
---------------------------------------------------------- */
.hdL {}

.hdM {}

.hdS {}

.hd01 {}



/* !list
---------------------------------------------------------- */
.list01 {}

/* !table
---------------------------------------------------------- */
.table01 {}


/*common*/
.txt_ani {
	overflow: hidden;
	position: relative;
}

.txt_ani>* {
	/*overflow: hidden;*/
	transform: translateY(400%);
}

.is-animation .txt_ani>* {
	animation-name: from_the_bottom2;
	animation-timing-function: ease-out;
	animation-duration: 0.5s;
	animation-fill-mode: forwards;
	/*transform: translateY(0%);*/
}

.is-animation .txt_ani {
	/*overflow: visible;*/
}

.is-animation .txt_ani._1>* {
	animation-delay: 0.8s;
}

.is-animation .txt_ani._2>* {
	animation-delay: 1.1s;
}

.is-animation .txt_ani._3>* {
	animation-delay: 1.4s;
}

.is-animation .txt_ani._4>* {
	animation-delay: 1.7s;
}

.is-animation .txt_ani._5>* {
	animation-delay: 2s;
}

.is-animation .txt_ani._6>* {
	animation-delay: 2.3s;
}

.is-animation .txt_ani {
	animation-delay: 2s;
	animation-name: _visible;
	animation-fill-mode: forwards;
	animation-duration: 0s;
}

@-webkit-keyframes from_the_bottom2 {
	0% {
		transform: translateY(100%);
	}

	100% {
		transform: translateY(0);
	}
}

@-webkit-keyframes _visible {
	0% {
		overflow: hidden;
	}

	100% {
		position: static;
		overflow: visible;
	}
}

@keyframes from_the_bottom2 {
	0% {
		transform: translateY(100%);
	}

	100% {
		transform: translateY(0);
	}
}

@keyframes _visible {
	0% {
		overflow: hidden;
	}

	100% {
		/*position: static;*/
		overflow: visible;
	}
}

.block-content {
	opacity: 0;
	/*transform: translateY(15%);*/
	transition: 0.3s;
	transition-delay: 1.2s;
	position: relative;
}

.block-content img {
	width: 100%
}

.block-element {
	transform: scaleY(0);
	transform-origin: 50% 0px;
	background-color: rgb(0, 0, 0);
	position: absolute;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 1;
}

@-webkit-keyframes from_the_bottom {
	0% {
		height: 0%;
		transform: scaleY(1);
	}

	50% {
		height: 100%;
	}

	75% {
		transform: scaleY(1);

	}

	100% {
		transform: scaleY(0);
	}
}

@keyframes from_the_bottom {
	0% {
		height: 0%;
		transform: scaleY(1);
	}

	50% {
		height: 100%;
	}

	75% {
		transform: scaleY(1);

	}

	100% {
		transform: scaleY(0);
	}
}

.is-animation .block-content {
	opacity: 1;
	transition-delay: 0.5s;

	/*transform: translateY(0%);*/
}

.is-animation .block-element {
	animation-name: from_the_bottom;
	animation-timing-function: ease;
	/*animation-delay: 1.5s;*/
	animation-duration: 1s;
}



.title_style1 {
	margin-bottom: 30px;
	line-height: 1.05;
}

.title_style1 span {
	display: block;
}

.title_style1 .txt1 {
	font-family: 'DIN Condensed';
	display: block;
	font-size: 4.5rem;
	color: #7847BE;
}

.title_style1 .txt2 {
	font-size: 1.3rem;
}

.title_style1 .txt2._white {
	color: #fff;
}

.txt_ani._3 .txt3 {
	padding: 0px 0 10px;
	color: #7847BE;
	font-size: 1.95rem;
	font-weight: bold;
	line-height: 1.4;

}

.txt_ani._4 .txt4 {
	font-size: 1.3rem;
	line-height: 1.8;
	padding-bottom: 14px;
}

.txt_ani._5 .link {
	text-align: center;
}

.btnLink01 {
	display: inline-block;
	text-decoration: none;
	color: #7847BE;
	background: #fff;
	border: 1px solid #7847BE;
	font-size: 1.3rem;
	font-weight: bold;
	min-width: 195px;
	box-sizing: border-box;
	padding: 10px 10px 10px;
	position: relative;
	text-align: center;
	transition: all 0.3s ease;
	z-index: 1;
}

.btnLink01.purple {
	background: #7847BE;
	color: #fff;
}

.btnLink01:hover {
	text-decoration: none;
	opacity: .7
}

/*index*/
.indexSec01 .inbox {
	position: relative;
	margin: 50px 0 50px;
}

.indexSec01 .inbox_2 {
	position: relative;
}

.indexSec01 .img_cnt {
	position: relative;
	margin: 22px -10px 0;
}

.indexSec01 .cnt_left {}

.indexSec01 .block-content {
	z-index: 5;
}

.indexSec02 {
	position: relative;
	z-index: 2;
}

.indexSec02 .inbox {
	position: relative;
	z-index: 2;
}

.indexSec02 .inbox .txt_ani._4 {}

.indexSec02 .ul01 .img_cnt {
	position: relative;
}

.indexSec02 .ul01 .img_cnt .block-content {
	height: 100%;
	overflow: hidden;
}

.indexSec02 .ul01 .img_cnt img {}

.indexSec02 .ul01 {
	margin: 0 -10px
}

.indexSec02 .ul01 li {
	box-sizing: border-box;
	color: #fff;
	position: relative;
	background: rgba(0, 0, 0, 0.9);
}

.indexSec02 .ul01 .cnt_area {
	padding: 0 10px 30px 10px;
}

.indexSec02 .ul01 ._1 {
	font-size: 4.5rem;
	line-height: 1;
	position: absolute;
	top: 5px;
	left: 10px;
}

.indexSec02 .ul01 ._2 {
	font-size: 2.25rem;
	color: #7847BE;
	line-height: 1.5;
	/*position: relative;*/
}

.indexSec02 .ul01 ._3 {
	font-size: 1.3rem;
	line-height: 1.77;
}

.indexSec02 .ul01 ._3 span {
	display: block;
	margin: 15px 0 10px;
}

.indexSec02 .ul01 ._4 {
	text-align: center;
	padding: 25px 0 0;
}

.indexSec02 .ul01 .categ {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 76px;
	height: 42px;
	font-size: 1.4rem;
	background: #fff;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
	color: #333;
}

.indexSec03 {
	padding: 35px 0;
}

.indexSec03 .inner {
	padding: 0
}

.indexSec03 .cnt_area {
	position: relative;
}

.indexSec03 .squ {
	background: #7847BE;
	height: 30px;
}

.indexSec03 .squ._2 {}

.indexSec03 .box {
	position: relative;
	z-index: 2;
	box-sizing: border-box;
	border-bottom: 1px solid #C8CACB;
	background: rgba(255, 255, 255, 0.95);
	letter-spacing: 0.1em;
}

.indexSec03 .box ._1 p {
	color: #7847BE;
	font-size: 3.25rem;
	padding: 3px 10px;
	border-bottom: 1px solid #C8CACB;
}

/* .indexSec03 .box ._2 ul {
	padding: ;
} */

.indexSec03 .box ._2 li {
	box-sizing: border-box;
	padding: 10px 10px;
	border-bottom: 1px solid #C8CACB;
}

.indexSec03 .box ._2 li a {
	display: block;
	font-size: 1.3rem;
}

.indexSec03 .box ._2 li a .date {
	color: #808080;
	margin-bottom: 3px;
}

.indexSec03 .box ._2 li a .text {
	font-weight: bold;
}

.indexSec03 .box ._2 li a:hover {
	text-decoration: none;
	opacity: .7
}

.indexSec03 .box ._3 {
	padding: 32px 0 23px;
	text-align: center;
}

.indexSec04 {
	margin-bottom: 35px;
	position: relative;
	z-index: 2;
}

.indexSec04 .inner {
	padding: 0
}

.indexSec04 .is-animation .block-element {
	/*animation-duration: 0.7s*/
}

.indexSec04 .box {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 1;
}

.indexSec04 .cnt_area {
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	width: 162px;
	height: 117px;
	color: #fff;
	background: rgba(120, 71, 190, 0.7);
}

.indexSec04 .txt_ani._1 p {
	font-size: 4.5rem;
	line-height: 1.3;
}

.indexSec04 .txt_ani._2 p {
	font-size: 1.3rem;
}

/*company*/
.companyWrap {
	padding: 35px 0 40px;
}

.companyTop {
	text-align: center;
	margin-bottom: 50px;
}

.companyTop .title {
	color: #7847BE;
	font-weight: bold;
	font-size: 1.95rem;
	padding-bottom: 8px;
}

.companyTop .text {
	text-align: left;
	font-size: 1.3rem;
	line-height: 1.76;
}

.companyDl01+.companyDl01 {
	margin-top: 50px
}

.companyDl01 .left {}

.companyDl01 .right {}

.companyDl01 .left.imgCt {}

.companyDl01 .right.imgCt {}

.companyDl01 .imgCt {
	position: relative;
	margin: 0 -10px;
}

.companyDl01 .imgCt img {
	width: calc(100% + 20px)
}

.companyDl01 .imgCt:before {
	content: none;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background: rgba(0, 0, 0, 0.5);
	transition: background 0.5s !important;
	-moz-transition: background 0.5s !important;
	/* Firefox */
	-webkit-transition: background 0.5s !important;
	/* Chrome&Safari */
}

.companyDl01 .imgCt:hover:before {
	background: none
}

.companyDl01 .p01 {
	font-size: 4.2rem;
	color: #7847BE;
	line-height: 1.3;
	white-space: nowrap;
}

.companyDl01 .p02 {
	font-size: 1.3rem;
}

.companyDl01 .p03 {
	font-size: 1.4rem;
	font-weight: bold;
	text-align: center;
	padding: 20px 0 30px
}

.companyDl01 .link {
	text-align: center;
	padding-bottom: 20px
}

.companyDl01._3 .p01 {
	line-height: 1;
}

/* .companyDl01._3 .p03 {
	padding-bottom:
} */

/*philosophy*/
.philosophyWrap {
	padding: 50px 0 35px
}

.philosophyWrap .inner {
	padding: 0
}

.philosophyTitle {
	font-size: 4.5rem;
	padding-bottom: 3px;
	line-height: 1.1;
	position: relative;
	text-align: center;
}

.philosophyTitle:after {
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translate(-50%, -100%);
	width: 1000%;
	height: 3px;
	background: #7847BE;
}

.philosophyText {
	padding: 15px 10px;
	font-size: 1.7rem;
	line-height: 2;
	font-weight: bold;
}

.philosophyText br {
	display: none;
}

.philosophySec01 {
	padding-bottom: 75px
}

.philosophySec01 .inbox {
	position: relative;
}

.philosophySec01 .img_cnt {
	position: relative;
}

.philosophySec01 .cnt_left {}

.philosophySec02 {
	padding-bottom: 75px;
	position: relative;
}

.philosophySec02 .inbox {
	position: relative;
}

.philosophySec02 .img_cnt {
	position: relative;
}

.philosophySec02 .cnt_right {
	padding-top: 30px;
	box-sizing: border-box;
	color: #fff;
	background: rgba(120, 71, 190, 0.7);
	position: relative;
}

.philosophySec02 .philosophyTitle:after {
	background: #fff;
}

.philosophySec03 .inbox {
	position: relative;
}

.philosophySec03 .img_cnt .bg {
	height: 220px;
	background: #333;
}

.philosophySec03 .cnt_area {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
	color: #fff;
	padding-bottom: 40px
}

.philosophySec03 .philosophyTitle {
	padding-top: 0
}

/*profile*/
.profileWrap {}

.profileSec01 {
	padding: 47px 0 36px;
}

.profileSec01 .inner {
	padding: 0
}

.table01 {
	width: 100%;
	border-top: 1px solid;
}

.table01 th,
.table01 td {
	font-size: 1.3rem;
	line-height: 2;
	padding: 30px 10px;
	border-bottom: 1px solid;
	font-weight: 500;
	box-sizing: border-box;
}

.table01 th {
	width: 110px;
	vertical-align: top;
}

.table01 .link a {
	color: #77868A;
	text-decoration: underline;
}

.map {
	display: block;
	width: 100%;
	height: 400px;
	overflow: hidden;
}

/*representative*/
.representativeWrap {
	padding: 47px 0 30px
}

.representativeSec01 {
	position: relative;
	padding-bottom: 40px;
	margin-bottom: 35px;
	z-index: 2;
}

.representativeSec01 .inner {}

.representativeSec01:before {
	content: '';
	position: absolute;
	left: -10px;
	bottom: 0;
	height: 100%;
	width: 1000%;
	max-width: 1500px;
	z-index: -1;
	background: #C7B5E2;

}

.representativeSec01 dt {
	margin: 0 -10px;
}

.representativeSec01 dt img {
	width: 100%
}

.representativeSec01 dd {
	padding-top: 55px;
}

.representativeSec01 .p01 {
	font-size: 1.8rem;
	font-weight: bold;
	position: relative;
	padding-left: 20px;
}

.representativeSec01 .p01:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	height: 60px;
	width: 60px;
	background: rgba(120, 71, 190, 0.7);
	z-index: -1;
}

.representativeSec01 .p02 {
	font-size: 1.3rem;
	font-weight: bold;
	padding-top: 22px;
	padding-left: 20px;
}

.representativeSec02 .text {
	font-size: 1.3rem;
	line-height: 1.42;
	letter-spacing: -0.05em
}

.representativeSec02 .text+.text {
	padding-top: 18px
}


/*history*/
.historyWrap {
	padding: 47px 0 37px
}

.historyWrap .inner {
	padding: 0
}

.historyWrap .table01 th,
.historyWrap .table01 td {
	line-height: 1.69;
	padding: 5px 10px;
}

.historyWrap .table01 td {
	letter-spacing: -0.05em
}

/*contact*/
.contactWrap {
	padding: 40px 0 35px;
	background: #fff
}

.contactUl {
	max-width: 270px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	font-size: 1.25rem;
	font-weight: bold;
	text-align: center;
}

.contactUl li {
	opacity: .5;
	position: relative;
}

.contactUl li+li:before {
	content: '';
	position: absolute;
	width: 70px;
	height: 5px;
	z-index: 1;
	top: 10px;
	left: -80px;
	background: url(../img/common/arrow04.png)no-repeat bottom right;
	background-size: 100% auto;
}

.contactUl li.active {
	opacity: 1
}

.contactUl .point {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	border: 1px solid;
	box-sizing: border-box;
}

.contactUl .text {
	padding-top: 10px;
}

.contactUl li.active .point {
	color: #fff;
	background: #7847BE;
}

.contactP {
	line-height: 1.75;
	font-size: 1.1rem;
	padding: 15px 0 0px;
	text-align: center;
}

.selectCont {
	display: none;
}

.contactForm {}

.contactDl {
	margin-top: 25px;
}

.contactDl dt {
	font-size: 1.3rem;
	overflow: hidden;
	padding-bottom: 12px;
}

.contactDl dt span {
	display: inline-block;
	margin-left: 15px;
	text-align: center;
	width: 35px;
	line-height: 19px;
	font-weight: bold;
	color: #7847BE;
	border: 1px solid;
	font-size: 1.1rem;
}

.contactDl dd {
	font-size: 1.1rem;
}

.contactForm select,
.contactForm input[type='text'],
.contactForm input[type='number'],
.contactForm input[type='tel'],
.contactForm input[type='email'] {
	height: 35px;
	width: 100%;
	box-sizing: border-box;
	padding: 0 10px;
	background: #F1F3F4;
	border-radius: 3px;
}

.contactForm textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 7px 10px;
	resize: none;
	font-family: initial;
	min-height: 170px;
	background: #F1F3F4;
	border-radius: 3px;
}

.contactForm select {
	background: url(../img/common/select.png)no-repeat right 10px center #F1F3F4;
	background-size: 6px auto;
	padding: 0 30px 0 10px;
	font-size: 1.1rem;
	margin-bottom: 6px;
	border: 1px solid #000;
	border-radius: 3px;
}

.contactForm .notice {
	font-size: 0.9rem;
	padding-top: 4px
}

.policyBox {
	overflow-y: auto;
	height: 170px;
	font-size: 1.1rem;
	line-height: 1.6;
	border: 1px solid #CBCCCC;
	box-sizing: border-box;
	padding: 6px 12px;
	margin: 40px auto 0;
}

.policyBox p+p {
	padding-top: 24px;
}

.policyBox p span {
	display: block;
}

.agreeP {
	font-size: 1.1rem;
	margin-top: 25px;
	color: #000;
	text-align: center;
}

label.checkBox01 input[type="checkBox"] {
	margin-right: 10px;
	position: relative;
	top: 2px;
}

label.checkBox01 input[type="checkBox"],
label.radioBox01 input[type="radio"] {
	margin-right: 10px;
	position: relative;
	top: 1px;
}

.agreeP label.checkBox01 input[type="checkBox"] {
	margin-right: 10px;
}

.contactForm .btn {
	text-align: center;
	padding-top: 25px
}

.contactForm .btn li {
	display: block;
}

.contactForm .btn li+li {
	margin-top: 15px
}

.contactForm .btn .return input {
	background: #7847BE;
	color: #fff;
}

.contactForm .btn .btnLink01 {
	border: 1px solid #7847BE;
}

/****************************
ブログ一覧ページ
****************************/

.blog-mv {
	background: url(../img/blog/blog_main_sp.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 90%;
	position: relative;
	margin-top: 50px;
}

.news-mv {
	background-image: url(../img/news/news_bg_sp.jpg);
	padding-top: 64%;
	margin-top: 50px;
}

.blog-mv-txt {
	justify-content: center;
	background-color: rgba(102, 51, 204, 0.7);
	color: white;
	font-weight: bold;
	font-size: 3.4vw;
	position: absolute;
	left: 10%;
	top: 30%;
	width: 30vw;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 26vw;
	line-height: 1;
}

.blog-mv-txt:before {
	content: 'BLOG';
	font-size: 9vw;
	font-family: 'DIN Condensed';
	display: block;
}

.news-mv-txt:before {
	content: 'NEWS';
}

.blog-wrapper {
	padding-bottom: 40px;
}

.blog-content {
	padding: 30px 10px;
	border-bottom: 1px solid #666;
}

.blog-content time {
	font-size: 15px;
}

.blog-content-link {
	display: flex;
}

.blog-content-link:hover {
	text-decoration: none;
}

.blog-content-ttl {
	font-size: 15px;
	font-weight: bold;
	margin-left: 5%;
}

.blog-pager {
	margin-top: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.contents-arrow {
	border: 1px solid #7847BE;
	color: #7847BE;
	font-weight: bold;
	font-size: 14px;
	display: block;
	width: 200px;
	padding: 12px 0;
	text-align: center;
	transition: 0.3s all;
	margin: 0 10px;
	position: relative;
}

.contents-arrow:hover {
	text-decoration: none;
	opacity: 0.8;
}

.arrow-prev:before {
	content: '';
	background-image: url(../img/common/arrow02-rt.png);
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	width: 12px;
	height: 14px;
	position: absolute;
	left: 10px;
	top: 15px;
}

.arrow-next:after {
	content: '';
	background-image: url(../img/common/arrow02.png);
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	width: 12px;
	height: 14px;
	position: absolute;
	right: 10px;
	top: 15px;
}

/****************************
ブログ投稿記事ページ
****************************/

.post-single {
	margin-top: 60px;
}

.post-single-heading {
	font-size: 24px;
	font-weight: bold;
}

.post-single-main {
	padding-bottom: 50px;
}

.post-single-date {
	font-size: 16px;
	color: #808080;
	margin: 10px 10px 0 0;
}

.post-single-thumb {
	margin: 40px 0;
}

.post-single-content {
	margin-top: 40px;
}

.post-single-content p {
	line-height: 1.7;
	margin-bottom: 2em;
}

.post-single img {
	width: 100%;
	max-width: 700px;
	height: auto;
}



/* !breadcrumb
---------------------------------------------------------- */
#breadcrumb {
	padding: 15px 0
}

#breadcrumb ul li {
	display: inline-block;
	position: relative;
	padding-right: 15px;
	font-size: 1.4rem;
}

#breadcrumb ul li a {
	color: #7847BE;
	text-decoration: underline;
}

#breadcrumb ul li:before {
	position: absolute;
	right: 0px;
	top: 0;
	z-index: 2;
	content: ">";
	color: #333;
}

#breadcrumb ul li:last-of-type:before {
	content: none;
}

#breadcrumb ul li a:hover {
	text-decoration: underline;
}

/****************************
5月末時点の公開箇所 / 調整
****************************/

.mr-heading {
	margin-right: 5px;
}

.temp-none {
	display: none;
}

.mt20 {
	margin-top: 20px;
}

.blog-ex {
	font-size: 12px;
	margin-top: 6px;
}

.contact-alert {
	margin-top: 10px;
	font-size: 12px;
}

.mw_wp_form_confirm .policyBox {
	display: none !important;
}

.mw_wp_form_confirm .agreeP {
	display: none !important;
}

.mw_wp_form_confirm .contactDl dd {
	margin-top: 13px;
}

.mw_wp_form_confirm .contact-alert {
	display: none !important;
}

.contact-top-btn {
	text-align: center;
	margin-top: 30px;
}

/****************************
採用情報
****************************/

.recruitWrap {
	padding-right: 10px;
	padding-left: 10px;
}

.recruitWrap .table01 th,
.recruitWrap .table01 td {
	padding: 10px;
}

.recruit-ttl {
	color: #7847BE;
	font-weight: bold;
	font-size: 24px;
	padding-bottom: 8px;
	text-align: center;
	margin-bottom: 15px;
}

.recruit-bnr {
	margin-top: 60px;
}

.recruit-bnr-ttl {
	color: #7847BE;
	font-weight: bold;
	font-size: 24px;
	padding-bottom: 10px;
}

.indexSec04 .box-recruit {
	top: 63%;
}

/****************************
事業内容
****************************/

.business-ttl {
	color: #7847BE;
	font-weight: bold;
	font-size: 24px;
	margin-bottom: 20px;
}

.companyDl01 .business-right {
	margin-top: 20px;
}

.business-main-txt+.business-main-txt {
	margin-top: 15px;
}

.business-main-txt span {
	color: #7847BE;
	font-weight: bold;
}

.businessWrap .left {
	width: 100%;
}

.business-bnr {
	margin-top: 25px;
	position: relative;
}

/* .business-hover {
	position: absolute;
	color: white;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	width: 0;
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 100;
	transition: all 0.5s;
}

.business-bnr:hover .business-hover {
	width: 100%;
}

.business-bnr:before {
	content: '独自技術の詳細を見る ＞';
	color: white;
	font-weight: bold;
	font-size: 36px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	transition: all 0.5s;
	z-index: 150;
}

.business-bnr:hover:before {
	opacity: 1;
} */

.business-flow {
	margin-top: 50px;
}

.business-flow-label {
	width: 240px;
	height: 60px;
	color: white;
	background-color: #7847BE;
	font-weight: bold;
	font-size: 22px;
	text-align: center;
	line-height: 60px;
	letter-spacing: 0.1em;
	margin: 0 auto;
}

.business-flow-main {
	margin-top: 50px;
	text-align: center;
}

.indexSec04 .box-business {
	width: 90%;
}

.indexSec04 .txt_ani._1 p.business-flow-msg {
	font-size: 20px;
	line-height: 1.5;
}

.indexSec04 .cnt_area.business-flow-box {
	width: 100%;
}

/****************************
独自技術
****************************/

.or-txt-bl {
	font-size: 18px;
	color: #7847BE;
	font-weight: bold;
	line-height: 1.7;
	margin-top: 15px;
}

.or-txt-sm {
	font-size: 15px;
	line-height: 1.7;
	margin-top: 10px;
}

.or-link {
	margin-top: 60px;
}

.or-link-head {
	text-align: center;
	font-size: 17px;
	color: #7847BE;
	font-weight: bold;
	line-height: 1.7;
}

.or-link-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	box-sizing: border-box;
	margin-top: 20px;
}

.or-link-list li {
	width: 100%;
	position: relative;
	border-right: 1px solid #7847BE;
	border-bottom: 1px solid #7847BE;
	display: flex;
	align-items: center;
	height: 115px;
	padding: 10px;
}

.or-link-figure {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
}

.or-link-figure img {
	width: 100%;
	height: auto;
}

.or-link-img {
	width: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	height: auto;
	margin-top: 15px;
}

.or-link-img img {
	width: 100%;
	height: auto;
}

.or-link-img img.or-link-img01 {
	width: 70%;
}

.or-link-img img.or-link-img02 {
	width: 55%;
}

.or-link-txt {
	font-weight: bold;
	font-size: 15px;
	text-align: center;
}

.or-link-scroll {
	transition: 0.5s all;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.or-link-scroll:hover {
	text-decoration: none;
}

.or-link-scroll:hover .or-link-arrow {
	transform: translateY(15px);
}

.or-link-arrow {
	width: 30px;
	margin: 20px auto 0;
	transition: 1s all;
	display: none;
}

.or-link-arrow img {
	width: 100%;
	height: auto;
}

/****************************
メインセクション
****************************/

.or-main {
	margin-top: 35px;
}

.or-main-cont li {
	padding: 20px 0;
}

ol.or-main-cont.li-2 {
	background-color: #eee;
}

.or-main-cont li:nth-child(2n) {
	background-color: #EEE;
}

.or-main-head {
	display: flex;
	align-items: flex-start;
}

.or-main-figure {
	width: 60px;
}

.or-main-figure img {
	width: 100%;
	height: auto;
}

.or-main-head-txt {
	margin-left: 15px;
	width: 100%;
}

.or-main-head-en {
	font-size: 26px;
	font-weight: bold;
	font-family: 'DIN Condensed';
	color: #7847BE;
}

.or-main-head-ja {
	font-size: 16px;
	font-weight: bold;
}

.or-main-ex {
	margin-top: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.or-main-img {
	width: 100%;
	max-width: 150px;
}

.or-main-img02 {
	max-width: 120px;
}

.or-main-img03 {
	max-width: 200px;
}

.or-main-img04 {
	max-width: 200px;
}

.br-pc {
	display: none;
}

/****************************
ビジネスパートナー募集、ライセンスのご案内
****************************/

.indexSec04.or-bnr .inner {
	padding: 0 15px;
}

.indexSec04.or-bnr-sec .inner {
	padding: 0 15px;
}

.or-bnr {
	margin-top: 60px;
}

.or-bnr-sec {
	margin-top: 50px;
}

.or-bnr-txt {
	margin-top: 15px;
}

.indexSec04 .inbox .or-bnr-area {
	height: 140px;
}

.indexSec04 .inbox .or-bnr-box {
	top: 80%;
}

.indexSec04 .inbox .or-bnr-box-2 {
	top: 74%;
}

.indexSec04 .inbox .or-bnr-area .or-bnr-en {
	line-height: 1.1;
}

.or-bnr-link {
	margin-top: 15px;
}

.or-bnr-en {
	font-size: 44px;
}

.or-txt-mod {
	text-align: center;
	font-weight: bold;
}

.or-bnr-top {
	margin-top: 25px;
}

.or-bnr-btn {
	text-align: center;
	margin-top: 15px;
}

/****************************
導入事例
****************************/

.caseWrap {
	padding-bottom: 60px;
}

.case-top {
	margin: 40px auto 0;
	position: relative;
}

.case-top-left {
	width: 100%;
}

.case-top-right {
	width: 100%;
}

.case-top-label {
	margin: 0 auto;
}

.case-top-list {
	margin-top: 20px;
}

.case-top-list li {
	font-weight: bold;
	line-height: 1.8;
}

.case-top-txt {
	margin-top: 20px;
	line-height: 1.8;
}

.bg-black {
	background-color: #333;
}

.case-top-arrow {
	width: 30px;
	position: static;
	text-align: center;
	margin: 25px auto;
}

.case-top-arrow img {
	width: 100%;
	height: auto;
}

/****************************
タブ切り替え部分
****************************/

.case-sv {
	background-color: #e3daf1;
	padding-bottom: 40px;
}

.case-tab {
	display: flex;
	flex-wrap: wrap;
}

.case-tab-btn {
	width: 100%;
	font-weight: bold;
	height: 65px;
	line-height: 65px;
	display: flex;
	align-items: center;
	font-size: 21px;
	box-sizing: border-box;
}

.case-tab-active {
	color: white;
	background-color: #7847BE;
}

.case-tab01 {
	justify-content: center;
}

.case-tab02 {
	justify-content: center;
}

.case-tab-icon01 {
	margin-left: 30px;
}

.case-tab-icon02 {
	margin-left: 50px;
}

.case-sv-imp {
	display: none;
}

.case-tab-show {
	display: block;
}

.case-tab-none {
	display: none;
}

.case-sv-go {
	margin-top: 50px;
}

.case-sv-come {
	margin-top: 50px;
}

.case-sv-head {
	font-weight: bold;
	font-size: 22px;
	text-align: center;
	margin-top: 30px;
}

.case-sv-head-pp {
	color: #7847BE;
}

.case-sv-flow {
	display: flex;
	flex-wrap: wrap;
	box-sizing: border-box;
}

/* 現状の課題 */

.case-sv-now {
	width: 100%;
	background-color: #f4f4f4;
	padding: 40px 15px;
	box-sizing: border-box;
}

.case-sv-now-main {
	margin-top: 50px;
}

.case-sv-now-icon {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
	position: relative;
}

.case-sv-now-pob {
	position: absolute;
	top: 70px;
	right: 38px;
}

.now-icon-03 {
	margin-right: -80px;
}

.now-icon-03-mod {
	margin-right: 0;
}

.case-sv-now-pob2 {
	position: absolute;
	top: 45px;
	right: 78px;
}

.now-arrow-01 {
	margin-right: -60px;
}

.case-sv-now-txt {
	margin-left: 10px;
	font-weight: bold;
}

.case-sv-now-arrow {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 20px;
}

.case-sv-now-label {
	width: 50px;
	text-align: center;
	color: white;
	font-weight: bold;
	background-color: #575857;
	border-radius: 5px;
	margin-left: 8px;
}

.case-sv-now-box {
	margin-top: 20px;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.8;
}

.case-sv-now-box-card {
	border: 1px solid #333;
	padding: 5px;
	box-sizing: border-box;
	margin-top: 5px;
}

.case-sv-now-box-card span {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	border: 1px solid #333;
	padding: 10px;
}

.case-sv-now-box-mod {
	margin-top: 20px;
}

/* 導入システム */

.case-sv-system {
	width: 100%;
	padding: 40px 15px;
	background-color: white;
	box-sizing: border-box;
}

.case-sv-system-txt {
	font-weight: bold;
	margin-top: 15px;
}

.case-sv-system-icon {
	position: relative;
	text-align: center;
}

.icon-gps {
	position: absolute;
	top: -40px;
	left: 0;
}

.case-sv-system-arrow {
	display: flex;
	align-items: center;
	margin-left: 100px;
	margin-top: 15px;
}

.case-sv-system-arrow-txt {
	font-weight: bold;
	margin-left: 15px;
}

.case-sv-system-label {
	width: 50px;
	text-align: center;
	color: white;
	font-weight: bold;
	background-color: #7847BE;
	border-radius: 5px;
	margin-left: 8px;
}

.label-long {
	width: 120px;
}

.system-icon-01 {
	margin: 40px auto 0;
	width: 80%;
	text-align: center;
}

.system-icon-02 {
	margin-top: 25px;
	text-align: center;
}

.system-icon-03 {
	margin-top: 25px;
}

.system-icon-04 {
	margin-top: 10px;
}

.case-sv-system-bottom {
	margin-top: 25px;
	line-height: 1.7;
}

.case-sv-system-bottom span {
	color: #7847BE;
	font-weight: bold;
}

.case-sv-system-fin {
	text-align: center;
	margin-top: 20px;
}

.case-sv-wrap {
	margin-top: 30px;
	position: relative;
	display: flex;
	justify-content: space-between;
}

.case-sv-il {
	width: 37%;
}

.case-sv-il-rt {
	position: absolute;
	top: 180px;
	left: 40%;
	max-width: 65px;
}

.case-sv-il-txt {
	font-weight: bold;
	text-align: center;
	margin-top: 15px;
}

.case-sv-il-txt-mod {
	text-align: left;
}

.case-sv-il-icon img {
	display: block;
	margin: 0 auto;
}

.il-icon02 {
	margin-top: 20px;
}

.il-icon04 {
	margin-top: 33px;
}

.il-arrow01 {
	display: flex;
	justify-content: center;
	margin-left: 8px;
}

.il-arrow02 {
	display: flex;
	justify-content: center;
	margin-left: 0;
}

.il-arrow03 {
	display: flex;
	justify-content: center;
	margin-left: 100px;
}

.case-sv-bottom-arrow {
	margin-top: 30px;
	text-align: center;
}

.indexSec04 .case-bnr-link:before {
	background: #c3b1e1;
}

.indexSec04 .case-content {
	width: 95%;
	margin: 0 auto;
}

/****************************
トップページ
****************************/

.top-tech-img {
	margin: 0 calc(50% - 50vw);
}

.top-tech .or-link-list li {
	border-right: none;
	padding: 10px 10px 0 10px;
}

.top-tech .or-fadein {
	opacity: 0;
	transform: translateY(30px);
	transition: 0.8s all;
}

.top-tech .or-link-img img.or-link-img03 {
	width: 100%;
}

.top-tech .or-link-img img.or-link-img04 {
	width: 93%;
}