@charset "Shift_JIS";

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

Name: modify.css

Description: Sub CSS

Create: 2025.07.01
Update: 2025.07.01

Copyright 2025 Hitachi Industrial Products, Ltd.

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


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

Common

------------------------------------------------------------------------------------------- */
div#pump_wrap {
  font-family:  Arial,
    "Helvetica Neue",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
  .pc {
    display: block !important;
  }
.sp {
    display: none !important;
}
@media (max-width: 767px) {
  .pc {
    display: none !important;
  }
.sp {
    display: block !important;
}
}
.pc994 {
    display: block !important;
}
.sp994 {
    display: none !important;
}
.sp579 {
    display: block !important;
}

@media (max-width: 994px) {
.pc994 {
    display: none !important;
}
.sp994 {
    display: block !important;
}
}

@media (max-width: 579px) {
.sp579 {
    display: none !important;
}
}
@media (max-width: 399px) {
.sp399None {
    display: none !important;
}
}
@media (max-width: 767.999px) {
  .pcContact {
    display: none; } }
@media (min-width: 768px) {
  .spContact {
    display: none; } }

.inner {
max-width: 1100px;
margin:0 auto;
box-sizing: border-box;
}
.inner2 {
max-width: 965px;
margin:0 auto;
box-sizing: border-box;
}
.AC_contents {display: none;}
.container-wrap {display: inline-block;}

/*
inline-block使用による、不要なマージン削除
=========================================================================================== */
.CourtesyNavi {
	letter-spacing: -.40em
}
.CourtesyNavi li {
	letter-spacing: normal
}

/*
画像へのマウスオーバーで半透明
=========================================================================================== */
a:hover img {
	-moz-opacity: 0.8;
	filter: alpha(opacity=80);
	opacity: 0.8;
}

h1 a:hover img {
	-moz-opacity:1;
	filter: alpha(opacity=100);
	opacity: 1;
}

/*
文中のニューアイコン付加
=========================================================================================== */
p.NewWin a,
dd.NewWin a {
	padding: 0 17px 0 0;
	background: url(/image/jp/r1/icon/icon_new_window.gif) no-repeat right center        !important;
}

/*
画像＋テキスト回り込み解除
=========================================================================================== */
p.nonFlowImg01 {overflow: hidden;}

/*
リスト
=========================================================================================== */
ul.MarkList1 {margin: 0 0 30px;padding-left: 1.25em;}
ul.MarkList1 li {font-size: 120%;line-height: 160%;list-style-position: inside;text-indent: -1.05em;margin-bottom: 0.35em;}
ul.MarkList1 li>span{
vertical-align: 0.15em;
}
ul.MarkList1 li::before {
  content: "";
  display: inline-block;
  border-radius:50%;
  background-color: #050;
  position: relative;
}
ul.MarkList1 li::before {
width: 10px;
height: 10px;
top: -4px;
left: 0px;
margin-right: 8px;
}

@media (max-width: 399px) {
ul.MarkList1 li::before {
top: -3px;
}
}

/*
余白調整
=========================================================================================== */


/*
contents
=========================================================================================== */
#pump_anchor {
color: #fff;
padding: 7px 20px;
position: sticky;
z-index: 200;
top: 0;
left: 0;
width: 100%;
box-sizing: border-box;
transition: .3s; }
.header1-show #pump_anchor {
top: 45px; }
.header2-show #pump_anchor {
top: 60px; }
#pump_anchor .inner {
max-width: 1100px;
margin:0 auto;
box-sizing: border-box;
display: flex;
justify-content: space-between;
align-items: center; }
#pump_anchor .label {
font-size: 20px;
font-weight: bold;
margin-right: 20px;
line-height: 1.3; }
#pump_anchor .label span {
display: inline-block; }
#pump_anchor ul {
margin: -10px 0 0;
padding: 0;
display: flex;
flex-wrap: wrap;
width: calc(100% - 100px); }
@media (min-width: 768px) {
#pump_anchor ul {
margin-left: auto;
width: auto; } }
#pump_anchor ul li {
margin: 15px 0 0;
padding: 0;
list-style: none;
width: 50%;
box-sizing: border-box; }
#pump_anchor ul li:nth-of-type(2n) {
border-right: 2px solid #027c3f; }
@media (min-width: 768px) {
#pump_anchor ul li {
width: auto;
border-right: none !important; } }
#pump_anchor ul a {
font-size: 100%;
line-height: 1;
color: #fff;
display: block;
text-decoration: none;
text-align: center; }
@media (min-width: 768px) {
#pump_anchor ul a {
padding: 0 40px;
font-size: 110%; } }
#pump_anchor .contact {
width: 80px; }
@media (min-width: 768px) {
#pump_anchor .contact {
width: 216px; } }
#pump_anchor .contact a {
color: #fff;
display: flex;
justify-content: center;
align-items: center;
height: 40px;
border-radius:30px;
text-decoration: none;
font-size: 110%;
grid-gap: 10px; }

