@charset "UTF-8";

#esm_lineup div {padding-bottom:0;}
#esm_lineup div > h2 {color:#009F80; background:#E7FDF9;}

@media screen and (max-width: 1023px) {
.main--esmMarketing .topSection--information {padding-bottom:5%;}
#esm_lineup div {padding-bottom:10%;}
}

@media only screen and (max-width: 430px) {
#esm_lineup div {padding-bottom:20%;}
}




.topSection.topSection--information > div {padding-bottom:calc(10vw + 100px);}

#sc_related_ma {position:relative; background:#E7FDF9;}
#sc_related_ma::before {content:""; display:block; width:100%; height:20vw; position:absolute; left:0; top:-10vw; background:no-repeat 0 0; background-size:100%; background-image:url(/wp-content/themes/esm/assets/img/esm-marketing/bg_section_color_right.svg);}
#sc_related_ma::after {content:""; display:block; width:100%; height:20vw; position:absolute; left:0; bottom:-10vw; background:no-repeat 0 0; background-size:100%; background-image:url(/wp-content/themes/esm/assets/img/top/bg_case.svg);}
#sc_related_ma > div {position:relative; margin:0 auto; padding:0 0 calc(10vw + 100px) 0; text-align:center; width:92%; max-width:1200px; z-index:100;}
#sc_related_ma > div h2 {margin:0 auto 50px auto; font-size:4.4rem; line-height:1.6; font-weight:600; color:#222;}
#sc_related_ma > div ul {display:flex; flex-wrap:wrap; justify-content:center; gap:20px 20px; margin:0 0; padding:0 0;}
#sc_related_ma > div ul li {width:calc((100% - 80px) / 5); margin:0 0; padding:0 0;}
#sc_related_ma > div ul li a {display:inline-block; margin:0 0; padding:20px 20px; width:100%; height:100%; text-align:center; text-decoration:none !important; background:#fff; border-radius:20px; transition:0.3s ease-in-out;}
#sc_related_ma > div ul li a:hover {opacity:0.7;}
#sc_related_ma > div ul li a div.thumb {margin:0 auto 10px auto; line-height:0.5; border-radius:10px; overflow:hidden;}
#sc_related_ma > div ul li a div.thumb img {width:100%; height:auto;}
#sc_related_ma > div ul li a div.title {font-size:14px; line-height:1.5; letter-spacing:0.5px; text-align:left;}
#sc_related_ma > div p {margin:50px auto 0 auto; padding:0 0;}
#sc_related_ma > div p a {display:inline-block; margin:0 0; padding:15px 30px; font-size:16px; line-height:1.5; font-weight:600; color:#fff; background:var(--greenLight); border-radius:50px; transition:0.3s ease-in-out;}
#sc_related_ma > div p a:hover {opacity:0.7;}

@media only screen and (max-width: 768px) {
#sc_related_ma > div {z-index:1;}
#sc_related_ma > div h2 {margin:0 auto 30px auto; padding:30px 0 0 0; font-size:2.8rem;}
#sc_related_ma > div ul li {width:calc((100% - 40px) / 3);}
#sc_related_ma > div ul li a div.thumb {position:relative; margin:0 0 10px 0; width:100%;}
#sc_related_ma > div ul li a div.thumb img {max-width:100%;}
#sc_related_ma > div ul li a div.title {width:100%;}
}

@media only screen and (max-width: 430px) {
#sc_related_ma > div h2 {margin:0 auto 20px auto; font-size:2.4rem;}
#sc_related_ma > div ul {gap:10px 10px;}
#sc_related_ma > div ul li {width:calc((100% - 10px) / 2);}
#sc_related_ma > div ul li a {padding:10px 10px;}
}


/* タブレット・スマホのハンバーガーメニュー ここから
===========================================================*/
#hbg-chk {position:absolute; width:1px; height:1px; margin:-1px; border:0; padding:0; overflow:hidden; clip:rect(1px,1px,1px,1px);}
#hbg {position:absolute; top:-99999px;}

