@charset "UTF-8";

/* 共通 */
.e_green { color:#3DA386; }

.main_txt b {
  font-size:140%;
}

.arrow {
    position: relative;
    display: inline-block;
    color: #555555;
    vertical-align: middle;
    text-decoration: none;
    font-size: 15px;
}
.arrow {
  padding-right:20px;
}
.arrow::before,
.arrow::after{
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    content: "";
    vertical-align: middle;
}
.sample1-1::before{
    right: 4px;
    width:14px;
    height: 1px;
    background: #555555;
}
.sample1-1::after{
    right: 4px;
    width: 4px;
    height: 4px;
    border-top: 1px solid #555555;
    border-right: 1px solid #555555;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.list_information,
.otherinitiatives {
  margin-bottom:100px;
}

.list_initiatives ul li img,
.list_information ul li img,
.column_4 ul li img {
  width:100%;
}

.list_news1 ul,
.list_news2 ul {
}
.list_news1 ul li a,
.list_news2 ul li a {
  display: block;
  border-bottom: 1px solid #eee;
  padding:20px 0;
}
.list_news1 ul li a:hover,
.list_news2 ul li a:hover {
  display: block;
  border-bottom: 1px solid #3DA386;
  padding:20px 0;
}
.list_news1 ul li a span,
.list_news2 ul li a span,
.other_listarea ul li a span {
  color:#555555;
  font-weight: bold;
}
.kanrenbnr ul li img {
  border: 1px solid #AFAFAF;
}
.kanrenbnr ul li b {
  font-size:110%;
  display: block;
  margin-bottom:6px;
}
.kanrenbnr ul li {
  margin-bottom:20px;
}
.kanrenbnr ul li:last-child {
  margin-bottom:0;
}
.list_initiatives ul li p {
  text-align: center;
  padding:10px;
  font-family: 'Kosugi Maru', sans-serif;
  font-size: 112%;
}
.list_initiatives ul li a img {
  vertical-align: bottom; /* または vertical-align: top; */
}

/* 環境TOP　フッターエコアクションマーク */
#footer_ecoaction {
  background-color: #ebf8f2; /* 環境ボタン色の10% */
  padding: 30px 10px 40px;
  text-align: center;
}
#footer_ecoaction p {
  color: #3DA386;
  margin-bottom: 10px;
}
#footer_ecoaction img {
   width: 74px;
}
/* SP版 */
@media screen and ( max-width:768px ) {
	#footer_ecoaction {
	  padding-bottom: 80px;
	}
}




/* 下層ページ見出し */
.environment #contents {
  padding:0 !important;
}
/* 1100px以上 */
@media screen and (min-width:768px) and ( max-width:1024px) {
  .environment .contents_wrap {
    background: #fff;
    padding-top:40px !important;
    margin-top:0 !important;
  }
}

.environment .contents_wrap {
  margin-top: -80px;
  background: #fff;
  padding-top:40px !important;
  border-radius: 10px 10px 0 0;
}

h1.toptit {
  background:url(../img/top/bg_top.jpg);
  background-size: cover;
  background-position: center;
}
h1.toptit p {
  display: none;
}
h1.maintit {
  background: rgb(61,155,128);
  background: linear-gradient(55deg, rgba(61,155,128,1) 0%, rgba(3,143,167,1) 35%, rgba(173,225,238,1) 100%);
}
h1.maintit p {
  color:#fff !important;
}
.bluebox {
  background:#E3F6F9;
  padding:20px;
  border-radius:20px;
  text-align:center;
}
.linkgreen {
  color:#3DA386 !important;
  text-decoration: underline !important;
}

/*——　基本ボタン　——*/
.btnarea a {
  color: #fff;
  background:#3DA386;
  border:1px solid #3DA386;
  font-size: 16px;
  font-weight: bold;
  width: 100%;
  height:50px;
  text-align: center;
  line-height:50px;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  transition: .3s;
  border-radius:50px;
  position: relative;
}
.btnarea a:hover {
  color: #3DA386;
  background:#fff;
  border:1px solid #3DA386;
  opacity:1 !important;
}
.btnarea a:after {
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -9px;
  color: #fff;
  font-family: FontAwesome;
  content: "\f105";
  vertical-align: middle;
  line-height: 1;
}
.btnarea a:hover:after {
  color: #3DA386;
}



