@charset "Shift_JIS";

/* **************************************************

Name: modify.css

Description: Sub CSS

Copyright 2016 Hitachi,Ltd.

***************************************************** */


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

Modify Setting

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

body #HeaderArea2 > .Container {
    -ms-flex-align: stretch;
    align-items: stretch;
}
_:-ms-lang(x), body.header1-fix {
    padding-top: 0;
}
_:-ms-lang(x), body.header1-fix #HeaderArea1 {
    position: static !important;
}
_:-ms-lang(x), body.header2-fix.header2-show #HeaderArea2.Sticky {
    transform: translateY(-100%);
}


/* Reset
=========================================================================================== */
.CourtesyNavi { letter-spacing: -.40em }
.CourtesyNavi li { letter-spacing: normal }
th .LinkListStyle1, th .LinkListStyle2, th .LinkListStyle3, th .LinkListStyle4,
th .LinkListStyle5, th .LinkListStyle6, td .LinkListStyle1, td .LinkListStyle2,
td .LinkListStyle3, td .LinkListStyle4, td .LinkListStyle5, td .LinkListStyle6,
th .ListStyle1, th .ListStyle2, th .ListStyle3, th .ListStyle4, th .ListStyle5,
th .ListStyle6, td .ListStyle1, td .ListStyle2, td .ListStyle3, td .ListStyle4,
td .ListStyle5, td .ListStyle6, td .TextStyle1, td .TextStyle2, td .TextStyle3,
td .TextStyle4, dd .LinkListStyle1, dd .LinkListStyle2, dd .LinkListStyle3,
dd .LinkListStyle4, dd .LinkListStyle5, dd .LinkListStyle6, dd .ListStyle1,
dd .ListStyle2, dd .ListStyle3, dd .ListStyle4, dd .ListStyle5, dd .ListStyle6,
td ul.ListStyle1, td ul.ListStyle2, td p.ImgOnlyStyle{
	margin-bottom: 0;
	font-size: 100%;
}
.Grid4 { clear: both; }
#Contents {
	padding-bottom: 1px;
}



/* Margin
=========================================================================================== */
.ml15 { margin-left: 15px!important; }
.ml54 { margin-left: 54px!important; }
.ml87 { margin-left: 87px!important; }

.mb0  { margin-bottom:0 !important; }
.mb30 { margin-bottom: 30px!important; }

.mt40 { margin-top: 40px!important; }

.pt20 {padding-top: 20px!important; }

/* Column
=========================================================================================== */
/* --- 4Gridを3分割 --- */
.ColumnSet4-3 { display: block; }
.ColumnSet4-3:after {
	content: "";
	display: block;
	clear: both;
}
.ColumnSet4-3 .Column1 {
	float: left;
	width: 311px;
	margin: 0 16px 0 0;
}
.ColumnSet4-3 .Column2 {
	float: left;
	width: 638px!important;
	margin: 0 16px 0 0!important;
}
.ColumnSet4-3 div:last-child { margin-right: 0!important; }


/* Heading
=========================================================================================== */
h3.borderline {
    border-bottom: 1px solid #ccc;
}



/* Img
=========================================================================================== */
/* --- 画像を2つ横並び --- */
div.ImgSide {
	margin: 0 auto;
	text-align:center;
}
div.ImgSide p {
	float: left;
	font-size: 83%;
}

