/* ------------------------------------------------------------------------
    Common
------------------------------------------------------------------------  */
/* Anchor Height */
.AH {
}
@media screen and (max-width:768px){
	.AH {
		margin-top: -50px;
		padding-top: 50px;
	}
}
@media screen and (min-width:769px){
	.AH {
		margin-top: -50px;
		padding-top: 50px;
	}
}

.imgBox {min-height: 0%;}

/* ------------------------------------------------------------------------
    Parts
------------------------------------------------------------------------  */
/********************* Arrow *********************/
/* arrow base */
.arr{
	position: relative;
	display: block;
	vertical-align: middle;
}
.arr::before,
.arr::after{
	position: absolute;
	margin: auto;
	content: "";
	vertical-align: middle;
}
/* arrow type */
.arr_dwn::before{
	right: 15px;
	top:-3px;
	bottom:0;

	width: 6px;
	height: 6px;
	border-top: 1px solid #555;
	border-right: 1px solid #555;
	transform: rotate(135deg);
}
.arr_left::before{
	display: inline-block;
	left: 12px;
	top:50%;
	transform: translateY(-50%) rotate(45deg);

	width: 4px;
	height: 4px;
	border-bottom: 1px solid #323232;
	border-left: 1px solid #323232;
	transition: all .3s ease-out;
}
.arr_left::after{
	display: inline-block;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 1px;
	background:#323232;
	transition: all .3s ease-out;
}
.arr_right::before{
	display: inline-block;
	right: 12px;
	top:50%;
	transform: translateY(-50%) rotate(45deg);

	width: 4px;
	height: 4px;
	border-top: 1px solid #323232;
	border-right: 1px solid #323232;
	transition: all .3s ease-out;
}
.arr_right::after{
	display: inline-block;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 1px;
	background:#323232;
	transition: all .3s ease-out;
}
.arr_left:hover::before{
	left: 7px;
}
.arr_left:hover::after{
	left: 7px;
}
.arr_right:hover::before{
	right: 7px;
}
.arr_right:hover::after{
	right: 7px;
}
.arr_link::before{
	right:7px;
	top:50%;
	transform: translateY(-50%);

	width: 14px;
	height: 12px;
	content:'';
	background-image: url("../images/icon_outlink.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 50%;
	vertical-align:middle;
	padding-right:.7em;
}
/* ------------------------------------------------------------------------
    Button
------------------------------------------------------------------------  */
#BTM-BTN > *{
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 40px;
	margin-right: 40px;
}

.BtnA,
.BtnB,
.BtnC,
.BtnD{
	position: relative;
	width: 100%;
	max-width: 350px;
	height: 50px;
	display: inline-block;
}
.BtnA{
	background: #005bac;
}
.BtnB,
.BtnD{
	box-sizing: border-box;
	border:1px solid #323232;
	transition: all .3s;
}
.BtnB:hover,
.BtnD:hover{
	border:1px solid #cacaca;
}
.BtnC{
	border:1px solid #fff;
}

