@charset "utf-8";

#company{}

#company .companyNav li ul{ display:none;}
#company.message .companyNav li.messageNav ul,
#company.gaiyo .companyNav li.gaiyoNav ul,
#company.rinen .companyNav li.rinenNav ul,
#company.kyoukyu .companyNav li.kyoukyuNav ul,
#company.eigyo .companyNav li.eigyoNav ul,
#company.kankyo .companyNav li.kankyoNav ul,
#company.sds .companyNav li.kankyoNav ul,
#company.kankyo.declaration .companyNav li.declarationNav,
#company.kankyo.gas .companyNav li.gasNav,
#company.sdgs .companyNav li.sdgsNav,
#company.chiiki .companyNav li.chiikiNav{ display:block;}

#company.message #categoryNav li.messageNav,
#company.gaiyo #categoryNav li.gaiyoNav,
#company.sds #categoryNav li.sdsNav,
#company.rinen #categoryNav li.rinenNav,
#company.kyoukyu #categoryNav li.kyoukyuNav,
#company.eigyo #categoryNav li.eigyoNav,
#company.kankyo.declaration #categoryNav li.declarationNav,
#company.kankyo.gas #categoryNav li.gasNav,
#company.takusou #categoryNav li.takusouNav,
#company.sdgs #categoryNav li.sdgsNav,
#company.chiiki #categoryNav li.chiikiNav,
#company.promise #categoryNav li.promiseNav{ background:rgba(242,246,251,1);}

#company.kankyo nav#categoryNav ul li.kankyoNav:hover{ background:rgba(242,246,251,0);}


@media screen and (max-width: 767px) {
#company{}
}

/*message*/
#company .sign{ font-weight:500;}
#company .sign span{ display:block; font-weight:500; }
#company .sign span span{ display:block; font-size:1.3rem; margin-top:1em;}
#company .sign img{ width:200px; height:auto;}

#company .message-main{ position:relative; background:#E2E1E8; margin-bottom:30px;}
#company .message-main .mainImg{ width:350px; height:auto; margin-left:350px;}
#company .message-main h2{ position:absolute; left:100px; top:50px; font-size:20px; font-weight:bold; text-align:left; line-height:2em;
background:none; color:#000; padding:0; letter-spacing:0.05em;
}
@media screen and (max-width: 767px) {
#company .message-main{ position:relative; background:#d4d9ed; margin-bottom:30px;}
#company .message-main .mainImg{ width:100%; height:auto; margin-left:0;}
#company .message-main h2{ position:relative; left:auto; top:auto; font-size:18px; font-weight:bold; text-align:left; line-height:1.6em; display:block; margin:0 30px; text-align:center;background:none; color:#000; padding:0; letter-spacing:0.05em; padding-top:30px;
}
}

/*promise*/
#company .promise-main {position:relative;margin: 10% 0;}
#company .promise-main img { width:80%;margin:0 auto;display:block;}
@media screen and (max-width: 767px) {
	#company .promise-main .mainImg2 { width:33.3%;margin:0 5% 4em 5%;display:block;}
	#company .promise-main .mainImg3 {width:33.3%;margin: 15% 5% 4em 61.7%;display: block;}
	#company .promise-main p {margin:0 5% 2em;display:block;line-height: 2;}
}

/*gaiyo*/
#company.rinen .olList{ display:inline-block; text-align:left;}
#company.rinen .olList li{ text-align:left; margin-bottom:1em;}
#company.rinen #mark{ width:100px; height:auto;}

/*kyoukyu*/
#company.kyoukyu {}

