@charset "utf-8";

/* #keyv2023
--------------------------------------------*/
#keyv2023 {
	position: relative;
	margin: 0;
	background: #f0fdff url("../img/kinesys3/bg_keyv_2.png") no-repeat 20% 100%;
	background-size: cover;
	color: #FFF;
	min-height: 600px;
	padding: 6.5vw 0 2vw;
}
#keyv2023 .baseWidth {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	max-width: 1300px;
	position: relative;
}
#keyv2023 .signage{
	width: 48%;
}
#keyv2023 .signage .pic{
	position: relative;
	width: 100%;
	max-width: 630px;
	margin: auto;
}
#keyv2023 .txtArea {
	width: 35%;
}
#keyv2023 .txtArea .title {
	overflow: hidden;
	display: block;
	width: 36vw;
	height: 17vw;
	max-width: 460px;
	max-height: 220px;
	background: url(../img/kinesys3/logo2.png) no-repeat;
	background-size: contain;
	text-indent: -9999px;
}
#keyv2023 .txtArea .txtimg01 {
	margin-bottom: 1em;
}

@media only screen and (max-width:1024px) {
	#keyv2023 {
		background: #f0fdff url("../img/kinesys3/bg_keyv_2.png") no-repeat 20% 20%;
		background-size:auto;
		min-height: 340px;
		padding: 3em 0 2em;
	}
	#keyv2023 .baseWidth {
		flex-direction: column
	}
	#keyv2023 .signage{
		width: 90%;
		margin: 0 0 1em;
	}
	#keyv2023 .txtArea {
		width: 80%;
		position: relative;
	}
	#keyv2023 .txtArea .title {
		margin: 0 auto;
	}
}

/*セール用ボタン*/
#keyv2023 .saleBan{
	width: 160px;
	position: absolute;
	left: 2%;
  top: -3%;
	z-index: 15;
	opacity: 0;
}
#keyv2023 .saleBan a:hover{
	opacity: 0.8;
}
.saleBan {
  animation: zoomIn 0.5s cubic-bezier(0.25, 1, 0.5, 1) forwards;
	animation-delay: 0.5s;
}
@keyframes zoomIn {
  0% {
    transform: scale(0.5);
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@media only screen and (max-width:1024px) {
	#keyv2023 .saleBan{
		width: 20vw;
		left:unset;
		right: 5%;
		top: 40%;
	}
}


/* #keyv
--------------------------------------------*/
#keyv {
	position: relative;
	margin: 0;
	background: #f8fafa url("../img/kinesys3/bg_keyv.png") no-repeat 50% 40%;
	background-size: cover;
	color: #FFF;
	min-height: 600px;
	padding: 7vw 0 2vw;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}
#keyv .txt {
}
#keyv .title {
	overflow: hidden;
	display: block;
	width: 60vw;
	height: 45vw;
	max-width: 740px;
	max-height: 542px;
	background: url(../img/kinesys3/keyv/keyv_t1.png) no-repeat;
	background-size: contain;
	text-indent: -9999px;
	margin-right: 2em;
}
/*
#keyv .title img {
	width: 96%;
	margin: auto;
}
*/
#keyv .signage{
	text-align: center;
	position: relative;
	display: flex;
	justify-content:center;
}
#keyv .signage .pic{
	position: relative;
	width: 100%;
	max-width: 460px;
	margin: auto;
}
#keyv .signage .pic:after{
	content: "";
	position: absolute;
	display: block;
	background: url("../img/kinesys3/keyv/keyv_t2.png") no-repeat 50% 50%;
	background-size: cover;
	width: 161px;
	height: 160px;
	top: 0;
	left: 10%;
	z-index: 2;
}
#keyv .motionImg{
	border: 2px solid #000;
	position: absolute;
	top:3.8%;
	right: 5.5%;
	max-width: 255px;
	width: 55.5%;
}
#keyv .motionImg .flow {
	margin: 0 auto;
	background-color: white;
}
#keyv .motionImg .flow li img{
	width: 100%;
}

@media only screen and (max-width:1024px) {
	#keyv {
		background: #f8fafa url("../img/kinesys3/bg_keyv.png") no-repeat 80% 0%;
		background-size:cover;
		min-height: 340px;
		padding: 15% 0 0;
		flex-direction: column;
	}
	#keyv .txt {
		width: 100%;
		height: auto;
		padding: 2% 5% 5%;
	}
	#keyv .title {
		width: 100vw;
		height: 64vw;
		margin: 0 auto;
	}
/*
	#keyv .title img {
		width: 100%;
	}
*/
	#keyv .signage {
		background-color:rgba(200,255,255,0.4);
		width: 100%;
		padding-top: 8vw;
		z-index: 5;
	}
	#keyv .signage  .pic{
		width: 80%;
		bottom:-8vw;
		max-width:inherit;
	}
	#keyv .signage .pic:after{
		background: url("../img/kinesys3/keyv/keyv_txt2_sp.png") no-repeat 50% 0%;
		background-size:contain;
		width: 110%;
		height: 100%;
		top: -12%;
		left:-5%;
	}
	#keyv .signage .pic img{
		width: 80%;
	}
	#keyv .motionImg{
		top:19.8%;
		right: 21.6%;
		max-width: 358px;
		width: 35.4%;
	}
}
@media only screen and (max-width:540px) {
	#keyv .motionImg {
		top: 19.9%;
		right: 21.5%;
		width: 35.7%;
	}
}



/* #aboutai
--------------------------------------------*/
#aboutai{
	background: #0a54a1 url("../img/kinesys3/bg_ai.jpg") no-repeat -80% 30%;
	background-size:95%;
}
#aboutai .inner{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
#aboutai .inner .txt{
	color:#FFF;
	padding-left: 35%;
	letter-spacing: 1px;
}
#aboutai .linkList{
	font-size:0.9em;
	background-color: rgba(1,18,53,0.6);
	display: inline-block;
	padding: 0.8em 1.2em 0.5em;
}
#aboutai .linkList .textTitle{
	border-bottom: 1px dotted #FFF;
	padding-bottom: 0.4em;
	margin-bottom: 0.8em;
}
#aboutai .linkList li .marktag{
	color:#FFF855;
}
#aboutai .linkList li a{
	color:#FFF;
/*	background-color: rgba(1,18,53,0.7);*/
/*	padding: 0.3em 0.8em;*/
	display: inline-block;
	transition: all 0.4s;
}
#aboutai .linkList li a:hover{
	color:#FFF855;
/*	background-color: rgba(1,18,53,0.5);*/
}

#aboutai .inner .btnType01 a {
	color:#135aac;
	background:#FFF;
}
#aboutai .inner .buttonArrow span::before,
#aboutai .inner .buttonArrow span::after{
	background-color: #135aac;
}

@media only screen and (max-width:1024px) {
	#aboutai{
		background: #0a54a1 url("../img/kinesys3/bg_ai_sp.jpg") no-repeat 50% -20px;
		background-size:cover;
		padding-top: 15%;
		position: relative;
		overflow: hidden;
	}
	#aboutai .inner{
		flex-direction: column;
		padding: 0 6%;
	}
		#aboutai .inner .txt{
			padding: 0;
	}
	#aboutai:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background:rgba(1,1,29,0.20);
	}
}


/* #topbanlink
--------------------------------------------*/
#topbanlink.sec{
	padding: 2% 4% 0%;
}
#topbanlink ul{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
}
#topbanlink ul li{
	width: 24%;
}
#topbanlink ul li a:hover {
	opacity: 0.7;
}
@media only screen and (max-width:1024px) {
	#topbanlink ul{
		margin-top: 3em;
	}
	#topbanlink ul li{
		width: 49.5%;
		padding-top: 1%;
	}
}