.BtnA.thin{
}
.BtnA::after,
.BtnB::after,
.BtnC::after,
.BtnD::after{
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	height: 100%;
	animation: btn_hov_out .2s ease 0s both;
}
.BtnA::after{
	background: #1e70b8;
}
.BtnB::after,
.BtnD::after{
	background: #cacaca;
}
.BtnC::after{
	background: #fff;
}
.BtnA:hover::after,
.BtnB:hover::after,
.BtnC:hover::after,
.BtnD:hover::after{
	animation: btn_hov .6s ease 0s both;
}
@keyframes btn_hov {
	0% {
		opacity:0;
		width: 0%;
	}
	100% {
		opacity:1;
		width: 100%;
	}
}
@keyframes btn_hov_out {
	0% {
		width: 100%;
		opacity: 1;
	}
	100% {
		width: 0%;
		opacity: 0;
	}
}
.BtnA > *,
.BtnB > *,
.BtnC > *,
.BtnD > *{
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	width: 100%;
	height: 50px;
	z-index: 3;
}
.BtnA a,
.BtnB a,
.BtnC a,
.BtnD a,
.BtnA input,
.BtnB input,
.BtnC input,
.BtnD input{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.BtnA a,
.BtnA input{
	color: #fff;
}
.BtnB a,
.BtnD a,
.BtnB input,
.BtnD input{
	color: #323232;
}
.BtnC a,
.BtnC input{
	color: #fff;
}
.BtnC a:hover,
.BtnC input:hover{
	color: #323232;
}
.BtnD a ,
.BtnD input {
	position: absolute;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.BtnD a::after,
.BtnD input::after{
	position: absolute;
	margin: auto;
	content: "";
	vertical-align: middle;
}
.BtnA a::before,
.BtnA input::before{
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
.BtnA a::after,
.BtnA input::after{
	background: #fff;
}
.BtnC a:hover::before,
.BtnC input:hover::before{
	border-top: 1px solid #323232;
	border-right: 1px solid #323232;
}
.BtnC a::before,
.BtnC input::before{
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
.BtnC a::after,
.BtnC input::after{
	background: #fff;
}
.BtnC a:hover::after,
.BtnC input:hover::after{
	background: #323232;
}

.BtnB.thin,
.BtnB.thin > *,
.BtnC.thin,
.BtnC.thin > *,
.BtnD.thin,
.BtnD.thin > *{
	height: 40px;
}
@media screen and (min-width:769px){
	.BtnA,
	.BtnA > *,
	.BtnB,
	.BtnB > *,
	.BtnC,
	.BtnC > *{
		height: 70px;
	}
	.BtnA.thin,
	.BtnA.thin > *{
		height: 50px;
	}
}

/* ------------------------------------------------------------------------
    LIST
------------------------------------------------------------------------  */
/* Order-List */
.List,.OrderList{}
.List > .ListItem{
	position: relative;
	display: flex;
	flex-wrap: wrap;
}
.List > .ListItem > *{
	width: 100%;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
}
@media screen and (max-width:1023px){
}
@media screen and (min-width:1024px){
	.List.OrderList > .ListItem > *{
		max-width: 50%;
	}
	.List.OrderList > .ListItem:nth-child(even) .Box1{
		order: 1;
	}
	.List.OrderList > .ListItem:nth-child(odd) .Box2{
		order: 2;
	}
}


/* ------------------------------------------------------------------------
    MV
------------------------------------------------------------------------  */
#MV{
	width: 100%;
	height: 100vh;
	min-height: 600px;
	background-image: url("../images/mv_bg.jpg");
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: cover;
}
@media screen and (min-width:769px){
	#MV{
	  min-height: 700px;
	}
}
.MV_Left {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 70px 10px;
	background: rgba(255,255,255,.8);
	opacity: 0;
	transition: .6s;
	transform: translateX(-100%);
}
.MV_Left.show {
	opacity: 1;
	transform: translateX(0) !important;
}
@media screen and (min-width:769px){
	#MV{
		background-size: cover;
		background-attachment: fixed;
	}
	.MV_Left {
		max-width: 40%;
		min-width: 500px;
		background: rgba(255,255,255,1);
		padding: 20px;
	}
}

/* LeftContents */
.MV_Left .MV_LeftContents{
	display: inline-block;
	box-sizing: border-box;
	padding-left: 20px;
	padding-right: 20px;
}
.MV_Left .MV_LeftContents h2{
	font-size: 2.5em;
	color: #005bac;
	line-height: 1.3em;
}
.MV_Left .MV_LeftContents h2 span{
	display: block;
	font-weight: 500;
}
.MV_Txt{
	font-size: 1.125em;
	line-height: 1.8em;
	font-weight: 500;
	margin-top: 1em;
	margin-bottom: 1em;
}
.MV_Item {
	display: flex;
	height: auto;
	justify-content: center;
	opacity: 0;
	transform: translateY(15px);
	transition: .6s;
}
.MV_Item.active {
	opacity: 1;
	transform: translateY(0);
}
.MV_Item img{
	max-width: 200px;
	align-self: flex-start;
}
.MV_Btn {
	display: flex;
	justify-content: center;
	opacity: 0;
	transition: .6s;
}
.MV_Btn.active {
	opacity: 1;
}
@media screen and (min-width:769px){
	.MV_Left .MV_LeftContents h2{
		font-size: 3em;
	}
	.MV_Item img{
		max-width: 340px;
	}
}
@media screen and (min-width:1024px){
	.MV_Left .MV_LeftContents h2{
		font-size: 3.75em;
	}
	.MV_Txt{
		font-size: 1.25em;
	}
	.MV_Item img{
		max-width: 340px;
	}
}

/* ------------------------------------------------------------------------
    INDEX
------------------------------------------------------------------------  */
/* Strength */
.Pladan_Strength {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.Pladan_Strength > .Item{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 100%;
	max-width: 48%;
	margin-bottom: 20px;
	margin-top: 20px;
}
.Pladan_Strength > .Item .PS_Image{
	width: 139px;
	height: 139px;
	border-radius: 50%;
	border:1px solid #dadada;
	display: flex;
	justify-content: center;
	align-items: center;
}
.Pladan_Strength > .Item .PS_Image i{
	width: 54px;
	height: 54px;
}
.Pladan_Strength > .Item .PS_Ttl{
	margin-top: 1em;
	margin-bottom: .7em;
	font-size:1.125em;
	line-height:1.5em;
}
.Pladan_Strength > .Item .PS_Text{
	text-align: center;
}
@media screen and (min-width:769px){
	.Pladan_Strength > .Item .PS_Ttl{
		font-size:1.25em;
	}
}
@media screen and (min-width:1024px){
	.Pladan_Strength {
		justify-content: center;
	}
	.Pladan_Strength > .Item{
		max-width: 180px;
	}
	.Pladan_Strength > .Item{
		margin-left: 2%;
		margin-right: 2%;
	}
}
@media screen and (min-width:1200px){
	.Pladan_Strength > .Item{
		margin-left: 4%;
		margin-right: 4%;
	}
}

/* PLADANBTN */
#PLADANBTN .BtnA,
#PLADANBTN .BtnB{
	margin-bottom: 10px;
	margin-top: 10px;
	margin-left: 40px;
	margin-right: 40px;
}

.PS_ConditionBox {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
}
.PS_Condition {
	position: relative;
	padding: .5em .7em;
	text-align: center;
	margin-bottom: 1.5em;
}
.PS_Condition:before {
	position: absolute;
	left: 0;
	top: 50%;
	content: '';
	width: 100%;
	height: 1px;
	background: #cacaca;
	z-index: -1;
}
.PS_Condition span{
	padding-left: 2em;
	padding-right: 2em;
	background: #fff;
}
.PS_ConditionList li{
	padding: .7em 1em;
}
.PS_ConditionList li:nth-child(odd){
	background: #cacaca;
}
.PS_ConditionList li span{
	display: inline;
}

/* NEW */
.List > .NewItem > .Box1{
	position: relative;
	padding-top: 30px;
	padding-bottom: 30px;

}
.List > .NewItem > .Box1:after{
	position: absolute;
	top: -20px;
	left: -8px;
	display: flex;
	justify-content: center;
	align-items: center;
	content: 'NEW';
	font-size: 1em;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	border: 1px solid #cacaca;
}
.List > .NewItem .LeftBtn{display: none; justify-content: center; margin-top: 2.14em;}
.List > .NewItem .BtmBtn{display: flex; justify-content: center; margin-bottom: 30px; margin-top: 30px;}
@media screen and (min-width:1024px){
	.List > .NewItem > .Box1{
		margin-bottom:0;
		padding-left: 7%;
		padding-right: 7%;
	}
	.List > .NewItem:nth-child(even) > .Box1:after{
		left: auto;
		right: 0;
		margin-bottom: 0;
	}
	.List > .NewItem .LeftBtn{display: flex;}
	.List > .NewItem .BtmBtn{display: none;}
}
@media screen and (min-width:1024px){
	.List > .NewItem > .Box1:after{
		top: -10px;
		left: -10px;
		width: 80px;
		height: 80px;
		border-radius: 50%;
		font-size: 1.25em;
	}
}
@media screen and (min-width:1400px){
	.List > .NewItem > .Box1:after{
		top: -10px;
		left: -10px;
		width: 99px;
		height: 99px;
		border-radius: 50%;
		font-size: 1.375em;
	}
}
/* Item */
.NewInfo{
	width: 100%;
}
.ItemName {
	text-align: center;
}
.ItemName p{
	display: flex;
	justify-content: center;
}
.ItemDetail {
}
.ItemDetail p{
	display: flex;
	justify-content: center;
}
.ItemImage {
	min-width: 0;
}
.ItemBtn {
	text-align: center;
	margin-top: 40px;
}
.List > .NewItem > .Box1 .ItemBtn {display: none;}
.List > .NewItem > .Box2 .ItemBtn {display: block;}
@media screen and (min-width:1024px){
	.List > .NewItem > .Box1 .ItemBtn {display: block;}
	.List > .NewItem > .Box2 .ItemBtn {display: none;}
}

/* Infomation */
.InfoList {border-top: 1px solid #cacaca;}
.InfoList li{border-bottom: 1px solid #cacaca;}
.InfoList li a{
	display: flex;
	flex-wrap: wrap;
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	transition: all .5s;
}

.InfoList li a > *{
	width: 100%;
	box-sizing: border-box;
}
.InfoList li a .infodays{
	padding-left: 1em;
	padding-right: 1em;
	font-size: 0.875em;
	margin-bottom: .275em;
	color: #999;
}
.InfoList li a .infotitle{
	padding-left: 1em;
	padding-right: 40px;
}
@media screen and (min-width:769px){
	.InfoList li a:hover{
		background: #f5f5f5;
	}
	.InfoList li a .infodays{
		font-size: 1em;
		width: 10em;
		color: #323232;
	}
	.InfoList li a .infotitle{
		width: calc(100% - 10em);
	}
}


/* IDEA */
#TOP-IDEA {
	position: relative;
	background: rgba(0,0,0,.5);
}
#TOP-IDEA:before{
	position: absolute;
	left: 0;
	top: 0;
	content: '';
	width: 100%;
	height: 100%;
	z-index: -1;
	background-image: url("../images/idea_ftbg.jpg");
	background-position: 50%;
	background-size: cover;
}
#TOP-IDEA .Title_A{
	color: #fff;
}
#TOP-IDEA .Title_A:after {
	background: #fff;
}
#TOP-IDEA .BtnC{
	margin-bottom: 10px;
	margin-top: 10px;
	margin-left: 40px;
	margin-right: 40px;
}
@media screen and (min-width:769px){
	#TOP-IDEA:before{
		background-attachment: fixed;
	}
}