/* --- 画像縦幅センタリング --- */
div.imgheightC {display: table;}
div.imgheightC p.ImgOnlyStyle{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

/* --- 画像3つ横並びリスト --- */
ul.LinkListStyle_banner {
	margin: 0 0 15px;
}
ul.LinkListStyle_banner li {
	float: left;
	margin: 0 10px 0 0;
}
ul.LinkListStyle_banner li:last-child {
	margin: 0;
}

/* --- img hover-- */
a:hover img.opRollover {opacity:0.6;}

/* --- privacymark --- */
.privacymark a{
display: block;
padding:20px; /* 75pxの1/4余白 */
background:#fff;
}


/* 枠囲み
=========================================================================================== */
.BoxPatternA h3
.BoxPatternA h4,
.BoxPatternB h3,
.BoxPatternB h4,
.BoxPatternC h3,
.BoxPatternC h4 {
	margin-bottom: 10px;
	padding-left: 15px;
	padding-right: 15px;
}



/* トップページ　〜から探すタブ
=========================================================================================== */
.TabList { margin-bottom: 20px; }
.TabList:after {
	content: "";
	display: block;
	clear: both;
}
.TabList li {
	float: left;
	position: relative;
	display: block;
	margin-right: 10px;
	padding: 15px 30px 12px;
	font-size: 110%;
	font-weight: bold;
	background: #ccc;
}
.TabList li.Current {
	background: #1976D2;
	color: #fff;
}
.TabList li.Current:after {
	position: absolute;
	bottom: -22px;
	right: calc(50% - 12px);
	content: "";
	border: 12px solid transparent;
	border-top: 12px solid #1976D2;
}
.TabList li:hover {
	cursor: pointer;
	color: #fff;
	background: #1976D2;
}
.TabWrapper .TabContents { display: none; }
.TabContents ul.LinkListStyle1{ padding-left: 1em; }

/* --- サブタブ --- */
.SubTabList { margin-bottom: 20px; }
.SubTabList:after {
	content: "";
	display: block;
	clear: both;
}
.SubTabList li {
	float: left;
	position: relative;
	display: block;
	margin-right: 7px;
	padding: 8px 10px 6px;
	font-size: 90%;
	font-weight: bold;
	background: #ccc;
}
.SubTabList li.Current {
	background: #1976D2;
	color: #fff;
}
.SubTabList li.Current:after {
	position: absolute;
	bottom: -22px;
	right: calc(50% - 12px);
	content: "";
	border: 12px solid transparent;
	border-top: 12px solid #1976D2;
}
.SubTabList li:hover {
	cursor: pointer;
	color: #fff;
	background: #1976D2;
}
.TabWrapper .SubTabContents { display: none; }


/* --- YouTube 黒囲-- */
iframe.yt-iframe {	border: 1px solid #666666;}


/* --- きのぽん水源の森-- */
.BoxPatternA .suigennomori_img2 {
	width:867px; 
	margin: 0 auto;
}
.BoxPatternA .suigennomori_img2 .Column2 {width:426px;}


/* --- custom jquery.bxslider.css for TOP page --- */
.slideBox{
position:relative;
width:100%;
height:360px;
margin:0 auto;
}

.bx-wrapper{
position:rerative;
margin: 0 auto;
box-shadow:none;
border:none;
}

.bx-wrapper .bx-viewport{
left:0;
border:none;
}

/* LOADER */
.bx-wrapper .bx-loading {
z-index: 5;
}

.bx-wrapper .bx-pager.bx-default-pager a{
margin: 10px 5px;
border-radius:50%;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active{
background: #c02;
}

.bx-wrapper .bx-controls-auto .bx-start,
.bx-wrapper .bx-controls-auto .bx-stop{
margin:7px 3px 10px;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{
position: absolute;
bottom: 0;
right: 0;
left:0;
width: auto;
text-align: center;
z-index:5;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager > div{
  -moz-transform: translateX(17.5px);
  -ms-transform: translateX(17.5px);
  -webkit-transform: translateX(17.5px);
  transform: translateX(17.5px);

}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{
right: 50%;
bottom: 0;
margin-right: 40px;
line-height:1px;
z-index:6;
-moz-transform: translateX(50%);
-ms-transform: translateX(50%);
-webkit-transform: translateX(50%);
transform: translateX(50%);
}

.bxslider li{
display:block;
height:360px;
background-size: cover;
}

.bxslider li p{
position:relative;
max-width:1275px;
height:100%;
margin:0 auto;
overflow: hidden;
box-sizing: border-box;
z-index:1;
}
.bxslider li a{
  display: inline-block;
  width: 100%;
  height: 100%; 
  position: relative;
  box-sizing: border-box;
  z-index: 11;
}
.bx-wrapper li img {
  display: block;
}
.bxslider li a .LinkImg{
  position	: absolute;
  top			: 0;
  left		: 0;
  width		: 100%!important;
  height		: 100%!important;
  margin		: 0!important;
  z-index: 10;
}


.bx-wrapper .bx-controls-direction a {
  width: 38px;
  height: 38px;
  z-index: 5;
}

#Slide1 p{
padding-top:50px;
}

#Slide2 p a{
position:absolute;
display: block;
width: 330px;
height: 185px;
top:50%;
right:50px;
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
#Slide2 p a img{
  width:500px;
}
#Slide2 p > img{
width:530px;
margin-top: 50px;
margin-left: 50px;
}

@media screen and (min-width: 768px) {
#Slide2 p a:hover img{
opacity:0.8;
}
}

#Slide3 p a img{
  margin-top: 60px;
  margin-left: 40px;
}
#Slide3:after {
  position: absolute;
  top   :50%;
  right: 100px;
  content: '';
  display: block;
  width: 330px;
  height: 185px;
  background:url("/products/infrastructure/product_site/water_environment/image/top/branding_vr.png") no-repeat;
  background-size: cover;
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
#Slide4 p a img{
  margin-top: 60px;
  margin-left: 40px;
}