/* #topintro
--------------------------------------------*/
#topintro{
	background:#FFF url("../img/kinesys3/bgtxt_intro .png") no-repeat -5px -10px;
	background-size: auto;
}
#topintro.sec{
	padding-top: 4%;
}
#topintro .youtube{
	max-width: 800px;
}
#topintro .introtxt{
	font-size: 1.2em;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-align: center;
	margin:2em auto 3em;
	width: 80%;
}
#topintro .clean{
	text-align: center;
	margin-bottom: 4em;
}
#topintro .clean img{
	width: 50%;
}
#topintro .clean a:hover{
	opacity: 0.7;
}

@media only screen and (max-width:1024px) {
	#topintro{
		background-size:contain;
	}
	#topintro .introtxt{
		font-size: 1em;
		text-align: left;
		width: 90%;
		margin: 1em auto 3em;
	}
	#topintro .clean img{
		width: 80%;
	}
	#topintro .btnType01{
		margin: 0 4%;
	}
}


/* #topics
--------------------------------------------*/
#topics{
	background-color:#e8edf3;
	background:#e8edf3 url("../img/kinesys3/bgtxt_topics .png") no-repeat -5px -10px;
	background-size: auto;
}
#topics .baseWidth {
		max-width: 1060px;
}
#topics .inner {
		display: table;
		width: 100%;
		border: 1px solid #e8edf3;
}
#topics li {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 0;
	padding-left: 0px;
	border-bottom: 1px solid #e8edf3;
	background-color: #FFF;
}
#topics li a {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	position: relative;
	width: 100%;
	padding: 1.5em 2em 1.5em 2em;
	text-decoration: none;
	transition: all 0.3s ease;
}
#topics li a:hover {
	color:#135aac;
	background-color: #f0f9fd;
}
#topics .date {
	display: inline-block;
	width: 100px;
	font-family: 'Roboto';
	font-weight: 700;
	vertical-align: top;
}
#topics li span {
	vertical-align: middle;
}
#topics .tag {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	background: #ccc;
	width: 80px;
	background-color: #afb1b7;
	color: #fff;
	 margin-right: 26px;
	vertical-align: top;
}
#topics .txt {
	display: inline-block;
	width: calc(100% - 100px - 10px - 100px);
	margin-bottom: 0;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

@media only screen and (max-width:1024px) {
	#topics{
		background-size: contain;
	}
	#topics ul {
		width: 98%;
		margin: 0 auto;
	}
	#topics li a {
		padding: 1.5em 2em 1.5em 2em;
	}
		#topics li .txt {
		width: 100%;
		padding-top: 10px;
	}
}


/* #pickup
--------------------------------------------*/
#pickup{
	background:  url("../img/kinesys3/bgtxt_pickup .png") no-repeat -5px -15px;
	background-size: auto
}
#pickup .cardLayout .item{
	margin-top: 4em;
}
#pickup .cardLayout .item .inner{
	margin: 1em auto;
}
#pickup .item:hover .arrowLink::after{
	margin-left: 20px;
}
#pickup .listLayout .item{
	border: 1px solid #135aac;
	padding: 3%;
	width: 90%;
	margin: 0 auto;
	box-shadow: none;
}
#pickup .listLayout .item .pic{ width: 35%;}
#pickup .listLayout .item .txt{ width: 65%;}

@media only screen and (max-width:1024px) {
	#pickup{
		background-size: contain
	}
	#pickup .headline:after {
		margin-bottom: 20px;
	}
	#pickup .listLayout .item{
		width: 100%;
	}
	#pickup .listLayout .item .pic{ width: 100%;}
	#pickup .listLayout .item .txt{ width: 100%;}
}

@media only screen and (max-width:450px) {
	#pickup .headline:after {
		margin-bottom: 0;
	}
	#pickup .cardLayout .item {
		margin-bottom: 0;
	}
}


/* #casetop
--------------------------------------------*/
#casetop{
	background: #e7f5ff url("../img/kinesys3/bg_human.jpg") no-repeat 50% 50%;
	background-size:cover;
	color:#135aac;
	font-weight: 900;
}
#casetop .headline3{
	font-size: 1.6em;
	margin-bottom: 0.5em;
}
#casetop .headline3 span{
	border-bottom: 3px solid #135aac;
}
#casetop .headline3 .bigtxt{
	font-size: 1.8em;
	font-family: 'Roboto',sans-serif;
}
#casetop .inner{
	display:flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	margin-bottom: 1em;
}
#casetop .inner .pic{
	width: 25%;
	max-width: 270px;
}
#casetop .inner .txt{
	width: 70%;
}
#casetop .caseArea{
	margin-bottom: 3em;
}
#casetop .caseArea .topCaseList {
	margin: 20px auto;
	display: flex;
	align-items: stretch;
	flex-wrap: wrap;
}
#casetop .caseArea .topCaseList li{
	min-height: 170px;
	width: 31.5%;
	border: 5px solid #84C6F7;
	background-color: rgba(255,255,255,1);
	margin: 0 0.5em 1.5%;
	transition: all .3s ease;
	box-shadow: 0px 1px 6px rgb(0 0 0 / 12%);
}
#casetop .company{
	display:flex;
	flex-direction: column;
	justify-content:space-between;
	align-items: center;
	padding: 1em;
}
#casetop .company .pic{
	margin-bottom: 0.5em;
}
#casetop .company .txt{
	color: #222;
	font-weight: normal;
	text-align:left;
	line-height: 1.6;
}
#casetop .company .txt .cName{
	font-size: 1em;
	font-weight: 700;
	margin-bottom: 0.8em;
	padding-bottom: 0.4em;
	border-bottom:1px solid #84C6F7;
	text-align: center;
}
#casetop .company .txt .shortTxt{
	font-size: 0.9em;
}
#casetop .caseArea .topCaseList li:hover {
	border: 5px solid #FFF;
}
#casetop .company:hover {
	opacity: 0.8;
}

@media only screen and (max-width:1024px) {
	#casetop .inner{
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 1em 1em;
	}
	#casetop .inner .pic{
		width: 60%;
		margin-bottom: 1em;
	}
	#casetop .headline3{
		text-align: center;
	}
	#casetop .inner .txt{
		width: 100%;
	}
	#casetop .caseArea{
		margin-bottom: 1em;
	}
	#casetop .caseArea .topCaseList {
		flex-direction: column;
	}
	#casetop .caseArea .topCaseList li{
		min-height:inherit;
		margin: 0.3em 0;
		width: 100%;
	}
	#casetop .company{
		flex-direction: row;
		align-items: flex-start;
	}
	#casetop .company .txt{
		width: 67%;
	}
	#casetop .company .pic{
		width: 30%;
	}
	#casetop .company .txt .cName{
		text-align: left;
	}
}

/* #sceneConductor
--------------------------------------------*/
#sceneConductor {
	background: #164FA4;
	margin: 0 auto 0;
}
#sceneConductor .imgTxt {
	position: relative;
	color: #FFF;
}
#sceneConductor .txtBox {
	position: absolute;
	z-index: 1;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	text-align: center;
	width: 100%;
}
#sceneConductor .picBox {
	position: relative;
	width: 100%;
}
#sceneConductor .picBox:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(2,60,180,0.75);
}
#sceneConductor .sceneTitle{
	font-size: 1.8em;
	letter-spacing: 0.1em;
	font-weight: bold;
	margin-bottom: 0.2em;
}
#sceneConductor .btnType01{
	margin-top: 0.6em;
}
#sceneConductor .btnType01 a{
	color:#135aac;
	background-color: #FFF;
}
#sceneConductor .buttonArrow span::before,
#sceneConductor .buttonArrow span::after{
	background-color: #135aac;
}
@media only screen and (max-width:1024px) {
	#sceneConductor .btnType01 a{
		width: 70%;
	}
}