/* ------------------------------------------------------------------------
    Line
------------------------------------------------------------------------  */
#LINE {
}
.Line_Top {
	background-color: #00b900;
}
.Line_Top .LT_container {
	position: relative;
	max-width: 750px;
	padding-top: 2.5em;
	padding-bottom: 2.5em;
}
.Line_Top .LT_container .Phone{
	width: 180px;
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
}
.Line_Top .LT_container .LogoOA{
	margin-bottom: 15px;
}
.Line_Top .LT_container .Line_Msg{
	font-size: 1.125em;
	font-weight: 500;
	color: #fff;
}
.Line_Top .LT_container .LogoOA img{
	height: 20px;
	width: auto;
}
.Line_Box {
	display: inline-flex;
	align-items: center;
	border-radius: 5px;
	background: #fff;
	padding: 7px 30px;
	margin-top: 15px;
}
.Line_Box a{
	margin-left: 30px;
}
.Line_Box a img{
	max-width: 140px;
}
@media screen and (max-width:768px){
	.Line_Top .LT_container .LogoOA{
		text-align: center;
	}
	.Line_Top .LT_container .Line_Msg{
		display: flex;
		justify-content: center;
	}
	.Line_Top .LT_container .Phone{
		display: none;
	}
	.Line_Box {
		width: 100%;
		box-sizing: border-box;
		justify-content: center;
	}
}
@media screen and (min-width:769px){
	.Line_Top .LT_container .LogoOA img{
		height: 30px;
	}
}
.cl_Line {color: #07b53b;}

/* ------------------------------------------------------------------------
    SubPage
------------------------------------------------------------------------  */
/* WideBox */
.WideBox {
	position: relative;
	background: rgba(0,0,0,.5);
}
.WideBox:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: '';
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50%;
	z-index: -1;
}
.WideBox.bg_products:before {
	background-image: url("../images/sample_bg01.jpg");
}
@media screen and (min-width:769px){
	.WideBox:before {
		background-attachment: fixed;
	}
}

