@charset "UTF-8";

@media print, screen and (max-width:1199px) {

#kvWrap {
position: relative;
background: url("../img/kv_bg.jpg") no-repeat center;
background-size: cover;
width: 100%;
margin-top: 70px;
}

#kvWrap #kvInner {
position: relative;
width: 88%;
margin: 0 auto;
padding: 40px 0;
z-index: 1;
}

#kvWrap #kvInner h1 {
margin-bottom: 20px;
}

#kvNote {
position: relative;
width: 98%;
font-size: 1.1rem;
text-align: justify;
margin: 0 auto;
margin-bottom: 20px;
}

.btn {
position: relative;
font-family:  var(--font-primary);
width: 100%;
height: 70px;
font-size: 1.4rem;
font-weight: 700;
text-align: left;
padding: 0 0 3px 15px;
cursor: pointer;
border-radius: 10px;
transition: .3s;
}

.btn::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
right: 15px;
top: 0;
bottom: 0;
transition: .5s;
}

.btnSimulation {
position: relative;
background-color: #E85555;
font-family: var(--font-primary);
color: #fff;
border: 1px solid #E85555;
}

.btnSimulation::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}

.btnService {
background-color: #fff;
font-family: var(--font-primary);
color: #00477A;
border: 1px solid #fff;
}

.btnService:hover {
background-color: #00477A;
color: #fff;
}

.btnService::after {
border-top: 2px solid #00477A;
border-right: 2px solid #00477A;
}

.btnService:hover.btn::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 25px;
}

#indexServiceWrap {
background: url("../img/index_service_bg.jpg") no-repeat center;
background-size: cover;
width: 94%;
margin: 40px auto;
margin-bottom: 0;
padding: 50px 30px 30px;
border-radius: 20px;
}

.indexServiceFlex {
position: relative;
width: 100%;
}

.indexService {
position: relative;
width: 100%;
color: #fff;
text-align: justify;
margin: 0 auto;
margin-bottom: 40px;
}

.indexService .number {
position: absolute;
width: 60px;
margin: auto;
left: 0;
right: 0;
top: -15px;
z-index: 1;
}

.indexService img {
width: 80%;
display: table;
margin: 0 auto;
margin-bottom: 20px;
}

.indexService h2 {
font-size: 1.8rem;
font-weight: 700;
text-align: center;
margin-bottom: 15px;
line-height: 1.5;
}

.indexService h2 span {
font-size: 1.1rem;
font-weight: 400;
display: block;
margin-top: 3px;
}

.greenTitle {
position: relative;
background: url("../img/icon_title.png") no-repeat left 1px;
background-size: 15px;
font-size: 1.2rem;
font-weight: 700;
text-align: left;
margin-bottom: 20px;
padding-left: 20px;
letter-spacing: 0;
line-height: 1.5;
}

.greenTitle span {
font-size: 2.2rem;
display: block;
margin-left: -20px;
}

#newsWrapFlex {
width: 88%;
text-align: justify;
margin: 0 auto;
padding: 40px 0 0;
}

#newsWrapFlexCo {
width: 88%;
text-align: justify;
margin: 0 auto;
margin-bottom: 40px;
padding: 0;
}

#newsL {
width: 100%;
margin-bottom: 30px;
}

.tabWrap {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.tabWrap li {
position: relative;
width: 45%;
color: #95979E;
display: table;
cursor: pointer; 
line-height: 40px;
white-space: nowrap;
transition: .3s;
}

.tabWrap li a {
text-decoration: none;
}

.tabWrap li span {
padding-left: 26px;
}

.tabWrap li::before {
position: absolute;
background-color: #95979E;
width: 16px;
height: 2px;
content: "";
margin: auto;
border-radius: 10px;
left: 0;
top: 0;
bottom: 0;
transition: .3s;
}

.tabWrap li.select a,
.tabWrap li.select {
font-weight: 700;
color: var(--themeColor);
}

.tabWrap li.select::before {
position: absolute;
background-color: var(--themeColor);
width: 16px;
height: 3px;
content: "";
margin: auto;
border-radius: 10px;
left: 0;
top: 0;
bottom: 0;
}

.btnS {
position: relative;
background-color: #00477A;
font-family:  var(--font-primary);
width: 100%;
height: 44px;
font-size: 1.4rem;
font-weight: 700;
text-align: left;
color: #fff;
margin-top: 20px;
padding: 0 0 3px 20px;
cursor: pointer;
border-radius: 5px;
border: 1px solid #00477A;
transition: .3s;
}

.btnS::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 15px;
top: 0;
bottom: 0;
transition: .5s;
}

.hide {
display: none;
}

#newsR {
width: 100%;
border-top: 1px solid #95979E;
}

.newsList {
border-bottom: 1px solid #95979E;
}

.newsList a {
padding: 20px 0;
display: block;
text-decoration: none;
}

.newsDaCaFlex {
margin-bottom: 3px;
display: flex;
justify-content: flex-start;
}

.newsCategory {
position: relative;
display: table;
height: 26px;
font-size: 1rem;
margin-left: 10px;
padding: 0 15px;
border: 1px solid #00477A;
border-radius: 100px;
line-height: 28px;
top: -4px;
}

#indexWrap {
background-color: #fff;
background-size: cover;
width: 94%;
margin: 30px auto;
padding: 30px 30px 10px 30px;
border-radius: 20px;
}

#indexWrap .inner {
position: relative;
width: 100%;
margin: 0 auto;
padding: 0;
}

#reasonFlex {
margin: 20px auto;
margin-bottom: 40px;
}

.reason {
background-color: #F0F7FC;
width: 100%;
text-align: center;
margin-bottom: 20px;
padding: 20px;
border-radius: 5px;
}

.reason .number {
font-size: 1.1rem;
font-weight: 700;
color: #00477A;
margin-bottom: 10px;
}

.reason .copy {
background-color: #00477A;
width: auto;
height: 28px;
font-size: 1.2rem;
font-weight: 700;
display: table;
margin: 0 auto;
color: #fff;
padding: 0 15px;
line-height: 26px;
}

.reason h3 {
font-size: 1.6rem;
font-weight: 700;
margin-bottom: 20px;
line-height: 1.5;
}

.reason h3 span {
color: #E85555;
}

.reasonImg {
height: 140px;
display: table;
margin: 0 auto;
}

.reasonImg .reasonInner {
width: auto;
height: 90px;
display: table-cell;
vertical-align: middle;
}

.reasonImg .reasonInner img {
height: 90px;
}

.reasonTxt {
width: auto;
text-align: justify;
display: table;
margin: 0 auto;
}

.caseStudyFlex {
margin-bottom: 30px;
}

.caseStudyL {
position: relative;
width: 100%;
}

.caseStudyL img {
width: 100%;
height: 184px;
object-fit: cover;
border-radius: 8px;
}

.companyLogo {
position: relative;
background-color: #fff;
width: 80%;
height: 64px;
margin: 0 auto;
padding: 15px 25px;
border-radius: 5px;
z-index: 1;
top: -15px;
}

.companyLogo img {
width: auto;
max-height: 40px;
object-fit: contain;
}

.caseStudyR {
width: 100%;
text-align: justify;
}

.caseStudyR h3 {
font-size: 1.4rem;
font-weight: 700;
line-height: 1.6;
}

.reduction {
background-color: #f3f3f3;
font-weight: 700;
text-align: center;
margin: 20px auto;
padding: 8px 15px 15px 15px;
border-radius: 5px;
line-height: 40px;
}