/* #otherlink
--------------------------------------------*/
#otherlink .link{
	display:flex;
	justify-content: space-between;
	align-items: center;
}
#otherlink .inner{
	display:flex;
	justify-content: center;
	align-items: center;
	width: 45%;
}
#otherlink .inner .pic{
	width: 26%;
	padding-right: 6%;
}
#otherlink .txt .headline3 {
	color:#135aac;
	position: relative;
	z-index: -1;
}
#otherlink .txt .headline3 span{
	position: absolute;
	top: -0.5em;
	left: 0.5em;
	z-index: -1;
}
#otherlink .inner .btnType01 a{
	min-width:220px;
}

@media only screen and (max-width:736px) {
	#otherlink .link{
		width: 90%;
		margin: 0 auto;
		flex-direction: column;
	}
	#otherlink .inner{
		width: 90%;
		margin-bottom: 15%;
	}
	#otherlink .inner:last-child{
		margin-bottom: 0;
	}
	#otherlink .inner .pic{
		width: 50%;
		padding-right: 5%;
	}
	#otherlink .inner .txt{
		width: 100%;
	}
	#otherlink .inner .btnType01 a{
		min-width:initial;
	}
	#otherlink .buttonArrow span{
		padding-right: 30px;
	}
	#otherlink .buttonArrow span::after {
		width: 20px;
	}
}

/* #blogGuid
------------------------------------------------------*/
#blogGuid {
	background-color: #F9F9F9;
	padding: 6em 0;
}
#blogGuid .cardLayout2{
	display: flex;
	flex-direction: row;
	justify-content:space-evenly;
	flex-wrap: wrap;
	max-width: 1180px;
	margin: 0 auto 2em;
}
#blogGuid .cardLayout2 .item {
	width: 31%;
	margin-bottom: 2%;
	border-radius: 4px;
	position: relative;
	transition: all .3s ease;
	background-color: #fff;
	box-shadow: 0px 1px 6px rgb(0 0 0 / 12%);
	overflow: hidden;
}
#blogGuid .cardLayout2 .item:hover {
	opacity: 0.8;
	box-shadow: 0px 1px 2px rgb(0 0 0 / 8%);
/*	background-color: #e1eef8;*/
}
#blogGuid .cardLayout2 .item .inner {
	width: 90%;
	margin: 1em auto 1.2em;
}
#blogGuid .cardLayout2 .item .inner .title {
	font-weight: 700;
	margin-bottom: 0.5em;
}
#blogGuid .cardLayout2 .item .inner .txt {
	font-size: 0.9em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}
#blogGuid .btnType01{
	margin: 0 3em;
}
@media only screen and (max-width:768px) {
	#blogGuid {
		padding: 4em 0;
	}
	#blogGuid .cardLayout2 .item {
		width: 47%;
		margin-bottom: 2%;
	}
	#blogGuid .cardLayout2 .item .inner .txt {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
	}
}

/* #releasenote
--------------------------------------------*/

#releasenote .baseWidth {
	max-width: 1060px;
}
#releasenote .box ul {
	overflow-y: auto;
	height: 320px;
}
#releasenote .box li {
	border-bottom: 1px solid #ccc;
}
#releasenote .box a, #releasenote .box li>span {
	display: flex;
	padding: 1em 1em 1em 2em;
}
#releasenote .ver {
	padding-right: 2em;
	white-space: nowrap;
	font-weight: 700;
}
#releasenote .tag, #releasenote .pf {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	height: 22px;
	padding: 0 0.5em;
	margin-right: 0.4em;
	background: #AFB1B7;
	font-size: .875em;
	text-decoration: none !important;
	color: #fff;
}
#releasenote .date {
	margin-right: 0.4em;
	white-space: nowrap;
	text-decoration: none !important;
/*
	color: #AFB1B7;
	font-weight: normal;
*/
}


/* #feature List
--------------------------------------------*/
#featureBasic {
	margin-top: -5%;
	margin-bottom:0;
	background: #FFF url("../img/kinesys3/feature/bg_ai.jpg") no-repeat 50% 50%;
	background-size:cover;
}
#featureBasic .title{
	margin-bottom: 2em;
}
#featureBasic .title span{
	color:#FFF;
	font-size: 1.8em;
	font-weight: 900;
	line-height: 1.6;
	letter-spacing: 0.1em;
	display: inline-block;
	padding: 0.7em 2em 0.5em 1.2em ;
	background: rgba(255,255,255,0) linear-gradient(20deg,rgba(12,179,238,.8),rgba(11,86,238,.8));
	-webkit-clip-path: polygon(0 0,100% 0,100% 0,90% 100%,0 100%,0 0);
	clip-path: polygon(0 0,100% 0,100% 0,90% 100%,0 100%,0 0);
}
#featureBasic .aiData{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items:center;
	margin: 2em 0 3em;
}
#featureBasic .aiData .pic{
	width: 38%;
}
#featureBasic .aiData .txt{
	width: 56%;
}
#featureBasic .col3Box li{
	border: none;
	box-shadow: 0px 2px 8px rgba(0,0,0,.2);
	background-color: rgba(255,255,255,0.90)
}
#featureList{
	background-color: #F1F9FE;
}
#featureList .cardLayout .number{
	left: 3%;
}
#featureList .cardLayout .thumb{
	border-radius: 4px 4px 0 0;
	overflow: hidden;
}
#featureList .cardLayout .item{
	width: 32%;
	margin-top:4em;
	padding: 0;
	border-radius: 4px;
	box-shadow: 0px 1px 6px rgba(0,0,0,.1);
	margin-right: 1.333%;
}
#featureList .cardLayout .item:nth-child(3n){
	margin-right: 0;
}
#featureList .cardLayout .item:hover{
	box-shadow: none;
}
#featureList .item:hover .arrowLink::after{
	margin-left: 20px;
}
#featureList .cardLayout .item .inner{
	width: 90%;
	margin: 1em auto 1.5em;
}

@media only screen and (max-width:1024px) {
	#featureBasic{
		background: #FFF url("../img/kinesys3/feature/bg_ai.jpg") no-repeat 30% 50%;
		background-size:cover;
		position: relative;
		overflow: hidden;
	}
	#featureBasic:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(288,288,288,0.7);
	}
	#featureBasic .title{
		text-align: center;
	}
	#featureBasic .title span{
		font-size: 1.3em;
		line-height: 1.6;
		margin: 0 auto;
		padding: 0.7em 2em;
		-webkit-clip-path: polygon(0 0,100% 0,100% 0,93% 100%,0 100%,7% 0);
		clip-path: polygon(0 0,100% 0,100% 0,93% 100%,0 100%,7% 0);
	}
	#featureBasic .aiData{
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 auto 2em;
		width: 90%;
	}
	#featureBasic .aiData .pic{
		display: none;
	}
	#featureBasic .aiData .txt{
		width: 100%;
	}
	#featureList .cardLayout{
		justify-content: space-between;
	}
	#featureList .cardLayout .item{
		width: 48%;
		margin-right: 0;
	}
}
@media only screen and (max-width:736px) {
	.col3Box ul{
		flex-direction: column;
		width: 95%;
		margin: auto;
	}
	.col3Box ul li{
		padding: 1.5em 1em;
		margin: 0 0 1em 0;
		width: 100%;
	}
	#featureList .cardLayout .item{
		width: 100%;
	}
}