/*  */


/* ------------------------------------------------------------------------
    PRODUCTS
------------------------------------------------------------------------  */
#PRODUCTS-Narrow{}
#PRODUCTS-Narrow .BtnC {
	margin-left: 40px;
	margin-right: 40px;
	margin-top: 10px;
	margin-bottom: 10px;
}
#PRODUCTS-LIST{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: -30px;
}
#PRODUCTS-LIST .PL_Item{
	width: 100%;
	margin-bottom: 30px;
	margin-top: 30px;
}
@media screen and (min-width:769px){
	#PRODUCTS-LIST .PL_Item{
		max-width: 48%;
	}
}
.PL_Image{
}
.PL_Title{
	display: flex;
	justify-content: center;
	font-size: 1.25em;
	font-weight: 500;
	margin-bottom: 20px;
	margin-top: 20px;
}
.PL_Message{
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}
.PL_Btn{
	text-align: center;
}

/* ------------------------------------------------------------------------
    DETAIL
------------------------------------------------------------------------  */
.Detail_MainImage{
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 2.37em;
}
.Detail_Title{
	display: flex;
	justify-content: center;
	font-size: 1.25em;
	font-weight: 500;
	margin-top: 2.37em;
	margin-bottom: 2.37em;
}
.Detail_Intro{
	display: flex;
	justify-content: center;
	margin-top: 2.37em;
	margin-bottom: 2.37em;
}
.Detail_Box {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 1.25em;
	margin-bottom: 1.25em;
}
.Detail_Model,
.Detail_Format,
.Detail_Size,
.Detail_Use,
.Detail_Industory{
	width: 100%;
	padding-bottom: .5em;
	border-bottom: 1px solid #cacaca;
	margin-bottom: 1.25em;
	margin-top: 1.25em;
	
	display: flex;
	flex-wrap: wrap;
}
.Detail_Box .DB_1{width: 100%; font-size:14px; margin-bottom: 1em;}
.Detail_Box .DB_2{width: 100%;}