.reductionL {
background: url("../img/case_study_ele.png") no-repeat left 7px;
background-size: 30px;
display: table;
margin: 0 auto;
padding-left: 36px;
}

.reductionR {
background: url("../img/case_study_co2.png") no-repeat left 5px;
background-size: 30px;
display: table;
margin: 0 auto;
padding-left: 36px;
}

.reductionL span,
.reductionR span {
position: relative;
font-size: 2rem;
color: #00AEC4;
margin-left: 8px;
top: 2px;
}

.reductionL i,
.reductionR i {
font-size: 1.8rem;
}

#bottomWrapFlex {
width: 94%;
text-align: justify;
margin: 0 auto;
padding: 30px 0;
}

.bottomContents {
background-color: #fff;
width: 100%;
text-align: left;
margin-bottom: 20px;
padding: 30px;
border-radius: 10px;
}

.bottomContents .bcImg {
width: 80px;
height: 80px;
margin: 0 auto;
margin-bottom: 20px;
}

.bottomContents .bcImg img {
width: 100%;
}

.btnW {
position: relative;
background-color: #00477A;
font-family:  var(--font-primary);
width: 100%;
height: 44px;
font-size: 1.4rem;
font-weight: 700;
text-align: left;
color: #fff;
margin-top: 30px;
padding: 0 0 3px 20px;
cursor: pointer;
border-radius: 5px;
border: 1px solid #00477A;
transition: .3s;
}

.btnW::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 15px;
top: 0;
bottom: 0;
transition: .5s;
}

/**/

#warpTitle {
position: relative;
background: url("../img/title_bg.jpg") no-repeat center;
background-size: cover;
width: 100%;
height: 180px;
border-top: 60px solid #fff;
}

#warpTitle #warpTitleInner {
position: absolute;
background: url("../img/icon_title.png") no-repeat left 1px;
background-size: 15px;
width: 88%;
font-size: 1.1rem;
font-weight: 700;
text-align: left;
padding-left: 20px;
margin: 0 auto;
letter-spacing: 0;
line-height: 1.5;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}

#warpTitle #warpTitleInner span {
font-size: 2.2rem;
display: block;
margin-left: -20px;
}

#breadcrumb {
width: 88%;
font-size: 1.2rem;
text-align: left;
margin: 0 auto;
margin-bottom: 40px;
padding: 15px 0;
}

.subTitle {
position: relative;
font-size: 2rem;
font-weight: 700;
margin-bottom: 15px;
padding-left: 24px;
line-height: 1.4;
}

.subTitle::before {
position: absolute;
background-color: #00477A;
width: 16px;
height: 3px;
content: "";
margin: auto;
border-radius: 10px;
left: 0;
top: 14px;
}

.subTitle span {
color: #E85555;
}

.subTitle2 {
font-size: 1.6rem;
font-weight: 700;
margin-top: 20px;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #000;
}

.wrapWh,
.wrapWhMypage {
position: relative;
background-color: #fff;
width: 88%;
text-align: left;
margin: 0 auto;
margin-bottom: 30px;
padding: 30px;
border-radius: 10px;
}

.commonTitle {
position: relative;
font-size: 1.7rem;
font-weight: 700;
text-align: center;
margin-bottom: 40px;
padding-top: 20px;
line-height: 1.4;
}

.commonTitle::before {
position: absolute;
background-color: #00477A;
width: 30px;
height: 3px;
content: "";
margin: auto;
left: 0;
right: 0;
top: 0px;
}

.commonTitle i {
color: #00AEC4;
}

.commonTitle span {
font-size: 2.6rem;
display: block;
margin-top: 5px;
}

.commonTitle u {
color: #E85555;
text-decoration: none;
}

.commonTitle sup {
font-size: 1.2rem;
}

.commonTitle sub {
font-size: 1.2rem;
}

.commonTitle em {
font-size: 1.2rem;
font-weight: 400;
}

.mb70 {
margin-bottom: 70px;
}

.commonTitleNote {
font-size: 1.2rem;
font-weight: 400;
margin-top: -30px;
margin-bottom: 60px;
line-height: 1.6;
}

.wrap {
width: 88%;
text-align: justify;
margin: 0 auto;
padding: 30px 0;
}

.wrapS {
width: 88%;
text-align: justify;
margin: 0 auto;
padding: 30px 0;
}

.commonFlex {
position: relative;
}

.alignItemCe {
align-items: center;
}

/*SERVICE*/

.wrapWh .subTitle {
left: 0;
}

#reductionResults {
position: relative;
width: 150px;
margin: 0 auto;
top: 12px;
z-index: 1;
}

#reductionBgImg {
position: absolute;
width: 110px;
z-index: 1;
top: -50px;
right: 0px;
}

#reductionImg {
width: 100%;
margin: 40px auto;
margin-bottom: 0;
}

#reductionTxt {
position: relative;
font-size: 1rem;
margin-top: 5px;
z-index: 1;
}

.wrapS .subTitle {
left: 0;
}

#planL {
width: 100%;
text-align: justify;
margin: 22px 0 40px;
}

.planMarker {
display: inline-block;
}

#planMarker01,
#planMarker02,
#planMarker03 {
background-color: #95979E;
height: 26px;
color: #fff;
font-weight: 700;
display: inline-block;
margin-right: 3px;
padding: 0 5px;
border-radius: 3px;
line-height: 24px;
}

#planMarker01 {
background-color: #95979E;
}

#planMarker02 {
background-color: #46474A;
}

#planMarker03 {
background-color: #FF9D00;
}

#planR {
width: 100%;
margin: 0 0 60px;
}

.planTxt {
margin-top: 20px;
}

#planImg01 {
width: 100%;
margin: 30px auto;
margin-bottom: 10px;
}

#planImg02 {
width: 100%;
margin: 30px auto;
margin-bottom: 60px;
}

#planTxtS {
width: 100%;
font-size: 1rem;
text-align: justify;
margin: 0 auto;
margin-bottom: 60px;
}

#fixedPlanImg {
width: 100%;
margin: 0 auto;
}

#jepxBgImg {
position: absolute;
width: 100px;
z-index: -1;
top: -70px;
left: 5px;
}

#fixedPlanBgImg {
position: absolute;
width: 60px;
z-index: -1;
top: -90px;
left: 10px;
}

#carbonNeutralTitle {
font-size: 1.8rem;
font-weight: 700;
text-align: center;
margin-bottom: 30px;
line-height: 1.5;
}

#carbonNeutralTitle span {
color: #E85555;
}

#carbonNeutralImg {
position: absolute;
width: 70px;
z-index: -1;
right: 0px;
top: -74px;
}

.carbonNeutral {
background-color: #fff;
width: 100%;
margin-bottom: 20px;
border-radius: 5px;
}

.carbonNeutral h4 {
background-color: #00477A;
width: 100%;
height: 59px;
font-size: 1.5rem;
font-weight: 700;
color: #fff;
text-align: center;
border-radius: 5px 5px 0 0;
line-height: 56px;
}

.carbonNeutralArrow {
width: 26px;
text-align: center;
margin: 12px auto;
margin-bottom: 0;
}

.carbonNeutral dl {
padding: 10px 22px 20px;
line-height: 1.5;
}

.carbonNeutral dt {
float: left;
padding: 8px 0;
}

.carbonNeutral dd {
padding: 10px 0 10px 24px;
}

.carbonNeutral dd span {
font-weight: 700;
color: #00AEC4;
}