/* #featureDetail
--------------------------------------------*/
#featureDetail{
	padding-top: 0;
	padding-bottom: 3em;
}
#featureDetail .title{
	color:#166BCC;
	font-size: 2.2em;
	font-weight: 900;
	line-height: 1.8;
	text-align: center;
	letter-spacing: 0.1em;
}
#featureDetail .decoIcon {
	color: #333;
	font-size: 1.2em;
	font-weight: 900;
	margin-bottom: 1.6em;
	text-align: center;
}
#featureDetail .decoIcon span {
	padding: 0 0 0.1em;
	border-bottom: 0.4em solid #FFEA30;
	display: inline;
}
#featureDetail .inner{
	width: 80%;
	max-width: 880px;
	margin: 2em auto 0;
	padding-top: 1em;
}
#featureDetail .txt {
	margin-top: 2em;
}
/* inner2Col */
#featureDetail .inner2Col{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items:flex-start;
	margin: 3em auto 2em;
}
#featureDetail .inner2Col .pic,
#featureDetail .inner2Col .txt{
	width: 47%;
}
#featureDetail .inner2Col .txt{
	margin-top: 1em;
}
#featureDetail .inner2Col .headline3{
	color: #222;
	margin-bottom: 0.5em;
}

@media only screen and (max-width:1024px) {
	#featureDetail{
		padding-top: 1em;
		padding-bottom: 2em;
	}
	#featureDetail .title{
		font-size: 1.6em;
		line-height: 1.6;
	}
	#featureDetail .inner{
		width: 100%;
		max-width:inherit;
		padding-top: 0;
	}
	/* inner2Col */
	#featureDetail .inner2Col{
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin: 2em auto 0;
		width: 90%;
	}
	#featureDetail .inner2Col .pic,
	#featureDetail .inner2Col .txt{
		width: 100%;
	}

}


/* #contents List
--------------------------------------------*/
#contentsBasic{
}
#contentsBasic .signageData{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items:flex-start;
/*	margin-top: -2%;*/
}
#contentsBasic .signageData .pic{
	width: 34%;
}
#contentsBasic .signageData .txt{
	width: 60%;
}

#contentsBasic .signageData .headline3{
	margin:0 0 0.2em;
}
#contentsBasic .signageData ul {
	margin-bottom: 1.4em;
}
#contentsBasic .signageData li{
	list-style: inside;
	padding-left: 1em;
	text-indent: -1em;
	font-weight: 700;
}

#contentsBasic .newcontents{
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 1px dashed #e6086d;
	padding: 1em 0;
	margin: -2% auto 4%;
}
#contentsBasic .newcontents .newconhead{
	color: #E6086D;
	font-size: 1.2em;
	font-weight: bold;
	width: 20%;
	text-align: center;
	margin-right: 1%;
	line-height: 1.6;
}
#contentsBasic .newcontents .newconhead span{
	color: #FFF;
	font-size: 0.7em;
	padding: 0 10px 2px;
	background-color: #e6086d;
	border-radius: 30px;
	line-height: 1;
}
#contentsBasic .newcontents ul{
	display: flex;
	justify-content: center;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-right: 2%;
}
#contentsBasic .newcontents li{
	width: 49%;
}
#contentsBasic .newcontents li a{
	padding: 1em 2.5em 1em 1.5em;
	background: #F8F8F8;
	display: block;
	position: relative;
	border: 1px solid #FEF;
	background-color: #FEF;
}
#contentsBasic .newcontents li a:hover {
	opacity: 0.9;
	border: 1px solid #FCF;
	background: #FFF6FF;
}
#contentsBasic .newcontents li a:after {
	color: #e6086d;
	position: absolute;
	content: "\f13a";
	font-family: 'Font Awesome 5 Free';
	font-weight: 900;
	top: 50%;
	right: 0.8em;
	left: auto;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
#contentsBasic .newcontents li .newfunc{
	font-weight: bold;
	font-size: 1.2em;
	margin-bottom: 0.1em;
	
}
#contentsBasic .newcontents li .newexp{
	font-size: 0.8em;
	line-height: 1.6;
}


#contentsList {
	background-color: #F1F9FE;
}
#contentsList .plusBox{
	padding: 2em 2em 0;
	margin-top: 4em;
	background-color: #0AAAAB;
	position: relative;
}
#contentsList .plusBox:before {
	content: '';
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 120%;
	background: #0AAAAB;
}
#contentsList .plusBox .icon {
	margin: -60px auto 0;
}
#contentsList .plusBox .icon img{
	max-width: 70px;
}
#contentsList .plusBox .headline3{
	color: #FFF;
	line-height: 2.2;
}
#contentsList .plusBox .headline3 .line {
	padding: 0 0 0.1em;
	border-bottom: 0.15em solid #FFF;
	display: inline;
}

#contentsListMore {
	background-color: #DFF1FF;
}
#contentsListMore .headline:after {
	margin-bottom: 1em;
}

#contentsListMore .plusBox{
	padding: 4em 2em 0;
}
#contentsListMore .plusBox .headline3{
	color: #FFF;
}

@media only screen and (max-width:1024px) {
	#contentsBasic .signageData{
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 auto;
		width: 90%;
	}
	#contentsBasic .signageData .pic{
		width: 100%;
	}
	#contentsBasic .signageData .txt{
		width: 100%;
		margin-top: 1em;
	}
	#contentsBasic .newcontents{
		width: 90%;
		flex-direction: column;
		padding: 1% 0 2%;
		margin-top: 0;
	}
	#contentsBasic .newcontents .newconhead{
		margin: 0 auto 1%;
		width: auto;
	}
	#contentsBasic .newcontents ul{
		margin:auto;
	}
	#contentsBasic .newcontents li {
		width: 94%;
		margin: auto;
	}
	#contentsBasic .newcontents li + li{
		margin-top: 1%;
	}
	#contentsBasic .plusBox{
		margin-top: 2em;
	}
}

@media only screen and (max-width:768px) {
}


/* #product Content contents List
--------------------------------------------*/
#contentsDetail {
	padding-top: 1em;
}
#contentsDetail .proTitle {
	text-align: center;
}
#contentsDetail .proTitle .headline2{
	font-weight: 700;
	letter-spacing: 0.1em;
}
#contentsDetail .proTitle .headline2 span{
	padding: 0 0 0.1em;
	border-bottom: 0.2em solid #FFEA30;
	display: inline;
}
#contentsDetail .inner{
	width: 80%;
	max-width: 880px;
	margin: 3em auto 0;
	padding-top: 1em;
}
#contentsDetail .txt{
	margin-top: 2em;
}
#detailMain {
	background-color: #F1F9FE;
}
#detailMain .listLayout {
	padding-bottom: 0;
}
#detailMain .listLayout .item {
	margin: 0;
	padding: 3% 4%;
}
#detailMain .listLayout .item .pic{
	width: 30%;
}
#detailMain .listLayout .item .txt{
	width: 70%;
}

#howtoblog {
	background-color:#d8f9f8;
	background-color: #dff1ff;
}
#howtoblog .cardLayout{
	justify-content: space-between;
}
#howtoblog .cardLayout .item{
	width: 24.2%;
}
#howtoblog .item:hover .arrowLink::after{
	margin-left: 20px;
}

.thumbLayout.underpoTxt li {
	flex-direction: row;
	flex-wrap: wrap;
}
.thumbLayout.underpoTxt .txt {
	max-width: none;
	padding: 0.5em 1em;
}

#costumeList {
	background-color: #dff1ff;
}
#costumeList .cardLayout{
	justify-content: space-between;
}
#costumeList .cardLayout .item{
	width: 50%;
	margin-bottom: 0;
	background-color: transparent;
}
#costumeList .emptxt{
	font-size:1.1em;
	font-weight: 900;
}
#costumeList .cosjapan{
	background: #FFF;
	margin:2em 1em 0;
	padding: 1em;
	border-radius: 10px;
}
#costumeList .headline3{
	font-size:1.3em;
	padding-bottom: 0.7em;
	margin-bottom: 1em;
	border-bottom: 2px solid #135AAC;
}
#costumeList .cosjapan .cardLayout{
	justify-content:center;
}
#costumeList .cosjapan p{
	padding: 0 1em;
}
#costumeList .cosjapan .cosPv{
	width: 80%;
	max-width: 880px;
	margin: 0 auto;