@media print{
.slideBox{
max-width:auto;
height:auto;
}

.bxslider li{
display: list-item;
list-style-position: inside;
}

#Slide1{
list-style-image:url("/products/infrastructure/product_site/water_environment/image/top/branding_01.png");
}
#Slide2{
list-style-image:url("/products/infrastructure/product_site/water_environment/image/top/branding_02.png");
}
#Slide3{
list-style-image:url("/products/infrastructure/product_site/water_environment/image/top/branding_03.png");
}
#Slide4{
list-style-image:url("/products/infrastructure/product_site/water_environment/image/top/branding_04.png");
}

}

/* レスポンシブ対応 */
@media screen and (max-width: 1304px) {
.bx-wrapper .bx-controls-direction a {
width: 30px;
height: 30px;
}
.bx-wrapper img {
  margin: 0 auto;
}
#Slide1 p{
padding-top:20px;
}
#Slide4 p a img {
  margin-left: 55px;
}
}
@media screen and (max-width: 994px) {
.slideBox{
height:250px;
}
.bxslider li{
height:250px;
}
.bxslider li p a{
padding-top: 20px;
}
#Slide2 p a{
width: 210px;
height: auto;
top: 34%;
left: 50%;
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
#Slide2 p {
padding-top:0;
}
#Slide2 p > img{
width: 450px;
margin: 0 auto;
}
#Slide3 p a{
padding-top: 10px;
}
#Slide3 p a img{
  width: 400px;
  margin:auto;
}
#Slide3:after {
  width: 212px;
  height:118px;
  top: 42%;
  right: 50%;
  -moz-transform: translateX(50%);
  -ms-transform: translateX(50%);
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
}
#Slide4 p a img{
width: 500px;
margin-top: 0;
}


}

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

#Slide3 p a img{
width: 400px;
}
#Slide4 p a img{
width: 83%;
margin: auto;
}

}
@media screen and (max-width: 399px) {
#Slide2 p {
padding-top:10px;
}
#Slide4 p a img{
width: 95%;
}
}

/* 日立の水環境への取り組み事例（日立評論）
=========================================================================================== */

#Effort{
	margin-top: 20px;
	margin-bottom: 30px;
}

#Effort .Thumb{
	width: 315px;
	overflow: hidden;
}

#Effort .Thumb img{
	opacity: 1;
	transform: scale(1, 1);
	-webkit-transform: scale(1, 1);
	-moz-transform: scale(1, 1);
	-ms-transform: scale(1, 1);
	transition: all 0.2s ease-in;
	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-ms-transition: all 0.2s ease-in;
}

#Effort .Thumb img:hover{
	opacity: 0.9;
	transform: scale(1.1, 1.1);
	-webkit-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);
	-ms-transform: scale(1.1, 1.1);
	transition: all 0.5s ease-out;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
}


#Effort .Column1 .LinkListStyle1 li{
	line-height: 160%;
}

#Effort .Column1 .LinkListStyle1 li:first-child{
	padding-top: 20px;
	min-height: 75px;
}

#Effort .ButtonStyle1 li a:link{
	width: 70px;
	border-right: solid 3px transparent;
	background-position-x: 95%;
	background-image: url(/image/jp/r1/icon/icon_new_window_white_hd.png);
}


/* FloatingNavi
=========================================================================================== */

#FloatingNavi {
	background-color: #fff;
}
#FloatingNavi.Fixed {
	position		: fixed;
	top			: 0;
	left			: auto;
	z-index			: 10;
	width			: 100%;
	box-shadow		: 0 5px 10px rgba(51, 51, 51, 0.2);
}

@media screen and (max-width: 767px) {
	.JS #FloatingNavi {
		display: none;
	}
}


/* FloatBtn
=========================================================================================== */
#FloatBtnStopper {
  position: relative;
  height: 50px; }