@media (max-width: 768px) {
#pump_anchor .contact {
width: 70px;
display: flex;
justify-content: center;
}
}

#pump_anchor .contact a::before {
content: "";
background: url(/products/pump/service/e-pumpmainte/images/icon_mail.png) no-repeat center center/contain;
width: 30px;
height: 23px;
display: block; }
#Pump_Index #pump_anchor {
background: linear-gradient(to right, #0446a6 0%, #2aabe4 100%);
}
#Pump_MT #pump_anchor {
background-color: #006837;
}
#Pump_Index #pump_anchor .contact a {border: 1px solid #0071bd;background-color: #0071bd;}
#Pump_MT #pump_anchor .contact a {border: 1px solid #9bd800;}

#Pump_Index #pump_anchor ul li {
border-left: 1px solid #02fffa;
}
#Pump_MT #pump_anchor ul li {
border-left: 2px solid #027c3f;
}
@media (max-width: 767.999px) {
#pump_anchor .contact a {
width: 60px;
height: 60px;
}
}

/*三角区切り線 */
section.ss-style-triangles {
padding: 195px 0;
  background: #fff;
  position: relative;
}
section.ss-style-triangles::before {
content: "";
  position: absolute;
  clip-path: polygon(50% 20%, 0% 100%, 100% 100%);
  background:#fff;
  height: 70px;
  width: 280px;
  left: calc(50% - 140px);
  top: -70px;
}

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

ブランディングエリア

------------------------------------------------------------------------------------------- */
#pump_kv div.textBox .text01 {
font-weight: bold;
font-size: 200%;
line-height: 2.0em;
}
@media (min-width: 768px) {
#pump_kv {
    height: 875px;
  }
}
@media (min-width: 768px) {
  #pump_kv .inner {
  position: relative;
  height: 100%;
  margin:0 auto;
  box-sizing: border-box;
  }
  #Pump_MT #pump_kv .inner {
  max-width: 1150px;
  }  
}

#pump_kv {
overflow:hidden;
background:#fff url("/products/pump/service/e-pumpmainte/images/branding_pc.jpg") no-repeat center center / cover;
height: 650px;
position: relative;
}

@media (max-width: 767px) {
  #pump_kv {
  background:#fff url("/products/pump/service/e-pumpmainte/images/branding_sp.jpg") no-repeat center center / cover;
  aspect-ratio: 24 / 25;
  height: auto;
  }
  #pump_kv .inner {
  padding-right: 25px;
  padding-left: 25px;
  }
}

#Pump_MT #pump_kv .textBox {
background-color: #fff;
color: #005400;
padding: 40px 40px;
display: inline-block;
position: absolute;
top: 50%;
left: 0%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
box-shadow: 10px 10px 0px 0px rgba(155, 215, 0, 1);
}

@media (max-width: 1200px) {
#Pump_MT #pump_kv .textBox {
margin-left: 25px;
padding: 30px 25px;
}
}
@media (max-width: 767px) {
#Pump_MT #pump_kv .textBox {
width: calc(100vw - 90px);
}
}