/*	padding-top: 1em;*/
	padding-bottom: 2em;
}

#costumeList .cosjapan .cardLayout .item.newcos figure{
	position: relative;
}
#costumeList .cosjapan .cardLayout .item.newcos figure:after{
	content: "";
	position: absolute;
	display: block;
	background: url("../img/kinesys3/feature/new_sengoku.png") no-repeat 50% 50%;
	background-size: cover;
	width: 100px;
	height: 100px;
	top: -8%;
	right: -11%;
	z-index: 2;
}

#costumeList .photostudio{
	text-align: center;
}
#costumeList .photostudio .logo{
	margin: 0 auto;
	max-width: 260px;
	width: 60%;
}

#referenceMovie .headline:after{
	margin: 0.6em auto 1em;
}
#referenceMovie .moreLink{
	text-align: center;
	margin-top: 1em;
}
#referenceMovie .headline:after{
	margin: 0.6em auto 1em;
}
#referenceMovie .moreLink{
	text-align: center;
	margin-top: 1em;
}

@media only screen and (min-width:1024px) {
	.thumbLayout.underpoTxt li {
		width: 24%;
	}
}
@media only screen and (max-width:1024px) {
	#contentsDetail .inner{
		width: 100%;
		max-width:inherit;
		padding-top: 0;
	}
	#howtoblog .cardLayout .item{
		width: 49%;
		padding: 1%;
	}
	#costumeList .cardLayout .item{
		width: 100%;
		padding: 1%;
		margin-bottom: 0.5em;
	}
	#costumeList .cosjapan{
		margin:4% 1% 1%;
	}
	#costumeList .cosjapan .cosPv{
		width: 100%;
		max-width: inherit;
		padding-top: 1.5em;
	}
}


/* #caseList
--------------------------------------------*/
#caseList{
	margin:0 auto;
	padding-bottom: 6%;
}
#caseList .company{margin-bottom: 6em;}
#caseList .company:last-child{margin-bottom: 0;}
#caseList .company ul{
	width: 96%;
	margin: 0 auto;
}
#caseList .company ul li{
	display:flex;
	flex-direction: row;
	justify-content:space-between;
	align-items:flex-start;
}
#caseList .company .pic{
	width: 40%;
}
#caseList .company .pic img{
	width: 100%;
}
#caseList .company .txt{
	width: 55%;
	text-align:left;
}
#caseList .company .logo{
	margin-bottom: 1em;
}
#casetop .company .logo img,
#caseList .company .logo img{
	width:auto;
	height: 50px;
}
#casetop .company .logo_s01 img,
#caseList .company .logo_s01 img{
	height: 45px;
}
#caseList .company .txt .headline4{
	font-size: 1.2em;
	font-weight: 900;
	margin: 0 0 0.5em;
}
#caseList .company .txt .btnType01{
	margin-top: 0.8em;
}
#caseList .company .txt .btnType01 a {
	min-width: 240px;
}

#client{
	background-color: #F1F9FE;
}
#client .cliflow{
	display: flex;
	justify-content:space-between;
	flex-wrap: wrap;
}
#client .cliflow li{
	flex-basis:24.5%;
/*	padding: 0 1.8em 1.5em;*/
	line-height: 1.8;
	position: relative;
	border-right: 1px solid #DDD;
	text-align: center;
}
#client .cliflow li:last-child{
	border-right: none;
}
#client .cliflow .title{
	color: #166BCC;
	font-size: 1.2em;
	font-weight: 900;
	min-height: 110px;
	margin: 1.5em auto 0.5em;
}
#client .cliflow .title span{
	font-size: 2.5em;
	padding-right: 5px;
}
#client .flowcom{
	text-align: center;
	margin: 3em auto 0;
	width: 90%;
	font-weight: 900;
	font-size: 1.4em;
}

@media only screen and (max-width:1024px) {
	#caseList .company{margin-bottom: 4em;}
	#caseList .company ul{
		width: 90%;
	}
	#caseList .company ul li{
		flex-direction: column;
	}
	#casetop .company .logo img,
	#caseList .company .logo img{
		height: 40px;
	}
	#casetop .company .logo_s01 img,
	#caseList .company .logo_s01 img{
		height: 30px;
	}
	#caseList .company .txt{
		width: 100%;
	}
	#caseList .company .pic{
		width: 100%;
		margin-bottom: 1em;
	}

	#client .cliflow{
		margin: 0 auto;
	}
	#client .cliflow li{
		flex-basis:auto;
		width:48%;
		margin: 0 0 1em;
		padding: 2em 1.2em 1.5em;
		text-align: center;
		border: none;
		background-color: #FFF;
	}
/*
	#client .cliflow li:last-child{
		border-right:1px solid #DDD;
	}
*/
	#client .cliflow .title{
		min-height:inherit;
		margin: 0 auto 0.5em;
	}
	#client .flowcom{
		align: left;
		margin: 1em auto 2em;
		font-size:1.2em;
	}
}


/* #caseDetail
--------------------------------------------*/
#hero.caseTitle{
/*background: rgba(19,90,172,1) url("../img/kinesys3/casestudy/sample/top.jpg") no-repeat 50% 0%;
	background-size: cover;
	background-blend-mode:overlay;*/
	margin-bottom: 3%;
}
#hero.caseTitle .title {
	font-size: 2em;
	letter-spacing: .15em;
}
#hero.caseTitle .subtitle {
	font-size: 1.1em;
	margin-top: 1em;
}
#caseName{
	padding: 0 4%;
	margin-bottom: 6em;
}
#caseName .caseHead {
/*	overflow: hidden;*/
	display: flex;
	align-items: center;
}
#caseName .caseHead .txt {
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	width: 60%;
	padding-right: 3em;
}
#caseName .caseHead .logo img{
	height: 35px;
}
#caseName .caseHead .logo.life img{
	height: 45px;
}
#caseName .caseHead .caseName01 {
	font-weight: 700;
	margin: 0.5em 0 1.5em;
}
#caseName .caseHead .caseName01 span{
	font-size:0.7em;
}
#caseName .caseHead .caseName02 {
	color: #166BCC;
	font-size: 1.8em;
	line-height: 1.6;
	text-align: left;
}
#caseName .caseHead .pic{
	width: 50%;
}
#caseName .caseHead .pic img{
	box-shadow: 8px 8px rgba(0,156,253,0.15);
}
#caseName .infoTxt{
	margin-top: 4em;
}
.infoTxt p {
	margin-bottom: 0.8em;
}
#caseComPhoto{
	margin-top: 3em;
}
#caseComPhoto ul{
	display: flex;
	justify-content: space-around;
/*	flex-wrap: wrap;*/
	margin: 0 auto;
}
#caseComPhoto li{
/*	width: 46%;*/
	margin-bottom: .8em;
	text-align: center;
	padding: 0 0.5%;
}

@media only screen and (max-width:768px) {
	#hero.caseTitle .title {
		font-size: 1.6em;
	}
	#hero.caseTitle .subtitle {
		display: none;
	}
	#caseName{
		margin-bottom: 3em;
	}
	#caseName .caseHead .logo img{
		height: 28px;
	}
	#caseName .caseHead .txt {
		width: 100%;
		height: auto;
		text-align: center;
		padding: 1em 0 0;
	}
	#caseName .caseHead .caseName01 {
		margin-bottom: 1em;
	}
	#caseName .caseHead .caseName02 {
		font-size: 1.4em;
	}
	#caseName .caseHead .pic {
		display: none;
	}
	#caseName .infoTxt{
		margin-top: 2em;
	}
	#caseComPhoto ul{
		flex-wrap: wrap;
	}
	#caseComPhoto li{
		width: 48%;
	}

}