#FloatBtnWrap {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  opacity: 0;
  z-index: 10;
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -webkit-transform: translateY(100%);
  transform: translateY(100%); }
  #FloatBtnWrap.narrow {
    -webkit-transition: all 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: all 0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
  #FloatBtnWrap.visible {
    opacity: 1;
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0); }
    #FloatBtnWrap.visible .PageTopBtn {
      top: -70px; }
      #FloatBtnWrap.visible .PageTopBtn img {
        width: 50px; }
  #FloatBtnWrap.static {
    position: absolute; }
    #FloatBtnWrap.static .ContactBlock {
      height: 50px;
      background: #3d3d3d;
      display: flex;
      justify-content: center; }
  #FloatBtnWrap .PageTopBtn {
    position: absolute;
    top: 0;
    opacity: 1.0;
    -webkit-transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: opacity 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
    #FloatBtnWrap .PageTopBtn:hover {
      opacity: 0.7; }
  #FloatBtnWrap .ContactBlock {
    display: flex;
    height: 50px;
    align-items: center;
    justify-content: center;
    background: rgba(60, 60, 60, 0.8);
    -webkit-transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
    transition: background 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s; }
    #FloatBtnWrap .ContactBlock a {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 310px;
      height: 30px;
      font-size: 18px;
      font-size: 112.5%;
      color: #fff;
      text-align: center;
      font-weight: bold;
      text-decoration: none;
      padding: 2px 0 2px 20px;
      margin: 0 10px;
      -webkit-transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
      transition: 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
      border: 1px solid #fff;
      background: #e60127;
      position: relative; }
      #FloatBtnWrap .ContactBlock a:hover {
        opacity: 0.7; }
      #FloatBtnWrap .ContactBlock a:before {
        position: absolute;
        content: '';
        display: inline-block;
        width: 20px;
        height: 22px; }
      #FloatBtnWrap .ContactBlock a:nth-child(1):before {
        top: 10px;
        left: 90px;
        background: url("/products/infrastructure/product_site/water_environment/image/common/icon_mail.png");
        background-repeat: no-repeat;
        background-size: contain; }

@media screen and (min-width: 1305px) {
  #FloatBtnWrap .PageTopBtn {
    right: 50%;
    -moz-transform: translateX(630px);
    -ms-transform: translateX(630px);
    -webkit-transform: translateX(630px);
    transform: translateX(630px); } }
@media screen and (max-width: 1304px) {
  #FloatBtnWrap .PageTopBtn {
    right: 40px; } }
@media screen and (max-width: 767px) {
  #FloatBtnStopper {
    height: 40px; }

  #FloatBtnWrap .PageTopBtn {
    right: 20px; }
  #FloatBtnWrap.static .ContactBlock {
    display: block;
    height: 32px; }
  #FloatBtnWrap.visible .ContactBlock {
    height: 32px; }
  #FloatBtnWrap.visible .PageTopBtn {
    top: -65px; }
  #FloatBtnWrap .ContactBlock {
    display: block;
    height: 32px;
    padding: 10px 0; }
    #FloatBtnWrap .ContactBlock a {
      width: 290px;
      height: 26px;
      margin: 0 auto 11px; }
      #FloatBtnWrap .ContactBlock a:last-of-type {
        margin-bottom: 0; }
      #FloatBtnWrap .ContactBlock a span {
        padding-left: 0;
        background-size: 15px; }
      #FloatBtnWrap .ContactBlock a:before {
        width: 20px;
        height: 20px; }
      #FloatBtnWrap .ContactBlock a:nth-child(1):before {
        top: 7px;
        left: 84px; }
      #FloatBtnWrap .ContactBlock a:nth-child(2):before {
        top: 5px;
        left: 49px; } }


/* サイトリニューアル・各コンテンツ調整
=========================================================================================== */
body {
  background: #fff;
}
.pr52 { padding-right: 52px!important; }
.w315 {
  width:315px;
  max-width: 100%;
}
#Contents {
  min-width: auto!important;
}
#TopicPath,.GridSet {
  min-width : auto!important;
  max-width : 965px!important;
  margin    : 0 auto!important;
}
#TopicPath ul {
  max-width : 965px!important;

}
.GridSet {
  padding-bottom: 80px;
} 
.Grid1 {
  width: 230px!important;
}
.Grid3 {
  width: 720px!important;
}
.Column1 {
  width: 230px!important;
  margin: 0 0 0 15px!important;
}
.Column1.FirstItem, .Column1andHalf.FirstItem, .Column2.FirstItem, .Column3.FirstItem {
  margin: 0!important;
}
.Column2 {
  width: 475px!important;
  margin: 0 0 0 15px!important;
}
.ColumnSet4-3 .Column1 {
	width: 311px!important;
	margin: 0 16px 0 0!important;
}