.dots {
background-image: radial-gradient(circle at center, #00ff00 20%, transparent 20%);
background-position: top right; 
background-repeat: repeat-x;
background-size: 1.2em 0.3em;
padding-top: .5em;
}
.dots span.big {
font-size: 150%;
font-weight: 200;
}
.dots span.big2 {
font-size: 136%;
}
div.dots {
display: inline-block;
}
div.h1Box {
width: 100%;
background-image: linear-gradient(90deg, rgba(155, 215, 0, 1) 81%, rgba(59, 182, 73, 1));
}

div.h1Box > .inner {
max-width: 1150px;
padding: 70px 0 60px;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 90px;
display: grid;
grid-template-columns: minmax(200px,51.5%) 1fr;
}
div.h1Box > .inner > .text03 {
color: #fff;
font-weight: bold;
}
div.h1Box > .inner > .text03 > p {
font-size: 110%;
line-height: 2.2em;
margin-bottom: 10px;
}
div.h1Box > .inner > .text03 > dl {margin-bottom: 0;}
div.h1Box > .inner > h1> img {width: 100%;}
div.h1Box > .inner > h1 {position: relative;}
div.h1Box > .inner > h1 > span {position: absolute;display: inline-block;color:#fff;top:-1.0em;right: -1.5em;font-size: 14px;font-weight: bold;}

@media (max-width: 1200px) {
div.h1Box > .inner {
margin: 0 25px !important;
}
}
@media (max-width: 767px) {
div.h1Box > .inner > h1 > span {top:-1.0em;right: -0.5em;font-size: 12px;}
div.h1Box > .inner {
display: flex;
gap: 20px;
padding: 30px 0;
}
#Pump_MT #pump_kv .textBox {
padding: 20px 15px;
}
}

@media (max-width: 579px) {
div.h1Box > .inner > .text03 {
font-size: 100%;
}
#pump_kv div.textBox .text01 {
font-size: 146%;
}
}
@media (max-width: 431px) {
#pump_kv div.textBox .text01 {
font-size: 107%;
}
}
@media (max-width: 399px) {
#pump_kv div.textBox .text01 {
font-size: 90%;
}
}
@media (max-width: 345px) {
#pump_kv div.textBox .text01 {
font-size: 84%;
}
}

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

見出し

------------------------------------------------------------------------------------------- */
div.h2_Box02 {
background-color: #006837;
padding: 120px 0 30px;
box-sizing: border-box;
}
div.h2_Box03 {
padding: 215px 0 22px;
margin-bottom: 145px;
box-sizing: border-box;
}
#Pump_MT h2 {
position: relative;
padding: 0;
margin: 0;
text-align: center;
background: none;
}
#Pump_MT h2 span {
color: #9cd701;
display: block;
background: none;
letter-spacing: 0.25em;
font-size: 130%;
font-weight: bold;
padding: 0;
line-height: 1.2em;
margin-bottom: 18px;
}
#Pump_MT h2 div {
display: block;
}
#Pump_MT div.h2_Box03 h2 span {
}

@media (max-width: 767px) {
div.h2_Box02 {
padding: 55px 0 30px;
}
div.h2_Box03 {padding: 155px 0 22px;margin-bottom: 100px;}
}
@media (max-width: 670px) {
div.h2_Box02 h2 span.img img, 
div.h2_Box03 h2 span.img img {
width: 80%;
}
}
#Pump_MT h2::before {
position: absolute;
bottom: -49px;
left: calc(50% - 30px);
width: 50px;
height: 8px;
content: '';
background: #9cd701;
}

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

FEATURES

------------------------------------------------------------------------------------------- */
div#features{
}
div.bg_features {
background:#e5f0eb url("/products/pump/service/e-pumpmainte/images/main_bg_features.jpg") no-repeat center top / cover;
padding-bottom: 120px;}

.inner3 {
max-width: 1130px;
min-height: 80px;
margin:0 auto;
box-sizing: border-box;
display: flex;
align-items: flex-end;
}
.inner3.LineR {
justify-content: flex-end;
}
.separate {
width: 50px;height: 10px;display: block;background-color: #fff;
text-align: left;
}

@media (max-width: 1200px) {
.inner3 {
margin-left: 25px;
margin-right: 25px;
}
}
.container {
max-width: 1150px;
margin: 0 max(40px, calc((100vw - 1150px) / 2));
position: relative;
padding: 70px 20px 20px;
min-height: fit-content;
box-sizing: border-box;
margin-top: 0px;
}