/*Simulation*/

#wrapSimulation {
background-color: #fff;
width: 88%;
font-size: 1.4rem;
font-weight: 700;
margin: 0 auto;
margin-top: 20px;
padding: 30px;
border-radius: 10px;
}

#wrapSimulation h2 {
background: url("../img/service/simulation_icon.png") no-repeat top center;
background-size: 32px;
font-size: 1.5rem;
color: #00AEC4;
margin-bottom: 30px;
padding-top: 40px;
line-height: 1.5;
}

#wrapSimulation h2 u {
position: relative;
text-decoration: none;
}

#wrapSimulation h2 u::before {
position: absolute;
background-color: #00AEC4;
width: 18px;
height: 2px;
content: "";
transform: rotate(65deg);
left: -20px;
top: 13px;
}

#wrapSimulation h2 u::after {
position: absolute;
background-color: #00AEC4;
width: 18px;
height: 2px;
content: "";
transform: rotate(-65deg);
right: -20px;
top: 12px;
}

#wrapSimulation h2 span {
font-size: 2.2rem;
display: block;
color: var(--themeColor);
}

.wrapSimulationS {
width: 100%;
text-align: left;
margin: 0 auto;
line-height: 1.5;
}

#wrapSimulation p {
margin-bottom: 10px;
}

.selectSimulation {
background-color: #fff;
font-family: var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.4rem;
color: var(--themeColor);
margin-bottom: 20px;
padding: 0 10px;
border: 2px solid var(--themeColor);
}

.inputSimulation {
background-color: #fff;
font-family:  var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.4rem;
padding: 0 10px;
}

.btnEasySimulation {
background-color: #00477A;
font-family: var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.5rem;
font-weight: 700;
color: #fff;
text-align: center;
margin: 10px auto;
margin-top: 30px;
padding-bottom: 2px;
cursor: pointer;
border: 1px solid #00477A;
border-radius: 5px;
transition: .3s;
}

#simulationArrow {
width: 44px;
margin: 0 auto;
}

#simulationResult {
position: relative;
background-color: #EDF3F7;
width: 100%;
font-size: 1.8rem;
font-weight: 700;
padding: 50px 30px 30px;
border-radius: 5px;
}

#simulationResult::before {
position: absolute;
width: 0;
height: 0;
border-left: 60px solid transparent;
border-right: 60px solid transparent;
border-top: 30px solid #fff;
content: "";
margin: auto;
z-index: 1;
left: 0;
right: 0;
top: 0;
}

.result-yen {
display: inline;
}

.yen-num {
display: inline;
line-height: 1.5;
}

.yen-num span {
position: relative;
font-size: 3rem;
color: #E85555;
top: 2px;
}

#simulationBottom {
position: relative;
width: 88%;
margin: 0 auto;
margin-bottom: 30px;
padding-top: 30px;
}

#simulationBottom::before {
position: absolute;
width: 0;
height: 0;
border-left: 80px solid transparent;
border-right: 80px solid transparent;
border-top: 40px solid #fff;
content: "";
margin: auto;
z-index: 1;
left: 0;
right: 0;
top: 0;
}

#simulationBottom .inner {
background: url("../img/service/img14.png") no-repeat bottom right;
background-size: 60px;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
text-align: left;
margin: 0 auto;
padding: 30px 0 10px;
}

#simulationBottomTxt {
width: 100%;
font-size: 1.1rem;
font-weight: 400;
text-align: justify;
margin-top: 20px;
}

#simulationBottomTxt dt {
float: left;
}

#simulationBottomTxt dd {
padding: 0 0 0 16px;
}

#feeReduction {
background: url("../img/service/simulation_icon2.png") no-repeat left 7px;
background-size: 30px;
padding-left: 36px;
padding-top: 10px;
}

.btnQuotationW {
position: relative;
background-color: #E85555;
font-family: var(--font-primary);
width: 100%;
height: 60px;
font-size: 1.6rem;
font-weight: 700;
text-align: left;
color: #fff;
padding: 0 20px;
cursor: pointer;
border: 1px solid #E85555;
border-radius: 8px;
transition: .3s;
}

.btnQuotationW::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 20px;
top: 0;
bottom: 0;
transition: .5s;
}

.commonSubTitle {
font-size: 1.7rem;
font-weight: 700;
margin-top: -30px;
margin-bottom: 15px;
}

.serviceCoverage {
background-color: #fff;
width: 100%;
margin: 30px 0 0;
border-radius: 10px;
}

.serviceCoverage h4 {
font-size: 1.7rem;
font-weight: 700;
color: #fff;
padding: 15px 20px;
text-align: center;
border-radius: 10px 10px 0 0;
}

.greenBg {
background-color: #80CE4A;
}

.purpleBg {
background-color: #947DD9;
}

.serviceCoverageFlex {
width: 100%;
padding: 26px 10px 10px 30px;
display: flex;
justify-content: space-between;
align-items: center;
}

.serviceCoverageImg {
width: 48%;
text-align: center;
}

.serviceCoverageImg img {
width: 100%;
margin: 0 auto;
}

.serviceCoverageTxt {
width: 45%;
text-align: left;
}

.serviceCoverageTxt h5 {
font-weight: 700;
}

.serviceCoverageTxt p {
margin-bottom: 20px;
}

.green {
color: #80CE4A;
}

.purple {
color: #947DD9;
}

#structure {
margin: 30px 0 0;
}

.serviceFlow {
background-color: #fff;
width: 100%;
margin-bottom: 20px;
border-radius: 10px;
line-height: 1.6;
}

.serviceFlowTitle {
position: relative;
background-color: #00477A;
color: #fff;
font-weight: 700;
padding: 18px;
border-radius: 10px 10px 0 0;
}

.serviceFlowTitle04 {
background-color: #F7C200;
color: #00477A;
font-weight: 700;
padding: 18px;
border-radius: 10px 10px 0 0;
}

.serviceFlowTitle .number,
.serviceFlowTitle04 .number {
background-color: #fff;
width: 50px;
height: 24px;
font-size: 1.4rem;
color: #00477A;
margin: 0 auto;
margin-bottom: 12px;
}

.serviceFlowTitle h3,
.serviceFlowTitle04 h3 {
font-size: 1.6rem;
line-height: 1;
}

.serviceFlowImg {
width: 100px;
height: 150px;
margin: 0 auto;
display: table;
}

.serviceFlowImg .inner {
display: table-cell;
vertical-align: middle;
}

.serviceFlowTxt {
text-align: justify;
padding: 20px;
}

.serviceFlowTxt dl {
font-size: 1.2rem;
margin-top: 8px;
line-height: 1.5;
}

.serviceFlowTxt dt {
float: left;
}

.serviceFlowTxt dd {
padding: 0 0 0 12px;
}

.faqWrap {
background-color: #fff;
text-align: justify;
margin-bottom: 20px;
padding: 20px 26px 24px 16px;
border-radius: 10px;
}

.faqWrap:last-child {
margin-bottom: 10px;
}

.faqFlex {
display: flex;
justify-content: space-between;
align-items: center;
}

.qL {
width: 10%;
font-size: 2.2rem;
font-weight: 700;
text-align: center;
color: #00477A;
padding-left: 5px;
}

.qR {
width: 86%;
font-weight: 700;
padding-right: 10px;
}

.faqLine {
margin: 15px auto;
margin-bottom: 20px;
border-bottom: 1px solid #e5e5e5;
}