/*eigyo*/
#company.eigyo #contents .telArea{ background:#fff; border:1px solid #E89213; box-sizing:border-box;}
#company.eigyo #contents .telNumberWrap{ width:38%; display:block; padding:20px; box-sizing:border-box;}
#company.eigyo #contents .telArea .telNum{ display: block; font-family: 'Open Sans', sans-serif; font-weight: 700; line-height:1em; color: #E79213;font-size: 25px; letter-spacing: 0em; position:relative; padding-left:60px; }
#company.eigyo #contents .telArea .telNum:before{ content:"TEL"; position:absolute; left:0; top:0;     line-height: 1.2em; width:50px; padding:5px 0; text-align:center; color:#fff; background:#E79213; font-size:13px; letter-spacing:0.1em;}
#company.eigyo #contents .emergencyWrap{  width:62%; display:block; padding:20px; box-sizing:border-box; background:#FDF4E7; border-left:1px solid #E89213; position:relative; padding-left:115px;}
#company.eigyo #contents .emergencyWrap h5{ display:inline-block; position:absolute; left:20px; top:20px; font-size:0.8rem; margin-bottom: 0;}
#company.eigyo #contents .emergencyWrap h5:before{ content:""; width:50px; height:50px; display:block; box-sizing:border-box; position:absolute; left:-5px; top:0.3em; font-size:0.8rem;}
#company.eigyo #contents .emergencyWrap h5 span{ color:#F82D00; display:block; margin-left:0; font-size:0.8rem; position:relative;}


#company.eigyo #contents .emergencyWrap .gasTel{ font-size:0.8rem; color:#000000;}
#company.eigyo #contents .box.light{ padding:10px 15px; }
.eigyoWrap .w460{ margin-bottom:20px;}


@media screen and (max-width: 767px) {
#company.eigyo #contents .telNumberWrap{ width:auto; float:none; padding:10px;}
#company.eigyo #contents .emergencyWrap{  width:auto; border-left:none; border-top:1px solid #E89213; padding:10px; float:none; display:block;}
#company.eigyo #contents .emergencyWrap h5{ display:block; position:relative; left:0; top:0; font-size:0.8rem;}
#company.eigyo #contents .emergencyWrap h5 br{ display:none;}
.eigyoWrap .w460{ margin-bottom:10px;}
.eigyoWrap .w220{ margin-bottom:20px;}
}

#company.takusou .figure{display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify;	justify-content: flex-start; }
#company.takusou .figure .column-figure{ width:210px; margin-right:35px; text-align:center; padding:15px 0; box-sizing:border-box; border:1px solid #F7575B; position:relative;}
#company.takusou .figure .column-figure h5{ display:block; margin-bottom:0.5em; text-align:center; color:#F7575B; }

#company.takusou .figure .column-figure:nth-child(1){ background:#F7575B; color:#FFFFFF;}
#company.takusou .figure .column-figure:nth-child(1) h5{ color:#FFFFFF;}


#company.takusou .figure .column-figure:last-child{ margin-right:0;}

#company.takusou .figure .column-figure:nth-child(1):after{ content:""; width:20px; height:20px; background:url(../company/img/takuken_f1.png) no-repeat; position:absolute; right:-28px; top:50px;}
#company.takusou .figure .column-figure:nth-child(2):after{ content:""; width:20px; height:20px; background:url(../company/img/takuken_f2.png) no-repeat;  position:absolute; right:-28px; top:50px;}


@media screen and (max-width: 767px) {
	#company.takusou .figure .column-figure{ width:100%; margin-right:0; margin-bottom:40px; text-align:center; padding:15px 0; box-sizing:border-box; border:1px solid #F7575B; position:relative;}
	#company.takusou .figure .column-figure:nth-child(2){ width:45%; margin-right:10%; margin-bottom:20px; }
	#company.takusou .figure .column-figure:nth-child(3){ width:45%; margin-bottom:20px;}
	
	#company.takusou .figure .column-figure:nth-child(1):after{ content:""; width:10px; height:10px; background:url(../company/img/takuken_f1.png) no-repeat; position:absolute; right:50%; top:auto; bottom:-30px; background-size:10px; transform:rotate(90deg)  translateX(-5px); -webkit-transform: rotate(90deg) translateX(-5px);}
	#company.takusou .figure .column-figure:nth-child(2):after{ content:""; width:10px; height:10px; background:url(../company/img/takuken_f2.png) no-repeat;  position:absolute; right:-21px; top:50px; background-size:10px;}
}

