@charset "utf-8";
/* ------------------------------------- */
/*メインビジュアル*/
/* ------------------------------------- */
.mv{
  background: url(../img/history/main.jpg) no-repeat;
  background-position: center;
  background-size: cover;
}
@media screen and (max-width: 600px) {
  .mv{
    background:url(../img/history/main_sp.jpg) no-repeat;
    background-position: center;
    background-size: cover;
  }
}
/* ------------------------------------- */
/*共通テーブルスタイル*/
/* ------------------------------------- */
.table-box h4{
  font-size: 1.8rem;
  font-weight: bold;
  text-align: center;
  color: #fff;
  background: #4595d2;
  padding: 12px;
  border-radius: 10px 10px 0 0;
}
table{
  width: 100%;
  border-collapse: separate;
  overflow: hidden;
  border-spacing: 0;
  border-radius: 10px;
  border: 1px solid #e5ebef;
  table-layout: fixed;
}
.table-box table{
  border-radius: 0 0 10px 10px;
}
table td,
table th {
	padding: 15px;
  vertical-align: middle;
  border-bottom: 1px solid #e5ebef;
}
table tr:last-of-type td,
table tr:last-of-type th{
  border-bottom:0;
}
table th{
	background: #f5f5f5;
  font-weight: bold;
}
table td{
  background:#fff;
  line-height: 1.8;
}
.table-sub table{
  border-radius: 0;
}
@media screen and (max-width: 600px) {
  table th{
    text-align: center;
  }
}
/* ------------------------------------- */
/*⼤阪市環境事業・120年の歩み*/
/* ------------------------------------- */
.disk .sec-inner{
  background:#2d8dd7;
  border-radius: 10px;
  padding:40px;
}
.disk .heading-border{
  color: #fff;
  border-color: #fff;
  margin-bottom:20px;
}
@media screen and (max-width: 600px) {
  .disk .sec-inner{
    padding: 15px 4%;
  }
  .disk .heading-border{
    font-size: 2.4rem;
  }
}
/* ------------------------------------- */
/*イントロ*/
.disk .intro-wrap{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 60px;
}
.disk .intro-wrap figure{
  width: 36%;
}
.disk .intro-wrap .text-wrap{
  width: calc(64% - 30px);
}
.disk .intro-wrap .text-wrap p{
  color: #fff;
  line-height: 1.7;
}
@media screen and (max-width: 600px) {
  .disk .intro-wrap{
    display: block;
  }
  .disk .intro-wrap figure,
  .disk .intro-wrap .text-wrap{
    width:100%;
  }
  .disk .intro-wrap figure{
    margin-bottom:30px;
  }
}
/* ------------------------------------- */
/*収録内容*/
.disk .detail-wrap .heading-border span{
  font-size: 1.5rem;
  font-weight: bold;
  padding-left:25px;
}
.disk .detail-wrap .list{
  display: flex;
}
.disk .detail-wrap .list dl{
  width:33.3%;
}
.disk .detail-wrap .list dl dt{
  color: #fff;
  font-weight: bold;
  margin-bottom: 8px;
  line-height: 1.7;
}
.disk .detail-wrap .list dl dd{
  color: #fff;
  margin-bottom: 8px;
  line-height: 1.7;
}
.disk .detail-wrap .photo-wrap{
  display: flex;
  justify-content: space-between;
  background: #4aaaec;
  padding: 10px;
}
.disk .detail-wrap .photo-wrap figure{
  padding-right: 10px;
}
.disk .detail-wrap .photo-wrap figure:last-of-type{
  padding-right:0;
}
.disk .detail-wrap .m-bottom,
.disk .detail-wrap .list dl dt.m-bottom{
  margin-bottom:40px;
}