.aL {
width: 10%;
font-size: 2.2rem;
font-weight: 700;
text-align: center;
color: #00AEC4;
padding-left: 5px;
}

.aR {
width: 86%;
padding-right: 10px;
}

#termsAndConditions {
margin-top: -30px;
margin-bottom: 10px;
}

/*carbon*/

.carbonImg {
width: 100%;
margin: 20px 0;
}

.carbonTxt {
width: 100%;
margin: 20px 0;
}

.carbonTxt p {
margin-bottom: 30px;
}

.carbonTitle {
font-size: 1.7rem;
font-weight: 700;
margin-bottom: 20px;
}

.carbonCircle {
background-color: #f6f6f6;
width: 150px;
height: 150px;
font-weight: 700;
margin: 0 auto;
border-radius: 150px;
line-height: 148px;
}

.carbonCircle:nth-of-type(2),
.carbonCircle:nth-of-type(3) {
margin: 0 auto;
margin-top: -30px;
}

.carbonArrow {
width: 0;
height: 0;
margin: 0 auto;
margin-top: 20px;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-top: 30px solid #d9d9d9;
}

.carbon {
background-color: #F0F7FC;
width: 100%;
height: 109px;
font-weight: 700;
margin-top: 20px;
line-height: 107px;
}

.carbonImgWrap {
width: 100%;
margin: 30px auto;
}

.carbonThree {
width: 100%;
text-align: justify;
}

.carbonThree h4 {
font-size: 1.7rem;
font-weight: 700;
margin: 15px auto;
}

.carbonThree span {
font-weight: 700;
color: #00AEC4;
}

.moreover {
position: relative;
background-color: #FDEBEB;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
text-align: center;
margin: 0 auto;
padding: 20px 14px 24px;
line-height: 2;
border-radius: 5px;
}

.moreover::after {
position: absolute;
width: 0;
height: 0;
content: "";
border-left: 18px solid transparent;
border-right: 18px solid transparent;
border-top: 18px solid #FDEBEB;
margin: auto;
left: 0;
right: 0;
bottom: -18px;
}

.moreover span {
font-size: 1.8rem;
}

.moreover .dotTxt {
padding-top: .3em;
background-position: top left -2px;
background-repeat: repeat-x;
background-size: 1.04em .3em;
background-image: radial-gradient(.10em .10em at center center,#002133,#002133 100%,transparent);
}

.assignmentWrap {
position: relative;
background-color: #fff;
text-align: center;
margin-top: 50px;
border-radius: 5px;
}

.assignmentWrap:last-child {
margin-bottom: 40px;
}

.assignmentCircle {
position: absolute;
background-color: #002133;
width: 70px;
height: 70px;
font-size: 1.5rem;
font-weight: 700;
color: #fff;
padding-top: 13px;
border-radius: 70px;
margin: auto;
line-height: 1.1;
left: 0;
right: 0;
top: -35px;
}

.assignmentCircle span {
font-size: 2.4rem;
display: block;
}

.assignmentWrap h3 {
background-color: #95979E;
font-size: 1.8rem;
font-weight: 700;
color: #fff;
text-align: center;
padding: 40px 20px 20px;
border-radius: 5px 5px 0 0;
line-height: 1.5;
}

.assignmentWrap .inner {
width: 100%;
text-align: justify;
margin:  0 auto;
padding: 30px;
}

.assignmentSolution {
background-color: #F0F7FC;
width: 100%;
font-weight: 700;
text-align: center;
margin: 0 auto;
margin-bottom: 20px;
padding: 20px 10px;
border-radius: 5px;
}

.assignmentSolution span {
display: block;
}

.assignmentWrap h4 {
font-size: 1.6rem;
font-weight: 700;
text-align: center;
margin-bottom: 15px;
}

#decarbonizationTxt {
text-align: center;
margin: 30px auto;
margin-top: -20px;
}

.decarbonization {
background-color: #fff;
width: 100%;
margin-bottom: 20px;
}

.decarbonization h3 {
background-color: #00477A;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
text-align: center;
color: #fff;
padding: 15px 20px;
line-height: 1.5;
}

.decarbonization .inner {
padding: 22px 26px;
}

.decarbonizationImgL {
width: 70%;
text-align: center;
margin: 0 auto;
}

.decarbonizationImgR {
width: 70%;
text-align: center;
margin: 0 auto;
}

.solutionL {
background-color: #95979E;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
color: #fff;
text-align: center;
padding: 50px 30px;
}

.solutionL h3 {
background-color: #002133;
width: 82px;
height: 72px;
margin: 0 auto;
margin-bottom: 10px;
padding-top: 12px;
line-height: 1.2;
}

.solutionL span {
font-size: 2.2rem;
display: block;
}

.solutionR {
background-color: #fff;
width: 100%;
margin-bottom: 30px;
padding: 30px;
}

.solutionFlex {
margin-bottom: 10px;
}

.solutionR .solutionTitle {
background-color: #F0F7FC;
font-weight: 700;
color: #00477A; 
text-align: center;
margin: 0 auto;
display: table;
padding: 5px 10px;
border-radius: 5px;
}

.solutionR h4 {
font-weight: 700;
color: #00477A; 
text-align: center;
margin: 0 auto;
display: block;
padding: 5px 10px;
}

.solutionLast {
margin-bottom: 30px;
}

#planL2 {
width: 100%;
text-align: justify;
margin: 30px 0 0;
}

#planR2 {
width: 100%;
margin: 30px 0 0;
}

#planR h4,
#planR2 h4 {
font-weight: 700;
display: table;
border-bottom: 2px solid var(--themeColor);
line-height: 1.5;
}

.lowcostImg {
text-align: center;
margin-bottom: 40px;
}

.btnCarbon {
font-family: var(--font-primary);
width: 88%;
margin: 0 auto;
margin-top: -30px;
}

/*case_study*/

.wrapAllWh {
background-color: #fff;
width: 100%;
margin-bottom: 80px;
padding-bottom: 40px;
}

.searchWrap {
margin: 0 auto;
margin-top: 20px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}

.searchWrap li {
width: 49%;
font-size: 1.3rem;
text-align: center;
margin-bottom: 5px;
display: table;
border: 1px solid #00477A;
line-height: 1;
transition: .3s;
}

.searchWrap li a {
display: block;
padding: 5px 10px 7px 10px;
}

.searchWrap li a:hover {
text-decoration: none;
}

.searchBtn {
width: 202px;
margin: 0 auto;
}

.searchWrap label {
display: block;
}

.searchBtn {
width: 100%;
margin: 0 auto;
}

#wrapCaseStudy {
position: relative;
width: 88%;
text-align: justify;
margin: 0 auto;
}

#wrapCaseStudy .subTitle {
margin-bottom: 30px;
left: 0;
}

.caseStudy,
.usefulCo {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}

.caseStudy li,
.usefulCo li {
background-color: #fff;
width: 100%;
text-align: justify;
margin: 0 auto;
margin-bottom: 20px;
border-radius: 8px;
}

.caseStudy li:nth-of-type(3n) {
margin-right: 0;
}

.caseStudy li a:hover,
.usefulCo li a:hover {
text-decoration: none;
}

.caseStudy li a .caseStudyPhoto,
.usefulCo li a .usefulCoPhoto {
width: 100%;
height: 210px;
overflow: hidden;
border-radius: 8px 8px 0 0;
}