/*------------------------------------------
クリア
-------------------------------------------*/
/*
.formList,.step{ zoom:1;/*for IE 5.5-7*/ 
.formList:after,.step:after{content:""; display: block; height:0; clear: both; visibility: hidden; font-size: 0;}



.promise_wrap img {
    max-width: 100%;
}

.promise_area {
    position: relative;
	padding-bottom: 5%;
}

.promise_img01 {
       padding-top: 8%;
    position: relative;
    z-index: 2;
}
.promise_img02 {
    margin-top: -3%;
    position: relative;
    z-index: 0;
}
.promise_img03 {
    padding-top: 6%;
    width: 80%;
}
.promise_area figure.align_center {
    text-align: center;
}

.youtube_area{
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.youtube_area iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}


#contents .promise_title {
display: flex;
align-items: center;
    margin-bottom: 30px;
    font-weight: bold;
    text-align: left;
    background: inherit;
    color: #000;
    padding: 15px 0;
    line-height: 1.6em;
}
.promise_title:before,
.promise_title:after {
border-top: 1px solid;
content: "";
flex-grow: 1;
}
.promise_title:before {
margin-right: 1rem;
}
.promise_title:after {
margin-left: 1rem;
}



@media screen and (max-width: 767px) {
	.promise_img01 {
    width: 60%;
}
	.promise_img03 {
		padding:0 30px;
}
}
.layout_L {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    justify-content: space-between;
	margin-top: 60px;
    margin-bottom: 60px;
}
.layout_L .text_wrap {
    width: 60%;
    text-align: left;
}
.layout_L .img_wrap {
		width: calc(100% - 70%);
    width: -ms-calc(100% - 70%);
    width: -webkit-calc(100% - 70%);
    position: relative;
    overflow: hidden;
}
.flex_box {
    display: -webkit-flex!important;
    display: flex!important;
    -webkit-flex-wrap: wrap!important;
    flex-wrap: wrap!important;
    -webkit-box-pack: justify;
}
.flex_between {
    justify-content: space-between;
}
.box_column_02 .box_sizing_01 {
	width: calc(50% - 16px);
    width: -ms-calc(50% - 16px);
    width: -webkit-calc(50% - 16px);
}
.box_column_03 .box_sizing_01 {	
		width: calc(33.3% - 16px);
    width: -ms-calc(33.3% - 16px);
    width: -webkit-calc(33.3% - 16px);
}
.sdgs_box .box_column_02 .box_sizing_01 {
    margin-bottom: 32px;
}
.sdgs_box .inner {
border: 1px solid #f2f2f2;
    padding: 10% 10% 5%;
}
#contents .sdgs_box h2 {
    margin: 0;
}
.sdgs_box02 {
    margin-bottom: 60px;
}
.sdgs_box03 {
    width: 70%;
    margin: 0 auto;
}
.pdf:before {
    background: url(../img/sdgs/pdf.png);
    background-size: contain;
    background-position: 0px -2px;
    background-repeat: no-repeat;
    content: '';
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    background-clip: content-box;
    margin-right: .5em;
}
figure img{width: 100%;height: auto;}

@media screen and (max-width:767px){
.layout_L .text_wrap {
    width: 100%;
    text-align: left;
}
.layout_L .img_wrap {
    width: 50%;
    width: 50%;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}
}


  .-pdf-link { max-width: 600px; width: 100%; margin: 1em auto; display: flex!important; align-items: center; justify-content: center; height: 4em; font-size: 1.25rem; border-radius: 2em; }
  .-pdf-link:hover { color: #FFF; }
  .-pdf-link img { margin-right: 1em; }
  @media screen and (max-width:768px) {
    .-pdf-link { height: 4em; }
    .-pdf-link { font-size: 1.125rem; }
  }