@charset "utf-8";

/* CSS Document */

@media only screen and (max-width: 768px) {
  body {
    font-size: 1.6rem;
  }
  /* =======================================
    font
    ======================================= */
  h2.bg-line {
    font-size: 1.8rem;
    margin-bottom: 2rem;
  }
  h2.bg-line span img {
    width: 2rem;
  }
  h2.bg-stripe-blue {
    font-size: 1.8rem;
  }
  /* =======================================
    layout
    ======================================= */
  .container {
    padding: 0 1.5rem;
  }
  /* =======================================
    header
    ======================================= */
  .header h1 {
    display: none;
  }
  .header-inner {
    margin-bottom: 0;
  }
  .logo {
    max-width: 70%;
  }
  .logo img {
    width: 100%;
  }
  .logo span {
    font-size: 1.4rem;
  }
  a.btn-contact {
    display: none;
  }
  /* =======================================
    index
    ======================================= */
  .mainview .container>img.pc {
    display: none;
  }
  .mainview .container>img.sp {
    display: block;
  }
  .mainview-btn {
    top: 5px;
    right: 10px;
    width: 26%;
  }
  .mainview-btn img {
    display: block;
    width: 100%;
  }
  .mainview-btn img.pc {
    display: none;
  }
  .mainview-btn img.sp {
    display: block;
  }
  .mainview-btn>img {
    padding-bottom: 0.5rem;
  }
  .wrap-app-btn {
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  .wrap-app-btn a {
    display: block;
    margin-bottom: 0.5rem;
  }
  .wrap-info {
    -webkit-flex-direction: column;
    flex-direction: column;
    padding-top: 1rem;
    padding-bottom: 2rem;
  }
  .information {
    width: 100%;
  }
  .information:first-child {
    margin-bottom: 2rem;
    padding-right: 0;
  }
  .information:last-child {
    padding-left: 0;
  }
  .information ul {
    border-top: solid 1px #CECEBF;
  }
  .information ul li {
    border-bottom: solid 1px #CECEBF;
  }
  .information a span {
    display: block;
  }
  .ind-search h2 {
    font-size: 1.8rem;
    margin-bottom: 2rem;
  }
  .ind-search h2 span img {
    width: 3rem;
  }
  .inner-ind-search {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 2rem;
    padding: 0 3rem;
  }
  .inner-ind-search span {
    display: block;
    width: 100%;
    font-size: 1.8rem;
    margin-right: 0;
    margin-bottom: 1rem;
  }
  .inner-ind-search input {}
  .inner-ind-search input[type="search"] {
    width: 1rem;
    -webkit-flex-grow: 1;
    flex-grow: 1;
  }
  .inner-ind-search input[type="submit"] {
    width: 6rem;
    font-size: 2rem;
  }
  .ind-search-btn {
    -webkit-flex-direction: column;
    flex-direction: column;
    padding: 0 3rem;
  }
  .ind-search-btn a {
    width: 100%;
    font-size: 2rem;
    margin-bottom: 1.5rem;
    padding: 2rem 0;
  }
  .ind-bottom.container {
    -webkit-flex-direction: column;
    flex-direction: column;
    margin-bottom: 2rem;
  }
  .ind-calendar, .ind-app {
    width: 100%;
  }
  .ind-calendar {
    padding: 1.5rem;
  }
  .ind-calendar h2 {
    font-size: 2rem;
    text-align: center;
    margin-bottom: 2rem;
  }
  .ind-calendar h2 img {
    width: 3rem;
  }
  .ind-map {
    display: none;
  }
  .lst-area {
    width: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-around;
    justify-content: space-around;
  }
  .lst-area li:first-child {
    border-top: solid 2px #ccc;
  }
  .lst-area li a {
    padding: 0 1rem 0 3.5rem;
  }
  .ind-app-text h3 {
    font-size: 1.8rem;
  }
  .ind-app {
    padding: 1.5rem;
  }
  .ind-app-text {
    padding: 1rem;
  }
  /* =======================================
    footer
    ======================================= */
  .footer {
    padding: 0;
  }
  .footer .container {
    padding: 0;
  }
  .logo-footer {
    display: none;
  }
  .footer li {
    width: 50%;
    border-right: solid 1px #fff;
    border-bottom: solid 1px #fff;
    margin: 0;
  }
  .footer li:nth-of-type(2n) {
    border-right: none;
  }
  .footer li:nth-of-type(9), .footer li:nth-of-type(10) {
    border-bottom: none;
  }
  .footer li a {
    display: block;
    text-align: center;
    padding: 1rem 0;
  }
  /* =======================================
    下層ページ　共通
    ======================================= */
  h1.page-title {
    font-size: 2rem;
    margin-bottom: 2rem;
    padding: 1rem 0 1rem 1rem;
  }
  .page-contents {
    margin-bottom: 2rem;
  }
  /*　検索タイトル	*/
  h2.search-title {
    font-size: 1.6rem;
    margin-bottom: 2rem;
  }
  h2.search-title span:first-child {
    width: 2.6rem;
  }
  /* =======================================
    プライバシーポリシー　.policy
    ======================================= */
  .policy p, .policy ol {
    margin-bottom: 2rem;
  }
  .policy h2 {
    margin-bottom: 1rem;
  }
  /* =======================================
    ごみ分別検索結果　.result
    ======================================= */
  .result thead th:first-child {
    width: 33%;
  }
  .result table {
    font-size: 1.4rem;
  }
  .result tbody th {
    padding-top: 0.8rem;
    vertical-align: top;
  }
  /* =======================================
    私の町のごみカレンダー 検索　.search-calendar
    ======================================= */
  .search-btn, .town-lst, .search .search-btn {
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-bottom: 2rem;
  }
  .search-btn li {
    width: 19%;
    margin-right: 0;
  }
  .town-lst {
    padding-left: 0;
  }
  .town-lst li {
    width: 33%;
  }
  .calendarNav div {
    width: 31.9%;
  }
  .calendar .day {
    width: 14.2857%;
    height: 13rem !important;
  }
  .calendar .day h3 {
    padding: 0.25rem;
    font-size: 74%;
  }
  .calendar .day h3 .weekday::before {
    content: " ";
  }
  .calendar .day h3 .weekday::after {
    content: "";
  }
  .calendar .day p {
    padding: 0 0.25rem 0.25rem 0.25rem;
    font-size: 1rem;
  }
  .calendar .day p .iconWrap {
    display: inline-block;
    width: 90%;
  }
  .calendarCaption p img {
    height: auto;
    width: 4rem;
  }
  /* =======================================
    ごみ分別検索　.search
    ======================================= */
  .search p.mb60 {
    margin-bottom: 2rem;
  }
  .search-block {
    padding: 2rem 1rem;
  }
  .search-block h3 {
    font-size: 1.8rem;
  }
  .wrap-search-input {
    width: 100%;
    padding: 0;
  }
	.search select{
		width: 100%;
	}
  .search input[type="search"] {
    width: 1rem;
  }
  .search input[type="submit"] {
    width: 6rem;
    font-size: 2rem;
  }
  /* =======================================
    このサイトについて　.about
    ======================================= */
  .about h2 {
    font-size: 1.8rem;
  }
  .about p {
    font-size: 1.4rem;
    margin-bottom: 1rem;
  }
  .about dl {
    font-size: 1.4rem;
  }
  .about dt {
    width: 30%;
    padding: 1rem 0.5rem 1rem 1rem;
  }
  .about dd {
    width: 70%;
    padding: 1rem 0.5rem 1rem 1rem;
  }
  /* =======================================
    私の町のごみカレンダー　.calendar
    ======================================= */
  .cal-map {
    display: none;
    padding-top: 0;
  }
  .cal-text {
    width: 100%;
  }
  .cal-text {
    padding-top: 0;
    padding-left: 0;
  }
  .calendar p {
    margin-bottom: 2rem;
  }
  .calendar .lst-area ul {
    margin-right: 0rem;
  }
  .calendar .lst-area li a {
    width: auto;
    padding: 0 4rem 0 3.5rem;
  }
  /* =======================================
    各処理施設一覧　.facility
    ======================================= */
  .facility h2 {
    font-size: 1.8rem;
  }
  .facility h2 img {
    width: 3rem;
  }
  .facility01 {
    font-size: 1.4rem;
  }
  .facility01 .pc{
		display: none;
	}
  .facility01 .sp{
		display: inline;
	}
  .facility-table01 thead th:first-child {
    width: 100%;
    border-right: none;
  }
  .facility-table01 thead th:nth-of-type(2), .facility-table01 thead th:nth-of-type(3) {
    display: none;
  }
  .facility-table01 tbody tr {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .facility-table01 tbody th, .facility-table01 tbody td:nth-of-type(1) {
    border-right: none;
    border-bottom: dotted 1px #ccc;
  }
  .facility-table01 tbody th {
    width: 40%;
    padding-top: 2rem;
    padding-left: 1rem;
  }
  .facility-table01 td:nth-of-type(1) {
    width: 60%;
    padding: 1rem 0 1rem 1rem;
  }
  .facility-table01 tbody td:last-child {
    width: 100%;
    border-bottom: solid 1px #ccc;
    padding: 1.5rem 1rem;
  }
  .facility-table01 tbody td:last-child::before {
    content: "【搬入できるもの】";
    display: block;
    font-size: 1.4rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
  }
  .facility-table01 img {
    width: 3rem;
    margin-bottom: 0.5rem;
  }
  .facility-table01 td:last-child small {
    margin-top: 0;
  }
  .facility-table01 dd a {
    display: inline;
    text-decoration: underline;
  }
  .facility-table01 dd span {
    display: none;
  }
  .icon-lst {}
  .icon-lst li, .icon-lst li:last-child {
    width: 50%;
    margin-bottom: 2rem;
    padding-left: 0;
  }
  .icon-lst li img {
    width: 3rem;
  }
  .icon-lst li span {
    padding-left: 1rem;
  }
  .facility-table02 th:first-child {
    width: 30%;
  }
  .facility-table02 th:nth-of-type(2), .facility-table02 th:last-child {
    display: none;
  }
  .facility-table02 tbody tr {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .facility-table02 th, .facility-table02 td {
    border-right: none;
  }
  .facility-table02 th:first-child::after {
    content: "別連絡先";
  }
  .facility-table02 td:first-child {
    padding-right: 0;
    padding-bottom: 0;
  }
  .facility-table02 td:first-child::before {
    content: "【";
  }
  .facility-table02 td:first-child::after {
    content: "】";
  }
  .facility-table02 td:nth-of-type(2) {
    -webkit-flex-grow: 1;
    flex-grow: 1;
  }
  .facility-table02 td:last-child {
    width: 100%;
    padding-top: 0;
  }
  .facility-table02 td a {
    display: block;
    background: #dbdbdb;
    background: -webkit-linear-gradient(#fefefe 0%, #dbdbdb 100%);
    background: linear-gradient(#fefefe 0%, #dbdbdb 100%);
    border: solid 1px #ccc;
    border-radius: 2px;
    padding: 1rem;
  }
  .facility-table02 td:last-child>span {
    display: none;
  }
  .facility-table02 td a span, .facility-table02 td a img {
    display: inline-block;
    vertical-align: middle;
  }
  .facility-table02 td a img {
    width: 2rem;
    margin-right: 1rem;
  }
  /* =======================================
    ごみ分別のルール　.rule
    ======================================= */
  .rule {
    font-size: 1.4rem;
  }
  .rule tbody th, .rule td {
    padding: 1rem;
  }
  .rule th {
    border-right: solid 2px #fff;
  }
  .rule tbody th {
    width: 30%;
    vertical-align: top;
    padding-top: 4rem;
  }
  /* =======================================
    Q&A よくあるご質問　.qa
    ======================================= */
	.qa-nav{
		margin-bottom: 2rem;
	}
	.wrap-qa{
		margin-bottom: 4rem;
	}
	.qa h2{
		font-size: 2.2rem;
	}
	.qa-list p {
		padding-left: 0;
	}
  /* =======================================
    お問合せ　.contact
    ======================================= */
  .contact {
    font-size: 1.4rem;
  }
  .contact h2 {
    margin-bottom: 1rem;
  }
  .contact-number {
    padding-left: 0;
	margin-bottom: 2rem;
  }
  .contact-number .pc {
    display: none;
  }
  .contact-number .sp, .contact-number dl {
    width: 100%;
    text-align: center;
  }
  .contact-number img {
    width: 2rem;
  }
  .contact-number .sp {
    display: block;
    font-size: 1.8rem;
    background: #dbdbdb;
    background: -webkit-linear-gradient(#fefefe 0%, #dbdbdb 100%);
    background: linear-gradient(#fefefe 0%, #dbdbdb 100%);
    border: solid 1px #ccc;
    border-radius: 2px;
    margin-bottom: 2rem;
    padding: 1rem;
  }
  .contact-number .sp img, .contact-number .sp span {
    display: inline-block;
    vertical-align: middle;
  }
	.betu-form{
		font-size: 1.8rem;
		padding: 1.5rem 1rem;
	}
  .contact form {
    margin-bottom: 2rem;
  }
	.app-form .con-wrap-input{
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
  .con-label {
    /*width: 33%;*/
    width: 150px;
    min-width: 150px;
    padding-left: 1rem;
  }
	.app-form .con-label{
		width: 100%;
		font-weight: 700;
		padding-top: 1rem;
		padding-bottom: 0;
	}
  .con-input {
    padding: 1rem;
  }
  .wrap-radio {
    display: block;
    width: 100%;
    margin-right: 0;
  }
  .contact p.mb30, .contact p.mb60 {
    margin-bottom: 2rem;
  }
  .thanks-page h2.bg-stripe-blue{
	margin-bottom: 2rem;
	}


  /* =======================================
    404 NOT FOND　404エラー
    ======================================= */
  .error {
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-flex-direction: column-reverse;
    flex-direction: column-reverse;
    position: relative;
  }
  .btn-sitemap {
    position: absolute;
    right: 1.5rem;
    top: -1rem;
    display: inline-block;
    font-size: 1.2rem;
    color: #fff;
    background-color: #096BB7;
    border-radius: 5px;
    margin-left: auto;
    padding: 0.5rem;
  }
  .btn-sitemap img, .btn-sitemap span {
    display: inline-block;
    vertical-align: middle;
  }
  .btn-sitemap img {
    width: 2rem;
    margin-right: 0.5rem;
  }
  .hamakurikun, .error-text {
    width: 100%;
  }
  .error-text {
    padding-left: 0;
  }
  .error h2 {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .error p {
    font-size: 1.4rem;
    margin-bottom: 1rem;
  }
  .error ul {
    font-size: 1.4rem;
    margin-bottom: 1.5rem;
  }
  /* =======================================
    sitemap　サイトマップ
    ======================================= */
  .sitemap {
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  .sitemap ul {
    width: 100%;
  }
  .sitemap li {
    border-bottom: solid 1px #ccc;
    margin-bottom: 0;
  }
  .sitemap li a {
    display: block;
    background-image: url(../img/icon-arrow.png);
    background-position: left center;
    background-repeat: no-repeat;
    padding: 1rem 1rem 1rem 2rem;
  }
  
  /* =======================================
    app　どこすてナビアプリ
======================================= */
.app-intro-title img{
	width: 60px;
	margin-right: 1rem;
	}
.app-intro-title h2{
	font-size: 2rem;
	}
.app-intro-title p{
	clear: left;
	height: 68px;
	font-size: 1.6rem;
	background: url(../img/icon-dokosute.png) right center no-repeat;
	background-size: 68px;
	padding: 20px 75px 0 0;
	margin: 0 0 .5rem;
	}
.wrap-app-intro{
	margin-bottom: 1rem;
	}
.wrap-app-intro > img,
.app-intro-text{
	display: block;
	width: 100%;
	}
.wrap-app-intro > img{
	padding-right: 0;
	margin-bottom: 1rem;
	}
.app-intro-text{
	padding-top: 0;
    min-height: auto;
    min-height: inherit;
    background-image: none;
	}
.app-intro-text > img{
	display: none;
	}
.wrap-btn-app{
	padding-top: 1rem;
	}
.sub-menu li,
.sub-menu > li{
	margin-top: 8px;
	line-height: 1.2;
	}
.sub-menu > li:first-child{
	margin-top: 0;
	}
.sub-menu a{
	font-size: 1.4rem;
	}
.sub-menu > li > ol {
    margin-left: 1rem;
}
/*	app-config どこすてナビアプリ設定手順	*/
.app-config{
	margin-bottom: 4rem;
	}
.app h3{
	font-size: 1.6rem;
	margin-bottom: 1.5rem;
	}
.app h4{
	font-weight: normal;
	}
.app-box{
	margin-bottom: 3rem;
	}
.app-img,
.app-text{
	display: block;
	}
.app-img{
	margin-bottom: 1.5rem;
	}
.app-text{
	padding-left: 0;
	}
.app-text p{
	font-size: 1.4rem;
	margin-bottom: 1rem;
	}
/*	app01-1   1-1. インストール後、初めての方	*/
.app01-1 .app-img,
.app01-1 .app-text,
.app01-2 .app-img,
.app01-2 .app-text,
.app02 .app-img img:first-child,
.app02 .app-img img:last-child{
	width: 100%;
	}
.app01-1 .app-text img{
	width: 120px;
	}
/*	app02   2. 地域設定	*/
.app02 .app-img img{
	display: block;
	}
.app02 .app-img img:first-child{
	margin-bottom: 1rem;
	}
}