.caseStudy li a .caseStudyPhoto img,
.usefulCo li a .usefulCoPhoto img {
width: 100%;
height: 210px;
object-fit: cover;
transition: .3s ease-in-out;
}

.caseStudy li .caseStudyLogo {
width: auto;
height: 40px;
margin: 24px 0 18px;
padding: 0 25px;
transition: .3s ease-in-out;
}

.caseStudy li .caseStudyLogo img {
width: auto;
height: 100%;
}

.caseStudy li .caseStudyTitle,
.usefulCo li .usefulCoTitle {
font-weight: 700;
margin: 20px 0 0;
padding: 0 25px;
transition: .3s ease-in-out;
}

.caseStudy li .caseStudyCompany {
margin: 17px 0 20px;
padding: 0 25px;
transition: .3s ease-in-out;
}

.usefulCo li .usefulCoDate {
font-size: 1.2rem;
color: #95979E;
margin: 8px 0 12px;
padding: 0 25px;
transition: .3s ease-in-out;
}

.caseStudy li .caseStudyTagFlex,
.usefulCo li .usefulCoTagFlex {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
transition: .3s ease-in-out;
padding: 0 25px 25px;
}

.caseStudyTag,
.usefulCoTag {
font-size: 1rem;
margin: 0 5px 5px 0;
padding: 3px 10px 5px 10px;
display: table;
border: 1px solid #00477A;
line-height: 1;
}

.caseStudyPn {
clear: both;
}

.caseStudyPn .wp-pagenavi {
width: 100%;
text-align: center;
margin: 30px auto;
}

.caseStudyPn .wp-pagenavi a {
color: #00477A;
}

.caseStudyPn .wp-pagenavi a, .wp-pagenavi span {
width: 36px;
height: 36px;
font-size: 1.2rem;
font-weight: 600;
text-decoration: none;
margin: 0 3px;
display: inline-block;
border: 1px solid #00477A;
border-radius: 8px;
line-height: 28px;
}

.caseStudyPn .wp-pagenavi .previouspostslink,
.caseStudyPn .wp-pagenavi .nextpostslink {
position: relative;
text-indent: -10000px;
border: 0 !important;
}

.caseStudyPn .wp-pagenavi .previouspostslink::before,
.caseStudyPn .wp-pagenavi .nextpostslink::before {
position: absolute;
width: 16px;
height: 16px;
content: "";
border-top: solid 2.5px #00477A;
border-right: solid 2.5px #00477A;
margin: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
}

.caseStudyPn .wp-pagenavi .previouspostslink::before {
transform: rotate(-135deg);
left: 10px;
}

.caseStudyPn .wp-pagenavi .nextpostslink::before {
transform: rotate(45deg);
right: 10px;
}

.caseStudyPn .wp-pagenavi a:hover.previouspostslink,
.caseStudyPn .wp-pagenavi a:hover.nextpostslink {
background-color: transparent;
}

.caseStudyPn .wp-pagenavi .pages,
.caseStudyPn .wp-pagenavi .first,
.caseStudyPn .wp-pagenavi .last {
display: none;
}

#wrapPost {
position: relative;
width: 88%;
text-align: justify;
margin: 0 auto;
}

#wrapPost #postTitle {
font-size: 2rem;
font-weight: 700;
line-height: 1.5;
}

.caseStudyCompanyCo {
font-size: 1.6rem;
font-weight: 700;
margin: 30px auto;
}

.caseStudyTagFlexCo {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}

.caseStudyTagFlexCo .caseStudyTag {
font-size: 1.2rem;
margin: 0 5px 5px 0;
border: 1px solid #00477A;
line-height: 1;
}

.caseStudyTagFlexCo .caseStudyTag a {
display: block;
padding: 2px 1px 2px 1px;
transition: .3s;
}

.caseStudyTagFlexCo .caseStudyTag a:hover {
text-decoration: none;
}

#wrapPostWh {
background-color: #fff;
margin: 40px auto;
margin-bottom: 40px;
border-radius: 10px 10px 0 0;
}

.caseStudyPhotoCo {
width: 100%;
height: auto;
overflow: hidden;
border-radius: 10px 10px 0 0;
}

.caseStudyPhotoCo img {
width: 100%;
height: auto;
object-fit: cover;
}

.caseStudyPhotoCo .movieVideo {
width: 100%;
height: auto;
object-fit: cover;
}

.caseStudyPhotoCo .playBtn {
display: none;
}

#wrapPostWh .inner {
width: 100%;
padding: 26px;
}

.postGrayWrap {
background-color: #f6f6f6;
margin: 0 auto;
margin-bottom: 30px;
padding: 26px;
border-radius: 8px;
}

.caseStudyBlue {
background-color: #EDF3F7;
margin-bottom: 30px;
padding: 26px;
border-radius: 8px;
}

.caseStudyBlueL,
.caseStudyBlueR {
width: 100%;
}

.caseStudyBlueTitle {
position: relative;
font-size: 1.8rem !important;
font-weight: 700 !important;
margin: 0 0 15px !important;;
padding-left: 24px !important;
line-height: 1 !important;
border: 0 !important;
}

.caseStudyBlueTitle::before {
position: absolute;
background-color: #00477A;
width: 16px;
height: 3px;
content: "";
margin: auto;
border-radius: 10px;
left: 0;
top: 0;
bottom: 0;
}

.reductionLCo,
.reductionRCo {
width: 100%;
font-weight: 700;
text-align: center;
margin-top: 15px;
padding: 15px 20px 15px 36px;
border-radius: 5px;
line-height: 1.3;
}

.reductionLCo {
background: #fff url("../img/case_study_ele.png") no-repeat 10% center;
background-size: 40px;
}

.reductionRCo {
background: #fff url("../img/case_study_co2.png") no-repeat 10% center;
background-size: 40px;
}

.reductionLCo span,
.reductionRCo span {
position: relative;
font-size: 2.8rem;
color: #00AEC4;
display: block;
margin-left: 8px;
}

.reductionLCo i,
.reductionRCo i {
font-size: 1.8rem;
}

#wrapPostWh .inner h2,
#wrapPostWhL .inner h2 {
font-size: 2rem;
font-weight: 700;
margin: 40px 0 30px;
padding-bottom: 15px;
border-bottom: 3px solid #00477A;
line-height: 1.5;
}

.postInterview,
.postInterviewWide {
position: relative;
background-color: #f6f6f6;
width: 100%;
margin-bottom: 30px;
padding: 26px;
border-radius: 5px;
}

.postInterview::after {
position: absolute;
content: "";
width: 0;
height: 0;
border-top: 15px solid #f6f6f6;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
margin: auto;
left: 0;
right: 0;
bottom: -15px;
}

.postInterviewPhoto {
width: 110px;
font-size: 1.2rem;
font-weight: 700;
text-align: center;
margin: 0 auto;
margin-bottom: 30px;
}

.postInterviewPhoto img {
width: 100%;
height: 110px;
object-fit: cover;
margin-bottom: 10px;
border-radius: 150px;
}

#wrapPostWh .inner h3,
#wrapPostWhL .inner h3 {
font-size: 1.6rem;
font-weight: 700;
margin: 40px 0 30px;
padding: 0 0 5px 15px;
border-left: 3px solid #00477A;
line-height: 1.5;
}

.postCompanyWrap {
background-color: #f6f6f6;
margin: 60px auto;
padding: 26px;
border-radius: 8px;
}

.postCompanyWrap .postCompanyL {
background-color: #fff;
width: 100%;
margin-bottom: 30px;
padding: 20px;
border-radius: 8px;
}