.content-ab-container {
display: flex;
gap: 10px;
margin-left: -20px;
margin-bottom: 38px;
box-sizing: border-box;
}
.content-a {
font-family: 'Impact',Arial,sans-serif;
color: #050;
font-size: 800%;
width: 150px;
height: 150px;
flex-shrink: 0;
box-sizing: border-box;
}
.content-b {
margin-top: 50px;
color: #050;
font-size: 150%;
padding: 20px;
height: 50px;
align-items: center;
justify-content: center;
font-weight: bold;
flex: 1;
margin-right: calc(-1 * (max(40px, calc((100vw - 1150px) / 2)) + 20px));
border-bottom: #9bd700 2px solid;
box-sizing: border-box;
font-style: oblique;
}
.content-c {
background-color: #9bd700;
color: #fff;
padding: 50px 55px 25px 65px;
width: 510px;
min-height: 450px;
margin-left: -20px;
position: relative;
z-index: 2;
box-sizing: border-box;
background-image: linear-gradient(-45deg, #fff 0 12px, transparent 10px);
background-position:-10px -10px;
background-size: contain;
}
.content-c h3 {
color: #050;
font-size: 240%;
margin-bottom: 30px;
line-height: 1.55em;
letter-spacing: 0.10em;
}    
.content-c ul li {
color: #050;
font-size: 110%;
letter-spacing: 0.025em;
}
.content-d {
background-color: #ffe0b2;
padding: 20px;
margin-top: -495px;
margin-bottom: 20px;
margin-left: 280px;
margin-right: calc(-1 * (max(40px, calc((100vw - 1150px) / 2)) + 20px));
height: 540px;
background: url("/products/pump/service/e-pumpmainte/images/features_bg01.jpg") no-repeat center center / cover;
box-sizing: border-box;
}

/* ブラウザ左寄せ */
.reverse .content-ab-container {
margin-left:0;
margin-right: -20px;
margin-top: 40px;
}

.reverse .content-a {
text-align: right;
}
.reverse .content-b {
margin-left: calc(-1 * (max(40px, calc((100vw - 1150px) / 2)) + 20px));
text-align: right;
margin-right: 10px; /* 左寄せのみ書き足し */
}
.reverse .flexcontainer {display: flex;justify-content: flex-end;}
.reverse .content-c {
margin-left: 0;
margin-right: -20px;
}
.content-c ul {margin-bottom: 0;}
.reverse .content-d {
margin-right: 280px;
margin-left: calc(-1 * (max(40px, calc((100vw - 1150px) / 2)) + 20px));
background: url("/products/pump/service/e-pumpmainte/images/features_bg02.jpg") no-repeat center center / cover;
}

@media (max-width: 1200px) {
.content-ab-container {
margin-left: -35px;
}
.content-c {
margin-left: -35px;
}
.reverse .content-ab-container {
margin-right: -35px;
}
.reverse .content-c {
margin-right: -35px;
}
}

@media (max-width: 767px) {
div.Base {position: relative;}

.container.f1 {
padding-bottom: 180px;
}
.container.f2 {
padding-bottom: 180px;
}

.content-ab-container {
margin-bottom: 380px;
}
.content-a {
font-size: 1000%;
line-height: 1;
}

.content-c {
width: calc(100vw - 110px);
/*padding: 40px;*/
min-height: auto;
letter-spacing: normal;
position: absolute;
top: 130px;
padding: 20px;}
.content-c h3 {letter-spacing: normal;margin-bottom: 10px;}
.content-c h3 {line-height: 1.25;}
.content-d {
height: 500px;
margin-top: 0px;
margin-left: 0px;}
.reverse .content-d {margin-right: 0px;}
.content-ab-container,
.reverse .content-ab-container {
margin-bottom: 20px;
}
.separate {
width: 45px;
height: 8px;
}
}
@media (max-width: 579px) {
.container.f1 {
padding-bottom: 0px;
}
.container.f2 {
padding-bottom: 0px;
}
.content-c {min-height: 320px;width: calc(100vw - 60px);}
.content-c  h3 {
font-size: 200%;
}
.content-d {height: 400px;}
.content-c ul li {
line-height: 1.2;
}
.inner3 {
min-height: 110px;
}
}

@media (max-width: 430px) {
.content-c {
min-height: 350px;
}
.inner3 {
  min-height: 130px;
}
}

@media (max-width: 399px) {
.content-a {
font-size: 600%;
line-height: 1;
width: 90px;
height: 90px;
}
.content-b {
margin-top: 10px;
}
.content-c {
min-height: 300px;
}
.content-c ul li {
font-size: 90%;
line-height: 1.2;
}
.content-c h3 {
font-size: 160%;
}
.content-d {
height: 300px;
}
.inner3 {
min-height: 170px;
}
}
@media (max-width: 344px) {
.content-c {
min-height: 320px;
}
.inner3 {
min-height: 180px;
}
}


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

BENEFITS

------------------------------------------------------------------------------------------- */
div.bgWrap01 {background: url("/products/pump/service/e-pumpmainte/images/main_bg_benefits.jpg") #fff no-repeat center top / contain;} /* BENEFITS と CASE の上部背景 */
div#benefits {
}

div.box_frame {
display: grid;
grid-template-columns: 1fr 1fr;
place-content: center;
place-items: center;
gap: 75px 70px;
margin-top: 100px;
padding-bottom: 20px;
}
.pump_box {
min-height: 510px;
box-sizing: border-box;
position: relative;
padding: 64px 15px 65px;
border-radius: 20px;
border: 3px solid #9cd701;
background-color: #9cd701;
color: #045103;
font-weight: bold;
text-align: center;
width: 100%;
display: grid;
grid-template-rows: subgrid;
grid-row: span 2;
place-content:center;
place-items:center;
}

.pump_box::before {
position: absolute;
top: 18px;
left: 18px;
width: 100%;
height: 100%;
border-radius: 20px 0 20px 0;
border: 3px solid #3cb649;
content: '';
border-top: none;
border-left: none;
}
.pump_box > span {
display: block;
width: 250px;
height: 250px;
border-radius: 50%;
text-align: center;
margin:0 auto;
box-shadow: 0 0 20px rgba(4,87,7,.3);
}
.pump_box span.boxImg01 {
background:url("/products/pump/service/e-pumpmainte/images/mt_benefits_img01.png") #fff no-repeat 50% 50%;
}
.pump_box span.boxImg02 {
background:url("/products/pump/service/e-pumpmainte/images/mt_benefits_img02.png") #fff no-repeat 50% 50%;
}
.pump_box span.boxImg03 {
background:url("/products/pump/service/e-pumpmainte/images/mt_benefits_img03.png") #fff no-repeat 50% 50%;
}
.pump_box span.boxImg04 {
background:url("/products/pump/service/e-pumpmainte/images/mt_benefits_img04.png") #fff no-repeat 50% 50%;
}
.pump_box p {
line-height: 1.5;
font-size: 180%;
}

@media (max-width: 1100px) {
div#benefits .inner2 {
padding: 0 40px 0 25px;
}
div.box_frame {
gap: 50px 40px;
}
}