.Detail_ImageList{}
.Detail_ImageItem{}
.Detail_Message{}
@media screen and (min-width:769px){
	.Detail_Model,
	.Detail_Format{
		max-width: 48%;
	}
	.Detail_Box .DB_1{max-width: 10em; margin-bottom: 0;}
	.Detail_Box .DB_2{max-width: calc(100% - 10em);}
}

.Detail_Industory,
.Detail_Use{}
.UI_Title {
	margin-bottom: 1.25em;
}
.UI_List {
	display: flex;
	flex-wrap: wrap;
}
.UI_List li{
	margin-right: .75em;
}
.UI_List li:before{
	content: '/';
	margin-right: .75em;
}
.UI_List li:first-child{
	margin-left: 0;
}
.UI_List li:first-child:before{
	content: '';
	margin-right: 0;
}
@media screen and (min-width:769px){
	.UI_Title {
		text-align: center;
	}
}

/* Gallery */
.Detail_Gallery {
	display: flex;
	justify-content: center;
}
.Detail_Gallery .DG_List{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.Detail_Gallery .DG_List li{
	width: 100%;
	max-width: 46%;
	margin: 2%;
}
@media screen and (min-width:1024px){
	.Detail_Gallery .DG_List li{
		max-width: 29%;
		margin: 2%;
	}
	.Detail_Gallery .DG_List li a{
		position: relative;
		
	}
	.Detail_Gallery .DG_List li a:before,
	.Detail_Gallery .DG_List li a:after{
		position: absolute;
		opacity: 0;
	}
	.Detail_Gallery .DG_List li a:before{
		left: 0;
		top: 0;
		content: '';
		background: rgba(0,0,0,.3);
		width: 0%;
		height: 100%;
		z-index: 1;
	}
	.Detail_Gallery .DG_List li a:after{
		left: 50%;
		top: 50%;
		transform: translate(-50% , -50%);
		content: '';
		width: 32px;
		height: 32px;
		background-image: url("../images/icon_large.png");
		background-repeat: no-repeat;
		background-size: cover;
		z-index: 2;
		
		transition-duration: 0.3s;
	}
	.Detail_Gallery .DG_List li a:hover:before,
	.Detail_Gallery .DG_List li a:hover:after{	
		opacity: 1;
		transition: all .8s;
	}
	.Detail_Gallery .DG_List li a:hover:before{
		width: 100%;
	}
	
}

/* ITEM MESSAGE */
#ITEM-MESSAGE p{
	display: flex;
	justify-content: center;
}