.BoxPatternA .ColumnSet.suigennomori_img2 {
  width: 852px !important; 
  margin: 0 auto !important;
}
.BoxPatternA .suigennomori_img2 .Column2 {
  width: 426px!important;
  margin: 0 !important;
}
.Column3 {
  width: 720px!important;
  margin: 0 0 0 15px!important;
}
.iframeSection {
  max-width: 640px;
  margin-bottom: 10px;
}
.iframeWrap {
  position:relative;
  width:100%;
  min-width: 280px;
  height:0;
  padding-top:57%;
  margin-bottom: 20px;
}
.IframeAdjust {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}
.FlexColumnSet {
  display : flex;
  justify-content: center;
  margin: 0!important;
}
.FlexColumnSet.SpaceBetween {
  justify-content: space-between;
}
.FlexColumnSet.SpaceAround {
  justify-content: space-around;
}
.FlexColumnSet.AlignCenter {
  align-items: center;
}

.FlexImgWrap {
  padding: 0 8px;
}
.FlexImgWrap:first-child {
  margin-bottom: 10px;
}

@media screen and (max-width: 1304px) and (min-width: 995px){
  .HeaderAreaAdjust {
    width: auto!important;
    min-width: auto!important;
    max-width: 1275px!important;
    padding: 0 15px!important;
  }
  .HeaderSetAdjust {
    width: auto!important;
    max-width: 1275px!important;
  }
  .JS #SiteIdentityS, .JS #SiteIdentityL, .JS #SiteIdentity {
    min-width: 320px!important;
  }
  .SiteIdentityAdjust .Title{
    width: auto!important;
    max-width: 1275px!important;
    padding: 5px 15px 0!important;
  }
  .GlobalNaviAdjust {
    min-width: 320px!important;
  }
  .ClearFixAdjust {
    padding: 0 15px!important;
  }
  .CourtesyNaviAdjust {
    width: auto!important;
    padding: 0 15px!important;
  }
  .GlobalNaviTopAdjust {
    width: auto!important;
    max-width: 1275px!important;
  }
  .OptionWideRWD #TopicPath ul {
    padding: 20px 0 5px!important;
  }
  .OptionWideRWD .GridSet {
    margin    : 0 auto!important;
  }
  .OptionWideRWD .Grid1 {
    width: 25%!important;
  }
  .OptionWideRWD .Grid3 {
    width: 75%;
  }
  .OptionWideRWD .Grid4, .OptionWideRWD .Grid3, .OptionWideRWD .Grid1 {
    padding: 0!important;
  }
  .OptionWideRWD .ColumnSet {
    margin: 0!important;
  }
  .OptionWideRWD .Grid4 .Column1 {
    padding : 0!important;
  }
  .OptionWideRWD .Grid3 .Column1andHalf, .OptionWideRWD .Grid3 .Column2 .Column1, 
  .OptionWideRWD .Grid4 .Column3 .Column1andHalf,.OptionWideRWD .Grid4 .Column2 .Column1,.OptionWideRWD .Grid4 .Column2{
    padding: 0!important;
  }
  .OptionWideRWD .Grid4 .Column3 {
    padding: 0!important;

  }
  .FooterAdjust {
    min-width: 305px!important;
    padding-right: 15px!important;
  }
  .FooterAdjust ul {
    width: auto!important;
    max-width: 1250px!important;
    padding: 0 15px!important;
  }
  .FooterAdjust  p {
    width: auto!important;
    max-width: 1300px!important;
}
}
@media screen and (max-width: 994px){
  .JS #TopicPath {
    max-width: none !important;
  }

  .JS .GridSet {
    max-width: 980px !important;
    margin: 0 0 0 -15px!important;
  }
  .JS .Grid1 {
    width: 25%!important;
  }
  .JS .Grid3 {
    width: 75%!important;
  }

  .JS .Grid4 .Column1 {
    width: 25%!important;
    margin: 0!important;
  }
  .JS .Grid4 .Column2 {
    width: 50%!important;
    margin: 0!important;
  }
  .JS .Grid4 .Column3 {
    width: 75%!important;
    margin: 0!important;
  }

  .JS .ColumnSet4-3 {
    margin-left: -15px !important;
  }
  .JS .ColumnSet4-3 .Column1 {
    width: 33.33333333%!important;
  }
  .JS .ColumnSet4-3 .Column2 {
    width: 66.66666666%!important;
  }

  .JS .BoxPatternA .suigennomori_img2 {
    width: auto !important;
    max-width: 852px; 
  }
  .JS .BoxPatternA .suigennomori_img2 .Column2 {
    max-width: 50%;
    padding-left: 0 !important;
  }
}
@media screen and (max-width: 767px){
  .JS .Grid1 {
    width: auto!important;
}
  .JS .Grid3 {
    width: auto!important;
  }
  .JS .Grid4 .Column1, .JS .Grid4 .Column2, .JS .Grid4 .Column2 .Column1, .JS .Grid4 .Column3, .JS .Grid4 .Column3 .Column1, .JS .Grid4 .Column3 .Column1andHalf, .JS .Grid4 .Column3 .Column2, .JS .Grid3 .Column1, .JS .Grid3 .Column1andHalf, .JS .Grid3 .Column2, .JS .Grid3 .Column2 .Column1 {
      float: none!important;
      width: auto!important;
  }
  .FlexColumnSet {
    flex-direction: column;
  }

  .JS .BoxPatternA .suigennomori_img2 {
    max-width: none; 
  }
  .JS .BoxPatternA .suigennomori_img2 .Column2 {
    max-width: none;
  }

  .JS .ResponsiveTableStyle1.NoHeaderRow tr:first-child {
    display: block;
  }
  .JS .ResponsiveTableStyle1.NoHeaderRow .ResponsiveTableHeading {
    display: none;
  }
}