#caseDetail{
	padding-top: 0;
}
.caseColumn2 {
	display: flex;
	justify-content: space-between;
}
.caseColumn2 .box {
	width: calc(50% - 40px);
}
.caseColumn2 .pic img{
	width: 100%;
}
.caseColumn2 .headline4 {
	color: #166BCC;
	padding: 0 0 1em;
	line-height: 1;
	margin-bottom: 0.5em;
}
#caseDetail .interview{
	margin-bottom: 5em;
}
#caseDetail .flex {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}
#caseDetail .flex .pic {
	max-width: 40%;
	min-width: 40%;
	margin-left: 40px;
}
#caseDetail .flex .txt{
	flex-grow: 1;
	padding-top: 2em;
}
#caseDetail .flex .txt .headline3{
	color: #222;
	font-size: 1.5em;
	margin-bottom: 1.8em;
	position: relative;
}
#caseDetail .flex .txt .headline3:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: -.7em;
	display: inline-block;
	width: 80px;
	height: 4px;
	background-color: #166bcc;
}
#caseDetail .interview .flex.reverse {
	flex-direction: row-reverse;
}
#caseDetail .interview .flex.reverse .pic {
	margin-right: 40px;
	margin-left: 0;
}
#caseDetail .comment{
/*	border: 1px solid #EAEAEA;*/
	padding: 2.5em 3em;
	background-color: #F1F9FE;
}
#caseDetail .comment .flex .txt{
	padding-top: 0;
}
#caseDetail .comment .flex .pic {
	max-width: 25%;
	min-width: 25%;
	margin-left: 80px;
}
#caseDetail .comment .flex .pic02 {
	max-width: 40%;
	min-width: 40%;
	margin-left: 80px;
}
#caseDetail .comment .txt .inner {
	position: relative;
	margin-bottom: 2.5em;
}
#caseDetail .comment .txt .inner:before, #caseDetail .comment .txt .inner:after {
	position: absolute;
	font-size: 40px;
	font-weight: 700;
	color: #CCC;
}
#caseDetail .comment .txt .inner:before {
	content: "“";
	top: -0.8em;
	left: -0.7em;
}
#caseDetail .comment .txt .inner:after {
	content: "”";
	right: -.5em;
	bottom: -1.1em;
}
#caseDetail .comment .txt .grayBox {
	padding: 1em;
	background: #FFF;
}
@media only screen and (max-width:768px) {
	.caseColumn2 {
		flex-direction: column;
	}
	.caseColumn2 .box {
		width: auto;
		margin: 0 !important;
		text-align: center;
	}
	#caseDetail .interview {
		margin-bottom: 4em;
	}
	#caseDetail .flex,
	#caseDetail .interview .flex.reverse {
		display: block;
	}
	#caseDetail .flex .pic,
	#caseDetail .interview .flex.reverse .pic,
	#caseDetail .comment .flex .pic,
	#caseDetail .comment .flex .pic02{
		max-width: none;
		min-width:inherit;
		text-align: center;
		margin: 1em 0 0 0;
	}
	#caseDetail .flex .pic img{
		width: 100%;
		max-width: 400px;
	}
	#caseDetail .flex .txt {
		padding-top: 0;
	}
	#caseDetail .flex .txt .headline3{
		font-size: 1.3em;
		text-align: center;
		margin-bottom: 1.5em;
	}
	#caseDetail .flex .txt .headline3:before {
		left: calc(50% - 40px);
		bottom: -.7em;
	}
	#caseDetail .comment {
		padding: 2em;
	}
	#caseDetail .comment .flex .pic img,
	#caseDetail .comment .flex .pic02 img{
		width: 100%;
		max-width: 300px;
	}
}

#usageInfo{
/*	padding-top: 0;*/
	border-top: 1px solid #DDD;
}
#usageInfo .setData li {
	display: flex;
	margin-bottom: 1em;
}
#usageInfo .setData span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 160px;
	min-width: 160px;
	height: 30px;
	margin-right: 1em;
	background: #166BCC;
	color: #fff;
}
#usageInfo .setData strong {
	text-align: left;
	font-weight: 400;
}
#usageInfo .basicDs {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#usageInfo .basicDs li {
	width: calc(50% - 10px);
	margin-bottom: 20px;
}
#usageInfo .basicDs a {
	text-align: center;
	color: #FFF;
	display: block;
	padding: 0.4em 1em;
	background-color: #0aaaab;
	border-radius: 4px;
	letter-spacing: 2px;
}
#usageInfo .basicDs a:hover { 
	opacity: 0.8;
	transition: all .3s ease;
}

#usageInfo .kinesysCon {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#usageInfo .kinesysCon li {
	width: calc(50% - 10px);
	margin-bottom: 20px;
}
#usageInfo .kinesysCon a {
	overflow: hidden;
	display: block;
	position: relative;
	padding-top: 56.25%;
	background: #000;
}
#usageInfo .kinesysCon span {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.4);
	font-weight: 700;
	color: #fff;
	z-index: 1;
}
#usageInfo .kinesysCon img {
	position: absolute;
	top: -16.85%;
	left: 0;
	transition: .3s;
}
@media only screen and (max-width:768px) {
	#usageInfo .setData {
		display: inline-block;
		margin-bottom: 40px;
	}
	#usageInfo .setData span {
		width: 90px;
		min-width: 90px;
	}
}

#corpInfo{
	background-color: #F1F9FE;
	padding-top: 3%;
}
#corpInfo .column2 {
	align-items: center;
}
#corpInfo .box:first-of-type {
	display: flex;
	justify-content: flex-end;
}
#corpInfo .logo {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 400px;
	min-height: 180px;
	background: #fff;
	border: 1px solid #ccc;
	padding: 0 1em;
}
#corpInfo  .data li {
	margin-bottom: 1em;
	display: flex;
	text-align: left;
}
#corpInfo  .data span {
	display: inline-flex;
	align-items: center;
	position: relative;
	width: 115px;
}
#corpInfo .data span:after {
	content: "";
	display: inline-block;
	position: absolute;
	right: 1em;
	border-style: solid;
	border-width: 5px 0 5px 10px;
	border-color: transparent transparent transparent #166BCC;
}
#corpInfo  .youtubeArea{
	margin-top: 5em;
}
#corpInfo  .youtubeArea .youtube{
	max-width: 600px;
	margin: 0 auto;
}
@media only screen and (max-width:768px) {
	#corpInfo {
		padding-top: 10%;
	}
	#corpInfo .box:first-of-type {
		justify-content:center;
	}
	#corpInfo .logo {
		width: 280px;
		height: 80px;
		min-height: 80px;
		padding: 0 1em;
	}
	#corpInfo .logo {
		margin-bottom: 20px;
	}
	#corpInfo .data span {
		width: 90px;
	}
	#corpInfo .data span:after {
		border-width: 4px 0 4px 6px;
	}
	#corpInfo .youtubeArea {
		margin-top: 2em;
	}
}


/* MOVIE
--------------------------------------------*/
#movie{
	margin-bottom: 8%;
}
#movie #defaultCont{
	margin-top: 1em;
}
#movie #CustomizeCont{
	margin-top: 1em;
}
#movie .headline{
	padding-top: 1.5em;
}
#movie .headline .attached{
	display: block;
	font-size: 0.5em;
	font-weight: normal;
	letter-spacing: 2px;
}


/* SPEC
--------------------------------------------*/
#aboutkinesys .aboutlogo{
	text-align: center;
	width: 30%;
	margin: 0 auto 5%;
	min-width: 180px;
	max-width: 240px;
}
#aboutkinesys .descBox{
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
#aboutkinesys .descBox .pic{	width: 35%;}
#aboutkinesys .descBox .pic img{
	width: 80%;
	min-width: 220px;
}
#aboutkinesys .descBox .txt{	width: 65%;}

#specSubhead{
	background-color: #F1F9FE;
}
#specSubhead .imgheadline{
	text-align: center;
	margin-bottom: 5%;
}
#specSubhead .imgheadline img{
	width: 50%;
}