/* ------------------------------------------------------------------------
    TARGET
------------------------------------------------------------------------  */
#TARGET-TOP {
	position: relative;
}
#TARGET-TOP .Target_BG {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-size: contain;
	z-index: -1;
}
#TARGET-TOP .Target_BG.Bg1{background-image: url("../images/targert_bg01.png");}
#TARGET-TOP .Target_BG.Bg2{background-image: url("../images/targert_bg02.png");}
#TARGET-TOP .Target_BG.Bg3{background-image: url("../images/targert_bg03.png");}
#TARGET-TOP .Targer-Topmsg {
	padding-bottom: 4.285em;
}
#TARGET-TOP .Target_BGSP {
	position: absolute;
	left: 0;
	bottom: 0;
}
#TARGET-TOP .Cardboard{
	max-width: 220px;
	position: absolute;
	left: 50%;
	bottom: -70px;
	transform: translateX(-50%);
}
#TARGET-TOP .Target_Message{
	padding-bottom: 3em;
}
#TARGET-TOP .Target_Track{
	text-align: center;
}
#TARGET-TOP .Target_Track img{
	max-width: 80px;
}
@media screen and (min-width:769px){
	#TARGET-TOP .Target_BGSP {display: none;}
	#TARGET-TOP .Target_Message{
		paddong-bottom: 5em;
	}
	#TARGET-TOP .Target_Track img{
		max-width: 160px;
	}
}
@media screen and (max-width:768px){
	#TARGET-TOP .Target_BG {display: none;}
}
.BioMessage {
	background: #f5f5f5;
	padding: 1.5em 20px;
	line-height: 2em;
}
.Biotope{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.Biotope > *{
	width: 100%;
}
.Biotope > *.BioImg{
	text-align: center;
}
.Biotope > *.BioImg img{
	max-width: 610px;
}
.Biotope > *.BioItem1,
.Biotope > *.BioItem2{
	max-width: 48%;
}
@media screen and (min-width:1200px){
	.Biotope{
		align-items: center;
	}
	.Biotope > *.BioImg{
		background-image: url("../images/biotope_pc.png");
		background-repeat: no-repeat;
		background-size: cover;
		order: 2;
	}
	.Biotope > *.BioImg img{
		opacity: 0;
	}
	.Biotope > *.BioItem1{
		order:1;
	}
	.Biotope > *.BioItem2{
		order:3;
	}
	.Biotope > *.BioImg{
		max-width: 610px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.Biotope > *.BioItem1,
	.Biotope > *.BioItem2{
		max-width: calc((100% - 640px) / 2);
	}
}
@media screen and (max-width:768px){
	.Biotope > *.BioItem1,
	.Biotope > *.BioItem2{
		max-width: 100%;
	}
}
.Biotope > *.BioItem1 li,
.Biotope > *.BioItem2 li{
	display: flex;
	align-items:center; 
	border-radius: 5px;
	padding: .5em 1em;
	margin-bottom: 10px;
	margin-top: 10px;
}
.Biotope > *.BioItem1 li:nth-child(odd),
.Biotope > *.BioItem2 li:nth-child(odd){
	background: #f5f5f5;
}
.Biotope > *.BioItem1 li span,
.Biotope > *.BioItem2 li span{
	width: 30px;
	height: 30px;
	margin-right: 10px;
	background: #fff;
	border:2px solid #474747;
	border-radius: 50%;
	text-align: center;
	line-height: 30px;
	font-weight: bold;
	color: #474747;
}
.Biotope > *.BioItem1 li p,
.Biotope > *.BioItem2 li p{
	width: calc(100% - 40px);
	line-height: 1.5em;
}
.J-Map img{
	max-width: 950px;
}


/* ------------------------------------------------------------------------
    Requirements
------------------------------------------------------------------------  */
#REQUIREMENTS-TOP {
	width: 100%;
	height: 300px;
	background-image: url("../images/req_topimg.jpg");
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: cover;
}
@media screen and (min-width:769px){
	#REQUIREMENTS-TOP {
		height: 450px;
	}
}
#REQUIREMENTS-CONDITION .Requirement{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#REQUIREMENTS-CONDITION .Requirement p{
	position: relative;
	width: calc(45% - 2px);
	height: 80px;
	border:2px solid #323232;
	font-size: 500;
	line-height: 1.5em;
	margin: 2%;
}
#REQUIREMENTS-CONDITION .Requirement p span{
	width: 100%;
	box-sizing: border-box;
	padding: 0 .5em;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
}
@media screen and (min-width:769px){
	#REQUIREMENTS-CONDITION .Requirement p{
		width: calc(30% - 2px);
		margin: 1.5%;
	}
}
@media screen and (max-width:480px){
	#REQUIREMENTS-CONDITION .Requirement p{
		width: 100%;
		height: 60px;
		margin: 10px 0;
	}
}