@media screen and (max-width: 600px) {
  .disk .detail-wrap .heading-border{
    font-size: 2.4rem;
  }
  .disk .detail-wrap .list{
    display: block;
  }
  .disk .detail-wrap .list dl{
    width: 100%;
  }
  .disk .detail-wrap .list dl:first-of-type{
    margin-bottom:40px;
  }
  .disk .detail-wrap .photo-wrap{
    display: block;
  }
  .disk .detail-wrap .photo-wrap figure{
    padding-right: 0px;
  }
  .disk .detail-wrap .photo-wrap figure:not(:last-of-type){
    padding-bottom:10px;
  }
}

/* ------------------------------------- */
/*購入方法*/
/* ------------------------------------- */
/* ------------------------------------- */
/*購入方法共通*/
.buying .sec-inner{
  max-width:920px;
}
.buying h3{
  font-weight: bold;
  font-size: 2.8rem;
  margin-bottom: 30px;
  text-align: center;
}
.buying table th{
  border-right: 1px solid #e5ebef;
  text-align: left;
}
.buying table td h4{
  font-size: 1.5rem;
  font-weight: bold;
}
.buying table td h4 span{
  font-weight: normal;
}
.buying table td .caution{
  color: #e10000;
  font-size: 1.2rem;
}
.buying table td .caution li{
  position: relative;
  padding-left:0.5em;
}
.buying table td .caution li::before{
  content:"※";
  position: absolute;
  top:0;
  left:0;
}
@media screen and (max-width: 600px) {
  .buying table th,
  .buying table td{
    display: block;
    width:100%;
  }
  .buying table th{
    text-align: center;
    border-right: 0;
  }
  table tr:last-of-type th{
    border-bottom: 1px solid #e5ebef;
  }
  .buying table td{
    padding: 30px 4%;
  }
}
/* ------------------------------------- */
/*直接購入の場合*/
.buying table td.map-area{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.buying table td.map-area .text-wrap{
  width: 70%;
}
.buying table td.map-area .text-wrap h4{
  margin-bottom:40px;
}
.buying table td.map-area .map{
  position: relative;
  padding-top: 30%;
  width: 30%;
}
.buying table td.map-area .map iframe{
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 600px) {
  .buying table td.map-area{
    display: block;
  }
  .buying table td.map-area .text-wrap{
    width:100%;
  }
  .buying table td.map-area .map{
    padding-top: 100%;
    width: 100%;
  }
}
/* ------------------------------------- */
/*FAXの場合*/
.buying table td.fax{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.buying table td.fax h4{
  width:calc(100% - 285px);
}
.buying table td.fax .btn{
  width: 255px;
}
@media screen and (max-width: 600px) {
  .buying table td.fax{
    display: block;
  }
  .buying table td.fax h4{
    width: 100%;
  }
  .buying table td.fax .btn{
    width:100%;
    margin:20px auto 0;
  }
}
/* ------------------------------------- */
/*メールの場合*/
.buying table td.mail h4{
  margin-bottom:40px;
}
.buying table td.mail .btn{
  margin:30px auto 0;
}
@media screen and (max-width: 600px) {

}
/* ------------------------------------- */
/*テーブル内のサブテーブル*/
.buying .table-sub table th,
.buying .table-sub table td{
  border-right: 1px solid #e5ebef;
  padding: 15px 5px;
}
.buying .table-sub table th:last-of-type,
.buying .table-sub table td:last-of-type{
  border-right: 0;
}
.buying .table-sub table th,
.buying .table-sub table td{
  text-align: center;
}
.buying .table-sub table td span{
  font-size: 1.2rem;
}
@media screen and (max-width: 600px) {
  .buying .table-sub table th,
  .buying .table-sub table td{
    display: table-cell;
  }
  .buying .table-sub table th{
    width:26%;
  }
  .buying .table-sub table th:last-of-type{
    border-right: 1px solid #e5ebef;
  }
  .buying .table-sub table td{
    width:80%;
  }
  .buying .table-sub table:not(:first-of-type){
    margin-top:15px;
  }
  .buying .table-sub table .b-bottom-none{
    border-bottom:0;
  }
}