#specComponent .setPackage{
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1em;
}
#specComponent .setPackage .pic{
	width: 35%;
	padding-right: 3em;
}
#specComponent .setPackage .txt .setContent{
	background-color: #F6F6F6;
	padding: 1.5em;
	margin-bottom: 1.5em;
}
#specComponent .setPackage .txt .setContent strong{
	color: #135aac;
	font-size: 1.1em;
}
#specComponent .setPackage .txt .setContent ul{
	list-style: inside disc;
	padding-left: 1em;
	margin-bottom: 0;
}
#specComponent .setPackage .txt .setContent li{
	text-indent: -0.5em;
}
#specComponent .setPackage .txt .setPbox{
	text-align: right;
	line-height: 1.2;
}
#specComponent .setPackage .txt .setPbox .name{
	font-weight: 700;
}
#specComponent .setPackage .txt .setPbox .price{
	color: #135aac;
}
#specComponent .setPackage .txt .setPbox .price strong{
	font-size: 1.8em;
}
#specComponent .machine{
	margin-bottom: 2em;
}
#specComponent .machine img{
	width: 100%;
}
#specSetting {
	background-color: #F1F9FE;
}
@media only screen and (max-width:1024px) {
	#aboutkinesys .descBox{
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin: 0 2em;
	}
	#aboutkinesys .descBox .pic{
		width: 100%;
		text-align: center;
		margin-bottom: 1em;
	}
	#aboutkinesys .descBox .pic img{
		width: 50%;
	}
	#aboutkinesys .descBox .txt{
		width: 100%;
	}
}
@media only screen and (max-width:736px) {
	#specSubhead .imgheadline{
	margin-bottom: 8%;
	}
	#specSubhead .imgheadline img{
		width: 86%;
	}
	#specComponent .setPackage{
		flex-direction: column;
		padding: 1em 1em 0.5em;
		margin-bottom: 0;
	}
	#specComponent .setPackage .pic{
		width: 80%;
		max-width: 350px;
		padding-right:0;
		margin-bottom: 1em;
	}
	#specComponent .setPackage .txt{
		width: 100%;
	}
}


/* CONTACT
--------------------------------------------*/
#contact.sec{
	padding-top: 0;
	border-bottom: 1px solid #DDD;
}
#contact .txt {
	padding:0 2em;
	margin-bottom: 2em;
	text-align: center;
}
#contact #policy {
	padding-top: 2em;
}
#policy p { max-width: none; }
#policy dt {
	margin-bottom: 1em;
	font-weight: bold;
}
#policy .wpcf7-list-item {
	display: block;
	margin: 2em 0 !important;
}
#policy label {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 60px;
	margin: 0;
	border: 1px solid #999;
	border-radius: 0;
}
span.wpcf7-list-item {
	display: inline-block;
	margin: 0 0 0 1em;
}
@media only screen and (min-width:1025px) {
	#policy label:hover {
		background:#FEFFEB;
	}
}
@media only screen and (max-width:1024px) {
	#policy label { height: 50px; }
}
@media only screen and (max-width:768px) {
	#contact .txt {
		padding: 0 1em;
/*		margin-bottom: 1em;*/
		text-align: left;
	}
	#contact .txt br,
	#policy br { display: none; }
}


/* CUSTOMIZE
--------------------------------------------*/
#customizeTop{
	position: relative;
	padding:5% 5% 4%;
	overflow: hidden;
	margin-top: -5%;
	background: #fff url("../img/kinesys3/bg_pattern.png") no-repeat 50% 0%;
	background-size: cover;
	background-attachment: fixed;
}
#customizeTop .headline2{
	text-align: left;
	margin-bottom: 0.5em;
/*	font-weight: 700;*/
}
#customizeTop .line{
	padding: 0 0.2em 0 0.3em;
	background: rgba(0,0,0,0) linear-gradient(transparent 70%,#f8f066 0%) repeat scroll 0 0;
	display: inline;
}
#customizeTop .txt{
	font-size: 1.1em;
	text-align: left;
	margin-bottom: 2.5em;
}
#customizeTop ul {
	margin-bottom: 1em;
}
#customizeTop ul li {
	font-size: 1.1em;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 2;
	margin-bottom: 0;
	padding:0.5em 0 0.5em 2.6em;
	background: transparent url("../img/kinesys3/icon_hirameki.svg") no-repeat left 50%;
	background-size: 34px 34px;
}
#customizeTop .womanImg {
	position: absolute;
	right: -3%;
	bottom: -6vw;
	width: 35vw;
	max-width: 480px;
	z-index: 1;
}
#customizeTop .headline2,
#customizeTop .txt,
#customizeTop ul{
	position: relative;
	z-index: 2;
}

@media only screen and (max-width:736px) {
	#customizeTop .txt{
		margin-bottom: 1.5em;
	}
	#customizeTop ul li {
		line-height: 1.5;
	}
	#customizeTop .womanImg {
		display: none;
	}
}

#customizeCase{
	background-color: #f1f9fe;
}
#customizeCase .caseLinks{
	margin-bottom: 3em;
}
#customizeCase .caseLinks ul{
	display: flex;
	justify-content:space-between;
	flex-wrap: wrap;
	margin: 3em 1em 3em;
}
#customizeCase .caseLinks li{
	font-weight: 700;
	width: 24%;
	margin-bottom: 1em;
	display: flex;
	align-items: center;
	text-align: center;
	border: 2px solid #135aac;
	border-radius: 4px;
	overflow: hidden;
	background-color:#FFF;
	box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.20);
}
#customizeCase .caseLinks li a{
	width: 100%;
	padding: 0.5em 0;
}
#customizeCase .caseLinks .number {
	color: #135aac;
	font-size: 0.9em;
	font-family: 'Roboto',sans-serif;
	font-weight: 700;
	font-style: italic;
	letter-spacing: .125em;
	line-height: 1.5;
}
#customizeCase .caseLinks .number .no {font-size: 1.4em;}
#customizeCase .caseLinks a:hover .number {color: #FFF;}
body #customizeCase .caseLinks a,
body #customizeCase .caseLinks a *,
body #customizeCase .caseLinks :before,
body #customizeCase .caseLinks :after {
	transition: 0s;
}
#customizeCase .caseLinks li:hover{
	box-shadow:none;
	transition: all 0.5s ease 0s;
}
#customizeCase .caseLinks li a:hover{
	background: #135aac;
	transition: all 0.5s ease 0s;
}
#customizeCase .caseLinks li .txt {
	color: #135aac;
	font-size: 1.1em;
	letter-spacing: 0;
}
#customizeCase .caseLinks li i {
	font-size: 1.2em;
	margin-left: 0.4em;
}
#customizeCase .caseLinks li a:hover .txt {
	color: #FFF;
}

#customizeCase .customList .item{
	padding: 3% 4% 3%;
	background-color: #FFF;
	border-radius: 4px;
	margin-bottom: 3em;
	box-shadow: 0px 1px 10px rgba(0,0,0,.1);
}
#customizeCase .customList .item:last-child{
	margin-bottom: 0;
}
#customizeCase .customList .item .inner{
	display:flex;
	justify-content: center;