@media (max-width: 767px) {
div#benefits div.h2_Box03 {padding-top: 80px;margin-bottom: 100px;}
div#benefits .pump_box {
padding: 50px 15px;
}
div#benefits .pump_box p {
font-size: 140%;
}
.pump_box > span {
width: calc(50vw - 160px);
  height: calc(50vw - 160px);
background-size: 70% !important;
}
}

@media (max-width: 579px) {
  .pump_box {grid-row-gap: 30px;}
  .pump_box > span {
  width: calc(50vw - 130px);
  height: calc(50vw - 130px);
  }
  div#benefits .pump_box {
  padding: 30px 15px;
  }
  div#benefits .pump_box p {
  font-size: 100%;
  }
}
@media (max-width: 399px) {
  div.box_frame {
  grid-template-columns: 1fr;
  }
  .pump_box > span {
  width: calc(100vw - 200px);
  height: calc(100vw - 200px);
  }
  div#benefits .pump_box p {
  font-size: 140%;
  }
}
/* ----------------------------------------------------------------------------------------

CASE

------------------------------------------------------------------------------------------- */
div#case {background:url("/products/pump/service/e-pumpmainte/images/main_bg02.jpg") no-repeat center bottom/ contain;padding-bottom: 110px;}
@media (max-width: 767px) {
div#case {padding-bottom: 30px;}
div#case .inner {padding-left: 25px;padding-right: 25px;}
}

div#case .h3_Box01 {
min-height: 130px;
margin-bottom: 100px;
}
div#case .h3_Title {
width: 100%;
max-height: 130px;
position: relative;
}
div#case .h3_Title > p {
font-family: 'Impact',Arial,sans-serif;
background-color: #006837;
width: 130px;
height: 130px;
text-align: center;
color: #fff;
font-size: 100%;
display: grid;
place-content: center;
place-items: center;
position: absolute;
z-index: 50;
}
div#case .h3_Title > p > span {
font-size: 250%;
display: block;
line-height: 0.95em;
}
div#case .h3_Title > p > span.num {
font-size: 480%;
}