.postCompanyWrap .postCompanyR {
width: 100%;
}

.postCompanyWrap .postCompanyR h4 {
font-size: 1.6rem;
font-weight: 700;
margin-bottom: 20px;
line-height: 1;
}

.postCompanyWrap .postCompanyR dt {
float: left;
font-weight: 700;
}

.postCompanyWrap .postCompanyR dd {
padding: 0 0 0 70px;
}

#freeDownloadWrap {
font-weight: 700;
color: #E85555;
text-align: center;
}

.btnFreeDownload {
position: relative;
background-color: #E85555;
font-family: var(--font-primary);
width: 100%;
height: 56px;
font-size: 1.5rem;
font-weight: 700;
text-align: center;
color: #fff;
margin: 10px 0 20px;
cursor: pointer;
border: 1px solid #E85555;
border-radius: 10px;
transition: .3s;
}

#relatedStoriesBtn {
width: 100%;
margin: 0 auto;
margin-top: -20px;
}

#postCtaWrap {
width: 88%;
margin: 0 auto;
margin-bottom: 40px;
}

#postCtaWrap h4 {
font-weight: 700;
}

.btnContact {
position: relative;
background-color: #e8546a;
font-family: var(--font-primary);
width: 100%;
height: 60px;
font-size: 1.8rem;
font-weight: 700;
text-align: left;
color: #fff;
margin-top: 20px;
padding: 0 30px;
cursor: pointer;
border: 1px solid #e8546a;
border-radius: 8px;
transition: .3s;
overflow: hidden;
}

.btnContact span {
position: relative;
z-index: 3;
}

.btnContact::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 30px;
top: 0;
bottom: 0;
transition: .5s;
z-index: 3;
}

/*useful_content*/

#wrapPostW {
position: relative;
width: 88%;
text-align: justify;
margin: 0 auto;
}

#wrapPostWL {
width: 100%;
}

.usefulPostDate {
color: #95979E;
margin-top: 10px;
}

#wrapPostW #postTitle {
font-size: 2rem;
font-weight: 700;
margin-bottom: 20px;
line-height: 1.5;
}

#wrapPostWhL {
background-color: #fff;
margin: 40px auto;
margin-bottom: 60px;
}

#wrapPostWhL .inner {
width: 100%;
padding: 26px 26px 5px;
}

#toc_container {
background-color: #f6f6f6;
margin: 0 auto;
margin-bottom: 30px;
padding: 26px;
border-radius: 8px;
}

#toc_container ul {
list-style: none !important;
}

.toc_title {
font-size: 1.8rem;
font-weight: 700;
text-align: center;
line-height: 1;
}

.toc_list {
border-bottom: 1px solid #ddd;
}

.toc_list li {
padding: 12px 0;
border-top: 1px solid #ddd;
}

.toc_list li a {
transition: .3s;
}

.toc_list li a:hover {
text-decoration: none;
}

.toc_list ul {
padding-top: 12px;
}

.toc_list ul li {
position: relative;
padding: 12px 0 12px 18px;
border-top: 1px solid #ddd;
}

.toc_list ul li a::before {
position: absolute;
background-color: #00477A;
width: 9px;
height: 2px;
content: "";
margin: auto;
left: 0;
top: 0;
bottom: 0;
}

.toc_list ul li:last-child {
padding: 12px 0 0 18px;
}

.toc_list ul li:last-child a::before {
left: 0;
top: 12px;
bottom: 0;
}

.wp-block-list li {
list-style: none;
display: flex;
align-items: baseline;
}
 
.wp-block-list li::before {
content: "・";
list-style: disc;
margin: 0 6px 0 0;
}

.btnSimulationCo {
position: relative;
background-color: #E85555;
font-family: var(--font-primary);
color: #fff;
margin-top: 10px;
border: 1px solid #E85555;
}

.btnSimulationCo::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}

#wrapPostWR {
width: 100%;
}

#wrapPostWR h4 {
font-size: 2.2rem;
font-weight: 700;
margin: 10px 0 30px;
padding: 0 0 5px 15px;
border-left: 3px solid #00477A;
line-height: 1.5;
}

.sidePickUp li {
background-color: #fff;
width: 100%;
text-align: justify;
margin-bottom: 30px;
padding-bottom: 20px;
border-radius: 8px 8px 0 0;
}

.sidePickUp a:hover {
text-decoration: none;
}

.sidePickUpPhoto {
width: 100%;
height: 210px;
overflow: hidden;
border-radius: 8px 8px 0 0;
}

.sidePickUpPhoto img {
width: 100%;
height: 210px;
object-fit: cover;
transition: .3s ease-in-out;
}

.sidePickUp li .sidePickUpTitle {
margin: 18px 0 0;
padding: 0 20px;
transition: .3s ease-in-out;
}

.sidePickUp li .sidePickUpDate {
font-size: 1.4rem;
color: #95979E;
margin: 8px 0 0;
padding: 0 20px;
transition: .3s ease-in-out;
}

.shareWrap {
width: 100%;
font-size: 1.2rem;
font-weight: 700;
text-align: center;
margin: 40px auto;
}

.btnSns {
background-color: #00477A;
font-family: var(--font-primary);
width: 100%;
height: 48px;
margin-top: 15px;
border-radius: 5px;
}

.btnSns a {
font-size: 1.4rem;
color: #fff;
display: block;
line-height: 46px;
}

.btnSns a:hover {
text-decoration: none;
}

.btnSns a i {
position: relative;
font-size: 2.4rem;
margin-right: 10px;
top: 3px;
}

.postAuthor {
font-size: 1.8rem;
font-weight: 700;
margin-bottom: 25px;
line-height: 1;
}

.authorPhoto {
width: 115px;
margin: 0 auto;
margin-bottom: 15px;
}

.authorPhoto img {
width: 100%;
height: 136px;
object-fit: cover;
border-radius: 10px;
}

.author {
width: 100%;
}

.author h5 {
font-size: 1.7rem;
font-weight: 700;
text-align: center;
margin-bottom: 10px;
}

/*My Page*/

#myIntoroTxt {
width: 100%;
}

#myIntoroTxt p {
margin-bottom: 0;
}

#myIntoroPhoto {
width: 100%;
margin-bottom: 30px;
}

.btnLogin {
position: relative;
background: #E85555 url("../img/btn_login.png") no-repeat 40px center;
background-size: 18.33px;
font-family:  var(--font-primary);
width: 100%;
height: 60px;
font-size: 1.6rem;
font-weight: 700;
text-align: center;
color: #fff;
margin: 0 auto;
margin-bottom: 10px;
padding: 0 0 3px 16px;
cursor: pointer;
border-radius: 5px;
border: 1px solid #E85555;;
transition: .3s;
}

#myPageImg {
position: relative;
background: url("../img/my_page/my_page_img.png") no-repeat;
background-size: 180px;
width: 180px;
height: 130px;
margin: 0 auto;
margin-top: 20px;
}

#myPageFlex {
width: 88%;
margin: 0 auto;
}

.myPageIntoro {
background-color: #fff;
width: 100%;
text-align: left;
margin-bottom: 20px;
padding: 32px 30px 35px;
border-radius: 10px;
}

.myPageIntoro .subTitle {
margin-bottom: 12px;
left: 0
}

.myPageIntoroImg {
text-align: center;
margin-top: 30px;
}

.myPageIntoroImg img {
width: auto;
height: 160px;
}