/*	align-items: center;*/
}
#customizeCase .customList .item .inner .pic{
	width: 50%;
	text-align: center;
}
#customizeCase .customList .item .inner .pic .capTxt{
	text-align: center;
}
#customizeCase .customList .item .inner .txt{
	width: 50%;
	padding-right: 3em;
	text-align:left;
}
#customizeCase .customList .number {
	color: #fff;
	font-size: 0.8em;
	font-family: 'Roboto',sans-serif;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: .125em;
	padding: 0 1em;
	margin-bottom: 0.5em;
	display: inline-block;
	background: rgba(255,255,255,0) linear-gradient(20deg,rgba(12,179,238,.8),rgba(11,86,238,.8));
	transform: skewX(-15deg);
}
#customizeCase .customList .number .no {
	font-size: 1.4em;
}
#customizeCase .customList .item .title{
	color: #135AAC;
	font-size: 1.8em;
	font-weight: 900;
	letter-spacing: 0.1em;
	line-height: 1.6;
	padding:0.3em 0  0.4em;
	margin-bottom: 0.6em;
	border-bottom:1px dotted #1c86ff;
}
#customizeCase .customList .item .inner .price {
	color: #666;
	font-size: 0.8em;
	margin: 2em 0 0;
	padding: 1em 1.5em;
	background: #f6f6f6;
}
#customizeCase .customList .item .inner .price li{
	display: inline;
	margin-right: 2em;
}
#customizeCase .customList .item .pageLink{
	margin-top: 2em;
}

@media only screen and (max-width:1024px) {
	#customizeCase .caseLinks {
		margin-bottom: 2em;
	}
	#customizeCase .caseLinks ul{
		flex-direction: column;
		margin: 0 1em;
	}
	#customizeCase .caseLinks li{
		width: 100%;
		margin-bottom: 0.8em;
		text-align: left;
	}
	#customizeCase .caseLinks li a{
		padding: 0.5em 1em;
	}
	#customizeCase .caseLinks .number {
		display: inline-block;
		margin-right: 1.5em;
	}
	#customizeCase .caseLinks .txt {
		display: inline-block;
	}

	#customizeCase .customList .item {
		padding: 4vw 5vw 2vw;
		margin-bottom: 2em;
	}
	#customizeCase .customList .item .inner {
		flex-direction: column;
		margin: 0 auto;
	}
	#customizeCase .customList .item .inner .pic,
	#customizeCase .customList .item .inner .txt{
		width: 100%;
		margin-bottom: 1em;
		padding: 0;
	}
	#customizeCase .customList .item .inner .pic .capTxt{
		text-align: left;
	}
	#customizeCase .customList .item .title{
	font-size: 1.6em;
	padding:0 0  0.4em;
	}
	#customizeCase .customList .item .inner .price {
		margin-top: 1em;
		padding: 0.6em 1em;
	}
	#customizeCase .customList .item .inner .price li{
		margin-right: 1em;
	}
	#customizeCase .customList .item .pageLink{
		margin: 0;
	}
}


/* FAQ
--------------------------------------------*/
#faqBox{
	margin-bottom: 8%;
}
#faqBox .faq .quest {
	display: flex;
	align-items: center;
	position: relative;
	margin-bottom: 1.2em;
	padding: 1em 2.5em 1em 1em;
	border: 1px solid #d9eafb;
	cursor: pointer;
	color: #135aac;
	font-weight: 900;
	border-radius: 4px;
	background: #d9eafb; 
}
#faqBox .faq .quest:hover { 
	opacity: 0.8;
	transition: all .3s ease;
}
#faqBox .faq.active .quest { 
	background: #FFF; 
	border: 1px solid #6ea1db;
}
#faqBox .faq .quest:before {
	content: "Q";
	margin-right: 0.8em;
	font-size: 1.4em;
	color: #135aac;
	font-family: 'Roboto';
	font-weight: 900;
}
#faqBox .faq .quest:after {
	content: "";
	position: absolute;
	right: 1em;
	width: 10px;
	height: 10px;
	border-right: 1px solid #135aac;
	border-bottom: 1px solid #135aac;
	transform: rotate(45deg);
	transition: 0.2s;
}
#faqBox .faq.active .quest:after {
	margin-top: 5px;
	transform: rotate(-135deg);
}
#faqBox .faq .answer {
	display: none;
	margin-bottom: 1em;
	padding: 0 1em 1em;
}
#faqBox .faq .answer p { margin-bottom: 1em; }
#faqBox .faq.active .quest + .answer { display: block; }
#faqBox .faq .answer .blue { color: #166bcc}

#faqBox .faq .answer .moInner { 
	width: 80%;
	max-width: 880px;
	margin: 0 auto 1em;
}
#faqBox .faq .answer #howtoblog {
	background-color: #FFF;
}
#faqBox .faq .answer #howtoblog .cardLayout .item{
	background-color: #EEE;
	padding: 0.5em;
	margin-bottom: 1em;
}
#faqBox .faq .answer .txtLink:hover {
	color: #0DC877;
}

@media only screen and (max-width:1180px) {
	#faqBox{
	margin:8% 3vw 8%;
	}
	#faqBox .faq .answer .moInner { 
		width: 100%;
	}
}


/* SCENE
--------------------------------------------*/
#sceneBox{
	margin-bottom:8%;
}
#sceneBox .cardLayout{
	justify-content: space-around;
}
#sceneBox .cardLayout .item{
	margin-top: 4em;
	width:45%;
	padding:0;
}
#sceneBox .cardLayout .item:hover{
	opacity: 1;
}
#sceneBox .cardLayout .number{
	color:#FFF;
	font-size: 13px;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	padding-top: 2em;
	left:-5%;
	background: #46aef7 linear-gradient(155deg,#4760ff,#0dccff);
}
#sceneBox .cardLayout .number .count {
	font-size: 2.8em;
	line-height: 1.4;
}
#sceneBox .cardLayout .item .inner{
	width:100%;
	padding-bottom: 1em;
}
#sceneBox .cardLayout .item .inner .secneTitle{
	color:#135aac;
	font-size:1.3em;
	font-weight:700;
	letter-spacing:0.1em;
}
#sceneBox .cardLayout .item .txt{
	line-height: 1.9;
}
#sceneBox .cardLayout .item .btnType01 a{
	min-width: 280px;
}
#sceneBox .cardLayout .item .btnType01 .buttonArrow span{
	letter-spacing: 1px;
}
@media only screen and (max-width:1024px) {
	#sceneBox{
		margin:0 3% 8%;
	}
	#sceneBox .cardLayout .item .btnType01 a{
		min-width:inherit;
	}
}
@media only screen and (max-width:450px) {
	#sceneBox .headline:after {
		margin-bottom: 0;
	}
	#sceneBox .cardLayout .item {
		margin-bottom: 0;
		margin-top: 3em;
		width:100%;
	}
	#sceneBox .cardLayout .number{
		transform: scale(0.8,0.8);
	}
}


/* #banLink
------------------------------------------------------*/
#parbanLink{
	margin: -1% auto 4%;
	padding: 0 4%;
}
#parbanLink a:hover img{
	transition: 0.3s;
	opacity: 0.7;
}
#parbanLink .applied{
	max-width: 720px;
	margin: 0 auto;
	padding-top: 3%;
}
@media only screen and (max-width:768px) {
	#parbanLink {
		margin: 0 auto 6%;
	}
}

/* #partner
------------------------------------------------------*/
#partner{
	background-color: #f9f9f9;
}
#partner .inner{
	max-width: 980px;
	margin: 0 auto;
}
#partner header .headline{
	margin-bottom: 1.5em;
}
#partner .conbox{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 2em;
}
#partner .conbox .txt{
	width: 58%;
}
#partner .conbox .pic {
	width: 38%;
	text-align: center;
}
#partner .conbox .txt p:last-child{
	margin-bottom: 0;
}
#partner .btn{
	background: #f69227;
	width: 70%;
	min-width: 340px;
	margin: 0 auto;
}
@media only screen and (max-width:1024px) {
	#partner header .headline{
		margin-bottom: 1em;
	}
	#partner .conbox{
		flex-direction: column;
		margin-bottom: 0;
	}
	#partner .conbox .txt, #partner .conbox .pic {
		width: 100%;
		max-width:none;
		margin-bottom: 1em;
	}
	#partner .btn{
		height: 4.6em;
		width: 90%;
	}

}