@media only screen and (max-width: 768px) {
#hbg {position:absolute; right:0; top:-1px; display:inline-block; width:28px; height:28px; text-indent:28px; white-space:nowrap; overflow:hidden; cursor:pointer; -webkit-tap-highlight-color:rgba(0,0,0,0); z-index:10;}
#hbg span,
#hbg span::before,
#hbg span::after {position:absolute; top:50%; left:2px; height:2px; width:24px; background:#222; -webkit-transition:all 0.25s; transition:all 0.25s;}
#hbg span::before {content:""; display:inline-block; top:-7px; left:0;}
#hbg span::after {content:""; display:inline-block; top:7px; left:0;}
#hbg-chk:checked ~ #hbg span {height:0; background:transparent;}
#hbg-chk:checked ~ #hbg span:before {top:0; -webkit-transform:rotate(-45deg); transform:rotate(-45deg);}
#hbg-chk:checked ~ #hbg span:after {top:0; -webkit-transform:rotate(45deg); transform:rotate(45deg);}
#hbg-chk:not(:checked) ~ .header__menu {display:none;}
#hbg-chk:checked ~ .header__menu {display:block; width:100%; opacity:1;}
#hbg-chk:checked ~ .header__menu ul.hml_add {display:block;}
body:has(#hbg-chk:checked) {overflow:hidden;}

.header__inner {position:relative;}

.header__menu {position:fixed; top:0; left:0; margin:0 0; padding:46px 20px 20px 20px; height:100%; background:#E7FDF9; overflow-y:scroll;}
.header__menu:after {content:none;}
.header__menu .hml_add {height:auto;}
.header__menu .hml_add > li {border-bottom:1px solid rgba(0,0,0,0.25);}
.header__menu .hml_add > li > a {display:block; width:100%; padding:20px 20px; font-size:16px; line-height:26px; border-radius:0 0;}
.header__menu .hml_add > li:not([class]) > a:hover {opacity:1;}
.header__menu .hml_add > li.item {flex-direction:column; align-items:start; gap:0 0;}
.header__menu .hml_add > li.item::after {content:none;}
.header__menu .hml_add > li.item > a {position:relative;}
.header__menu .hml_add > li.item > a:hover {opacity:1;}

.header__menu .hml_add > li.item::before {content:""; display:block; position:absolute; width:26px; height:26px; right:20px; top:20px; background:#222; border:none; border-radius:50px;}
.header__menu .hml_add > li.item > a::before,
.header__menu .hml_add > li.item > a::after {content:""; display:block; position:absolute; background:#fff; border-radius:10px; -webkit-transition:all 0.2s ease-in-out; transition:all 0.2s ease-in-out;}
.header__menu .hml_add > li.item > a::before {width:2px; height:14px; top:calc(50% - 7px); right:32px;}
.header__menu .hml_add > li.item > a::after {width:14px; height:2px; top:calc(50% - 1px); right:26px;}
.header__menu .hml_add > li.item > a.item__serviceMenu_open::before {-webkit-transform:rotate(90deg); transform:rotate(90deg);}

.header__menu .hml_add > li.item .item__serviceMenu {display:none; margin:0 0;}
.header__menu .hml_add > li.item .item__serviceMenu div {margin:0 20px 20px 20px; padding:10px 10px; background:#fff; border-radius:20px;}
.header__menu .hml_add > li.item .item__serviceMenu div ul {height:auto;}
.header__menu .hml_add > li.item .item__serviceMenu div ul li {width:calc((100% - 10px) / 2);}
.header__menu .hml_add > li.item .item__serviceMenu p a span:nth-last-of-type(1) {padding:0 0 0 5px;}
.header__menu .hml_add > li.item .item__serviceMenu p a span:nth-last-of-type(1)::after {content:none;}

.header__menu .hml_add + ul.header__menu__cta {display:inline-flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:20px 10px; width:100%; height:auto; margin:0 auto; padding:20px 20px;}
.header__menu .hml_add + ul.header__menu__cta > li:not(:first-child) {margin:0 0;}
.header__menu .hml_add + ul.header__menu__cta > li .modBtn {min-width:0; min-height:0; padding:10px 40px; font-size:16px; font-size:1.6rem; line-height:1.6;}
.header__menu .hml_add + ul.header__menu__cta > li .modBtn--orange:after {content:none;}
}

@media only screen and (max-width: 430px) {
.header__menu .hml_add > li.item .item__serviceMenu div ul li {width:100%;}
.header__menu .hml_add > li.item .item__serviceMenu p a span:nth-last-of-type(1) {display:inline-block; padding:0 0;}

.header__menu .hml_add + ul.header__menu__cta > li {width:100%;}
.header__menu .hml_add + ul.header__menu__cta > li .modBtn {width:100%;}
}
/* タブレット・スマホのハンバーガーメニュー ここまで
===========================================================*/