@media screen and (min-width: 768px){
  .PcPr30 { padding-right: 30px!important; }
  /*.Column2 {
    width: 50%!important;
    padding: 0 0 0 15px!important;
    margin: 0!important;
    box-sizing: border-box;
  }*/
  div.ImgSide p:nth-child(2n) { margin-left: 15px; }

}


/* Search
=========================================================================================== */
/* --- Doctype Select --- */
.mf_finder_searchBox_doctype_select {
	height: 100%;
}
/* --- responsive --- */
@media screen and (max-width: 500px) {
	.mf_finder_searchBox_submit span{
		display: none;
	}
}

/* Pick Up
=========================================================================================== */
.PickUp_one,.PickUp_two,.PickUp_three {
  position: absolute;
  display: flex;
  flex-flow: column wrap;
  align-items: flex-end;
	width:100%;
	top:300px;
	/*justify-content:flex-end;
	height: 345px;*/
 }
.PickUp {
  position: fixed;
}
.PickUp_one .PickUp:nth-child(1),.PickUp_three .PickUp:nth-child(2) {
  margin-top: 0;
}
.PickUp_two .PickUp:nth-child(1),.PickUp_three .PickUp:nth-child(1) {
  margin-top: -100px;
}
.PickUp_three .PickUp:nth-child(3) {
  margin-top: 100px;
}
dl.PickUp {
  display: flex;
  flex-flow: row nowrap;
  width: auto;
  height: 6em;
  margin-bottom: 10px;
  color: #ffffff;
  cursor: pointer;
	z-index:13;
}
dl.PickUp :last-child {
  margin-bottom: 0;
}
.PickUp dt {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding: 0.5em;
  line-height: 120%;
  text-align: center;
  font-weight: bold;
  background-image: url(/products/infrastructure/portal/industry/image/top/icon_banner_open.png);
  background-repeat: no-repeat;
  background-position: right 5px top 5px;
  background-color: rgba(177, 0, 14, 0.8);
  border-top-left-radius: 300px;
  border-bottom-left-radius: 300px;
}
dl.PickUp.opened dt {
  background-image: none;
}
.PickUp dd {
  padding: 0.5em 0;
  background-color: rgba(177, 0, 14, 0.8);
}
.JS .PickUp dd {
  display: none;
}

dl.PickUp.opened dd {
  background-image: url(/products/infrastructure/portal/industry/image/top/icon_banner_close.png);
  background-repeat: no-repeat;
  background-position: right 5px top 5px;
}
.PickUp dd .Inner {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: flex-start;
  height: 100%;
  padding: 0.5em 1em 0 0.5em;
  border-left: 2px solid #fff;
}

.PickUp dd .Inner.pt0 {
  padding: 0 1.5em 0 0.5em;
}
.PickUp dd .Inner p {
  margin-bottom: 0;
  line-height: 130%;
  white-space: nowrap;
}
.PickUp dd .Inner a {
  padding-right: 20px;
  color: #ffffff;
  background-image: url(/products/infrastructure/portal/industry/image/top/arw_accordion_link.gif);
  background-repeat: no-repeat;
  background-position: right 2px center;
}
.PickUp dd .Inner a:hover, .PickUp dd .Inner a:active {
  background-position: right center;
}