div#case .h3_Title > h3 {
color: #006837;
font-weight: bold;
text-align: center;
font-size: 240%;
border-bottom: solid 2px #006837;
position: absolute;
display: block;
width: 100%;
padding-bottom: 24px;
box-sizing: border-box;
bottom: -120px;
z-index: 10;
}
div#case .TextStyle1 {
margin-bottom: 45px;
font-size: 110%;
}
div#case .ImgOnlyStyle {
margin: 0 25px 140px;
}
div#case .ImgOnlyStyle.plusmb {
margin: 0 25px 210px;
}

@media (max-width: 1200px) {
div#case .inner {
padding: 0 25px;
}
div#case .h3_Title > h3 {
padding-left: 140px;
}
}

@media (max-width: 767px) {
  div#case .h3_Title > p {
  width: 100px;
  height: 100px;
  }
  div#case .h3_Title > p > span {
  font-size: 200%;
  }
  div#case .h3_Title > p > span.num {
  font-size: 350%;
  }
  div#case .h3_Title > h3 {
  font-size: 180%;
  padding-bottom: 12px;
  bottom: -90px;
  padding-left: 100px;
  }
  div#case .ImgOnlyStyle,
  div#case .ImgOnlyStyle.plusmb{
  margin: 0 0 70px;
  }
  div#case .h3_Box01 {
  margin-bottom: 10px;
  }
}

@media (max-width: 399px) {
  div#case .h3_Title > h3 {
  font-size: 150%;
  bottom: -80px;
  }
  div#case .h3_Title > p {
  width: 80px;
  height: 80px;
  }
  div#case .h3_Title > p > span {
  font-size: 150%;
  }
  div#case .h3_Title > p > span.num {
  font-size: 280%;
  }
}

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

メリット

------------------------------------------------------------------------------------------- */
div#merit {
background: url("/products/pump/service/e-pumpmainte/images/merit_bg.jpg") no-repeat center center / cover;
padding: 85px 0 70px;
color: #fff;
border-bottom: 60px solid #fff;
}
div#merit .inner {
padding: 20px;
}

@media (max-width: 767px) {
div#merit .inner {
padding: 50px 45px;
}
div#merit {padding:0;}
}
div#merit p.Contact_Title {font-size: 240%;text-align: center;font-weight: bold;margin-bottom: 40px;}
div#merit .pointText {color: #9bd700;margin: 0 0.65em;}
div#merit .merit_Box01 {max-width: 800px;margin: 0 auto;}
div#merit ul {margin: 0 0 30px;}
div#merit p,
div#merit ul li {font-size: 120%;line-height: 2.0em;list-style-type: disc;list-style-position: inside;margin-bottom: 80px;}
div#merit ul li::marker {font-size: 1.65em;}
div#merit ul li>span{
vertical-align: 0.15em;
}
div#merit p.Contact01 {
font-size: 140%;
border-radius: 15px;
text-align: center;
margin: 0 auto;
box-sizing: border-box;
border: 3px solid #9bd602;
}
#merit p.Contact01 a >  span {color: #fff;text-decoration: none;}
#merit p.Contact01 a {
width: 100%;
display: block;
padding: 30px;
box-sizing: border-box;
}
#merit p.Contact01 a:link {text-decoration: none;}
#merit p.Contact01 a >  span::before {
content: "";
background:url(/products/pump/service/e-pump/images/icon_mail.png) no-repeat center center/contain;
width: 40px;
height: 36px;
display: inline-block;
vertical-align: -0.45em;
margin-right: 30px;
text-decoration: none;
}

@media (max-width: 767px) {
div#merit ul li {
font-size: 100%;
}
}
@media (max-width: 767px) {
div#merit p.Text {
font-size: 100%;
}
}
@media (max-width: 579px) {
div#merit p.Contact_Title {font-size: 150%}
div#merit p.Text {margin-bottom: 30px;}
#merit p.Contact01 a {
padding: 20px;
}
#merit p.Contact01 a >  span {
padding-left: 0;}
#merit p.Contact01 a > span::before {
margin-right: 20px;
}
}
@media (max-width: 399px) {
div#merit p.Contact_Title {font-size: 120%}
}