/* system */
.System-Contents {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.System-Contents > *{
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
}
.System-Contents .Sys-Ttl{
	display: flex;
	justify-content: center;
}
.System-Contents .Sys-Detail {
	
}
@media screen and (min-width:769px){
	.System-Contents .Sys-Ttl{
		max-width: 350px;
	}
	.System-Contents .Sys-Detail {
		max-width: calc(100% - 350px);
		border-left: 1px solid #999;
	}
}
/* ZERO */
#ZERO {
	width: 100%;
	max-width: 320px;
	margin-left: auto;
	margin-right: auto;
	height: 50px;
	background: #005bac;
	color: #fff;
}

/* Flow */
#WORKFLOW {
	display: flex;
	flex-wrap: wrap;
}
#WORKFLOW .Flow{
	position: relative;
	width: 100%;
	height: 300px;
}
#WORKFLOW .Flow:before,
#WORKFLOW .Flow:after{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: '';
}
#WORKFLOW .Flow:before{
	background: #000;
	opacity: .4;
	z-index: -1;
}
#WORKFLOW .Flow:after{
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -2;
}
#WORKFLOW .Flow.step1:after{background-image: url("../images/flow_image01.jpg");}
#WORKFLOW .Flow.step2:after{background-image: url("../images/flow_image02.jpg");}
#WORKFLOW .Flow.step3:after{background-image: url("../images/flow_image03.jpg");}
#WORKFLOW .Flow.step4:after{background-image: url("../images/flow_image04.jpg");}
#WORKFLOW .Flow.step5:after{background-image: url("../images/flow_image05.jpg");}
#WORKFLOW .Flow.step6:after{background-image: url("../images/flow_image06.jpg");}
#WORKFLOW .Flow.step7:after{background-image: url("../images/flow_image07.jpg");}

#WORKFLOW .Flow .TxtArea{
	width: 100%;
	box-sizing: border-box;
	padding-left: 20px;
	padding-right: 20px;
	color: #fff;
	line-height: 1.5em;
}
#WORKFLOW .Flow .TxtArea .Flow_Num {
	font-size: 3em;
	font-weight: 500;
	margin-bottom: .5em;
}
#WORKFLOW .Flow .TxtArea .Flow_Category {
	width: 100%;
	padding: .3em 0;
	text-align: center;
	margin-bottom: 1em;
}
#WORKFLOW .Flow .TxtArea .Flow_Category.user { background: #118d4e;}
#WORKFLOW .Flow .TxtArea .Flow_Category.pladan { background: #005bac;}
#WORKFLOW .Flow .TxtArea .Flow_Category.yamakoh { background: #e60012;}

#WORKFLOW .Flow .StepLine{
	position: absolute;
	left: 0;
	bottom: 20px;
	width: 100%;
	height: 10px;
	content: '';
	background: #fff;
}
#WORKFLOW .Flow:first-child .StepLine{
	left: auto;
	right: 0;
	width: calc(100% - 20px);
}
#WORKFLOW .Flow:last-child .StepLine{
	width: calc(100% - 20px);
}
#WORKFLOW .Flow:last-child .StepLine:after{
	position: absolute;
	content: '';
	right: -15px;
	top:50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 0 15px 20px;
	border-color: transparent transparent transparent #ffffff;
}
@media screen and (max-width:768px){
	#WORKFLOW .Flow .TxtArea{
		padding-top: 150px;
	}
	#WORKFLOW .Flow .StepLine{
		display: none;
	}
}
@media screen and (min-width:769px){
	#WORKFLOW .Flow{
		max-width: 25%;
		height: 500px;
	}
	#WORKFLOW .Flow .TxtArea{
		padding-top: 300px;
	}
	#WORKFLOW .Flow .Arr_Dwn {
		
	}
}