/**/

#contactTelFlex {
width: 90%;
margin: 0 auto;
margin-bottom: 60px;
}

#wrapWhContact {
position: relative;
background-color: #fff;
width: 100%;
text-align: left;
margin-bottom: 30px;
padding: 40px 35px;
border-radius: 10px;
}

#wrapWhTel {
position: relative;
background-color: #fff;
width: 100%;
text-align: left;
padding: 40px 35px;
border-radius: 10px;
}

.contactFlex {
width: 100%;
}

#contactL {
width: 100%;
margin-bottom: 20px;
}

#contactR {
width: 100%;
}

.btnContactTel {
position: relative;
background-color: #00477A;
font-family:  var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.5rem;
font-weight: 700;
text-align: left;
border-radius: 5px;
border: 1px solid #00477A;
transition: .3s;
}

.btnContactTel a {
color: #fff;
display: block;
padding: 9px 0 9px 20px;
text-decoration: none;
transition: .3s;
}

.btnContactTel::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(135deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 20px;
top: -5px;
bottom: 0;
transition: .5s;
}

.formInput {
width: 100%;
margin: 20px auto;
margin-bottom: 0;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}

.formInput p {
display: inline;
margin-bottom: 0;
}

.formInputTop {
width: 100%;
}

.formInputTop p {
display: inline;
margin-bottom: 0;
}

.formInputL {
width: 100%;
font-weight: 700;
padding: 20px 0 10px;
}

.formInputR {
width: 100%;
padding: 0 0 10px;
}

.radioService .wpcf7-radio .wpcf7-list-item {
display: block;
}

.required {
background-color: #e83838;
width: 44px;
height: 28px;
font-size: 1.2rem;
color: #fff;
text-align: center;
display: inline-block;
margin-right: 12px;
border-radius: 3px;
line-height: 26px;
}

.any {
background-color: #95979e;
width: 44px;
height: 28px;
font-size: 1.2rem;
color: #fff;
text-align: center;
display: inline-block;
margin-right: 12px;
border-radius: 3px;
line-height: 26px;
}

label {
margin-right: 10px;
}

.wpcf7-list-item {
margin-left: 0;
display: block;
}

input[type="radio"] {
position: relative;
background-color: #f6f6f6;
width: 20px;
height: 20px;
margin-right: 3px;
border: 2px solid #95979e;
border-radius: 50%;
vertical-align: -8px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

input[type="radio"]:checked {
background-color: #fff;
border: 2px solid var(--themeColor);
}

input[type="radio"]:checked:before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 10px;
height: 10px;
border-radius: 50%;
background: var(--themeColor);
content: "";
}

select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
}

.inputW,
.wpcf7-select {
background-color: #f6f6f6;
font-family:  var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.4rem;
padding: 0 15px;
border: 0;
border-radius: 3px;
}

.wpcf7-arrow {
position: relative;
}

.wpcf7-arrow::after {
content: '';
position: absolute;
border: 4px solid #666;
border-bottom: 0;
border-left-color: transparent;
border-right-color: transparent;
top: calc(50% - 7px);
right: 15px;
width: 0;
height: 0;
z-index: 1;
}

.formInputRFlex {
width: 100%;
padding: 0;
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
}

.inputS {
background-color: #f6f6f6;
font-family:  var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.4rem;
padding: 0 10px;
margin: 0 0 10px 0;
border: 0;
border-radius: 3px;
}

.inputD {
margin: -5px  10px 10px;
}

.formInputRFlex p {
width: 20%;
}

.formInputRFlex p,
.inputD p {
display: inline;
}

textarea {
background-color: #f6f6f6;
font-family:  var(--font-primary);
width: 100%;
height: 160px;
font-size: 1.4rem;
padding: 15px;
border: 0;
border-radius: 3px;
}

#contactPrivacy {
background-color: #f6f6f6;
font-family:  var(--font-primary);
width: 100%;
height: 160px;
font-size: 1.4rem;
margin-bottom: 20px;
padding: 15px;
border: 0;
border-radius: 3px;
overflow-y: auto;
}

#contactPrivacy p {
display: block;
}

#contactPrivacy dl {
margin-top: 20px;
}

#contactPrivacy dt {
float: left;
font-weight: 700;
margin-bottom: 20px;
}

#contactPrivacy dd {
margin-bottom: 20px;
padding: 0 0 0 20px;
}

input[type="checkbox"] {
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

input[type="checkbox"] {
cursor: pointer;
padding-left: 26px;
position: relative;
vertical-align: -13px;
}

input[type="checkbox"]::before,
input[type="checkbox"]::after {
content: "";
display: block; 
position: absolute;
}
input[type="checkbox"]::before {
background-color: #fff;
width: 20px;
height: 20px;
transform: translateY(-50%);
border: 2px solid var(--themeColor);
border-radius: 3px;
margin: auto;
top: 0;
bottom: 0;
left: 0;
}
input[type="checkbox"]::after {
border-bottom: 3px solid var(--themeColor);
border-left: 3px solid var(--themeColor);
opacity: 0;
height: 6px;
width: 11px;
transform: rotate(-45deg);
top: -6px;
left: 5px;
}
input[type="checkbox"]:checked::after {
opacity: 1;
}

.cf7-submit {
width: 100%;
text-align: center;
margin: 30px auto;
margin-bottom: 20px;
padding-bottom: 60px;
border-bottom: 1px solid #95979e;
}

.cf7-submit div {
position: relative;
width: 100%;
height: 48px;
margin: 0 auto;
}

.btnForm,
.btnSend,
.btnBack {
position: relative;
background-color: #00477A;
font-family:  var(--font-primary);
width: 100%;
height: 48px;
font-size: 1.5rem;
font-weight: 700;
color: #fff;
text-align: left;
margin: 0 auto;
padding: 0 0 3px 20px;
border-radius: 5px;
border: 1px solid #00477A;
cursor: pointer;
transition: .3s;
}

.btnSend {
text-align: center;
padding: 0 0 3px;
}

.btnBack {
text-align: center;
margin-bottom: 10px;
padding: 0 0 3px;
}

.cf7-submit div::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 20px;
top: 0;
bottom: 0;
transition: .5s;
z-index: 1;
}

.contactFlex .telFreedial {
background-color: #F0F7FC;
width: 100%;
font-size: 1.2rem;
padding: 20px 26px;
border-radius: 5px;
line-height: 1.3;
}

.contactFlex .telCall {
width: 100%;
font-size: 1.2rem;
padding: 20px 0 30px 10px;
line-height: 1.5;
}

.contactFlex .telFreedial h4,
.contactFlex .telCall h4 {
font-size: 1.4rem;
font-weight: 700;
}

.contactFlex .tel {
font-size: 2.8rem;
font-weight: 700;
margin-bottom: 5px;
line-height: 1.3;
}

.contactFlex .tel a {
text-decoration: none;
}

/**/

#corporate dt {
font-weight: 700;
padding: 15px 0 0;
}

#corporate dd {
position: relative;
padding: 0 0 15px;
border-bottom: 1px solid #E5E5E5;
}

#corporate dd #tes {
position: absolute;
width: 50px;
margin: auto;
right: 0;
top: -38px;
bottom: 0;
}

/**/

#wrapQuotation {
background: url("../img/quotation_bg.jpg") no-repeat center;
background-size: cover;
width: 100%;
margin-top: 60px;
padding: 60px 0;
}

#quotationInenr {
width: 78%;
margin: 0 auto;
}