/*——　基本ボタン old
.btnarea a {
  color: #3DA386;
  font-size: 16px;
  font-weight: bold;
  background: transparent;
  width: 100%;
  height:50px;
  text-align: center;
  line-height:50px;
  border:1px solid #3DA386;
  position: relative;
  z-index: 1;
  display: block;
  overflow: hidden;
  transition: .3s;
  border-radius:50px;
}
.btnarea a::before {
  content: "";
  width: 120%;
  height: 200%;
  position: absolute;
  top: -50%;
  right: 0;
  z-index: -1;
  background: #3DA386;
  border-radius: 0 100% 100% 0;
  transform: translateX(-100%);
  transition: transform ease .4s;
}
.btnarea a:hover {
  color: #fff;
  opacity:1 !important;
}
.btnarea a:hover::before {
  transform: translateX(10%);
  border-radius:50px;
}
.newstit h3 {
  float: left;
}
.newstit .arrow {
  float: right;
}
　——*/

/*——　リサイクル活動　——*/
.box2 img {
  width:100%;
}
.navbtn ul li a::after { /* 棒の表示設定 */
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom:0;
  right:0;
  width:8px;
  height:8px;
  border-bottom:1px solid #7A7A7A;
  border-right:1px solid #7A7A7A;
  transform: rotate(45deg);
}
.navbtn ul li a {
  display: block;
  padding:10px 0;
  border-bottom:1px solid #7A7A7A;
  position:relative;
}
.navbtn ul li.navbtn1 a {
  line-height:45px;
}
.kaisyubtn ul li img {
  width:100%;
  border-radius:10px;
  box-shadow: 0 0.20rem 0.40rem rgb(0 0 0 / 16%);
}
.kaisyubtn2 img {
  background:#ECEFDA;
  border-radius:10px;
}
.kaisyubtn3 img {
  background:#E1EAE6;
  border-radius:10px;
}
.kaisyutit dl {
  font-size:90%;
}
dt.takuhai { background-color: #3D9D80; }
dt.tenpo { background-color: #CD8C04; }
.box1 p b {
  color:#3D9D80;
  font-size:112%;
}
p.kaisyu_rule span {
  color: #7C7C7C;
  font-size: 90%;
  line-height: 18px;
  display: block;
  margin-top: 3px;
}
p.kaisyu_rule u {
  text-decoration: none;
  color: #A43737;
}
.recycle_hyo table span {
  display:block;
  font-size:90%;
}
.recycle_hyo th {
  padding:10px;
  font-weight: bold;
  background: #69AC96;
  color: #ffffff;
}
.recycle_hyo td {
  padding:10px;
  background:#EDEDED;
}
.recycle_hyo th.bgf {
  background: #ffffff;
}
.recycle_hyo th.bgg {
  background: #B4B4B4;
}
p.kaisyu_rule img {
  float: right;
  margin-left:10px;
  height:60px;
}
.kaisyu_no {
  background:#EDEDED;
  border-radius:10px;
  padding:14px;
}
.kaisyu_no b {
  color:#3D9D80;
  font-size:110%;
  display: inline-block;
  vertical-align:top;
}
.kaisyu_no span {
  color:#CD3120;
}

.moviebox iframe {
  border-radius:14px;
}

/*——　環境活動のあゆみ　——*/
  .ayumi_list li dl dt {
    color:#3DA386;
    font-size:110%;
    font-weight:bold;
    margin-bottom: 5px;
  }



/* PC版 */
@media screen and ( min-width:769px ) {
  .main_txt {
    padding-top:40px;
  }
  #env_pankuzu{
    padding-bottom:30px;
  }
  h1.toptit div {
    width:960px;
    margin: 0 auto;
    padding:200px 0 200px;
  }

  /* 下層ページ見出し */

  /* 1100px以上 */
  @media screen and ( min-width:1100px ) {
    h1.maintit div {
      width:1100px;
      margin: 0 auto;
      padding:40px 0 110px !important;
    }
  }

  h1.maintit div {
    padding:40px;
  }

  h1.maintit p {
    float:left;
    margin:30px 0;
  }
  h1.maintit b {
    display: block;
    font-family: 'Kosugi Maru', sans-serif;
    font-size:140%;
    margin-bottom:20px;
  }
  h1.maintit span {
    display: block;
    font-size:40%;
    margin-left:5px;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
  }
  h1.maintit ul {
    text-align:right;
  }
  h1.maintit ul li {
    width:110px;
    display: inline-block;
    margin-left:12px;
  }
  h1.maintit ul li img {
    width:100%;
  }

  h3.environment_s {
    padding-left:0.8rem;
    color:#3DA386;
    border-left:4px solid #3DA386;
    font-size:140%;
    font-family: 'Kosugi Maru', sans-serif;
    margin-bottom:10px;
  }
  h2.environment_m {
  	font-size:180%;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
    margin-bottom:20px;
  }
  h2.environment_m span {
  	display: flex;
  	align-items: center;
  	font-size:50%;
  	text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    margin-bottom:10px;
  }
  h2.environment_m span::before {
  	content: '';
  	display: inline-block;
  	margin-right:10px;
  	width: 40px;
  	height: 1px;
  	background-color: #3DA386;
  }
  .maintxt b {
    display: block;
    font-size:140%;
    margin-bottom:10px;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
  }
  h4 {
    font-size:120%;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
  }
  .list_initiatives ul li {
    float:left;
    width:31%;
    margin-right:3.5%;
    margin-bottom:25px;
    box-shadow: 0 0.25rem 0.63rem rgb(0 0 0 / 16%);
  }
  .list_initiatives ul li:nth-child(3n) {
    margin-right:0;
  }
  .list_information ul li {
    float:left;
    width:22.5%;
    margin-right:3.3%;
  }
  .list_information ul li:nth-child(4n) {
    margin-right:0;
  }
  .list_information ul li b {
    display: block;
    text-align: center;
    padding:10px;
  }
  .list_information ul li a {
    display:block;
    text-align:right;
    padding:10px 20px;
  }

  .list_news1 {
    float:left;
    width:47%;
  }
  .list_news2 {
    float:right;
    width:47%;
  }
  .other_titarea {
    float:left;
  }
  .other_listarea {
    float:left;
    border-left: 1px solid #AFAFAF;
    margin-left:40px;
    padding-left:40px;
    width: 67.5%;
  }
  .other_listarea ul li {
    padding:8px;
  }
  .bluebox2 {
    background:#E3F6F9;
    padding:20px 40px;
    border-radius:20px;
    display: inline-block;
  }

  /*——　基本ボタン　——*/
  .btnarea li {
    width:32%;
    margin-right:2%;
    float: left;
  }
  .btnarea li:nth-child(3n) {
    margin-right:0;
  }

  /*——　文字の右にライン（PC）　——*/
  .environment_line {
    color: #3DA386;
    font-family: 'Kosugi Maru', sans-serif;
    display: flex;
    align-items: center;
    margin-bottom:20px;
    font-size:170%;
  }
  .environment_line span {
    font-size:76%;
  }
  .environment_line:after {
  border-top: 1px solid;
  border-image: linear-gradient(to right, #A5D097 0%, #B0E4F0 100%) 1;
  content: "";
  flex-grow: 1;
  }
  .environment_line:after {
  margin-left: 1rem;
  }

  /*——　リサイクル活動　——*/
  .navbtn ul li {
    float: left;
    width:23%;
    margin-right:2.6%;
  }
  .navbtn ul li:last-child {
    margin-right:0;
  }
  .navbtn ul li a:hover {
    border-bottom:1px solid #3D9D80;
    font-weight: bold;
    color:#161616;
  }
  .kaisyubtn ul li {
    float: left;
    width:23%;
    margin-right:2.6%;
    margin-bottom:14px;
  }
  .kaisyubtn ul li:nth-child(4n) {
    margin-right:0;
  }
  .kaisyubtn2 img {
    background:#ECEFDA;
    border-radius:10px;
  }
  .kaisyubtn3 img {
    background:#E1EAE6;
    border-radius:10px;
  }
  dl div{
  overflow: hidden;
  padding: 5px 0;
  }
  .kaisyutit dt {
    width:50px;
    text-align: center;
    float: left;
    clear: left;
    padding:6px;
    color: #fff;
    box-sizing: border-box;
    border-bottom: 1px solid #fff;
  }
  .kaisyutit dd {
    width:270px;
    float: left;
    background-color: #EDEDED;
    padding:6px;
    box-sizing: border-box;
    margin-left: 0;
  }
  .kaisyutit img {
    float: left;
    width:120px;
    margin-right:10px;
  }
  .kaisyutit div {
    float: left;
  }
  .kaisyutit b {
    color:#3D9D80;
    font-size:130%;
  }
  .box1 {
    width:51%;
    float: left;
  }
  .box2 {
    width:47%;
    float: right;
  }
  .recycle_hyo {
    border-collapse: collapse;
    border: 1px solid #fff;
    width: 100%;
  }
  .box1 .recycle_hyo table {
    width:100%;
  }
  .recycle_hyo table {
    width:60%;
  }
  .kaisyu_box {
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom:1px dashed #CDCDCD;
  }
  .kaisyu_no p {
    display: inline-block;
    margin-left:12px;
    padding-left:12px;
    border-left:1px solid #fff;
  }

  /*——　環境活動のあゆみ　——*/
  .ayumi_list {
    display: -ms-flexbox;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .ayumi_list li {
    float:left;
    width:31%;
    margin-right:3.5%;
    margin-bottom:40px;
  }
  .ayumi_list li:nth-child(3n) {
    margin-right:0;
  }
  .ayumi_list li dl {
    border-left:3px solid #3DA386;
    padding-left:12px;
  }
  .moviebox {
    position: relative;
    width: 76%;
    margin: 0 12%;
    padding-top: 42%;
}
}


/* スマホ版 */
@media screen and ( max-width:768px ) {
  .contents_wrap {
    padding:10px;
    margin:15px;
   }
   #env_pankuzu{
     padding-bottom:60px;
   }
    h1.toptit div {
      margin: 0 auto;
      padding:120px 0;
    }

    /* 下層ページ見出し */
    h1.maintit {
      font-size:2em;
    }
    h1.maintit div {
      margin: 0 auto;
      padding:40px 0 110px;
    }
    h1.maintit p {
      margin:0 20px;
      color:#fff;
    }
    h1.maintit b {
      display: block;
      font-family: 'Kosugi Maru', sans-serif;
      font-size:90%;
      margin-bottom:8px;
    }
    h1.maintit span {
      display: block;
      font-size:40%;
      text-transform: uppercase;
      font-family: 'Montserrat', sans-serif;
    }
    h1.maintit ul {
      text-align: right;
      margin:30px 20px 0 20px;
    }
    h1.maintit ul li {
      width:60px;
      display: inline-block;
    }
    h1.maintit ul li img {
      width:100%;
    }


  h3.environment_s {
    padding-left:0.5rem;
    color:#3DA386;
    border-left:4px solid #3DA386;
    font-size:120%;
    font-family: 'Kosugi Maru', sans-serif;
    margin-bottom:10px;
  }
  h2.environment_m {
  	font-size:140%;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
    margin-bottom:10px;
  }
  h2.environment_m span {
  	display: flex;
  	align-items: center;
  	font-size:60%;
  	text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 8px;
  }
  h2.environment_m span::before {
  	content: '';
  	display: inline-block;
  	margin-right:8x;
  	width: 40px;
  	height: 1px;
  	background-color: #3DA386;
  }
  .maintxt b {
    display: block;
    font-size:126%;
    margin-bottom:8px;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
  }
  .main_txt {
    padding-top:0;
  }

  .other_listarea ul li a {
    display: block;
    border-bottom: 1px solid #eee;
    padding: 20px 0;
  }
  h4 {
    font-size:110%;
  	color:#3DA386;
    font-family: 'Kosugi Maru', sans-serif;
    line-height: 1.4em;
    margin-bottom:6px;
  }
  .list_initiatives ul li {
    margin-bottom:25px;
    box-shadow: 0 0.25rem 0.63rem rgb(0 0 0 / 16%);
  }
  .list_information ul li img {
    float:left;
    width:48%;
    margin-right:14px;
  }
  .list_information ul li {
    margin-top:25px;
  }
  .list_information ul li b {
    font-size: 106%;
    margin-bottom: 5px;
    display: block;
  }
  .list_information ul li p {
    margin-bottom:5px;
  }
  .list_information ul li:after {
    content: "";
    clear: both;
    height: 0;
    display: block;
    visibility: hidden;
    margin: 0px !important;
  }

  /*——　基本ボタン　——*/
  .btnarea li {
    margin-bottom:10px;
  }

  /*——　文字の右にライン（SP）　——*/
  .environment_line {
    color: #3DA386;
    font-family: 'Kosugi Maru', sans-serif;
    align-items: center;
    padding-bottom:10px;
    margin-bottom:20px;
    font-size:140%;
    line-height: 130%;
    border-bottom: 1px solid;
    border-image: linear-gradient(to right, #A5D097 0%, #B0E4F0 100%) 1;
  }
  .environment_line span {
    font-size:76%;
  }

  /*——　リサイクル活動　——*/
  .navbtn ul li {
    float: left;
    width:48%;
    margin-right:4%;
    font-size:90%;
  }
  .navbtn ul li:nth-child(2n) {
    margin-right:0;
  }

  /*——　プラスチック削減　——*/
  .bluebox2 {
    background:#E3F6F9;
    padding:20px;
    border-radius:20px;
    display:block;
  }
  .bluebox img,
  .bluebox2 img {
    width: 100%;
  }
  .navbtn ul li a {
    padding: 10px 14px 10px 0;
  }
  .kaisyubtn ul li {
    float: left;
    width:48%;
    margin-right:4%;
    margin-bottom:14px;
  }
  .kaisyubtn ul li:nth-child(2n) {
    margin-right:0;
  }
  .kaisyutit img {
    float: left;
    width:18%;
    margin-right:2%;
    margin-bottom:10px;
  }
  .kaisyutit b {
    color:#3D9D80;
    font-size:120%;
  }
  .kaisyutit dt {
    width:14%;
    text-align: center;
    float: left;
    clear: left;
    padding:6px;
    color: #fff;
    box-sizing: border-box;
    border-bottom: 1px solid #fff;
  }
  .kaisyutit dd {
    width:86%;
    float: left;
    background-color: #EDEDED;
    padding:6px;
    box-sizing: border-box;
    margin-left: 0;
  }
  .box2 {
    margin-top:10px;
  }
  .kaisyu_no p {
    margin-top:6px;
    padding-top:6px;
    border-top:1px solid #fff;
  }

  /*——　環境活動のあゆみ　——*/
    .ayumi_list li {
      padding-bottom:16px;
      margin-bottom:16px;
      border-bottom:1px solid #EDEDED;
    }
    .ayumi_list li:last-child {
      border-bottom:none;
    }
}

.balloon1-left {
  position: relative;
  display: inline-block;
  margin: 1.5em 0 1.5em 15px;
  padding: 7px 10px;
  min-width: 120px;
  max-width: 100%;
  color: #555;
  font-size: 16px;
  background: #e0edff;
}
.balloon1-left:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -30px;
  margin-top: -15px;
  border: 15px solid transparent;
  border-right: 15px solid #e0edff;
}
.balloon1-left p {
  margin: 0;
  padding: 0;
}