/* ------------------------------------------------------------------------
    Idea
------------------------------------------------------------------------  */
#IDEA-TOP {
	width: 100%;
	height: 300px;
	background-image: url("../images/idea_topimg.jpg");
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: cover;
}
@media screen and (min-width:769px){
	#IDEA-TOP {
		height: 450px;
	}
}
/* flow */
#IDEA-FLOW {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#IDEA-FLOW .Item {
	position: relative;
	width: 100%;
	border:1px solid #dadada;
	padding: 20px 30px;
	margin-top: 10px;
	margin-bottom: 10px;
	box-sizing: border-box;
}
#IDEA-FLOW .Item:last-child {
	border: none;
	padding: 0;
}
@media screen and (min-width:769px){
	#IDEA-FLOW .Item {
		max-width: 32%;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	#IDEA-FLOW .Flow_Arrow:before ,
	#IDEA-FLOW .Flow_Arrow:after {
		position: absolute;
		content: '';
		top: 50%;
		transform: translateY(-50%);
	}
	#IDEA-FLOW .Flow_Arrow:before{
		left: -40px;
		width: 40px;
		height: 10px;
		background: #005bac;
	}
	#IDEA-FLOW .Flow_Arrow:after {
		left: -0px;
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 15px 0 15px 20px;
		border-color: transparent transparent transparent #005bac;
	}
}
.Idea-Flowttl{
	margin-bottom: 15px;
}
.Idea-Flowtxt{
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid #999;
}
.Idea-MarginTtl {
	background: #dadada;
	padding: .3em 0;
	text-align: center;
	margin-bottom: 15px;
}
.Idea-MarginLine {
	padding-top: 15px;
	margin-top: 15px;
	border-top: 1px solid #dadada;
}

/* Sales contents */
.Sales_Contents {
	display: flex;
	flex-wrap: wrap;
	border:1px solid #dadada;
}
.Sales_Contents > * {
	width: 100%;
	box-sizing: border-box;
	padding: 30px;
}
.Sales_Contents .Sales_icon {
	background: #f5f5f5;
	display: flex;
	justify-content: center;
	align-items: center;
}
.Sales_Contents .Sales_icon img{
	width: 54px;
	height: 54px;
}
.Sales_Contents .Sales_Detail {
	border-top: 1px solid #dadada;
}
.Sales_Contents .Sales_Detail .Sales_Ttl{
	padding-bottom: 15px;
}
@media screen and (min-width:769px){
	.Sales_Contents .Sales_icon {
		max-width: 200px;
	}
	.Sales_Contents .Sales_Detail {
		max-width: calc(100% - 200px);
		border-top: none;
		border-left: 1px solid #dadada;
	}
}
/* sitelist */
#SITELIST {
	display: flex;
	flex-wrap: wrap;
}
#SITELIST .Site {
	width: 100%;
	
	margin-top: 15px;
	margin-left: 1%;
	margin-right: 1%;
	margin-bottom: 15px;
}
#SITELIST .Site .Site_Msg {
	font-size: .875em;
	color: #666;
	display: flex;
	justify-content: center;
	margin-top: .5em;
}
#SITELIST .Site .BtnB{
	max-width: 100%;
}
@media screen and (min-width:769px){
	#SITELIST .Site {
		max-width: 31%;
	}
}

/* ------------------------------------------------------------------------
    Company
------------------------------------------------------------------------  */
.List-2Column {
	border-top: 1px solid #dadada;
	border-right: 1px solid #dadada;
}
.List-2Column .Item {
	display: flex;
	flex-wrap: wrap;
}
.List-2Column .Item > * {
	width: 100%;
	display: flex;
	align-items: center;
	padding: .5em 1em;
	box-sizing: border-box;
	
	border-left: 1px solid #dadada;
	border-bottom: 1px solid #dadada;
}
.List-2Column .Item > *:nth-child(1) {
	background: #f5f5f5;
}
@media screen and (min-width:769px){
	.List-2Column .Item > *:nth-child(1) {
		max-width: 30%;
		justify-content: center;
	}
	.List-2Column .Item > *:nth-child(2) {
		max-width: 70%;
		justify-content: center;
	}
}