#quotationInenr h2 {
position: relative;
background: url("../img/icon_title.png") no-repeat left 3px;
background-size: 15px;
font-size: 1.4rem;
font-weight: 700;
text-align: left;
margin-bottom: 10px;
padding-left: 22px;
letter-spacing: 0;
line-height: 1.5;
}

#quotationInenr h2 span {
font-size: 2.6rem;
display: block;
margin-left: -28px;
}

#quotationL {
font-weight: 700;
text-align: justify;
margin-bottom: 10px;
}

#quotationTxt span {
color: #E85555;
}

#quotationR {
width: 60%;
margin: 0 auto;
}

.btnQuotation {
position: relative;
background-color: #E85555;
font-family: var(--font-primary);
width: 310px;
height: 60px;
font-size: 1.6rem;
font-weight: 700;
text-align: left;
color: #fff;
margin-top: 30px;
padding: 0 20px;
cursor: pointer;
border: 1px solid #E85555;
border-radius: 8px;
transition: .3s;
}

.btnQuotation::after {
position: absolute;
width: 10px;
height: 10px;
content: "";
margin: auto;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
right: 20px;
top: 0;
bottom: 0;
transition: .5s;
}

.backTop {
width: 100%;
margin: 0 auto;
}

/**/

footer {
position: relative;
background-color: #002133;
width: 100%;
padding: 40px 0 130px;
}

#footerWrap {
width: 82%;
color: #fff;
margin: 0 auto;
}

#footerWrap a {
color: #fff;
margin-bottom: 10px;
text-decoration: none;
}

.footerFlex {
}

.footerL {
font-weight: 700;
text-align: left;
margin-bottom: 30px;
}

.footerL img {
width: 140px;
margin-bottom: 15px;
}

.footerR ul {
text-align: left;
margin-bottom: 30px;
}

.footerR ul li {
position: relative;
padding-bottom: 10px;
}

#footerLinksBottom {
font-size: 1.2rem;
}

#footerLinksBottom li a {
background: url("../img/icon_footer.png") no-repeat right;
background-size: 13px;
}

#footerLinksBottom li a {
padding-right: 20px;
}

#footerLine {
background-color: #fff;
width: 100%;
height: 1px;
margin: 30px auto;
}

#copyright {
font-size: 1rem;
}

#pagetop {
position: fixed;
background: #fff;
width: 46px;
height: 46px;
bottom: -60px;
right: 10px;
border-radius: 5px;
border: 1px solid #00477A;
transition: .3s;
z-index: 200;
}

#pagetop::before {
position: absolute;
width: 12px;
height: 12px;
content: "";
margin: auto;
border-top: 2px solid #00477A;
border-right: 2px solid #00477A;
transform: rotate(-45deg);
left: 0;
right: 0;
top: 0;
bottom: 0;
}

#btnCta {
position: fixed;
width: 200px;
left: 5px;
bottom: 5px;
z-index: 1000;
}

.btnCta4 {
position: fixed;
width: 260px;
left: 5px;
bottom: 5px;
z-index: 1000;
transition: 1s;
}

.btnCta4.hideCta {
transform: translateY(83px);
}

.searchandfilterWrap {
position: relative;
width: 100%;
font-size: 1.3rem;
text-align: center;
margin: 0 auto;
margin-top: -30px;
margin-bottom: 40px;
}

.toggle {
display: none;
}

.searchandfilterTitle {
position: relative;
background: #00aec4;
width: 100%;
font-size: 1.5rem;
font-weight: 700;
text-align: left;
margin: 0 auto;
padding: 15px 44px;
display: block;
color: #fff;
cursor: pointer;
border-radius: 5px 5px 0 0;
z-index: 1;
}

.searchandfilterTitle::before {
content:"";
width: 12px;
height: 12px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
-webkit-transform: rotate(45deg);
position: absolute;
top: calc( 40% - 3px );
right: 20px;
transform: rotate(135deg);
}

.searchandfilterTitle::after {
position: absolute;
font-family: 'Font Awesome 6 Free';
width: 20px;
content: "\f002";
font-weight: 900;
color: #fff;
margin: auto;
top: 16px;
left: 20px;
}

.searchandfilterTitle,
.searchContent {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
transition: all 0.3s;
}

.searchContent {
position: relative;
/*background-color: #f6f6f6;*/
background: #fff;
height: 0;
padding: 0 20px;
overflow: hidden;
border: 1px solid #ddd;
border-radius: 0 0 5px 5px;
top: -1px;
}

.toggle:checked + .searchandfilterTitle + .searchContent {
height: auto;
padding: 20px 20px 10px;
transition: all .6s;
}

.toggle:checked + .searchandfilterTitle::before {
transform: rotate(-45deg) !important;
top: calc( 48% - 3px );
}

.searchandfilterWrap h4 {
font-size: 1.6m;
text-align: left;
font-weight: 700;
margin-bottom: 10px;
}

.searchandfilterWrap ul {
margin-bottom: 20px;
}

.searchandfilterWrap ul li {
text-align: left;
}

.searchandfilterWrap ul li ul li {
text-align: left;
margin-bottom: 10px;
}

.searchandfilterWrap ul li ul li:first-of-type {
display: none;
}

.searchandfilterWrap input[type="submit"] {
position: relative;
background-color: #00aec4;
font-family:  var(--font-primary);
width: 200px !important;
height: 60px;
font-size: 1.5rem;
font-weight: 600;
text-align: center;
color: #fff;
margin: 0 auto !important;
margin-top: -10px;
padding-bottom: 3px;
cursor: pointer;
border: 1px solid #00aec4;
border-radius: 5px;
}

/*

.searchandfilterWrapFlex {
position: relative;
width: 300px;
margin: 0 auto;
margin-top: -20px;
margin-bottom: 40px;
}

.searchandfilterWrap {
position: relative;
width: 300px;
margin: 0 auto;
margin-bottom: 20px;
}

.searchandfilter ul::before {
position: absolute;
content: "";
background: #00aec4;
height: calc(tan(15deg) * 60px / 2);
width: 15px;
margin: auto;
clip-path: polygon(0 0, 100% 0, 50% 100%);
top: 20px;
right: 20px;
}

.searchandfilter ul select {
background-color: #fff;
font-family:  var(--font-primary);
width: 300px;
height: 50px;
font-size: 1.4rem;
color: var(--themeColor) !important;
padding: 0 20px 2px;
border: 1px solid #00aec4;
border-radius: 5px 5px 0 0;
}

.searchandfilter input[type="submit"] {
position: relative;
background-color: #00aec4;
font-family:  var(--font-primary);
width: 300px;
height: 50px;
font-size: 1.4rem;
font-weight: 600;
color: #fff;
padding-left: 20px;
padding-bottom: 3px;
cursor: pointer;
border: 1px solid #00aec4;
border-radius: 0 0 5px 5px;
}

.searchandfilter ul::after {
position: absolute;
font-family: 'Font Awesome 6 Free';
width: 15px;
content: "\f002";
font-weight: 900;
color: #fff;
margin: auto;
bottom: 14px;
left: -112px;
right: 0;
}

*/

.orderBox { 
display: flex;
flex-direction: column;
}

.order1 { order: 1; }
.order2 { order: 2; }
.order3 { order: 3; }
.order4 { order: 4; }
.order5 { order: 5; }

.alignright,
.alignleft,
.aligncente {
display: block;
margin: 0 auto;
margin-bottom: 30px;
}

}