@charset "utf-8";
 .index #flow ul  {}
.index #flow ul:after {
content: "";
clear: both;
display: block;
}
.index #flow ul li {
float:left;
margin-left: 45px;
width: 190px;
text-align:center;
}
.index #flow ul li div{
color: #f14b94;
font-size: 125%;
}
.index #flow ul li a{
font-size: 150%;
}
.index #flow ul li:first-child {
margin-left: 0;
}
.index #top_access {
display: none;
}
.index #flow_detail_link {
display: none;
}
.index #news .tit_h3 {
margin: 0;
}
.index #news ul  {
border: 1px solid #009245;
padding: 0 20px;
}
.index #news ul li {
border-bottom: 1px dotted #666666;
padding: 10px 0;
}
.index #news ul li span {
margin-right: 30px;
}
.index #news ul li:last-child {
border-bottom: none;
}
@media screen and (max-width:768px) {
.index #news ul li span {
display: block;
}
.index #flow ul li {
float: none;
width: 100%;
margin: 0 0 10px 0;
}
.index #top_access {
display: flex;
text-align: center;
margin-bottom: 24px;
}
.index #top_access a {
width:calc(100% / 3);
background-color: #009245;
color: #FFF;
margin-right: 10px;
line-height: 250%;
}
.index #top_access a:last-child {
margin: 0;
}
.index #flow_detail_link {
margin: 20px auto;
display: block;
}
span.point {
background-color: #FFE4E1;
color: #ED1C24;
}
}
.index div.introduction {
padding: 15px 15px 18px 20px;
margin-bottom: 10px;
background: #FAFAFA;
color: #666666;
border: 1px solid #707070;
}
span.point {
background-color: #FFE4E1;
color: #ED1C24;
font-weight: bold;
} .service .price_banner {
text-align: center;
margin: 10px 0;
}
.service .add_price {
text-align: right;
}
.service .toilet {
background: url(/image/service/toilet_bg.jpg) 0 0 no-repeat;
height: 220px;
}
.service .kitchen {
background: url(/image/service/kitchen_bg.jpg) 0 0 no-repeat;
height: 220px;
}
.service .bathroom {
background: url(/image/service/bathroom_bg.jpg) 0 0 no-repeat;
height: 220px;
}
.service .washroom {
background: url(/image/service/washroom_bg.jpg) 0 0 no-repeat;
height: 220px;
}
.service .overflow {
background: url(/image/service/overflow_bg.jpg) 0 0 no-repeat;
height: 220px;
}
.service .service_list ul {
padding-left: 250px;
}
.service .service_list ul li {
background: url(/image/common/icon_check.png) 0 3px no-repeat;
padding-left: 17px;
}
.service-dl {
margin: 0 0 15px 0;
border: 2px solid #d4e6f5;
}
.service-dl dt {
border: 1px solid #ffffff;
background-color: #e5f0f9;
font-weight: bold;
}
.service-dl dt a {
color: #000;
display: block;
padding: 18px 10px 12px 20px;
font-weight: bold;
font-size: 116%;
border-bottom: solid 1px #d3e1ef;
}
.service-dl dd {
padding: 15px 15px 18px 20px;
margin: 0;
}
.service-dl dd a {
display: block;
text-decoration: underline;
text-align: right;
}
@media screen and (max-width:768px) {
.service .toilet {
background: none;
height: auto;
}
.service .kitchen {
background: none;
height: auto;
}
.service .bathroom {
background: none;
height: auto;
}
.service .washroom {
background: none;
height: auto;
}
.service .overflow {
background: none;
height: auto;
}
.service .service_list ul {
padding-left: 0;
}
} .price div.price_img {
width: 330px;
float: left;
}
.price div.price_text {
float: left;
}
.price .table th  {
border-top: 1px solid #f9b7d4;
border-left: 1px solid #f9b7d4;
border-bottom: 1px solid #f9b7d4;
background-color: #fde2ee;
}
.price .table td  {
border-top: 1px solid #f9b7d4;
border-right: 1px solid #f9b7d4;
border-bottom: 1px solid #f9b7d4;
}
.price .price-banner {
margin: 16px 0;
}
.price .price-banner li {
display: inline-block;
width: 160px;
}
@media screen and (max-width:768px) {
.price div.price_img {
width: auto;
float: none;
text-align: center;
}
.price div.price_text {
float: none;
}
.price .price-banner li {
display: inline-block;
width: 49%;
}
} @media screen and (max-width:768px) {
.company #map iframe {
width: 100%;
}
} .contact .tel_list{
padding:20px;
background-color:#feeef5;
border: 1px solid #f14b94;
}
.contact .tel_list ol {
padding-left: 30px;
}
.contact .tel_list ol li span {
font-size: 11px;
}
.contact .free_dial  {
margin-bottom: 10px;
}
.contact .free_dial strong {
font-size: 2.5rem;
color: #f14b94;
}
.contact .free_dial span {
font-weight: bold;
color: #009245;
}
.contact .tel_list h4 {
padding-left: 40px;
background: url(/image/contact/icon_phone.png) no-repeat;
margin: 5px 0;
height: 30px;
font-size: 1.7rem;
}
.contact .contact_policy {
border: 1px solid #ccc;
height: 150px;
margin: 20px 0;
overflow: auto;
padding: 0 20px;
}
.contact .button_box {
text-align: center;
}
.contact .submit_button input,
.contact .back_button input {
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
color: #009245;
padding: 15px 50px;
font-weight: bold;
font-size: 1.5rem;
display: inline-block;
}
.contact .submit_button input {
border: 1px solid #009245;
background-color: #cce9da;
}
.contact .back_button input {
border: 1px solid #808080;
background-color: #808080;
color: #fff;
}
.contact .submit_button input:hover,
.contact .back_button input:hover {
cursor: pointer
}
.contact .table th  {
width: 30%;
}
.contact span.required {
color: #e50012;
margin-left: 5px;
}
@media screen and (max-width:768px) {
.contact .tel_list {
padding: 10px;
}
.contact .tel_list h4 {
font-size: 1.5rem;
}
} .faq dl.faq-dl {
margin: 0 0 15px 0;
border: 2px solid #d4e6f5;
background-color: #e5f0f9;
}
.faq dl.faq-dl dt {
border: 1px solid #ffffff;
font-weight: bold;
}
.faq dl.faq-dl dt span {
display: block;
padding: 12px 10px 12px 55px;
background: url(/image/faq/icon_q.png) no-repeat 10px 8px;
font-weight: bold;
font-size: 116%;
border-bottom: solid 1px #d3e1ef;
}
.faq dl.faq-dl dd {
padding: 15px 15px 18px 55px;
background: #ffffff url(/image/faq/icon_a.png) no-repeat 10px 14px;
margin: 0;
} .office .office_addres {
border-bottom: 1px dotted #000;
}
.office .support_work{
border:1px solid #f14b94;
padding:10px;
margin:20px 0;
}
.office .support_work .tit_h4 {
margin: 10px;
background-color: #f14b94;
color: #fff;
padding: 0 5px;
line-height: 2em;
background-position: 5px;
border-radius: 10px;
}
.office .support_work dl{
margin-bottom:20px;
}
.office .support_work dt{
font-weight:bold;
color: #f14b94;
margin: 0;
}
.office .support_work dd{
margin-left: 10px;
}
.office .support_area {
padding: 20px;
background-color: #ebf9fe;
margin: 10px 0 20px;
}
@media screen and (max-width:768px) {
.office .section iframe {
width: 100%;
}
} .t-area .area_voice dl{
border:1px solid #f14b94;
background-color:#feeef5;
padding:20px;
margin-bottom:20px;
}
.t-area .area_voice dt{
font-weight: bold;
color: #f14b94;
margin-bottom:5px;
}
.t-area .area_voice dd{
margin: 0;
}
.t-area dl.faq {
margin: 0 0 15px 0;
border: 2px solid #d4e6f5;
background-color: #e5f0f9;
}
.t-area dl.faq dt {
border: 1px solid #ffffff;
font-weight: bold;
}
.t-area dl.faq dt span {
display: block;
padding: 12px 10px 12px 55px;
background: url(/image/faq/icon_q.png) no-repeat 10px 8px;
font-weight: bold;
font-size: 116%;
border-bottom: solid 1px #d3e1ef;
}
.t-area dl.faq dd {
padding: 15px 15px 18px 55px;
background: #ffffff url(/image/faq/icon_a.png) no-repeat 10px 14px;
margin: 0;
}
.t-area .detail {
padding: 0 0 20px;
}
.t-area .detail .tit_h4 {
border-bottom: 1px dotted #f14b94;
padding-bottom: 10px;
} .t-area .detail ul{
display: flex;
flex-wrap: wrap;
}
.t-area .detail ul li {
float: left;
min-width: 100px;
padding-right: 1em;
font-size: 13px;
} .blog .article {
margin-bottom: 20px;
}
.blog .article .tit_h4 {
border-bottom: 2px solid #f14b94;
background-color: #eee;
padding: 10px 0;
background-position: 20px 15px;
text-indent: 45px;
margin-bottom: 0;
}
.blog .article .tit_h4 a {
color: #292b2c;
}
.blog .article .blog_info {
border-bottom: 2px dotted #888;
padding: 10px 20px;
}
.blog .article .blog_info span {
color: #f14b94;
font-weight: bold;
}
.blog .article .blog_info ul {
display: inline-block;
}
.blog .article .blog_info ul li {
display: inline;
}
.blog .article .blog_info .twitter-share-button {
vertical-align: bottom;
}
.blog .article .blog_body {
border: 1px solid #e6e6e6;
}
.blog .article .blog_contents {
padding: 10px 20px 100px 20px;
}
@media screen and (max-width:768px) {
.blog .article .tit_h4 {
padding: 10px;
text-indent: 0;
background-image: none;
}
.blog .article .blog_info ul {
display: block;
}
} .column .article {
margin-bottom: 20px;
}
.column .article .tit_h4 {
border-bottom: 2px solid #f14b94;
padding: 10px 20px 10px 45px;
background-color: #eee;
background-position: 15px 15px;
text-indent: 0;
margin-bottom: 0;
}
.column .article .tit_h4 a {
color: #292b2c;
}
.column .article .column_thumbnail {
padding: 15px;
}
.column .article .column_info {
border-bottom: 2px dotted #888;
padding: 10px;
}
.column .article .column_info span {
color: #f14b94;
font-weight: bold;
}
.column .article .column_info ul {
display: inline-block;
}
.column .article .column_info ul li {
display: inline;
}
.column .article .column_info .twitter-share-button {
vertical-align: bottom;
}
.column .article .column_body {
border: 1px solid #e6e6e6;
}
.column .article .column_contents {
padding: 5px 15px;
}
.column .article .container{
display: grid;
grid-gap: 10px;
grid-template-columns: 1.5fr 4fr;
grid-template-rows: auto;
}
.column .article .grid{
grid-row: 1 / 3;
}
@media screen and (max-width:768px) {
.column .article .tit_h4 {
padding: 10px;
text-indent: 0;
background-image: none;
}
.column .article .column_info ul {
display: block;
}
.column .article .column_thumbnail {
padding: 5px;
}
.column .article .column_info{
border-bottom: none;
}
.column .article .column_info span {
display:block;
}
.column .article .column_contents {
grid-column: 1 / span 3;
border-top: 1px dotted #888;
}
.column .article .container{
display: grid;
grid-gap: 10px;
grid-template-columns: 1.5fr 3fr;
grid-template-rows: auto;
}
.column .article .grid{
grid-row: 1 / 2;
}
} .price-description {
background-color: #feeef5;
padding: 24px;
margin-bottom: 24px;
border: 1px solid #f14b94;
}
.price-list {
display: flex;
flex-wrap: wrap;
align-items:stretch;
justify-content: space-between;
margin-bottom: 4px;
}
.price-list li {
display: inline-block;
text-align: center;
width: 49%;
box-sizing: border-box;
margin-bottom: 8px;
border: 1px solid #f9b8d5;
}
.price-list li a {
display: block;
margin: 0;
padding: 8px;
font-weight: 700;
color: #f14b94;
text-decoration: none;
font-size: 14px;
}
.price-list li a:hover {
color: #fff;
background-color: #f14b94;
}
.section.price {
padding: 24px 0;
margin: 0;
border-bottom: 1px dotted #ccc;
}
.section.price h3 {
position: relative;
background: none;
background-color: #009245;
padding: 8px 16px;
text-indent: 0;
color: #fff;
font-size: 16px;
box-sizing: border-box;
}
.section.price h3 a {
position: absolute;
top: 12px;
right: 4px;
font-size: 12px;
font-weight: 300;
color: #fff;
}
.section.price .price-subtitle {
color: #009245;
font-size: 15px;
line-height: 1.2;
margin: 32px 0 0;
border-bottom: 1px dotted #009245;
padding: 8px;
}
.section.price .price-table {
border-collapse: collapse;
margin: 16px 0;
width: 100%;
}
.section.price .price-table th,
.section.price .price-table td {
border: 1px solid #f9b7d4;
padding: 8px 16px;
}
.section.price .price-table th {
border: 1px solid #f9b7d4;
background-color: #fde2ee;
}
.section.price .price-table thead th {
font-weight: 700;
text-align: center;
vertical-align: middle;
}
.section.price .price-table td {
vertical-align: middle;
}
.section.price .price-table-example {
border-collapse: collapse;
margin: 16px 0;
width: 100%;
}
.section.price .price-table-example th,
.section.price .price-table-example td {
border: 1px solid #f9bba5;
padding: 8px 16px;
}
.section.price .price-table-example th {
width: 30%;
background-color: #FFFBF0;
}
.section.price .price-table-example thead th {
font-weight: 700;
text-align: center;
color: #f15a24;
}
.section.price .price-table-example td {
width: 70%;
vertical-align: middle;
}
.section.price .price-blog a {
color: #009245;
} @media screen and (max-width: 768px) {
.price-table__wrap{
overflow-x: auto;
}
.price-table__wrap{
margin-top: 16px;
}
.section .price-table__wrap .price-table{
width: 600px;
margin-top: 0;
}
.section .price-table__wrap .price-table,
.section .price-table-example__wrap .price-table-example{
font-size: 13px;
}
.section.price .price-table thead th,
.section.price .price-table tbody th,
.section .price-table-example__wrap .price-table-example th{
text-align: left;
}
}
@media screen and (max-width: 600px) {
.section .price-table__wrap::before{
content: "※横にスクロールできます。";
font-size: 12px;
color: #999
}
} dl.glossary {
margin: 0 0 15px 0;
border: 2px solid #d4e6f5;
background-color: #e5f0f9;
}
dl.glossary dt {
border: 1px solid #ffffff;
font-weight: bold;
padding: 18px 10px 12px 20px;
}
dl.glossary dt a {
display: block;
padding: 18px 10px 12px 20px;
font-weight: bold;
font-size: 116%;
border-bottom: solid 1px #d3e1ef;
}
dl.glossary dd {
margin: 0;
padding: 15px 15px 18px 20px;
background-color: #ffffff;
line-height: 1.8;
}
.glossary-list {
display: table;
width: 100%;
table-layout: fixed;
margin-bottom: 16px;
}
.glossary-list li {
display: table-cell;
text-align: center;
}
.glossary-list li a {
display: block;
margin: 0 2px;
padding: 8px;
border: 1px solid #d4e6f5;
font-weight: 700;
color: #299CD3;
} .merit {
margin: 16px 0;
border-top: 1px dotted #ccc;
padding-top: 16px;
}
.merit dt {
background: url(/image/common/icon_star.svg) no-repeat 0 0;
padding-left: 32px;
font-weight: 700;
font-size: 16px;
color: #306FBA;
}
.merit dd {
border-bottom: 1px dotted #ccc;
padding: 8px 0 16px;
margin: 0 0 16px;
}
.merit li {
list-style: disc;
left: 25px;
position: relative;
}
@media screen and (max-width:768px) {
.merit {
margin: 16px 0;
border-top: 1px dotted #ccc;
padding: 16px;
width: 90%;
}
} .flow-list li {
margin-bottom: 32px;
}
.flow-list .flow-body {
width: 65%;
float: left;
}
.flow-list .flow-label {
display: inline-block;
color: #FFF;
padding: 2px 8px;
background: #4AB74D;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-weight: bold;
}
.flow-list .flow-title {
width: auto;
display: inline-block;
background: none;
text-indent: 0;
margin: 0;
padding: 0 8px;
}
.flow-list .flow-txt {
padding: 16px 0;
}
.flow-list .flow-image {
float: right;
position: relative;
}
.flow-list .flow-image:after {
content: " ";
display: block;
width: 29px;
height: 17px;
background: url(/image/service/flow-arrow.png) no-repeat 0 0;
position: absolute;
bottom: -34px;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
}
.flow-list li:last-child .flow-image:after {
background: none;
}
@media screen and (max-width:768px) {
.flow-list .flow-body {
width: 100%;
float: none;
}
.flow-list .flow-image {
float: none;
}
.flow-list .flow-image img {
width: 100%;
}
} .voice-list li {
width: 320px;
display: inline-block;
margin-right: 10px;
margin-bottom: 16px;
vertical-align: top;
}
.voice-list li:nth-child(even){
margin-right: 0;
}
.voice-list .voice-heading {
padding: 0 40px;
position: relative;
}
.voice-list .voice-title {
font-size: 15px;
font-weight: 700;
color: #f14b94;
position: absolute;
top: 20px;
left: 120px;
}
.voice-list .voice-subtitle {
position: absolute;
top: 40px;
left: 120px;
}
.voice-list .voice-body {
min-height: 120px;
background-color: #ebf9fe;
padding: 24px;
border: 1px solid #d4e6f5;
}
.voice-list .voice-image img {
max-height: 82px;
}
@media screen and (max-width:768px) {
.voice-list li {
width: 100%;
margin: 0 0 16px;
}
.voice-list .voice-image img {
width: 60px;
}
}
.home-center {
border-collapse: collapse;
margin: 16px 0;
width: 100%;
}
.home-center th,
.home-center td {
border: 1px solid #f9b7d4;
padding: 8px 16px;
}
.home-center th {
font-weight: normal;
text-align: left;
border: 1px solid #f9b7d4;
background-color: #fde2ee;
}
.home-center td {
vertical-align: middle;
}
.comment {
font-weight: bold;
text-align: center;
line-height: 1.5;
}
.comment span {
font-size: 17px;
color: #007C0D;
} .contact_bottom .price_banner {
text-align: center;
margin: 10px 0;
}
.contact_bottom .price_banner .btn_primary{
width: 660px;
padding: 15px 0;
}
.contact_bottom #menu{
width: 660px;
}
.contact_bottom #menu ul li {
margin-left: 10px;
margin-top: 10px;
width: 153px;
}
@media screen and (max-width:768px) {
.contact_bottom .price_banner {
text-align: center;
margin: 10px 0;
}
.contact_bottom .price_banner .btn_primary{
width: 100%;
padding: auto;
}
.contact_bottom #menu{
width: auto;
}
} .staff-group {
margin: 0 -16px;
box-sizing: border-box;
}
.staff-group::after {
content: ' ';
clear: both;
display: table;
}
.staff-cell-group {
width: 315px;
width: calc((100% / 2) - 0.1px);
margin-bottom: 24px;
padding: 0 16px;
vertical-align: top;
float: left;
box-sizing: border-box;
}
@media screen and (max-width: 768px) {
.staff-group {
display: block;
}
.staff-cell-group {
width: 100%;
margin: 0 auto;
margin-bottom: 24px;
}
}
.staff-cell-group .staff-circle {
margin: 0 auto 16px;
border-radius: 50%;
background-color: #fff;
width: 200px;
height: 200px;
overflow: hidden;
}
.staff-cell-group .staff-circle img {
width: 200px;
}
.staff-cell-group .staff-name {
font-size: 16px;
display: block;
text-align: center;
color: #009245;
margin: 0 0 8px;
}
.staff-cell-group .staff-description {
min-height: 4.5em;
} .service .service_ .service_list {
display: flex;
justify-content: space-between;
}
.service .service_ .service_list .service_list_img {
width: 43%;
display: block;
}
.service .service_ .service_list ul {
width: 55%;
padding-left: 0;
}
@media screen and (max-width: 768px) {
.service .service_ .service_list {
flex-wrap: wrap;
}
.service .service_ .service_list .service_list_img {
width: 100%;
}
.service .service_ .service_list ul {
width: 100%;
}
} .comparison .comparison-table table {
border-collapse: collapse;
margin: 16px 0;
width: 100%;
font-size: 12px;
}
.comparison .comparison-table th {
background-color: #FFFBF0;
}
.comparison .comparison-table td {
vertical-align: middle;
width: 25%;
}
.comparison .comparison-table .price_compe td {
text-align: right;
}
.comparison .comparison-table .pricelist td {
text-align: center;
width: 30%;
}
.comparison .comparison-table td span {
font-weight: bold;
}
.comparison .comparison-table th,
.comparison .comparison-table td {
border: 1px solid #f9bba5;
padding: 8px 16px;
}
@media screen and (max-width: 768px) {
.comparison .comparison-table td {
width: 25%;
}
}  .page-index {
background-color: #cce9da;
border: 1px solid #009245;
border-radius: 5px;
width: 80%;
padding: 20px;
margin-bottom: 30px;
}
.page-index__title {
font-weight: bold;
color: #009245;
font-size: 20px;
}
.page-index__content {
margin: 10px 0;
color: #009245;
}
.page-index__content li::before {
content: "●";
color: #009245;
}
.page-index__content li.h3 {
padding-left: 30px;
}
.page-index__content li.h3::before {
content: "・";
color: #009245;
}
.page-index a {
color: #009245;
}
@media screen and (max-width: 768px) {
#setsumei1,
#setsumei2,
#setsumei3,
#setsumei4,
#setsumei5,
#setsumei6,
#setsumei7,
#setsumei8,
#index-01,
#index-02,
#index-03,
#index-04,
#index-05,
#index-06,
#index-07,
#index-08,
#index-09,
#index-10,
#index-11,
#index-12,
#index-13,
#index-14,
#index-15,
#index-16,
#index-17,
#index-18,
#index-19,
#index-20,
#index-21,
#index-22,
#index-23,
#index-24 {
margin-top: -90px;
padding-top: 90px;
}
.page-index {
margin: 0 auto 10px;
}
}
html {scroll-behavior: smooth;}  .comparison.comparison-table table {
border-collapse: collapse;
margin: 16px 0;
width: 100%;
font-size: 12px;
}
.comparison.comparison-table th {
background-color: #FFFBF0;
}
.comparison.comparison-table td {
vertical-align: middle;
width: 25%;
}
.comparison.comparison-table .price_compe td {
text-align: right;
}
.comparison.comparison-table .pricelist td {
text-align: center;
width: 30%;
}
.comparison.comparison-table td span {
font-weight: bold;
}
.comparison.comparison-table th,
.comparison.comparison-table td {
border: 1px solid #f9bba5;
padding: 8px 16px;
}
@media screen and (max-width: 768px) {
.comparison.comparison-table td {
width: 25%;
}
}  #mainarea_intro ul {
display: inline-flex;
flex-wrap: wrap;
margin: 10px 0;
}
#mainarea_intro ul li {
width: 50%;
margin-bottom: 5px;
}
#mainarea_intro span {
font-size: 1.17em;
font-weight: bold;
}
@media screen and (max-width: 768px) {
#mainarea_intro ul li {
width: 100%;
}
} .column .article .column_info .column-date__published,
.column .article .column_info .column-date__modified{
color: inherit;
font-weight: normal;
font-size: .9545em;
margin-right: .5em;
}
.column .article .column_info .column-date__published{
margin-right: 1.5em;
}
@media screen and (max-width: 768px) {
.column .article .column_info .column-date__published,
.column .article .column_info .column-date__modified{
display: inline-block;
}
.column-cat{
margin-top: 5px;
}
} .payment-box__wrap{
position: relative;
margin-bottom: 30px;
}
.payment-box__wrap .payment-box__msg{
margin-bottom: 10px;
font-weight: bold;
color: #e08300;
}
.payment-box{
display: flex;
flex-flow: wrap;
justify-content: space-between;
}
.payment-box .payment-box__item{
box-sizing: border-box;
width: 49%;
border: solid 1px #7c7c7c;
border-radius: 5px;
margin-bottom: 10px;
}
.payment-box .payment-box__item__bank{
width: 100%;
}
.payment-box .payment-box__item h4{
text-align: center;
background: #7c7c7c;
color: #fff;
font-weight: bold;
font-size: 18px;
margin: 0;
padding: 3px 0;
}
.payment-box__item__inner{
padding: 20px;
}
.payment-box .payment-box__item .payment-box__item__list{
display: flex;
justify-content: space-evenly;
align-items: end;
margin: 0 0 20px;
padding: 0;
}
.payment-box .payment-box__item__qr .payment-box__item__list{
margin-top: 15px;
margin-bottom: 30px;
}
.payment-box .payment-box__item .payment-box__item__list:last-child,
.payment-box .payment-box__item__qr .payment-box__item__list:last-child{
margin-bottom: 0;
}
.payment-box .payment-box__item .payment-box__item__list li{ margin-right: 5px; }
.payment-box .payment-box__item .payment-box__item__list li:last-child{ margin-right: 0; }
.payment-box__item__list li img{
width: 50px;
object-fit: contain;
}
.payment-box__item__list .payment-familymart img{ width: 120px; }
.payment-box__item__list .payment-poplar img,
.payment-box__item__list .payment-paypay img,
.payment-box__item__list .payment-aupay img,
.payment-box__item__list .payment-bankpay img,
.payment-box__item__list .payment-linepay img{
width: 100px;
}
.payment-box__item__list .payment-touch img{
width: 30px;
}
.payment-box__item__list .payment-dayly-y img,
.payment-box__item__list .payment-d img,
.payment-box__item__list .payment-merpay img{
width: 80px;
}
.payment-box__item__list .payment-rakutenpay img{
width: 70px;
}
.payment-box__item__list .payment-ministop img{
width: 60px;
}
.payment-box__item__list .payment-pitapa img{
width: 40px;
}
.payment-box__item__qr .payment-box__item__list:nth-child(2){
justify-content: space-between;
}
.payment-box__item__bank .payment-box__item__txt{
padding: 0 20px;
display: flex;
justify-content: space-between;
width: 290px;
margin: 0 auto;
}
.payment-box__item__bank .payment-box__item__txt .payment-box__item__txt__inner{
display: flex;
justify-content: center;
align-items: center;
}
.payment-box__item__txt__inner img{
margin-left: 10px;
}
@media screen and (max-width: 768px) {
.payment-box{
flex-direction: column;
}
.payment-box .payment-box__item{
width: 100%;
max-width: 400px;
margin-left: auto;
margin-right: auto;
}
} .area-svc-list__wrap{
margin-bottom: 30px;
}
.area-svc-list{
display: flex;
flex-wrap: wrap;
margin-left: 10px;
}
.area-svc-list li{
position: relative;
box-sizing: border-box;
width: 205px;
margin: 0 10px 15px 0;
border: 2px solid #009245;
border-radius: 6px;
background-color:rgba(255,255,255,0.3);
background-blend-mode:lighten;
}
.area-svc-list li a{
display: block;
text-align: center;
text-decoration: none;
}
.area-svc-list__item{
border-radius: 6px;
}
.area-svc-list__toilet .area-svc-list__item{
background-image: url(//nara-mizu-sapo.com/image/service/toilet_bg.jpg);
background-position: center center;
}
.area-svc-list__kitchen .area-svc-list__item{
background-image: url(//nara-mizu-sapo.com/image/service/kitchen_bg.jpg);
background-position: center center;
}
.area-svc-list__bathroom .area-svc-list__item{
background-image: url(//nara-mizu-sapo.com/image/service/bathroom_bg.jpg);
background-position: center center;
}
.area-svc-list__washroom{
background-image: url(//nara-mizu-sapo.com/image/service/service_senmen_bg.png);
background-position: left top;
}
.area-svc-list__faucet{
background-image: url(//nara-mizu-sapo.com/image/service/washroom_bg.jpg);
background-position: center center;
}
.area-svc-list__overflow{
background-image: url(//nara-mizu-sapo.com/image/service/overflow_bg.jpg);
background-position: center bottom;
}
.area-svc-list__item__title{
padding: 10px;
background-color: #009245;
color: #fff;
font-size: 1.2rem;
line-height: 1.2;
font-weight: bold;
}
.area-svc-list__svc-type{
font-size: 1.6rem;
}
.area-svc-list__overflow .area-svc-list__svc-type{
font-size: 1.6rem;
}
.area-svc-list__svc-type,
.area-svc-list__svc-price,
.area-svc-list__link-arw{
display: block;
}
.area-svc-list__svc-price{
font-size: 3.2rem;
font-family: 'arial black', sans-serif;
padding-top: 20px;
letter-spacing: -.05em;
line-height: 1.2;
font-weight: bold;
color: #f14b94;
-webkit-text-stroke: 1px #fff; text-shadow: 1px 1px 3px rgba(0,0,0,0.5); }
.area-svc-list__svc-price_num{
}
.area-svc-list__link-arw{
color: #fff;
text-shadow: 1px 1px 3px rgba(0,0,0,0.75); }
.area-svc-list__link-arw{
font-size: 1.1rem;
text-align: right;
display: block;
padding: 10px 10px 5px;
background: linear-gradient(to top, rgba(0,0,0,.25), rgba(0,0,0,0));
font-weight: bold;
}
.area-svc-list__link-arw::after {
content: "";
display: inline-block;
vertical-align: baseline;
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 10px solid white;
margin-left: 6px;
}
@media screen and (max-width: 768px) {
.area-svc-list{
justify-content: center;
}
.area-svc-list li{
width: 160px;
}
.area-svc-list__svc-type{
font-size: 1.4rem;
}
.area-svc-list__item__title,
.area-svc-list__overflow .area-svc-list__svc-type{
font-size: 1.2rem;
}
.area-svc-list__overflow .area-svc-list__item__title{
font-size: 1.0rem;
}
.area-svc-list__svc-price{
font-size: 2.8rem;
}
} #mainarea_intro .link-list__marea{
display: flex;
margin-left: 2%;
}
#mainarea_intro .link-list__marea li{
box-sizing: border-box;
width: 49%;
margin-bottom: 10px;
background: url(/image/common/icon_check.png) 0 3px no-repeat;
padding-left: 18px;
}
#mainarea_intro .link-list__marea li a{
display: block;
}
#mainarea_intro .link-list__tarea{
display: flex;
flex-wrap: wrap;
margin-left: 2%;
}
#mainarea_intro .link-list__tarea li{
width: 23%;
margin-right: 2%;
}
#mainarea_intro .link-list__tarea li:nth-child(4n){
margin-right: 0;
}
#mainarea_intro .link-list__tarea li a{
box-sizing: border-box;
display: block;
padding: 10px 10px;
background-color: #009245;
color: #fff;
text-align: center;
border-radius: 6px;
font-size: 1.2rem;
line-height: 1;
}
@media screen and (max-width: 768px) {
#mainarea_intro .link-list__marea{
flex-direction: column;
}
#mainarea_intro .link-list__marea li{
width: auto;
}
#mainarea_intro .link-list__tarea li{
width: 48%;
margin-right: 2%;
}
#mainarea_intro .link-list__tarea li:nth-child(2n){
margin-right: 2%;
}
} .link-cta__area-svc{
margin: 30px 20px;
}
.link-cta__area-svc__btn {
position: relative;
padding-left: 20px;
font-size: 1.4rem;
}
.link-cta__area-svc__btn::before {
content: "";
position: absolute;
top: 5px;
left: 0;
border-left: 10px solid #f9b7d4;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
margin-right: 5px; }
.link-cta__area-svc__btn a{
text-decoration: underline;
} .embed-map__wrap {
position: relative;
width: 100%;
padding-top: 56.25%;
height: 0;
}
.embed-map__wrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} .maker-box {
margin: 40px 0 60px;
}
.maker-box__list{
display: flex;
flex-wrap: wrap;
align-items:center;
gap: 20px;
}
.maker-box__list li img{
max-height: 25px;
width: auto;
}
@media screen and (max-width: 768px) {
.maker-box__list{
gap: 10px;
}
.maker-box__list li img{
max-height: 18px;
}
}  .column_contents ul,
.column_contents ol{
margin: 1em 0 1.5em 1.5em;
padding-left: 0;
}
.column_contents ul{
list-style-type: disc;
}
.column_contents ul > li,
.column_contents ol > li{
margin-bottom: .5em;
}
.column_contents ul > li:last-child,
.column_contents ol > li:last-child{
margin-bottom: 0;
} .txt__red{
color: #d6442e;
font-weight: 700;
}
.txt__blue{
color: #0aaedb;
font-weight: 700;
}
.txt__green{
color: #428f4f;
font-weight: 700;
}
.txt__orange{
color: #e08300;
font-weight: 700;
}
.txt__yellow-line{
text-decoration: underline;
text-underline-offset: -0.2em;
text-decoration-thickness: 0.5em;
text-decoration-color: rgba(255, 228, 0, 0.4);
text-decoration-skip-ink: none;
} .txt__lightbulb {
position: relative;
margin: 1em 1em 1.5em 2em;
padding: 10px 10px 10px 50px;
border: 2px solid #dfdfdf;
background-color: #fffbf4;
border-radius: 6px;
}
.txt__lightbulb::before{
content: "";
position: absolute;
top: 7px;
left: 10px;
width: 16px;
height: 16px;
padding: 6px;
background-image: url(//nara-mizu-sapo.com/image/common/icon_lightbulb.png);
background-size: 22px;
background-color: #ffbe00;
background-repeat: no-repeat;
background-position: center center;
border-radius: 100%;
}
@media screen and (max-width: 768px) {
.txt__lightbulb{
margin-left:1em;
}
} .txt__link,
.txt__link__outbound {
position: relative;
margin: 2.5em 1em 1.5em 2em;
padding: 10px;
background-color: #fffbf4;
border-radius: 0 6px 6px 6px;
font-size: 1.4rem;
}
.txt__link{
border: 2px solid #428f4f;
}
.txt__link__outbound {
border: 2px solid #0075c1;
}
.txt__link a,
.txt__link__outbound a{
position: relative;
display: inline-block;
margin-bottom: 10px;
padding-left: 20px;
border-radius: 0 6px 6px 6px;
font-size: 1.4rem;
}
.txt__link__outbound a{
color: #0075c1;
}
.txt__link__outbound a:hover {
color: #015890;
}
.txt__link a:last-child,
.txt__link__outbound a:last-child{
margin-bottom: 0;
}
.txt__link a::before,
.txt__link__outbound a::before{
content: "";
display: block;
position: absolute;
top: 6px;
left: 0;
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
margin-right: 10px;
}
.txt__link a::before{
border-left: 10px solid #428f4f;
}
.txt__link__outbound a::before{
border-left: 10px solid #0075c1;
}
.txt__link span,
.txt__link__outbound span{
position: absolute;
top: -22px;
left: -2px;
box-sizing: border-box;
width: auto;
height: 22px;
padding: 3px 16px 3px 32px;
background-size: 16px;
background-repeat: no-repeat;
background-position: 8px center;
border-radius: 6px 6px 0 0;
font-size: 12px;
color: #fff;
}
.txt__link span{
background-image: url(//nara-mizu-sapo.com/image/common/icon_link.png);
background-color: #428f4f;
}
.txt__link__outbound span{
background-image: url(//nara-mizu-sapo.com/image/common/icon_outbound.png);
background-color: #0075c1;
}
@media screen and (max-width: 768px) {
.txt__link,
.txt__link__outbound{
margin-left:1em;
}
} .column_contents  blockquote{
position: relative;
margin: 2em 1em;
padding: 20px 20px 20px 70px;
background-color: #f7f7f7;
}
.column_contents  blockquote::before{
content: "";
position: absolute;
top: 10px;
left: 10px;
display: block;
width: 50px;
height: 50px;
background-image: url(//nara-mizu-sapo.com/image/common/icon_quote.png);
background-size: contain;
transform: rotate(180deg)
}
@media screen and (max-width: 768px) {
.column_contents  blockquote{
margin: 2em 1em;
padding: 30px 20px 10px 20px;
background-color: #f7f7f7;
}
.column_contents  blockquote::before{
top: -15px;
left: 5px;
width: 40px;
height: 40px;
}
} .column_contents table{
margin: 1em;
padding: 0;
word-break: break-all;
word-wrap: break-word;
border-collapse: collapse;
border-spacing: 0;
}
.column_contents table th,
.column_contents table td{
padding: .5em .75em;
vertical-align: top;
border: 1px solid #ddd;
}
.column_contents table th{
background: #f7f7f7;
border: 1px solid #ddd;
color: #505050;
text-align: center;
} @media screen and (max-width: 600px) {
.column_contents .table__scroll::before{
content: "※横にスクロールできます。";
font-size: 12px;
color: #999
}
.column_contents .table__scroll{
overflow-x: auto;
}
.column_contents .table__scroll table{
width: 600px;
margin: 1em 0;
}
} .column_contents .w05{ width: 5%; }
.column_contents .w10{ width: 10%; }
.column_contents .w15{ width: 15%; }
.column_contents .w20{ width: 20%; }
.column_contents .w25{ width: 25%; }
.column_contents .w30{ width: 30%; }
.column_contents .w35{ width: 35%; }
.column_contents .w40{ width: 40%; }
.column_contents .w45{ width: 45%; }
.column_contents .w50{ width: 50%; }
.column_contents .w55{ width: 55%; }
.column_contents .w60{ width: 60%; }
.column_contents .w65{ width: 65%; }
.column_contents .w70{ width: 70%; }
.column_contents .w75{ width: 75%; }
.column_contents .w80{ width: 80%; }
.column_contents .w85{ width: 85%; }
.column_contents .w90{ width: 90%; }
.column_contents .w95{ width: 95%; }
.column_contents .w100{ width: 100%; } .column_contents .column__ol,
.column_contents .column__ul{
margin: 1em 1em 1.5em;
padding: 20px;
list-style: none;
border: 2px solid #dfdfdf;
border-radius: 6px;
}
.column_contents .column__ol{
counter-reset:column__ol;
}
.column_contents .column__ol li,
.column_contents .column__ul li{
position: relative;
margin-left: 0;
}
.column_contents .column__ol li{
margin-bottom: 1em;
padding-left: 30px;
}
.column_contents .column__ul li{
margin-bottom: .5em;
padding-left: 20px;
}
.column_contents .column__ol li:last-child,
.column_contents .column__ul li:last-child{
margin-bottom: 0;
}
.column_contents .column__ol li::before{
counter-increment: column__ol;
content: counter(column__ol);
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
background: #acacac;
text-align: center;
color: #fff;
font-size: 14px;
border-radius: 100%;
}
.column_contents .column__ul li::before{
content: "";
position: absolute;
top: 5px;
left: 0;
width: 10px;
height: 10px;
background: #acacac;
border-radius: 100%;
} .icon__arw{
margin-bottom: 10px;
background: url(/image/common/icon_check.png) 0 3px no-repeat;
padding-left: 18px;
} .video-thumb__wrap {
display: block;
position: relative;
}
.video-thumb__wrap::before,
.video-thumb__wrap::after{
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.video-thumb__wrap::before{
width: 80px;
aspect-ratio: 1; 
background-color: rgb(0 0 0 / .5);
border-radius: 50%;
}
.video-thumb__wrap::after{
margin-left: 5px;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-left: 32px solid #fff;
}
@media screen and (max-width: 768px) {
.video-thumb__wrap::before{
width: 60px;
}
.video-thumb__wrap::after{
margin-left: 3px;
border-top: 15px solid transparent;
border-bottom: 15px solid transparent;
border-left: 24px solid #fff;
}
}