@charset "UTF-8";
@charset "UTF-8";
@charset "UTF-8";


.is-fs_title {
font-size: 24px !important;
font-weight: 700 !important;
line-height: 36px !important;
}
@media screen and (max-width: 590px) {
.is-fs_title {
font-size: 20px !important;
font-weight: 700 !important;
line-height: 30px !important;
}
}
.is-fs_catch {
font-size: 34px !important;
font-weight: 200 !important;
line-height: 58px !important;
}
@media screen and (max-width: 590px) {
.is-fs_catch {
font-size: 22px !important;
font-weight: 300 !important;
line-height: 34px !important;
}
}
.is-fs_read {
font-size: 20px !important;
font-weight: 600 !important;
line-height: 34px !important;
}
@media screen and (max-width: 590px) {
.is-fs_read {
font-size: 16px !important;
font-weight: 600 !important;
line-height: 28px !important;
}
}
.is-fs_text {
font-size: 18px !important;
font-weight: 400 !important;
line-height: 32px !important;
}
@media screen and (max-width: 590px) {
.is-fs_text {
font-size: 16px !important;
font-weight: 400 !important;
line-height: 28px !important;
}
}
.is-fs_remark {
font-size: 14px !important;
font-weight: 400 !important;
line-height: 24px !important;
}
@media screen and (max-width: 590px) {
.is-fs_remark {
font-size: 12px !important;
font-weight: 400 !important;
line-height: 20px !important;
}
}
a {
color: #000000;
text-decoration: none;
cursor: pointer;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
a:hover {
text-decoration: none;
filter: alpha(opaCity=70);
-moz-opaCity: 0.7;
opacity: 0.7;
}
a:hover img {
opaCity: 0.7;
filter: alpha(opaCity=70);
}
.button {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.button {
font-size: 14px;
font-weight: normal;
}
}
.button.more {
position: relative;
}
.button.more::before, .button.more::after {
position: absolute;
transition-duration: 0.3s;
right: 20px;
top: 50%;
transform: translateY(-50%);
content: "";
}
.button.more::before {
width: 45px;
height: 1px;
background-color: #000;
}
.button.more::after {
border-left: 6px solid #000;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button.more:hover::before {
width: 55px;
right: 10px;
}
.button.more:hover::after {
right: 10px;
}
@media screen and (max-width: 590px) {
.button.more::before, .button.more::after {
right: 10px;
}
.button.more::before {
width: 20px;
}
.button.more:hover::before {
width: 25px;
right: 10px;
}
}
.button.white {
background-color: #fff;
border: 1px solid #000;
}
.button.white:hover {
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
}
.button.white:hover::before {
background-color: #fff;
}
.button.white:hover::after {
border-left: 6px solid #fff;
}
.button.border-w {
border: 1px solid #fff;
}
.button.back {
position: relative;
}
.button.back::before, .button.back::after {
position: absolute;
transition-duration: 0.3s;
left: 20px;
top: 50%;
transform: translateY(-50%);
content: "";
}
.button.back::before {
width: 45px;
height: 1px;
background-color: #000;
}
.button.back::after {
border-right: 6px solid #000;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button.back:hover::before {
width: 55px;
left: 10px;
background-color: #000;
}
.button.back:hover::after {
border-left: transparent;
left: 10px;
}
@media screen and (max-width: 590px) {
.button.back::before {
width: 20px;
}
.button.back:hover::before {
width: 25px;
left: 10px;
}
}
.button.grade {
color: #fff;
}
.button.grade.denki {
background: linear-gradient(90deg, #f09138, #f25a3e);
}
.button.grade.gas {
background: linear-gradient(90deg, #00b089, #088d74);
}
.button.grade.hikari {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.button.grade.water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.button.grade.other {
background: linear-gradient(90deg, #ffaa36, #ff5340);
}
.button.grade.application {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.button.grade.application:hover {
border: solid 1px #ff903e;
background: #fff;
color: #ff903e;
opacity: 1 !important;
}
.button.grade.application:hover::before {
background-color: #ff903e;
}
.button.grade.application:hover::after {
border-left: 6px solid #ff903e;
}
@media screen and (max-width: 590px) {
.button.grade.application {
font-weight: 700;
}
}
.button.grade.more::before {
width: 45px;
height: 1px;
background-color: #fff;
}
.button.grade.more::after {
border-left: 6px solid #fff;
}
@media screen and (max-width: 590px) {
.button.grade.more::before {
width: 20px;
}
}
.button.no-border {
text-align: left !important;
padding-right: 60px;
font-size: 17px;
}
.button.no-border::before {
background-color: #4692ff;
}
.button.no-border::after {
border-left: 6px solid #4692ff;
}
.button-triangle {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: 50px;
align-items: center;
color: #fff;
border: 1px solid;
}
.button-triangle span {
margin-top: 4px;
line-height: 1;
}
.button-triangle::after {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
font-family: "Font Awesome 5 Free";
content: "\f0da";
font-weight: 900;
}
.button-blue {
color: #fff;
background-color: #85c5e6;
}
.button-blue::before {
width: 35px;
background-color: #fff !important;
}
.button-blue::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button-blue:hover {
color: #fff;
}
.button-blue:hover::before {
width: 45px;
}
.button-dark_blue {
margin-right: 20px !important;
color: #fff;
background-color: #2d77c1;
}
.button-dark_blue::before {
background-color: #fff !important;
}
.button-dark_blue::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button-dark_blue:hover {
color: #fff;
}
.button.contact_01 {
margin: 20px 0;
width: 30%;
}
.news__button_rect::before, .column__button_rect::before {
width: 35px;
background-color: #fff !important;
}
.news__button_rect::after, .column__button_rect::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
#top .news__button_rect, #top .column__button_rect {
background-color: #85c5e6;
border-color: #85c5e6;
color: white;
}
#denki-top .news__button_rect, #denki-top .column__button_rect {
background-color: #fe5c52;
border-color: #fe5c52;
color: white;
}
#gas-top .news__button_rect, #gas-top .column__button_rect {
background-color: #00d099;
border-color: #00d099;
color: white;
}
#hikari-top .news__button_rect, #hikari-top .column__button_rect {
background-color: #ff8b40;
border-color: #ff8b40;
color: white;
}
#water-top .news__button_rect, #water-top .column__button_rect {
background-color: #11a9Da;
border-color: #11a9Da;
color: white;
}
#it-top .news__button_rect, #it-top .column__button_rect {
background-color: #c86f98;
border-color: #c86f98;
color: white;
}
.button-triangle:hover {
background-color: #fff !important;
}
.headline_1 {
padding-bottom: 16px;
font-size: 24px;
font-weight: bold;
text-align: center;
line-height: 1.5em;
letter-spacing: 2px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: 100px auto;
background-position: center bottom;
}
.headline_1.denki {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/headline_1_line.svg);
}
.headline_1.hikari {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/headline_1_line.svg);
}
.headline_1.gas {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/headline_1_line.svg);
}
.headline_1.water {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.headline_1.other {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/privilege/headline_1_line.svg);
}
@media screen and (max-width: 590px) {
.headline_1 {
font-size: 20px;
}
}
#hikari-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/headline_1_line.svg);
}
#gas-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/headline_1_line.svg);
}
#water-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.headline_2 {
font-size: 34px;
line-height: 1.8em;
font-weight: 200;
}
.headline_2.is-denki_lead {
font-size: 22px;
font-weight: 700;
color: #ff4c40;
}
@media screen and (max-width: 590px) {
.headline_2 {
font-size: 22px;
line-height: 1.5em;
}
}
#denki-top .headline_2 {
font-size: 34px;
line-height: 1.8em;
font-weight: lighter;
}
#denki-top .headline_2.is-denki_lead {
font-size: 34px;
font-weight: 200;
color: #ff4c40;
}
@media screen and (max-width: 590px) {
#denki-top .headline_2.is-denki_lead {
font-size: 22px;
font-weight: 300;
}
}
.headline_3 {
font-size: 32px;
letter-spacing: 2px;
font-weight: bold;
}
.headline_3 span {
display: block;
font-size: 12px;
font-weight: bold;
}
.headline_4 {
font-size: 32px;
letter-spacing: 2px;
}
.headline_4 span {
display: block;
font-size: 16px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.headline_4 {
font-size: 24px;
letter-spacing: 1px;
}
.headline_4 span {
font-size: 14px;
}
}
.headline_5 {
font-size: 58px;
font-family: "Dancing Script", cursive;
text-align: center;
}
.headline_5 div {
margin: 0;
display: inline-block;
}
.headline_5 span {
display: block;
font-size: 16px;
font-weight: bold;
text-align: right;
}
@media screen and (max-width: 590px) {
.headline_5 {
font-size: 32px;
}
.headline_5 span {
margin-top: 10px;
font-size: 14px;
}
}
.headline_6 {
position: relative;
padding-top: 80px;
font-size: 34px;
letter-spacing: 2px;
text-align: center;
}
.headline_6 > span {
margin-top: 10px;
display: block;
font-size: 16px;
font-weight: bold;
}
.headline_6::before {
position: absolute;
left: 50%;
top: 0;
width: 1px;
height: 60px;
content: "";
}
.headline_6.denki span {
color: #f09138;
}
.headline_6.denki::before {
background-color: #f09138;
}
.headline_6.hikari span {
color: #ffc531;
}
.headline_6.hikari::before {
background-color: #ffc531;
}
.headline_6.gas span {
color: #00b089;
}
.headline_6.gas::before {
background-color: #00b089;
}
.headline_6.water span {
color: #0196f9;
}
.headline_6.water::before {
background-color: #0196f9;
}
.headline_6.other span {
color: #fd8881;
background: linear-gradient(90deg, #ff4c40, #a96f98, #0097fb);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
}
.headline_6.other::before {
background: linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.headline_6.other2 span {
color: #494949;
}
.headline_6.other2::before {
background-color: #494949;
}
@media screen and (max-width: 590px) {
.headline_6 {
padding-top: 40px;
font-size: 26px;
}
.headline_6::before {
height: 30px;
}
}
.headline_7 {
font-size: 20px;
font-weight: bold;
line-height: 1.5em;
}
.headline_7.denki {
color: #551d00;
}
.headline_7.hikari {
color: #746216;
}
.headline_7.gas {
color: #00b089;
}
.headline_7.water {
color: #175190;
}
.headline_8 {
font-size: 28px;
line-height: 2em;
}
@media screen and (max-width: 960px) {
.headline_8 {
font-size: 24px;
}
}
@media screen and (max-width: 590px) {
.headline_8 {
font-size: 20px;
line-height: 1.5em;
}
}
.kome {
text-align: left;
font-size: 14px;
text-indent: -1em;
padding-left: 1em;
opacity: 0.8;
vertical-align: super;
}
.kome.half {
padding-left: 0;
}
.note {
font-size: 14px;
opacity: 0.8;
}
.new {
margin-right: 5px;
width: 50px;
height: 20px;
line-height: 20px;
border-radius: 30px;
background-color: #ff6864;
color: #fff;
font-size: 11px;
font-weight: normal;
text-align: center;
}
.text-blue {
color: blue;
}
.tab-wrap {
position: relative;
display: flex;
flex-wrap: wrap;
background-color: #fff;
}
.tab-wrap_sp-only {
display: none;
}
.tab {
display: none;
}
.tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked + label {
position: relative;
color: #fff;
background-color: #333;
cursor: default;
}
.tab:checked + label:hover {
background-color: #333;
}
.tab:checked + label::after {
position: absolute;
bottom: -14px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #333;
content: "";
}
.tab + label {
display: flex;
justify-content: center;
align-items: center;
flex-grow: 3;
text-align: center;
user-select: none;
text-align: center;
width: 50%;
height: 60px;
color: #333;
font-weight: bold;
background-color: #fff;
border-top: 4px solid #333;
border-left: 2px solid #333;
border-bottom: 4px solid #333;
border-right: 2px solid #333;
cursor: pointer;
transition: transform 1s ease-in-out 0s;
-moz-transition: -moz-transform 1s ease-in-out 0s;
-webkit-transition: -webkit-transform 1s ease-in-out 0s;
}
.tab + label.first {
border-left: 4px solid #333;
}
.tab + label.last {
border-right: 4px solid #333;
}
.tab + label span {
position: relative;
line-height: 1;
}
.tab + label span::after {
position: absolute;
left: -45px;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 35px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
content: "";
}
.tab + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_2.svg);
}
.tab + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
.tab + label span.tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
.tab + label span.tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
.tab + label:hover {
background-color: #f9f9f9;
}
.tab:checked + label .tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab:checked + label .tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_1.svg);
}
.tab:checked + label .tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.tab:checked + label .tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.tab:not(:checked) + label:hover {
background-color: #333;
color: #fff;
}
.tab:not(:checked) + label:hover .tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab:not(:checked) + label:hover .tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_1.svg);
}
.tab:not(:checked) + label:hover .tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.tab:not(:checked) + label:hover .tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.tab__content {
position: absolute;
left: 0;
padding: 40px;
width: 100%;
background-color: transparent;
z-index: -1;
opacity: 0;
transform: translateY(-3px);
display: none;
}
@media screen and (max-width: 960px) {
.tab-wrap {
display: none;
}
.tab-wrap_sp-only {
display: block;
}
.tab-wrap_sp-only__list {
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.tab-wrap_sp-only__item {
display: inline-block;
width: 90%;
white-space: pre-line;
background-color: #fff;
vertical-align: top;
}
.tab-wrap_sp-only__title {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 70px;
color: #fff;
text-align: center;
background-color: #444;
}
.tab-wrap_sp-only__title span {
line-height: 1.2em;
}
.tab-wrap_sp-only__title::after {
position: absolute;
left: 10px;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 35px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
content: "";
}
.tab-wrap_sp-only__title.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab-wrap_sp-only__title.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
}
.fadein {
visibility: hidden;
}
@media screen and (max-width: 590px) {
.fadein {
visibility: visible;
}
}
@media screen and (min-width: 591px) {
.css-fadeUp_1.fadeInUp {
visibility: visible; animation-name: fade-in-up_1; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0; animation-fill-mode: both;
} @keyframes fade-in-up_1 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.css-fadeUp_2.fadeInUp {
visibility: visible; animation-name: fade-in-up_2; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0.25s; animation-fill-mode: both;
} @keyframes fade-in-up_2 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.css-fadeUp_3.fadeInUp {
visibility: visible; animation-name: fade-in-up_3; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0.5s; animation-fill-mode: both;
} @keyframes fade-in-up_3 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.fadein {
visibility: hidden;
}
.css-fade_1.fadeInUp {
visibility: visible; animation-name: fade-in_1; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.25s; animation-fill-mode: both;
} @keyframes fade-in_1 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
.css-fade_2.fadeInUp {
visibility: visible; animation-name: fade-in_2; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.5s; animation-fill-mode: both;
} @keyframes fade-in_2 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
.css-fade_3.fadeInUp {
visibility: visible; animation-name: fade-in_3; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.75s; animation-fill-mode: both;
} @keyframes fade-in_3 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
}
.bold {
font-weight: bold;
}
.is-note_sans {
font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
}
.brpc {
display: block;
}
@media screen and (max-width: 590px) {
.brpc {
display: none;
}
}
.brtab {
display: none;
}
@media screen and (max-width: 960px) {
.brtab {
display: block;
}
}
.brsp {
display: none;
}
@media screen and (max-width: 590px) {
.brsp {
display: block;
}
}
@media screen and (max-width: 590px) {
.is-text-justify {
text-align: justify !important;
text-justify: inter-character !important;
}
}
.is-inbox_justify {
text-align: justify !important;
text-justify: inter-character !important;
}  @font-face {
font-family: "Trebuchet MS";
font-style: normal;
font-weight: normal;
src: local("../font/Trebuchet MS"), url(//marutto.co.jp/wp-content/themes/marutto/app/fonts/trebuc.woff) format("woff");
}       .l-footer {
width: 100%;
height: auto;
padding-top: 40px;
position: relative;
background-color: #333;
clear: both;
z-index: 1;
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
}
.l-footer figure {
margin: 0;
padding: 0;
}
.l-footer__inner {
width: 100%;
height: auto;
margin: 0 auto;
}
.l-footer .m-footer_main {
content: "";
width: 100%;
height: auto;
}
.l-footer .m-footer_main__inner {
width: calc(100% - 40px);
display: flex;
padding-bottom: 35px;
}
@media screen and (max-width: 991.98px) {
.l-footer .m-footer_main__inner {
flex-direction: column;
padding-bottom: 0px;
margin: 0px auto;
}
}
.l-footer .m-footer_foot {
background-color: #585858;
content: "";
width: 100%;
height: auto;
padding: 24px 0;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer_foot {
background-color: #333;
padding-bottom: 30px;
}
}
.l-footer .m-footer_foot__inner {
width: calc(100% - 40px);
margin: 0 auto;
display: flex;
min-height: 60px;
height: auto;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer_foot__inner {
flex-direction: column;
}
}
.l-footer .m-footer__img {
content: "";
display: inline-block;
width: 140px;
margin-left: 50px;
}
@media screen and (max-width: 991.98px) {
.l-footer .m-footer__img {
margin-left: 0px;
}
}
.l-footer .m-footer__img__inner {
content: "";
display: block;
height: 62px;
width: 94px;
background-position: center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/footer/marutto_logo_tate_w.svg);
background-size: contain;
}
.l-footer .m-footer__links {
width: calc(68% - 170px);
}
@media screen and (max-width: 991.98px) {
.l-footer .m-footer__links {
width: 100%;
}
}
.l-footer .m-footer__links__wrap {
display: flex;
flex-wrap: wrap;
margin: 0;
}
.l-footer .m-footer__links__wrap .m-links_item {
width: 25%;
min-width: 137px;
margin-bottom: 30px; }
@media screen and (max-width: 767.98px) {
.l-footer .m-footer__links__wrap .m-links_item {
margin-bottom: 0;
width: 50%;
padding: 10px 0px 30px;
min-width: unset;
}
}
.l-footer .m-footer__links__wrap .m-links_item .menu .menu-item a {
display: block;
line-height: 1;
color: #fff;
font-size: 12px;
padding: 5px 0px;
}
@media screen and (max-width: 767.98px) {
.l-footer .m-footer__links__wrap .m-links_item .menu .menu-item a {
font-size: 11px;
}
}
.l-footer .m-footer__links__wrap .m-links_item .menu .menu-item.is-menu-title a {
display: block;
color: #fff;
font-size: 14px;
margin-bottom: 5px;
font-weight: bold;
}
.l-footer .m-footer__sublinks {
width: 32%;
}
@media screen and (max-width: 991.98px) {
.l-footer .m-footer__sublinks {
width: 100%;
}
}
.l-footer .m-footer__sublinks #footer-other .menu-item a {
display: block;
line-height: 1;
color: #fff;
font-size: 14px;
font-weight: bold;
padding: 5px 0px;
}
@media screen and (max-width: 767.98px) {
.l-footer .m-footer__sublinks #footer-other .menu-item a {
font-size: 13px;
font-weight: bold;
}
}
.l-footer .m-footer__sublinks #footer-other .menu-item:first-child {
margin-bottom: 30px;
}
@media screen and (max-width: 767.98px) {
.l-footer .m-footer__sublinks #footer-other .menu-item:first-child {
margin-bottom: 0px;
}
}
.l-footer .m-footer__footlink {
flex: 1;
height: auto;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink {
width: 100%;
}
}
.l-footer .m-footer__footlink__nav {
padding: 12px 0px;
}
.l-footer .m-footer__footlink__nav .menu {
display: flex;
max-width: 810px;
margin: 0;
padding: 10px 0px;
margin-left: 25px;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink__nav .menu {
max-width: 100%;
flex-wrap: wrap;
margin-left: auto;
margin-right: auto;
justify-content: center;
}
}
.l-footer .m-footer__footlink__nav .menu .menu-item {
margin: 0px 16px;
display: inline-block;
}
.l-footer .m-footer__footlink__nav .menu .menu-item.is-right_line {
position: relative;
padding-right: 4%;
margin-right: 0px;
border-right: 1px solid #BCBCBC;
}
.l-footer .m-footer__footlink__nav .menu .menu-item.is-right_line a {
min-width: 120px;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink__nav .menu .menu-item.is-right_line {
margin-right: 0px;
margin-left: 0px;
padding-right: 0px;
border-right: 0;
}
}
.l-footer .m-footer__footlink__nav .menu .menu-item.is-left_line {
position: relative;
padding-left: 4%;
margin-left: 0px;
}
.l-footer .m-footer__footlink__nav .menu .menu-item.is-left_line a {
min-width: 84px;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink__nav .menu .menu-item.is-left_line {
margin-left: 0px;
margin-right: 0px;
padding-left: 0px;
}
}
.l-footer .m-footer__footlink__nav .menu .menu-item:first-child {
margin-left: 0px;
}
.l-footer .m-footer__footlink__nav .menu .menu-item:last-child {
margin-right: 0px;
}
.l-footer .m-footer__footlink__nav .menu .menu-item:last-child a {
border-right: 0;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink__nav .menu .menu-item {
margin: 0px;
}
}
.l-footer .m-footer__footlink__nav .menu .menu-item a {
color: #fff;
display: block;
line-height: 14px;
margin: 10px 0px;
font-size: 12px;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__footlink__nav .menu .menu-item a {
padding: 0px 12px;
}
}
@media screen and (max-width: 767.98px) {
.l-footer .m-footer__footlink__nav .menu .menu-item a {
padding: 0px 8px;
border-right: 1px solid #fff;
}
}
.l-footer .m-footer__copyright {
margin-left: 30px;
height: auto;
display: flex;
align-items: center;
}
.l-footer .m-footer__copyright small {
color: #fff;
font-size: 12px;
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__copyright small {
width: auto;
margin: auto;
}
}
@media screen and (max-width: 1199.98px) {
.l-footer .m-footer__copyright {
max-width: 100%;
margin: 0 auto;
}
.l-footer .m-footer__copyright small {
text-align: center;
}
}
.tsc-info {
color: #fff;
margin-top: 40px;
font-size: 1rem;
}
.tsc-info ul {
margin: 0 0 1em;
padding: 0;
list-style-type: none;
}
@media screen and (max-width: 960px) {
.tsc-info ul {
margin-bottom: 24px;
}
}
.tsc-info ul li {
font-size: 12px;
}
@media screen and (max-width: 960px) {
.tsc-info ul li {
margin-bottom: 8px;
}
}
.tsc-info ul li a {
color: #fff;
}
.tsc-info figure {
display: flex;
margin: 0;
padding: 0;
}
.tsc-info figure img {
width: 25%;
max-width: 72px;
height: auto;
margin-right: 8px;
}
.tsc-info figure figcaption {
align-self: center;
font-size: 1.1em;
}
@media screen and (max-width: 960px) {
.tsc-info figure figcaption {
font-size: 1em;
}
}
.page-template-page-w .tsc-info,
.page-template-w .tsc-info {
font-size: 62.5%;
}   @font-face {
font-family: "Trebuchet MS";
font-style: normal;
font-weight: normal;
src: local("../font/Trebuchet MS"), url(//marutto.co.jp/wp-content/themes/marutto/app/fonts/trebuc.woff) format("woff");
}   html {
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
font-size: 62.5%;
overflow-x: hidden;
visibility: hidden;
}
html.wf-active, html.loading-delay {
visibility: visible;
}
body {
color: #333333;
font-size: 62.5%;
line-height: 1.5;
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
word-break: break-all;
overflow-x: hidden;
margin: 0;
-webkit-overflow-scrolling: touch;
}
figure {
margin: 0;
padding: 0;
}
ol,
ul,
dl {
list-style: none;
padding: 0;
}
p {
margin-bottom: 0;
}
a {
color: #333333;
text-decoration: none;
}
a:hover {
color: rgba(51, 51, 51, 0.5);
text-decoration: none;
}
i:hover {
text-decoration: none;
}
h1,
h2 {
margin-top: 0;
margin-bottom: 0;
}
h3,
h4,
h5,
h6 {
margin-top: 0;
margin-bottom: 0;
}     .m-checkbox.wpcf7-checkbox {
display: flex;
flex-wrap: wrap;
margin-bottom: 10px;
padding-top: 10px;
}
@media screen and (max-width:768px) {
.m-checkbox.wpcf7-checkbox {
flex-direction: column;
}
}
.m-checkbox.wpcf7-checkbox .wpcf7-list-item {
display: block;
margin: 0px 16px 0px 0px;
}
.m-checkbox label {
margin: 0;
}
.m-checkbox label input[type=checkbox] {
display: none;
}
.m-checkbox label .wpcf7-list-item-label {
display: flex;
position: relative;
font-size: 16px;
padding-left: 24px;
}
.m-checkbox label .wpcf7-list-item-label:before {
position: absolute;
content: "";
left: 0;
top: 2px;
display: block;
width: 16px;
height: 16px;
border: solid 1px #333333;
background-color: #ffffff;
}
.m-checkbox label input[type=checkbox]:disabled + .wpcf7-list-item-label:before {
border: solid 1px #C4C4C4;
background-color: #dcdada;
}
.m-checkbox label input[type=checkbox]:checked + .wpcf7-list-item-label:after {
content: "";
left: 2px;
top: -1px;
position: absolute;
display: block;
background-color: transparent;
z-index: 1;
width: 16px;
height: 10px;
transform: rotate(-45deg);
border-bottom: solid 2px #333333;
border-left: solid 2px #333333;
}
.m-checkbox label input[type=checkbox].wpcf7c-conf:checked ~ .wpcf7-list-item-label:after {
content: "";
left: 2px;
top: -1px;
position: absolute;
display: block;
background-color: transparent;
z-index: 1;
width: 16px;
height: 10px;
transform: rotate(-45deg);
border-bottom: solid 2px #333333;
border-left: solid 2px #333333;
}
.wpcf7 {
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
background: transparent;
border: 1px solid transparent;
margin: 0 !important;
}
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
font-size: 16px !important;
}
.wpcf7 span.wpcf7-not-valid-tip {
color: #f00;
font-size: 14px;
font-weight: normal;
display: block;
text-align: left;
}
.wpcf7 p {
margin: 0;
}
.wpcf7 input[type=submit] {
-webkit-appearance: none;
border-radius: 0;
}
.wpcf7 button {
-webkit-appearance: none !important;
border-radius: 0;
}
.wpcf7 input[type=text],
.wpcf7 textarea,
.wpcf7 input[type=email],
.wpcf7 input[type=tel] {
-webkit-appearance: none !important;
border-radius: 0 !important;
outline: none !important;
}
.wpcf7 .wpcf7-mail-sent-ok {
display: block;
width: 100%;
max-width: 768px;
margin: 0 auto;
}
.wpcf7 .wpcf7-validation-errors {
display: block;
width: 100%;
max-width: 768px;
margin: 0 auto;
margin-bottom: 20px;
}
.wpcf7 .wpcf7-form {
margin: 0 auto;
}
.m-contact_form {
width: 100%;
max-width: 1140px;
margin: 0px auto;
}
.m-contact_form .brsp {
display: none;
}
.m-contact_form .brpc {
display: block;
}
@media screen and (max-width:768px) {
.m-contact_form .brsp {
display: block;
}
.m-contact_form .brpc {
display: none;
}
}
.m-contact_form .wpcf7c-elm-step2 .m-confirm_desp {
text-align: center;
font-size: 20px;
font-weight: bold;
line-height: 2em;
margin: 30px auto;
}
.m-contact_form .desc-box {
width: 100%;
}
.m-contact_form .desc-box--agree {
margin: 20px auto;
width: 100%;
max-width: 768px;
}
.m-contact_form .desc-box--agree .wpcf7-checkbox {
margin: 0px auto;
display: block;
margin: 20px auto;
text-align: center;
}
.m-contact_form .desc-box__title {
margin: 10px auto 10px;
text-align: left;
color: #333333;
font-size: 20px;
font-weight: 400;
}
.m-contact_form .desc-box__subtitle {
margin: 10px auto 10px;
text-align: left;
color: #333333;
font-size: 16px;
font-weight: 400;
}
@media screen and (max-width: 590px) {
.m-contact_form .desc-box__subtitle {
font-size: 14px;
}
}
.m-contact_form .desc-box__inner {
border: 1px solid #ccc;
margin: 0;
padding: 10px 20px;
width: 100%;
height: 200px;
overflow-y: scroll;
text-align: left;
box-sizing: border-box;
}
.m-contact_form .desc-box__inner .button {
min-width: 280px;
}
.m-contact_form .desc-box__inner li {
list-style: none;
}
.m-contact_form .desc-box__inner li.is-btn_wrap {
display: flex;
}
@media screen and (max-width: 590px) {
.m-contact_form .desc-box__inner li.is-btn_wrap {
flex-direction: column;
}
}
.m-contact_form .m-form {
padding-bottom: 60px;
}
.m-contact_form .m-form__row {
margin: 0px auto 5px;
padding: 15px;
display: flex;
background-color: #f2f2f2;
}
.m-contact_form .m-form__row.is-desp {
background-color: #ffffff;
}
.m-contact_form .m-form__row .m-form_input {
display: flex;
width: 100%;
}
.m-contact_form .m-form__row .m-form_input.is-privacy {
display: block;
width: auto;
}
@media screen and (max-width: 960px) {
.m-contact_form .m-form__row .m-form_input.is-privacy {
width: auto;
}
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input {
flex-direction: column;
}
}
.m-contact_form .m-form__row .m-form_input__address {
width: 100%;
display: flex;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__address {
flex-direction: column;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block {
width: 100%;
padding-top: 10px;
max-width: calc(100% - 360px);
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__address .m-address_block {
width: 100%;
max-width: 100%;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__title {
width: 200px;
padding-top: 12px;
font-weight: bold;
margin-bottom: 10px;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__address .m-address_block__title {
width: 100%;
max-width: 100%;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block .m-postal_code_row {
display: flex;
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row {
display: flex;
flex-wrap: wrap;
padding-bottom: 10px;
}
@media screen and (max-width:1200px) {
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row {
flex-direction: column;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .wpcf7-form-control-wrap {
width: calc(100% - 260px);
}
@media screen and (max-width:1200px) {
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .wpcf7-form-control-wrap {
width: 100%;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .wpcf7-form-control-wrap.postal_code {
width: calc(100% - 107px);
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .is_select {
width: calc(100% - 280px);
}
@media screen and (max-width:1200px) {
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .is_select {
width: 100%;
}
}
.m-contact_form .m-form__row .m-form_input__address .m-address_block__row .is_select .prefectures {
width: 240px;
}
.m-contact_form .m-form__row .m-form_input .wpcf7-form-control-wrap {
width: 100%;
}
.m-contact_form .m-form__row .m-form_input__title {
width: 360px;
min-width: 360px;
font-size: 20px;
text-align: left;
position: relative;
padding: 10px 24px 0px 0px;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title {
min-width: auto;
}
}
.m-contact_form .m-form__row .m-form_input__title:after {
content: "";
display: block;
clear: both;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title {
max-width: 100%;
}
}
.m-contact_form .m-form__row .m-form_input__title .is-sub_desp {
display: block;
position: absolute;
color: #707478;
font-size: 12px;
right: 24px;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title .is-sub_desp {
display: inline-block;
position: static;
margin-left: 12px;
}
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title {
text-align: left;
padding-right: 0px;
margin-bottom: 10px;
}
}
.m-contact_form .m-form__row .m-form_input__title.is-rep.is-privacy {
font-size: 16px;
position: relative;
}
.m-contact_form .m-form__row .m-form_input__title.is-rep.is-privacy:after {
position: absolute;
top: calc(50% - 1rem);
right: 24px;
}
@media screen and (max-width: 960px) {
.m-contact_form .m-form__row .m-form_input__title.is-rep.is-privacy {
width: 100%;
}
.m-contact_form .m-form__row .m-form_input__title.is-rep.is-privacy br {
display: none;
}
}
.m-contact_form .m-form__row .m-form_input__title.is-rep:before {
display: none;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title.is-rep:before {
content: "必須";
display: inline-block;
width: 58px;
font-weight: 400;
background-color: #d03b3f;
color: #fff;
letter-spacing: 3px;
font-size: 15px;
padding: 3px 11px;
margin-top: -2px;
margin-left: 10px;
}
}
@media screen and (max-width:768px) and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title.is-rep:before {
margin-left: 0px;
margin-right: 10px;
}
}
.m-contact_form .m-form__row .m-form_input__title.is-rep:after {
float: right;
content: "必須";
display: inline-block;
margin-top: -2px;
width: 58px;
font-weight: 400;
background-color: #d03b3f;
color: #fff;
letter-spacing: 3px;
font-size: 15px;
padding: 3px 11px;
margin-left: 10px;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title.is-rep:after {
display: none;
}
}
.m-contact_form .m-form__row .m-form_input__title.is-optional:before {
display: none;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title.is-optional:before {
content: "任意";
display: inline-block;
width: 58px;
background-color: #a3a3a3;
color: #ffffff;
font-size: 15px;
padding: 3px 11px;
letter-spacing: 3px;
margin-right: 10px;
font-weight: 400;
margin-top: -2px;
}
}
.m-contact_form .m-form__row .m-form_input__title.is-optional:after {
float: right;
content: "任意";
display: inline-block;
width: 58px;
font-weight: 400;
letter-spacing: 3px;
background-color: #a3a3a3;
color: #ffffff;
font-size: 15px;
padding: 3px 11px;
margin-left: 10px;
}
@media screen and (max-width:768px) {
.m-contact_form .m-form__row .m-form_input__title.is-optional:after {
display: none;
}
}
.js-address_display {
width: 87px;
height: 48px;
font-size: 14px;
border-radius: 0px;
}
.modal__content dl dt {
margin-bottom: 0.5em;
font-size: 18px;
}
.modal__content dl dd {
margin-bottom: 40px;
}
.modal__content ul {
padding-left: 1.5em;
margin: 10px 0;
line-height: 2;
list-style: disc;
}
.modal__content__button {
display: flex;
padding-left: 0;
}
.modal__content__button li {
display: flex;
margin: 5px 0;
}
.modal__content__button a {
display: block;
width: 100%;
padding: 10px;
background: #2D77C1;
color: #fff;
text-align: center;
border-radius: 3px;
}
.modal__content .js-modal-close {
display: block;
text-align: center;
margin-top: 1.5em;
padding: 10px 0;
background: #777;
color: #fff;
border-radius: 3px;
}
.m-radio.wpcf7-radio {
display: flex;
margin-bottom: 10px;
}
.m-radio.wpcf7-radio .wpcf7-list-item {
display: block;
margin: 8px 16px 0px 0px;
}
.m-radio label {
margin: 0;
}
.m-radio label input[type=radio] {
display: none;
}
.m-radio label .wpcf7-list-item-label {
display: flex;
position: relative;
font-size: 16px;
padding-left: 24px;
}
.m-radio label .wpcf7-list-item-label:before {
position: absolute;
content: "";
left: 0;
top: 2px;
display: block;
border-radius: 8px;
width: 16px;
height: 16px;
border: solid 1px #C4C4C4;
background-color: #ffffff;
}
.m-radio label input[type=radio]:checked + .wpcf7-list-item-label:after {
content: "";
left: 4px;
top: 6px;
position: absolute;
display: block;
background-color: transparent;
z-index: 1;
width: 8px;
height: 8px;
border-radius: 4px;
border: solid 1px #C4C4C4;
background-color: #ffffff;
}
.m-radio label input[type=radio]:checked + .wpcf7-list-item-label:before {
border: solid 1px #C4C4C4;
background-color: #ffffff;
}
.m-radio label input[type=radio].wpcf7c-conf:checked ~ .wpcf7-list-item-label:after {
content: "";
left: 4px;
top: 6px;
position: absolute;
display: block;
background-color: transparent;
z-index: 1;
width: 8px;
height: 8px;
border-radius: 4px;
background-color: #02c6ed;
border: solid 1px #02c6ed;
}
.m-radio label input[type=radio].wpcf7c-conf:checked ~ .wpcf7-list-item-label:before {
border: solid 1px #02c6ed;
background-color: #ffffff;
}
.is_select {
width: 210px;
text-align: center;
position: relative;
}
@media screen and (max-width:768px) {
.is_select {
width: 100%;
}
}
.is_select .m-select {
width: 100%;
height: 50px;
max-width: 100%;
padding-right: 1em;
padding-left: 1em;
cursor: pointer;
text-indent: 0.01px;
text-overflow: ellipsis;
border: 1px solid #C4C4C4;
outline: none;
background: #ffffff;
background-image: none;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
border-radius: 0;
}
.is_select .m-select::-ms-expand {
display: none;
}
.is_select .m-select.wpcf7c-conf {
background: transparent;
border: 1px solid transparent;
}
.is_select .m-select.wpcf7c-conf .wpcf7-form-control-wrap {
display: none;
}
.is_select .wpcf7-form-control-wrap.prefectures {
display: block;
position: relative;
background: transparent;
width: 100%;
}
.is_select .wpcf7-form-control-wrap.prefectures::before {
position: absolute;
top: 22px;
right: 8px;
width: 0;
height: 0;
padding: 0;
content: "";
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #666666;
pointer-events: none;
}
@media screen and (max-width:768px) {
.is_select .wpcf7-form-control-wrap.prefectures::before {
top: 22px;
}
}
.m-submits {
margin: 0;
width: 100%;
}
.m-submits .m-btns {
padding: 20px 10px;
}
.m-submits .m-btns--input {
max-width: 540px;
width: 100%;
margin: 0px auto;
}
.m-submits .m-btns--input .confirm_btn {
font-size: 1em;
display: block;
border: none;
outline: 0;
cursor: pointer;
color: #333333;
background: transparent;
height: 3em;
line-height: 3em;
width: 100%;
padding: 0 2.5em 0 0.8em;
transition: 0.3s;
}
.m-submits .m-btns--input:hover .confirm_btn {
color: #ffffff;
}
.m-submits .m-btns--confirm {
display: none;
} .m-input {
font-size: 16px;
padding: 11px 8px;
height: 48px;
width: 100%;
background-color: #ffffff;
border: solid 1px #C4C4C4; }
.m-input::placeholder {
color: #787878;
}
.m-input:-ms-input-placeholder {
color: #787878;
}
.m-input::-ms-input-placeholder {
color: #787878;
}
.m-input.wpcf7c-conf {
background: transparent;
border: 1px solid transparent; }
.m-input.wpcf7c-conf::placeholder {
color: transparent;
}
.m-input.wpcf7c-conf:-ms-input-placeholder {
color: transparent;
}
.m-input.wpcf7c-conf::-ms-input-placeholder {
color: transparent;
}
.is-datapicker {
font-size: 16px;
padding: 11px 8px;
height: 48px;
width: 100%;
background-color: #ffffff;
border: solid 1px #C4C4C4; }
.is-datapicker::placeholder {
color: #787878;
}
.is-datapicker:-ms-input-placeholder {
color: #787878;
}
.is-datapicker::-ms-input-placeholder {
color: #787878;
}
.is-datapicker.wpcf7c-conf {
background: transparent;
border: 1px solid transparent; }
.is-datapicker.wpcf7c-conf::placeholder {
color: transparent;
}
.is-datapicker.wpcf7c-conf:-ms-input-placeholder {
color: transparent;
}
.is-datapicker.wpcf7c-conf::-ms-input-placeholder {
color: transparent;
}
.m-textarea {
width: 100%;
height: 200px;
padding: 11px 8px;
background-color: #ffffff;
border: 1px solid #C4C4C4; }
.m-textarea::placeholder {
color: #787878;
}
.m-textarea:-ms-input-placeholder {
color: #787878;
}
.m-textarea::-ms-input-placeholder {
color: #787878;
}
.m-textarea.wpcf7c-conf {
background: transparent;
border: 1px solid transparent; }
.m-textarea.wpcf7c-conf::placeholder {
color: transparent;
}
.m-textarea.wpcf7c-conf:-ms-input-placeholder {
color: transparent;
}
.m-textarea.wpcf7c-conf::-ms-input-placeholder {
color: transparent;
}
.custom-wpcf7c-confirmed .m-post_code_desp {
display: none;
}
.custom-wpcf7c-confirmed .m-submits .m-btns--input {
display: none;
}
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm {
display: flex;
width: 100%;
margin: 0 auto;
justify-content: center;
}
@media screen and (max-width: 590px) {
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm {
flex-direction: column;
}
}
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm__back {
max-width: 540px;
width: 100%;
margin: 0px auto;
}
@media screen and (max-width: 590px) {
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm__back {
margin-bottom: 20px;
}
}
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm__back .return_btn {
font-size: 1em;
display: block;
border: none;
outline: 0;
cursor: pointer;
color: #333333;
background: transparent;
font-weight: bold;
height: 3em;
line-height: 3em;
width: 100%;
padding: 0 2.5em 0 0.8em;
transition: 0.3s;
}
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm__submit {
max-width: 540px;
width: 100%;
margin: 0px auto;
}
.custom-wpcf7c-confirmed .m-submits .m-btns--confirm__submit .submit_btn {
font-size: 1em;
display: block;
border: none;
outline: 0;
cursor: pointer;
color: #333333;
background: transparent;
font-weight: bold;
height: 3em;
line-height: 3em;
width: 100%;
padding: 0 2.5em 0 0.8em;
transition: 0.3s;
}
.custom-wpcf7c-confirmed .m-form__row.is-desp {
display: none;
}
.custom-wpcf7c-confirmed .js-address_display {
display: none;
}
.custom-wpcf7c-confirmed .m-address_block__title {
display: none;
}
.m-contact_form .m-form__row.is-considerations {
display: none;
}
.m-contact_form .m-form__row.is-considerations.is-active {
display: block;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row.is-considerations {
display: none;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row.is-considerations.is-active {
display: none;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row .m-form_input__title.is-rep:before {
display: none;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row .m-form_input__title.is-rep:after {
display: none;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row .m-form_input__title.is-optional:before {
display: none;
}
.custom-wpcf7c-confirmed .m-contact_form .m-form__row .m-form_input__title.is-optional:after {
display: none;
}
.m-form__row.js-notes {
display: none;
}
.m-form__row.js-notes.is-active {
display: block;
}
.custom-wpcf7c-confirmed .m-form__row.js-notes {
display: none;
}
.custom-wpcf7c-confirmed .m-form__row.js-notes.is-active {
display: none;
}
.custom-wpcf7c-confirmed .m-form__row.js-notes.is-active.is-coolingoff {
display: flex;
}
.l-inquiry .m-line_wrap {
padding-top: 50px;
background: linear-gradient(to right, #cdf7e6 0%, #e5f6dc 55%, #fdf5d3 100%);
padding-bottom: 60px;
}
.l-inquiry .m-line_wrap__title {
text-align: center;
margin: 0px 0px 55px;
font-size: 16px;
font-weight: bold;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__title {
margin: 0px 0px 35px;
}
}
.l-inquiry .m-line_wrap__inner {
max-width: 860px;
margin: 40px auto 0px;
display: flex;
}
.l-inquiry .m-line_wrap__inner__qr {
width: 235px;
content: "";
display: block;
height: 100px;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__qr {
display: none;
}
}
.l-inquiry .m-line_wrap__inner__qr img {
width: 235px;
height: 235px;
padding-top: 10px;
object-fit: cover;
}
.l-inquiry .m-line_wrap__inner__desp {
content: "";
display: block;
width: 100%;
height: auto;
padding-bottom: 40px;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp {
margin-left: 0;
}
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_title {
line-height: 57px;
font-size: 33px;
color: #00af26;
font-family: NotoSansCJKjp, "Hiragino Kaku Gothic ProN", メイリオ, sans-serif !important;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp .m-desp_title {
display: none;
}
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_note {
text-align: center;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp .m-desp_note {
text-align: left;
}
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_note + .button_chat-bot {
margin-top: 20px;
}
.l-inquiry .m-line_wrap__inner__desp .button_chat-bot {
font-size: 18px;
font-weight: bold;
color: #fff;
max-width: 500px;
padding-top: 10px;
padding-bottom: 10px;
margin-left: auto;
margin-right: auto;
background: #19b2cc;
border-radius: 6px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px #138a9f;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp .button_chat-bot {
font-size: 16px;
max-width: 90%;
padding-right: 8px;
padding-left: 8px;
text-align: center;
}
}
.l-inquiry .m-line_wrap__inner__desp .button_chat-bot + .m-desp_text {
margin-top: 20px;
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_text {
font-size: 14px;
text-align: center;
}
@media screen and (max-width: 590px) {
.l-inquiry .m-line_wrap__inner__desp .m-desp_text {
text-align: left;
font-size: 12px;
}
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--pc {
display: flex;
width: 120px;
padding: 6px 10px;
font-weight: 400;
color: #ffffff;
text-decoration: none;
border-radius: 5px;
font-size: 14px;
margin-top: 60px;
background-color: #00af26;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--pc {
display: none;
}
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--pc:before {
content: "";
display: inline-block;
width: 20px;
margin-right: 5px;
background-size: contain;
background-repeat: no-repeat;
height: 20px;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2287.382%22%20height%3D%2283.259%22%20viewBox%3D%220%200%2087.382%2083.259%22%3E%20%3Cg%20id%3D%22TYPE_A%22%20data-name%3D%22TYPE%20A%22%20transform%3D%22translate(-377.059%20-257.805)%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_2%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%202%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_1%22%20data-name%3D%22%E3%83%91%E3%82%B9%201%22%20d%3D%22M464.441%2C293.261c0-19.551-19.6-35.456-43.691-35.456s-43.691%2C15.9-43.691%2C35.456c0%2C17.526%2C15.544%2C32.205%2C36.54%2C34.98%2C1.422.307%2C3.359.938%2C3.849%2C2.155a8.981%2C8.981%2C0%2C0%2C1%2C.141%2C3.95s-.512%2C3.083-.623%2C3.74c-.191%2C1.1-.878%2C4.32%2C3.784%2C2.355s25.161-14.815%2C34.328-25.366h0c6.332-6.944%2C9.365-13.99%2C9.365-21.814%22%20fill%3D%22%23fff%22%2F%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_1%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%201%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_2%22%20data-name%3D%22%E3%83%91%E3%82%B9%202%22%20d%3D%22M411.873%2C283.813h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.065a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_3%22%20data-name%3D%22%E3%83%91%E3%82%B9%203%22%20d%3D%22M432.967%2C283.813H429.9a.85.85%2C0%2C0%2C0-.851.85v11.31l-8.725-11.782a1.082%2C1.082%2C0%2C0%2C0-.066-.086l-.006-.006c-.016-.018-.033-.035-.051-.052l-.016-.014a.325.325%2C0%2C0%2C0-.045-.038l-.022-.018-.044-.03-.026-.015-.045-.026-.027-.013-.049-.02-.028-.01-.05-.017-.03-.007-.049-.011-.036-.005c-.014%2C0-.029%2C0-.044-.006l-.045%2C0-.029%2C0h-3.064a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.064a.851.851%2C0%2C0%2C0%2C.852-.849V292.393l8.734%2C11.8a.844.844%2C0%2C0%2C0%2C.216.21l.009.007.053.032.024.013.04.02c.014.005.027.012.042.017l.025.01.058.018.013%2C0a.819.819%2C0%2C0%2C0%2C.218.029h3.064a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_4%22%20data-name%3D%22%E3%83%91%E3%82%B9%204%22%20d%3D%22M404.486%2C299.782h-8.328V284.663a.85.85%2C0%2C0%2C0-.85-.85h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.842.842%2C0%2C0%2C0%2C.238.587l.012.014.012.011a.844.844%2C0%2C0%2C0%2C.588.237h12.244a.85.85%2C0%2C0%2C0%2C.849-.851v-3.065a.851.851%2C0%2C0%2C0-.849-.851%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_5%22%20data-name%3D%22%E3%83%91%E3%82%B9%205%22%20d%3D%22M449.891%2C288.58a.851.851%2C0%2C0%2C0%2C.85-.851v-3.064a.851.851%2C0%2C0%2C0-.85-.852H437.647a.845.845%2C0%2C0%2C0-.59.24l-.01.009-.014.015a.851.851%2C0%2C0%2C0-.236.586V303.7h0a.846.846%2C0%2C0%2C0%2C.238.588l.012.013.012.011a.847.847%2C0%2C0%2C0%2C.588.238h12.244a.851.851%2C0%2C0%2C0%2C.85-.851v-3.065a.851.851%2C0%2C0%2C0-.85-.851h-8.327v-3.218h8.327a.851.851%2C0%2C0%2C0%2C.85-.852v-3.064a.852.852%2C0%2C0%2C0-.85-.852h-8.327V288.58Z%22%20fill%3D%22%2300b900%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--sp {
display: none;
}
@media screen and (max-width:768px) {
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--sp {
display: flex;
font-weight: 400;
color: #ffffff;
text-decoration: none;
border-radius: 5px;
background-color: #00af26;
margin: 0px auto 10px;
width: 165px;
letter-spacing: -1px;
font-size: 21px;
padding: 12px 10px 10px 16px;
}
.l-inquiry .m-line_wrap__inner__desp .m-desp_btn--sp:before {
content: "";
display: inline-block;
width: 28px;
margin-right: 6px;
background-size: contain;
background-repeat: no-repeat;
height: 28px;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2287.382%22%20height%3D%2283.259%22%20viewBox%3D%220%200%2087.382%2083.259%22%3E%20%3Cg%20id%3D%22TYPE_A%22%20data-name%3D%22TYPE%20A%22%20transform%3D%22translate(-377.059%20-257.805)%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_2%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%202%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_1%22%20data-name%3D%22%E3%83%91%E3%82%B9%201%22%20d%3D%22M464.441%2C293.261c0-19.551-19.6-35.456-43.691-35.456s-43.691%2C15.9-43.691%2C35.456c0%2C17.526%2C15.544%2C32.205%2C36.54%2C34.98%2C1.422.307%2C3.359.938%2C3.849%2C2.155a8.981%2C8.981%2C0%2C0%2C1%2C.141%2C3.95s-.512%2C3.083-.623%2C3.74c-.191%2C1.1-.878%2C4.32%2C3.784%2C2.355s25.161-14.815%2C34.328-25.366h0c6.332-6.944%2C9.365-13.99%2C9.365-21.814%22%20fill%3D%22%23fff%22%2F%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_1%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%201%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_2%22%20data-name%3D%22%E3%83%91%E3%82%B9%202%22%20d%3D%22M411.873%2C283.813h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.065a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_3%22%20data-name%3D%22%E3%83%91%E3%82%B9%203%22%20d%3D%22M432.967%2C283.813H429.9a.85.85%2C0%2C0%2C0-.851.85v11.31l-8.725-11.782a1.082%2C1.082%2C0%2C0%2C0-.066-.086l-.006-.006c-.016-.018-.033-.035-.051-.052l-.016-.014a.325.325%2C0%2C0%2C0-.045-.038l-.022-.018-.044-.03-.026-.015-.045-.026-.027-.013-.049-.02-.028-.01-.05-.017-.03-.007-.049-.011-.036-.005c-.014%2C0-.029%2C0-.044-.006l-.045%2C0-.029%2C0h-3.064a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.064a.851.851%2C0%2C0%2C0%2C.852-.849V292.393l8.734%2C11.8a.844.844%2C0%2C0%2C0%2C.216.21l.009.007.053.032.024.013.04.02c.014.005.027.012.042.017l.025.01.058.018.013%2C0a.819.819%2C0%2C0%2C0%2C.218.029h3.064a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_4%22%20data-name%3D%22%E3%83%91%E3%82%B9%204%22%20d%3D%22M404.486%2C299.782h-8.328V284.663a.85.85%2C0%2C0%2C0-.85-.85h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.842.842%2C0%2C0%2C0%2C.238.587l.012.014.012.011a.844.844%2C0%2C0%2C0%2C.588.237h12.244a.85.85%2C0%2C0%2C0%2C.849-.851v-3.065a.851.851%2C0%2C0%2C0-.849-.851%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_5%22%20data-name%3D%22%E3%83%91%E3%82%B9%205%22%20d%3D%22M449.891%2C288.58a.851.851%2C0%2C0%2C0%2C.85-.851v-3.064a.851.851%2C0%2C0%2C0-.85-.852H437.647a.845.845%2C0%2C0%2C0-.59.24l-.01.009-.014.015a.851.851%2C0%2C0%2C0-.236.586V303.7h0a.846.846%2C0%2C0%2C0%2C.238.588l.012.013.012.011a.847.847%2C0%2C0%2C0%2C.588.238h12.244a.851.851%2C0%2C0%2C0%2C.85-.851v-3.065a.851.851%2C0%2C0%2C0-.85-.851h-8.327v-3.218h8.327a.851.851%2C0%2C0%2C0%2C.85-.852v-3.064a.852.852%2C0%2C0%2C0-.85-.852h-8.327V288.58Z%22%20fill%3D%22%2300b900%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
}
}
.l-inquiry .m-inquiry_headline {
margin-bottom: 50px;
}
.l-inquiry .m-inquiry_headline .intro {
margin-top: 80px;
text-align: center;
font-size: 20px;
font-weight: bold;
line-height: 2em;
}
@media screen and (max-width: 590px) {
.l-inquiry .m-inquiry_headline .intro {
margin-top: 40px;
font-size: 16px;
text-align: justify;
}
}
.l-inquiry .m-inquiry_headline .headline {
margin-top: 80px;
}
@media screen and (max-width: 590px) {
.l-inquiry .m-inquiry_headline .headline {
margin-top: 40px;
}
}
.l-inquiry .m-inquiry_lineseq {
padding: 50px 0px;
}
.l-inquiry .m-inquiry_lineseq .intro {
margin-top: 80px;
text-align: center;
font-size: 20px;
font-weight: bold;
line-height: 2em;
}
@media screen and (max-width: 590px) {
.l-inquiry .m-inquiry_lineseq .intro {
margin-top: 40px;
font-size: 16px;
text-align: justify;
padding: 0px 30px;
}
}
.l-inquiry .m-form_wrap__title {
text-align: center;
margin: 0px 0px 28px;
font-size: 18px;
font-weight: bold;
}
@media screen and (max-width:768px) {
.l-inquiry .m-form_wrap__title {
font-size: 16px;
}
}
.l-inquiry .m-form_wrap__title_desp {
text-align: center;
font-size: 14px;
line-height: 27px;
font-weight: bold;
}
@media screen and (max-width:768px) {
.l-inquiry .m-form_wrap__title_desp {
font-size: 12px;
line-height: 22px;
margin: 0px auto;
max-width: calc(100% - 40px);
}
}
.l-inquiry .m-form_wrap__inner {
display: block;
width: 100%;
}
.contact {  }
.contact .option {
background: #f0f0f0;
padding-top: 80px;
padding-bottom: 80px;
}
.contact .option_intro {
margin-top: 30px;
text-align: center;
font-size: 20px;
font-weight: bold;
line-height: 2em;
}
@media screen and (max-width: 590px) {
.contact .option_intro {
text-align: left;
}
}
.contact .option_white {
width: 80%;
}
.contact .option__tel {
display: flex;
width: 100%;
margin: auto;
}
.contact .option__tel li {
display: flex;
align-items: center;
padding: 0;
margin: 40px auto 0;
}
@media screen and (max-width: 590px) {
.contact .option__tel li {
justify-content: center;
}
}
.contact .option__tel li span {
display: block;
margin-right: 20px;
}
@media screen and (max-width: 590px) {
.contact .option__tel li span {
font-size: 28px;
text-align: left;
letter-spacing: 1px;
}
}
.contact .option__tel li span.fd {
width: auto;
display: block;
}
@media screen and (max-width: 590px) {
.contact .option__tel li span.fd {
width: 40px;
margin-right: 20px;
}
}
.contact .option__tel li span.fd img {
width: 47.2px;
height: auto;
}
.contact .option__tel li span.option_number_title {
background-color: #f09138;
padding: 8px;
font-size: 10px;
color: #fff;
}
.contact .option__tel li a {
padding-top: 5px;
font-size: 30px;
font-weight: bold;
letter-spacing: 3px;
}
.contact .option p {
margin-top: 20px;
text-align: center;
}
.contact .option__time {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
.contact .option__time_title {
padding: 5px 10px;
letter-spacing: 1px;
color: #fff;
background-color: #333333;
}
.contact .option__time_time {
padding-left: 15px;
padding-right: 15px;
font-size: 24px;
font-weight: 600;
}
.contact .option__time_time span {
display: none;
}
.contact .option__time_exception {
font-size: 16px;
font-weight: 600;
}
@media screen and (max-width: 590px) {
.contact .option {
padding: 40px 0px;
}
.contact .option_intro {
margin-top: 20px;
font-size: 16px;
}
.contact .option_intro br {
display: none;
}
.contact .option_white {
width: 100%;
padding-right: 0;
padding-left: 0;
}
.contact .option__tel {
flex-wrap: wrap;
}
.contact .option__tel li {
flex-wrap: wrap;
width: 100%;
}
.contact .option__tel li:last-child {
margin-top: 20px;
}
.contact .option__tel li span {
margin-right: 0;
}
.contact .option__tel li span.fd img {
width: 100%;
height: auto;
}
.contact .option__tel li span.fd .option_number_title {
padding: 6px;
}
.contact .option__tel li a {
font-size: 28px;
text-align: center;
padding-left: 0px;
width: calc(100% - 120px);
letter-spacing: 1px;
}
.contact .option__time {
flex-wrap: wrap;
}
.contact .option__time span {
text-align: center;
}
.contact .option__time_time {
width: calc(100% - 120px);
margin-top: 10px;
padding-left: 10px;
padding-right: 0;
line-height: 1.2;
font-size: 22px;
text-align: left;
padding-left: 20px;
display: block;
text-align: center;
letter-spacing: 0px;
}
.contact .option__time_time span {
display: block;
font-size: 12px;
text-align: left;
}
.contact .option__time_exception {
display: none;
}
}
.contact .option_button {
padding-top: 40px;
background-color: #ffffff;
}
@media screen and (max-width: 590px) {
.contact .button {
font-size: 14px;
}
}
@media screen and (max-width: 590px) {
.contact .button::before, .contact .button::after {
right: 10px;
}
}
.m-foot_btn {
height: auto;
margin: 60px auto;
}
@media screen and (max-width:768px) {
.m-foot_btn {
height: 100px;
}
}
.m-foot_btn .button {
margin-bottom: 10px;
}
.content {
margin: 0 auto;
padding: 40px;
} .modal {
display: none;
height: 100vh;
position: fixed;
top: 0;
width: 100%;
z-index: 2;
}
.modal__bg {
background: rgba(0, 0, 0, 0.3);
height: 100vh;
position: absolute;
width: 100%;
z-index: 2;
}
.modal__content {
background: #fff;
left: 50%;
padding: 35px 40px;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: calc(100% - 30px);
max-width: 768px;
z-index: 3;
font-size: 16px;
line-height: 1.5;
}
@media screen and (max-width: 590px) {
.modal__content {
padding: 20px;
}
}
.modal__content .js-modal-close {
display: block;
text-align: center;
margin-top: 1.5em;
padding: 10px 0;
background: #777;
color: #fff;
border-radius: 3px;
}
.modal__content #gas-pp {
padding: 20px 0px;
}
.modal__content #gas-pp .gas-pp-sec-03 {
padding: 0px !important;
}
.modal__content #gas-pp .pp-table__table {
overflow: hidden;
padding-bottom: 30px;
margin: 0px;
}
@media screen and (max-width: 590px) {
.modal__content #gas-pp .pp-table__table {
padding: 0px;
}
}
.modal__content #gas-pp .pp-table__table__inner {
overflow: scroll;
padding: 20px 10px;
width: 100%;
height: 44vh;
display: block;
}
.m-block_title {
width: 100%;
padding: 13px 13px;
font-size: 18px;
line-height: 1.5;
background-color: #b4b4b4;
border-radius: 2px;
color: #ffffff;
margin-bottom: 20px;
}
@media screen and (max-width: 960px) {
.m-block_title {
margin-top: 30px;
}
}
.m-article_wrap {
width: 100%;
}
.m-article_wrap .m-faq_popular {
max-width: 768px;
width: calc(100% - 30px);
margin: 0px auto;
}
.m-faq_list {
list-style: none;
padding: 0;
margin: 0;
margin-bottom: 40px;
}
.m-faq_list__items {
font-size: 16px;
border-bottom: dotted 1px #b4b4b4;
line-height: 2;
position: relative;
padding: 10px 0px;
}
.m-faq_list__items:before {
content: "Q";
background-color: #ff4c40;
border-radius: 50%;
color: #fff;
display: block;
font-size: 16px;
position: absolute;
top: 6px;
left: 0;
width: 28px;
height: 28px;
line-height: 28px;
text-align: center;
}
.m-faq_list__items__title {
padding: 0px 0px 10px;
}
.m-faq_list__items a {
display: block;
text-decoration: none;
line-height: 22px;
color: #333333;
margin-left: 50px;
font-size: 14px;
}
.m-faq_list__items a:hover {
color: #333333;
border: 0;
}
.m-faq_list__answer {
position: relative;
padding-left: 50px;
font-size: 14px;
}
.m-faq_list__answer:before {
content: "A";
background-color: #b4b4b4;
border-radius: 50%;
color: #fff;
display: block;
font-size: 16px;
position: absolute;
top: 0px;
left: 0;
width: 28px;
height: 28px;
line-height: 28px;
text-align: center;
}
.m-faq_list__answer__text {
background-color: #f8f9fa;
display: block;
color: #495057;
font-size: 13px;
line-height: 21px;
margin: 5px 0 0 0px;
padding: 10px;
position: relative;
}
.thanks {
text-align: center;
}
.thanks__complete__heading {
margin-top: 100px;
font-size: 40px;
font-weight: 100;
}
@media screen and (max-width: 590px) {
.thanks__complete__heading {
font-size: 24px;
}
}
.thanks__complete__text {
margin-top: 60px;
font-size: 20px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.thanks__complete__text {
font-size: 16px;
line-height: 2;
}
}
.thanks .contact {
margin-top: 100px;
background: #f0f0f0;
}
.thanks .contact__wrapper .container {
padding: 60px 20px;
width: 100%;
max-width: 768px;
}
.thanks .contact__wrapper__tel {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
width: 100%;
}
.thanks .contact__wrapper__tel li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0;
}
.thanks .contact__wrapper__tel li span {
display: block;
margin-right: 20px;
}
.thanks .contact__wrapper__tel li span.fd {
width: 60px;
}
.thanks .contact__wrapper__tel li span.fd img {
width: 100%;
height: auto;
}
.thanks .contact__wrapper__tel li span.number_title {
background-color: #ff8b40; padding: 10px;
color: #fff;
}
.thanks .contact__wrapper__tel li a {
padding-top: 5px;
font-size: 30px;
font-weight: bold;
letter-spacing: 3px;
}
.thanks .contact__wrapper p.contact__wrapper__text_01 {
font-size: 20px;
font-weight: bold;
text-align: center;
}
.thanks .contact__wrapper p.contact__wrapper__text_02 {
margin-top: 14px;
text-align: center;
}
.thanks .contact__wrapper__provider {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
.thanks .contact__wrapper__provider span.time_title {
padding: 5px 10px;
letter-spacing: 1px;
color: #fff;
background-color: #333333;
}
.thanks .contact__wrapper__provider span.time_reception {
padding-left: 15px;
padding-right: 15px;
font-size: 24px;
font-weight: 600;
}
.thanks .contact__wrapper__provider span.time_exception {
font-size: 16px;
font-weight: 600;
}
@media screen and (max-width: 1240px) {
.thanks .contact__wrapper__tel li span {
margin-right: 10px;
}
.thanks .contact__wrapper__tel li span.fd {
width: 55px;
}
.thanks .contact__wrapper__tel li span.number_title {
padding: 10px 5px;
}
.thanks .contact__wrapper__tel li a {
font-size: 28px;
}
}
@media screen and (max-width: 768px) {
.contact .contact__wrapper {
padding: 40px 10px;
}
.contact .contact__wrapper .container {
padding: 20px;
width: 100%;
}
.contact .contact__wrapper_intro {
margin-top: 20px;
}
.contact .contact__wrapper_intro br {
display: none;
}
.contact .contact__wrapper_white {
padding: 20px;
width: 100%;
}
.contact .contact__wrapper__tel {
flex-wrap: wrap;
max-width: 380px;
margin: 0 auto;
}
.contact .contact__wrapper__tel li {
flex-wrap: wrap;
justify-content: center;
width: 100%;
}
.contact .contact__wrapper__tel li:last-child {
margin-top: 20px;
}
.contact .contact__wrapper__tel li span {
margin-right: 0;
}
.contact .contact__wrapper__tel li span.fd {
width: 60px;
}
.contact .contact__wrapper__tel li span.fd img {
width: 100%;
height: auto;
}
.contact .contact__wrapper__tel li span.number_title {
font-size: 10px;
}
.contact .contact__wrapper__tel li a {
width: calc(100% - 90px);
font-size: 28px;
line-height: 1;
text-align: center;
}
.contact .contact__wrapper__provider {
flex-wrap: wrap;
}
.contact .contact__wrapper__provider .time_title {
font-size: 16px;
text-align: center;
}
.contact .contact__wrapper__provider .time_reception {
width: 100%;
margin-top: 10px;
padding-left: 0;
padding-right: 0;
font-size: 24px;
}
.contact .contact__wrapper__provider .time_exception {
margin-top: 10px;
width: 100%;
font-size: 14px;
font-weight: normal;
}
.contact__wrapper__text_01 {
font-size: 20px;
font-weight: bold;
line-height: 2;
}
.contact__wrapper__text_02 {
font-size: 16px;
padding: 24px 0px;
}
}
.m-circle {
width: 100%;
margin: 30px auto 0px;
max-width: 1280px;
}
.m-circle__inner {
width: 100%;
display: flex;
justify-content: space-between;
column-gap: 15px;
row-gap: 15px;
margin: 0 auto;
}
@media screen and (max-width:1200px) {
.m-circle__inner {
width: 80%;
justify-content: center;
flex-wrap: wrap;
}
}
@media screen and (max-width: 960px) {
.m-circle__inner {
width: 100%;
margin-bottom: 40px;
column-gap: 0;
row-gap: 30px;
}
}
.m-circle__inner li {
flex: 1;
}
@media screen and (max-width:1200px) {
.m-circle__inner li {
flex: unset;
width: 175px;
}
}
@media screen and (max-width: 960px) {
.m-circle__inner li {
width: 33.33%;
}
}
.m-circle__inner li.water-sakutto .m-item {
justify-content: flex-start;
padding-top: 10%;
}
@media screen and (max-width: 960px) {
.m-circle__inner li.water-sakutto .m-item {
justify-content: center;
padding-top: 0;
}
}
.m-circle__inner li.water-sakutto .m-item .m-item__logo img {
width: 120px;
}
@media screen and (max-width: 960px) {
.m-circle__inner li.water-sakutto .m-item .m-item__logo img {
width: 67%;
}
}
.m-circle__inner li .m-item {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
width: 100%;
height: auto;
aspect-ratio: 1/1;
border-radius: 100%;
box-shadow: 0px 4px 11px rgba(0, 0, 0, 0.1);
background-color: #fff;
}
@media screen and (max-width: 960px) {
.m-circle__inner li .m-item {
width: 140px;
height: 140px;
margin: 0px auto;
box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
}
}
@media screen and (max-width: 590px) {
.m-circle__inner li .m-item {
width: 90px;
height: 90px;
}
}
.m-circle__inner li .m-item__icon {
display: flex;
flex-wrap: wrap;
margin: 0 auto;
justify-content: center;
align-items: flex-start;
}
.m-circle__inner li .m-item__icon img {
width: 90px;
height: auto;
}
@media screen and (max-width: 960px) {
.m-circle__inner li .m-item__icon img {
width: 70px;
}
}
@media screen and (max-width: 590px) {
.m-circle__inner li .m-item__icon img {
width: 40%;
}
}
.m-circle__inner li .m-item__logo {
display: flex;
flex-wrap: wrap;
margin: 0 auto;
justify-content: center;
align-items: flex-start;
}
.m-circle__inner li .m-item__logo img {
width: 130px;
height: auto;
}
@media screen and (max-width: 960px) {
.m-circle__inner li .m-item__logo img {
width: 100px;
}
}
@media screen and (max-width: 590px) {
.m-circle__inner li .m-item__logo img {
width: 70%;
height: auto;
}
}
.m-circle__inner li .m-item__logo.iot img {
width: 95px;
}
@media screen and (max-width: 590px) {
.m-circle__inner li .m-item__logo.iot img {
width: 64px;
}
}
#inquiry_column {
margin-top: 30px;
}
#inquiry_column .m-desp_text {
margin: 26px 15px;
font-size: 14px;
}
#inquiry_column .m-desp_text li {
padding: 7px 0;
}
#inquiry_column .is-privacy {
width: unset;
}   .l-container {
min-height: calc(100vh - 300px);
height: auto;
position: relative;
}
.l-container .l-main {
margin: 0px auto;
position: relative;
z-index: 1;
}
.l-container .l-main .l-wrap {
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
}
body.is-noscroll {
width: 100%;
overflow: hidden;
position: fixed;
}
body.is-noscroll .m-header_service {
display: none;
}
@media screen and (max-width: 767.98px) {
body.is-noscroll .m-header_service {
display: block;
}
}
body.is-noscroll .p-yoast-breadcrumbs {
display: none;
}
.js-target-fixed .m-icon_btn--menu {
display: block;
}
.js-mc_modal {
content: "";
display: block;
position: relative;
}
.js-mc_modal .js-mc_modal__inner {
display: none;
animation-duration: 0.2s;
animation-timing-function: ease-out;
}
.js-mc_modal.is-open {
z-index: 98;
}
.js-mc_modal.is-open .js-mc_modal__inner {
content: "";
position: fixed;
width: 100vw;
max-height: 100%;
overflow: hidden;
display: block;
background-color: #dadada;
z-index: 98;
animation-name: slidecover;
}
@keyframes slidecover {
0% {
width: 100vw;
height: 0;
}
100% {
position: fixed;
width: 100vw;
height: 100vh;
z-index: 98;
}
}
.js-mc_modal_search {
content: "";
display: block;
position: relative;
}
.js-mc_modal_search .js-mc_modal_search__inner {
display: none;
animation-duration: 0.2s;
animation-timing-function: ease-out;
}
.js-mc_modal_search.is-open {
z-index: 98;
}
.js-mc_modal_search.is-open .js-mc_modal_search__inner {
content: "";
position: fixed;
width: 100vw;
max-height: 100%;
overflow: hidden;
display: block;
background-color: #dadada;
z-index: 98;
}
.js-mc_modal_search.is-open .js-mc_modal_search__inner .search-form {
padding: 20px 0;
background-color: rgb(239, 239, 239);
position: relative;
}
.js-mc_modal_search.is-open .js-mc_modal_search__inner .search-form .search-field {
margin: 0 auto;
color: #666;
border: 0;
border-radius: 3px;
display: block;
font-size: 16px;
padding: 0.7em;
width: calc(100% - 38px);
}
.js-mc_modal_search.is-open .js-mc_modal_search__inner .search-form .search-submit {
bottom: 3px;
position: absolute;
right: 20px;
top: 3px;
border: 0;
background-color: transparent;
}
.js-mc_modal_search.is-open .js-mc_modal_search__inner .search-form .search-submit .search-submit__icon {
color: #707070;
width: 32px;
height: 24px;
}   .l-header {
width: 100%;
height: auto;
position: relative;
z-index: 99;
height: 60px;
}
@media screen and (max-width: 767.98px) {
.l-header {
height: 45px;
}
}
.l-header .m-header_main {
background-color: #fff;
width: 100%;
height: auto;
animation-duration: 0.2s;
animation-timing-function: linear;
}
.l-header .m-header_main__inner {
width: 100%;
margin: 0 auto;
display: flex;
height: 60px;
}
@media screen and (max-width: 767.98px) {
.l-header .m-header_main__inner {
height: 45px;
}
}
.l-header .m-header_service {
background-color: #333333;
width: 100%;
height: 60px;
animation-duration: 0.2s;
animation-timing-function: linear;
z-index: 99;
}
.l-header .m-header_service__inner {
width: 100%;
margin: 0 auto;
display: flex;
height: 60px;
}
.l-header .m-header_service .m-go_top {
display: none;
}
@media screen and (max-width: 767.98px) {
.l-header .m-header_service .m-go_top {
display: block;
}
}
.l-header .m-header_service .m-icon_btn {
display: none;
}
.l-header .m-header_service .m-application {
display: none;
}
@media screen and (max-width: 767.98px) {
.l-header.is-service {
height: 45px;
}
.l-header.is-service .m-header_main {
display: none;
}
.l-header.is-service .m-header_service {
display: block;
height: 45px;
}
.l-header.is-service .m-application {
display: block;
}
.l-header.is-service .m-icon_btn {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: flex-end;
width: 60px;
}
}
.l-header .is-fixid {
animation-name: slidedown;
animation-fill-mode: forwards;
position: fixed;
top: 0; }
@keyframes slidedown {
0% {
top: -75px;
}
100% {
position: fixed;
top: 0px;
z-index: 99;
}
}
.l-header .is-fixid .m-icon_btn {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
justify-content: flex-end;
}
@media screen and (max-width: 767.98px) {
.l-header .is-fixid .m-icon_btn {
width: 90px;
}
}
.l-header .is-fixid .m-application {
display: block;
}
.l-header .m-application {
display: block;
margin: 15px 15px 15px 0px;
}
.l-header .m-application .is-application {
display: block;
width: 80px;
height: 30px;
color: #fff;
padding: 8px 12px;
line-height: 1;
font-size: 14px;
font-weight: 400;
background-color: #ff6864;
border: 0;
border-radius: 3px;
}
.l-header .m-application .is-application:focus {
outline: 0;
}
@media screen and (max-width: 767.98px) {
.l-header .m-application .is-application {
display: none;
}
}
.l-header .m-icon_btn {
content: "";
width: 100%;
max-width: 120px;
display: inline-block;
height: auto;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 45px;
justify-content: flex-end;
}
}
.l-header .m-icon_btn:after {
content: "";
display: block;
clear: both;
}
.l-header .m-icon_btn--menu {
content: "";
display: none;
height: 60px;
width: 60px;
float: left;
position: relative;
padding: 0px;
background-color: #dfdfdf;
border: 0;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--menu {
display: block;
-webkit-box-ordinal-group: 2;
order: 2;
height: 45px;
width: 45px;
}
}
.l-header .m-icon_btn--menu:focus {
outline: 0;
}
.l-header .m-icon_btn--menu .m-buns {
content: "";
display: block;
position: absolute;
width: 24px;
height: 18px;
top: 4px;
left: 0;
right: 0;
margin: 2px auto;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--menu .m-buns {
top: 0;
}
}
.l-header .m-icon_btn--menu .m-buns--top, .l-header .m-icon_btn--menu .m-buns--bottom {
content: "";
display: block;
position: absolute;
right: 0;
left: 0;
border-radius: 1px;
margin: 0 auto;
width: 24px;
height: 3px;
background-color: #353535;
transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
-ms-transition-duration: 0.5s;
}
.l-header .m-icon_btn--menu .m-buns--top {
top: 10px;
}
.l-header .m-icon_btn--menu .m-buns--bottom {
bottom: 0px;
}
.l-header .m-icon_btn--menu .m-text {
content: "";
display: block;
position: absolute;
width: 42px;
height: 16px;
margin: 0px auto;
left: 0;
right: 0;
bottom: 10px;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--menu .m-text {
bottom: 3px;
font-size: 9px;
}
}
.l-header .m-icon_btn--menu.is-open .m-buns {
top: 4px;
}
.l-header .m-icon_btn--menu.is-open .m-buns--top {
height: 3px;
width: 17px;
top: 9px;
transform: rotate(45deg);
}
.l-header .m-icon_btn--menu.is-open .m-buns--bottom {
height: 3px;
bottom: 6px;
width: 17px;
transform: rotate(-45deg);
}
.l-header .m-icon_btn--contact {
content: "";
display: block;
position: relative;
height: 60px;
width: 60px;
float: left;
background-color: #000000;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--contact {
display: none;
height: 45px;
width: 45px;
order: 1;
-webkit-box-ordinal-group: 1;
}
}
.l-header .m-icon_btn--contact .m-icon {
content: "";
display: block;
position: absolute;
margin: 0px auto;
top: 10px;
left: 0;
right: 0;
width: 25px;
height: 20px;
color: #fff;
}
.l-header .m-icon_btn--contact .m-icon path {
color: #fff;
}
.l-header .m-icon_btn--contact .m-icon svg path {
color: #fff;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--contact .m-icon {
height: 17px;
top: 8px;
}
}
.l-header .m-icon_btn--contact .m-text {
content: "";
display: block;
position: absolute;
margin: 0px auto;
width: 40px;
height: 10px;
left: 0;
right: 0;
font-size: 10px;
bottom: 8px;
color: #fff;
line-height: 1;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--contact .m-text {
font-size: 9px;
bottom: 7px;
}
}
.l-header .m-icon_btn--member {
content: "";
display: block;
position: relative;
height: 60px;
width: 60px;
float: left;
background-color: #7b7b7b;
}
@media screen and (max-width: 767.98px) {
.l-header .m-icon_btn--member {
display: none;
}
}
.l-header .m-icon_btn--member .m-icon {
content: "";
display: block;
position: absolute;
margin: 0px auto;
top: 8px;
left: 0;
right: 0;
width: 25px;
height: 25px;
color: #fff;
}
.l-header .m-icon_btn--member .m-icon path {
color: #fff;
}
.l-header .m-icon_btn--member .m-text {
content: "";
display: block;
position: absolute;
font-size: 10px;
width: 22px;
height: 10px;
margin: 0px auto;
left: 0;
right: 0;
bottom: 8px;
color: #fff;
line-height: 1;
}
.l-header .m-go_top .m-icon_btn--home {
content: "";
display: block;
position: relative;
height: 60px;
width: 60px;
float: left;
background-color: #fff;
}
@media screen and (max-width: 767.98px) {
.l-header .m-go_top .m-icon_btn--home {
height: 45px;
}
}
.l-header .m-go_top .m-icon_btn--home .m-text {
content: "";
display: block;
position: absolute;
width: 38px;
height: 14px;
margin: 0px auto;
left: 0;
right: 0;
top: 16px;
background-position: center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/marutto-s_M.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-go_top .m-icon_btn--home .m-text {
top: 8px;
width: 24px;
height: 12px;
}
}
.l-header .m-go_top .m-icon_btn--home .m-title {
content: "";
display: block;
position: absolute;
text-align: center;
margin: 0px auto;
color: #333333;
line-height: 1;
width: 44px;
height: 10px;
font-size: 10px;
left: 0;
right: 0;
bottom: 16px;
}
@media screen and (max-width: 767.98px) {
.l-header .m-go_top .m-icon_btn--home .m-title {
font-size: 9px;
height: 9px;
}
}
.l-header .m-logo {
width: 100%;
max-width: 240px;
padding-left: 30px;
height: auto;
}
@media screen and (max-width: 1140px) {
.l-header .m-logo {
max-width: 200px;
}
}
@media screen and (max-width: 991.98px) {
.l-header .m-logo {
max-width: 100%;
padding-left: 10px;
}
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo {
height: 45px;
align-self: center;
}
}
.l-header .m-logo--img {
content: "";
display: block;
height: 60px;
width: 168px;
background-position: center;
background-repeat: no-repeat;
}
.l-header .m-logo--img.is-logo-top {
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/marutto-series.png);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-top {
height: 45px;
}
}
.l-header .m-logo--img.is-logo-denki {
width: 100%;
max-width: 192.67px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/denki_logo_.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-denki {
max-width: 195px;
margin: 0 0 0 10px;
height: 45px;
}
}
.l-header .m-logo--img.is-logo-hikari {
width: 100%;
max-width: 192.67px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/hikari_logo.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-hikari {
max-width: 194px;
margin: 0 0 0 10px;
height: 45px;
}
}
.l-header .m-logo--img.is-logo-iot {
width: 100%;
max-width: 249.33px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/IoT_logo.svg);
}
.l-header .m-logo--img.is-logo-water {
width: 100%;
max-width: 206.83px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/water_logo.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-water {
height: 45px;
}
}
.l-header .m-logo--img.is-logo-water-sakutto {
width: 100%;
max-width: 206.83px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/water-sakutto_logo.webp);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-water-sakutto {
height: 45px;
}
}
.l-header .m-logo--img.is-logo-wi-fi {
width: 100%;
max-width: 179.92px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/WiFi_logo.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-wi-fi {
height: 45px;
}
}
.l-header .m-logo--img.is-logo-gas {
width: 100%;
max-width: 160.08px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/gas_logo.svg);
}
@media screen and (max-width: 767.98px) {
.l-header .m-logo--img.is-logo-gas {
max-width: 190px;
margin: 0 0 0 10px;
padding: 3px 0px;
height: 45px;
}
}
.l-header .m-logo--img.is-logo-teigaku {
width: 100%;
max-width: 160.08px;
padding: 8px 0px;
background-size: contain;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/header/teigaku_logo.svg);
}
@media screen and (max-width: 767.98px) {
.l-header.is-service .m-header_main {
height: 45px;
}
}
.l-header.is-service .m-header_main .m-logo {
max-width: 200px;
}
@media screen and (max-width: 991.98px) {
.l-header.is-service .m-header_main .m-logo {
max-width: 100%;
}
}
.l-header .m-nav {
content: "";
width: 100%;
height: 52px;
margin: 4px 0px;
padding: 0px 7.5px;
display: flex;
justify-content: flex-end;
}
@media screen and (max-width: 991.98px) {
.l-header .m-nav {
display: none;
}
}
.l-header .m-nav .menu {
margin: 0px;
padding: 0px;
display: flex;
}
.l-header .m-nav .menu .menu-item {
display: block;
margin: 0px auto;
}
.l-header .m-nav .menu .menu-item a {
display: inline-block;
font-size: 12px;
color: #333333;
font-weight: 400;
line-height: 1.2;
font-weight: bold;
padding: 12px 0px;
width: 100%;
margin: 0 auto;
cursor: pointer;
text-align: center;
}
.l-header .m-nav .menu .menu-item a span {
display: block;
}
.l-header .m-nav .menu .menu-item a:hover {
color: #333333;
text-decoration: none;
}
@media screen and (max-width: 991.98px) {
.l-header .m-nav .menu .menu-item span {
display: none;
}
}
.l-header .m-nav__menu--nav {
width: calc(100% - 200px);
max-width: 480px;
padding-right: 20px;
border-right: 1px solid #dfdfdf;
}
@media screen and (max-width: 1140px) {
.l-header .m-nav__menu--nav {
width: calc(100% - 160px);
}
}
.l-header .m-nav__menu--nav .menu-item:last-child {
margin-right: 0;
}
.l-header .m-nav__menu--secnav {
padding-left: 10px;
width: 110px;
}
.l-header .m-nav__menu--secnav .menu .menu-item {
margin: 0px 5px;
}
.l-header .m-nav__menu--secnav .menu .menu-item a {
padding: 19px 0px;
font-weight: 600;
letter-spacing: 3px;
}
.l-header .m-nav__menu--service {
width: 100%;
}
.l-header .m-nav__menu--service .menu {
justify-content: flex-end;
}
.l-header .m-nav__menu--service .menu .menu-item {
display: block;
margin: 0px 15px;
}
.l-header .m-nav__menu--service .menu .menu-item a {
font-weight: 600;
font-size: 14px;
padding: 19px 0px;
color: #fff;
}
.l-header .m-nav__menu--service .menu .menu-item a:hover {
color: #fff;
}
.m-modal_menu {
min-height: 100vh;
position: relative;
height: auto;
overflow: scroll;
transform: translateZ(0);
display: block;
}
.m-modal_menu .m-modal_menu__inner {
position: absolute;
-webkit-overflow-scrolling: touch;
max-width: 516px;
width: calc(100% - 80px);
height: auto;
top: 0;
left: 0;
right: 0;
margin: 0px auto;
padding-top: 20px;
padding-bottom: 180px;
}
.m-modal_menu .m-modal_menu__inner .menu {
display: block;
}
.m-modal_menu .m-modal_menu__inner .menu .menu-item {
display: block;
border-bottom: solid 1px #333333;
}
.m-modal_menu .m-modal_menu__inner .menu .menu-item a {
display: block;
font-size: 14px;
font-weight: 500;
padding: 20px 10px;
line-height: 1;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu {
width: 100%;
display: block;
padding-top: 2rem;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_icon {
content: "";
display: block;
background-size: contain;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/modal/marutto-series_tate.png);
width: 100px;
height: 65px;
margin: 15px auto;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item {
content: "";
width: 130px;
height: 130px;
background-color: #fff;
display: block;
border-radius: 50%;
margin-bottom: 15px;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner {
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
padding-top: 9%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner img {
height: auto;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner img.icon {
width: 60%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner img.logo {
width: 72%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner.is-water-sakutto {
padding-top: 14%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top__item__inner.is-water-sakutto img {
width: 63%;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top_teigaku {
width: 100%;
height: 35px;
background-color: #000000;
}
.m-modal_menu .m-modal_menu__inner .m-tops_menu .m-mc_top_teigaku__inner {
content: "";
display: block;
margin: 0px auto;
width: 172px;
height: 35px;
background-size: contain;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/modal/marutto-teigaku.png);
}
.page__footer {
display: flex;
align-items: center;
padding: 0 30px;
height: 75px;
background-color: #585858;
}
.page__footer * {
color: #fff;
}
.page__footer_l {
display: flex;
margin: 0;
}
.page__footer_l a {
color: #fff;
font-size: 12px;
}
.page__footer_l a:hover {
color: #fff;
opacity: 0.6;
}
.page__footer_l .company {
margin-right: 6em;
}
.page__footer_r {
display: flex;
margin: 0;
margin-left: auto;
font-size: 12px;
}
.page__footer_r .copy {
margin-left: 6em;
font-size: 14px;
}
@media screen and (max-width: 767.98px) {
.page__footer {
flex-direction: column;
padding: 20px 0;
height: auto;
}
.page__footer_l {
width: 90%;
}
.page__footer_l li {
width: 50%;
text-align: center;
}
.page__footer_l li .company {
margin-right: 0;
}
.page__footer_r {
margin-top: 2em;
width: 90%;
margin-left: 0;
flex-direction: column;
font-size: 10px;
}
.page__footer_r li {
width: 100%;
text-align: center;
}
.page__footer_r .copy {
margin-top: 1em;
margin-left: 0;
font-size: 10px;
}
}
.m-archives {
padding-bottom: 80px;
}
.m-archives__item {
padding: 0px;
}
.m-archives__item__inner {
padding: 30px 0px;
border-bottom: solid 1px #c4c4c4;
}
@media screen and (max-width: 590px) {
.m-archives__item__inner {
padding: 30px 15px;
}
}
.m-archives__item--time {
font-size: 14px;
font-weight: 400;
width: 70px;
margin-right: 20px;
padding: 4px 0px;
line-height: 1.6;
}
.m-archives__item--categpry {
text-align: center;
font-size: 12px;
width: 120px;
height: 30px;
color: #fff;
padding: 6px 0px;
margin-right: 20px;
}
.m-archives__item--categpry.is-all {
border-left: 1px solid #ff4c40;
border-right: 1px solid #0097fb;
color: #fd8881;
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
}
.m-archives__item--categpry.is-all:before, .m-archives__item--categpry.is-all:after {
content: "";
left: 0;
right: 0;
height: 1px;
position: absolute;
width: 100%;
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.m-archives__item--categpry.is-all:before {
top: 0;
}
.m-archives__item--categpry.is-all:after {
bottom: 0;
}
.m-archives__item--categpry.is-water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.m-archives__item--categpry.is-gas {
background: linear-gradient(90deg, #00b089, #088d74);
}
.m-archives__item--categpry.is-denki {
background: linear-gradient(90deg, #f09138, #f25a3e);
}
.m-archives__item--categpry.is-hikari {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.m-archives__item--categpry.is-water-sakutto {
background: linear-gradient(90deg, #94E2FC, #4DB5FA);
}
.m-archives__item--categpry.is-wifi {
background: linear-gradient(90deg, #976c93, #544584);
}
.m-archives__item--categpry.is-info {
background: #575757;
}
.m-archives__item--categpry.is-press {
background: #333333;
}
.m-archives__item--categpry.is-media {
background: #8e8e8e;
}
.m-archives__item--categpry.is-common {
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.m-archives__item--title {
width: calc(100% - 250px);
font-size: 15px;
font-weight: 400;
padding: 3.5px 15px 3.5px;
}
@media screen and (max-width: 590px) {
.m-archives__item--title {
width: 100%;
padding: 0px;
margin-top: 10px;
}
}
.m-category_list {
padding: 0px;
}
@media screen and (max-width: 590px) {
.m-category_list {
padding: 0px 15px;
}
}
.m-category_list__wrap {
margin: 80px auto 60px;
margin-right: 0px;
margin-left: 0px;
}
@media screen and (max-width: 590px) {
.m-category_list__wrap {
margin: 40px auto 30px;
}
}
.m-category_list__wrap__item {
display: inline-block;
margin: 10px 10px 10px 0px;
}
@media screen and (max-width: 590px) {
.m-category_list__wrap__item {
margin: 5px 10px 5px 0px;
}
}
.m-category_list__wrap__item__inner {
display: block;
font-size: 12px;
padding: 5px 20px;
color: #fff;
}
.m-category_list__wrap__item__inner:hover {
color: #ffffff;
}
@media screen and (max-width: 590px) {
.m-category_list__wrap__item__inner {
font-size: 10px;
font-weight: 400;
padding: 6px 8px;
}
}
.m-category_list__wrap__item.is-all {
position: relative;
border-left: 1px solid #ff4c40;
border-right: 1px solid #0097fb;
color: #fd8881;
display: block;
padding: 3px 14px;
font-size: 14px;
position: relative;
margin: 0px;
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
}
.m-category_list__wrap__item.is-all:before, .m-category_list__wrap__item.is-all:after {
content: "";
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
left: 0;
right: 0;
height: 1px;
position: absolute;
width: 100%;
}
.m-category_list__wrap__item.is-all:before {
top: 0;
}
.m-category_list__wrap__item.is-all:after {
bottom: 0;
}
.m-category_list__wrap__item.is-water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.m-category_list__wrap__item.is-gas {
background: linear-gradient(90deg, #00b089, #088d74);
}
.m-category_list__wrap__item.is-denki {
background: linear-gradient(90deg, #f09138, #f25a3e);
}
.m-category_list__wrap__item.is-hikari {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.m-category_list__wrap__item.is-water-sakutto {
background: linear-gradient(90deg, #94E2FC, #4DB5FA);
}
.m-category_list__wrap__item.is-wifi {
background: linear-gradient(90deg, #976c93, #544584);
}
.m-category_list__wrap__item.is-info {
background: #575757;
}
.m-category_list__wrap__item.is-press {
background: #333333;
}
.m-category_list__wrap__item.is-media {
background: #8e8e8e;
}
.m-category_list__wrap__item.is-common {
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.l-main .wp-pagenavi {
bottom: 0;
clear: both;
width: 100%;
padding: 60px 0;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
@media screen and (max-width: 590px) {
.l-main .wp-pagenavi {
padding: 30px 0;
column-gap: 8px;
}
}
.l-main .wp-pagenavi span.current {
padding: 9px 8px;
font-size: 14px;
font-weight: 400;
background: #939393;
margin: 0px 10px;
color: #fff;
text-align: center;
height: 40px;
width: 38px;
border-color: transparent;
}
@media screen and (max-width: 590px) {
.l-main .wp-pagenavi span.current {
margin: 0;
padding: 9px 0;
}
}
.l-main .wp-pagenavi a {
display: block;
float: left;
height: 40px;
width: 38px;
margin: 0px 10px;
font-size: 14px;
font-weight: 400;
border: 1px solid #424242;
padding: 9px 8px;
text-decoration: none;
}
@media screen and (max-width: 590px) {
.l-main .wp-pagenavi a {
padding: 9px 0;
margin: 0;
}
}
.l-main .wp-pagenavi a.nextpostslink {
border-color: transparent;
content: "";
height: 40px;
width: 30px;
background-position: center;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2229.595%22%20height%3D%2222.478%22%20viewBox%3D%220%200%2029.595%2022.478%22%3E%3Cg%20transform%3D%22translate(672.746%201306.974)%20rotate(180)%22%3E%3Cpath%20d%3D%22M13.583%2C0%2C11.414%2C11.344%2C0%2C13.526%22%20transform%3D%22translate(663.975%201295.715)%20rotate(135)%22%20fill%3D%22none%22%20stroke%3D%22%23707070%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3Cpath%20d%3D%22M13.583%2C0%2C11.414%2C11.344%2C0%2C13.526%22%20transform%3D%22translate(671.092%201295.715)%20rotate(135)%22%20fill%3D%22none%22%20stroke%3D%22%23707070%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-repeat: no-repeat;
}
.l-main .wp-pagenavi a.previouspostslink {
border-color: transparent;
content: "";
height: 40px;
width: 30px;
display: block;
background-position: center;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2229.595%22%20height%3D%2222.478%22%20viewBox%3D%220%200%2029.595%2022.478%22%3E%3Cg%20transform%3D%22translate(-643.151%20-1284.496)%22%3E%3Cpath%20d%3D%22M13.583%2C0%2C11.414%2C11.344%2C0%2C13.526%22%20transform%3D%22translate(663.975%201295.715)%20rotate(135)%22%20fill%3D%22none%22%20stroke%3D%22%23707070%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3Cpath%20d%3D%22M13.583%2C0%2C11.414%2C11.344%2C0%2C13.526%22%20transform%3D%22translate(671.092%201295.715)%20rotate(135)%22%20fill%3D%22none%22%20stroke%3D%22%23707070%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-repeat: no-repeat;
}
.p-breadcrumb .p-breadcrumb__inner {
font-size: 14px;
font-weight: 400;
height: 24px;
line-height: 2;
overflow: hidden;
margin-bottom: 0;
text-overflow: ellipsis;
white-space: nowrap;
color: #2D77C1;
list-style: none;
display: flex;
flex-wrap: wrap;
margin-bottom: 30px;
}
@media screen and (max-width: 590px) {
.p-breadcrumb .p-breadcrumb__inner {
font-size: 10px;
height: initial;
line-height: 2;
overflow: auto;
padding: 0px 10px;
white-space: initial;
}
}
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item {
display: inline-block;
padding-right: 14px;
position: relative;
}
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item span {
color: #2D77C1;
}
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item:before {
display: inline-block;
content: "";
width: 12px;
height: 12px;
border-left: 8px solid #2D77C1;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
}
@media screen and (max-width: 590px) {
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item:before {
display: inline-block;
content: "";
width: 8px;
height: 8px;
border-left: 6px solid #2D77C1;
border-top: 4px solid transparent;
border-bottom: 4px solid transparent;
}
}
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item:first-child {
padding-left: 0px;
}
.p-breadcrumb .p-breadcrumb__inner .p-breadcrumb__item:first-child:before {
display: none;
}
@media screen and (max-width: 590px) {
.p-breadcrumb {
margin-bottom: 0px;
}
}
.p-breadcrumb .breadcrumb___current {
color: #333333;
}
.p-yoast-breadcrumbs {
padding: 12px 30px;
z-index: 10;
}
@media screen and (max-width: 590px) {
.p-yoast-breadcrumbs {
padding-left: 8px;
}
}
.p-yoast-breadcrumbs a, .p-yoast-breadcrumbs span {
font-size: 13px !important;
letter-spacing: normal;
}
@media screen and (max-width: 590px) {
.p-yoast-breadcrumbs a, .p-yoast-breadcrumbs span {
font-size: 10px !important;
}
}
.p-yoast-breadcrumbs a:hover {
opacity: 0.5;
transition: 0.1s;
}
.single .p-yoast-breadcrumbs {
display: none;
}
.single .inner.pankuzu .p-yoast-breadcrumbs {
display: block;
padding: 12px 0;
}
.m-article_content ul {
width: 100%;
}
.m-article_content .sns-article-min {
padding-left: 0;
}
@media screen and (max-width: 590px) {
.m-article_content .sns-article_list_item {
margin-left: 3px;
margin-right: 2px;
}
}
.m-article_content .sns-article_list_item a {
display: block;
color: #fff;
padding: 2px 0px 2px 9px;
letter-spacing: 0.52px;
font-weight: 500;
box-shadow: none;
}
.m-article_content .sns-article_list_item a:hover {
color: #fff;
box-shadow: none;
}
.sns-article {
background-color: #FAFAFA;
border: 1px solid #DDDDDD;
border-radius: 4px;
padding: 20px 0;
}
.sns-article_title {
text-align: center;
font: normal normal normal 18px/30px Hiragino Sans;
letter-spacing: 1.8px;
color: #333333;
}
.sns-article_list {
margin-top: 20px;
text-align: center;
justify-content: center;
}
@media screen and (max-width: 590px) {
.sns-article_list {
display: flex;
justify-content: space-evenly;
}
}
.sns-article_list .sponly {
display: none;
}
@media screen and (max-width: 590px) {
.sns-article_list .sponly {
display: block;
}
}
.sns-article_list_item {
display: inline-block;
justify-content: center;
vertical-align: text-top;
position: relative;
width: 24%;
}
.sns-article_list_item .brpc {
display: inline;
}
@media screen and (max-width: 590px) {
.sns-article_list_item .brpc {
display: none;
}
}
@media screen and (max-width: 590px) {
.sns-article_list_item {
margin-right: 0;
width: 23%;
}
}
.sns-article_list_item a {
display: flex;
color: #fff;
letter-spacing: 0.52px;
font-weight: 500;
box-shadow: none;
flex-direction: column;
flex-wrap: nowrap;
align-content: center;
justify-content: center;
align-items: center;
height: 50px;
}
.sns-article_list_item a:hover {
transition: all 0.3s;
opacity: 0.7;
}
@media screen and (max-width: 590px) {
.sns-article_list_item a {
letter-spacing: 0.52px;
font-weight: 500;
align-items: center;
display: flex;
justify-content: center;
width: 100%;
font-size: 11px;
}
}
.sns-article_list_item.hatena {
background-color: #2c6ebd;
border-radius: 5px;
font-size: 12px;
}
.sns-article_list_item.hatena a {
font-weight: normal;
}
.sns-article_list_item.hatena .hatena_icon {
display: block;
text-align: center;
margin: 0 auto;
}
.sns-article_list_item.hatena .hatena_icon:before {
content: "B!";
font-family: Verdana;
font-weight: bold;
color: #fff;
font-size: 18px;
display: block;
text-align: center;
}
.sns-article_list_item.hatena .hatena_icon:before:hover {
transition: all 0.3s;
opacity: 0.7;
}
.sns-article_list_item.facebook {
position: relative;
background-color: #3B5998;
border-radius: 5px;
font-size: 12px;
}
.sns-article_list_item.facebook .facebook_icon {
display: block;
text-align: center;
margin: 0 auto;
}
.sns-article_list_item.facebook .facebook_icon:before {
display: block;
content: "\f39e";
position: relative;
color: #fff;
font-family: "Font Awesome 5 Brands";
font-size: 18px;
}
.sns-article_list_item.facebook .facebook_icon:before:hover {
transition: all 0.3s;
opacity: 0.7;
}
.sns-article_list_item.twitter {
background-color: #1A95E0;
border-radius: 5px;
font-size: 12px;
}
.sns-article_list_item.twitter .twitter_icon {
display: block;
text-align: center;
margin: 0 auto;
}
.sns-article_list_item.twitter .twitter_icon:before {
display: block;
content: "\f099";
position: relative;
color: #fff;
font-family: "Font Awesome 5 Brands";
font-size: 18px;
}
.sns-article_list_item.twitter .twitter_icon:before:hover {
transition: all 0.3s;
opacity: 0.7;
}
.sns-article_list_item.line {
background-color: #00B901;
border-radius: 5px;
font-size: 12px;
}
.sns-article_list_item.line .line_icon {
display: block;
text-align: center;
margin: 4px auto 5px;
}
.sns-article_list_item.line .line_icon:before {
display: block;
content: "";
width: 20px;
height: 20px;
position: relative;
color: #fff;
background-repeat: no-repeat;
background-image: url(https://marutto.co.jp/wp-content/themes/marutto/app/img/column/line-icon.svg);
background-size: 100%;
background-position: center;
}
.sns-article_list_item.line .line_icon:before:hover {
transition: all 0.3s;
opacity: 0.7;
}
.sns-article-min {
display: flex;
padding-left: 20px;
}
@media screen and (max-width: 590px) {
.sns-article-min {
display: block;
padding: 0;
}
}
.m-article {
padding-bottom: 50px;
}
.m-article .m-single-head__info {
border-bottom: solid 1px #333333;
display: flex;
justify-content: space-between;
}
.m-article .m-single-head__info--category {
display: block;
font-size: 12px;
padding: 8px 20px;
color: #fff;
background: #575757;
margin-bottom: 5px;
}
@media screen and (max-width: 590px) {
.m-article .m-single-head__info--category {
font-size: 10px;
padding: 4px 8px;
}
}
.m-article .m-single-head__info--category.is-all {
border-left: solid 1px #424242;
border-right: solid 1px #424242;
}
.m-article .m-single-head__info--category.is-water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.m-article .m-single-head__info--category.is-gas {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.m-article .m-single-head__info--category.is-denki {
background: linear-gradient(90deg, #f09138, #f25a3e);
}
.m-article .m-single-head__info--category.is-hikari {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.m-article .m-single-head__info--category.is-wifi {
background: #575757;
}
.m-article .m-single-head__info--category.is-info {
background: #575757;
}
.m-article .m-single-head__info--category.is-press {
background: #333333;
}
.m-article .m-single-head__info--category.is-media {
background: #8e8e8e;
}
.m-article .m-single-head__info--category.is-common {
background: -webkit-linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.m-article .m-single-head__info--date {
font-size: 14px;
margin-top: 5px;
}
.m-article .m-single-head__title {
font-size: 32px;
font-weight: bold;
letter-spacing: 2px;
margin: 30px 0px;
}
.m-article .entry-content {
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
font-size: 16px;
font-weight: 400;
margin: 0px auto 120px;
word-break: break-all;
word-wrap: break-word;          }
.m-article .entry-content h1,
.m-article .entry-content h2,
.m-article .entry-content h3,
.m-article .entry-content h4,
.m-article .entry-content h5,
.m-article .entry-content h6 {
clear: both;
line-height: 1.4;
margin: 0 0 0.75em;
padding: 1.5em 0 0;
}
.m-article .entry-content h1:first-child,
.m-article .entry-content h2:first-child,
.m-article .entry-content h3:first-child,
.m-article .entry-content h4:first-child,
.m-article .entry-content h5:first-child,
.m-article .entry-content h6:first-child {
padding-top: 0;
}
.m-article .entry-content h1 {
font-size: 24px;
font-weight: 400;
}
.m-article .entry-content h2 {
color: #666;
font-size: 20px;
font-weight: 400;
}
.m-article .entry-content h3 {
color: #333;
font-size: 18px;
font-weight: 400;
}
.m-article .entry-content h4 {
color: #333;
font-size: 16px;
font-weight: 800;
}
.m-article .entry-content h5 {
color: #767676;
font-size: 13px;
font-weight: 800;
letter-spacing: 0.15rem;
text-transform: uppercase;
}
.m-article .entry-content h6 {
color: #333;
font-size: 15px;
font-weight: 800;
}
.m-article .entry-content p {
margin: 0 0 1.5rem;
padding: 0;
}
.m-article .entry-content dfn,
.m-article .entry-content cite,
.m-article .entry-content em,
.m-article .entry-content i {
font-style: italic;
}
.m-article .entry-content blockquote {
color: #666;
font-size: 18px;
font-style: italic;
line-height: 1.7;
margin: 0;
overflow: hidden;
padding: 0;
}
.m-article .entry-content blockquote.alignleft, .m-article .entry-content blockquote.alignright {
font-size: 14px;
width: 34%;
}
.m-article .entry-content address {
margin: 0 0 1.5rem;
}
.m-article .entry-content pre {
background: #eee;
font-size: 15px;
line-height: 1.6;
margin-bottom: 1.6rem;
max-width: 100%;
overflow: auto;
padding: 1.6rem;
}
.m-article .entry-content code,
.m-article .entry-content kbd,
.m-article .entry-content tt,
.m-article .entry-content var {
font-size: 15px;
}
.m-article .entry-content abbr,
.m-article .entry-content acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
.m-article .entry-content mark,
.m-article .entry-content ins {
background: #eee;
text-decoration: none;
}
.m-article .entry-content big {
font-size: 125%;
}
.m-article .entry-content blockquote,
.m-article .entry-content q {
quotes: "" "";
}
.m-article .entry-content blockquote:before, .m-article .entry-content blockquote:after,
.m-article .entry-content q:before,
.m-article .entry-content q:after {
content: "";
}
.m-article .entry-content hr {
background-color: #bbb;
border: 0;
height: 1px;
margin-bottom: 1.5rem;
}
.m-article .entry-content ul,
.m-article .entry-content ol {
margin: 0 0 1.5rem;
padding: 0;
}
.m-article .entry-content ul {
list-style: disc;
}
.m-article .entry-content ol > li {
position: relative;
}
.m-article .entry-content li > ul,
.m-article .entry-content li > ol {
margin-bottom: 0;
margin-left: 1.5rem;
}
.m-article .entry-content dt {
font-weight: 700;
}
.m-article .entry-content dd {
margin: 0 1.5rem 1.5rem;
}
.m-article .entry-content table {
border-collapse: collapse;
margin: 0 0 1.5rem;
width: 100%;
}
.m-article .entry-content thead th {
border-bottom: 2px solid #bbb;
padding-bottom: 0.5rem;
}
.m-article .entry-content th {
padding: 0.4rem;
text-align: left;
}
.m-article .entry-content tr {
border-bottom: 1px solid #eee;
}
.m-article .entry-content td {
padding: 0.4rem;
}
.m-article .entry-content th:first-child,
.m-article .entry-content td:first-child {
padding-left: 0;
}
.m-article .entry-content th:last-child,
.m-article .entry-content td:last-child {
padding-right: 0;
}
.m-article .entry-content a {
-webkit-box-shadow: inset 0 -1px 0 rgb(15, 15, 15);
box-shadow: inset 0 -1px 0 rgb(15, 15, 15);
color: #222;
text-decoration: none;
-webkit-transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
transition: color 80ms ease-in, -webkit-box-shadow 130ms ease-in-out;
transition: color 80ms ease-in, box-shadow 130ms ease-in-out;
transition: color 80ms ease-in, box-shadow 130ms ease-in-out, -webkit-box-shadow 130ms ease-in-out; }
.m-article .entry-content a:focus {
outline: thin dotted;
}
.m-article .entry-content a:hover, .m-article .entry-content a:focus {
color: #000;
-webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgb(0, 0, 0);
box-shadow: inset 0 0 0 rgba(0, 0, 0, 0), 0 3px 0 rgb(0, 0, 0);
}
.m-article .entry-content a img {
background: #fff;
-webkit-box-shadow: 0 0 0 6px #fff;
box-shadow: 0 0 0 6px #fff;
}
.m-article .entry-content img {
height: auto; max-width: 100%; }
.m-article .entry-content embed,
.m-article .entry-content iframe,
.m-article .entry-content object {
margin-bottom: 1.5rem;
max-width: 100%;
}
.m-article .entry-content .wp-caption {
color: #666;
font-size: 13px;
font-style: italic;
margin-bottom: 1.5rem;
max-width: 100%;
}
.m-article .entry-content .wp-caption img[class*=wp-image-] {
display: block;
margin-left: auto;
margin-right: auto;
}
.m-article .entry-content .wp-caption .wp-caption-text {
margin: 0.8075rem 0;
}
.m-article .entry-content .gallery {
margin-bottom: 1.5rem;
}
.m-article .entry-content .gallery-item {
display: inline-block;
text-align: center;
vertical-align: top;
width: 100%;
}
.m-article .entry-content .gallery-item a,
.m-article .entry-content .gallery-item a:hover,
.m-article .entry-content .gallery-item a:focus {
-webkit-box-shadow: none;
box-shadow: none;
background: none;
display: inline-block;
}
.m-article .entry-content .gallery-columns-2 .gallery-item {
max-width: 50%;
}
.m-article .entry-content .gallery-columns-3 .gallery-item {
max-width: 33.33%;
}
.m-article .entry-content .gallery-columns-4 .gallery-item {
max-width: 25%;
}
.m-article .entry-content .gallery-columns-5 .gallery-item {
max-width: 20%;
}
.m-article .entry-content .gallery-columns-6 .gallery-item {
max-width: 16.66%;
}
.m-article .entry-content .gallery-columns-7 .gallery-item {
max-width: 14.28%;
}
.m-article .entry-content .gallery-columns-8 .gallery-item {
max-width: 12.5%;
}
.m-article .entry-content .gallery-columns-9 .gallery-item {
max-width: 11.11%;
}
.m-article .entry-content .gallery-caption {
display: block;
}
.m-article .entry-content .mejs-container {
margin-bottom: 1.5rem;
}
.m-article .entry-content .mejs-controls a.mejs-horizontal-volume-slider,
.m-article .entry-content .mejs-controls a.mejs-horizontal-volume-slider:focus,
.m-article .entry-content .mejs-controls a.mejs-horizontal-volume-slider:hover {
background: transparent;
border: 0;
}
.m-article .entry-content .wp-playlist-light {
border-color: #eee;
color: #222;
}
.m-article .entry-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-album {
color: #333;
}
.m-article .entry-content .wp-playlist-light .wp-playlist-current-item .wp-playlist-item-artist {
color: #767676;
}
.m-article .entry-content .wp-playlist-light .wp-playlist-item {
border-bottom: 1px dotted #eee;
-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
}
.m-article .entry-content .wp-playlist-light .wp-playlist-item:hover, .m-article .entry-content .wp-playlist-light .wp-playlist-item:focus {
border-bottom-color: rgba(0, 0, 0, 0);
background-color: #767676;
color: #fff;
}
.m-article .entry-content .wp-playlist-light a.wp-playlist-caption:hover,
.m-article .entry-content .wp-playlist-light .wp-playlist-item:hover a,
.m-article .entry-content .wp-playlist-light .wp-playlist-item:focus a {
color: #fff;
}
.m-article .entry-content .wp-playlist-dark {
background: #222;
border-color: #333;
}
.m-article .entry-content .wp-playlist-dark .mejs-container .mejs-controls {
background-color: #333;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-caption {
color: #fff;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-album {
color: #eee;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-current-item .wp-playlist-item-artist {
color: #aaa;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-playing {
background-color: #333;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-item {
border-bottom: 1px dotted #555;
-webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, color 0.3s ease-in-out;
}
.m-article .entry-content .wp-playlist-dark .wp-playlist-item:hover, .m-article .entry-content .wp-playlist-dark .wp-playlist-item:focus {
border-bottom-color: rgba(0, 0, 0, 0);
background-color: #aaa;
color: #222;
}
.m-article .entry-content .wp-playlist-dark a.wp-playlist-caption:hover,
.m-article .entry-content .wp-playlist-dark .wp-playlist-item:hover a,
.m-article .entry-content .wp-playlist-dark .wp-playlist-item:focus a {
color: #222;
}
.m-article .entry-content .wp-playlist {
padding: 0.625rem 0.625rem 0.3125rem;
}
.m-article .entry-content .wp-playlist-current-item .wp-playlist-item-title {
font-weight: 700;
}
.m-article .entry-content .wp-playlist-current-item .wp-playlist-item-album {
font-style: normal;
}
.m-article .entry-content .wp-playlist-current-item .wp-playlist-item-artist {
font-size: 10px;
font-size: 0.625rem;
font-weight: 800;
letter-spacing: 0.1818rem;
text-transform: uppercase;
}
.m-article .entry-content .wp-playlist-item {
padding: 0 0.3125rem;
cursor: pointer;
}
.m-article .entry-content .wp-playlist-item:last-of-type {
border-bottom: none;
}
.m-article .entry-content .wp-playlist-item a {
padding: 0.3125rem 0;
border-bottom: none;
}
.m-article .entry-content .wp-playlist-item a, .m-article .entry-content .wp-playlist-item a:focus, .m-article .entry-content .wp-playlist-item a:hover {
-webkit-box-shadow: none;
box-shadow: none;
background: transparent;
}
.m-article .entry-content .wp-playlist-item-length {
top: 5px;
}
.m-article .entry-content .rtl th {
text-align: right;
}
.m-article .entry-content .rtl ol > li:before {
left: auto;
right: -1.5rem;
}
.m-article .entry-content .rtl li > ul,
.m-article .entry-content .rtl li > ol {
margin-left: 0;
margin-right: 1.5rem;
}
.m-article .entry-content .rtl .mejs-offscreen {
right: -10000px;
}
.m-article .m-single-foot {
width: 100%;
}
.m-article .m-single-foot__inner {
width: 100%;
max-width: 1140px;
margin: 0px auto;
}
.m-article .m-single-foot__btn {
display: flex;
}
@media screen and (max-width: 590px) {
.m-article .m-single-foot__btn {
flex-direction: column-reverse;
}
}
.m-article .m-single-foot__btn--back {
width: 100%;
max-width: 435px;
font-size: 16px;
}
.m-article .m-single-foot__btn--gotop {
width: 100%;
font-weight: 500;
display: flex;
justify-content: flex-end;
align-items: center;
}
@media screen and (max-width: 590px) {
.m-article .m-single-foot__btn--gotop {
margin-bottom: 30px;
}
}
.m-article .m-single-foot__btn--gotop__inner {
display: inline-block;
font-size: 14px;
position: relative;
padding-left: 16px;
}
.m-article .m-single-foot__btn--gotop__inner:before {
display: inline-block;
position: absolute;
left: 0;
content: "";
width: 12px;
height: 12px;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid transparent;
border-bottom: 8px solid #333333;
}
.m-404 {
display: flex;
justify-content: center;
align-items: center;
height: calc(100vh - 400px);
}
.m-404__title {
font-size: 36px;
text-align: center;
line-height: 2;
}
.m-404__text {
font-size: 18px;
text-align: center;
line-height: 2;
}
.m-sigle_ads2 {
width: 100%;
padding: 0 15px 30px;
}
.m-sigle_ads2__items__inner {
display: inline-block;
width: 100%;
}
.m-sigle_ads2__items img {
display: block;
width: 100%;
}
@media screen and (max-width:768px) {
.m-sigle_ads2__items img .m-sigle_ads2 {
padding: 0 0 30px;
}
}

.is-fs_title {
font-size: 24px !important;
font-weight: 700 !important;
line-height: 36px !important;
}
@media screen and (max-width: 590px) {
.is-fs_title {
font-size: 20px !important;
font-weight: 700 !important;
line-height: 30px !important;
}
}
.is-fs_catch {
font-size: 34px !important;
font-weight: 200 !important;
line-height: 58px !important;
}
@media screen and (max-width: 590px) {
.is-fs_catch {
font-size: 22px !important;
font-weight: 300 !important;
line-height: 34px !important;
}
}
.is-fs_read {
font-size: 20px !important;
font-weight: 600 !important;
line-height: 34px !important;
}
@media screen and (max-width: 590px) {
.is-fs_read {
font-size: 16px !important;
font-weight: 600 !important;
line-height: 28px !important;
}
}
.is-fs_text {
font-size: 18px !important;
font-weight: 400 !important;
line-height: 32px !important;
}
@media screen and (max-width: 590px) {
.is-fs_text {
font-size: 16px !important;
font-weight: 400 !important;
line-height: 28px !important;
}
}
.is-fs_remark {
font-size: 14px !important;
font-weight: 400 !important;
line-height: 24px !important;
}
@media screen and (max-width: 590px) {
.is-fs_remark {
font-size: 12px !important;
font-weight: 400 !important;
line-height: 20px !important;
}
}
a {
color: #000000;
text-decoration: none;
cursor: pointer;
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
a:hover {
text-decoration: none;
filter: alpha(opaCity=70);
-moz-opaCity: 0.7;
opacity: 0.7;
}
a:hover img {
opaCity: 0.7;
filter: alpha(opaCity=70);
}
.button {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 60px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.button {
font-size: 14px;
font-weight: normal;
}
}
.button.more {
position: relative;
}
.button.more::before, .button.more::after {
position: absolute;
transition-duration: 0.3s;
right: 20px;
top: 50%;
transform: translateY(-50%);
content: "";
}
.button.more::before {
width: 45px;
height: 1px;
background-color: #000;
}
.button.more::after {
border-left: 6px solid #000;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button.more:hover::before {
width: 55px;
right: 10px;
}
.button.more:hover::after {
right: 10px;
}
@media screen and (max-width: 590px) {
.button.more::before, .button.more::after {
right: 10px;
}
.button.more::before {
width: 20px;
}
.button.more:hover::before {
width: 25px;
right: 10px;
}
}
.button.white {
background-color: #fff;
border: 1px solid #000;
}
.button.white:hover {
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
}
.button.white:hover::before {
background-color: #fff;
}
.button.white:hover::after {
border-left: 6px solid #fff;
}
.button.border-w {
border: 1px solid #fff;
}
.button.back {
position: relative;
}
.button.back::before, .button.back::after {
position: absolute;
transition-duration: 0.3s;
left: 20px;
top: 50%;
transform: translateY(-50%);
content: "";
}
.button.back::before {
width: 45px;
height: 1px;
background-color: #000;
}
.button.back::after {
border-right: 6px solid #000;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button.back:hover::before {
width: 55px;
left: 10px;
background-color: #000;
}
.button.back:hover::after {
border-left: transparent;
left: 10px;
}
@media screen and (max-width: 590px) {
.button.back::before {
width: 20px;
}
.button.back:hover::before {
width: 25px;
left: 10px;
}
}
.button.grade {
color: #fff;
}
.button.grade.denki {
background: linear-gradient(90deg, #f09138, #f25a3e);
}
.button.grade.gas {
background: linear-gradient(90deg, #00b089, #088d74);
}
.button.grade.hikari {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.button.grade.water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.button.grade.other {
background: linear-gradient(90deg, #ffaa36, #ff5340);
}
.button.grade.application {
background: linear-gradient(90deg, #ffc531, #ff903e);
}
.button.grade.application:hover {
border: solid 1px #ff903e;
background: #fff;
color: #ff903e;
opacity: 1 !important;
}
.button.grade.application:hover::before {
background-color: #ff903e;
}
.button.grade.application:hover::after {
border-left: 6px solid #ff903e;
}
@media screen and (max-width: 590px) {
.button.grade.application {
font-weight: 700;
}
}
.button.grade.more::before {
width: 45px;
height: 1px;
background-color: #fff;
}
.button.grade.more::after {
border-left: 6px solid #fff;
}
@media screen and (max-width: 590px) {
.button.grade.more::before {
width: 20px;
}
}
.button.no-border {
text-align: left !important;
padding-right: 60px;
font-size: 17px;
}
.button.no-border::before {
background-color: #4692ff;
}
.button.no-border::after {
border-left: 6px solid #4692ff;
}
.button-triangle {
position: relative;
display: flex;
justify-content: center;
align-items: center;
height: 50px;
align-items: center;
color: #fff;
border: 1px solid;
}
.button-triangle span {
margin-top: 4px;
line-height: 1;
}
.button-triangle::after {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
font-family: "Font Awesome 5 Free";
content: "\f0da";
font-weight: 900;
}
.button-blue {
color: #fff;
background-color: #85c5e6;
}
.button-blue::before {
width: 35px;
background-color: #fff !important;
}
.button-blue::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button-blue:hover {
color: #fff;
}
.button-blue:hover::before {
width: 45px;
}
.button-dark_blue {
margin-right: 20px !important;
color: #fff;
background-color: #2d77c1;
}
.button-dark_blue::before {
background-color: #fff !important;
}
.button-dark_blue::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
.button-dark_blue:hover {
color: #fff;
}
.button.contact_01 {
margin: 20px 0;
width: 30%;
}
.news__button_rect::before, .column__button_rect::before {
width: 35px;
background-color: #fff !important;
}
.news__button_rect::after, .column__button_rect::after {
border-left: 6px solid #fff !important;
border-top: 6px solid transparent;
border-bottom: 6px solid transparent;
content: "";
}
#top .news__button_rect, #top .column__button_rect {
background-color: #85c5e6;
border-color: #85c5e6;
color: white;
}
#denki-top .news__button_rect, #denki-top .column__button_rect {
background-color: #fe5c52;
border-color: #fe5c52;
color: white;
}
#gas-top .news__button_rect, #gas-top .column__button_rect {
background-color: #00d099;
border-color: #00d099;
color: white;
}
#hikari-top .news__button_rect, #hikari-top .column__button_rect {
background-color: #ff8b40;
border-color: #ff8b40;
color: white;
}
#water-top .news__button_rect, #water-top .column__button_rect {
background-color: #11a9Da;
border-color: #11a9Da;
color: white;
}
#it-top .news__button_rect, #it-top .column__button_rect {
background-color: #c86f98;
border-color: #c86f98;
color: white;
}
.button-triangle:hover {
background-color: #fff !important;
}
.headline_1 {
padding-bottom: 16px;
font-size: 24px;
font-weight: bold;
text-align: center;
line-height: 1.5em;
letter-spacing: 2px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: 100px auto;
background-position: center bottom;
}
.headline_1.denki {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/headline_1_line.svg);
}
.headline_1.hikari {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/headline_1_line.svg);
}
.headline_1.gas {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/headline_1_line.svg);
}
.headline_1.water {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.headline_1.other {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/privilege/headline_1_line.svg);
}
@media screen and (max-width: 590px) {
.headline_1 {
font-size: 20px;
}
}
#hikari-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/headline_1_line.svg);
}
#gas-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/headline_1_line.svg);
}
#water-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.headline_2 {
font-size: 34px;
line-height: 1.8em;
font-weight: 200;
}
.headline_2.is-denki_lead {
font-size: 22px;
font-weight: 700;
color: #ff4c40;
}
@media screen and (max-width: 590px) {
.headline_2 {
font-size: 22px;
line-height: 1.5em;
}
}
#denki-top .headline_2 {
font-size: 34px;
line-height: 1.8em;
font-weight: lighter;
}
#denki-top .headline_2.is-denki_lead {
font-size: 34px;
font-weight: 200;
color: #ff4c40;
}
@media screen and (max-width: 590px) {
#denki-top .headline_2.is-denki_lead {
font-size: 22px;
font-weight: 300;
}
}
.headline_3 {
font-size: 32px;
letter-spacing: 2px;
font-weight: bold;
}
.headline_3 span {
display: block;
font-size: 12px;
font-weight: bold;
}
.headline_4 {
font-size: 32px;
letter-spacing: 2px;
}
.headline_4 span {
display: block;
font-size: 16px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.headline_4 {
font-size: 24px;
letter-spacing: 1px;
}
.headline_4 span {
font-size: 14px;
}
}
.headline_5 {
font-size: 58px;
font-family: "Dancing Script", cursive;
text-align: center;
}
.headline_5 div {
margin: 0;
display: inline-block;
}
.headline_5 span {
display: block;
font-size: 16px;
font-weight: bold;
text-align: right;
}
@media screen and (max-width: 590px) {
.headline_5 {
font-size: 32px;
}
.headline_5 span {
margin-top: 10px;
font-size: 14px;
}
}
.headline_6 {
position: relative;
padding-top: 80px;
font-size: 34px;
letter-spacing: 2px;
text-align: center;
}
.headline_6 > span {
margin-top: 10px;
display: block;
font-size: 16px;
font-weight: bold;
}
.headline_6::before {
position: absolute;
left: 50%;
top: 0;
width: 1px;
height: 60px;
content: "";
}
.headline_6.denki span {
color: #f09138;
}
.headline_6.denki::before {
background-color: #f09138;
}
.headline_6.hikari span {
color: #ffc531;
}
.headline_6.hikari::before {
background-color: #ffc531;
}
.headline_6.gas span {
color: #00b089;
}
.headline_6.gas::before {
background-color: #00b089;
}
.headline_6.water span {
color: #0196f9;
}
.headline_6.water::before {
background-color: #0196f9;
}
.headline_6.other span {
color: #fd8881;
background: linear-gradient(90deg, #ff4c40, #a96f98, #0097fb);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
}
.headline_6.other::before {
background: linear-gradient(0deg, #ff4c40, #a96f98, #0097fb);
}
.headline_6.other2 span {
color: #494949;
}
.headline_6.other2::before {
background-color: #494949;
}
@media screen and (max-width: 590px) {
.headline_6 {
padding-top: 40px;
font-size: 26px;
}
.headline_6::before {
height: 30px;
}
}
.headline_7 {
font-size: 20px;
font-weight: bold;
line-height: 1.5em;
}
.headline_7.denki {
color: #551d00;
}
.headline_7.hikari {
color: #746216;
}
.headline_7.gas {
color: #00b089;
}
.headline_7.water {
color: #175190;
}
.headline_8 {
font-size: 28px;
line-height: 2em;
}
@media screen and (max-width: 960px) {
.headline_8 {
font-size: 24px;
}
}
@media screen and (max-width: 590px) {
.headline_8 {
font-size: 20px;
line-height: 1.5em;
}
}
.kome {
text-align: left;
font-size: 14px;
text-indent: -1em;
padding-left: 1em;
opacity: 0.8;
vertical-align: super;
}
.kome.half {
padding-left: 0;
}
.note {
font-size: 14px;
opacity: 0.8;
}
.new {
margin-right: 5px;
width: 50px;
height: 20px;
line-height: 20px;
border-radius: 30px;
background-color: #ff6864;
color: #fff;
font-size: 11px;
font-weight: normal;
text-align: center;
}
.text-blue {
color: blue;
}
.tab-wrap {
position: relative;
display: flex;
flex-wrap: wrap;
background-color: #fff;
}
.tab-wrap_sp-only {
display: none;
}
.tab {
display: none;
}
.tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
display: block;
}
.tab:checked + label {
position: relative;
color: #fff;
background-color: #333;
cursor: default;
}
.tab:checked + label:hover {
background-color: #333;
}
.tab:checked + label::after {
position: absolute;
bottom: -14px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #333;
content: "";
}
.tab + label {
display: flex;
justify-content: center;
align-items: center;
flex-grow: 3;
text-align: center;
user-select: none;
text-align: center;
width: 50%;
height: 60px;
color: #333;
font-weight: bold;
background-color: #fff;
border-top: 4px solid #333;
border-left: 2px solid #333;
border-bottom: 4px solid #333;
border-right: 2px solid #333;
cursor: pointer;
transition: transform 1s ease-in-out 0s;
-moz-transition: -moz-transform 1s ease-in-out 0s;
-webkit-transition: -webkit-transform 1s ease-in-out 0s;
}
.tab + label.first {
border-left: 4px solid #333;
}
.tab + label.last {
border-right: 4px solid #333;
}
.tab + label span {
position: relative;
line-height: 1;
}
.tab + label span::after {
position: absolute;
left: -45px;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 35px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
content: "";
}
.tab + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_2.svg);
}
.tab + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
.tab + label span.tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
.tab + label span.tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
.tab + label:hover {
background-color: #f9f9f9;
}
.tab:checked + label .tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab:checked + label .tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_1.svg);
}
.tab:checked + label .tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.tab:checked + label .tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.tab:not(:checked) + label:hover {
background-color: #333;
color: #fff;
}
.tab:not(:checked) + label:hover .tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab:not(:checked) + label:hover .tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_1.svg);
}
.tab:not(:checked) + label:hover .tab1_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.tab:not(:checked) + label:hover .tab2_hikari::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.tab__content {
position: absolute;
left: 0;
padding: 40px;
width: 100%;
background-color: transparent;
z-index: -1;
opacity: 0;
transform: translateY(-3px);
display: none;
}
@media screen and (max-width: 960px) {
.tab-wrap {
display: none;
}
.tab-wrap_sp-only {
display: block;
}
.tab-wrap_sp-only__list {
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
}
.tab-wrap_sp-only__item {
display: inline-block;
width: 90%;
white-space: pre-line;
background-color: #fff;
vertical-align: top;
}
.tab-wrap_sp-only__title {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 70px;
color: #fff;
text-align: center;
background-color: #444;
}
.tab-wrap_sp-only__title span {
line-height: 1.2em;
}
.tab-wrap_sp-only__title::after {
position: absolute;
left: 10px;
top: 50%;
transform: translateY(-50%);
width: 35px;
height: 35px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
content: "";
}
.tab-wrap_sp-only__title.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.tab-wrap_sp-only__title.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
}
.fadein {
visibility: hidden;
}
@media screen and (max-width: 590px) {
.fadein {
visibility: visible;
}
}
@media screen and (min-width: 591px) {
.css-fadeUp_1.fadeInUp {
visibility: visible; animation-name: fade-in-up_1; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0; animation-fill-mode: both;
} @keyframes fade-in-up_1 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.css-fadeUp_2.fadeInUp {
visibility: visible; animation-name: fade-in-up_2; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0.25s; animation-fill-mode: both;
} @keyframes fade-in-up_2 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.css-fadeUp_3.fadeInUp {
visibility: visible; animation-name: fade-in-up_3; animation-duration: 1s; animation-timing-function: ease-out; animation-delay: 0.5s; animation-fill-mode: both;
} @keyframes fade-in-up_3 {
0% {
opacity: 0;
transform: translate3d(0, 150px, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0, 0);
}
}
.fadein {
visibility: hidden;
}
.css-fade_1.fadeInUp {
visibility: visible; animation-name: fade-in_1; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.25s; animation-fill-mode: both;
} @keyframes fade-in_1 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
.css-fade_2.fadeInUp {
visibility: visible; animation-name: fade-in_2; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.5s; animation-fill-mode: both;
} @keyframes fade-in_2 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
.css-fade_3.fadeInUp {
visibility: visible; animation-name: fade-in_3; animation-duration: 3s; animation-timing-function: ease-out; animation-delay: 0.75s; animation-fill-mode: both;
} @keyframes fade-in_3 {
0% {
opacity: 0;
transform: translate3d(0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 0);
}
}
}
.bold {
font-weight: bold;
}
.is-note_sans {
font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif !important;
}
.brpc {
display: block;
}
@media screen and (max-width: 590px) {
.brpc {
display: none;
}
}
.brtab {
display: none;
}
@media screen and (max-width: 960px) {
.brtab {
display: block;
}
}
.brsp {
display: none;
}
@media screen and (max-width: 590px) {
.brsp {
display: block;
}
}
@media screen and (max-width: 590px) {
.is-text-justify {
text-align: justify !important;
text-justify: inter-character !important;
}
}
.is-inbox_justify {
text-align: justify !important;
text-justify: inter-character !important;
} @font-face {
font-family: "Trebuchet MS";
font-style: normal;
font-weight: normal;
src: local("../font/Trebuchet MS"), url(//marutto.co.jp/wp-content/themes/marutto/app/fonts/trebuc.woff) format("woff");
} .swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
float: left;
}
.swiper-container-vertical > .swiper-wrapper {
-webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.swiper-container-android .swiper-slide, .swiper-wrapper {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-o-transform: translate(0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
-webkit-box-lines: multiple;
-moz-box-lines: multiple;
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
margin: 0 auto;
}
.swiper-slide {
-webkit-flex-shrink: 0;
-ms-flex: 0 0 auto;
flex-shrink: 0;
width: 100%;
height: 100%;
position: relative;
}
.swiper-container-autoheight, .swiper-container-autoheight .swiper-slide {
height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
-webkit-transition-property: -webkit-transform, height;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform, height;
}
.swiper-container .swiper-notification {
position: absolute;
left: 0;
top: 0;
pointer-events: none;
opacity: 0;
z-index: -1000;
}
.swiper-wp8-horizontal {
-ms-touch-action: pan-y;
touch-action: pan-y;
}
.swiper-wp8-vertical {
-ms-touch-action: pan-x;
touch-action: pan-x;
}
.swiper-button-next, .swiper-button-prev {
position: absolute;
top: 50%;
width: 27px;
height: 44px;
margin-top: -22px;
z-index: 10;
cursor: pointer;
-moz-background-size: 27px 44px;
-webkit-background-size: 27px 44px;
background-size: 27px 44px;
background-position: center;
background-repeat: no-repeat;
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
opacity: 0.35;
cursor: auto;
pointer-events: none;
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
left: 10px;
right: auto;
}
.swiper-button-prev.swiper-button-black, .swiper-container-rtl .swiper-button-next.swiper-button-black {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.swiper-button-white, .swiper-container-rtl .swiper-button-next.swiper-button-white {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
right: 10px;
left: auto;
}
.swiper-button-next.swiper-button-black, .swiper-container-rtl .swiper-button-prev.swiper-button-black {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-white, .swiper-container-rtl .swiper-button-prev.swiper-button-white {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-pagination {
position: absolute;
text-align: center;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
.swiper-container-horizontal > .swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {
bottom: 10px;
left: 0;
width: 100%;
}
.swiper-pagination-bullet {
width: 8px;
height: 8px;
display: inline-block;
border-radius: 100%;
background: #000;
opacity: 0.2;
}
button.swiper-pagination-bullet {
border: none;
margin: 0;
padding: 0;
box-shadow: none;
-moz-appearance: none;
-ms-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-pagination-white .swiper-pagination-bullet {
background: #fff;
}
.swiper-pagination-bullet-active {
opacity: 1;
background: #007aff;
}
.swiper-pagination-white .swiper-pagination-bullet-active {
background: #fff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
background: #000;
}
.swiper-container-vertical > .swiper-pagination-bullets {
right: 10px;
top: 50%;
-webkit-transform: translate3d(0, -50%, 0);
-moz-transform: translate3d(0, -50%, 0);
-o-transform: translate(0, -50%);
-ms-transform: translate3d(0, -50%, 0);
transform: translate3d(0, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 5px 0;
display: block;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 5px;
}
.swiper-pagination-progress {
background: rgba(0, 0, 0, 0.25);
position: absolute;
}
.swiper-pagination-progress .swiper-pagination-progressbar {
background: #007aff;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-webkit-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
-webkit-transform-origin: left top;
-moz-transform-origin: left top;
-ms-transform-origin: left top;
-o-transform-origin: left top;
transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
-webkit-transform-origin: right top;
-moz-transform-origin: right top;
-ms-transform-origin: right top;
-o-transform-origin: right top;
transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progress {
width: 100%;
height: 4px;
left: 0;
top: 0;
}
.swiper-container-vertical > .swiper-pagination-progress {
width: 4px;
height: 100%;
left: 0;
top: 0;
}
.swiper-pagination-progress.swiper-pagination-white {
background: rgba(255, 255, 255, 0.5);
}
.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
background: #fff;
}
.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
background: #000;
}
.swiper-container-3d {
-webkit-perspective: 1200px;
-moz-perspective: 1200px;
-o-perspective: 1200px;
perspective: 1200px;
}
.swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
pointer-events: none;
z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper {
-ms-perspective: 1200px;
}
.swiper-container-cube, .swiper-container-flip {
overflow: visible;
}
.swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide {
pointer-events: none;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
z-index: 1;
}
.swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
z-index: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility: hidden;
backface-visibility: hidden;
}
.swiper-container-cube .swiper-slide {
visibility: hidden;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
width: 100%;
height: 100%;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
-webkit-transform-origin: 100% 0;
-moz-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next + .swiper-slide, .swiper-container-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible;
}
.swiper-container-cube .swiper-cube-shadow {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
background: #000;
opacity: 0.6;
-webkit-filter: blur(50px);
filter: blur(50px);
z-index: 0;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
-webkit-transition-timing-function: ease-out;
-moz-transition-timing-function: ease-out;
-ms-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
pointer-events: none;
-webkit-transition-property: opacity;
-moz-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-zoom-container {
width: 100%;
height: 100%;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-moz-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-moz-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
text-align: center;
}
.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.swiper-scrollbar {
border-radius: 10px;
position: relative;
-ms-touch-action: none;
background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
position: absolute;
left: 1%;
bottom: 3px;
z-index: 50;
height: 5px;
width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
position: absolute;
right: 3px;
top: 1%;
z-index: 50;
width: 5px;
height: 98%;
}
.swiper-scrollbar-drag {
height: 100%;
width: 100%;
position: relative;
background: rgba(0, 0, 0, 0.5);
border-radius: 10px;
left: 0;
top: 0;
}
.swiper-scrollbar-cursor-drag {
cursor: move;
}
.swiper-lazy-preloader {
width: 42px;
height: 42px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -21px;
margin-top: -21px;
z-index: 10;
-webkit-transform-origin: 50%;
-moz-transform-origin: 50%;
transform-origin: 50%;
-webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
-moz-animation: swiper-preloader-spin 1s steps(12, end) infinite;
animation: swiper-preloader-spin 1s steps(12, end) infinite;
}
.swiper-lazy-preloader:after {
display: block;
content: "";
width: 100%;
height: 100%;
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
background-position: 50%;
-webkit-background-size: 100%;
background-size: 100%;
background-repeat: no-repeat;
}
.swiper-lazy-preloader-white:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
@-webkit-keyframes swiper-preloader-spin {
100% {
-webkit-transform: rotate(360deg);
}
}
@keyframes swiper-preloader-spin {
100% {
transform: rotate(360deg);
}
}
.swiper-pagination-bullet-active {
background: #fff !important;
opacity: 0.7;
}
.swiper-button-prev,
.swiper-button-next {
opacity: 0.7;
}
.sp-only {
display: none;
}
@media screen and (max-width: 590px) {
.sp-only {
display: block;
}
}
.cantainer,
.inner {
margin-right: auto;
margin-left: auto;
width: 1140px;
}
@media screen and (max-width: 960px) {
.cantainer,
.inner {
width: 100%;
}
}
p {
text-align: justify;
}
.form_lead_caution {
font-size: 24px;
line-height: 34px;
text-align: center;
font-weight: 600;
margin-top: 40px;
color: #ff4c40;
}
@media screen and (max-width: 960px) {
.form_lead_caution {
font-size: 17px;
line-height: 1.5;
margin-top: 30px;
}
}
.form_lead_caution.no-margin-top {
margin-top: 0;
}
@media screen and (max-width: 960px) {
.form_lead_caution.no-margin-top {
margin-top: 0;
}
}
.for-members {
padding-top: 80px;
line-height: 0;
}
.for-members .headline_4 {
text-align: center;
line-height: 1.5;
}
.for-members__img {
margin-top: 40px;
text-align: center;
}
.for-members__img img {
width: 75%;
height: auto;
display: block;
margin: 0px auto;
}
@media screen and (max-width: 590px) {
.for-members {
padding: 40px 0;
}
.for-members__img img {
width: 100%;
}
}
.news {
padding: 80px;
}
.news .container {
padding: 0;
}
.news .headline_4 {
text-align: center;
}
.news__item ul {
margin-top: 20px;
}
.news__item ul li {
padding-top: 5px;
border-top: 1px solid;
}
.news__item ul li a {
display: block;
width: 100%;
height: 100%;
padding: 15px 20px;
background-color: #fff;
}
.news__item ul li:last-child {
border-bottom: 1px solid;
}
.news__date {
padding-right: 40px;
font-size: 16px;
text-align: right;
}
.news__text {
display: flex;
font-weight: bold;
font-size: 16px;
}
.news__button {
display: flex;
justify-content: flex-end;
margin-top: 20px;
padding: 0;
}
.news__button .button-triangle {
width: 100%;
height: 60px;
}
@media screen and (max-width: 960px) {
.news {
padding: 40px 20px;
}
.news__date {
padding-right: 0;
text-align: left;
font-size: 14px;
}
.news__button {
margin-top: 40px;
justify-content: center;
}
}
@media screen and (max-width: 590px) {
.news__item ul li a {
position: relative;
}
.news__text {
font-weight: normal;
}
}
#top .news li {
border-color: #85c5e6;
}
#denki-top .news li {
border-color: #fe5c52;
}
#gas-top .news li {
border-color: #00d099;
}
#water-top .news li {
border-color: #11a9Da;
}
#hikari-top .news li {
border-color: #ff8b40;
}
#wifi-top .news li {
border-color: #c86f98;
}
.column {
padding: 80px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}
.column .headline_4 {
text-align: center;
}
.column__item {
margin-top: 20px;
}
.column__item span,
.column__item a {
display: block;
}
.column__item__wrapper {
position: relative;
margin-top: 30px;
box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
}
.column__category {
position: absolute;
top: 0;
right: 0;
width: 120px;
height: 24px;
line-height: 24px;
color: #fff;
text-align: center;
font-size: 11px;
font-weight: bold;
}
.column__category_denki_line {
background-color: #fe5c52;
}
.column__category_internet {
background-color: #c86f98;
}
.column__category_water_server {
background-color: #11a9Da;
}
.column__category_gas {
background-color: #00d099;
}
.column__category_estate {
background-color: #1adae0;
}
.column__category_home_moving {
background-color: #1adae0;
}
.column__img {
width: 100%;
height: 120px;
overflow: hidden;
transition-duration: 0.3s;
}
.column__img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.column__content {
padding: 10px;
background-color: #fff;
}
.column__date {
font-size: 12px;
opacity: 0.8;
}
.column__text {
margin-top: 10px;
height: 130px;
line-height: 1.6em;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
}
.column__button {
display: flex;
justify-content: flex-end;
margin-top: 20px;
padding: 0;
}
.column__button .button-triangle {
width: 100%;
}
.column__button .button-triangle:hover {
color: #fff;
background: none !important;
background-color: transparent !important;
border: 1px solid #fff !important;
}
.column a:hover {
opacity: 1 !important;
}
.column a:hover .column__content {
background-color: #eee;
opacity: 1 !important;
}
.column a:hover .column__img img {
transform: scale(1.1);
transition-duration: 0.3s;
}
@media screen and (max-width: 960px) {
.column {
padding: 80px 0;
}
.column__category {
max-width: 100%;
font-size: 10px;
}
.column__button .button-triangle span {
font-size: 14px;
}
.column__button .button-triangle::after {
right: 10px;
}
}
@media screen and (max-width: 590px) {
.column {
margin-top: 40px;
padding: 40px 0;
background-position: left top;
}
.column .headline_3 {
color: #fff;
}
.column .headline_3::after {
background-color: #fff;
}
.column__item {
margin-top: 10px;
}
.column__content {
padding: 10px;
background-color: #fff;
}
.column__date {
font-size: 12px;
opacity: 0.8;
}
.column__text {
height: 55px;
-webkit-line-clamp: 2;
}
.column__button {
margin: 20px 0 0 0;
}
.column__button__wrapper .button {
border: 1px solid #fff;
}
}
#top .column {
background-color: #efefef;
}
#denki-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_denki.jpg);
}
#gas-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_gas.jpg);
}
#hikari-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_hikari.jpg);
}
#water-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_water.jpg);
}
#wifi-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_wi-fi.jpg);
}
.page-top {
position: fixed;
right: 40px;
bottom: 120px;
border-radius: 100%;
}
.page-top a {
display: block;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
width: 70px;
height: 70px;
color: #fff;
background-color: #85c5e6;
border-radius: 100%;
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
opacity: 0.9;
}
.page-top a::before {
font-family: "Font Awesome 5 Free";
content: "\f30c";
font-weight: 900;
font-size: 30px;
}
@media screen and (max-width: 590px) {
.page-top {
right: 20px;
bottom: 100px;
}
.page-top a {
width: 50px;
height: 50px;
}
}
.top__kv,
.top__kv__sp-only {
z-index: 1;
}
.top__nav {
z-index: 2;
}
.marutto-seriese .headline_4 {
margin-top: 20px;
text-align: center;
}
.marutto-seriese__item a::after {
z-index: 1;
}
.marutto-seriese__item_logo {
z-index: 2;
}
.page-top {
z-index: 98;
}
.low_top_sec_05__item a::after {
z-index: 1;
}
.low_top_sec_05__item a span,
.low_top_sec_05__item a img {
z-index: 2;
}
.announcement {
margin-top: 40px;
}
@media screen and (max-width: 590px) {
.announcement {
margin: 40px 8px 0;
}
}
.announcement .announcement-box {
border: solid 3px #000;
max-width: 1000px;
width: calc(100% - 30px);
margin: 0px auto;
padding: 20px;
border-radius: 20px;
margin-top: 30px;
font-size: 16px;
font-weight: 700;
}
@media screen and (max-width: 590px) {
.announcement .announcement-box {
background-color: #fff;
}
}
.announcement .announcement-box.line {
border: solid 1px #000;
}
.announcement .announcement-box.red {
color: red;
}
.announcement .announcement-box h1,
.announcement .announcement-box h4 {
font-size: 20px;
text-align: center;
margin-bottom: 20px;
}
@media screen and (max-width: 590px) {
.announcement .announcement-box h1,
.announcement .announcement-box h4 {
font-size: 18px;
margin: 16px 0;
line-height: 1.5;
}
}
@media screen and (max-width: 590px) {
.announcement .announcement-box {
font-size: 14px;
width: 100%;
padding: 10px;
margin-top: 0;
}
}
#wifi-top .announcement {
padding-bottom: 0;
}
#wifi-top .announcement-box {
max-width: 1142px;
}
@media screen and (max-width: 590px) {
.announcement-newyear {
background-color: #fff;
}
}
.announcement-newyear .announcement-newyear-box {
max-width: 1000px;
width: calc(100% - 30px);
margin: 0px auto;
padding: 20px;
border-radius: 20px;
margin-top: 30px;
font-weight: 700;
}
.announcement-newyear .announcement-newyear-box.line {
border: solid 1px #000;
}
.announcement-newyear .announcement-newyear-box.red {
color: red;
}
.announcement-newyear .announcement-newyear-box h4 {
font-size: 20px;
text-align: center;
margin-bottom: 20px;
}
@media screen and (max-width: 590px) {
.announcement-newyear .announcement-newyear-box h4 {
font-size: 18px;
}
}
@media screen and (max-width: 590px) {
.announcement-newyear .announcement-newyear-box {
font-size: 14px;
width: 100%;
padding: 10px;
margin-top: 0;
}
}
.announcement-newyear .announcement-newyear-box ul {
margin-top: 20px;
font-size: 14px;
}
@media screen and (max-width: 590px) {
.announcement-newyear .announcement-newyear-box ul {
font-size: 11px;
margin-top: 15px;
}
} .puroduct__lp__footer {
display: flex;
flex-wrap: wrap;
align-items: center;
padding: 40px 30px;
background-color: #585858;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer {
flex-direction: column;
padding: 20px 0;
height: auto;
}
}
.puroduct__lp__footer * {
color: #fff;
}
.puroduct__lp__footer_l {
display: flex;
margin: 0;
width: 20%;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_l {
width: 90%;
}
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_l li {
width: 50%;
text-align: center;
}
}
.puroduct__lp__footer_l a {
font-size: 12px;
}
.puroduct__lp__footer_l a:hover {
color: #fff;
opacity: 0.6;
}
.puroduct__lp__footer_l .company {
margin-right: 4em;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_l .company {
margin-right: 0;
}
}
.puroduct__lp__footer_r {
display: flex;
margin: 0;
margin-left: auto;
font-size: 12px;
width: 42%;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_r {
margin-top: 2em;
width: 90%;
margin-left: 0;
flex-direction: column;
font-size: 10px;
}
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_r li {
width: 100%;
text-align: center;
}
}
.puroduct__lp__footer_r .copy {
margin-left: 6em;
font-size: 14px;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer_r .copy {
margin-top: 1em;
margin-left: 0;
font-size: 10px;
}
}
.puroduct__lp__footer .tsc-info {
margin: 0 60px 0 auto;
}
@media screen and (max-width: 960px) {
.puroduct__lp__footer .tsc-info {
margin: 20px;
}
}
.top {
font-size: 16px;
}
.top__header {
position: relative;
width: 100%;
height: 95vh;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.top__kv .main-slide {
overflow: hidden;
}
.top__kv .main-slide img {
width: 100%;
height: 90%;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
opacity: 0;
animation: slide-animation 24s linear infinite 0s;
}
.top__kv .main-slide img:nth-of-type(2) {
animation-delay: 8s;
}
.top__kv .main-slide img:nth-of-type(3) {
animation-delay: 16s;
}
.top__kv__sp-only {
display: none;
}
@keyframes slide-animation {
0% {
animation-timing-function: ease-in;
opacity: 0;
}
5% {
animation-timing-function: ease-out;
opacity: 1;
}
30% {
opacity: 1; -webkit-transform: scale(1.02);
}
43% {
opacity: 0; }
100% {
opacity: 0; }
}
@media screen and (max-width: 960px) {
.top__kv {
display: none;
}
.top__kv__sp-only {
display: block;
}
.top__kv__sp-only img {
width: calc(100% + 20px);
height: 100%;
object-fit: cover;
object-position: -20px 0px;
position: absolute;
top: 0;
left: 0;
opacity: 0;
animation: slide-animation 24s linear infinite 0s;
}
.top__kv__sp-only img:nth-of-type(2) {
animation-delay: 8s;
}
.top__kv__sp-only img:nth-of-type(3) {
animation-delay: 16s;
}
}
.top__nav {
width: 100%;
}
.top__nav__links {
margin: 0 auto;
width: 1280px;
display: flex;
justify-content: space-between;
column-gap: 15px;
}
@media screen and (max-width: 960px) {
.top__nav__links {
width: 100%;
}
}
@media screen and (max-width: 1280px) {
.top__nav__links {
width: 100%;
}
}
.top__nav__links li {
max-width: 170px;
flex: 1;
}
.top__nav__links li a {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
padding-top: 22%;
width: 100%;
height: auto;
aspect-ratio: 1/1;
border-radius: 100%;
background-color: #fff;
}
.top__nav__links li a.water-sakutto {
justify-content: center;
padding-top: 0;
}
.top__nav__links li a > div {
width: 100%;
}
.top__nav__icon {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
}
.top__nav__icon img {
width: 52.94%;
max-width: 90px;
height: auto;
}
.top__nav__icon.water-sakutto img {
width: 72%;
max-width: 130px;
height: auto;
}
@media screen and (max-width: 960px) {
.top__nav__icon.water-sakutto img {
width: 56%;
}
}
.top__nav__logo {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
}
.top__nav__logo img {
width: 76.47%;
max-width: 130px;
height: auto;
}
.top__nav__logo.iot img {
max-width: 90px;
}
.top__nav.lower {
margin-top: 40px;
padding: 0 60px;
}
.top__nav.lower a {
background-color: #eee;
justify-content: center;
padding-top: 0;
}
.top__nav.lower a.water-sakutto {
justify-content: flex-start;
padding-top: 10%;
}
.top__nav.lower a .top__nav__icon.water-sakutto img {
max-width: 120px;
}
@media screen and (max-width: 960px) {
.top__nav {
margin-bottom: 40px;
}
.top__nav__links {
flex-wrap: wrap;
justify-content: center;
}
.top__nav__links li {
display: flex;
justify-content: center;
align-items: center;
width: 33.33%;
max-width: auto;
}
.top__nav__links li:nth-child(n+4) {
margin-top: 20px;
}
.top__nav__links li a {
justify-content: center;
padding-top: 0;
width: 140px;
height: 140px;
box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
}
.top__nav__icon img {
width: 70px;
}
.top__nav__logo img {
width: 100px;
}
.top__nav.lower {
padding: 0 20px;
}
.top__nav.lower li:nth-child(n+4) {
margin-top: 20px;
}
.top__nav.lower a {
box-shadow: none;
}
.top__nav.lower a .top__nav__icon.water-sakutto img {
width: 67%;
}
}
@media screen and (max-width: 590px) {
.top__nav {
margin-bottom: 20px;
}
.top__nav__links {
flex-wrap: wrap;
justify-content: space-between;
}
.top__nav__links li {
display: flex;
justify-content: center;
align-items: center;
margin-top: 10px;
max-width: 33.33%;
}
.top__nav__links li a {
width: 90px;
height: 90px;
}
.top__nav__icon img {
width: 40%;
}
.top__nav__logo img {
width: 70%;
height: auto;
}
.top__nav__logo.iot img {
width: 70%;
}
.top__nav.lower {
margin-top: 0;
padding: 0;
}
.top__nav.lower .top__nav__icon.water-sakutto img {
width: 65%;
}
}
.top__upper__buttons {
margin: 80px auto 0 auto;
width: 890px;
}
.top__upper__buttons ul {
margin: 0;
}
.top__upper__buttons li {
padding: 0;
}
.top__upper__buttons li a {
display: block;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 80px;
font-size: 20px;
font-weight: bold;
}
.top__upper__buttons li a span {
line-height: 1;
}
.top__upper__buttons li:first-child {
padding-right: 2%;
}
.top__upper__buttons li:first-child a {
width: 100%;
height: 80px;
font-size: 20px;
}
.top__upper__buttons li:last-child {
padding-left: 2%;
}
@media screen and (max-width: 960px) {
.top__upper__buttons {
margin-top: 40px;
padding: 0 20px;
width: 100%;
}
}
@media screen and (max-width: 590px) {
.top__upper__buttons {
margin-top: 0;
}
.top__upper__buttons li {
margin-top: 20px;
padding: 0 !important;
}
}
.top__upper__buttons.lower {
margin-top: 250px;
padding: 0;
}
.top .service-info {
padding: 80px 0;
}
.top .service-info .headline_4 {
text-align: center;
}
.top .service-info__img {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .service-info__img img {
width: 800px;
height: auto;
}
.top .service-info__img2 {
margin-top: 40px;
}
.top .service-info__text {
margin-top: 40px;
font-size: 22px;
font-weight: bold;
text-align: center;
}
.top .service-info__benefits {
position: relative;
overflow: hidden;
margin-top: 40px;  }
.top .service-info__benefits__img_01 img {
width: 100%;
height: auto;
}
.top .service-info__benefits__img_02 img {
margin-top: -20%;
margin-left: 60%;
width: 50%;
height: auto;
}
.top .service-info__benefits__img_03 {
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
}
.top .service-info__benefits__img_03 img {
width: 40%;
height: auto;
}
.top .service-info__benefits__content {
position: absolute;
bottom: 0;
left: 0;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
.top .service-info__benefits__content > div {
width: 100%;
}
.top .service-info__benefits__balloon {
position: relative;
display: flex;
justify-content: center;
}
.top .service-info__benefits__balloon span {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 140px;
height: 140px;
color: #fff;
font-size: 17px;
font-weight: bold;
text-align: center;
background-color: #fc6a67;
border-radius: 100%;
}
.top .service-info__benefits__balloon span::after {
position: absolute;
top: 120px;
left: 10px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 20px solid #fc6a67;
transform: rotate(40deg);
-webkit-transform: rotate(40deg);
content: "";
}
.top .service-info__benefits__logo {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .service-info__benefits__logo img {
width: 400px;
height: auto;
}
.top .service-info__benefits__text {
margin-top: 20px;
text-align: center;
font-size: 26px;
line-height: 2em;
}
.top .service-info__benefits__text .sp-only {
display: none;
}
.top .service-info__benefits_house-type .container {
padding: 0;
}
.top .service-info__benefits_house-type_img {
width: 100%;
}
.top .service-info__benefits_house-type_img img {
width: 94%;
display: block;
margin: auto;
height: auto;
}
.top .service-info__benefits_house-type_img img.sp-only {
display: none;
}
@media screen and (max-width: 590px) {
.top .service-info__benefits_house-type_img img {
width: 100%;
}
.top .service-info__benefits_house-type_img img.sp-only {
display: block;
}
.top .service-info__benefits_house-type_img img.pc-only {
display: none;
}
}
.top .service-info__benefits_house-type_note {
font-size: 14px;
line-height: 25px;
margin: 50px 0 0;
}
.top .service-info__benefits_house-type_note span {
color: #F76964;
}
@media screen and (max-width: 590px) {
.top .service-info__benefits_house-type_note {
font-size: 12px;
line-height: 20px;
padding: 20px 10px;
margin: 20px 0 0;
}
}
.top .service-info__benefits_house-type .swiper-container-horizontal > .swiper-pagination-bullets {
bottom: 71px;
margin: 0 0 48px 0;
}
.top .service-info__benefits_house-type .swiper-button-next.swiper-button-white, .top .service-info__benefits_house-type .swiper-button-prev.swiper-button-white {
--swiper-navigation-color: #3d3d3d;
}
.top .service-info__benefits_house-type .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet-active {
border: solid 1px #8f8f8f;
}
.top .service-info__benefits_house-type .swiper-button-prev.swiper-button-white {
left: 0;
top: 47%;
}
.top .service-info__benefits_house-type .swiper-button-next.swiper-button-white {
right: 0;
top: 47%;
}
@media screen and (max-width: 590px) {
.top .service-info__benefits_house-type .swiper-button-next.swiper-button-white, .top .service-info__benefits_house-type .swiper-button-prev.swiper-button-white {
display: none;
}
.top .service-info__benefits_house-type .swiper-container-horizontal > .swiper-pagination-bullets {
bottom: 150px;
margin: 0;
}
}
@media screen and (max-width: 960px) {
.top .service-info__img2 img {
width: 100%;
height: auto;
}
.top .service-info__benefits__img_03 {
top: 30%;
}
.top .service-info__benefits__img_03 img {
width: 50%;
height: auto;
}
.top .service-info__benefits__content {
position: static;
margin-top: -150px;
}
.top .service-info__benefits__text {
font-size: 22px;
}
}
@media screen and (max-width: 590px) {
.top .service-info {
padding: 40px 0;
}
.top .service-info .headline_4 {
text-align: center;
}
.top .service-info__img {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .service-info__img img {
width: 100%;
height: auto;
}
.top .service-info__img2 {
margin-top: 40px;
}
.top .service-info__img2 img {
width: 100%;
height: auto;
}
.top .service-info__text {
margin-top: 40px;
font-size: 18px;
font-weight: bold;
text-align: center;
}
.top .service-info__benefits {
position: relative;
overflow: hidden;
}
.top .service-info__benefits__img_01 {
overflow: hidden;
width: 100%;
height: 400px;
}
.top .service-info__benefits__img_01 img {
margin-top: -10%;
margin-left: -40%;
width: 300%;
height: auto;
}
.top .service-info__benefits__img_02 {
display: flex;
justify-content: center;
align-items: center;
}
.top .service-info__benefits__img_02 img {
margin-top: -10%;
margin-left: 0;
width: 60%;
height: auto;
}
.top .service-info__benefits__img_03 {
position: static;
transform: translateY(0);
margin-top: -30px;
}
.top .service-info__benefits__img_03 img {
width: 70%;
height: auto;
}
.top .service-info__benefits__content {
position: static;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
margin-top: 0;
padding: 0 20px;
}
.top .service-info__benefits__balloon span {
width: 100px;
height: 100px;
font-size: 14px;
}
.top .service-info__benefits__balloon span::after {
top: 80px;
}
.top .service-info__benefits__logo {
margin-top: 20px;
}
.top .service-info__benefits__logo img {
width: 80%;
height: auto;
}
.top .service-info__benefits__text {
font-size: 14px;
line-height: 1.5em;
}
.top .service-info__benefits__text .sp-only {
display: block;
width: 0;
height: 0;
}
}
.top .marutto-seriese {
padding: 80px 0;
background-color: #efefef;
}
.top .marutto-seriese__logo {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .marutto-seriese__logo img {
width: 400px;
height: auto;
}
.top .marutto-seriese__item {
padding: 40px 0;
}
.top .marutto-seriese__item a {
position: relative;
display: block;
width: 100%;
height: 100%;
border-radius: 5px;
border: 1px solid #cccccc;
overflow: hidden;
}
.top .marutto-seriese__item a::after {
position: absolute;
content: "";
display: block;
width: 100%;
height: 100%;
top: 0;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.top .marutto-seriese__item a:hover::after {
-moz-transform: scale(1.05);
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
.top .marutto-seriese__item_logo {
position: absolute;
left: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
width: 200px;
height: 60px;
background-color: #fff;
}
.top .marutto-seriese__item_logo img {
width: 80%;
height: auto;
}
.top .marutto-seriese__item_denki a, .top .marutto-seriese__item_gas a {
height: 300px;
}
.top .marutto-seriese__item_hikari a, .top .marutto-seriese__item_water a, .top .marutto-seriese__item_wifi a {
margin-top: 40px;
height: 320px;
}
.top .marutto-seriese__item_iot a, .top .marutto-seriese__item_water-sakutto a, .top .marutto-seriese__item_teigaku a {
margin-top: 40px;
height: 160px;
}
.top .marutto-seriese__item_denki a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/denki_bg.jpg);
}
.top .marutto-seriese__item_water a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/water_bg.jpg);
}
.top .marutto-seriese__item_hikari a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/hikari_bg.jpg);
}
.top .marutto-seriese__item_gas a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/gas_bg.jpg);
}
.top .marutto-seriese__item_water-sakutto a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/water-sakutto_bg.webp);
}
.top .marutto-seriese__item_wifi a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/wifi_bg.jpg);
}
.top .marutto-seriese__item_iot .marutto-seriese__item_logo {
width: 240px;
}
.top .marutto-seriese__item_iot .marutto-seriese__item_logo img {
width: 90%;
}
.top .marutto-seriese__item_iot a::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/iot_bg.jpg);
background-position: center top 30%;
}
.top .marutto-seriese__item_teigaku a {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
padding-top: 20px;
text-align: center;
background-color: #212121;
}
.top .marutto-seriese__item_teigaku a > span {
width: 100%;
}
.top .marutto-seriese__item_teigaku_logo img {
width: 70%;
height: auto;
}
.top .marutto-seriese__item_teigaku_text {
margin-top: 10px;
color: #fff;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
}
.top .marutto-seriese__item_teigaku_text::after {
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f0da";
font-weight: 900;
}
@media screen and (max-width: 960px) {
.top .marutto-seriese {
padding: 40px 0;
}
.top .marutto-seriese__logo {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .marutto-seriese__logo img {
width: 400px;
height: auto;
}
.top .marutto-seriese__item {
padding: 40px 0;
}
.top .marutto-seriese__item_logo {
width: 100%;
height: 50px;
}
.top .marutto-seriese__item_logo img {
width: 90%;
height: auto;
}
.top .marutto-seriese__item_denki a, .top .marutto-seriese__item_water a {
height: 160px;
}
.top .marutto-seriese__item_hikari a, .top .marutto-seriese__item_gas a, .top .marutto-seriese__item_wifi a {
height: 160px;
}
.top .marutto-seriese__item_iot a, .top .marutto-seriese__item_water-sakutto a, .top .marutto-seriese__item_teigaku a {
height: 160px;
}
.top .marutto-seriese__item_iot .marutto-seriese__item_logo {
width: 100%;
}
.top .marutto-seriese__item_teigaku a {
padding-top: 20px;
}
.top .marutto-seriese__item_teigaku_logo img {
width: 90%;
}
}
@media screen and (max-width: 590px) {
.top .marutto-seriese {
padding: 40px 0;
background-color: #efefef;
}
.top .marutto-seriese__logo img {
width: 100%;
max-width: 400px;
}
.top .marutto-seriese__item {
padding: 0;
}
.top .marutto-seriese__item li {
margin-top: 20px;
}
.top .marutto-seriese__item_logo {
position: absolute;
left: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
width: 200px;
height: 60px;
background-color: #fff;
}
.top .marutto-seriese__item_logo img {
width: 80%;
height: auto;
}
.top .marutto-seriese__item_denki a, .top .marutto-seriese__item_water a {
height: 150px;
margin-top: 0px;
}
.top .marutto-seriese__item_hikari a, .top .marutto-seriese__item_gas a, .top .marutto-seriese__item_wifi a {
margin-top: 0;
height: 150px;
}
.top .marutto-seriese__item_iot a, .top .marutto-seriese__item_water-sakutto a, .top .marutto-seriese__item_teigaku a {
margin-top: 0;
height: 150px;
}
.top .marutto-seriese__item_iot .marutto-seriese__item_logo {
width: 200px;
}
.top .marutto-seriese__item_teigaku a {
padding-top: 10px;
height: 100px;
}
}
.top .living-with-marutto {
padding: 80px 0;
}
.top .living-with-marutto .headline_5 {
padding: 20px 0;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/top/living-with-marutto_bg.svg);
background-position: 10% bottom;
background-size: auto 100%;
}
.top .living-with-marutto__slider {
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
padding: 0 !important;
position: relative;
}
.top .living-with-marutto__slider:before {
content: "";
background: transparent;
display: block;
padding-bottom: 48%;
}
@media screen and (max-width: 768px) {
.top .living-with-marutto__slider:before {
padding-bottom: 89%;
}
}
@media screen and (max-width: 590) {
.top .living-with-marutto__slider:before {
padding-bottom: 82%;
}
}
.top .living-with-marutto__slider #thumb.slider-pro {
display: block;
position: absolute;
max-width: 100% !important;
padding-right: 300px;
}
@media screen and (max-width: 991px) {
.top .living-with-marutto__slider #thumb.slider-pro {
padding-right: 200px;
}
}
@media screen and (max-width: 768px) {
.top .living-with-marutto__slider #thumb.slider-pro {
padding-right: 0px;
}
}
.top .living-with-marutto__slider #thumb.slider-pro .sp-thumbnails-container {
height: 100% !important;
}
@media screen and (max-width: 768px) {
.top .living-with-marutto__slider #thumb.slider-pro .sp-thumbnails-container {
height: auto !important;
}
}
.top .living-with-marutto__slider #thumb.slider-pro .sp-thumbnails-container .sp-thumbnails {
height: 200px !important;
}
.top .living-with-marutto__slider #thumb.slider-pro .sp-thumbnails-container .sp-thumbnails .sp-thumbnail {
display: block;
}
.top .living-with-marutto__message {
text-align: center;
}
.top .living-with-marutto__message__logo {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .living-with-marutto__message__logo img {
width: 400px;
height: auto;
}
.top .living-with-marutto__message__text {
margin-top: 40px;
font-size: 17px;
text-align: center;
line-height: 2em;
}
.top .living-with-marutto__message__text .tab-only {
display: none;
}
.top .living-with-marutto__message__button {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
}
.top .living-with-marutto__message__button .button-triangle {
position: relative;
width: 280px;
height: 50px;
font-size: 18px;
}
.top .living-with-marutto__message__button .button-triangle::after {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
font-family: "Font Awesome 5 Free";
content: "\f0d8";
font-weight: 900;
}
@media screen and (max-width: 960px) {
.top .living-with-marutto {
padding: 40px 0;
}
.top .living-with-marutto__message__text .tab-only {
display: block;
width: 0;
height: 0;
}
}
@media screen and (max-width: 590px) {
.top .living-with-marutto {
padding: 40px 0;
}
.top .living-with-marutto .headline_5 {
padding: 0;
background-position: 0 bottom;
}
.top .living-with-marutto__message__logo {
display: flex;
justify-content: center;
align-items: flex-start;
margin-top: 40px;
}
.top .living-with-marutto__message__logo img {
width: 100%;
}
.top .living-with-marutto__message__text {
font-size: 14px;
text-align: left;
line-height: 1.5em;
}
.top .living-with-marutto__message__text br {
display: none;
}
.top .living-with-marutto__message__button .button-blue {
width: 100%;
}
}
.anim-circle__wrapper {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
height: 500px;
}
.anim-circle, .ctrl-circle {
width: 650px;
height: 360px !important;
}
.layout-circle {
width: 650px !important;
height: auto !important;
}
.circle-bottom__wrapper img {
margin: 0;
width: 100%;
height: auto;
}
.circle-bottom__wrapper__sp-only {
display: none;
}
@media screen and (max-width: 960px) {
.anim-circle__wrapper {
height: 450px;
}
.anim-circle, .ctrl-circle {
width: 560px !important;
height: 310px !important;
margin: 0 auto !important;
}
.layout-circle {
width: 560px !important;
height: auto !important;
}
}
@media screen and (max-width: 590px) {
.anim-circle__wrapper {
height: 300px;
}
.anim-circle, .ctrl-circle {
width: 280px !important;
height: 115px !important;
margin: 0 auto !important;
}
.layout-circle {
width: 280px !important;
height: auto !important;
}
.circle-bottom__wrapper {
display: none;
}
.circle-bottom__wrapper__sp-only {
display: block;
margin-top: 50px;
}
.circle-bottom__wrapper__sp-only img {
margin: 0;
width: 100%;
height: auto;
}
} .low {
font-size: 16px;
margin-top: 60px;
}
@media screen and (max-width: 960px) {
.low {
margin-top: 0;
}
}
.low .row {
padding: 0;
}
.low .row:first-child .lower__sec-header {
padding-top: 40px;
}
@media screen and (max-width: 960px) {
.low .row:first-child .lower__sec-header {
padding-top: 100px;
}
}
@media screen and (max-width: 767.98px) {
.low .row:first-child .lower__sec-header {
padding-top: 40px;
}
}
@media screen and (max-width: 575.98px) {
.low .row:first-child .lower__sec-header {
padding-top: 24px;
}
}
.low section {
padding-top: 40px;
padding-bottom: 40px;
}
@media screen and (max-width: 590px) {
.low section {
padding-top: 30px;
padding-bottom: 30px;
}
}
.low__nav {
background-color: rgba(24, 30, 33, 0.8);
}
.low__nav_inner {
display: flex;
align-items: center;
margin: 0 auto;
max-width: 1280px;
height: 60px;
}
.low__nav_logo img {
width: 180px;
height: auto;
}
.low__nav_item {
display: flex;
justify-content: space-between;
margin: 0;
}
.low__nav_item li a {
color: #fff;
font-weight: bold;
font-size: 1.4rem;
}
.low__kv {
width: 100%;
height: auto;
margin-top: 60px;
max-height: 70vh;
}
@media screen and (max-width: 1040px) {
.low__kv {
max-height: 70vh;
}
}
@media screen and (max-width: 769px) {
.low__kv {
margin-top: 0px;
}
}
.low__kv .swiper-container {
display: block;
width: 100%;
height: 100%;
max-height: 50vh;
line-height: 0;
}
@media screen and (max-width: 1040px) {
.low__kv .swiper-container {
height: auto;
}
}
.low__kv .swiper-container .kv-ttl_pc {
position: absolute;
}
.low__kv .swiper-container .kv-ttl_pc img {
object-fit: contain;
max-width: 800px;
min-width: 500px;
}
.low__kv .swiper-container .kv-ttl_sp {
position: absolute;
top: 50%;
left: 50%;
width: 80vw;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.low__kv .swiper-container .kv-ttl_sp img {
object-fit: contain;
}
.low__kv img {
width: 100%;
height: auto;
object-fit: cover;
min-height: 210px;
}
@media screen and (max-width: 590px) {
.low__kv {
height: auto;
}
.low__kv img {
width: 100%;
height: auto;
object-fit: cover;
}
}
.low_top_sec_01__item {
margin-top: 40px;
}
.low_top_sec_01__item li {
padding: 0 20px;
}
.low_top_sec_01__item a {
display: block;
width: 100%;
height: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
padding: 20px 0;
border-radius: 4px;
box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1);
}
.low_top_sec_01__item_text {
margin-top: 20px;
width: 100%;
text-align: center;
font-weight: bold;
font-size: 18px;
}
.low_top_sec_02 {
padding: 0 40px;
}
.low_top_sec_02__inner {
padding: 80px 0;
background: linear-gradient(90deg, #fff0d8, #ffdcda);
}
@media screen and (max-width: 590px) {
.low_top_sec_02 {
padding: 0;
}
.low_top_sec_02__inner {
padding: 40px 20px;
}
}
.low .lower__sec-header {
padding: 20px 60px;
}
.low .lower__sec-header__nav {
display: flex;
align-items: center;
}
.low .lower__sec-header__nav span {
padding-top: 4px;
line-height: 1;
}
.low .lower__sec-header__nav:before {
margin-right: 10px;
font-family: "Font Awesome 5 Free";
content: "\f053";
font-weight: 900;
font-size: 24px;
}
.low .lower__sec-header .headline_2 {
margin-top: 10px;
font-weight: 200;
}
@media screen and (max-width: 590px) {
.low .lower__sec-header {
padding: 10px 40px;
}
.low .lower__sec-header .headline_2 {
font-weight: 300;
margin-top: 10px;
}
}
.low .lower__kv {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
padding-bottom: 40px;
}
.low .lower__kv__lead {
margin-left: 48%;
width: 650px;
padding: 80px 40px 40px 40px;
background-color: rgba(255, 255, 255, 0.7);
}
.low .lower__kv p {
margin-top: 40px;
line-height: 2em;
}
.low .lower__kv__emphasis {
margin-top: 20px;
padding: 20px;
font-weight: bold;
color: #fff;
text-align: center;
background-color: #ff4c40;
}
.low .lower__kv .kome {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
.low .lower__kv {
justify-content: center;
padding: 20px;
}
.low .lower__kv__lead {
margin-left: 0;
width: 100%;
padding: 20px;
}
.low .lower__kv__lead .headline_8 {
line-height: 1.5em;
}
.low .lower__kv p {
margin-top: 20px;
}
.low .lower__kv__emphasis {
margin-top: 20px;
padding: 20px;
font-weight: normal;
font-size: 16px;
text-align: left;
}
.low .lower__kv__emphasis br {
display: none;
}
.low .lower__kv .kome {
margin-top: 10px;
}
}
@media screen and (max-width: 590px) {
.low .lower__kv__lead {
padding: 10px;
}
.low .lower__kv__lead .headline_8 {
font-size: 18px;
line-height: 1.5em;
color: #551D00;
}
}
.low .lower__exp__wrapper {
padding: 20px;
border: 1px solid #000;
}
.low .lower__exp__title span {
margin-right: 20px;
font-weight: bold;
font-size: 18px;
}
.low .lower__exp__item {
display: flex;
margin-top: 10px;
}
.low .lower__exp__item ul {
margin-right: 10px;
display: flex;
}
@media screen and (max-width: 1200px) {
.low .lower__exp__item ul {
flex-wrap: wrap;
}
}
.low .lower__exp__item li::after {
margin: 0 5px;
content: "/";
}
.low .lower__exp__item li:last-child:after {
display: none;
}
.low .lower__exp .kome {
margin-top: 10px;
}
.low .lower__exp__kome {
margin-top: 10px;
padding-left: 5px;
}
@media screen and (max-width: 960px) {
.low .lower__exp {
padding: 20px;
}
.low .lower__exp__wrapper {
padding: 20px;
}
.low .lower__exp__title span {
display: block;
margin-bottom: 10px;
margin-right: 0;
line-height: 1.5em;
}
.low .lower__exp__item {
flex-wrap: wrap;
font-size: 14px;
}
.low .lower__exp__item ul {
margin-right: 0;
flex-wrap: wrap;
line-height: 1.5em;
}
.low .lower__exp__item li {
font-size: 14px;
}
.low .lower__exp .kome {
text-align: left;
}
.low .lower__exp__kome {
padding-left: 0;
text-align: left;
}
}
#denki-top .headline_2 {
color: #551d00;
}
#denki-top .headline_4 {
font-family: "Trebuchet MS", "Hind", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#denki-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: 0px -200px;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_top_back_01.jpg);
background-attachment: fixed;
position: relative;
}
#denki-top .low__kv__back .kv-ttl_pc {
position: absolute;
top: 45px;
left: 75px;
}
#denki-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 700px;
}
#denki-top .low__kv__back .kv-ttl_sp {
width: 80%;
top: 0px;
right: 10%;
object-fit: contain;
position: absolute;
bottom: -20px;
}
#denki-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#denki-top .low__kv__back {
height: 300px;
}
#denki-top .low__kv__back .kv-ttl_pc {
top: 0px;
left: 40px;
}
#denki-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#denki-top .low__kv {
position: relative;
height: 200px;
}
#denki-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#denki-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 310px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 10% 10%;
background-size: 220%;
}
}
#denki-top .low_top {  }
#denki-top .low_top_sec_01__item {
display: flex;
justify-content: center;
}
#denki-top .low_top_sec_01__item .sp {
display: none;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_01__item .sp {
display: block;
}
}
#denki-top .low_top_sec_01__item .pc {
display: block;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_01__item .pc {
display: none;
}
}
#denki-top .low_top_sec_01__item li {
padding: 0 15px;
width: 25%;
}
#denki-top .low_top_sec_01__item a:hover {
background-color: rgba(240, 145, 56, 0.5);
}
#denki-top .low_top_sec_01__item_icon img {
margin-top: 15px;
height: 100px;
vertical-align: middle;
border-style: none;
}
#denki-top .low_top_sec_01__item_text {
color: #551d00;
}
#denki-top .low_top_sec_01 .note {
margin: 20px 0;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_01__item {
flex-wrap: wrap;
}
#denki-top .low_top_sec_01__item li {
width: 50%;
}
#denki-top .low_top_sec_01__item li:nth-child(n+3) {
margin-top: 30px;
}
#denki-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#denki-top .low_top_sec_01__item_icon img {
width: auto;
height: 100%;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_01 {
background-color: #fff;
padding: 30px 0 !important;
}
#denki-top .low_top_sec_01__inner {
padding: 60px 0;
}
#denki-top .low_top_sec_01__item {
padding: 0 15px;
}
#denki-top .low_top_sec_01__item li {
margin-bottom: 0;
padding: 0 5px;
}
#denki-top .low_top_sec_01__item li:nth-child(n+3) {
margin-top: 10px;
}
#denki-top .low_top_sec_01__item li a {
padding: 15px 5px;
}
#denki-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
text-align: center;
}
#denki-top .low_top_sec_01__item_icon img {
height: 60px;
margin-top: 5px;
}
#denki-top .low_top_sec_01__item_text {
margin-top: 10px;
font-size: 16px;
}
}
#denki-top .low_top_sec_02 { }
#denki-top .low_top_sec_02__inner {
padding: 40px 15px;
background-color: #fff0d9 !important;
background: none;
}
#denki-top .low_top_sec_02__inner .container {
padding: 0;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__inner {
padding: 30px 15px;
}
}
#denki-top .low_top_sec_02__item {
margin-top: 50px;
background-color: #fff;
padding: 30px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__item {
padding: 20px 10px;
}
}
#denki-top .low_top_sec_02__item__title h2 {
font-size: 32px;
font-weight: 400;
line-height: 48px;
color: #FFB036;
text-align: center;
}
#denki-top .low_top_sec_02__item__title h3 {
font-size: 20px;
font-weight: 600;
line-height: 34px;
margin: 30px 0;
color: #333;
text-align: center;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__item__title h3 {
font-size: 16px;
font-weight: 600;
line-height: 28px;
margin: 10px 0;
}
}
#denki-top .low_top_sec_02__item.second .img2 {
margin-top: 65px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__item.second .img2 {
margin-top: 0;
}
}
#denki-top .low_top_sec_02__item.second h2 {
color: #FF4C40;
}
#denki-top .low_top_sec_02__img {
text-align: center;
}
#denki-top .low_top_sec_02__img img {
width: 80%;
height: auto;
}
#denki-top .low_top_sec_02__text {
width: 100%;
background-color: red;
}
#denki-top .low_top_sec_02__text p {
margin-top: 40px;
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__text p {
font-size: 16px;
line-height: 28px;
}
}
#denki-top .low_top_sec_02__button {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_02__item {
flex-wrap: wrap;
}
#denki-top .low_top_sec_02__img {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#denki-top .low_top_sec_02__img img {
width: 60%;
height: auto;
}
#denki-top .low_top_sec_02__text {
margin-top: 40px;
width: 100%;
}
#denki-top .low_top_sec_02__text p {
margin-top: 20px;
line-height: 2em;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02 {
padding: 0;
}
#denki-top .low_top_sec_02__item {
margin-top: 20px;
}
#denki-top .low_top_sec_02__img img {
width: 100%;
height: auto;
}
#denki-top .low_top_sec_02 .headline_2 {
margin-top: 0px;
}
#denki-top .low_top_sec_02__text {
margin-top: 20px;
}
#denki-top .low_top_sec_02__button {
margin-top: 20px;
}
}
#denki-top .low_top_sec_02__inner .tab-wrap_sp-only__title {
width: 100%;
padding-left: 0;
}
#denki-top .low_top_sec_02__inner .tab__content {
width: 100%;
}
#denki-top .low_top_sec_02__inner .tab-wrap_sp-only label:after {
content: none;
}
#denki-top .low_top_sec_02__inner .tab-wrap_sp-only .tab-wrap_sp-only__content {
width: 100%;
padding: 0;
}
#denki-top .low_top_sec_02__inner .tab-wrap_sp-only .tab-wrap_sp-only__content__inenr {
width: 100%;
}
#denki-top .low_top_sec_02__inner .tab-wrap_sp-only .tab-wrap_sp-only__content .tab__content_headline {
margin: 10px 0 0;
}
#denki-top .low_top_sec_02__inner .price_acc {
padding-top: 60px;
}
#denki-top .low_top_sec_02__inner .price_acc .tab + label.plan1 {
border-left: 20px solid #333;
}
#denki-top .low_top_sec_02__inner .price_acc .tab + label.plan2 {
border-right: 20px solid #333;
}
#denki-top .low_top_sec_02__inner .price_choice-btn_1,
#denki-top .low_top_sec_02__inner .price_choice-btn_2 {
display: none;
}
#denki-top .low_top_sec_02__inner #plan1:checked ~ .price_choice-btn_1,
#denki-top .low_top_sec_02__inner #plan2:checked ~ .price_choice-btn_2 {
display: block;
}
#denki-top .low_top_sec_02__inner .price_acc-box {
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 30px;
padding: 20px;
}
#denki-top .low_top_sec_02__inner .price_acc-box > input {
display: none;
}
#denki-top .low_top_sec_02__inner .price_acc-box > label {
text-align: center;
font-size: 20px;
position: relative;
font-weight: 500;
display: block !important;
margin: auto;
position: relative;
}
#denki-top .low_top_sec_02__inner .price_acc-box .price_acc_btn::after {
content: "";
position: absolute;
bottom: -2.15rem;
right: 0px;
top: 30%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid rgb(112, 112, 112);
border-right: 2px solid rgb(112, 112, 112);
transition: all 0.3s ease 0s;
}
#denki-top .low_top_sec_02__inner .price_acc-box > .price_acc_content {
overflow: hidden;
transition: max-height 0.3s;
max-height: 0px;
}
#denki-top .low_top_sec_02__inner .price_acc-box > input:checked ~ .price_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#denki-top .low_top_sec_02__inner .tab:checked + label::after {
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #333;
content: "";
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_02__inner .tab:checked + label::after {
content: none;
}
}
#denki-top .low_top_sec_02__inner .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#denki-top .low_top_sec_02__inner .price_acc-box > input[type=checkbox]:checked ~ label::after {
transform: translateX(-50%) rotate(315deg);
-webkit-transform: translateX(-50%) rotate(315deg);
transition: all 0.3s;
}
#denki-top .low_top_sec_02__inner .price_acc-box > label::after {
content: "";
position: absolute;
bottom: 50%;
right: 0;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
-webkit-transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_02__inner .price_acc-box {
margin: 10px 0;
padding: 10px 0px 10px;
}
#denki-top .low_top_sec_02__inner .price_acc {
padding-top: 20px;
}
#denki-top .low_top_sec_02__inner .price_acc > .container {
margin: 0px;
width: auto;
}
#denki-top .low_top_sec_02__inner .price_acc-box::before {
font-size: 20px;
left: -25;
top: 16;
}
#denki-top .low_top_sec_02__inner .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
margin-top: 10px;
}
#denki-top .low_top_sec_02__inner .price_acc-box > .price_acc_content::before {
left: -25;
top: 16;
}
#denki-top .low_top_sec_02__inner .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
padding-bottom: 20px;
}
#denki-top .low_top_sec_02__inner .price_acc-box > label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 10px 0 10px 0;
}
#denki-top .low_top_sec_02__inner .price_acc-box > label::before {
font-size: 24px;
left: 0px;
top: 0;
}
#denki-top .low_top_sec_02__inner .price_acc-box > label::after {
width: 0.7rem;
height: 0.7rem;
right: 20px;
}
#denki-top .low_top_sec_02__inner .price_acc-box > .price_acc_content {
font-size: 14px;
padding: 0;
}
#denki-top .low_top_sec_02__inner .price_choice-btn_1,
#denki-top .low_top_sec_02__inner .price_choice-btn_2 {
display: none;
}
}
#denki-top .low_top_sec_03__inner {
margin-top: 40px;
padding: 80px 0 160px 0;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
position: relative;
}
#denki-top .low_top_sec_03__inner:before {
content: "";
top: 0;
right: 0;
width: 60%;
height: 75%;
position: absolute;
margin-top: 40px;
padding: 60px 0 100px 0;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-color: #fffbe6;
background-size: 60% 90%;
background-position: left center;
z-index: 1;
}
#denki-top .low_top_sec_03__inner .container {
position: relative;
}
#denki-top .low_top_sec_03__inner .container:after {
content: "";
position: absolute;
top: -70px;
right: 0;
width: 55%;
height: 150%;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_02.jpg) no-repeat right center;
background-position: right top;
z-index: 2;
}
#denki-top .low_top_sec_03__box__inner {
width: 50%;
padding: 40px 20px;
background-color: #fff;
position: relative;
z-index: 3;
}
#denki-top .low_top_sec_03__text {
margin-top: 40px;
line-height: 2em;
}
#denki-top .low_top_sec_03__img {
display: none;
}
#denki-top .low_top_sec_03 .note {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_03__inner {
margin-top: 40px;
padding: 0;
background-image: none;
}
#denki-top .low_top_sec_03__inner:before {
content: none;
}
#denki-top .low_top_sec_03__inner .container:after {
content: none;
}
#denki-top .low_top_sec_03__box {
width: 100%;
}
#denki-top .low_top_sec_03__box__inner {
width: 100%;
padding: 0;
}
#denki-top .low_top_sec_03__text {
margin-top: 40px;
line-height: 2em;
}
#denki-top .low_top_sec_03__img {
display: none;
}
#denki-top .low_top_sec_03 .note {
margin-top: 20px;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_03 {
background-color: #fff;
padding: 30px 10px !important;
}
#denki-top .low_top_sec_03 .headline_2 {
margin-top: 20px;
}
#denki-top .low_top_sec_03__inner {
margin-top: 0;
padding: 0 20px;
height: auto;
background-image: none;
}
#denki-top .low_top_sec_03__box {
margin-top: 0;
padding: 20px;
}
#denki-top .low_top_sec_03__text {
margin-top: 20px;
}
#denki-top .low_top_sec_03__img {
display: block;
}
#denki-top .low_top_sec_03__img img {
width: 100%;
height: auto;
}
#denki-top .low_top_sec_03 .note {
margin-top: 20px;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_waribiki {
background: linear-gradient(90deg, #fff0d8, #ffdcda);
}
}
#denki-top .low_top_sec_03__block {
text-align: center;
margin-bottom: 70px;
}
#denki-top .low_top_sec_03__block li {
margin-top: 50px;
}
#denki-top .low_top_sec_03__block h1 {
display: block;
font-size: 18px;
}
#denki-top .low_top_sec_03__block h2 {
display: none;
}
#denki-top .low_top_sec_03__box {
margin: 20px 0 0 0;
}
#denki-top .low_top_sec_03__box-back {
background: transparent linear-gradient(134deg, rgba(255, 176, 54, 0.2) 0%, rgba(255, 76, 64, 0.2) 100%);
height: 240px;
width: 340px;
position: absolute;
margin-top: 50px;
z-index: 1;
bottom: -20px;
right: 0px;
}
#denki-top .low_top_sec_03__box-img {
z-index: 2;
position: relative;
}
#denki-top .low_top_sec_03__box-img img {
width: 100%;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_03 .container {
padding: 0;
}
#denki-top .low_top_sec_03__block {
margin-bottom: 10px;
margin-top: 30px;
}
#denki-top .low_top_sec_03__block li {
position: relative;
padding: 0;
margin-top: 5px;
}
#denki-top .low_top_sec_03__block h1 {
display: none;
}
#denki-top .low_top_sec_03__block h2 {
display: block;
text-align: left;
font-size: 14px;
padding: 25px 0 0 20px;
}
#denki-top .low_top_sec_03__box {
margin: 0;
padding: 0;
background-color: rgba(191, 191, 191, 0.2);
}
#denki-top .low_top_sec_03__box-back {
background: none;
height: auto;
width: 70%;
position: relative;
margin-top: 10px;
z-index: 1;
bottom: 0;
right: 0;
}
#denki-top .low_top_sec_03__box-img {
width: 30%;
}
}
#denki-top .low_top_sec_03 .tab-wrap_sp-only__title {
width: 100%;
padding-left: 0;
}
#denki-top .low_top_sec_03 .tab__content {
width: 100%;
}
#denki-top .low_top_sec_03 .tab-wrap_sp-only label:after {
content: none;
}
#denki-top .low_top_sec_03 .tab-wrap_sp-only .tab-wrap_sp-only__content {
width: 100%;
padding: 0;
}
#denki-top .low_top_sec_03 .tab-wrap_sp-only .tab-wrap_sp-only__content .tab__content_headline {
margin: 10px 0 0;
}
#denki-top .low_top_sec_03 .option_acc {
padding-top: 20px;
}
#denki-top .low_top_sec_03 .option_acc-box {
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 30px;
padding: 20px;
}
#denki-top .low_top_sec_03 .option_acc-box > input {
display: none;
}
#denki-top .low_top_sec_03 .option_acc-box > label {
position: relative;
margin: auto;
color: #333333;
text-align: center;
font-size: 18px;
font-weight: 500;
display: block !important;
}
#denki-top .low_top_sec_03 .option_acc-box > .option_acc_content {
overflow: hidden;
transition: max-height 0.3s;
max-height: 0px;
}
#denki-top .low_top_sec_03 .option_acc-box > input:checked ~ .option_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#denki-top .low_top_sec_03 .option_acc-box > input[type=checkbox]:checked ~ label ~ .option_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#denki-top .low_top_sec_03 .option_acc-box > input[type=checkbox]:checked ~ label::after {
transform: translateX(-50%) rotate(315deg);
-webkit-transform: translateX(-50%) rotate(315deg);
transition: all 0.3s;
}
#denki-top .low_top_sec_03 .option_acc-box > label::after {
content: "";
position: absolute;
bottom: -2.15rem;
right: 0;
top: 30%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
-webkit-transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_03 .option_acc-box {
margin: 0;
padding: 0 15px;
}
#denki-top .low_top_sec_03 .option_acc {
padding: 10px;
}
#denki-top .low_top_sec_03 .option_acc > .container {
margin: 0px;
width: auto;
}
#denki-top .low_top_sec_03 .option_acc-box::before {
font-size: 20px;
left: -25;
top: 16;
}
#denki-top .low_top_sec_03 .option_acc-box > input[type=checkbox]:checked ~ label ~ .option_acc_content {
margin-top: 10px;
}
#denki-top .low_top_sec_03 .option_acc-box > .option_acc_content::before {
font-size: 20px;
left: -25;
top: 16;
}
#denki-top .low_top_sec_03 .option-box > input[type=checkbox]:checked ~ label ~ .option_acc_content {
padding-bottom: 20px;
}
#denki-top .low_top_sec_03 .option_acc-box > label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 15px 0;
}
#denki-top .low_top_sec_03 .option_acc-box > label::before {
font-size: 24px;
left: 0px;
top: 0;
}
#denki-top .low_top_sec_03 .option_acc-box > label::after {
width: 0.7rem;
height: 0.7rem;
right: 20px;
top: 40%;
}
#denki-top .low_top_sec_03 .option_acc-box > .option_acc_content {
font-size: 14px;
padding: 0;
}
}
#denki-top .low_top_sec_03__wrap_box {
text-align: center;
min-height: 550px;
border-radius: 5px 5px 0px 0px;
border: 2px solid #FF4C40;
}
#denki-top .low_top_sec_03__wrap_box_title {
background-color: #FF4C40;
padding: 20px 0;
text-align: center;
color: white;
min-height: 100px;
}
#denki-top .low_top_sec_03__wrap_box_title img {
display: none;
}
#denki-top .low_top_sec_03__wrap_box_title h1 {
font-size: 18px;
}
#denki-top .low_top_sec_03__wrap_box .first {
margin-top: 12px;
}
#denki-top .low_top_sec_03__wrap_box img {
width: 94px;
margin: 20px 0;
}
#denki-top .low_top_sec_03__wrap_box_text {
text-align: justify;
font-size: 18px;
font-weight: 500;
padding: 10px;
}
#denki-top .low_top_sec_03__wrap_box_note {
font-size: 14px;
font-weight: 400;
text-align: justify;
padding: 10px;
}
#denki-top .low_top_sec_03__wrap_box_note h1 {
font-size: 14px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_03__wrap_box {
min-height: unset;
margin: 10px 0;
}
#denki-top .low_top_sec_03__wrap_box img {
display: none;
}
#denki-top .low_top_sec_03__wrap_box_title {
font-size: 18px;
padding: 10px 0 10px 10px;
min-height: unset;
text-align: left;
}
#denki-top .low_top_sec_03__wrap_box_title h1 {
font-size: 18px;
display: inline-block;
padding-left: 10px;
}
#denki-top .low_top_sec_03__wrap_box_title img {
vertical-align: bottom;
display: block;
margin: 0;
width: 50px;
display: inline;
}
#denki-top .low_top_sec_03__wrap_box .first {
padding-bottom: 10px;
margin: 0;
}
#denki-top .low_top_sec_03__wrap_box_text {
font-size: 14px;
}
#denki-top .low_top_sec_03__wrap_box_note {
font-size: 14px;
}
}
#denki-top .low_top_sec_04 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_03.jpg);
background-size: cover;
}
#denki-top .low_top_sec_04 .headline_1 {
margin-top: 80px;
text-align: center;
}
#denki-top .low_top_sec_04 .headline_2 {
margin-top: 40px;
text-align: center;
}
#denki-top .low_top_sec_04 .headline_2 br {
display: none;
}
#denki-top .low_top_sec_04__text {
margin-top: 40px;
line-height: 2em;
text-align: center;
}
#denki-top .low_top_sec_04__item {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 40px;
}
#denki-top .low_top_sec_04__item li {
display: flex;
flex-direction: column;
justify-content: flex-start;
width: 25%;
}
#denki-top .low_top_sec_04__item li a {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 50px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
#denki-top .low_top_sec_04__icon {
width: 100%;
}
#denki-top .low_top_sec_04__icon img {
width: 40%;
height: auto;
}
#denki-top .low_top_sec_04__logo {
width: 100%;
}
#denki-top .low_top_sec_04__logo img {
width: 70%;
height: auto;
}
#denki-top .low_top_sec_04__cath {
width: 100%;
padding: 20px;
font-size: 15px;
}
#denki-top .low_top_sec_04__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_04__item {
flex-wrap: wrap;
}
#denki-top .low_top_sec_04__item li {
width: 50%;
}
#denki-top .low_top_sec_04__item li a {
margin: 0 auto;
padding: 30px 0;
width: 150px;
height: 150px;
}
#denki-top .low_top_sec_04__icon img {
width: 60px;
height: auto;
}
#denki-top .low_top_sec_04__logo img {
width: 100px;
height: auto;
}
#denki-top .low_top_sec_04__cath {
padding: 10px 20px;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_04 .headline_1 {
margin-top: 40px;
}
#denki-top .low_top_sec_04 .headline_2 {
margin-top: 20px;
}
#denki-top .low_top_sec_04 .headline_2 br {
display: block;
}
#denki-top .low_top_sec_04__text {
margin-top: 20px;
font-size: 14px;
}
#denki-top .low_top_sec_04__item {
margin-top: 0;
}
#denki-top .low_top_sec_04__item li {
margin-top: 40px;
width: 100%;
}
#denki-top .low_top_sec_04__item li a {
padding: 30px 0;
}
#denki-top .low_top_sec_04__cath {
padding: 10px 20px 0 20px;
}
#denki-top .low_top_sec_04__button {
padding: 0 20px;
}
}
#denki-top .low_top_sec_05__item {
margin-top: 40px;
}
#denki-top .low_top_sec_05__item li {
height: 155px;
overflow: hidden;
}
#denki-top .low_top_sec_05__item li a {
position: relative;
display: block;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding-top: 5px;
align-items: center;
text-align: center;
color: #fff;
font-size: 22px;
letter-spacing: 2px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-color: rgba(0, 0, 0, 0.2);
overflow: hidden;
}
#denki-top .low_top_sec_05__item li a::after {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center center;
background-size: cover;
background-position: center center;
content: "";
transition: all 0.3s ease-out;
z-index: 0;
overflow: hidden;
}
#denki-top .low_top_sec_05__item li a::before {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
content: "";
transition: all 0.3s ease-out;
z-index: 1;
overflow: hidden;
}
#denki-top .low_top_sec_05__item li a:hover::after {
transform: scale(1.05);
}
#denki-top .low_top_sec_05__item li a span {
margin-top: 4px;
line-height: 1;
}
#denki-top .low_top_sec_05__item li:nth-child(1) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_04.jpg);
}
#denki-top .low_top_sec_05__item li:nth-child(2) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_05.jpg);
}
#denki-top .low_top_sec_05__item li:nth-child(3) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_06.jpg);
}
#denki-top .low_top_sec_05__item li:nth-child(4) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_07.jpg);
}
#denki-top .low_top_sec_05__item li:nth-child(n+3) {
margin-top: 30px;
}
#denki-top .low_top_sec_05__item li img {
margin-left: 40px;
width: 80px;
height: auto;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_05__item {
margin-top: 0;
padding: 0 20px;
}
#denki-top .low_top_sec_05__item li {
margin-top: 20px;
height: 100px;
}
#denki-top .low_top_sec_05__item li a {
font-size: 16px;
}
#denki-top .low_top_sec_05__item li img {
margin-left: 10px;
width: 40px;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_05 {
padding: 40px 0 !important;
}
#denki-top .low_top_sec_05__item {
margin-top: 0;
padding: 0 20px;
}
#denki-top .low_top_sec_05__item li {
margin-top: 20px;
height: 80px;
}
#denki-top .low_top_sec_05__item li a {
font-size: 16px;
}
#denki-top .low_top_sec_05__item li img {
margin-left: 10px;
width: 40px;
}
}
#denki-top .low_top_sec_06 {
padding: 40px;
}
#denki-top .low_top_sec_06__inner {
padding: 40px 0;
background-color: #fff0d9;
}
#denki-top .low_top_sec_06__inner__lead {
margin: 40px auto 0;
font-size: 20px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_06__inner__lead {
font-size: 16px;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_06__inner {
padding: 30px 10px;
}
}
#denki-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#denki-top .low_top_sec_06__tag__content ol {
display: flex;
justify-content: space-between;
}
#denki-top .low_top_sec_06__tag__content li {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
padding: 0 10px;
width: 18%;
}
#denki-top .low_top_sec_06__tag__content li::after {
position: absolute;
right: -30px;
top: 30px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
#denki-top .low_top_sec_06__tag__content li:last-child::after {
display: none;
}
#denki-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
}
#denki-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#denki-top .low_top_sec_06__tag__content_01__content {
margin-top: 10px;
display: flex;
align-items: center;
}
#denki-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#denki-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
@media screen and (max-width: 960px) {
#denki-top .low_top_sec_06 {
padding: 0;
}
#denki-top .low_top_sec_06 .tab {
position: relative;
}
#denki-top .low_top_sec_06 .tab-wrap {
display: block;
padding: 0;
}
#denki-top .low_top_sec_06 .tab + label {
width: 100%;
margin: 0;
height: auto;
line-height: 1.2em;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding: 10px 20px 10px 50px;
text-align: left;
}
#denki-top .low_top_sec_06 .tab + label span {
line-height: 1.3;
}
#denki-top .low_top_sec_06 .tab + label.tab1 {
margin-bottom: 10px;
}
#denki-top .low_top_sec_06 .tab + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
#denki-top .low_top_sec_06 .tab + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
#denki-top .low_top_sec_06 .tab:checked + label {
background-color: #333;
position: relative;
}
#denki-top .low_top_sec_06 .tab:checked + label::after {
content: none;
}
#denki-top .low_top_sec_06 .tab:checked + label span {
display: inline;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content li {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content li::after {
top: 30px !important;
right: -20px;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__icon {
display: flex;
align-items: center;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: auto;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content > div {
width: 100%;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__no {
text-align: center;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: none;
}
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content li {
justify-content: center;
align-items: flex-start;
margin-top: 50px;
padding: 0;
width: 100%;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content li::after {
top: 105% !important;
left: 50%;
margin: 0;
transform: translateX(-50%);
content: "\f078";
text-align: center;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap;
justify-content: center;
width: 100%;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__no {
width: 100%;
text-align: center;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
width: 100%;
text-align: center;
}
#denki-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: block;
}
}
#denki-top .low_top_sec_07 {
padding: 30px 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#denki-top .low_top_sec_07_block {
margin: 50px 0;
}
#denki-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #FF4C40;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#denki-top .low_top_sec_07 input {
display: none;
}
#denki-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#denki-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#denki-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#denki-top .low_top_sec_07 .answer {
overflow: hidden;
color: #ff4c40;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#denki-top .low_top_sec_07 .answer a {
color: #0866c6;
text-decoration: underline;
margin: 10px 0;
display: block;
}
#denki-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ p {
max-height: 2000px;
transition: all 1s;
margin: 10px 0;
}
#denki-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#denki-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#denki-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#denki-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#denki-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#denki-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#denki-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
}
#denki-top .low_top_sec_08__inner .col-xs-4 {
width: 33%;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_08__inner .col-xs-4 {
padding: 0px;
}
}
#denki-top .low_top_sec_08__inner .row {
justify-content: space-around;
}
#denki-top .low_top_sec_08__inner .headline_1 {
display: block;
text-align: center;
}
#denki-top .low_top_sec_08__inner__lead {
margin: 40px auto 50px;
font-size: 20px;
text-align: center;
}
#denki-top .low_top_sec_08__inner_round {
margin-bottom: 50px;
text-align: center;
margin: 0 20px 50px;
}
#denki-top .low_top_sec_08__inner_round img {
width: 220px;
}
@media screen and (max-width: 590px) {
#denki-top .low_top_sec_08 {
padding: 30px 0 !important;
background-color: #fff;
}
#denki-top .low_top_sec_08__inner__lead {
font-size: 16px;
margin: 30px auto 30px;
}
#denki-top .low_top_sec_08__inner_round {
margin: 0 5px 20px;
}
#denki-top .low_top_sec_08__inner_round img {
width: 100%;
}
}
.denki-price_plan {
padding: 0 !important;
}
.denki-price_plan input:checked + label + .tab__content {
max-height: 15000px;
}
.denki-price_plan input:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
max-height: 3000px;
}
.denki-price_plan .tab-wrap {
background-color: transparent;
}
.denki-price_plan .tab-wrap input:checked + label + .tab__content {
max-height: 15000px !important;
}
.denki-price_plan__wrapper {
padding: 80px 0;
background-color: rgba(240, 145, 56, 0.2);
width: 95%;
margin: 60px auto 0;
}
.denki-price_plan__wrapper .price_choice-btn_1,
.denki-price_plan__wrapper .price_choice-btn_2 {
display: none;
}
.denki-price_plan__wrapper #plan1:checked ~ .price_choice-btn_1,
.denki-price_plan__wrapper #plan2:checked ~ .price_choice-btn_2 {
display: block;
margin-top: 10px;
}
@media screen and (max-width: 590px) {
.denki-price_plan__wrapper {
padding: 20px 5px;
background-color: rgba(240, 145, 56, 0.2);
width: 100%;
margin: 30px auto 0;
}
}
.denki-price_plan__item .tab {
position: relative;
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) .tab-wrap_sp-only__content {
display: flex;
}
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) .tab-wrap_sp-only__content {
display: flex;
}
}
.denki-price_plan__item .tab + label {
width: 11.11%;
background-color: #fff;
}
@media screen and (max-width: 960px) {
.denki-price_plan__item .tab + label {
display: inline-block;
width: 30%;
margin: 0 1% 10px 1%;
line-height: 40px;
height: 40px;
border: 1px solid #333;
border-radius: 5px;
}
}
.denki-price_plan__item .tab:checked + label {
background-color: #333;
}
.denki-price_plan__item .tab:checked + label + .tab__content {
max-height: 15000px;
}
.denki-price_plan__item .tab__content {
padding: 0;
}
.denki-price_plan__item .tab__content_headline {
margin-top: 10px;
padding: 20px 17px;
text-align: center;
color: #000;
font-size: 18px;
font-weight: bold;
background-color: #ffb036;
}
@media screen and (max-width: 590px) {
.denki-price_plan__item .tab__content_headline {
margin-top: 0;
}
}
.denki-price_plan__item .tab__content .table {
width: 100%;
background-color: #fff;
border-left: 1px solid #ddd;
}
.denki-price_plan__item .tab__content .table td,
.denki-price_plan__item .tab__content .table th {
text-align: center;
vertical-align: middle;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.denki-price_plan__item .tab__content .table thead th {
padding: 15px;
color: #fff;
background-color: #919191;
}
.denki-price_plan__item .tab__content .table tbody th {
width: 20%;
color: #000;
background-color: #ffe6bf;
}
.denki-price_plan__item .tab__content .table tbody td {
padding: 20px;
}
.denki-price_plan__desp {
padding: 0 10px;
margin-top: 20px;
}
.denki-price_plan__desp h4 {
line-height: 1.5;
font-size: 18px;
}
@media screen and (max-width: 960px) {
.denki-price_plan__desp h4 {
font-size: 16px;
}
}
.denki-price_plan__desp p {
line-height: 1.5;
font-size: 14px;
}
@media screen and (max-width: 960px) {
.denki-price_plan__desp p {
font-size: 12px;
}
}
.denki-price_plan__button {
display: flex;
justify-content: center;
align-items: center;
padding: 80px 0;
}
.denki-price_plan__button a {
width: 40%;
}
@media screen and (max-width: 960px) {
.denki-price_plan__button a {
width: 100%;
margin-right: 20px;
margin-left: 20px;
}
}
.denki-price_plan__note {
padding: 40px 0;
background-color: #eee;
}
@media screen and (max-width: 960px) {
.denki-price_plan__note .container {
width: auto;
margin-right: 20px;
margin-left: 20px;
}
}
.denki-price_plan__note_inner {
padding: 40px !important;
background-color: #fff;
}
.denki-price_plan__note_title {
padding: 0;
font-size: 20px;
font-weight: bold;
}
.denki-price_plan__note dl {
margin-top: 20px;
}
.denki-price_plan__note dt {
position: relative;
}
.denki-price_plan__note dt::after {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
content: "：";
}
@media screen and (max-width: 960px) {
.denki-price_plan .tab-wrap_sp-only {
background-color: transparent !important;
margin-top: 10px;
}
.denki-price_plan .tab-wrap_sp-only__content {
width: 100%;
}
.denki-price_plan .tab-wrap_sp-only__content__inenr {
width: 100%;
}
.denki-price_plan .tab-wrap_sp-only label {
width: 30%;
}
.denki-price_plan .tab-wrap_sp-only .tab-wrap_sp-only__title {
margin-top: -10px;
}
.denki-price_plan .tab-wrap_sp-only__content {
padding-right: 0 !important;
}
.denki-price_plan .tab-wrap_sp-only__content__inenr {
width: 100%;
}
.denki-price_plan .tab-wrap_sp-only .tab__content_headline {
display: block !important;
width: 100%;
font-size: 16px;
}
.denki-price_plan .tab-wrap_sp-only .tab__content_headline span {
display: block;
}
.denki-price_plan .tab-wrap_sp-only .table {
width: 100%;
background-color: #fff;
border-left: 1px solid #ddd;
}
.denki-price_plan .tab-wrap_sp-only .table td,
.denki-price_plan .tab-wrap_sp-only .table th {
text-align: center;
vertical-align: middle;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.denki-price_plan .tab-wrap_sp-only .table thead th {
padding: 15px;
color: #fff;
background-color: #919191;
}
.denki-price_plan .tab-wrap_sp-only .table tbody th {
color: #000;
background-color: #ffe6bf;
}
.denki-price_plan .tab-wrap_sp-only .table tbody td {
padding: 20px;
}
.denki-price_plan .tab-wrap_sp-only .denki-price_plan__item .tab-wrap_sp-only__title {
padding-left: 0;
margin-bottom: 10px;
}
.denki-price_plan .tab-wrap_sp-only .denki-price_plan__item .tab + label {
display: inline-block;
width: 30%;
height: 40px;
margin: 0 1% 10px 1%;
line-height: 40px;
border: 1px solid #333;
border-radius: 5px;
}
.denki-price_plan .tab-wrap_sp-only .denki-price_plan__item:checked + label {
background-color: #333;
position: relative;
}
.denki-price_plan .tab-wrap_sp-only .denki-price_plan__item:checked + label::after {
content: none;
}
}
.denki-repair .headline_2 {
color: #551d00;
}
.denki-repair .headline_8 {
color: #551d00;
}
.denki-repair .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/repair/kv.jpg);
}
.denki-repair .lower__kv__lead {
color: #551d00;
}
.denki-repair .lower__kv__lead p {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.denki-repair .lower__kv__lead p {
font-size: 16px;
line-height: 28px;
}
}
.denki-repair_sec_01 {
position: relative;
background: linear-gradient(90deg, #ffefd7, #ffdcd9);
margin: 0 50px;
}
@media screen and (max-width: 590px) {
.denki-repair_sec_01 {
margin: 0px;
}
}
.denki-repair_sec_01 .headline_1 {
z-index: 2;
}
.denki-repair_sec_01__content {
margin-top: 20px;
z-index: 2;
}
.denki-repair_sec_01__text .headline_2 {
color: #551d00;
}
.denki-repair_sec_01__text p {
margin-top: 40px;
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.denki-repair_sec_01__text p {
font-size: 16px;
line-height: 28px;
}
}
.denki-repair_sec_01__kome li {
margin-top: 5px;
}
.denki-repair_sec_01__img {
position: relative;
}
.denki-repair_sec_01__img img {
position: absolute;
left: 0;
top: 0;
width: 120%;
height: auto;
}
@media screen and (max-width:1200px) {
.denki-repair_sec_01::before {
height: 96%;
}
.denki-repair_sec_01__img img {
top: 60px;
}
}
@media screen and (max-width:991px) {
.denki-repair_sec_01 {
padding-top: 40px !important;
}
.denki-repair_sec_01::before {
height: 92%;
}
.denki-repair_sec_01__content {
margin-top: 40px;
}
.denki-repair_sec_01__img img {
top: 160px;
}
}
@media screen and (max-width: 960px) {
.denki-repair_sec_01::before {
height: 88%;
}
.denki-repair_sec_01__img {
margin-top: 20px;
padding: 10px;
border-radius: 10px;
}
.denki-repair_sec_01__img img {
top: 145px;
width: 100%;
}
}
@media screen and (max-width:767px) {
.denki-repair_sec_01::before {
height: 85%;
}
.denki-repair_sec_01__img img {
position: static;
}
}
@media screen and (max-width: 590px) {
.denki-repair_sec_01 {
padding: 30px 10px !important;
}
.denki-repair_sec_01__content {
margin-top: 20px;
z-index: 2;
padding: 0;
}
.denki-repair_sec_01__text p {
margin-top: 20px;
}
.denki-repair_sec_01__img {
background-color: unset;
}
.denki-repair_sec_01__img img {
position: static;
}
}
.denki-repair_sec_02__item {
margin-top: 20px;
display: flex;
justify-content: space-between;
}
.denki-repair_sec_02__item li {
width: 23%;
}
.denki-repair_sec_02__img {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
}
.denki-repair_sec_02__img img {
width: 60%;
height: auto;
}
.denki-repair_sec_02__text {
margin-top: 20px;
padding: 20px;
min-height: 200px;
background-color: #eee;
}
@media screen and (max-width: 590px) {
.denki-repair_sec_02__text {
min-height: auto;
}
}
.denki-repair_sec_02__title {
text-align: center;
font-weight: bold;
color: #ff4c40;
font-size: 18px;
}
.denki-repair_sec_02 p {
margin-top: 10px;
font-size: 14px;
line-height: 1.5em;
}
.denki-repair_sec_02__button {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
.denki-repair_sec_02__button .button {
width: 50%;
}
.denki-repair_sec_02 .kome {
margin-top: 40px;
text-align: center;
}
@media screen and (max-width: 960px) {
.denki-repair_sec_02__item {
flex-wrap: wrap;
}
.denki-repair_sec_02__item li {
width: 48%;
}
.denki-repair_sec_02__item li:nth-child(n+3) {
margin-top: 10px;
}
}
@media screen and (max-width: 590px) {
.denki-repair_sec_02 {
padding: 20px 0 !important;
}
.denki-repair_sec_02__img {
position: relative;
}
.denki-repair_sec_02__img img {
margin-top: 0px;
width: 60px;
position: absolute;
right: 10px;
top: 0px;
}
.denki-repair_sec_02__item {
margin-top: 0px;
}
.denki-repair_sec_02__item li {
width: 100%;
padding: 0px;
}
.denki-repair_sec_02__img img {
margin-top: 15px;
width: 60px;
}
.denki-repair_sec_02__button {
margin-top: 20px;
}
.denki-repair_sec_02__button .button {
width: 1000%;
}
.denki-repair_sec_02 .kome {
margin-top: 20px;
font-size: 10px;
}
}
.denki-moving_discount .headline_8 {
color: #551d00;
}
.denki-moving_discount .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/moving_discount/kv.jpg);
}
.denki-kaketuke .headline_8 {
color: #551d00;
}
.denki-kaketuke .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/kaketuke/kv.jpg);
}
.denki-kaketuke .lower__kv__lead {
margin-bottom: 100px;
}
@media screen and (max-width: 960px) {
.denki-kaketuke .lower__kv__lead {
margin-bottom: 0;
}
}
.denki-kaketuke_sec_01 {
padding: 40px 0 20px !important;
}
.denki-kaketuke_sec_01__item {
margin-top: 20px;
width: auto;
}
.denki-kaketuke_sec_01__img {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
}
.denki-kaketuke_sec_01__img img {
width: 40%;
height: auto;
}
.denki-kaketuke_sec_01__text {
margin-top: 20px;
padding: 20px;
min-height: 220px;
background-color: #eee;
}
.denki-kaketuke_sec_01__title {
text-align: center;
font-weight: bold;
color: #ff4c40;
}
@media screen and (max-width: 590px) {
.denki-kaketuke_sec_01__title {
font-size: 15px;
}
}
.denki-kaketuke_sec_01__list li {
margin-top: 10px;
}
.denki-kaketuke_sec_01__list li:before {
margin-right: 0.5em;
font-family: "Font Awesome 5 Free";
content: "\f00c";
font-weight: 900;
color: #ff4c40;
}
.denki-kaketuke_sec_01 p {
margin-top: 10px;
font-weight: bold;
}
.denki-kaketuke_sec_01__button {
display: flex;
justify-content: center;
align-items: center;
}
.denki-kaketuke_sec_01__button .button {
width: 50%;
}
.denki-kaketuke_sec_01 .kome {
margin-top: 40px;
text-align: center;
}
@media screen and (max-width: 960px) {
.denki-kaketuke_sec_01__img img {
width: 30%;
}
}
@media screen and (max-width: 590px) {
.denki-kaketuke_sec_01 {
padding: 20px 10px !important;
}
.denki-kaketuke_sec_01__img {
position: relative;
}
.denki-kaketuke_sec_01__img img {
width: 60px;
position: absolute;
right: 10px;
top: 0px;
}
.denki-kaketuke_sec_01__item {
margin: 0;
width: 100%;
}
.denki-kaketuke_sec_01__item > li {
margin-top: 10px;
padding: 0px;
}
.denki-kaketuke_sec_01__list li {
padding-left: 1.5em;
text-indent: -1.5em;
}
.denki-kaketuke_sec_01__button {
margin-top: 20px;
}
.denki-kaketuke_sec_01__button .button {
width: 1000%;
}
.denki-kaketuke_sec_01 .kome {
margin-top: 20px;
}
}
.denki-kaketuke_sec_02 {
background-color: #fff4e3;
margin: 0px 50px;
}
@media screen and (max-width: 590px) {
.denki-kaketuke_sec_02 {
margin: 0px;
}
}
.denki-kaketuke_sec_02 .headline_1 br {
display: none;
}
.denki-kaketuke_sec_02__item {
margin-top: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.denki-kaketuke_sec_02__tel {
display: flex;
justify-content: center;
align-items: center;
padding: 20px 40px 20px 100px;
font-size: 36px;
letter-spacing: 2px;
font-weight: bold;
background-color: #fff;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/common/fd.svg);
background-position: 40px center;
background-size: 38px auto;
}
.denki-kaketuke_sec_02__tel a {
display: flex;
justify-content: center;
align-items: center;
padding-top: 6px;
}
.denki-kaketuke_sec_02__no {
padding: 40px;
display: flex;
justify-content: center;
align-items: center;
background-color: #ffe4ba;
font-weight: bold;
}
.denki-kaketuke_sec_02__time {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
font-size: 24px;
font-weight: bold;
letter-spacing: 2px;
}
.denki-kaketuke_sec_02__time span {
margin-right: 10px;
padding: 2px 20px 0 20px;
height: 25px;
line-height: 25px;
font-size: 12px;
font-weight: normal;
color: #fff;
background-color: #333;
}
.denki-kaketuke_sec_02 .kome {
margin-top: 20px;
text-align: center;
}
@media screen and (max-width: 960px) {
.denki-kaketuke_sec_02__item {
flex-wrap: wrap;
padding: 0;
margin: 15px;
}
.denki-kaketuke_sec_02__item > div {
width: 100%;
}
}
@media screen and (max-width: 590px) {
.denki-kaketuke_sec_02 {
padding: 30px 10px !important;
}
.denki-kaketuke_sec_02 .headline_1 br {
display: block;
}
.denki-kaketuke_sec_02__tel {
padding: 40px 10px 10px 10px;
font-size: 30px;
letter-spacing: 2px;
text-align: center;
background-position: center top 20px;
}
.denki-kaketuke_sec_02__no {
padding: 10px;
}
.denki-kaketuke_sec_02__time {
margin-top: 20px;
flex-wrap: wrap;
}
.denki-kaketuke_sec_02__time span {
width: 100%;
text-align: center;
}
.denki-kaketuke_sec_02 .kome {
margin-top: 10px;
}
.denki-kaketuke_sec_02__button {
margin-top: 20px;
}
.denki-kaketuke_sec_02__button .button {
width: 1000%;
}
}
.denki-kaketuke_sec_03 {
padding: 30px 10px !important;
margin-bottom: 70px;
}
.denki-kaketuke_sec_03 .kome {
text-align: center;
}
.denki-purchase .headline_8 {
color: #551d00;
}
.denki-purchase .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/purchase/kv.jpg);
}
.denki-purchase .lower__kv__logo {
width: 320px;
height: auto;
}
.denki-purchase .lower__kv__logo img {
width: 100%;
height: auto;
}
@media screen and (max-width: 590px) {
.denki-purchase .lower__kv__logo {
width: 100%;
}
}
.denki-purchase_sec_01 {
background-color: #fff4e3;
margin: 0px 50px !important;
}
.denki-purchase_sec_01 .headline_1 {
z-index: 2;
}
.denki-purchase_sec_01__content {
margin-top: 20px;
z-index: 2;
}
.denki-purchase_sec_01__item {
display: flex;
align-items: flex-start;
margin-top: 40px;
}
.denki-purchase_sec_01__user {
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 20px 20px 0 0;
width: 80px;
height: 80px;
background-color: #fff;
border-radius: 100%;
}
.denki-purchase_sec_01__user img {
width: 40px;
}
.denki-purchase_sec_01__comment {
flex: 1;
}
.denki-purchase_sec_01__comment > p {
margin: 0 !important;
font-weight: bold;
}
.denki-purchase_sec_01__balloon {
position: relative;
padding: 20px;
background-color: #fff;
border-radius: 10px;
font-size: 14px;
line-height: 1.5em;
}
.denki-purchase_sec_01__balloon::after {
position: absolute;
top: 20px;
left: -10px;
width: 0;
height: 0;
border-top: 10px solid transparent;
border-right: 12px solid #fff;
border-bottom: 10px solid transparent;
content: "";
}
.denki-purchase_sec_01__balloon > p {
margin: 0 !important;
}
.denki-purchase_sec_01__balloon img {
width: 100%;
padding: 10px;
height: auto;
}
.denki-purchase_sec_01__text {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_01__text {
padding: 0;
}
}
.denki-purchase_sec_01__text > div {
width: 100%;
}
.denki-purchase_sec_01__text .headline_2 {
color: #551d00;
}
.denki-purchase_sec_01__text p {
margin-top: 20px;
line-height: 2em;
}
.denki-purchase_sec_01__img img {
width: 100%;
height: auto;
}
@media screen and (max-width: 960px) {
.denki-purchase_sec_01__img {
margin-top: 20px;
padding: 0;
}
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_01 {
padding: 40px 20px;
margin: 0 !important;
}
.denki-purchase_sec_01__content {
margin-top: 20px;
z-index: 2;
}
.denki-purchase_sec_01__item {
flex-wrap: wrap;
margin-top: 40px;
}
.denki-purchase_sec_01__user {
margin: 0;
width: 40px;
height: 40px;
}
.denki-purchase_sec_01__user:after {
font-size: 20px;
}
.denki-purchase_sec_01__comment > p {
padding-left: 10px;
font-weight: normal;
line-height: 1.2em;
font-size: 14px;
}
.denki-purchase_sec_01__balloon {
margin-top: 40px;
margin-left: -40px;
padding: 10px;
}
.denki-purchase_sec_01__balloon::after {
top: -20px;
left: 15px;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 12px solid #fff;
}
}
.denki-purchase_sec_02__inner {
margin-top: 40px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/purchase/bg.png);
background-size: 60% 90%;
background-position: left center;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_02__inner {
margin-top: 30px;
background-image: none;
}
}
.denki-purchase_sec_02__img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.denki-purchase_sec_02 .headline_2 {
color: #551d00;
}
.denki-purchase_sec_02__text {
display: flex;
align-items: center;
}
.denki-purchase_sec_02__box {
margin: 60px 0 60px -60px;
padding: 40px 0 40px 40px;
background-color: #fff;
}
.denki-purchase_sec_02 p {
margin-top: 20px;
line-height: 32px;
font-size: 18px;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_02 p {
line-height: 28px;
font-size: 16px;
}
}
.denki-purchase_sec_02 .kome {
margin-top: 10px;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_02__box {
margin: 0;
padding: 10px 0;
}
}
.denki-purchase_sec_03 {
padding: 0 40px !important;
}
.denki-purchase_sec_03__inner {
padding: 80px 0;
background: linear-gradient(90deg, #fff0d8, #ffdcda);
background-size: cover;
}
.denki-purchase_sec_03 .headline_7 {
margin-top: 40px;
text-align: center;
color: #551d00;
}
.denki-purchase_sec_03 .headline_7 br {
display: none;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_03 .headline_7 {
font-size: 22px;
font-weight: 300;
margin-top: 10px;
text-align: left;
}
}
.denki-purchase_sec_03 .kome {
margin-top: 10px;
text-align: center;
}
.denki-purchase_sec_03 .swiper-wrap {
position: relative;
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-next,
.denki-purchase_sec_03 .swiper-wrap .swiper-button-prev {
display: block;
width: 20px;
height: 20px;
cursor: pointer;
opacity: 0.7;
background: #fff;
border-radius: 50%;
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-next:before,
.denki-purchase_sec_03 .swiper-wrap .swiper-button-prev:before {
content: "";
position: absolute;
display: inline-block;
width: 8px;
height: 8px;
top: 50%;
transform: rotate(45deg) translate(-50%, -50%);
margin-top: 1px;
margin-left: 1px;
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-next {
right: 40px;
}
@media screen and (max-width: 960px) {
.denki-purchase_sec_03 .swiper-wrap .swiper-button-next {
right: 5px;
}
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-next:before {
border-top: 2px solid #555;
border-right: 2px solid #555;
right: calc(50% - 2px);
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-prev {
left: 40px;
}
@media screen and (max-width: 960px) {
.denki-purchase_sec_03 .swiper-wrap .swiper-button-prev {
left: 5px;
}
}
.denki-purchase_sec_03 .swiper-wrap .swiper-button-prev:before {
border-left: 2px solid #555;
border-bottom: 2px solid #555;
right: calc(50% - 5px);
}
.denki-purchase_sec_03 .swiper-container-for-mypage {
overflow: hidden;
max-width: 1140px;
margin: 0 auto;
}
@media screen and (max-width: 960px) {
.denki-purchase_sec_03 .swiper-container-for-mypage {
width: 90%;
}
}
.denki-purchase_sec_03 .swiper-wrapper, .denki-purchase_sec_03__list {
justify-content: space-between;
margin-top: 40px;
padding: 0;
max-width: 1140px;
width: 90%;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_03 .swiper-wrapper, .denki-purchase_sec_03__list {
margin-top: 10px;
}
}
.denki-purchase_sec_03 .swiper-wrapper .swiper-slide, .denki-purchase_sec_03 .swiper-wrapper__item, .denki-purchase_sec_03__list .swiper-slide, .denki-purchase_sec_03__list__item {
pointer-events: none;
height: 150px;
width: 15%;
background-color: #fff;
border-radius: 75px;
position: relative;
margin: 0 10px 40px 0;
display: flex;
align-items: center;
justify-content: center;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_03 .swiper-wrapper .swiper-slide, .denki-purchase_sec_03 .swiper-wrapper__item, .denki-purchase_sec_03__list .swiper-slide, .denki-purchase_sec_03__list__item {
background-color: transparent;
}
}
.denki-purchase_sec_03 .swiper-wrapper .swiper-slide img, .denki-purchase_sec_03 .swiper-wrapper__item img, .denki-purchase_sec_03__list .swiper-slide img, .denki-purchase_sec_03__list__item img {
width: 100px;
height: auto;
}
.denki-purchase_sec_03 .swiper-wrapper .swiper-slide span, .denki-purchase_sec_03 .swiper-wrapper__item span, .denki-purchase_sec_03__list .swiper-slide span, .denki-purchase_sec_03__list__item span {
position: absolute;
left: 0;
bottom: -25px;
width: 100%;
text-align: center;
font-size: 10px;
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase {
margin: 40px auto 0 auto;
padding: 0 10px;
max-width: 1140px;
width: 90%;
height: 175px;
overflow: hidden;
background-image: none;
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-prev,
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-next {
background-image: none;
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-prev::after,
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-next::after {
display: block;
margin-top: 0px;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
font-size: 18px;
border-radius: 100%;
background-color: #fff;
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: #aaa;
content: "";
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-prev {
margin-left: -10px;
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-prev::after {
content: "\f053";
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-next {
margin-right: -6px;
}
.denki-purchase_sec_03 .swiper-container.swiper-purchase .swiper-button-next::after {
content: "\f054";
}
.denki-purchase_sec_03 .swiper-slide {
position: relative;
height: 150px;
background-color: #fff;
border-radius: 100%;
}
.denki-purchase_sec_03 .swiper-slide img {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 130px;
height: auto;
}
.denki-purchase_sec_03 .swiper-slide span {
position: absolute;
left: 0;
bottom: -25px;
width: 100%;
text-align: center;
font-size: 12px;
}
@media screen and (max-width: 960px) {
.denki-purchase_sec_03 {
padding: 0 !important;
}
.denki-purchase_sec_03__inner {
padding: 30px 15px;
}
.denki-purchase_sec_03 .headline_7 {
margin-top: 20px;
}
.denki-purchase_sec_03 .swiper-container.purchase {
width: 100%;
}
.denki-purchase_sec_03 .swiper-slide {
border-radius: 50px;
}
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_03 .headline_7 br {
display: block;
}
.denki-purchase_sec_03 .kome {
text-align: left;
text-indent: 0;
}
}
.denki-purchase_sec_04 {
padding-bottom: 0 !important;
}
.denki-purchase_sec_04 .headline_7 {
margin-top: 20px;
text-align: center;
color: #551d00;
}
.denki-purchase_sec_04__item {
margin-top: 40px;
padding-top: 20px;
text-align: center;
background-color: #fff;
border: 1px solid #333333;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_04__item {
margin-top: 20px;
}
}
.denki-purchase_sec_04__name {
font-weight: bold;
letter-spacing: 3px;
}
.denki-purchase_sec_04__tel {
display: inline-block;
padding-left: 50px;
font-size: 36px;
letter-spacing: 2px;
font-weight: bold;
background-color: #fff;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/common/fd.svg);
background-position: left center;
background-size: 38px auto;
}
.denki-purchase_sec_04__tel a {
display: flex;
justify-content: center;
align-items: center;
padding-top: 6px;
}
.denki-purchase_sec_04__code {
padding: 10px;
font-size: 14px;
font-weight: bold;
background-color: #ffe4ba;
}
.denki-purchase_sec_04__time {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
height: 25px;
font-size: 24px;
font-weight: bold;
letter-spacing: 2px;
}
.denki-purchase_sec_04__title {
margin-right: 10px;
padding: 2px 20px 0 20px;
height: 25px;
line-height: 25px;
font-size: 12px;
font-weight: normal;
color: #fff;
background-color: #333;
}
.denki-purchase_sec_04__note {
font-size: 14px;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_04__note {
font-size: 12px;
}
}
.denki-purchase_sec_04 .kome {
margin-top: 20px;
text-align: center;
}
@media screen and (max-width: 590px) {
.denki-purchase_sec_04 .headline_7 {
font-weight: normal;
font-size: 16px;
margin-top: 20px;
color: #551d00;
text-align: left;
}
.denki-purchase_sec_04__tel {
margin-top: 10px;
padding-top: 30px;
padding-left: 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/common/fd.svg);
background-position: center top;
background-size: auto 30px;
}
.denki-purchase_sec_04__tel a {
display: flex;
justify-content: center;
align-items: center;
padding-top: 6px;
}
.denki-purchase_sec_04__time {
flex-wrap: wrap;
display: inline;
margin-top: 10px;
font-size: 18px;
}
.denki-purchase_sec_04__title {
text-align: center;
width: 100%;
display: inline;
padding: 2px 12px;
}
.denki-purchase_sec_04 .kome {
margin-top: 40px;
text-align: center;
}
}
.denki-flow {
padding: 0 !important;
}
.denki-flow__inner {
margin-top: 80px;
padding: 80px;
background-color: rgba(240, 145, 56, 0.2);
}
.denki-flow__item {
padding: 40px;
background-color: #fff;
}
.denki-flow__item .headline_7 {
text-align: center;
}
.denki-flow__item .headline_7 br {
display: none;
}
.denki-flow__item_list {
margin-top: 40px;
background-color: #fff;
}
.denki-flow__item_list li {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
flex-wrap: wrap;
}
.denki-flow__item_list__img {
width: 150px;
}
@media screen and (max-width: 960px) {
.denki-flow__item_list__img {
margin-bottom: 20px;
}
}
.denki-flow__item_list__img img {
width: 100%;
height: auto;
}
.denki-flow__item_list__text {
margin-top: 20px;
width: 100%;
text-align: center;
color: #551d00;
font-weight: bold;
}
.denki-flow__item p {
margin-top: 40px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.denki-flow__item p {
padding: 0 5%;
}
}
.denki-flow__item .kome {
margin-top: 10px;
}
@media screen and (max-width: 590px) {
.denki-flow__item .kome {
padding: 0 5%;
text-indent: 0;
}
}
.denki-flow__tag__wrapper {
margin-top: 80px;
padding: 0;
}
.denki-flow__tag__wrapper .tab-wrap {
background-color: transparent;
}
.denki-flow__tag__wrapper .tab__content {
margin-top: 20px;
padding: 20px;
border: 2px solid #d9d3c9;
background-color: #fff;
}
.denki-flow__tag__wrapper .tab__content > ol > li {
position: relative;
display: flex;
margin-bottom: 80px;
padding: 40px;
}
.denki-flow__tag__wrapper .tab__content > ol > li::after {
content: "";
margin: 0 0 0 -20px;
padding: 0;
width: 40px;
height: 40px;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
bottom: -50px;
left: 50%;
}
.denki-flow__tag__wrapper .tab__content > ol > li:last-child::after {
display: none;
margin-bottom: 0;
}
.denki-flow__tag__wrapper .tab__content > ol > li .denki-flow__tag__content_01__icon {
margin-top: 10px;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__icon {
width: 100px;
height: auto;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__content__wrapper {
display: flex;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__no {
font-size: 34px;
font-weight: bold;
color: #ff4c40;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #ff4c40;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__text span {
display: block;
font-weight: bold;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__text Ul {
margin-top: 20px;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01__text li:before {
margin-right: 5px;
font-family: "Font Awesome 5 Free";
content: "\f111";
font-weight: 900;
font-size: 12px;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01 .komg, .denki-flow__tag__wrapper .denki-flow__tag__content_01__button {
margin-top: 20px;
width: 100%;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01 .komg .button, .denki-flow__tag__wrapper .denki-flow__tag__content_01__button .button {
width: 50%;
}
.denki-flow__tag__wrapper .denki-flow__tag__content_01 .komg .button br, .denki-flow__tag__wrapper .denki-flow__tag__content_01__button .button br {
display: none;
}
.denki-flow__button {
margin: 80px auto 0 auto;
}
.denki-flow__button li:last-child {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
.denki-flow {
padding: 0;
}
.denki-flow .tab-wrap {
display: block;
padding: 0;
}
.denki-flow .tab + label { width: 100%;
margin: 0;
height: auto;
line-height: 1.2em;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding: 10px 20px 10px 50px;
text-align: left;
}
.denki-flow .tab + label span {
line-height: 1.3;
}
.denki-flow .tab + label.tab1 {
margin-bottom: 10px;
}
.denki-flow .tab + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.denki-flow .tab + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
.denki-flow .tab:checked + label {
background-color: #333 !important;
position: relative;
}
.denki-flow .tab:checked + label::after {
content: none;
}
.denki-flow .tab:checked + label span {
display: inline;
}
.denki-flow .denki-flow__tag__wrapper .tab__content > ol > li {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 0;
}
.denki-flow .denki-flow__tag__wrapper .tab__content > ol > li::after {
top: 100% !important;
}
.denki-flow .denki-flow__tag__content_01__icon {
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
display: none;
}
.denki-flow .denki-flow__tag__content_01__icon img {
width: 80px;
height: auto;
}
.denki-flow .denki-flow__tag__content_01__content {
flex-wrap: wrap;
margin: 0;
width: 100%;
}
.denki-flow .denki-flow__tag__content_01__content > div {
width: 100%;
}
.denki-flow .denki-flow__tag__content_01__content .denki-flow__tag__content_01__no {
margin-right: 20px;
text-align: center;
display: flex;
width: 3%;
align-items: center;
}
.denki-flow .denki-flow__tag__content_01__content .denki-flow__tag__content_01__title {
margin: 0;
width: 90%;
padding-right: 60px;
justify-content: flex-start;
}
.denki-flow .denki-flow__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
}
.denki-flow .denki-flow__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: none;
}
.denki-flow .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) li:nth-child(3) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_15.svg) no-repeat right center/contain;
}
.denki-flow .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) li:nth-child(4) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_17.svg) no-repeat right center/auto 70%;
}
.denki-flow .denki-flow__tag__content_01__button {
width: 100%;
}
.denki-flow .denki-flow__tag__content_01__button a {
width: 100% !important;
}
.denki-flow .tab__content li:nth-child(1) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_14.svg) no-repeat right center/auto 75%;
}
.denki-flow .tab__content li:nth-child(2) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_15.svg) no-repeat right center/contain;
}
.denki-flow .tab__content li:nth-child(3) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_16.svg) no-repeat right center/auto 65%;
}
.denki-flow .tab__content li:nth-child(4) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_17.svg) no-repeat right center/contain;
}
.denki-flow .tab__content li:nth-child(5) .denki-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_18.svg) no-repeat right center/contain;
}
}
@media screen and (max-width: 590px) {
.denki-flow .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
.denki-flow .low_top_sec_06__tag__content ol > li {
justify-content: center;
align-items: flex-start;
margin-top: 50px;
padding: 0;
width: 100%;
border: 1px solid red;
}
.denki-flow .low_top_sec_06__tag__content ol > li::after {
top: 105% !important;
left: 50%;
margin: 0;
transform: translateX(-50%);
content: "\f078";
text-align: center;
}
.denki-flow .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap;
justify-content: center;
width: 100%;
}
.denki-flow .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__no {
width: 100%;
text-align: center;
}
.denki-flow .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
width: 100%;
text-align: center;
}
.denki-flow .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: block;
}
}
@media screen and (max-width: 590px) {
.denki-flow__inner {
margin-top: 20px;
padding: 20px;
}
.denki-flow__inner .headline_7 {
font-weight: normal;
}
.denki-flow__inner .headline_7 br {
display: block;
}
.denki-flow__item {
padding: 40px 0;
}
.denki-flow__item_list {
margin: 0;
width: 100%;
}
.denki-flow__item_list li {
margin-top: 20px;
align-items: center;
justify-content: space-between;
}
.denki-flow__item_list__img {
width: 32%;
margin-right: 3%;
margin: 0 auto;
}
.denki-flow__item_list__text {
margin-top: 0;
width: 65%;
text-align: left;
font-size: 14px;
}
.denki-flow__button {
margin: 20px auto 0 auto;
}
}
#gas-ca.denki .gas-ca-sec-02 .inner {
background-color: #ffeda0;
}
#gas-ca.denki .gas-ca-sec-02 .inner .p--normal {
margin-top: 1.5em;
}
#gas-ca.denki .gas-ca-sec-02 .inner .link--normal {
color: #2d77c1;
text-decoration: underline;
}
.gas .gas-bg-color-01 {
background: #e6f9f4;
}
#gas-top .headline_4 {
font-family: "Trebuchet MS", "Hind", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#gas-top .low { }
#gas-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: 0 -200px;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_back_01.jpg);
background-attachment: fixed;
position: relative;
}
#gas-top .low__kv__back .kv-ttl_pc {
position: absolute;
bottom: 45px;
right: 75px;
}
#gas-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 700px;
}
#gas-top .low__kv__back .kv-ttl_sp {
width: 70%;
top: 0px;
right: 60px;
height: auto;
object-fit: contain;
position: absolute;
}
#gas-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#gas-top .low__kv__back {
height: 300px;
background-position: -200px -150px;
}
#gas-top .low__kv__back .kv-ttl_pc {
bottom: 20px;
}
#gas-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#gas-top .low__kv {
position: relative;
height: 200px;
}
#gas-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#gas-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 310px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 60% 100%;
background-size: 240%;
}
}
#gas-top .low_top { }
#gas-top .low_top_sec_01__item {
display: flex;
justify-content: center;
margin-top: 40px;
}
#gas-top .low_top_sec_01__item li {
width: 22%;
}
#gas-top .low_top_sec_01__item a:hover {
background-color: rgba(0, 176, 137, 0.5);
}
#gas-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#gas-top .low_top_sec_01__item_text {
color: #551d00;
}
#gas-top .low_top_sec_01 .note {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_01__item {
flex-wrap: wrap;
}
#gas-top .low_top_sec_01__item li {
width: 33.3%;
padding: 0 15px;
}
#gas-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#gas-top .low_top_sec_01__item_icon img {
width: auto;
height: 100%;
}
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_01 {
background-color: #fff;
padding: 30px 0 40px !important;
}
#gas-top .low_top_sec_01 .headline_1 {
margin-bottom: 15px;
}
#gas-top .low_top_sec_01__item {
padding: 0;
margin: 20px 0 0;
}
#gas-top .low_top_sec_01__item li {
margin-bottom: 0;
padding: 0 5px;
}
#gas-top .low_top_sec_01__item li a {
padding: 15px 5px;
}
#gas-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
text-align: center;
}
#gas-top .low_top_sec_01__item_icon img {
width: 70%;
}
#gas-top .low_top_sec_01__item_text {
margin-top: 15px;
color: #551d00;
font-size: 13px;
}
}
#gas-top .low_top_sec_02 {
background: #e6f9f4;
padding: 0 40px;
}
#gas-top .low_top_sec_02__inner {
padding: 60px 0;
margin-top: 80px;
background: #e6f9f4;
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_02__inner {
margin-top: 0;
}
}
#gas-top .low_top_sec_02 .headline_2 {
color: #002529;
margin: 50px 0;
text-align: center;
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_02 .headline_2 {
margin: 20px 0 0px;
}
}
#gas-top .low_top_sec_02 .headline_2.is-gas_catch {
color: #005090;
}
#gas-top .low_top_sec_02__text {
margin-top: 40px;
text-align: center;
line-height: 2em;
}
#gas-top .low_top_sec_02__button {
margin-top: 40px;
}
#gas-top .low_top_sec_02__table {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
padding: 0;
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_02__table {
margin-top: 20px;
}
}
#gas-top .low_top_sec_02__table table {
width: 100%;
table-layout: fixed;
text-align: center;
}
#gas-top .low_top_sec_02__table table th {
color: #fff;
background-color: #919191;
}
#gas-top .low_top_sec_02__table table td {
background-color: #fff;
padding: 15px 30px;
}
#gas-top .low_top_sec_02__table table td.price {
background-color: #c3ffef;
}
#gas-top .low_top_sec_02__table .table-bordered {
border: 1px solid #707070;
}
#gas-top .low_top_sec_02__table .table-bordered td, #gas-top .low_top_sec_02__table .table-bordered th {
border: 1px solid #707070;
}
#gas-top .low_top_sec_02__table .table-bordered th {
padding: 15px 0;
}
#gas-top .low_top_sec_02__table .table__sp-only {
display: none;
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_02__table table th, #gas-top .low_top_sec_02__table table td {
padding: 10px;
vertical-align: middle;
}
#gas-top .low_top_sec_02__table .tab-wrap_sp-only {
display: none;
}
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_02__table .table-bordered.pc-only {
display: none;
}
#gas-top .low_top_sec_02__table table th, #gas-top .low_top_sec_02__table table td {
padding: 10px;
vertical-align: middle;
font-size: 14px;
}
#gas-top .low_top_sec_02__table .tab-wrap_sp-only {
display: block;
}
}
#gas-top .low_top_sec_02 .table__sp-only {
display: none;
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_02 table th, #gas-top .low_top_sec_02 table td {
padding: 10px;
vertical-align: middle;
}
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_02 {
padding-bottom: 20px 0;
}
#gas-top .low_top_sec_02__inner {
padding: 30px 0 20px;
}
#gas-top .low_top_sec_02 .headline_1 {
margin-bottom: 10px;
}
#gas-top .low_top_sec_02 .table-bordered.pc-only {
display: none;
}
#gas-top .low_top_sec_02 .table__sp-only {
display: block;
}
#gas-top .low_top_sec_02 .table__sp-only th, #gas-top .low_top_sec_02 .table__sp-only td {
padding: 10px;
vertical-align: middle;
font-size: 14px;
font-weight: normal;
text-align: left;
}
#gas-top .low_top_sec_02 .table__sp-only thead td {
font-weight: bold !important;
text-align: center !important;
}
#gas-top .low_top_sec_02 .table__sp-only tbody th {
background-color: #eee !important;
color: #000 !important;
}
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_02 {
padding: 0;
}
#gas-top .low_top_sec_02 .headline_2 br {
display: none;
}
}
@media screen and (max-width: 960px) and (max-width: 590px) {
#gas-top .low_top_sec_02 .headline_2 br {
display: none;
}
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_02__text {
text-align: left;
}
}
#gas-top .low_top_sec_04 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas-top_03_bg.jpg);
background-size: cover;
}
#gas-top .low_top_sec_04 .headline_1 {
margin-top: 80px;
text-align: center;
}
#gas-top .low_top_sec_04 .headline_2 {
color: #002529;
margin-top: 40px;
text-align: center;
}
#gas-top .low_top_sec_04 .headline_2 br {
display: none;
}
#gas-top .low_top_sec_04__text {
margin-top: 40px;
line-height: 2em;
text-align: center;
}
#gas-top .low_top_sec_04__item {
margin-top: 40px;
}
#gas-top .low_top_sec_04__item li {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
align-items: flex-start;
}
#gas-top .low_top_sec_04__item li a {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
align-items: flex-start;
padding: 40px 0 20px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
#gas-top .low_top_sec_04__icon {
width: 100%;
}
#gas-top .low_top_sec_04__icon img {
width: 40%;
height: auto;
}
#gas-top .low_top_sec_04__logo {
width: 100%;
}
#gas-top .low_top_sec_04__logo img {
width: 70%;
height: auto;
}
#gas-top .low_top_sec_04__cath {
width: 100%;
padding: 20px;
font-size: 14px;
}
#gas-top .low_top_sec_04__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_04 .headline_2 {
margin-top: 20px;
}
#gas-top .low_top_sec_04 .headline_2 br {
display: block;
}
#gas-top .low_top_sec_04__text {
margin-top: 20px;
text-align: left;
}
#gas-top .low_top_sec_04__item li a {
padding: 30px 0;
width: 150px;
height: 150px;
}
#gas-top .low_top_sec_04__icon img {
width: 60px;
height: auto;
}
#gas-top .low_top_sec_04__logo img {
width: 100px;
height: auto;
}
#gas-top .low_top_sec_04__cath {
padding: 10px 0;
}
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_04 .headline_1 {
margin-top: 40px;
}
#gas-top .low_top_sec_04__item {
margin-top: 0;
}
#gas-top .low_top_sec_04__item li {
margin-top: 40px;
}
#gas-top .low_top_sec_04__item li a {
padding: 30px 0;
}
#gas-top .low_top_sec_04__cath {
padding: 10px 20px 0 20px;
}
#gas-top .low_top_sec_04__button {
padding: 0 20px;
}
}
#gas-top .low_top_sec_06 {
padding: 40px;
}
#gas-top .low_top_sec_06__inner {
padding: 80px 0;
background-color: #e6f9f4;
}
#gas-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#gas-top .low_top_sec_06__tag__content ol {
display: flex;
justify-content: space-between;
}
#gas-top .low_top_sec_06__tag__content li {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
padding: 0 10px;
width: 18%;
}
#gas-top .low_top_sec_06__tag__content li::after {
position: absolute;
right: -30px;
top: 30px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
#gas-top .low_top_sec_06__tag__content li:last-child::after {
display: none;
}
#gas-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
}
#gas-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#gas-top .low_top_sec_06__tag__content_01__content {
margin-top: 10px;
display: flex;
align-items: center;
}
#gas-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #008793;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#gas-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
@media screen and (max-width: 960px) {
#gas-top .low_top_sec_06 {
padding: 0;
}
#gas-top .low_top_sec_06 .tab-wrap {
display: block;
padding: 0;
}
#gas-top .low_top_sec_06 .tab + label {
width: 100%;
margin: 0;
height: auto;
line-height: 1.2em;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding: 10px 20px 10px 50px;
text-align: left;
}
#gas-top .low_top_sec_06 .tab + label span {
line-height: 1.3;
}
#gas-top .low_top_sec_06 .tab + label.tab1 {
margin-bottom: 10px;
}
#gas-top .low_top_sec_06 .tab + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
#gas-top .low_top_sec_06 .tab + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
#gas-top .low_top_sec_06 .tab:checked + label {
background-color: #333;
position: relative;
}
#gas-top .low_top_sec_06 .tab:checked + label::after {
content: none;
}
#gas-top .low_top_sec_06 .tab:checked + label span {
display: inline;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content li {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content li::after {
top: 30px !important;
right: -20px;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__icon {
height: 80px;
display: flex;
align-items: center;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__icon img {
width: 100%;
height: auto;
max-height: 80px;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content > div {
width: 100%;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__no {
text-align: center;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: none;
}
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_06 {
margin: 0;
}
#gas-top .low_top_sec_06__inner {
margin-top: 0;
padding: 30px 20px;
}
#gas-top .low_top_sec_06 .headline_1 {
margin-bottom: 15px;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content li {
justify-content: center;
align-items: flex-start;
margin-top: 50px;
padding: 0;
width: 100%;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content li::after {
top: 105% !important;
left: 50%;
margin: 0;
transform: translateX(-50%);
content: "\f078";
text-align: center;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap;
justify-content: center;
width: 100%;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__no {
width: 100%;
text-align: center;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text {
padding: 0;
width: 100%;
text-align: center;
}
#gas-top .low_top_sec_06 .low_top_sec_06__tag__content_01__content .low_top_sec_06__tag__content_01__text br {
display: block;
}
}
#gas-top .low_top_sec_07 {
padding: 60px 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#gas-top .low_top_sec_07_block {
margin: 50px 0;
}
#gas-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #04C48A;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#gas-top .low_top_sec_07 input {
display: none;
}
#gas-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#gas-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#gas-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#gas-top .low_top_sec_07 .answer {
overflow: hidden;
color: #04C48A;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#gas-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ p {
max-height: 300px;
transition: all 1s;
margin: 10px 0;
}
#gas-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#gas-top .low_top_sec_07 {
padding: 30px 0 60px;
}
#gas-top .low_top_sec_07 .low_top_sec_07_block {
margin: 35px 0;
}
#gas-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#gas-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#gas-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#gas-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#gas-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#gas-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#gas-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
}
#gas-top .low .for-members {
line-height: 0;
}
#gas-top .low .for-members .headline_4 {
line-height: 1.5;
}
.gas .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/headline_1_line.svg);
padding-bottom: 16px;
font-size: 24px;
font-weight: bold;
text-align: center;
line-height: 1.5em;
letter-spacing: 2px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: 100px auto;
background-position: center bottom;
}
#gas-ec .gas-ec-sec-01 {
padding-top: 0;
}
#gas-ec .gas-ec-sec-02 {
padding: 0 40px;
}
#gas-ec .gas-ec-sec-02 .inner {
background: #e6f9f4;
padding: 80px 0;
width: 100%;
}
#gas-ec .gas-ec-sec-02 .headline_1 br {
display: none;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 {
padding: 0;
}
#gas-ec .gas-ec-sec-02 .inner {
padding: 40px 0;
}
#gas-ec .gas-ec-sec-02 .headline_1 {
font-size: 22px;
}
#gas-ec .gas-ec-sec-02 .headline_1 br {
display: block;
}
}
#gas-ec .gas-ec-sec-02 .tel-container {
margin-top: 40px;
}
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap {
display: flex;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap {
flex-wrap: wrap;
}
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap span {
display: block;
text-align: center;
}
}
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .left {
background: #008793;
color: #fff;
padding: 10px 30px 7px 30px;
width: 30%;
font-size: 20px;
text-align: center;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .left {
width: 40%;
padding: 10px 20px 7px 20px;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .left {
width: 100%;
padding: 10px 20px 7px 20px;
font-size: 20px;
}
}
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .right {
background: #dedede;
padding: 10px 30px 7px 30px;
width: 70%;
font-size: 20px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .right {
width: 60%;
padding: 10px 20px 7px 20px;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .tel-container .title-wrap .right {
width: 100%;
padding: 10px 20px 7px 20px;
font-size: 16px;
}
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap {
border: 2px solid #008793;
background: #fff;
padding: 20px;
margin-top: 10px;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-title {
background: #f7f7f7;
color: #008793;
font-weight: bold;
padding: 8px 15px;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner {
display: flex;
align-items: center;
flex-wrap: wrap;
margin-top: 30px;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
padding-left: 50px;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num a {
color: #008793;
font-size: 45px !important;
font-weight: bold;
vertical-align: middle;
letter-spacing: 3px;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num a {
font-size: 35px !important;
}
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num img {
width: 44px;
height: 44px;
margin-right: 20px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
margin: 20px 0;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num a {
font-size: 30px;
letter-spacing: 0;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
padding-left: 0;
margin: 20px 0;
}
#gas-ec .gas-ec-sec-02 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num img {
width: 20px;
height: 20px;
margin-right: 10px;
}
}
#gas-ec .gas-ec-sec-02 .left {
width: 50%;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .left {
width: 100%;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .left {
width: 100%;
}
}
#gas-ec .gas-ec-sec-02 .right {
width: 50%;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .right {
width: 100%;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .right {
width: 100%;
}
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .d-flex {
flex-wrap: wrap;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-02 .d-flex {
flex-wrap: wrap;
}
}
#gas-ec .gas-ec-sec-02 .d-flex .left {
margin-right: 5px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .d-flex .left {
margin-right: 0;
}
}
#gas-ec .gas-ec-sec-02 .d-flex .right {
margin-left: 5px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-02 .d-flex .right {
margin-left: 0;
}
}
#gas-ec .gas-ec-sec-03 .inner {
background: #e6f9f4;
padding: 80px 0;
}
#gas-ec .gas-ec-sec-03 .tel-container {
margin-top: 40px;
}
#gas-ec .gas-ec-sec-03 .tel-container .title-wrap {
display: flex;
}
#gas-ec .gas-ec-sec-03 .tel-container .title-wrap .left {
background: #008793;
color: #fff;
padding: 10px 30px 7px 30px;
width: 100%;
text-align: center;
font-size: 20px;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .tel-container .title-wrap .left {
padding: 10px 10px 7px 10px;
text-align: left;
}
}
#gas-ec .gas-ec-sec-03 .tel-container .title-wrap .right {
background: #dedede;
padding: 10px 10px 7px 10px;
width: 80%;
font-size: 20px;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .tel-container .title-wrap .right {
width: 100%;
}
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap {
border: 2px solid #008793;
background: #fff;
padding: 20px;
margin-top: 10px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-title {
background: #f7f7f7;
color: #008793;
font-weight: bold;
padding: 8px 15px;
font-size: 18px;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-title {
font-weight: normal;
font-size: 16px;
padding: 10px;
}
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner {
display: flex;
align-items: center;
flex-wrap: wrap;
margin-top: 30px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
padding-left: 50px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num a {
color: #008793;
font-size: 45px;
font-weight: bold;
vertical-align: middle;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num a {
font-size: 35px;
}
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
margin: 20px 0;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num {
padding-left: 0;
margin: 20px 0;
}
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .tel-col-1-inner .tel-col-1-box .num img {
width: 44px;
height: 44px;
margin-right: 20px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .reception-time-wrap {
border-top: 1px solid #cecece;
margin-top: 10px;
padding-top: 20px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .reception-time-wrap .time {
font-size: 18px;
font-weight: bold;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .reception-time-wrap .note-list {
margin-top: 10px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .reception-time-wrap .note-list ul li {
font-size: 13px;
margin-bottom: 10px;
}
#gas-ec .gas-ec-sec-03 .tel-container .tel-col-1-wrap .reception-time-wrap .note-list ul li :last-child {
margin-bottom: 0;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .num a {
font-size: 30px !important;
padding-left: 0;
margin: 20px 0;
}
#gas-ec .gas-ec-sec-03 .num img {
width: 20px !important;
height: 20px !important;
margin-right: 10px !important;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 {
padding: 40px 0;
}
#gas-ec .gas-ec-sec-03 .headline_1 {
font-size: 20px;
}
}
#gas-ec .gas-ec-sec-03 .left {
width: 50%;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .left {
width: 100%;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .left {
width: 100%;
}
}
#gas-ec .gas-ec-sec-03 .right {
width: 50%;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .right {
width: 100%;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .right {
width: 100%;
}
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .d-flex {
flex-wrap: wrap;
}
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .d-flex {
flex-wrap: wrap;
}
}
#gas-ec .gas-ec-sec-03 .d-flex .left {
margin-right: 5px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .d-flex .left {
margin-right: 0;
}
}
#gas-ec .gas-ec-sec-03 .d-flex .right {
margin-left: 5px;
}
@media screen and (max-width: 960px) {
#gas-ec .gas-ec-sec-03 .d-flex .right {
margin-left: 0;
}
}
#gas-ec .gas-ec-sec-03 .low_top_sec_02__button {
margin-top: 80px;
}
@media screen and (max-width: 590px) {
#gas-ec .gas-ec-sec-03 .low_top_sec_02__button {
margin-top: 40px;
}
}
.gas-pp-sec-01 {
padding-top: 0;
}
.gas-pp-sec-02 {
padding: 0 40px;
}
.gas-pp-sec-02 .inner {
background: #e6f9f4;
padding: 80px 0;
width: 100%;
}
.gas-pp-sec-02 .pp-table__table {
margin-top: 40px;
display: flex;
justify-content: center;
align-items: center;
}
@media screen and (max-width: 590px) {
.gas-pp-sec-02 .pp-table__table {
margin-top: 10px;
}
}
.gas-pp-sec-02 .pp-table__table table {
width: 100%;
table-layout: fixed;
text-align: center;
}
.gas-pp-sec-02 .pp-table__table table th {
color: #fff;
background-color: #919191;
}
.gas-pp-sec-02 .pp-table__table table td {
background-color: #fff;
padding: 15px 30px;
}
.gas-pp-sec-02 .pp-table__table table td.price {
background-color: #c3ffef;
}
.gas-pp-sec-02 .pp-table__table .table-bordered {
border: 1px solid #707070;
}
.gas-pp-sec-02 .pp-table__table .table-bordered td, .gas-pp-sec-02 .pp-table__table .table-bordered th {
border: 1px solid #707070;
}
.gas-pp-sec-02 .pp-table__table .table-bordered th {
padding: 10px;
}
.gas-pp-sec-02 .pp-table__table .table__sp-only {
display: none;
}
@media screen and (max-width: 960px) {
.gas-pp-sec-02 .pp-table__table table th, .gas-pp-sec-02 .pp-table__table table td {
padding: 10px;
vertical-align: middle;
}
}
@media screen and (max-width: 590px) {
.gas-pp-sec-02 .pp-table__table .table-bordered.pc-only {
display: none;
}
.gas-pp-sec-02 .pp-table__table .table__sp-only {
display: block;
}
.gas-pp-sec-02 .pp-table__table .table__sp-only th, .gas-pp-sec-02 .pp-table__table .table__sp-only td {
padding: 10px;
vertical-align: middle;
font-size: 14px;
font-weight: normal;
text-align: left;
}
.gas-pp-sec-02 .pp-table__table .table__sp-only thead td {
font-weight: bold !important;
text-align: center !important;
}
.gas-pp-sec-02 .pp-table__table .table__sp-only tbody th {
background-color: #eee !important;
color: #000 !important;
}
}
.gas-pp-sec-02 .pp-button {
margin: 40px auto 0 auto;
}
@media screen and (max-width: 590px) {
.gas-pp-sec-02 {
padding: 40px 0 !important;
}
}
.gas-pp-sec-03 .headline_2 {
color: #005090;
font-size: 20px;
margin-top: 40px;
font-weight: bold;
text-align: center;
}
.gas-pp-sec-03 img {
width: 100%;
height: auto;
}
.gas-pp-sec-03 .pp-table__table {
margin-top: 40px;
}
.gas-pp-sec-03 .pp-table__table table th {
color: #fff;
background-color: #908f8f;
text-align: center;
padding: 20px;
}
.gas-pp-sec-03 .pp-table__table table td {
line-height: 2em;
background-color: #fff;
padding: 20px;
}
.gas-pp-sec-03 .pp-table__table table td:first-child {
text-align: center;
}
.gas-pp-sec-03 .pp-table__table table td.odd {
width: 20%;
}
.gas-pp-sec-03 .pp-table__table table td.odd:last-child {
width: 80%;
}
.gas-pp-sec-03 .pp-table__table table td.even {
width: 20%;
background-color: #f4f4f4;
}
.gas-pp-sec-03 .pp-table__table table td.even:last-child {
width: 80%;
}
.gas-pp-sec-03 .pp-table__table table td.price {
background-color: #c3ffef;
}
.gas-pp-sec-03 .pp-table__table .table-bordered {
border: 1px solid #707070;
}
.gas-pp-sec-03 .pp-table__table .table-bordered td, .gas-pp-sec-03 .pp-table__table .table-bordered th {
border: 1px solid #707070;
}
.gas-pp-sec-03 .pp-table__table_supp {
padding-top: 10px;
}
.gas-pp-sec-03 .pp-button {
margin: 40px auto 0 auto;
}
@media screen and (max-width: 960px) {
.gas-pp-sec-03 img {
margin: 10px 0;
padding: 0px;
}
.gas-pp-sec-03 .pp-table__table table th {
padding: 10px;
}
.gas-pp-sec-03 .pp-table__table table td {
padding: 10px;
}
.gas-pp-sec-03 .pp-table__table table tr:nth-child(n+2) td {
display: block;
width: 100%;
}
.gas-pp-sec-03 .pp-table__table table td.odd:last-child, .gas-pp-sec-03 .pp-table__table table td.even:last-child {
width: 100%;
}
.gas-pp-sec-03 .pp-table__table .table-bordered {
border: 1px solid #707070;
}
.gas-pp-sec-03 .pp-table__table .table-bordered td, .gas-pp-sec-03 .pp-table__table .table-bordered th {
border: 0;
border-right: 1px solid #707070;
border-bottom: 1px solid #707070;
}
}
@media screen and (max-width: 590px) {
.gas-pp-sec-03 {
padding: 0px !important;
}
.gas-pp-sec-03 .headline_1 {
font-size: 22px;
}
.gas-pp-sec-03 .headline_2 {
font-size: 16px;
margin: 10px 0 !important;
font-weight: normal;
text-align: left !important;
}
.gas-pp-sec-03 .headline_2 br {
display: none;
}
.gas-pp-sec-03 .gas-bg-color-01 {
padding: 0;
}
}
.gas-pp-sec-03 .inner .sp-content {
margin: 0 !important;
padding: 0px 10px !important;
}
#gas-top { }
#gas-top .price_acc {
padding-bottom: 60px;
}
#gas-top .price_acc-box {
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 30px;
padding: 20px;
}
#gas-top .price_acc-box input {
display: none;
}
#gas-top .price_acc-box label {
margin: auto;
color: #333333;
text-align: center;
font-size: 20px;
display: block !important;
position: relative;
font-weight: 500;
}
#gas-top .price_acc-box .price_acc_content {
overflow: hidden;
transition: max-height 0.3s;
max-height: 0px;
}
#gas-top .price_acc-box input[type=checkbox]:checked ~ label ~ .price_acc_content {
max-height: 1500px;
transition: all 1s;
}
#gas-top .price_acc-box input[type=checkbox]:checked ~ label::after {
transform: translateX(-50%) rotate(315deg);
-webkit-transform: translateX(-50%) rotate(315deg);
transition: all 0.3s;
}
#gas-top .price_acc-box label::after {
content: "";
position: absolute;
bottom: -2.15rem;
right: 0;
top: 30%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
-webkit-transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#gas-top .price_acc {
padding-bottom: 20px;
}
#gas-top .price_acc-box {
margin: 10px 0;
padding: 5px 0px 5px;
}
#gas-top .price_acc .container {
margin: 0px;
width: auto;
}
#gas-top .price_acc-box::before {
font-size: 20px;
left: -25;
top: 16;
}
#gas-top .price_acc-box .price_acc_content::before {
font-size: 20px;
left: -25;
top: 16;
}
#gas-top .price_acc-box input[type=checkbox]:checked ~ label ~ .price_acc_content {
max-height: 2300px;
padding-bottom: 20px;
}
#gas-top .price_acc-box label {
font-size: 16px;
margin-bottom: 0px !important;
padding: 10px 20px 10px 25px;
}
#gas-top .price_acc-box label::before {
font-size: 24px;
left: 0px;
top: 0;
}
#gas-top .price_acc-box label::after {
width: 0.7rem;
height: 0.7rem;
right: 20px;
}
#gas-top .price_acc-box .price_acc_content {
font-size: 14px;
padding: 0;
}
}
#gas-ca .gas-ca-sec-01 {
padding-top: 0;
}
#gas-ca .gas-ca-sec-02 {
padding: 0;
margin: 0 auto;
}
#gas-ca .gas-ca-sec-02 .inner {
padding: 80px 0;
width: 100%;
background-color: #e6f9f4;
}
@media screen and (max-width: 590px) {
#gas-ca .gas-ca-sec-02 .inner {
padding: 40px 0;
}
}
#gas-ca .gas-ca-sec-02 .calender__item {
margin-top: 40px;
display: flex;
justify-content: space-between;
align-items: center;
}
#gas-ca .gas-ca-sec-02 .calender__year {
margin-right: 60px;
padding-top: 3px;
padding-left: 10px;
font-size: 20px;
color: #004046;
font-weight: bold;
border-left: 5px solid #004046;
}
#gas-ca .gas-ca-sec-02 .calender__list {
flex: 1;
display: flex;
}
#gas-ca .gas-ca-sec-02 .calender__list li {
width: 8.3333%;
text-align: center;
}
#gas-ca .gas-ca-sec-02 .calender__list li a {
display: block;
color: #2d77c1;
font-weight: bold;
text-decoration: underline;
}
#gas-ca .gas-ca-sec-02 .calender__list li a.no-data {
color: #484848;
pointer-events: none;
text-decoration: none;
}
#gas-ca .gas-ca-sec-02 .calender__list li:not(:last-child) {
margin-right: 0;
border-right: 0;
}
@media screen and (max-width: 960px) {
#gas-ca .gas-ca-sec-02 .calender__item {
flex-wrap: wrap;
}
#gas-ca .gas-ca-sec-02 .calender__year {
margin-right: 0;
width: 100%;
}
#gas-ca .gas-ca-sec-02 .calender__list {
flex-wrap: wrap;
}
#gas-ca .gas-ca-sec-02 .calender__list li {
margin-top: 20px;
width: 16.666%;
text-align: center;
}
#gas-ca .gas-ca-sec-02 .calender__list li a {
display: block;
color: #2d77c1;
font-weight: bold;
}
#gas-ca .gas-ca-sec-02 .calender__list li:not(:last-child) {
margin-right: 0;
}
}
@media screen and (max-width: 590px) {
#gas-ca .gas-ca-sec-02 .calender__item {
flex-wrap: wrap;
}
#gas-ca .gas-ca-sec-02 .calender__year {
margin-right: 0;
width: 100%;
}
#gas-ca .gas-ca-sec-02 .calender__list {
margin-top: 10px;
flex-wrap: wrap;
}
#gas-ca .gas-ca-sec-02 .calender__list li {
width: 25%;
text-align: left;
}
#gas-ca .gas-ca-sec-02 .calender__list li a {
padding: 10px 0 5px 5px;
}
#gas-ca .gas-ca-sec-02 .calender__list li:not(:last-child) {
margin-right: 0;
border-bottom: 1px solid #adb8b5;
}
#gas-ca .gas-ca-sec-02 .calender__list li:last-child {
margin-right: 0;
border-bottom: 1px solid #adb8b5;
}
}
#gas-ca .gas-ca-sec-03 .headline_2 {
color: #005090;
font-size: 20px;
margin-top: 20px;
font-weight: 600;
line-height: 34px;
text-align: center;
}
#gas-ca .gas-ca-sec-03__inner {
margin-top: 80px;
padding: 40px 80px;
}
#gas-ca .gas-ca-sec-03__inner_title {
text-align: center;
font-size: 20px;
font-weight: bold;
}
#gas-ca .gas-ca-sec-03__inner img {
margin-top: 40px;
width: 100%;
height: auto;
}
#gas-ca .gas-ca-sec-03__inner p {
margin-top: 10px;
text-align: right;
}
@media screen and (max-width: 960px) {
#gas-ca .gas-ca-sec-03 .headline_2 {
font-size: 16px;
font-weight: normal;
}
#gas-ca .gas-ca-sec-03__inner {
margin-top: 20px;
padding: 40px 20px;
}
#gas-ca .gas-ca-sec-03__inner img {
margin-top: 20px;
}
#gas-ca .gas-ca-sec-03__inner p {
font-size: 14px;
text-align: left;
}
}
@media screen and (max-width: 590px) {
#gas-ca .gas-ca-sec-03 .headline_2 {
font-size: 16px;
font-weight: normal;
text-align: left !important;
}
#gas-ca .gas-ca-sec-03__inner {
margin-top: 20px;
padding: 40px 20px;
}
#gas-ca .gas-ca-sec-03__inner img {
margin-top: 20px;
}
#gas-ca .gas-ca-sec-03__inner p {
font-size: 14px;
text-align: left;
}
}
#gas-ca .gas-ca-sec-04 {
margin-top: 80px;
background: linear-gradient(90deg, #e6fbf6, #e6eef4);
}
#gas-ca .gas-ca-sec-04 .headline_1 br {
display: none;
}
#gas-ca .gas-ca-sec-04 .headline_2 {
color: #005090;
font-size: 20px;
margin-top: 40px;
font-weight: 600;
line-height: 34px;
text-align: center;
}
#gas-ca .gas-ca-sec-04 img {
margin-top: 20px;
width: 100%;
height: auto;
}
@media screen and (max-width: 960px) {
#gas-ca .gas-ca-sec-04 .headline_1 {
font-size: 22px;
}
#gas-ca .gas-ca-sec-04 .headline_2 {
margin-top: 20px;
font-size: 16px;
font-weight: normal;
}
}
@media screen and (max-width: 590px) {
#gas-ca .gas-ca-sec-04 {
padding: 30px 0;
}
#gas-ca .gas-ca-sec-04 .headline_1 {
font-size: 20px;
}
#gas-ca .gas-ca-sec-04 .headline_1 br {
display: block;
}
#gas-ca .gas-ca-sec-04 .headline_2 {
text-align: left;
}
#gas-ca .gas-ca-sec-04 .headline_2 br {
display: none;
}
}
.gas-flow {
padding: 0 !important;
}
.gas-flow__inner {
padding: 80px;
background-color: rgba(0, 176, 137, 0.2);
}
.gas-flow__item {
padding: 40px;
background-color: #fff;
width: 75%;
margin: 0 auto;
}
@media screen and (max-width: 960px) {
.gas-flow__item {
width: 100%;
}
}
.gas-flow__item .headline_7 {
margin: 0 auto;
text-align: center;
}
.gas-flow__item_list {
margin-top: 40px;
}
.gas-flow__item_list li {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
flex-wrap: wrap;
}
@media screen and (max-width: 960px) {
.gas-flow__item_list li {
flex-wrap: nowrap;
}
}
.gas-flow__item_list__img {
width: 150px;
}
.gas-flow__item_list__img img {
width: 100%;
height: auto;
}
.gas-flow__item_list__text {
margin-top: 20px;
width: 100%;
text-align: center;
color: #002529;
font-weight: bold;
}
.gas-flow__item_list__text br {
display: none;
}
.gas-flow__item p {
margin-top: 40px;
font-weight: bold;
}
.gas-flow__item .kome {
margin-top: 10px;
}
@media screen and (max-width: 960px) {
.gas-flow__item_list {
margin-top: 40px;
}
.gas-flow__item_list__img {
width: 120px;
}
.gas-flow__item_list__text {
margin-top: 20px;
width: 100%;
text-align: left;
color: #002529;
font-weight: bold;
}
.gas-flow__item_list__text br {
display: block;
}
}
.gas-flow__tag__wrapper {
padding: 0;
}
.gas-flow__tag__wrapper .tab-wrap {
background-color: transparent;
}
@media screen and (max-width: 960px) {
.gas-flow__tag__wrapper .tab-wrap {
display: block;
}
.gas-flow__tag__wrapper .tab-wrap .tab + label {
width: 100%;
margin: 0;
height: auto;
line-height: 1.2em;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding: 10px 20px 10px 50px;
text-align: left;
}
.gas-flow__tag__wrapper .tab-wrap .tab + label span {
line-height: 1.3;
}
.gas-flow__tag__wrapper .tab-wrap:checked + label::after {
content: none;
}
}
.gas-flow__tag__wrapper .tab__content {
margin-top: 20px;
padding: 20px;
border: 2px solid #d9d3c9;
background-color: #fff;
}
.gas-flow__tag__wrapper .tab__content > ol > li {
position: relative;
display: flex;
margin-bottom: 80px;
}
.gas-flow__tag__wrapper .tab__content > ol > li::after {
content: "";
margin: 0 0 0 -20px;
padding: 0;
width: 40px;
height: 40px;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
bottom: -50px;
left: 50%;
}
.gas-flow__tag__wrapper .tab__content > ol > li:last-child::after {
display: none;
margin-bottom: 0;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon {
width: 100px;
height: auto;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon img {
width: 100%;
height: auto;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__no {
font-size: 34px;
font-weight: bold;
color: #008793;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #008793;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__text span {
display: block;
font-weight: bold;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__text Ul {
margin-top: 20px;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__text li:before {
margin-right: 5px;
font-family: "Font Awesome 5 Free";
content: "\f111";
font-weight: 900;
font-size: 12px;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01 .komg, .gas-flow__tag__wrapper .gas-flow__tag__content_01__button {
margin-top: 20px;
width: 100%;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01 .komg .button, .gas-flow__tag__wrapper .gas-flow__tag__content_01__button .button {
width: 50%;
}
@media screen and (max-width: 960px) {
.gas-flow__tag__wrapper .gas-flow__tag__content_01__no {
margin-right: 5px;
}
}
.gas-flow__button {
margin: 80px auto 0 auto;
}
.gas-flow__button li:last-child {
margin-top: 20px;
}
.gas-flow__button .button.grade.more.gas {
background: linear-gradient(90deg, #FFB036, #FF4C40);
}
@media screen and (max-width: 960px) {
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon {
display: none;
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon img {
width: 120px;
height: auto;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01 .komg .button, .gas-flow__tag__wrapper .gas-flow__tag__content_01__button .button {
width: 100%;
}
.gas-flow__button {
margin: 20px auto 0 auto;
}
}
@media screen and (max-width: 590px) {
.gas-flow__inner {
margin-top: 20px;
padding: 20px;
}
.gas-flow__item {
padding: 15px;
}
.gas-flow__item_list {
margin-top: 0;
}
.gas-flow__item_list li {
margin-top: 40px;
width: 50%;
}
.gas-flow__item p {
font-weight: normal;
}
.gas-flow__item .kome {
padding: 0;
text-indent: 0;
}
.gas-flow__tag__wrapper {
margin-top: 40px;
padding: 0;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content {
margin-top: 20px;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content > ol > li {
flex-wrap: wrap;
margin-bottom: 0;
padding: 0;
}
.gas-flow__tag__wrapper li:first-child .gas-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_nagare_1.svg) no-repeat right center/auto 75%;
}
.gas-flow__tag__wrapper li:nth-child(2) .gas-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_nagare_2.svg) no-repeat right center/auto 75%;
}
.gas-flow__tag__wrapper li:nth-child(3) .gas-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_nagare_3.svg) no-repeat right center/auto 75%;
}
.gas-flow__tag__wrapper li:nth-child(4) .gas-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_nagare_4.svg) no-repeat right center/auto 75%;
}
.gas-flow__tag__wrapper li:nth-child(5) .gas-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_top_nagare_5.svg) no-repeat right center/auto 75%;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
display: none;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__icon img {
width: 70px;
height: auto;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__content {
justify-content: center;
flex-wrap: wrap;
margin: 0;
width: 100%;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__no {
font-size: 26px;
margin-right: 20px;
text-align: center;
display: flex;
width: 3%;
align-items: center;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01__title {
text-align: center;
margin: 0;
width: 90%;
padding-right: 60px;
justify-content: flex-start;
}
.gas-flow__tag__wrapper .gas-flow__tag__content_01 .komg .button, .gas-flow__tag__wrapper .gas-flow__tag__content_01__button .button {
width: 100%;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content {
padding: 0 !important;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content ol {
padding: 0 !important;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content ol li {
width: 100% !important;
padding: 0 !important;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only__content .gas-flow__tag__content_01__text {
margin: 0 !important;
width: 100% !important;
padding: 0 !important;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .gas-flow__tag__content_01__text {
padding-left: 0;
margin-bottom: 10px;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab + label {
display: flex;
width: 100%;
margin: 0 1%;
line-height: 1.5;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding-left: 50px;
padding-right: 20px;
text-align: left;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab + label span {
line-height: 1.3;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab + label.tab1 {
margin-bottom: 10px;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label {
background-color: #333;
position: relative;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label::after {
content: none;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label span {
display: inline;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab-wrap_sp-only__content {
padding-top: 20px !important;
padding-right: 0;
}
.gas-flow__tag__wrapper .tab-wrap_sp-only .tab-wrap_sp-only__content > ol > li {
display: block;
}
.gas-flow__button {
margin: 20px auto 0 auto;
}
}
.headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/headline_1_line.svg);
}
.button.grade.hikari {
background: linear-gradient(90deg, #FFB036, #FF4C40);
}
#hikari-top .headline_2 {
color: #746216;
}
#hikari-top .headline_4 {
font-family: "Trebuchet MS", "Hind", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#hikari-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_top_back.jpg);
background-attachment: fixed;
position: relative;
}
#hikari-top .low__kv__back .kv-ttl_pc {
position: absolute;
bottom: 45px;
right: 75px;
}
#hikari-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 700px;
}
#hikari-top .low__kv__back .kv-ttl_sp {
width: 80%;
top: 0px;
right: 35px;
object-fit: contain;
position: absolute;
bottom: -20px;
}
#hikari-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#hikari-top .low__kv__back {
height: 300px;
background-position: 40% -300px;
}
#hikari-top .low__kv__back .kv-ttl_pc {
bottom: 20px;
}
#hikari-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low__kv {
position: relative;
height: 200px;
}
#hikari-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#hikari-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 310px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 50% 0%;
background-size: 150%;
}
}
#hikari-top .low_top_sec_01__item {
display: flex;
justify-content: center;
}
#hikari-top .low_top_sec_01__item li {
padding: 0 20px;
width: 25%;
}
@media screen and (max-width: 960px) {
#hikari-top .low_top_sec_01__item li {
width: 33.3%;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_01 {
background-color: #fff;
padding: 40px 0;
}
#hikari-top .low_top_sec_01__item {
padding: 0 15px;
text-align: center;
}
#hikari-top .low_top_sec_01__item li {
margin-bottom: 0;
padding: 0 5px;
}
#hikari-top .low_top_sec_01__item li a {
padding: 25px 5px;
}
#hikari-top .low_top_sec_01__item_icon img {
width: 50%;
}
#hikari-top .low_top_sec_01__item_text {
margin-top: 15px;
font-size: 13px;
}
}
#hikari-top .low_top_sec_01__item a:hover {
background-color: rgba(240, 145, 56, 0.5);
}
#hikari-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#hikari-top .low_top_sec_01__item_text {
color: #551d00;
}
#hikari-top .low_top_sec_01 .note {
margin-top: 20px;
}
#hikari-top .hikari-top_sec_02__inner {
position: relative;
margin-top: 40px;
padding: 60px 0 100px 0;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_top_maruttohikari.png);
background-size: 60% 90%;
background-position: left center;
}
@media screen and (max-width: 590px) {
#hikari-top .hikari-top_sec_02__inner {
padding-bottom: 40px;
}
}
#hikari-top .hikari-top_sec_02__img img {
position: absolute;
top: 0;
left: 10%;
width: 45%;
height: 100%;
object-fit: cover;
}
#hikari-top .hikari-top_sec_02 .headline_2 {
color: #746216;
}
#hikari-top .hikari-top_sec_02__text {
display: flex;
align-items: center;
justify-content: flex-end;
}
#hikari-top .hikari-top_sec_02__box {
width: 50%;
padding: 40px 0 40px 40px;
background-color: #fff;
}
#hikari-top .hikari-top_sec_02 p {
margin-top: 20px;
line-height: 2em;
}
#hikari-top .hikari-top_sec_02 .kome {
margin-top: 10px;
}
@media screen and (max-width: 960px) {
#hikari-top .hikari-top_sec_02__inner {
margin-top: 0;
padding: 20px;
background-image: none;
}
#hikari-top .hikari-top_sec_02__img img {
position: static;
width: 100%;
height: auto;
}
#hikari-top .hikari-top_sec_02__text {
align-items: flex-start;
justify-content: center;
}
#hikari-top .hikari-top_sec_02__box {
width: 100%;
padding: 20px;
}
}
@media screen and (max-width: 590px) {
#hikari-top .hikari-top_sec_02__box {
margin: 0;
padding: 10px 0;
}
#hikari-top .hikari-top_sec_02__text {
padding: 5px;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03 {
background-color: #fff;
}
}
#hikari-top .low_top_sec_03__inner {
background: #FFFBE6;
padding: 60px 0;
}
#hikari-top .low_top_sec_03__inner_intro {
text-align: center;
}
#hikari-top .low_top_sec_03__inner_intro h5 {
font-weight: 300;
font-size: 34px;
color: #FF8B40;
margin: 30px 0;
}
#hikari-top .low_top_sec_03__inner_intro p {
font-size: 18px;
line-height: 32px;
text-align: center;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner_intro h5 {
font-size: 20px;
margin: 20px 0;
}
#hikari-top .low_top_sec_03__inner_intro p {
line-height: inherit;
font-size: 16px;
text-align: left;
}
#hikari-top .low_top_sec_03__inner_intro p br {
display: none;
}
}
#hikari-top .low_top_sec_03__inner .price_acc {
padding-top: 30px;       }
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc {
padding: 0;
}
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box {
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 30px;
padding: 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input {
display: none;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > label {
text-align: center;
font-size: 20px;
position: relative;
font-weight: 500;
display: block !important;
margin: auto;
position: relative;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box .price_acc_btn::after {
content: "";
position: absolute;
bottom: -2.15rem;
right: 0px;
top: 30%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid rgb(112, 112, 112);
border-right: 2px solid rgb(112, 112, 112);
transition: all 0.3s ease 0s;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > .price_acc_content {
overflow: hidden;
transition: max-height 0.3s;
max-height: 0px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-pc {
display: block;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-pc {
display: none;
}
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-sp {
display: none;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-sp {
display: block;
padding: 5px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-sp .slide_title {
display: block;
margin: auto;
text-align: center;
font-size: 16px;
font-weight: 500;
color: white;
background-color: #FF8B40;
border-radius: 5px 5px 0px 0px;
padding: 15px 0;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-sp .tab-sp-back {
background: #fff3eb;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input:checked ~ .price_acc_content .tab-sp .swiper-pagination-bullet-active {
background: #484848 !important;
}
}
#hikari-top .low_top_sec_03__inner .price_acc .tab:checked + label::after {
position: absolute;
bottom: -14px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #333;
content: "";
}
@media screen and (max-width: 960px) {
#hikari-top .low_top_sec_03__inner .price_acc .tab:checked + label::after {
content: none;
}
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input[type=checkbox]:checked ~ label::after {
transform: translateX(-50%) rotate(315deg);
-webkit-transform: translateX(-50%) rotate(315deg);
transition: all 0.3s;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > label::after {
content: "";
position: absolute;
bottom: 50%;
right: 0;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
-webkit-transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box {
margin: 10px 0;
padding: 10px 0px 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc > .container {
margin: 0px;
width: auto;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box::before {
font-size: 20px;
left: -25;
top: 16;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
margin-top: 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > .price_acc_content::before {
left: -25;
top: 16;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > input[type=checkbox]:checked ~ label ~ .price_acc_content {
padding-bottom: 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 10px 0 10px 0;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > label::before {
font-size: 24px;
left: 0px;
top: 0;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > label::after {
width: 0.7rem;
height: 0.7rem;
right: 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc .price_acc-box > .price_acc_content {
font-size: 14px;
padding: 0;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec {
text-align: center;
padding-bottom: 0;
padding: 20px 0 50px;
background: #fff3eb;
margin-top: 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .sec_inner {
margin: 0;
padding: 0;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__ttl-capt {
font-size: 16px;
text-align: center;
font-weight: bold;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: #fff;
height: 90%;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner {
display: flex;
align-items: center;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl {
text-align: left;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl .pp__box__title {
font-size: 18px !important;
text-align: center;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl .pp__box__title span {
display: block;
text-align: center;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__points {
max-height: 100px;
background-color: #fff;
max-width: 97%;
font-size: 13px;
margin: 40px auto 0;
padding: 0;
list-style-type: none;
text-align: left;
line-height: 1.75;
left: 0;
overflow-x: visible;
overflow-y: scroll;
border: solid 1px #bcbcbc;
font-feature-settings: "palt" 1; font-feature-settings: "palt" 1;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__points {
margin: 10px auto 0 !important;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__points li {
text-indent: -1rem;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc .pp__box__price .tax {
display: block;
font-size: 14px;
}
#hikari-top .low_top_sec_03__inner .price_acc .pp__ttl-capt {
margin-bottom: 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec {
box-sizing: border-box;
padding: 20px 0;
margin-top: 0;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box {
padding: 10px;
box-sizing: border-box;
margin: 5px 5px 0;
height: auto;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__img {
width: 20%;
margin: 0;
display: inline;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__price {
padding: 5px;
margin-top: 10px;
margin-bottom: 10px;
box-sizing: border-box;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__price span.figures {
font-size: 25px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__title {
width: 70%;
display: inline;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__title span {
display: inline;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__title br {
display: none;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-pp_sec .pp__box__inner__ttl {
text-align: center;
display: inline;
width: 70%;
margin: auto 0;
}
#hikari-top .low_top_sec_03__inner .price_acc .pp__box__inner__ttl__capt {
font-size: 14px;
display: block;
margin: auto;
}
#hikari-top .low_top_sec_03__inner .price_acc .swiper-pagination-bullets {
bottom: 0;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 {
text-align: center;
padding-top: 40px;
background: none;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 h7 {
color: #FF8B40;
font-size: 24px;
text-align: center;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 h7 {
text-align: center;
font-size: 15px;
padding-top: 0px;
background: none;
font-weight: 500;
color: #333333;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2 {
margin-top: 40px;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2 {
flex-wrap: wrap;
margin-top: 10px;
padding: 0;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner {
background: #fff;
width: 48%;
display: flex;
flex-wrap: wrap;
align-content: space-between;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner > div {
width: 100%;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner {
width: 100%;
border: solid 2px #ff8b40;
box-sizing: border-box;
border-radius: 5px;
margin: 0 0 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner img {
width: 70%;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl {
background-color: #FF8B40;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
position: relative;
font-size: 22px;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
height: 70px;
}
@media screen and (max-width: 960px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
font-size: 16px;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
height: 50px;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl-1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_plan_mansion_w.svg);
padding-left: 20px;
background-repeat: no-repeat;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl-2 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_plan_family_w.svg);
background-position: 20% 50%;
background-repeat: no-repeat;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__graph {
margin: 20px 30px;
padding-bottom: 20px;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .swiper-pagination-bullets {
bottom: 0;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box {
padding: 10px 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl .pp__box__title {
font-size: 18px;
height: 60px;
text-align: center;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl-1::before {
top: 38px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-02 .pp__box-2__inner__ttl-2::before {
top: 38px;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 {
text-align: center;
padding: 30px 0 50px;
background: #fff3eb;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 {
padding: 20px 0 15px;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 h8 {
font-size: 24px;
font-weight: 500;
text-align: center;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 h8 {
text-align: center;
padding-top: 0px;
background: none;
font-size: 18px;
font-weight: 500;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .container {
padding: 0;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__ttl-capt {
font-weight: bold;
padding-top: 10px;
text-align: center;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box {
padding: 10px;
box-sizing: border-box;
width: 90%;
margin: 5px;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner {
display: flex;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__title {
font-size: 16px !important;
text-align: center;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl .pp__box__title span {
font-size: 20px;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl .pp__box__title span {
display: block;
text-align: center;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl__capt {
font-size: 11px;
text-align: center;
display: block;
margin: auto;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__points {
max-height: 100px;
background-color: #fff;
max-width: 97%;
font-size: 13px;
margin: 40px auto 0;
padding: 0;
list-style-type: none;
text-align: left;
line-height: 1.75;
left: 0;
overflow-x: visible;
overflow-y: scroll;
border: solid 1px #bcbcbc;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__points {
margin: 40px auto 0;
width: 88%;
box-sizing: border-box;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__points li {
text-indent: -1rem;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box {
padding: 10px 20px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box h4 {
font-size: 18px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__title {
font-size: 22px !important;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__title {
font-size: 18px !important;
text-align: left;
margin: auto;
display: inline-block;
width: 70%;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__title span {
display: block;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__inner__ttl__capt {
margin: auto;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__img {
width: 70px;
height: auto;
margin: 0 10px;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__img img {
width: 100% !important;
height: auto;
margin: 0 !important;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__img {
display: inline-block;
width: 30%;
height: auto;
margin: 0;
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .pp__box__img img {
width: 40px !important;
}
}
#hikari-top .low_top_sec_03__inner .price_acc #hikari-wrap-03 .swiper-pagination-bullets {
bottom: 100px;
left: 0;
width: 100%;
}
#hikari-top .low_top_sec_03__inner {
background: #FFFBE6;
padding: 60px 0;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__inner {
padding: 20px 0;
}
}
#hikari-top .low_top_sec_03__item {
display: flex;
align-items: flex-end;
margin-top: 40px;
}
#hikari-top .low_top_sec_03 .headline_2 {
font-size: 30px;
}
#hikari-top .low_top_sec_03 .headline_2 br {
display: none;
}
#hikari-top .low_top_sec_03__text {
margin-top: 40px;
line-height: 2em;
}
#hikari-top .low_top_sec_03__button {
margin-top: 20px;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_03__item {
margin-top: 20px;
}
#hikari-top .low_top_sec_03__item__wrapper {
padding: 0;
}
#hikari-top .low_top_sec_03 .headline_2 {
margin-top: 40px;
}
#hikari-top .low_top_sec_03 .headline_2 br {
display: block;
}
#hikari-top .low_top_sec_03__text {
margin-top: 20px;
}
#hikari-top .low_top_sec_03__button {
margin-top: 20px;
}
}
.low_top_sec_03__sp-only {
display: none;
}
@media screen and (max-width: 960px) {
.low_top_sec_03__pc-only {
display: none;
}
.low_top_sec_03__sp-only {
display: flex;
justify-content: center;
margin-top: 20px;
}
.low_top_sec_03__sp-only th,
.low_top_sec_03__sp-only td {
display: block;
padding: 10px;
width: 100%;
text-align: center;
background-color: #fff;
border-top: 1px solid #000;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
}
.low_top_sec_03__sp-only thead th {
background: #FF8B40;
color: #fff;
}
.low_top_sec_03__sp-only thead th img {
width: 30px;
height: auto;
}
.low_top_sec_03__sp-only tbody th {
display: flex;
justify-content: center;
align-items: center;
color: #fff;
background: #959595;
}
.low_top_sec_03__sp-only tbody th.hikari {
color: #FFD92C;
}
.low_top_sec_03__sp-only td.price {
color: #FF8B40;
font-size: 30px;
font-weight: bold;
}
.low_top_sec_03__sp-only td.price small {
font-size: 18px;
}
.low_top_sec_03__sp-only td.price .price_tax {
font-size: 16px;
}
.low_top_sec_03__sp-only td.price div {
font-size: 16px;
color: #000;
}
.low_top_sec_03__sp-only td ul {
width: 100%;
display: table;
}
.low_top_sec_03__sp-only td ul li {
background: #E8E8E8;
display: table-cell;
vertical-align: middle;
padding: 10px 0;
}
.low_top_sec_03__sp-only td ul li .txt13 {
font-size: 13px;
}
.low_top_sec_03__sp-only td ul li .txt14 {
font-size: 14px;
}
.low_top_sec_03__sp-only td ul li .txt16 {
font-size: 16px;
}
.low_top_sec_03__sp-only td ul li .txt20 {
font-size: 20px;
}
.low_top_sec_03__sp-only td ul li .txt24 {
font-size: 24px;
}
.low_top_sec_03__sp-only td ul li .txt28 {
font-size: 28px;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_03 {
padding: 40px 0 20px;
}
.low_top_sec_03_intro h5 {
font-size: 20px;
}
.low_top_sec_03_intro p {
font-size: 14px;
text-align: left;
line-height: 25px;
}
.low_top_sec_03 .tbl-price-index {
margin: 20px 0 30px;
width: 100%;
}
.low_top_sec_03 .tbl-price-index .thead th {
font-size: 12px;
}
.low_top_sec_03 .tbl-price-index .thead th img {
width: 15px;
padding-bottom: 5px;
}
.low_top_sec_03 .tbl-price-index tr td {
padding: 0px !important;
}
.low_top_sec_03 .tbl-price-index tr td .price {
font-size: 18px;
}
.low_top_sec_03 .tbl-price-index tr td .price_tax {
font-size: 12px;
}
.low_top_sec_03 .tbl-price-index tr td small {
font-size: 12px;
}
.low_top_sec_03 .tbl-price-index__competitors .txt20 {
font-size: 18px !important;
}
.low_top_sec_03 .tbl-price-index__competitors .txt14 {
font-size: 12px !important;
}
.low_top_sec_03 .tbl-price-index__competitors .txt20 {
font-size: 16px !important;
}
.low_top_sec_03 .tbl-price-index__competitors .txt24 {
font-size: 16px !important;
}
.low_top_sec_03 .tbl-price-index__competitors .txt24 br {
display: none;
}
.low_top_sec_03 .tbl-price-index__competitors .txt15 {
font-size: 12px !important;
}
}
#hikari-top .low_top_sec_04 {
padding: 80px 20px;
background-color: #fff;
}
#hikari-top .low_top_sec_04 .headline_1 {
margin-bottom: 40px;
text-align: center;
}
#hikari-top .low_top_sec_04_inner_text {
margin: 30px 0;
}
#hikari-top .low_top_sec_04 .pd40 {
padding-bottom: 40px;
}
#hikari-top .low_top_sec_04 img {
margin-top: 80px;
width: 100%;
height: auto;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_04 img {
margin-top: 0;
}
}
#hikari-top .low_top_sec_04 p.txt01 {
font-size: 16px;
line-height: 2em;
color: #333;
padding-right: 20px;
}
#hikari-top .low_top_sec_04 p.txt02 {
font-size: 13px;
line-height: 23px;
color: #707070;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_04 {
padding: 40px 0;
}
#hikari-top .low_top_sec_04 .headline_1 {
margin-bottom: 0;
}
#hikari-top .low_top_sec_04 .headline_2 {
margin-top: 20px;
font-size: 20px;
}
#hikari-top .low_top_sec_04 .headline_2 br {
display: none;
}
}
#hikari-top .low_hikari_sec_05 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/img_03.jpg);
background-size: cover;
}
#hikari-top .low_hikari_sec_05 .headline_1 {
margin-top: 80px;
text-align: center;
}
#hikari-top .low_hikari_sec_05 .headline_2 {
margin-top: 40px;
text-align: center;
}
#hikari-top .low_hikari_sec_05 .headline_2 br {
display: none;
}
#hikari-top .low_hikari_sec_05__text {
margin-top: 40px;
line-height: 2em;
text-align: center;
}
@media screen and (max-width: 590px) {
#hikari-top .low_hikari_sec_05__text {
text-align: left;
}
}
#hikari-top .low_hikari_sec_05__item {
margin-top: 40px;
}
#hikari-top .low_hikari_sec_05__item li {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
@media screen and (max-width: 590px) {
#hikari-top .low_hikari_sec_05__item li {
flex-direction: row;
justify-content: center;
flex-wrap: wrap;
}
}
#hikari-top .low_hikari_sec_05__item li a {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 50px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
#hikari-top .low_hikari_sec_05__icon {
width: 100%;
}
#hikari-top .low_hikari_sec_05__icon img {
width: 40%;
height: auto;
}
#hikari-top .low_hikari_sec_05__logo {
width: 100%;
}
#hikari-top .low_hikari_sec_05__logo img {
width: 70%;
height: auto;
}
#hikari-top .low_hikari_sec_05__cath {
width: 100%;
padding: 20px;
font-size: 14px;
}
#hikari-top .low_hikari_sec_05__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
#hikari-top .low_hikari_sec_05__item li a {
width: 150px;
height: 150px;
padding: 30px 0;
margin: 0 auto;
}
#hikari-top .low_hikari_sec_05__icon img {
width: 60px;
height: auto;
}
#hikari-top .low_hikari_sec_05__logo img {
width: 100px;
height: auto;
}
#hikari-top .low_hikari_sec_05__cath {
padding: 10px 0;
}
#hikari-top .low_top_sec_06__tag__content_01__content {
margin: 0 auto;
width: 150px;
justify-content: center;
}
#hikari-top .low_hikari_sec_05__button {
padding: 0 20px;
}
#hikari-top .low_hikari_sec_05__button .button {
height: 60px !important;
}
}
@media screen and (max-width: 590px) {
#hikari-top .low_hikari_sec_05 .headline_1 {
margin-top: 40px;
}
#hikari-top .low_hikari_sec_05 .headline_2 {
margin-top: 20px;
}
#hikari-top .low_hikari_sec_05 .headline_2 br {
display: block;
}
#hikari-top .low_hikari_sec_05__text {
margin-top: 20px;
}
#hikari-top .low_hikari_sec_05__item {
margin-top: 0;
}
#hikari-top .low_hikari_sec_05__item li {
margin-top: 40px;
}
#hikari-top .low_hikari_sec_05__cath {
padding: 10px 20px 0 20px;
}
}
#hikari-top .low_top_sec_06 {
padding: 40px;  }
#hikari-top .low_top_sec_06 .tab + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
#hikari-top .low_top_sec_06 .tab:checked + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
#hikari-top .low_top_sec_06 .tab:not(:checked) + label:hover span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
#hikari-top .low_top_sec_06 .tab + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
#hikari-top .low_top_sec_06 .tab:checked + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
#hikari-top .low_top_sec_06 .tab:not(:checked) + label:hover span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__icon {
width: 100px;
height: auto;
margin-left: 30px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
#hikari-top .low_top_sec_06 .table_capt {
font-size: 14px;
margin-top: 5px;
}
#hikari-top .low_top_sec_06 .tel-num {
margin-top: 5px;
}
#hikari-top .low_top_sec_06 h5 {
font-size: 18px;
font-weight: bold;
}
#hikari-top .low_top_sec_06 .in {
display: block;
width: 100%;
height: 100%;
}
#hikari-top .low_top_sec_06 .in h5:after {
font-family: "Font Awesome 5 Free";
content: "\f138";
font-weight: 900;
color: #ffd92c;
margin-left: 10px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner {
margin: auto;
background: #fffdea;
text-align: center;
margin-top: 20px;
padding: 30px 0;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__text {
font-size: 18px;
font-weight: bold;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner table {
border-collapse: separate;
border-spacing: 10px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__east th {
background: #ff8b40;
color: white;
padding: 8px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__east td {
border: 2px #ff8b40 solid;
background: #fff;
padding: 8px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__east td a {
display: block;
padding: 8px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__title {
color: #ff8b40;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__west th {
background: #655300;
color: white;
padding: 8px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__west td {
border: 2px #655300 solid;
background: #fff;
padding: 8px;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__inner__west td h5 {
color: #655300;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__no {
font-size: 34px;
font-weight: bold;
color: #ff8b40;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #ff8b40;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__text span {
display: block;
font-weight: bold;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02 .komg,
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__button {
margin-top: 20px;
width: 100%;
}
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02 .komg .button,
#hikari-top .low_top_sec_06 .hikari-flow__tag__content_02__button .button {
width: 50%;
}
#hikari-top .low_top_sec_06 .hikari-flow__button {
margin: 80px auto 0 auto;
}
#hikari-top .low_top_sec_06 .hikari-flow__button li:last-child {
margin-top: 20px;
}
#hikari-top .low_top_sec_06__inner {
padding: 80px 0;
background-color: #FFFBE6;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_06__inner {
margin-toop: 0;
}
}
#hikari-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#hikari-top .low_top_sec_06__tag__content ol {
display: flex;
justify-content: center;
}
#hikari-top .low_top_sec_06__tag__content li {
position: relative;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
padding: 0 10px;
width: 25%;
}
#hikari-top .low_top_sec_06__tag__content li::after {
position: absolute;
right: 0px;
top: 40px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
#hikari-top .low_top_sec_06__tag__content li:last-child::after {
display: none;
}
#hikari-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#hikari-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#hikari-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #FF8B40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#hikari-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_06 {
padding: 0;
}
#hikari-top .low_top_sec_06__inner {
padding: 40px 20px;
}
#hikari-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#hikari-top .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#hikari-top .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#hikari-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#hikari-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#hikari-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
} @media screen and (max-width: 590px) {
#hikari-top #tag__container {
height: 560px;
}
} #hikari-top .tbl-price-index {
width: 80%;
margin: 30px auto;
}
#hikari-top .tbl-price-index img {
padding-bottom: 20px;
}
#hikari-top .tbl-price-index th,
.tbl-price-index td {
padding: 15px;
text-align: center;
}
#hikari-top .tbl-price-index td:first-child {
background: #FF8B40;
color: #fff;
}
#hikari-top .tbl-price-index td:nth-child(2) {
background: #FFFDEA;
}
#hikari-top .tbl-price-index td:last-child {
background: #fff;
}
#hikari-top .tbl-price-index .thead {
background: #959595;
}
#hikari-top .tbl-price-index ul {
width: 100%;
display: table;
}
#hikari-top .tbl-price-index ul li {
background: #E8E8E8;
display: table-cell;
vertical-align: middle;
padding: 10px 0;
}
#hikari-top .tbl-price-index span.price {
color: #FF8B40;
font-size: 30px;
font-weight: bold;
}
#hikari-top .tbl-price-index span.price_tax {
color: #FF8B40;
font-size: 15px;
}
#hikari-top .tbl-price-index th:nth-child(2) {
font-size: 25px;
color: #FFD92C;
}
#hikari-top .tbl-price-index th:last-child {
font-size: 18px;
color: #fff;
font-weight: normal;
}
#hikari-top .tbl-price-index span {
color: #333;
font-weight: bold;
}
#hikari-top .tbl-price-index span.txt13 {
font-size: 13px;
}
#hikari-top .tbl-price-index span.txt20 {
font-size: 20px;
}
#hikari-top .tbl-price-index span.txt16 {
font-size: 16px;
}
#hikari-top .tbl-price-index span.txt14 {
font-size: 14px;
}
#hikari-top .tbl-price-index span.txt28 {
font-size: 28px;
}
#hikari-top .tbl-price-index span.txt24 {
font-size: 24px;
}
#hikari-top .low_top_sec_03__sp {
display: none;
}
@media screen and (max-width: 960px) {
#hikari-top .low_top_sec_03__sp {
display: block;
}
}
#hikari-top .low_top_sec_03__sp .tbl-price-index {
width: 100%;
margin: 20px auto;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index .thead {
background: #959595;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index .thead th {
padding: 10px 5px;
text-align: center;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index .thead th img {
padding-bottom: 10px;
width: 20px;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index th {
font-size: 15px;
color: #fff;
font-weight: bold;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index td {
padding: 5px;
text-align: center;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index td:first-child {
background: #FF8B40;
color: #fff;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index td:nth-child(2) {
background-color: unset;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index td:last-child {
background-color: unset;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index ul {
background: #E8E8E8;
width: 100%;
display: block;
padding: 10px 0;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index ul li {
background-color: unset;
display: block;
padding: 0;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__hikari {
background-color: #fffdea;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__hikari td:nth-of-type(n+2) {
padding: 20px 5px;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__hikari td .price {
color: #ff8b40;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__hikari__heading {
color: #ffd92c;
font-weight: bold;
font-size: 12px;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__competitors {
background-color: #fff;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__competitors td:nth-of-type(n+2) {
vertical-align: top;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index__competitors__heading {
font-size: 12px;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index.price {
color: #FF8B40;
font-size: 20px;
font-weight: bold;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index.price_tax {
color: #FF8B40;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index small {
font-size: 12px;
}
#hikari-top .low_top_sec_03__sp .tbl-price-index span {
color: #333;
font-weight: bold;
}
#hikari-top table.tbl-price-index,
#hikari-top table.tbl-price-index td,
#hikari-top table.tbl-price-index th {
border-collapse: collapse;
border: 1px solid #707070;
}
@media screen and (min-width: 591px) {
#hikari-top .br_mb {
display: none;
}
}
.table-hikari-tel__sp-only {
display: none;
} #hikari-top .low_top_sec_06 .tab__content.tab__content_02__tag__content_01__title__wrap {
display: flex;
justify-self: left;
align-items: center;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .low_top_sec_06__tag__content ol > li {
display: block;
width: 30%;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .low_top_sec_06__tag__content .hikari-flow__tag__content_02__text > li {
width: 100%;
display: block;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .low_top_sec_06__tag__content .hikari-flow__tag__content_02__text > li:after {
content: none;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__icon {
margin: 0 auto 15px;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__content {
display: block;
flex: auto;
margin-left: 30px;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__inner__west td,
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__inner__east td {
display: block;
}
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__inner__west td:first-child,
#hikari-top .low_top_sec_06 .tab__content.tab__content_02 .hikari-flow__tag__content_02__inner__east td:first-child {
margin-bottom: 10px;
}
#hikari-top .low_top_sec_06 .low_top_sec_06__tag__content_01__title__wrap {
display: flex;
align-items: center;
}
@media screen and (max-width: 960px) {
#hikari-top .tab + label {
display: flex;
width: 100%;
margin: 0 1%;
line-height: 1.5;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding-left: 50px;
padding-right: 20px;
text-align: left;
}
#hikari-top .tab + label span {
line-height: 1.3;
}
#hikari-top .tab + label.tab1 {
margin-bottom: 10px;
}
#hikari-top .tab + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
#hikari-top .tab + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
#hikari-top .tab:checked + label {
background-color: #333;
position: relative;
}
#hikari-top .tab:checked + label::after {
content: none;
}
#hikari-top .tab:checked + label span {
display: inline;
}
#hikari-top .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) {
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
#hikari-top .low_top_sec_06 {  }
#hikari-top .low_top_sec_06 .tab-wrap_sp-only__content {
padding: 20px;
padding-top: 0;
display: flex;
justify-content: center;
white-space: pre-line;
border: 2px solid #d9d3c9;
background-color: #fff;
margin-top: 20px;
}
#hikari-top .low_top_sec_06 .tab-wrap_sp-only__content > ol > li {
display: block;
padding: 0;
position: relative;
margin-bottom: 45px;
}
#hikari-top .low_top_sec_06 .tab-wrap_sp-only__content > ol > li:not(:last-of-type)::after {
content: "";
margin: 0 0 0 -20px;
padding: 0;
width: 40px;
height: 40px;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
bottom: -50px;
left: 50%;
}
#hikari-top .low_top_sec_06__tag__content_01__content {
display: flex;
flex-wrap: wrap;
justify-content: center;
flex: 1;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content_01__text {
margin: 0;
width: 100%;
font-size: 14px;
font-weight: normal;
flex: auto;
}
#hikari-top .low_top_sec_06__tag__content_02__inner {
margin: auto;
background: #fffdea;
text-align: center;
margin-top: 20px;
padding: 30px 0;
}
#hikari-top .low_top_sec_06__tag__content_01__no {
width: 20px;
margin: 0;
}
#hikari-top .low_top_sec_06__tag__content_01__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
margin: 0;
flex: 1;
}
#hikari-top .low_top_sec_06__tag__content_02__inner table {
border-collapse: separate;
border-spacing: 10px;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__east th {
background: #FF8B40;
color: white;
padding: 8px;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__east td {
border: 2px #FF8B40 solid;
background: #FFF;
padding: 8px;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__east td a {
display: block;
padding: 8px;
}
#hikari-top .low_top_sec_06__tag__content_02__title {
color: #FF8B40;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__west th {
background: #655300;
color: white;
padding: 8px;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__west td {
border: 2px #655300 solid;
background: #FFF;
padding: 8px;
}
#hikari-top .low_top_sec_06__tag__content_02__inner__west td h5 {
color: #655300;
}
#hikari-top .low_top_sec_06__tag__content_02__no {
font-size: 34px;
font-weight: bold;
color: #FF8B40;
}
#hikari-top .low_top_sec_06__tag__content_02__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 0;
font-size: 18px;
font-weight: bold;
color: #FF8B40;
}
#hikari-top .low_top_sec_06__tag__content_02__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content_02__text span {
display: block;
font-weight: bold;
}
#hikari-top .low_top_sec_06__tag__content_02 .komg, #hikari-top .low_top_sec_06__tag__content_02__button {
margin-top: 20px;
width: 100%;
}
#hikari-top .low_top_sec_06__tag__content_02 .komg .button, #hikari-top .low_top_sec_06__tag__content_02__button .button {
width: 50%;
}
#hikari-top .low_top_sec_06__tag__content_02__inner tr, #hikari-top .low_top_sec_06__tag__content_02__inner th, #hikari-top .low_top_sec_06__tag__content_02__inner td {
display: block;
}
#hikari-top .low_top_sec_06__tag__content_02__inner th {
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
#hikari-top .low_top_sec_06__tag__content_02__inner td {
margin: 0;
padding: 0;
}
#hikari-top .low_top_sec_06__tag__content_02__inner td a {
padding: 0;
margin: 0;
}
#hikari-top .low_top_sec_06__tag__content_02__title {
font-size: 16px;
}
#hikari-top .low_top_sec_06 .table_capt {
margin: 0;
}
#hikari-top .low_top_sec_06 .table_capt span {
display: block;
}
#hikari-top .low_top_sec_06__tag__content_01__button {
margin-top: 20px;
width: 100%;
margin: 80px auto 0 auto;
}
#hikari-top .low_top_sec_06__tag__content_01__button li:last-child {
margin-top: 20px;
}
}
#hikari-tv_sec01 .low_tv_sec_01__inner {
position: relative;
margin-top: 40px;
padding: 20px 0 40px 0;
height: 100%;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_option_tv01.png);
background-size: auto 100%;
background-position: right top;
}
#hikari-tv_sec01 .low_tv_sec_01__box {
padding: 40px 20px;
background-color: #fff;
z-index: 2;
}
#hikari-tv_sec01 .low_tv_sec_01__text {
margin-top: 40px;
line-height: 2em;
}
#hikari-tv_sec01 .low_tv_sec_01__text .note {
margin-top: 20px;
font-size: 13px;
}
#hikari-tv_sec01 .low_tv_sec_01__img {
position: absolute;
top: 0;
left: 45%;
width: 45%;
height: 100%;
z-index: 1;
}
#hikari-tv_sec01 .low_tv_sec_01__img img {
width: auto;
height: 100%;
}
@media screen and (max-width: 590px) {
#hikari-tv_sec01 .low_tv_sec_01__img {
position: static;
width: 100%;
height: auto;
padding: 0 40px;
}
#hikari-tv_sec01 .low_tv_sec_01__img img {
width: 100%;
height: auto;
}
}
@media screen and (max-width: 590px) {
.low_tv_sec_01 {
padding: 40px 20px !important;
}
#hikari-tv_sec01 .low_tv_sec_01__inner {
margin-top: 0;
height: auto;
background-image: none;
}
#hikari-tv_sec01 .low_tv_sec_01__box {
margin-top: 0;
padding: 20px;
}
#hikari-tv_sec01 .low_tv_sec_01__text {
margin-top: 20px;
}
#hikari-tv_sec01 .low_tv_sec_01__img {
display: flex;
justify-content: center;
align-items: flex-start;
}
#hikari-tv_sec01 .low_tv_sec_01__img img {
width: 80%;
height: auto;
}
#hikari-tv_sec01 .low_tv_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
}
.low_tv_sec_01 .low_tv_sec_01__text p.note {
font-size: 13px;
line-height: 26px;
}
.hikari-tv .headline_8,
.hikari-tv .headline_2,
.hikari-lan .headline_8 {
color: #655300;
}
.hikari-tv .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_tv_head.jpg);
}
.hikari-tv .lower__kv__lead {
margin-bottom: 100px;
}
@media screen and (max-width: 960px) {
.hikari-tv .lower__kv__lead {
margin-bottom: 0;
}
.hikari-tv .lower__kv__text {
margin-top: 20px !important;
}
}
.hikari-tv small {
font-size: 70%;
vertical-align: top;
position: relative;
top: -0.2em;
}
.hikari-tv_sec_02 {
background: linear-gradient(90deg, #fff8d6, #ffe9d8);
}
@media screen and (max-width: 590px) {
.hikari-tv_sec_02 {
padding: 40px 20px !important;
}
}
.hikari-tv_sec_02__button {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
}
.hikari-tv_sec_02__button .button {
width: 50%;
}
@media screen and (max-width: 590px) {
.hikari-tv_sec_02__button {
margin-top: 0;
}
.hikari-tv_sec_02__button .button {
width: 100%;
}
}
.hikari-lan .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_musen_head.jpg);
}
.hikari-lan .lower__kv__lead {
margin-bottom: 100px;
}
.hikari-lan .lower__kv__text {
margin-top: 0px !important;
}
@media screen and (max-width: 590px) {
.hikari-lan .lower__kv__text {
margin-top: 20px !important;
}
}
.hikari-lan_sec_02 {
padding: 60px 0;
}
.hikari-lan_sec_02__button {
margin-top: 40px auto 0 auto !important;
}
@media screen and (max-width: 960px) {
.hikari-lan_sec_02__button {
margin-top: 0;
}
.hikari-lan_sec_02__button .button {
margin: 0;
}
}
@media screen and (max-width: 590px) {
.hikari-lan_sec_02 {
padding: 40px 20px;
}
.hikari-lan_sec_02__button {
margin-top: 20px;
}
.hikari-lan_sec_02__button .button {
margin: 0;
}
}
.hikari-tv_sec_02__button .button {
margin-top: 40px;
}
@media screen and (max-width: 960px) {
.hikari-tv_sec_02__button .button {
margin-top: 0;
width: 100%;
}
}
.hikari-tv_sec02__price {
background: #fff;
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
border-radius: 2px;
border: 2px solid #FF8B40;
padding: 20px 0 10px 0;
width: 50%;
}
@media screen and (max-width: 960px) {
.hikari-tv_sec02__price {
margin-top: 20px;
width: 100%;
}
}
.hikari-tv_sec02__price span.price01 {
color: #FF8B40;
font-size: 18px;
}
.hikari-tv_sec02__price span.price02 {
color: #FF8B40;
font-size: 43px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.hikari-tv_sec02__price span.price02 {
font-size: 30px;
}
}
.hikari-tv_sec02__price span.price03 {
color: #FF8B40;
font-size: 31px;
font-weight: bold;
}
.hikari-tv_sec02__price span.price04 {
color: #FF8B40;
font-size: 18px;
}
.hikari-tv_sec02__price span.price05 {
color: #333333;
font-size: 13px;
}
@media screen and (max-width: 590px) {
.hikari-tv_sec02__price span.price01 {
font-size: 16px;
}
.hikari-tv_sec02__price span.price03 {
font-size: 28px;
font-weight: bold;
}
.hikari-tv_sec02__price span.price04 {
font-size: 16px;
}
.hikari-tv_sec02__price span.price05 {
font-size: 13px;
}
}
.hikari-tel .headline_8,
.hikari-tel .headline_2 {
color: #655300;
}
.hikari-tel .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_tel_head_cut.jpg);
background-position: left top;
background-size: 100%;
background-size: cover;
padding-bottom: 250px;
}
.hikari-tel .lower__kv__lead {
padding-top: 120px;
padding-bottom: 80px;
}
.hikari-tel .lower__kv__lead p {
margin-top: 120px;
}
@media screen and (max-width: 960px) {
.hikari-tel .lower__kv__lead {
padding-top: 40px;
padding-bottom: 40px;
}
.hikari-tel .lower__kv__lead p {
margin-top: 20px;
}
}
.low_tel_sec_01 .container {
z-index: 2;
}
#hikari-tel_sec01 .low_tel_sec_01__inner2 {
position: relative;
margin-top: 40px;
padding: 40px 0;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec01 .low_tel_sec_01__inner2 {
margin-top: 0;
padding: 20px 0;
}
}
.low_tel_sec_01__bg {
position: absolute;
top: 0;
left: 45%;
width: 100%;
height: 100%;
background-size: 100% 100%;
background-position: right top;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_option_tv01.png);
content: "";
z-index: 1;
}
@media screen and (max-width: 590px) {
.low_tel_sec_01__bg {
display: none;
}
}
#hikari-tel_sec01 .low_tel_sec_01__box {
margin-top: 20px;
margin-bottom: 20px;
padding: 40px 20px;
background-color: #fff;
z-index: 2;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec01 .low_tel_sec_01__box {
margin-top: 0;
}
}
#hikari-tel_sec01 .low_tel_sec_01__text {
margin-top: 40px;
line-height: 2em;
}
#hikari-tel_sec01 .low_tel_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
.hikari-tel-svg {
z-index: 2;
}
.hikari-tel-svg img {
width: 493px;
max-width: 100%;
margin-top: 100px;
padding-left: 50px;
vertical-align: middle;
height: auto;
}
@media screen and (max-width: 590px) {
.hikari-tel-svg img {
margin-top: 20px;
margin-bottom: 50px;
padding-left: 10px;
padding-right: 10px;
}
}
@media screen and (max-width: 590px) {
.low_tel_sec_01 {
padding: 40px 20px !important;
}
.low_tel_sec_01 .headline_2 {
margin-top: 0;
font-size: 22px;
}
.low_tel_sec_01 .headline_2 br {
display: none;
}
.hikari-tel-svg img {
margin-top: 0 !important;
margin-bottom: 0 !important;
}
#hikari-tel_sec01 .low_tel_sec_01__inner {
margin-top: 0;
height: auto;
background-image: none;
}
#hikari-tel_sec01 .low_tel_sec_01__box {
margin-top: 0;
padding: 20px;
}
#hikari-tel_sec01 .low_tel_sec_01__text {
margin-top: 20px;
}
#hikari-tel_sec01 .low_tel_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
#hikari-tel .lower__kv {
padding-bottom: 20px;
}
} .hikari-tel_sec_02 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_denwaback.jpg), linear-gradient(rgba(110, 100, 55, 0.9), rgba(88, 61, 44, 0.9));
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-blend-mode: multiply;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_denwaback.jpg);
background-color: rgba(110, 100, 55, 0.9);
}
#hikari-tel .tbl-price-index {
width: 80%;
margin: auto;
}
#hikari-tel .tbl-price-index img {
padding-bottom: 20px;
}
#hikari-tel .tbl-price-index th,
.tbl-price-index td {
padding: 15px;
text-align: center;
}
#hikari-tel .tbl-price-index td:first-child {
background: #FFF6CE;
width: 250px;
color: #333333;
font-size: 22px;
font-weight: bold;
}
#hikari-tel .tbl-price-index .td_white {
background-color: #fff;
padding: 5px;
font-size: 14px;
}
#hikari-tel .tbl-price-index td {
background: #fff;
}
#hikari-tel .tbl-price-index .thead {
background: #959595;
}
#hikari-tel .tbl-price-index ul {
background: #E8E8E8;
width: 100%;
display: table;
}
#hikari-tel .tbl-price-index ul li {
display: table-cell;
vertical-align: middle;
padding: 10px 0;
}
#hikari-tel .tbl-price-index span.price {
color: #FF8B40;
font-size: 33px;
font-weight: bold;
}
#hikari-tel .tbl-price-index span.price_tax {
color: #FF8B40;
}
#hikari-tel .tbl-price-index th {
font-size: 25px;
color: #fff;
font-weight: bold;
}
#hikari-tel .tbl-price-index span {
color: #333;
font-weight: bold;
font-size: 20px;
}
#hikari-tel ol li {
font-size: 16px;
text-align: left;
}
#hikari-tel table.tbl-price-index,
#hikari-tel table.tbl-price-index td,
#hikari-tel table.tbl-price-index th {
border-collapse: collapse;
border: 1px solid #707070;
font-size: 16px;
}
@media screen and (min-width: 591px) {
#hikari-tel .br_mb {
display: none;
}
}
@media screen and (max-width: 590px) {
.hikari-tel_sec_02 {
padding: 40px 20px !important;
}
} .hikari-tel_sec_05 {
background-color: #FFFBE6;
}
@media screen and (max-width: 590px) {
.hikari-tel_sec_05 {
padding: 40px 20px !important;
}
}
.hikari-tel_sec_05 .headline_1 br {
display: none;
}
@media screen and (max-width: 590px) {
.hikari-tel_sec_05 .headline_1 {
font-size: 18px;
}
.hikari-tel_sec_05 .headline_1 br {
display: block;
}
}
.table-hikari-tel-2 td,
.table-hikari-tel-2 tr,
.table-hikari-tel-2 th {
border-collapse: collapse;
border: 1px solid #707070;
font-size: 16px;
}
.table-hikari-tel-2 td:first-child {
text-align: center;
background: #FFF6CE;
width: 200px;
color: #333333;
font-size: 22px;
font-weight: bold;
}
.table-hikari-tel-2 td {
text-align: left;
background: white;
width: 360px;
color: #333333;
font-size: 18px;
font-weight: bold;
}
@media screen and (max-width: 960px) {
.table-hikari-tel-2 td {
font-size: 16px !important;
}
}
.table-hikari-tel-2 .thead {
background: #959595;
font-size: 18px;
text-align: center;
color: #fff;
font-weight: bold;
}
.table-hikari-tel-2 th {
padding-top: 20px;
padding-bottom: 20px;
}
.tablenote {
margin-top: 30px;
text-align: left !important;
color: #655300;
font-size: 40px;
line-height: 1.5em;
}
@media screen and (max-width: 960px) {
.tablenote {
font-size: 30px !important;
}
}
@media screen and (max-width: 590px) {
.tablenote {
font-size: 18px !important;
}
}
.table-hikari-tel {
margin-top: 50px;
width: 100%;
}
.table-hikari-tel table {
width: 100% !important;
}
.table-hikari-tel table .textbold {
display: block;
text-align: left;
}
@media screen and (max-width: 960px) {
.table-hikari-tel table td {
font-size: 16px !important;
font-weight: normal !important;
}
.table-hikari-tel table td:first-child {
width: 35% !important;
}
.table-hikari-tel table td:nth-child(2) {
width: 25% !important;
}
.table-hikari-tel table .textbold {
font-size: 16px !important;
}
.table-hikari-tel table ol {
margin-top: 20px;
}
.table-hikari-tel table ol li {
text-align: left !important;
font-size: 14px !important;
line-height: em !important;
}
}
@media screen and (max-width: 590px) {
.table-hikari-tel table td {
font-weight: normal !important;
}
.table-hikari-tel table .textbold {
font-size: 16px !important;
}
.table-hikari-tel table ol {
margin-top: 20px;
}
.table-hikari-tel table ol li {
text-align: left !important;
font-size: 14px !important;
line-height: em !important;
}
} .hikari-tel_sec_03 {
background: linear-gradient(90deg, #fff8d6, #ffe9d8);
}
@media screen and (max-width: 590px) {
.hikari-tel_sec_03 {
padding: 40px 20px !important;
}
}
.hikari-title-white {
color: white;
}
.hikari-tel-intro-orange {
font-size: 24px;
line-height: 2em;
color: #FF8B40;
font-weight: bold;
margin-top: 30px;
margin-bottom: 30px;
}
@media screen and (max-width: 960px) {
.hikari-tel-intro-orange {
font-weight: normal !important;
}
}
@media screen and (max-width: 590px) {
.hikari-tel-intro-orange {
font-size: 18px !important;
font-weight: normal !important;
}
}
.hikari-tel-wid-price img {
width: 556px;
max-width: 100%;
margin-top: 30px;
margin-bottom: 30px;
}
@media screen and (max-width: 590px) {
.hikari-tel_sec_02 .hikari-tel-wid-price {
padding: 0;
}
.hikari-tel_sec_02 .hikari-tel-wid-price img {
margin: 0;
}
}
.hikari-tel-p1 {
color: white;
font-size: 16px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.hikari-tel-p1 {
margin-top: 20px;
padding: 0;
}
}
.hikari-tel-p2 {
letter-spacing: 2px;
color: white;
font-size: 35px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.hikari-tel-p2 {
padding: 0;
}
}
.hikari-tel-p2-big {
font-size: 62px;
}
.hikari-tel_sec_02 {
padding-bottom: 20px !important;
}
.hikari-tel-p3 {
margin-top: 40px;
}
.hikari-tel-p3 li {
margin-top: 10px;
line-height: 2em;
color: #fff;
}
.hikari-tel-p3 li span {
display: block;
}
@media screen and (max-width: 590px) {
.hikari-tel-p3 {
margin-top: 20px;
padding: 0;
}
.hikari-tel-p3 li {
text-align: left !important;
}
.hikari-tel-p3 li span {
text-align: left !important;
}
} .subline-orange {
margin-top: 30px;
margin-bottom: 30px;
color: #FF8B40;
font-size: 16px;
font-weight: bold;
text-align: center;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.subline-orange {
font-weight: normal !important;
text-align: left;
}
}
.subline-n {
font-size: 13px;
text-align: center;
margin-bottom: 30px;
}
@media screen and (max-width: 590px) {
.subline-n {
text-align: left;
}
}
@media screen and (max-width: 590px) {
#hikari-tel_sec_04 {
padding: 40px 20px !important;
}
}
#hikari-tel_sec_04 .box_title {
font-size: 20px;
font-weight: bold;
text-align: center;
line-height: 1.5em;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec_04 .box_title {
font-size: 18px;
}
}
#hikari-tel_sec_04 .box {
text-align: center;
padding: 20px;
background-color: white;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 5px;
margin-bottom: 20px;
}
.box-1,
.box-4 {
margin-left: -20px;
margin-right: 20px;
}
.box-3,
.box-6 {
margin-left: 20px;
margin-right: -20px;
}
#hikari-tel_sec_04 .box_price {
background-color: #F7F7F7;
color: #FF8B40;
font-size: 18px;
font-weight: bold;
margin-top: 30px;
margin-bottom: 20px;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec_04 .box_price {
font-size: 14px !important;
}
}
#hikari-tel_sec_04 .box_price-lg {
font-size: 32px;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec_04 .box_price-lg {
font-size: 24px !important;
}
}
#hikari-tel_sec_04 .box_price-md {
font-size: 24px;
}
@media screen and (max-width: 590px) {
#hikari-tel_sec_04 .box_price-md {
font-size: 16px !important;
}
}
#hikari-tel_sec_04 .box_line {
font-size: 14px;
text-align: left;
}
#hikari-tel_sec_04 .box_img {
margin-bottom: 20px;
height: 110px;
}
@media screen and (max-width: 768px) {
.box-1,
.box-2,
.box-3,
.box-4,
.box-5,
.box-6 {
margin-left: 0px;
margin-right: 0px;
}
}
@media screen and (max-width: 992px) and (min-width: 769px) {
.box-1,
.box-3,
.box-5 {
margin-left: -20px;
margin-right: 20px;
}
.box-2,
.box-4,
.box-6 {
margin-left: 20px;
margin-right: -20px;
}
} @media screen and (max-width: 590px) {
.sp-none {
display: none;
}
}
@media screen and (min-width: 591px) {
.pc-none {
display: none;
}
}
#hikari-pp .pp {
padding: 0;
}
#hikari-pp .pp__head-capt {
font-size: 20px;
font-weight: bold;
color: #FF8B40;
text-align: center;
margin-top: 80px;
line-height: 2em;
}
#hikari-pp .pp__head-capt p {
text-align: center;
}
#hikari-pp .pp__button {
margin: 20px auto;
}
@media screen and (max-width: 590px) {
#hikari-pp .pp__head-capt {
font-weight: normal;
font-size: 16px;
margin-top: 20px;
text-align: left;
}
} #hikari-pp_sec_01 {
text-align: center;
padding-bottom: 0;
}
#hikari-pp_sec_01 .sec_inner {
margin: 0 40px;
padding: 80px 0;
background: #FFFDEA;
}
#hikari-pp_sec_01 .pp__ttl-capt {
font-size: 16px;
text-align: center;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_01 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: #fff;
height: 90%;
}
#hikari-pp_sec_01 .pp__box__inner {
display: flex;
align-items: center;
}
#hikari-pp_sec_01 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-pp_sec_01 .pp__box__inner__ttl {
text-align: left;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_01 .pp__box__inner__ttl {
text-align: center;
width: 100%;
}
}
#hikari-pp_sec_01 .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_01 .pp__box__inner__ttl .pp__box__title {
font-size: 20px;
text-align: center;
}
#hikari-pp_sec_01 .pp__box__inner__ttl .pp__box__title span {
display: block;
text-align: center;
}
}
#hikari-pp_sec_01 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_01 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_01 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_01 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_01 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
#hikari-pp_sec_01 .pp__points {
font-size: 13px;
margin-top: 40px;
padding-right: 3rem;
text-align: left;
line-height: 1.75;
left: 1.5rem; font-feature-settings: "palt" 1;
}
#hikari-pp_sec_01 .pp__points li {
text-indent: -1rem;
}
@media screen and (max-width: 590px) {
.pp__box__price .tax {
display: block;
font-size: 14px;
}
#hikari-pp_sec_01 {
padding: 0;
}
#hikari-pp_sec_01 .sec_inner {
margin: 40px 0;
padding: 40px 0;
}
#hikari-pp_sec_01 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_01 .pp__box__title {
font-size: 18px !important;
}
}  #hikari-pp_sec_02 {
text-align: center;
padding-bottom: 0;
}
#hikari-pp_sec_02 .pp__ttl-capt {
text-align: center;
font-size: 16px;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_02 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
}
#hikari-pp_sec_02 .pp__box__inner {
display: flex;
align-items: center;
}
#hikari-pp_sec_02 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-pp_sec_02 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
}
#hikari-pp_sec_02 .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
#hikari-pp_sec_02 .pp__box__inner__ttl .pp__box__title br {
display: none;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_02 .pp__box__inner__ttl .pp__box__title {
font-size: 20px;
text-align: center;
margin-right: 0;
}
#hikari-pp_sec_02 .pp__box__inner__ttl .pp__box__title br {
display: block;
}
}
#hikari-pp_sec_02 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_02 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_02 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_02 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_02 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_02 {
padding: 0 5px;
}
#hikari-pp_sec_02 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_02 .pp__box h4 {
font-size: 18px;
margin-right: 0;
}
}
@media screen and (max-width: 590px) {
.pp__box__inner {
flex-wrap: wrap;
}
.pp__box__inner .pp__box__img {
width: 100%;
margin-bottom: 10px;
}
.pp__box__inner .pp__box__img img {
margin: 0;
}
.pp__box__title {
font-size: 20px;
}
}  #hikari-pp_sec_03 {
text-align: center;
padding-bottom: 0;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_03 {
padding: 0;
margin-bottom: 0px;
}
}
#hikari-pp_sec_03 .sec_inner {
padding: 20px 0 60px;
}
#hikari-pp_sec_03 .pp__ttl-capt {
text-align: center;
font-size: 16px;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_03 .pp__ttl-notice {
padding-top: 16px;
text-align: center;
}
#hikari-pp_sec_03 .pp__ttl-notice > span {
font-size: 18px;
letter-spacing: 2.52px;
text-decoration: underline;
color: #D82525;
font-weight: bold;
}
#hikari-pp_sec_03 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
}
#hikari-pp_sec_03 .pp__box__inner {
display: flex;
align-items: center;
}
#hikari-pp_sec_03 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-pp_sec_03 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_03 .pp__box__inner__ttl {
width: 100%;
}
}
#hikari-pp_sec_03 .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
#hikari-pp_sec_03 .pp__box__inner__ttl .pp__box__title br {
display: none;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_03 .pp__box__inner__ttl .pp__box__title {
text-align: center;
}
#hikari-pp_sec_03 .pp__box__inner__ttl .pp__box__title br {
display: block;
}
}
#hikari-pp_sec_03 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_03 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_03 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_03 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_03 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_03 {
padding: 0;
}
#hikari-pp_sec_03 .sec_inner {
margin-top: 40px;
}
#hikari-pp_sec_03 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_03 .pp__box h4 {
font-size: 18px;
}
}  #hikari-pp_sec_04 {
padding: 40px 0 60px;
text-align: center;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/office_back_grad.jpg);
background-position: center center;
background-size: cover;
}
#hikari-pp_sec_04 .pp__ttl-capt {
font-size: 16px;
text-align: center;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_04 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
margin-left: auto;
margin-right: auto;
}
#hikari-pp_sec_04 .pp__box__inner {
display: flex;
align-items: center;
}
#hikari-pp_sec_04 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-pp_sec_04 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_04 .pp__box__inner__ttl {
width: 100%;
}
}
#hikari-pp_sec_04 .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_04 .pp__box__inner__ttl .pp__box__title {
text-align: center;
}
}
#hikari-pp_sec_04 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_04 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_04 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_04 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_04 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_04 {
margin-top: 0;
padding: 40px 0;
}
#hikari-pp_sec_04 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_04 .pp__box h4 {
font-size: 18px;
}
}  #hikari-pp_sec_05 {
text-align: center;
background: linear-gradient(120deg, rgba(255, 217, 44, 0.2) 0%, rgba(255, 139, 64, 0.2) 100%);
padding-top: 40px;
}
#hikari-pp_sec_05 .headline_1 br {
display: none;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .headline_1 br {
display: block;
}
}
#hikari-pp_sec_05 .pp__box-2 {
margin-top: 40px;
display: flex;
justify-content: space-between;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box-2 {
flex-wrap: wrap;
}
}
#hikari-pp_sec_05 .pp__box-2__inner {
background: #fff;
width: 48%;
display: flex;
flex-wrap: wrap;
align-content: space-between;
}
#hikari-pp_sec_05 .pp__box-2__inner > div {
width: 100%;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box-2__inner {
width: 100%;
}
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl {
background-color: #FF8B40;
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
position: relative;
font-size: 22px;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
height: 70px;
}
@media screen and (max-width: 960px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
font-size: 16px;
}
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-1,
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box-2__inner__ttl-2 {
height: 50px;
}
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl-1 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_plan_mansion_w.svg);
background-position: 40px center;
background-size: auto 50px;
}
@media screen and (max-width: 960px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl-1 {
background-position: 5px center;
background-size: auto 40px;
}
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl-1 {
background-position: 10px center;
background-size: auto 40px;
}
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl-2 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_plan_family_w.svg);
background-position: 40px center;
background-size: auto 50px;
}
@media screen and (max-width: 960px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl-2 {
background-position: 5px center;
background-size: auto 40px;
}
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box-2__inner__ttl-2 {
background-position: 10px center;
background-size: auto 40px;
}
}
#hikari-pp_sec_05 .pp__box-2__inner__graph {
margin: 20px 30px;
padding-bottom: 20px;
width: auto;
height: auto;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_05 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl .pp__box__title {
font-size: 18px;
height: 60px;
text-align: center;
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl-1::before {
top: 38px;
}
#hikari-pp_sec_05 .pp__box-2__inner__ttl-2::before {
top: 38px;
}
}  #hikari-pp_sec_06 {
text-align: center;
}
#hikari-pp_sec_06 .pp__ttl-capt {
text-align: center;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_06 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
}
#hikari-pp_sec_06 .pp__box__inner {
display: flex;
}
#hikari-pp_sec_06 .pp__box__inner img {
width: 20%;
margin: 0 10px;
}
#hikari-pp_sec_06 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_06 .pp__box__inner__ttl {
width: 100%;
}
}
#hikari-pp_sec_06 .pp__box__inner__ttl .pp__box__title span {
font-size: 20px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_06 .pp__box__inner__ttl .pp__box__title span {
display: block;
text-align: center;
}
}
#hikari-pp_sec_06 .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_06 .pp__box__title {
text-align: center;
}
}
#hikari-pp_sec_06 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_06 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_06 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_06 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_06 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
#hikari-pp_sec_06 .pp__points {
font-size: 13px;
margin-top: 30px;
padding-right: 3rem;
text-align: left;
line-height: 1.75;
left: 1.5rem; font-feature-settings: "palt" 1;
}
#hikari-pp_sec_06 .pp__points li {
text-indent: -1rem;
}
#hikari-pp_sec_06 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_06 .pp__box h4 {
font-size: 18px;
}
.pp__box__title {
font-size: 22px !important;
}
.pp__box__img {
width: 70px;
height: auto;
margin: 0 10px;
}
.pp__box__img img {
width: 100% !important;
height: auto;
margin: 0 !important;
}
@media screen and (max-width: 590px) {
.pp__box__img img {
width: 40px !important;
}
}  #hikari-pp_sec_07 {
text-align: center;
padding-bottom: 0;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 {
padding: 0;
margin-bottom: 0px;
}
}
#hikari-pp_sec_07 .sec_inner {
padding: 40px 0 60px;
background: #FFFDEA;
}
#hikari-pp_sec_07 .pp__ttl-capt {
text-align: center;
font-size: 16px;
font-weight: bold;
padding-top: 40px;
}
#hikari-pp_sec_07 .pp__box {
margin-top: 32px;
padding: 10px 30px;
border: 2px #FF8B40 solid;
border-radius: 4px;
background: white;
height: 90%;
}
#hikari-pp_sec_07 .pp__box__inner {
display: flex;
column-gap: 3px;
}
#hikari-pp_sec_07 .pp__box__img {
flex-shrink: 0;
margin-right: 0;
padding-top: 5px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 .pp__box__img {
margin-right: 10px;
flex-shrink: unset;
}
}
#hikari-pp_sec_07 .pp__box__inner__ttl {
text-align: left;
padding-top: 10px;
letter-spacing: 0;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 .pp__box__inner__ttl {
width: 100%;
}
}
#hikari-pp_sec_07 .pp__box__inner__ttl .pp__box__title {
font-size: 24px;
font-weight: bold;
color: #FF8B40;
}
#hikari-pp_sec_07 .pp__box__inner__ttl .pp__box__title br {
display: none;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 .pp__box__inner__ttl .pp__box__title {
text-align: center;
}
#hikari-pp_sec_07 .pp__box__inner__ttl .pp__box__title br {
display: block;
}
}
#hikari-pp_sec_07 .pp__box__inner__ttl__capt {
font-size: 15px;
font-weight: bold;
margin-top: 3px;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 .pp__box__inner__ttl__capt {
text-align: center;
}
}
#hikari-pp_sec_07 .pp__box__price {
text-align: center;
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
#hikari-pp_sec_07 .pp__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
#hikari-pp_sec_07 .pp__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
#hikari-pp_sec_07 {
padding: 0;
}
#hikari-pp_sec_07 .sec_inner {
margin-top: 40px;
}
#hikari-pp_sec_07 .pp__box {
padding: 10px 20px;
}
#hikari-pp_sec_07 .pp__box h4 {
font-size: 18px;
}
}  .hikari-flow {
padding: 0 !important;
}
.hikari-flow__inner {
margin-top: 80px;
padding: 80px;
background-color: #FFFDEA;
}
.hikari-flow__tag__wrapper {
padding: 0;
}
.hikari-flow__tag__wrapper .tab-wrap {
background-color: transparent;
}
.hikari-flow__tag__wrapper .tab__content {
margin-top: 20px;
padding: 20px;
border: 2px solid #d9d3c9;
background-color: #fff;
}
.hikari-flow__tag__wrapper .tab__content > ol > li {
position: relative;
display: flex;
margin-bottom: 80px;
}
.hikari-flow__tag__wrapper .tab__content > ol > li::after {
content: "";
margin: 0 0 0 -20px;
padding: 0;
width: 40px;
height: 40px;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
bottom: -50px;
left: 50%;
}
.hikari-flow__tag__wrapper .tab__content > ol > li:last-child::after {
display: none;
margin-bottom: 0;
} .hikari-flow__tag__wrapper .hikari-flow__tag__content_01__icon {
width: 100px;
height: auto;
margin-left: 30px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__no {
font-size: 34px;
font-weight: bold;
color: #FF8B40;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #FF8B40;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__text span {
display: block;
font-weight: bold;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01 .komg,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__button {
margin-top: 20px;
width: 100%;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01 .komg .button,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__button .button {
width: 50%;
}
.hikari-flow__button {
margin: 80px auto 0 auto;
}
.hikari-flow__button li:last-child {
margin-top: 20px;
}
@media screen and (max-width: 590px) {
.hikari-flow__inner {
margin-top: 20px;
padding: 20px;
}
.hikari-flow__tag__wrapper {
margin-top: 40px;
padding: 0;
}
.hikari-flow__tag__wrapper .tab__content > ol > li {
flex-wrap: wrap;
margin-bottom: 0;
}
.hikari-flow__tag__wrapper .tab__content ol li:nth-child(n+2) .hikari-flow__tag__content_01__icon {
margin-top: 80px;
}
.hikari-flow__tag__wrapper .tab__content ol li:nth-child(n+2) .hikari-flow__tag__content_02__icon {
margin-top: 80px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
margin-left: 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__text {
font-size: 14px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__icon img {
width: 100px;
height: auto;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__content {
margin-top: 20px;
margin-left: 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__no {
width: 20px;
font-size: 26px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__title {
flex: 1;
margin-left: 10px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01 .komg .button,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_01__button .button {
width: 100%;
}
.hikari-flow__button {
margin: 20px auto 0 auto;
}
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__icon {
width: 100px;
height: auto;
margin-left: 30px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.hikari-flow__tag__wrapper .table_capt {
font-size: 14px;
margin-top: 5px;
}
.hikari-flow__tag__wrapper .tel-num {
margin-top: 5px;
}
.hikari-flow__tag__wrapper h5 {
font-size: 18px;
font-weight: bold;
}
.hikari-flow__tag__wrapper .in {
display: block;
width: 100%;
height: 100%;
}
.hikari-flow__tag__wrapper .in h5:after {
font-family: "Font Awesome 5 Free";
content: "\f138";
font-weight: 900;
color: #FFD92C;
margin-left: 10px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner {
margin: auto;
background: #FFFDEA;
text-align: center;
margin-top: 20px;
padding: 30px 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__text {
font-size: 18px;
font-weight: bold;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner table {
border-collapse: separate;
border-spacing: 10px;
} .hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__east th {
background: #FF8B40;
color: white;
padding: 8px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__east td {
border: 2px #FF8B40 solid;
background: #FFF;
padding: 8px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__east td a {
display: block;
padding: 8px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__title {
color: #FF8B40;
} .hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__west th {
background: #655300;
color: white;
padding: 8px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__west td {
border: 2px #655300 solid;
background: #FFF;
padding: 8px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner__west td h5 {
color: #655300;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__no {
font-size: 34px;
font-weight: bold;
color: #FF8B40;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #FF8B40;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__text span {
display: block;
font-weight: bold;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02 .komg,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__button {
margin-top: 20px;
width: 100%;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02 .komg .button,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__button .button {
width: 50%;
}
.hikari-flow__button {
margin: 80px auto 0 auto;
}
.hikari-flow__button li:last-child {
margin-top: 20px;
}
@media screen and (max-width: 590px) {
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
margin-left: 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__text {
font-size: 14px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__icon img {
width: 100px;
height: auto;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__content {
margin-top: 20px;
margin-left: 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__no {
width: 20px;
font-size: 26px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__title {
flex: 1;
margin-left: 10px;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02 .komg .button,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__button .button {
width: 100%;
}
.hikari-flow__button {
margin: 20px auto 0 auto;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner table {
border-spacing: 0;
}
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner table th,
.hikari-flow__tag__wrapper .hikari-flow__tag__content_02__inner table td {
display: block;
width: 100%;
margin-top: 10px;
}
}
#hikari-flow .tab + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
#hikari-flow .tab:not(:checked) + label:hover span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
#hikari-flow .tab:checked + label .tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
#hikari-flow .tab + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
#hikari-flow .tab:checked + label .tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
#hikari-flow .tab:not(:checked) + label:hover span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
@media screen and (max-width: 960px) {
.tab-wrap_sp-only__title {
padding-left: 20px;
font-size: 14px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content {
display: none;
justify-content: center;
padding-right: 20px;
padding-left: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content > ol > li {
width: 90%;
padding: 0 20px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content > ol > li > div {
margin: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__icon {
width: 100%;
display: none;
justify-content: center;
align-items: flex-start;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__icon img {
width: 80px;
height: auto;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__content {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__no {
margin: 0;
margin-right: 10px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__title {
margin: 0;
justify-content: flex-start;
padding-right: 60px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__text {
margin: 0;
width: 100%;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__button a {
width: 100%;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_01__button a br {
display: none;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__text {
margin: 0 !important;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner__text {
font-weight: normal;
font-size: 16px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner tr,
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner th,
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner td {
display: block;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner th {
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner td {
margin: 0;
padding: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__inner td a {
padding: 0;
margin: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .hikari-flow__tag__content_02__title {
font-size: 16px;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .table_capt {
margin: 0;
}
.tab-wrap_sp-only .tab-wrap_sp-only__content .table_capt span {
display: block;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) li:nth-child(1) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_01.svg) no-repeat right center/auto 90%;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) li:nth-child(2) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_02.svg) no-repeat right center/auto 90%;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) li:nth-child(3) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_03.svg) no-repeat right center/auto 90%;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) li:nth-child(1) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_04.svg) no-repeat right center/auto 90%;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) li:nth-child(2) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_01.svg) no-repeat right center/auto 90%;
}
.tab-wrap_sp-only .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) li:nth-child(3) .hikari-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/flow-icon_03.svg) no-repeat right center/auto 90%;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__title:before {
content: "";
position: absolute;
right: 20px;
top: 50%;
margin-top: -3.75px;
width: 7px;
height: 10px;
transition-duration: 0.3s;
border-style: solid;
border-width: 0 7px 10px 7px;
border-color: transparent transparent #fff transparent;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__title[aria-expanded=false]:before {
-webkit-transform: rotateX(180deg);
-ms-transform: rotateX(180deg);
transform: rotateX(180deg);
transition-duration: 0.3s;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__item {
display: block;
width: 100%;
white-space: initial;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__content {
padding-right: 0;
padding: 20px;
white-space: pre-line;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__title span {
width: 75%;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__content ol {
padding: 0 !important;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__content ol li {
width: 100% !important;
padding: 0 !important;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only__content .gas-flow__tag__content_01__text {
margin: 0 !important;
width: 100% !important;
padding: 0 !important;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .gas-flow__tag__content_01__text {
padding-left: 0;
margin-bottom: 10px;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab + label {
display: flex;
width: 100%;
margin: 0 1%;
line-height: 1.5;
border: 4px solid #333;
align-items: center;
justify-content: left;
padding-left: 50px;
padding-right: 20px;
text-align: left;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab + label span {
line-height: 1.3;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label::after {
content: none;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label span {
display: inline;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label {
background-color: #333;
position: relative;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label.tab1 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked + label.tab2 span::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(1) ~ .tab__content:nth-of-type(1) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(2) ~ .tab__content:nth-of-type(2) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(3) ~ .tab__content:nth-of-type(3) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(4) ~ .tab__content:nth-of-type(4) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(5) ~ .tab__content:nth-of-type(5) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(6) ~ .tab__content:nth-of-type(6) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(7) ~ .tab__content:nth-of-type(7) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(8) ~ .tab__content:nth-of-type(8) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(9) ~ .tab__content:nth-of-type(9) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab:checked:nth-of-type(10) ~ .tab__content:nth-of-type(10) {
display: flex;
position: relative;
top: 0;
opacity: 1;
transition: 0.1s opacity ease-in, 0.1s transform ease;
z-index: 10;
transform: translateY(0);
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab-wrap_sp-only__content {
padding: 20px;
}
.hikari-flow__tag__wrapper .tab-wrap_sp-only .tab-wrap_sp-only__content > ol > li {
display: block;
}
} .hikari-option {
padding: 0 !important;
}
.hikari-option .headline_6 {
margin-bottom: 80px;
}
@media screen and (max-width: 590px) {
.hikari-option .headline_6 {
margin-bottom: 20px;
}
} .hikari-option__inner {
margin-top: 80px;
padding: 80px;
background: linear-gradient(120deg, rgba(255, 217, 44, 0.2) 0%, rgba(255, 139, 64, 0.2) 100%);
}
.hikari-option__button {
margin: 80px auto 0 auto;
}
.hikari-option__button li:last-child {
margin-top: 20px;
}
@media screen and (max-width: 590px) {
.hikari-option__inner {
margin-top: 20px;
padding: 0;
}
}
.hikari-option__inner__wrapper__box {
margin-top: 30px;
background: white;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.29);
border-radius: 4px;
height: 95%;
top: -30px;
}
.hikari-option__inner__wrapper__box > a {
display: block;
padding: 0 20px 20px;
text-align: center;
}
.hikari-option__inner__wrapper__box a .hikari-option__inner__wrapper__box__icon {
width: 100%;
}
.hikari-option__inner__wrapper__box a .hikari-option__inner__wrapper__box__icon img {
width: 60%;
}
.hikari-option__inner__wrapper ul > li:last-of-type .hikari-option__inner__wrapper__box {
text-align: center;
padding: 0 20px 20px;
}
.hikari-option__inner__wrapper ul > li:last-of-type .hikari-option__inner__wrapper__box__icon {
width: 100%;
}
.hikari-option__inner__wrapper ul > li:last-of-type .hikari-option__inner__wrapper__box__icon img {
width: 60%;
}
.hikari-option__inner__wrapper ul > li:last-of-type .hikari-option__inner__wrapper__box .hikari-option__title {
font-size: 20px;
font-weight: bold;
position: relative;
}
.hikari-option__inner__wrapper__box a .hikari-option__title {
font-size: 20px;
font-weight: bold;
position: relative;
}
.hikari-option__inner__wrapper__box a .hikari-option__title::after {
font-family: "Font Awesome 5 Free";
content: "\f138";
font-weight: 900;
position: absolute;
color: #FFD92C;
margin-left: 10px;
}
.hikari-option__inner__wrapper__box__capt {
margin-top: 20px;
font-size: 14px;
text-align: left;
line-height: 1.75;
}
.hikari-optopn__inner__wrapper__box__button {
margin-top: 15px;
background: #FFF4C1;
border: 1px #181E21 solid;
margin: -25px auto 15px;
width: 60%;
}
.hikari-optopn__inner__wrapper__box__button a:before {
display: none;
}
.hikari-option__inner__wrapper__box__price {
font-size: 18px;
font-weight: bold;
padding: 5px;
margin-top: 10px;
text-align: center;
margin-bottom: 5px;
line-height: 1.5;
color: #FF8B40;
background: #F7F7F7;
}
.hikari-option__inner__wrapper__box__price span.figures {
font-size: 32px;
font-weight: bold;
}
.hikari-option__inner__wrapper__box__price span.yen {
font-size: 24px;
font-weight: bold;
}
@media screen and (max-width: 767px) {
.hikari-option__inner__wrapper__box__price {
font-size: 16px;
}
.hikari-option__inner__wrapper__box__price span.figures {
font-size: 30px;
}
.hikari-option__inner__wrapper__box__price span.yen {
font-size: 20px;
}
}
@media screen and (max-width: 590px) {
.hikari-option__button {
margin: 40px auto 0 auto;
}
}  .hikari-option__contact {
text-align: center;
}
.hikari-option__contact__wrapper .headline_1 {
font-size: 24px;
font-weight: bold;
}
.hikari-option__contact__wrapper .headline_1 br {
display: none;
}
@media screen and (max-width: 590px) {
.hikari-option__contact__wrapper .headline_1 br {
display: block;
}
}
.hikari-option__contact__wrapper__info {
padding-top: 80px;
}
.hikari-option__contact__wrapper__info__capt {
font-size: 20px;
font-weight: bold;
text-align: center;
}
@media screen and (max-width: 590px) {
.hikari-option__contact__wrapper__info__capt {
text-align: left;
}
.hikari-option__contact__wrapper__info__capt br {
display: none;
}
}
@media screen and (max-width: 590px) {
.hikari-option__contact__wrapper h3 {
margin-top: 40px;
}
.hikari-option__contact__wrapper__info {
padding-top: 40px;
}
.hikari-option__contact__wrapper__info__capt {
font-size: 16px;
}
}
.contact ul li {
margin-top: 40px;
position: relative;
margin-left: auto;
}
.contact__tel a,
.contact__phone a {
font-size: 45px;
font-weight: bold;
font-family: "Trebuchet MS";
margin-left: 120px;
}
.contact__tel a::before {
content: "";
position: absolute;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/common/free-dial.png) no-repeat center center/contain;
height: 47px;
width: 60px;
top: 7px;
left: 70px;
}
.contact__phone a::before {
content: "携帯・PHPの方";
position: absolute;
color: white;
font-size: 14px;
background: #FF8B40;
height: 36px;
width: 120px;
padding: 8px 0;
top: 15px;
left: 20px;
}
.contact__provider p {
font-size: 14px;
text-align: center;
padding-left: 100px;
}
@media screen and (max-width: 960px) {
.contact__provider p {
padding-left: 0;
}
}
.contact__provider div {
font-size: 23px;
font-weight: bold;
margin: 5px 0 0;
margin-left: 100px;
}
.contact__provider div span {
font-size: 16px;
font-weight: bold;
}
.contact__provider div::before {
content: "受付時間";
position: absolute;
font-size: 14px;
background: #333;
color: white;
border-radius: 2px;
height: 25px;
width: 90px;
padding: 4px 0;
top: 28px;
left: 18px;
}
@media screen and (min-width: 1200px) {
.contact__tel a,
.contact__phone a,
.contact__provider div {
margin-left: 130px;
}
.contact__tel a::before {
margin-left: 40px;
}
.contact__phone a::before,
.contact__provider div::before {
margin-left: 60px;
}
.contact__phone a::before {
width: 100px;
font-size: 13px;
}
}
@media screen and (max-width: 960px) {
.contact__tel a::before {
margin-left: 82px;
}
.contact__phone a::before,
.contact__provider div::before {
margin-left: 130px;
}
.contact__phone a::before {
width: 100px;
font-size: 13px;
}
}
@media screen and (max-width: 767px) {
.contact__tel a::before {
margin-left: 0;
}
.contact__phone a::before,
.contact__provider div::before {
margin-left: 42px;
}
.contact__phone a::before {
width: 100px;
font-size: 13px;
}
}
@media screen and (max-width: 590px) {
.contact ul li {
margin-top: 30px;
}
.contact__tel a {
font-size: 32px;
margin-left: 80px;
}
.contact__tel a::before {
margin-left: -30px;
height: 35px;
}
.contact__phone a {
margin-left: 100px;
font-size: 32px;
}
.contact__phone a::before {
margin-left: 0px;
top: 10px;
}
.contact__provider {
margin-top: 20px !important;
}
.contact__provider div {
margin-top: 40px;
margin-left: 0px;
font-size: 18px;
}
.contact__provider div span {
font-size: 14px;
}
.contact__provider div::before {
margin-left: 0px;
top: 30px;
left: 50%;
transform: translateX(-50%);
}
}
@media screen and (max-width: 590px) {
.hikari-option__title {
font-size: 17px !important;
}
.hikari-optopn__inner__wrapper__box__button {
margin: 0 auto;
width: 90%;
}
} .hikari-security .headline_8,
.hikari-security .headline_2 {
color: #655300;
}
.hikari-security .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_security_head.jpg);
padding-bottom: 100px;
}
@media screen and (max-width: 960px) {
.hikari-security .lower__kv {
padding-bottom: 20px;
}
}
.hikari-security.lower__kv__lead {
margin-bottom: 100px;
}
@media screen and (max-width: 960px) {
.hikari-security.lower__kv__lead {
margin-bottom: 0;
}
}
@media screen and (max-width: 590px) {
.low_security_sec_01 {
padding: 40px 20px !important;
}
}
#hikari-security_sec01 .low_security_sec_01__inner {
position: relative;
margin-top: 80px;
padding: 40px 80px;
}
@media screen and (max-width: 590px) {
#hikari-security_sec01 .low_security_sec_01__inner {
margin-top: 40px;
padding: 0;
}
}
.low_security_sec_01__bg {
position: absolute;
top: 0;
left: 45%;
width: 100%;
height: 100%;
background-size: 100% 100%;
background-position: right top;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_option_tv01.png);
content: "";
z-index: 1;
}
#hikari-security_sec01 .low_security_sec_01__box {
margin-top: 20px;
margin-bottom: 20px;
padding: 40px 20px;
background-color: #fff;
z-index: 2;
}
#hikari-security_sec01 .low_security_sec_01__text {
margin-top: 40px;
line-height: 2em;
}
#hikari-security_sec01 .low_security_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
.hikari-security-svg {
text-align: center;
z-index: 2;
}
.hikari-security-svg img {
height: 350px;
width: auto;
max-width: 100%;
margin-top: 100px;
vertical-align: middle;
}
@media screen and (max-width: 960px) {
.hikari-security-svg img {
width: 60%;
max-width: 60%;
height: auto;
}
}
@media screen and (max-width: 590px) {
#hikari-security_sec01 .low_security_sec_01__inner {
margin-top: 0;
height: auto;
background-image: none;
}
#hikari-security_sec01 .low_security_sec_01__box {
margin-top: 0;
padding: 20px;
}
#hikari-security_sec01 .low_security_sec_01__text {
margin-top: 20px;
}
#hikari-security_sec01 .low_security_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
.hikari-security .lower__kv {
padding-bottom: 20px;
}
}
@media screen and (max-width: 960px) {
.low_security_sec_01 .table-hikari-tel-2 td,
.low_security_sec_01 .table-hikari-tel-2 th {
display: block;
width: 100% !important;
}
} .table-headline {
color: #655300;
font-size: 20px;
font-weight: bold;
margin-bottom: 20px;
}
.table-hikari-tel-2 td,
.table-hikari-tel-2 tr,
.table-hikari-tel-2 th {
border-collapse: collapse;
border: 1px solid #707070;
}
.table-hikari-security {
margin-top: 10px;
}
.table-hikari-security th {
background-color: #E8E8E8;
font-size: 14px;
font-weight: bold;
margin-right: 30px;
margin-left: 30px;
min-width: 130px;
width: 15%;
text-align: center;
}
.table-hikari-security td {
line-height: 2em;
}
.table-hikari-security-title {
font-size: 16px;
font-weight: bold;
}
.table-hikari-tel-2 td:first-child {
text-align: center;
background: #FFF6CE;
width: 220px;
color: #333;
font-weight: bold;
font-size: 18px;
}
.table-hikari-tel-2 td {
width: 420px;
text-align: left;
background: #fff;
color: #333;
font-size: 18px;
vertical-align: center;
}
.table-hikari-tel-2 #td-down {
margin-top: 10px;
font-size: 14px;
line-height: 2em;
font-weight: normal;
text-align: left;
}
@media screen and (max-width: 590px) {
.table-hikari-tel-2 td,
.table-hikari-tel-2 th {
font-size: 16px;
font-weight: normal;
}
}
@media screen and (max-width: 590px) {
.table-hikari-security th {
margin-left: 0px;
padding-top: 20px;
padding-bottom: 20px;
}
}
.hikari_security_table {
margin-top: 70px;
}
#hikari_security_table table {
border: solid 1px #707070;
}
.security-table-text {
padding: 30px;
}
.begin-bold {
font-weight: bold;
}
#hikari_table_security table,
#hikari_table_security tr th,
#hikari_table_security tr td {
border-collapse: collapse;
border: 1px solid #707070;
font-size: 16px;
}
@media screen and (max-width: 590px) {
#hikari_table_security table,
#hikari_table_security tr th,
#hikari_table_security tr td {
display: grid;
text-align: left;
width: 100%;
}
.table-hikari-security th {
margin-left: 0px;
padding-top: 20px;
padding-bottom: 20px;
}
#hikari_table_security tr th {
text-align: center;
}
} .hikari-security_sec_02 {
background: linear-gradient(90deg, #fff8d6, #ffe9d8);
padding: 60px 0;
}
.hikari-security_sec_02__button {
display: flex;
justify-content: center;
align-items: center;
margin-top: 70px;
margin-bottom: 70px;
}
.hikari-security_sec_02__button .button {
width: 50%;
}
@media screen and (max-width: 590px) {
.hikari-security_sec_02 {
padding: 40px 20px;
}
.hikari-security_sec_02__button .button {
width: 100%;
}
}
.hikari-security_sec_02_block1 {
background-color: #fff;
padding-top: 40px;
padding-bottom: 40px;
margin-top: 50px;
margin-left: -20px;
margin-right: 20px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 5px;
}
.hikari-security_sec_02_block2 {
background-color: #fff;
padding-top: 40px;
padding-bottom: 40px;
margin-top: 50px;
margin-left: 20px;
margin-right: -20px;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 5px;
}
.hikari-security_sec_02_block2__button {
margin-top: 40px;
padding: 0 20px;
display: flex;
justify-content: space-between;
}
.hikari-security_sec_02_block2__button div {
width: 48%;
}
.hikari-security_sec_02_block2__button div .button {
margin: 0;
width: 100%;
}
@media screen and (max-width: 590px) {
.hikari-security_sec_02_block2__button {
margin-top: 0;
flex-wrap: wrap;
}
.hikari-security_sec_02_block2__button div {
margin-top: 20px;
width: 100%;
}
}
@media screen and (max-width: 992px) {
.hikari-security_sec_02_block2,
.hikari-security_sec_02_block1 {
margin-right: 0px;
margin-left: 0px;
}
}
@media screen and (max-width: 590px) {
.hikari-security_sec_02 {
padding: 40px 0 !important;
}
}
.hikari-security_sec_02_title {
text-align: center;
font-size: 20px;
font-weight: bold;
color: #333;
}
@media screen and (max-width: 590px) {
.hikari-security_sec_02_title {
font-size: 17px;
}
}
.hikari-security_sec_02_text {
font-size: 14px;
line-height: 24px;
margin-top: 30px;
margin-bottom: 30px;
padding-left: 20px;
padding-right: 20px;
}
.hikari-security_sec_02_link {
color: #2D77C1;
font-size: 16px;
text-decoration: underline;
}
.hikari-security_sec_02_link:before {
font-family: "Font Awesome 5 Free";
content: "\f0da";
font-weight: 900;
}
.button.yellow {
margin-top: 40px;
background-color: #FFF4C1;
border: 1px solid #000;
}
.button.yellow:hover {
color: #FFF4C1;
background-color: rgba(0, 0, 0, 0.5);
}
.button.yellow:hover::before {
background-color: #FFF4C1;
}
.button.yellow:hover::after {
border-left: 6px solid #FFF4C1;
}
.both {
max-width: 45%;
}
.both-box {
margin-left: 15px;
margin-right: 15px;
} .hikari-support .headline_8,
.hikari-support .headline_2 {
color: #655300;
}
.hikari-support .lower__kv {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_support_head.jpg);
background-size: cover;
padding-bottom: 250px;
}
@media screen and (max-width: 960px) {
.hikari-support .lower__kv {
padding-bottom: 20px;
}
}
.hikari-support .lower__kv__text {
margin-top: 120px !important;
}
@media screen and (max-width: 960px) {
.hikari-support .lower__kv__text {
margin-top: 20px !important;
}
} .low_support_sec_01 .headline_1 br {
display: none;
}
@media screen and (max-width: 590px) {
.low_support_sec_01 {
padding: 40px 0 !important;
}
.low_support_sec_01 .headline_1 br {
display: block;
}
}
#hikari-support_sec01 .low_support_sec_01__inner {
position: relative;
margin-top: 40px;
height: 100%;
background-size: 160% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_option_tv01.png);
background-size: auto 130%;
background-position: right top;
padding: 40x 0 80px 0;
}
.low_support_sec_01__bg {
position: absolute;
top: 0;
left: 45%;
width: 100%;
height: 100%;
background-size: 100% 100%;
background-position: right top;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/bg_option_tv01.png);
content: "";
z-index: 1;
}
@media screen and (max-width: 590px) {
.low_support_sec_01__bg {
display: none;
}
}
#hikari-support_sec01 .low_support_sec_01__box {
margin-top: 20px;
margin-bottom: 20px;
padding: 40px 20px;
background-color: #fff;
z-index: 2;
}
.hikari-support-svg {
z-index: 2;
}
#hikari-support_sec01 .low_support_sec_01__text {
margin-top: 40px;
line-height: 2em;
}
#hikari-support_sec01 .low_support_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
#hikari-support_sec01 .low_support_sec_01__text .low_support_sec_01__box {
height: 110px;
background-color: white;
border: solid 2px #FF8B40;
border-radius: 5px;
color: #FF8B40;
text-align: center;
}
@media screen and (max-width: 590px) {
#hikari-support_sec01 .low_support_sec_01__text .low_support_sec_01__box {
height: auto;
padding: 20px 0 10px 0;
}
}
#price-md {
font-size: 41px;
font-weight: bold;
vertical-align: baseline;
}
@media screen and (max-width: 590px) {
#price-md {
font-size: 20px;
}
}
#price-lg {
font-size: 91px;
font-weight: bold;
vertical-align: baseline;
}
@media screen and (max-width: 590px) {
#price-lg {
font-size: 40px !important;
}
}
@media screen and (max-width: 991px) {
#price-lg {
font-size: 60px;
}
#hikari-support_sec01 .low_support_sec_01__text .low_support_sec_01__box {
margin-top: 20px;
margin-left: 30px;
margin-right: 30px;
}
}
@media screen and (max-width: 991px) and (max-width: 590px) {
#hikari-support_sec01 .low_support_sec_01__text .low_support_sec_01__box {
margin-left: 0;
margin-right: 0;
}
}
#price-sm {
font-size: 22px;
vertical-align: baseline;
}
@media screen and (max-width: 590px) {
#price-sm {
display: block;
font-size: 16px !important;
}
}
.hikari-support-svg {
text-align: center;
}
.hikari-support-svg img {
max-width: 100%;
width: 613px;
margin-top: 70px;
padding-left: 20px;
vertical-align: middle;
}
@media screen and (max-width: 991px) {
.hikari-support-svg img {
margin-top: 20px;
margin-bottom: 50px;
padding-left: 10px;
padding-right: 10px;
}
.hikari-support-svg {
text-align: center;
}
}
@media screen and (max-width: 590px) {
.hikari-support .low_tel_sec_01__inner .headline_2 {
font-size: 22px;
}
#hikari-support_sec01 .low_support_sec_01__inner {
margin-top: 0;
height: auto;
background-image: none;
}
#hikari-support_sec01 .low_support_sec_01__box {
margin-top: 0;
padding: 20px;
}
#hikari-support_sec01 .low_support_sec_01__text {
margin-top: 20px;
}
#hikari-support_sec01 .low_support_sec_01 .note {
margin-top: 20px;
font-size: 13px;
}
.hikari-support .lower__kv {
padding-bottom: 20px;
}
} .hikari-support_sec_02_img-white img {
height: 128px;
width: 100%;
vertical-align: middle;
}
.align-middle {
vertical-align: middle;
}
.hikari-support_sec_02_img {
padding-left: 20px;
padding-right: 20px;
vertical-align: middle;
margin-top: 20px;
}
.hikari-support_sec_02_img-white {
padding-top: 20px;
background-color: white;
width: 175px;
height: 175px;
border-radius: 50%;
}
#hikari-support_sec_02_title {
color: #655300;
font-size: 18px;
font-weight: bold;
text-align: center;
margin-top: 10px;
}
.hikari-support_sec_02 {
background: linear-gradient(90deg, #fff8d6, #ffe9d8);
padding: 60px 0;
}
.hikari-support_sec_02__button {
display: flex;
justify-content: center;
align-items: center;
margin-top: 40px;
}
.hikari-support_sec_02__button .button {
width: 50%;
}
@media screen and (max-width: 590px) {
.hikari_support_sec_02 {
padding: 40px 20px !important;
}
.hikari-support_sec_02__button {
margin-top: 20px;
}
.hikari-support_sec_02__button .button {
width: 100%;
}
.hikari-support_sec_02 {
background: linear-gradient(90deg, #fff8d6, #ffe9d8);
padding: 60px 0;
}
.hikari-tv_sec_02__button {
margin-bottom: 60px;
}
} .hikari_support_table {
margin-top: 30px;
margin-bottom: 100px;
}
.table-hikari-support th {
background-color: #E8E8E8;
font-size: 14px;
font-weight: bold;
margin-right: 30px;
margin-left: 30px;
width: 20%;
min-width: 131px;
text-align: center;
}
#hikari_support_table table {
border: solid 1px #707070;
}
.support-table-text {
padding: 20px;
line-height: 2em;
}
.begin-bold {
font-weight: bold;
}
#hikari_table_support table,
#hikari_table_support tr th,
#hikari_table_support tr td {
border-collapse: collapse;
border: 1px solid #707070;
font-size: 16px;
}
#hikari_table_support tr td {
background-color: #fff;
}
.table-hikari-support-title {
font-size: 16px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
#hikari_table_support table,
#hikari_table_support tr td {
display: grid;
text-align: left;
width: 100%;
}
.table-hikari-support th {
display: grid;
width: 100%;
margin-left: 0px;
text-align: center;
padding-top: 15px;
padding-bottom: 15px;
}
}
.note {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
.low_top_sec_06 .tab-wrap_sp-only .tab + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg) !important;
}
.low_top_sec_06 .tab-wrap_sp-only .tab:checked + label span.tab1::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg) !important;
}
.low_top_sec_06 .tab-wrap_sp-only .tab + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg) !important;
}
.low_top_sec_06 .tab-wrap_sp-only .tab:checked + label span.tab2::after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg) !important;
}
}
#hikari-top .low_top { }
#hikari-top .low_top_sec_07 {
padding: 60px 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#hikari-top .low_top_sec_07_block {
margin: 50px 0;
}
#hikari-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #FF8B40;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#hikari-top .low_top_sec_07 input {
display: none;
}
#hikari-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#hikari-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#hikari-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#hikari-top .low_top_sec_07 .answer {
overflow: hidden;
color: #FF8B40;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#hikari-top .low_top_sec_07 .answer a {
color: #0866c6;
text-decoration: underline;
margin: 10px 0;
display: block;
}
#hikari-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ p {
max-height: 10000px;
transition: all 1s;
margin: 10px 0;
}
#hikari-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#hikari-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#hikari-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#hikari-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#hikari-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#hikari-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#hikari-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#hikari-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
} .sub_color {
color: #175190;
}
.water_extra {
color: #11A9da;
}
.button.grade.water {
background: linear-gradient(90deg, #0196f9, #15599b);
}
.button.grade.water:hover {
background: none;
background-color: #fff;
color: #0196f9;
border: solid 1px #0196f9;
}
.button.grade.water:hover:before {
background-color: #0196f9;
}
.button.grade.water:hover:after {
border-left: 6px solid #0196f9;
} #water-top .headline_4 {
font-family: "Trebuchet MS", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#water-top .low { }
#water-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_top_back_01.jpg);
background-attachment: fixed;
position: relative;
}
#water-top .low__kv__back .kv-ttl_pc {
position: absolute;
bottom: 45px;
right: 75px;
}
#water-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 650px;
}
#water-top .low__kv__back .kv-ttl_sp {
width: 70%;
height: auto;
right: 10px;
object-fit: contain;
position: absolute;
bottom: -20px;
}
#water-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#water-top .low__kv__back {
height: 300px;
background-size: 120%;
background-position: 50% top;
}
#water-top .low__kv__back .kv-ttl_pc {
bottom: 20px;
}
#water-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#water-top .low__kv {
position: relative;
height: 200px;
}
#water-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#water-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 310px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 40% 0%;
background-size: 200%;
}
}
#water-top .low_top_sec_01__item {
display: flex;
justify-content: space-between;
}
#water-top .low_top_sec_01__item li {
padding: 0 15px;
}
#water-top .low_top_sec_01__item li a {
padding: 0;
box-shadow: none;
}
#water-top .low_top_sec_01__item_wrap {
width: 100%;
height: auto;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
padding: 20px 0;
border-radius: 4px;
box-shadow: 0px 0px 4px 2px rgba(0, 0, 0, 0.1);
}
#water-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#water-top .low_top_sec_01__item_text {
margin-top: 20px;
color: #175190;
}
#water-top .low_top_sec_01 .note {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_01 {
width: calc(100% - 30px);
margin: 0px auto;
}
#water-top .low_top_sec_01__item {
margin-top: 10px;
}
#water-top .low_top_sec_01__item li {
width: 48%;
margin-top: 30px;
}
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_01 {
width: 100%;
margin: 0px;
padding: 30px 10px !important;
background-color: #fff;
}
#water-top .low_top_sec_01__item {
padding: 0px;
}
#water-top .low_top_sec_01__item li {
margin: 10px 0 0;
padding: 0;
}
#water-top .low_top_sec_01__item_wrap {
padding: 10px;
}
#water-top .low_top_sec_01__item_icon img {
width: 60px;
margin: auto;
text-align: center;
display: block;
}
#water-top .low_top_sec_01__item_text {
font-size: 16px;
}
#water-top .low_top_sec_01__item_text br {
display: none;
}
}
#water-top .low_water_sec_02 .no-padding {
padding: 0;
}
#water-top .low_water_sec_02__inner {
padding: 40px 0;
background: #eaf7ff;
margin: 0 50px 10px;
}
#water-top .low_water_sec_02 .headline_1 {
margin-bottom: 50px;
}
#water-top .low_water_sec_02 .headline_1 br {
display: none;
}
#water-top .low_water_sec_02__item {
display: flex;
}
#water-top .low_water_sec_02__item li {
display: flex;
justify-content: center;
align-items: flex-end;
width: 20%;
}
#water-top .low_water_sec_02__text {
font-size: 20px;
line-height: 34px;
font-weight: 600;
text-align: center;
}
#water-top .low_water_sec_02 .water_servername {
font-size: 18px;
color: #838383;
margin-top: 40px;
position: relative;
font-weight: bold;
text-align: center;
}
#water-top .low_water_sec_02 .water_servername:before {
content: "";
position: absolute;
bottom: -3rem;
left: 0;
margin-left: calc(50% - 1.3rem);
width: 2.6rem;
height: 2.6rem;
border-radius: 50%;
background: #2D77C1;
}
#water-top .low_water_sec_02 .water_servername:after {
content: "";
position: absolute;
bottom: -2.15rem;
left: 50%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(45deg);
-webkit-transform: translateX(-50%) rotate(45deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
#water-top .low_water_sec_02__item_icon {
display: flex;
justify-content: center;
align-items: flex-end;
}
#water-top .low_water_sec_02__item_icon img {
width: 70%;
height: auto;
}
#water-top .low_water_sec_02__button {
margin-top: 80px;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_02__item {
flex-wrap: wrap;
}
#water-top .low_water_sec_02__item li {
margin-top: 40px;
width: 50%;
}
#water-top .low_water_sec_02 .water_servername:before {
content: "";
position: absolute;
top: 50%;
left: 60%;
transform: translateY(-50%);
}
#water-top .low_water_sec_02 .water_servername:after {
top: 50%;
left: 110%;
margin-top: -4px;
}
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_02 {
padding: 0;
}
#water-top .low_water_sec_02__inner {
margin: 0;
padding: 30px 10px;
background: #eaf7ff;
}
#water-top .low_water_sec_02__text {
font-size: 16px;
line-height: 28px;
font-weight: 600;
}
#water-top .low_water_sec_02__item {
margin-top: 0;
padding: 0;
}
#water-top .low_water_sec_02__item li {
margin-top: 40px;
width: 100%;
}
#water-top .low_water_sec_02 .water_servername {
margin-top: 20px;
font-size: 14px;
}
#water-top .low_water_sec_02__button {
margin-top: 20px;
}
}
#water-top .low_water_sec_03 .headline_7 {
font-size: 20px;
font-weight: 600;
line-height: 34px;
}
#water-top .low_water_sec_03__inner {
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
margin: 70px 0 0;
background-size: 70%;
background-repeat: no-repeat;
background-position: left;
margin-top: 80px;
padding: 40px 0;
}
#water-top .low_water_sec_03__img img {
width: 120%;
height: auto;
margin: -60px -20px 0 20px;
}
#water-top .low_water_sec_03__box {
padding: 20px;
background-color: #fff;
margin: 0 -50px 0 50px;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_03__box {
margin-left: auto;
margin-right: auto;
max-width: 100%;
width: 100%;
flex: 100%;
}
}
#water-top .low_water_sec_03__box table {
width: 100%;
}
#water-top .low_water_sec_03__box table .th {
text-align: inherit;
padding: 10px;
border: solid 1px #333333;
background-color: #E8F5FF;
font-weight: 600;
}
#water-top .low_water_sec_03__box table td {
font-size: 18px;
border: solid 1px #333;
padding: 10px 15px;
}
#water-top .low_water_sec_03__box table td span {
font-size: 18px;
}
#water-top .low_water_sec_03__text {
margin-top: 2rem;
}
#water-top .low_water_sec_03__text .price-list {
line-height: 2em;
display: flex;
flex-wrap: wrap;
}
#water-top .low_water_sec_03__text .price-list dt {
width: 30%;
}
#water-top .low_water_sec_03__text .price-list dd {
width: 70%;
}
#water-top .low_water_sec_03 .note {
margin-top: 20px;
line-height: 24px;
font-size: 14px;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_03 {
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
}
#water-top .low_water_sec_03__inner {
margin-top: 0;
padding: 20px 20px;
background-image: none;
}
#water-top .low_water_sec_03__inner .container {
margin: auto;
width: 100%;
}
#water-top .low_water_sec_03__inner .container .row {
width: 100%;
margin: 0 !important;
}
#water-top .low_water_sec_03__box {
margin-top: 0;
padding: 20px;
}
#water-top .low_water_sec_03__text {
margin-top: 20px;
}
#water-top .low_water_sec_03__img {
position: relative;
padding: 0;
width: 100%;
height: auto;
margin: auto;
display: block;
}
#water-top .low_water_sec_03__img img {
width: 100%;
margin: 10px;
height: auto;
}
#water-top .low_water_sec_03 .note {
margin-top: 20px;
}
#water-top .low_water_sec_03 .headline_7 br {
display: none;
}
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_03 {
padding: 30px 10px;
}
#water-top .low_water_sec_03__inner {
padding: 0 !important;
background-image: none;
margin: 0;
}
#water-top .low_water_sec_03__inner .container {
padding: 0;
}
#water-top .low_water_sec_03__inner .container .row {
margin: 0 !important;
}
#water-top .low_water_sec_03__box {
margin: 10px 0 0;
background: none;
box-sizing: border-box;
padding: 15px 0 0;
}
#water-top .low_water_sec_03__text {
margin-top: 20px;
}
#water-top .low_water_sec_03__text table {
width: 100%;
}
#water-top .low_water_sec_03__text table td {
font-size: 16px;
background-color: #fff;
}
#water-top .low_water_sec_03__text table td span {
font-size: 14px;
}
#water-top .low_water_sec_03__img {
width: 100%;
}
#water-top .low_water_sec_03__img img {
width: 100%;
height: auto;
max-width: 100%;
margin: 20px 0 0;
}
#water-top .low_water_sec_03 .note {
margin-top: 20px;
font-size: 12px;
line-height: 20px;
}
#water-top .low_water_sec_03 .headline_7 {
font-size: 16px;
line-height: 28px;
}
#water-top .low_water_sec_03 .headline_7 br {
display: none;
}
}
#water-top .low_water_sec_04 {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/about_bg.png) no-repeat center center/cover;
color: #fff;
text-align: center;
padding: 8rem;
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_04 {
padding: 2rem;
padding-bottom: 6rem;
}
}
#water-top .low_water_sec_04 .headline_2 {
margin-top: 40px;
margin-bottom: 3rem;
}
#water-top .low_water_sec_04 .headline_2 br {
display: none;
}
#water-top .low_water_sec_04__text {
margin-bottom: 6rem;
line-height: 2em;
}
#water-top .low_water_sec_04__item {
margin-bottom: 6rem;
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_04__item {
margin-bottom: 3rem;
}
}
#water-top .low_water_sec_04__item li {
position: relative;
}
#water-top .low_water_sec_04__icon img {
max-width: 100%;
width: 100%;
height: 100%;
object-fit: cover;
}
#water-top .low_water_sec_04__catch {
position: absolute;
bottom: 1.5rem;
right: 3rem;
}
#water-top .low_water_sec_04__button {
margin: 0 auto;
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_04 .headline_1 {
margin-top: 40px;
}
#water-top .low_water_sec_04__item li {
margin-bottom: 2rem;
}
#water-top .low_water_sec_04 .headline_2 br {
display: block;
}
#water-top .low_water_sec_04__text {
font-size: 15px;
text-align: left;
}
}
#water-top .low_top_sec_04__block {
text-align: center;
}
#water-top .low_top_sec_04__block li {
margin-top: 50px;
position: relative;
}
#water-top .low_top_sec_04__block h1 {
display: block;
font-size: 18px;
height: 50px;
}
#water-top .low_top_sec_04__block .child {
padding-top: 15px;
}
#water-top .low_top_sec_04__block h2 {
display: none;
}
#water-top .low_top_sec_04__box {
margin: 20px 0 0 0;
position: relative;
}
#water-top .low_top_sec_04__box-back {
background: transparent linear-gradient(127deg, rgb(240, 251, 255) 0%, rgb(247, 247, 255) 100%) 0% 0% no-repeat padding-box;
height: 240px;
width: 340px;
position: absolute;
margin-top: 50px;
z-index: 1;
bottom: -20px;
right: -20px;
}
#water-top .low_top_sec_04__box-img {
z-index: 2;
position: relative;
}
#water-top .low_top_sec_04__box-img img {
width: 100%;
margin-top: 20px;
}
#water-top .low_top_sec_04__box-img .sp {
display: none;
}
#water-top .low_top_sec_04_text {
font-size: 18px;
margin: 50px 0 0;
text-align: left;
line-height: 32px;
}
#water-top .low_top_sec_04 .note {
font-size: 14px;
line-height: 22px;
text-align: left;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_04 {
background-color: #fff;
padding-bottom: 0;
}
#water-top .low_top_sec_04 .container {
padding: 0;
}
#water-top .low_top_sec_04__block {
margin-bottom: 10px;
margin-top: 30px;
}
#water-top .low_top_sec_04__block li {
position: relative;
display: block;
margin: 5px 15px;
}
#water-top .low_top_sec_04__block h1 {
display: none;
}
#water-top .low_top_sec_04__block h2 {
display: block;
text-align: left;
font-size: 14px;
padding: 10px 0 0 20px;
}
#water-top .low_top_sec_04__block .child {
padding-top: 20px;
}
#water-top .low_top_sec_04__box {
margin: 0;
padding: 0;
background-color: rgba(191, 191, 191, 0.2);
}
#water-top .low_top_sec_04__box-back {
background: none;
height: auto;
width: 70%;
position: relative;
margin-top: 10px;
z-index: 1;
bottom: 0;
right: 0;
}
#water-top .low_top_sec_04__box-img {
width: 30%;
}
#water-top .low_top_sec_04__box-img img {
margin-top: 0;
}
#water-top .low_top_sec_04__box-img .sp {
display: block;
}
#water-top .low_top_sec_04__box-img .pc {
display: none;
}
#water-top .low_top_sec_04_text {
font-size: 16px;
margin: 10px 15px 10px;
text-align: left;
line-height: unset;
}
#water-top .low_top_sec_04_text .note {
font-size: 12px;
}
}
#water-top .low_water_sec_05 {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/sec_06_bg.png) no-repeat center center/cover;
color: #fff;
text-align: center;
}
#water-top .low_water_sec_05 .headline_2 {
margin-top: 5.5rem;
margin-bottom: 3rem;
}
#water-top .low_water_sec_05 .headline_2 br {
display: none;
}
#water-top .low_water_sec_05__text {
margin-bottom: 6rem;
}
#water-top .low_water_sec_05__item {
justify-content: space-between;
}
#water-top .low_water_sec_05__item li {
width: 100%;
padding: 0 15px;
}
#water-top .low_water_sec_05__circle {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 50px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_05__circle {
margin: 0px auto 20px;
width: 150px;
height: 150px;
padding: 30px 0;
}
}
#water-top .low_water_sec_05__icon img {
width: 100px;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_05__icon img {
width: 60px;
}
}
#water-top .low_water_sec_05__logo {
flex-shrink: 0;
}
#water-top .low_water_sec_05__logo img {
width: 70%;
margin-bottom: 20px;
}
@media screen and (max-width: 960px) {
#water-top .low_water_sec_05__logo img {
width: 100px;
}
}
#water-top .low_water_sec_05__catch {
margin-bottom: 2.5rem;
margin-top: 2.5rem;
text-align: left;
}
#water-top .low_water_sec_05__button {
margin: 0 auto;
}
@media screen and (max-width: 590px) {
#water-top .low_water_sec_05__circle {
margin: 0 auto 2.5rem;
}
#water-top .low_water_sec_05 .headline_1 {
margin-top: 40px;
}
#water-top .low_water_sec_05 .headline_2 br {
display: block;
}
#water-top .low_water_sec_05__text {
font-size: 15px;
text-align: left;
}
}
#water-top .low_top_sec_06 {
padding: 50px;
}
#water-top .low_top_sec_06__inner {
padding: 60px 0;
background-color: #eaf7ff;
}
#water-top .low_top_sec_06__cont {
background: #fff;
width: 90%;
max-width: 90rem;
margin: 4rem auto 4rem;
padding: 4rem 0 2rem;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont {
margin: 0 auto;
}
}
#water-top .low_top_sec_06__cont__list {
display: flex;
justify-content: space-between;
width: 60%;
margin: 0 auto;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont__list {
display: block;
}
}
#water-top .low_top_sec_06__cont__list__item {
display: flex;
flex-direction: column-reverse;
justify-content: space-between;
}
#water-top .low_top_sec_06__cont__list__item figure {
display: flex;
justify-content: center;
align-items: flex-start;
}
#water-top .low_top_sec_06__cont__list__item figure img {
width: 80px;
height: auto;
}
#water-top .low_top_sec_06__cont__list__item:not(:last-of-type) {
position: relative;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont__list__item:not(:last-of-type) {
margin-bottom: 5rem;
}
#water-top .low_top_sec_06__cont__list__item:not(:last-of-type):after {
position: absolute;
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 20px;
left: 50%;
top: 105%;
font-family: "Font Awesome 5 Free";
transform: translateX(-50%);
opacity: 0.7;
content: "\f078";
}
}
#water-top .low_top_sec_06__cont__list__item:not(:last-of-type):before {
position: absolute;
right: -30px;
top: 30px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont__list__item:not(:last-of-type):before {
content: none;
}
}
#water-top .low_top_sec_06__cont__list__item__read {
margin-top: 20px;
display: flex;
align-items: center;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont__list__item__read {
justify-content: center;
}
}
#water-top .low_top_sec_06__cont__list__item__read span {
display: block;
}
#water-top .low_top_sec_06__cont__list__item__read span:first-child {
color: #11A9da;
font-size: 3rem;
margin-right: 1rem;
}
#water-top .low_top_sec_06__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_06 {
padding: 0;
}
#water-top .low_top_sec_06__inner {
padding: 30px 0;
}
#water-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#water-top .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#water-top .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#water-top .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#water-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
}
#water-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#water-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#water-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#water-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
}
#water-top .low_top_sec_07 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/water_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#water-top .low_top_sec_07_block {
margin: 50px 0;
}
#water-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #11A9DA;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#water-top .low_top_sec_07 input {
display: none;
}
#water-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#water-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/water_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#water-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/water_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#water-top .low_top_sec_07 .answer {
overflow: hidden;
color: #11A9DA;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#water-top .low_top_sec_07 .answer a {
color: #0866c6;
text-decoration: underline;
margin: 10px 0;
display: block;
}
#water-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ p {
max-height: 10000px;
transition: all 1s;
margin: 10px 0;
}
#water-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_07_block {
margin: 20px 0;
}
#water-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#water-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#water-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#water-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#water-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#water-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#water-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
}
#water-top .low_top_sec_08_block_1 {
background: transparent linear-gradient(110deg, rgb(240, 251, 255) 0%, rgb(247, 247, 255) 100%) 0% 0% no-repeat padding-box;
background-size: 60% 100%;
background-position: left;
margin: 80px 0;
padding: 20px 0;
}
#water-top .low_top_sec_08_block_1 .container {
max-width: 1300px;
}
#water-top .low_top_sec_08_block_1_img img {
margin: -70px 30px 50px;
width: 100%;
}
#water-top .low_top_sec_08_block_1_box {
background-color: white;
padding: 30px 20px;
margin: 0 50px 0 -50px;
}
#water-top .low_top_sec_08_block_1_box_title {
margin-bottom: 30px;
color: #11a9da;
font-size: 34px;
line-height: 58px;
text-align: left;
font-weight: 200;
}
#water-top .low_top_sec_08_block_1_box_text {
font-size: 18px;
line-height: 32px;
}
#water-top .low_top_sec_08_block_2 {
background: transparent linear-gradient(110deg, rgb(240, 251, 255) 0%, rgb(247, 247, 255) 100%) 0% 0% no-repeat padding-box;
background-size: 60% 100%;
background-position: right;
margin: 40px 0;
padding: 20px 0;
}
#water-top .low_top_sec_08_block_2 .container {
max-width: 1300px;
}
#water-top .low_top_sec_08_block_2_img img {
width: 100%;
margin: -60px -20px 0 20px;
}
#water-top .low_top_sec_08_block_2_box {
background-color: white;
padding: 30px 20px;
margin: 0 -50px 0 50px;
z-index: 2;
}
#water-top .low_top_sec_08_block_2_box_title {
margin-bottom: 30px;
color: #11a9da;
font-size: 34px;
line-height: 58px;
text-align: left;
font-weight: 200;
}
#water-top .low_top_sec_08_block_2_box_text {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_08_block_1_box {
margin: 0;
}
#water-top .low_top_sec_08_block_1_img img {
margin: 0;
}
#water-top .low_top_sec_08_block_2_box {
margin: 0;
}
#water-top .low_top_sec_08_block_2_img img {
margin: 0;
}
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_08 {
margin-top: 0px !important;
background: transparent linear-gradient(110deg, rgb(240, 251, 255) 0%, rgb(247, 247, 255) 100%) 0% 0% no-repeat padding-box;
}
#water-top .low_top_sec_08 .container-fluid {
padding: 0;
}
#water-top .low_top_sec_08_block {
margin: 20px 0 0;
background: none;
padding: 0;
}
#water-top .low_top_sec_08_block_1 {
margin: 0;
background: none;
padding: 0 15px;
}
#water-top .low_top_sec_08_block_1_box {
margin: 0;
background: none;
padding: 15px 0 0;
}
#water-top .low_top_sec_08_block_1_box_title {
font-size: 22px;
font-weight: 300;
line-height: unset;
margin-bottom: 10px;
}
#water-top .low_top_sec_08_block_1_box_text {
font-size: 16px;
line-height: unset;
}
#water-top .low_top_sec_08_block_1_img img {
margin: 0;
}
#water-top .low_top_sec_08_block_1 .no-padding {
padding: 0;
}
#water-top .low_top_sec_08_block_2 {
margin: 0;
background: none;
padding: 0 15px;
}
#water-top .low_top_sec_08_block_2_box {
margin: 0;
background: none;
padding: 15px 0 0;
}
#water-top .low_top_sec_08_block_2_box_title {
font-size: 22px;
font-weight: 300;
line-height: unset;
margin-bottom: 10px;
}
#water-top .low_top_sec_08_block_2_box_text {
font-size: 16px;
line-height: unset;
}
#water-top .low_top_sec_08_block_2 .no-padding {
padding: 0;
}
}
#water-top .low_top_sec_09 {
background-color: #E8F5FF;
margin: 0 50px 50px !important;
}
#water-top .low_top_sec_09_block {
margin-top: 50px;
}
#water-top .low_top_sec_09_block_img img {
max-width: 90%;
padding: 0 0 20px;
}
#water-top .low_top_sec_09_block_text {
font-size: 18px;
line-height: 32px;
padding: 40px 0 0;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_09 {
padding: 30px 0;
margin: 0 !important;
}
#water-top .low_top_sec_09_block {
margin-top: 20px;
}
#water-top .low_top_sec_09_block_text {
font-size: 16px;
line-height: unset;
padding: 10px 0;
}
}
#water-top .low_top_sec_10 {
background-blend-mode: multiply;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/water_02-1024x683.jpg), linear-gradient(113deg, rgb(0, 107, 178) 0%, rgb(0, 0, 0) 100%);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
#water-top .low_top_sec_10 h2 {
color: #fff;
}
#water-top .low_top_sec_10_sub {
color: #fff;
font-size: 34px;
font-weight: 200;
margin: 50px 0 40px;
text-align: center;
}
#water-top .low_top_sec_10_intro {
color: #fff;
font-size: 20px;
font-weight: 600;
line-height: 34px;
text-align: center;
}
#water-top .low_top_sec_10_block {
margin-top: 40px 0 0;
}
#water-top .low_top_sec_10_block_img {
position: relative;
}
#water-top .low_top_sec_10_block_img p {
position: absolute;
bottom: 10px;
right: 20px;
color: #fff;
}
#water-top .low_top_sec_10_block_img img {
width: 100%;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_10_block .sp {
width: 33.3%;
padding: 0 5px;
margin-bottom: 20px;
}
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_10_sub {
font-size: 22px;
font-weight: 300;
margin: 20px 0;
}
#water-top .low_top_sec_10_intro {
font-size: 16px;
line-height: 28px;
}
#water-top .low_top_sec_10_block {
margin-bottom: 20px;
}
#water-top .low_top_sec_10_block_img p {
bottom: -20px;
font-size: 14px;
right: 0;
left: 0;
text-align: center;
}
}
#water-top .low_top_sec_10 .tennen_acc {
padding-top: 50px;
}
#water-top .low_top_sec_10 .tennen_acc-box {
background: #FFFFFF 0% 0% no-repeat padding-box;
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
border-radius: 30px;
padding: 20px;
}
#water-top .low_top_sec_10 .tennen_acc-box > input {
display: none;
}
#water-top .low_top_sec_10 .tennen_acc-box > label {
position: relative;
margin: auto;
color: #333333;
text-align: center;
font-size: 18px;
font-weight: 500;
display: block !important;
}
#water-top .low_top_sec_10 .tennen_acc-box > .tennen_acc_content {
overflow: hidden;
transition: max-height 0.3s;
max-height: 0px;
}
#water-top .low_top_sec_10 .tennen_acc-box > input:checked ~ .tennen_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#water-top .low_top_sec_10 .tennen_acc-box > input[type=checkbox]:checked ~ label ~ .tennen_acc_content {
max-height: 15000px;
margin-top: 50px;
transition: max-height 1s;
}
#water-top .low_top_sec_10 .tennen_acc-box > input[type=checkbox]:checked ~ label::after {
transform: translateX(-50%) rotate(315deg);
-webkit-transform: translateX(-50%) rotate(315deg);
transition: all 0.3s;
}
#water-top .low_top_sec_10 .tennen_acc-box > label::after {
content: "";
position: absolute;
bottom: -2.15rem;
right: 0;
top: 30%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(135deg);
-webkit-transform: translateX(-50%) rotate(135deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_10 .tennen_acc-box {
margin: 0;
padding: 0;
}
#water-top .low_top_sec_10 .tennen_acc {
padding: 0;
}
#water-top .low_top_sec_10 .tennen_acc > .container {
margin: 0px;
width: auto;
}
#water-top .low_top_sec_10 .tennen_acc-box::before {
font-size: 20px;
left: -25;
top: 16;
}
#water-top .low_top_sec_10 .tennen_acc-box > input[type=checkbox]:checked ~ label ~ .option_acc_content {
margin-top: 10px;
}
#water-top .low_top_sec_10 .tennen_acc-box > .option_acc_content::before {
font-size: 20px;
left: -25;
top: 16;
}
#water-top .low_top_sec_10 .tennen-box > input[type=checkbox]:checked ~ label ~ .option_acc_content {
padding-bottom: 20px;
}
#water-top .low_top_sec_10 .tennen_acc-box > label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 15px 0;
}
#water-top .low_top_sec_10 .tennenn_acc-box > label::before {
font-size: 24px;
left: 0px;
top: 0;
}
#water-top .low_top_sec_10 .tennen_acc-box > label::after {
width: 0.7rem;
height: 0.7rem;
right: 20px;
top: 40%;
}
#water-top .low_top_sec_10 .tennen_acc-box > .option_acc_content {
font-size: 14px;
padding: 0;
}
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1 {
padding: 30px 0;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1_title {
text-align: center;
display: block;
margin: 0 auto 40px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1_title h4 {
color: #175190;
text-align: center;
margin: 10px auto 0;
display: block;
font-size: 20px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1_title img {
width: 70px;
text-align: center;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1 .title3 {
margin: -60px auto 40px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2 {
padding: 30px 0;
background-color: #F2FCFF;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title {
text-align: center;
display: block;
margin: -60px 0 40px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title h4 {
color: #175190;
text-align: center;
margin: 10px auto 0;
display: block;
font-size: 20px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title img {
width: 70px;
text-align: center;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box img {
width: 100%;
margin: 30px 0;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box h3 {
color: #11a9da;
font-weight: bold;
font-size: 1.6rem;
position: relative;
margin-bottom: 2.5rem;
position: relative;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box h3:before {
position: absolute;
content: "";
background-color: #11a9da;
height: 2px;
width: 25px;
left: 0;
bottom: -4px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box h3 span {
font-size: 2.4rem;
padding-left: 0.5rem;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box h2 {
color: #175190;
font-size: 30px !important;
line-height: 1.6;
font-weight: 400;
position: relative;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box p {
padding: 10px;
font-size: 16px;
line-height: 32px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box .note {
font-size: 14px;
}
@media screen and (max-width: 590px) {
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1_title img {
width: 50px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1_title h4 {
font-size: 18px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1 .title1 {
margin: 0 auto 0;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_1 .title3 {
margin: -60px auto 10px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title {
margin: -50px auto 20px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title img {
width: 50px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_2_title h4 {
font-size: 18px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box {
padding: 10px;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box h2 {
font-size: 18px !important;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box p {
padding: 0;
font-size: 14px;
line-height: inherit;
}
#water-top .low_top_sec_10 .tennen_acc_content .tennen_block_box .note {
margin-top: 10px;
font-size: 12px;
}
} .water-list {
font-size: 1.6rem;
}
.water-list .water-list-header {
padding-top: 0 !important;
}
@media screen and (max-width: 590px) {
.water-list .water-list-header {
padding-bottom: 8rem;
}
}
.water-list .headline_list_01 {
font-size: 4.4rem;
}
@media screen and (max-width: 590px) {
.water-list .headline_list_01 {
font-size: 3rem;
}
}
.water-list .headline_list_01 span {
display: block;
margin-bottom: 10px;
font-size: 1.4rem;
color: #0097FB;
letter-spacing: 0.1rem;
}
.water-list__item {
position: relative;
padding: 0;
padding-bottom: 4rem;
margin-bottom: 15rem;
}
@media screen and (max-width: 768px) {
.water-list__item {
margin-bottom: 0px;
}
}
.water-list__item:last-of-type {
margin-bottom: 7.5rem;
}
@media screen and (max-width: 768px) {
.water-list__item:last-of-type {
margin-bottom: 0px;
padding-bottom: 0px;
}
}
.water-list__item.is-seq_01 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
background-position: right;
background-repeat: no-repeat;
margin: 50px 0 !important;
padding: 40px !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_01 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item.is-seq_02 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
padding: 40px !important;
background-position: left;
background-repeat: no-repeat;
margin: 50px 0 !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_02 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item.is-seq_03 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
padding: 40px !important;
background-position: right;
background-repeat: no-repeat;
margin: 50px 0 !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_03 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item.is-seq_04 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
padding: 40px !important;
background-position: left;
background-repeat: no-repeat;
margin: 50px 0 !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_04 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item.is-seq_05 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
padding: 40px !important;
background-position: right;
background-repeat: no-repeat;
margin: 50px 0 !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_05 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item.is-seq_06 {
position: relative;
background: linear-gradient(90deg, #f0fbff, #f7f7ff);
background-size: 60%;
padding: 40px !important;
background-position: left;
background-repeat: no-repeat;
margin: 50px 0 !important;
}
@media screen and (max-width: 590px) {
.water-list__item.is-seq_06 {
margin: 0 !important;
background-size: 100%;
padding: 10px !important;
}
}
.water-list__item_box {
background: #fff;
padding: 40px;
}
@media screen and (max-width: 590px) {
.water-list__item_box {
padding: 20px;
margin-bottom: 0;
}
}
.water-list__item_box .headline_list_02 {
color: #175190;
margin-bottom: 5rem;
font-weight: normal;
font-size: 4rem;
}
@media screen and (max-width: 590px) {
.water-list__item_box .headline_list_02 {
line-height: 1;
text-align: center;
margin-bottom: 20px;
font-size: 22px;
}
}
.water-list__item_box .headline_list_02 .headline_wrap {
display: flex;
align-items: center;
}
@media screen and (max-width: 590px) {
.water-list__item_box .headline_list_02 .headline_wrap {
flex-direction: column;
row-gap: 4px;
}
}
.water-list__item_box .headline_list_02 .headline_text_sub {
display: block;
font-size: 2.4rem;
margin-top: 1rem;
}
@media screen and (max-width: 590px) {
.water-list__item_box .headline_list_02 .headline_text_sub {
font-size: 18px;
}
}
.water-list__item_box .headline_list_02 .headline_mark_01 {
font-size: 1.5rem;
color: #CC4444;
border: 1px solid #D35B5B;
padding: 3px 16px;
line-height: 1.333;
font-weight: bold;
display: inline-block;
margin-top: 1rem;
}
@media screen and (max-width: 590px) {
.water-list__item_box .headline_list_02 .headline_mark_01 {
font-size: 1.2rem;
margin-top: 0.6rem;
padding: 2px 12px;
}
}
.water-list__item_box .m-sp_item_image img {
display: none;
}
@media screen and (max-width: 768px) {
.water-list__item_box .m-sp_item_image img {
max-height: 300px;
display: block;
margin: 20px auto;
}
}
.water-list__item_box__catch {
margin-bottom: 1.6rem;
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.water-list__item_box__catch {
font-size: 16px;
line-height: 28px;
}
}
.water-list__item_box__spec {
margin-bottom: 2rem;
}
.water-list__item_box__spec__item {
color: #fff;
border-radius: 2px;
background: #175190;
padding: 0.2rem 1.6rem 0;
font-size: 1.3rem;
margin-bottom: 1.8rem;
height: 32px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.water-list__item_box__spec__item {
padding: 0.1rem 1rem 0;
font-size: 1.2rem;
margin-bottom: 1rem;
height: 27px;
line-height: 27px;
}
}
.water-list__item_box__data {
margin-bottom: 2rem;
}
.water-list__item_box__data dt {
float: left;
}
.water-list__item_box__data dt:first-child {
margin-bottom: 1rem;
}
@media screen and (max-width: 590px) {
.water-list__item_box__data dt {
float: none;
margin-bottom: 1rem;
}
}
.water-list__item_box__data dd {
margin-left: 13rem;
display: flex;
}
.water-list__item_box__data dd:first-of-type {
margin-bottom: 1rem;
}
.water-list__item_box__data dd span {
font-size: 1.4rem;
}
@media screen and (max-width: 590px) {
.water-list__item_box__data dd {
margin-left: 0;
}
}
.water-list__item_box__data__colors {
font-size: 1.4rem;
max-width: 35rem;
margin-left: 0;
}
.water-list__item_box__data__colors__item {
position: relative;
padding-left: 2.5rem;
margin-bottom: 1rem;
}
.water-list__item_box__data__colors__item:before {
position: absolute;
content: "";
border: 1px solid #707070;
width: 2rem;
height: 2rem;
border-radius: 50%;
left: 0;
top: 0;
}
.water-list__item_box__data__colors__item.p-white:before {
background: #FFFFFF;
}
.water-list__item_box__data__colors__item.p-shilver:before {
background: #DBDBDB;
}
.water-list__item_box__data__colors__item.b-pink:before {
background: #FFEAEA;
}
.water-list__item_box__data__colors__item.p-black:before {
background: #000000;
}
.water-list__item_box__data__colors__item.white:before {
background: #fff;
}
.water-list__item_box__data__colors__item.black:before {
background: #000000;
}
.water-list__item_box__data__colors__item.brown:before {
background: #753E34;
}
.water-list__item_box__data__colors__item.chocolate:before {
background: #5c1e13;
}
.water-list__item_box__data__colors__item.red:before {
background: #C41E28;
}
.water-list__item_box__data__colors__item.wine:before {
background: #B70A10;
}
@media screen and (max-width: 590px) {
.water-list__item_box__button {
margin-bottom: 2rem;
}
}
.water-list__item__under_button {
width: 100%;
margin-top: 10px;
padding-right: 0px;
padding-left: 0px;
margin-bottom: 40px;
}
.water-list__item__under_button .m-btn_wrap {
margin: 0px auto;
padding: 0px;
}
.water-list__img {
display: flex;
justify-content: center;
align-items: flex-end;
}
.water-list__img img {
width: auto;
height: 600px;
}
@media screen and (max-width: 768px) {
.water-list__img img {
display: none;
}
}
.water-list #water-list__item_02 .headline_list_02 {
margin-bottom: 1rem;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_02 .headline_list_02 {
margin-bottom: 0;
}
}
.water-list #water-list__item_02 .water-list__item_box__catch {
margin-top: 50px;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_02 .water-list__item_box__catch {
margin-top: 20px;
}
}
.water-list #water-list__item_03 .headline_list_02 {
margin-bottom: 1rem;
}
.water-list #water-list__item_03 .headline_list_02 span {
margin-bottom: 10px;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_03 .headline_list_02 {
margin-bottom: 0;
}
}
.water-list #water-list__item_03 .water-list__item_box__catch {
margin-top: 50px;
}
.water-list #water-list__item_04 .headline_list_02 {
margin-bottom: 1rem;
}
.water-list #water-list__item_04 .headline_list_02 span {
margin-bottom: 10px;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_04 .headline_list_02 {
margin-bottom: 0;
}
}
.water-list #water-list__item_04 .water-list__item_box__catch {
margin-top: 50px;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_04 .water-list__item_box__catch {
margin-top: 20px;
}
}
.water-list #water-list__item_05 .headline_list_02 {
margin-bottom: 1rem;
}
.water-list #water-list__item_05 .headline_list_02 span {
margin-bottom: 10px;
}
@media screen and (max-width: 590px) {
.water-list #water-list__item_05 .headline_list_02 {
margin-bottom: 0;
}
}
.water-list #water-list__item_05 .water-list__item_box__catch {
margin-top: 50px;
} .water-product {
font-size: 1.6rem;
padding-bottom: 7.5rem;
}
.water-product .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .water-product .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 1.8rem;
}
.water-product .headline_product_01 {
font-size: 4.4rem;
}
@media screen and (max-width: 590px) {
.water-product .headline_product_01 {
font-size: 3.6rem;
}
}
.water-product .headline_product_02 {
color: #175190;
font-size: 4rem;
font-weight: 300;
line-height: 1.6;
}
@media screen and (max-width: 590px) {
.water-product .headline_product_02 {
font-size: 24px;
margin-bottom: 0;
}
}
.water-product .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.water-product__header {
padding: 3.8rem 0 2.8rem;
}
.water-product__header__back {
font-size: 1.8rem;
font-weight: bold;
position: relative;
margin-bottom: 1.5rem;
}
.water-product__header__back a {
position: relative;
padding-left: 3.5rem;
}
.water-product__header__back a:before {
position: absolute;
left: 0;
top: calc(50% - 2.4rem);
font-family: "Font Awesome 5 Free";
text-align: center;
content: "\f053";
font-size: 3rem;
color: #333;
}
.water-product__bottom_btns.container {
margin-top: 7.5rem;
}
.water-product__hero {
background: linear-gradient(90deg, #F0FBFF, #F7F7FF);
}
@media screen and (max-width: 590px) {
.water-product__hero {
padding: 40px 0 !important;
}
}
.water-product__hero .container {
max-width: 1400px;
padding: 0 40px;
}
@media screen and (max-width: 590px) {
.water-product__hero .container {
padding-left: 15px;
padding-right: 15px;
}
}
.water-product__hero__wrapper {
align-items: flex-start;
}
@media screen and (max-width: 590px) {
.water-product__hero__wrapper {
align-items: flex-start;
}
}
.water-product__hero__text {
width: 45%;
padding-right: 40px;
}
@media screen and (max-width: 960px) {
.water-product__hero__text {
flex: 0 0 100%;
max-width: 100%;
margin-right: 0;
}
}
.water-product__hero__cates {
display: flex;
column-gap: 10px;
}
@media screen and (max-width: 590px) {
.water-product__hero__cates {
margin-top: 20px;
}
}
.water-product__hero__cates2 {
display: flex;
}
@media screen and (max-width: 590px) {
.water-product__hero__cates2 {
margin-top: 10px;
}
}
.water-product__hero__cates2 li {
width: 130px;
}
.water-product__hero__mark_01 {
font-size: 1.5rem;
color: #CC4444;
background: #fff;
border: 1px solid #D35B5B;
margin-top: 0.6rem;
padding: 3px 16px;
line-height: 1.333;
font-weight: bold;
display: inline-block;
}
@media screen and (max-width: 590px) {
.water-product__hero__mark_01 {
font-size: 1.2rem;
margin-top: 0;
margin-bottom: 1.6rem;
padding: 2px 12px;
}
}
.water-product__hero__cate {
padding: 4px 8px 2px 8px;
color: #175190;
background-color: #ccc;
font-size: 14px;
}
.water-product__hero__cate.long {
width: 160px;
}
.water-product__hero__cate.short {
width: 92px;
}
.water-product__hero__img {
width: 55%;
padding-bottom: 40px;
}
@media screen and (max-width: 960px) {
.water-product__hero__img {
width: 100%;
margin-bottom: 50px;
}
}
.water-product__hero__box .sp-only {
display: none;
}
@media screen and (max-width: 960px) {
.water-product__hero__box {
padding: 0 15px;
}
.water-product__hero__box .sp-only {
display: block;
}
.water-product__hero__box.pc-only {
display: none;
}
}
.water-product__hero__box__catch {
margin-top: 80px;
line-height: 2;
}
@media screen and (max-width: 590px) {
.water-product__hero__box__catch {
margin-top: 40px;
}
}
.water-product__hero__box__icons {
margin-top: 16px;
}
.water-product__hero__box__icons__item {
display: flex;
justify-content: center;
align-items: flex-start;
width: 80px;
height: auto;
margin-right: 10px;
}
.water-product__hero__box__icons__item:last-child {
margin-right: 0;
}
.water-product__hero__box__icons__item img {
width: 100%;
height: auto;
}
@media screen and (max-width: 590px) {
.water-product__hero__box__icons {
margin-top: 20px;
width: 100%;
}
}
.water-product__hero__box__data {
display: flex;
flex-wrap: wrap;
margin-top: 20px;
}
.water-product__hero__box__data dt {
margin-top: 10px;
width: 40%;
}
.water-product__hero__box__data dd {
margin-top: 10px;
width: 60%;
}
.water-product__hero__box__data dd span {
font-size: 1.4rem;
}
@media screen and (max-width: 590px) {
.water-product__hero__box__data dd br.pc-only {
Display: none;
}
}
.water-product__hero__box__data__colors {
font-size: 1.4rem;
max-width: 35rem;
margin-left: 0;
}
.water-product__hero__box__data__colors__item {
position: relative;
padding-left: 2.5rem;
margin-bottom: 1.3rem;
}
.water-product__hero__box__data__colors__item:before {
position: absolute;
content: "";
border: 1px solid #707070;
width: 2rem;
height: 2rem;
border-radius: 50%;
left: 0;
top: 0;
}
.water-product__hero__box__data__colors__item.p-white:before {
background: #FFFFFF;
}
.water-product__hero__box__data__colors__item.p-shilver:before {
background: #DBDBDB;
}
.water-product__hero__box__data__colors__item.b-pink:before {
background: #FFEAEA;
}
.water-product__hero__box__data__colors__item.p-black:before {
background: #000000;
}
.water-product__hero__box__data__colors__item.white:before {
background: #fff;
}
.water-product__hero__box__data__colors__item.black:before {
background: #000000;
}
.water-product__hero__box__data__colors__item.brown:before {
background: #753E34;
}
.water-product__hero__box__data__colors__item.chocolate:before {
background: #5c1e13;
}
.water-product__hero__box__data__colors__item.red:before {
background: #C41E28;
}
.water-product__hero__box__data__colors__item.wine:before {
background: #B70A10;
}
@media screen and (max-width: 590px) {
.water-product__hero__box__data dt {
margin-top: 20px;
width: 100%;
}
.water-product__hero__box__data dd {
width: 100%;
}
.water-product__hero__box__data__colors__item {
width: 100%;
}
}
.water-product__hero__box .swiper-outer {
height: 70rem;
position: relative;
}
@media screen and (max-width: 960px) {
.water-product__hero__box .swiper-outer {
height: 50vh;
}
}
.water-product__hero__box .swiper-slide {
overflow: hidden;
}
@media screen and (max-width: 960px) {
.water-product__hero__box .swiper-slide {
height: 50vh;
}
}
.water-product__hero__box .swiper-slide img {
display: block;
margin: auto;
width: 100%;
max-width: 100%;
object-fit: contain;
height: auto;
}
@media screen and (max-width: 960px) {
.water-product__hero__box .swiper-slide img {
width: auto;
height: 100%;
}
}
.water-product__hero__box .swiper-button-prev, .water-product__hero__box .swiper-button-next {
width: 4.7rem;
height: 4.7rem;
border-radius: 50%;
margin-top: -16px;
background: #fff;
box-shadow: 0 0 2px 3px rgba(0, 0, 0, 0.16);
opacity: 1;
z-index: 1;
}
.water-product__hero__box .swiper-button-prev:after, .water-product__hero__box .swiper-button-next:after {
position: absolute;
content: "";
top: calc(50% - 8px);
width: 16px;
height: 16px;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.water-product__hero__box .swiper-button-prev {
left: -23.5px;
}
.water-product__hero__box .swiper-button-prev:after {
left: 1.8rem;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.water-product__hero__box .swiper-button-next {
right: -23.5px;
}
.water-product__hero__box .swiper-button-next:after {
right: 1.8rem;
}
.water-product__hero__box .swiper-pagination-bullets {
position: relative;
margin-top: 10px;
text-align: center;
}
.water-product__hero__box .swiper-pagination-bullet {
margin: 0 1.8rem;
width: 9px;
height: 9px;
background-color: #707070;
border-radius: 50%;
opacity: 1;
vertical-align: middle;
}
.water-product__hero__box .swiper-pagination-bullet.swiper-pagination-bullet-active {
width: 13px;
height: 13px;
background-color: #fff;
border: 2px solid #707070;
}
.water-product__hero__box .swiper-pagination-bullet {
margin: 0 1.8rem;
}
.water-product__hero__sub {
margin-top: 11rem;
padding: 5rem 7rem;
background: #fff;
}
.water-product__hero__sub__heading {
color: #11A9da;
font-size: 2.4rem;
margin-bottom: 2.6rem;
}
.water-product__hero__sub__read {
line-height: 2em;
}
@media screen and (max-width: 590px) {
.water-product__hero__sub {
margin: 0 5px;
padding: 20px 10px;
}
.water-product__hero__sub__heading {
font-size: 18px;
line-height: 30px;
}
}
.water-product__hero__tips {
margin: 9rem 5rem 0;
display: flex;
justify-content: space-between;
}
.water-product__hero__tips__item {
position: relative;
display: flex;
justify-content: flex-end;
flex-flow: column;
padding: 20px;
width: 33%;
height: 400px;
}
.water-product__hero__tips__item_filter {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
z-index: 1;
}
.water-product__hero__tips__item:first-child {
background-blend-mode: multiply;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/amadana-007.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 60%);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.water-product__hero__tips__item:nth-child(2) {
background-blend-mode: multiply;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/amadana-008.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 60%);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.water-product__hero__tips__item:nth-child(3) {
background-blend-mode: multiply;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/amadana-009.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 60%);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.water-product__hero__tips__item__heading_01 {
position: absolute;
top: -50px;
left: 0;
padding-left: 40px;
color: #175190;
font-size: 60px;
letter-spacing: 1px;
font-weight: bold;
transform: scale(1.2, 1);
z-index: 2;
}
.water-product__hero__tips__item__heading_02 {
width: 100%;
font-size: 34px;
color: #fff;
z-index: 2;
}
.water-product__hero__tips__item__read {
margin-top: 20px;
width: 100%;
color: #fff;
line-height: 28px;
z-index: 2;
font-size: 16px;
}
@media screen and (max-width: 590px) {
.water-product__hero__tips {
margin: 0;
justify-content: flex-start;
flex-flow: column;
}
.water-product__hero__tips__item {
margin-top: 60px;
padding: 40px 20px 20px 20px;
width: 100%;
height: auto;
}
.water-product__hero__tips__item:first-child {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/hero_office.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%);
}
.water-product__hero__tips__item:nth-child(2) {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/hero_living.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%);
}
.water-product__hero__tips__item:nth-child(3) {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/water_servers/amadana_server/hero_shop.png), linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 30%);
}
.water-product__hero__tips__item__heading_01 {
top: -30px;
padding-left: 20px;
font-size: 30px;
line-height: 22px;
}
.water-product__hero__tips__item__heading_02 {
font-size: 22px;
}
.water-product__hero__tips__item__read {
font-size: 14px;
line-height: 24px;
}
}
.water-product__sec .headline_1 {
margin-bottom: 3.7rem;
}
@media screen and (max-width: 590px) {
.water-product__sec {
padding: 40px !important;
}
}
@media screen and (max-width: 960px) {
.water-product__feature__item {
padding: 40px 0;
}
}
.water-product__feature__item .container {
max-width: 1400px;
width: 100%;
padding: 4rem 12rem;
position: relative;
clear: both;
overflow: hidden;
}
@media screen and (max-width: 960px) {
.water-product__feature__item .container {
padding: 1.5rem;
}
}
.water-product__feature__item .container:before {
position: absolute;
content: "";
background-color: #eaf7ff;
width: 60%;
height: 100%;
z-index: 0;
top: 0;
}
@media screen and (max-width: 590px) {
.water-product__feature__item .container:before {
background: none;
}
}
.water-product__feature__item__text {
max-width: 58.071%;
position: relative;
}
@media screen and (max-width: 960px) {
.water-product__feature__item__text {
margin-left: auto;
margin-right: auto;
margin-bottom: 2rem;
width: 90%;
}
}
.water-product__feature__item__text__header {
flex-flow: column-reverse;
}
.water-product__feature__item__text__header__headline {
color: #175190;
font-size: 35px;
line-height: 2em;
}
@media screen and (max-width: 960px) {
.water-product__feature__item__text__header__headline {
font-size: 3.2rem;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item__text__header__headline {
font-size: 22px;
}
}
.water-product__feature__item__text__header__num {
color: #11A9da;
font-weight: bold;
font-size: 1.6rem;
position: relative;
margin-bottom: 2.5rem;
}
.water-product__feature__item__text__header__num:before {
position: absolute;
content: "";
background-color: #11A9da;
height: 2px;
width: 25px;
left: 0;
bottom: -4px;
}
.water-product__feature__item__text__header__num span {
font-size: 2.4rem;
padding-left: 0.5rem;
}
.water-product__feature__item__text__lead {
margin-top: 40px;
line-height: 2;
}
@media screen and (max-width: 590px) {
.water-product__feature__item__text__lead {
margin-top: 20px;
}
}
.water-product__feature__item__text__sub {
line-height: 2;
margin-top: 2.3rem;
}
.water-product__feature__item__text .note {
margin-top: 2rem;
}
.water-product__feature__item__img {
max-width: 38%;
position: relative;
flex-shrink: 0;
}
.water-product__feature__item__img img {
max-width: 100%;
width: 100%;
height: auto;
}
.water-product__feature__item:nth-child(even) .container:before {
left: 0;
}
.water-product__feature__item:nth-child(even) .water-product__feature__item__text {
float: right;
}
@media screen and (max-width: 960px) {
.water-product__feature__item:nth-child(even) .water-product__feature__item__text {
float: none;
max-width: 100%;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item:nth-child(even) .water-product__feature__item__text {
max-width: 100%;
width: 100%;
margin: 0 0 20px;
}
}
.water-product__feature__item:nth-child(even) .water-product__feature__item__img {
float: left;
}
@media screen and (max-width: 960px) {
.water-product__feature__item:nth-child(even) .water-product__feature__item__img {
float: none;
max-width: 65%;
margin: 0 auto;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item:nth-child(even) .water-product__feature__item__img {
float: none;
max-width: 100%;
margin: 0 !important;
width: 100%;
}
}
.water-product__feature__item:nth-child(odd) .container:before {
right: 0;
}
.water-product__feature__item:nth-child(odd) .water-product__feature__item__text {
float: left;
}
@media screen and (max-width: 960px) {
.water-product__feature__item:nth-child(odd) .water-product__feature__item__text {
float: none;
max-width: 100%;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item:nth-child(odd) .water-product__feature__item__text {
float: none;
max-width: 100%;
width: 100%;
margin: 0 0 20px;
}
}
.water-product__feature__item:nth-child(odd) .water-product__feature__item__img {
float: right;
}
@media screen and (max-width: 960px) {
.water-product__feature__item:nth-child(odd) .water-product__feature__item__img {
float: none;
max-width: 65%;
margin: 0 auto;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item:nth-child(odd) .water-product__feature__item__img {
max-width: 100%;
}
}
.water-product__feature__item.water-product__cado {
padding: 0;
}
.water-product__feature__item.water-product__cado .water-product__feature__item__text {
width: 40%;
}
.water-product__feature__item.water-product__cado .water-product__feature__item__img {
padding-right: 5%;
padding-left: 10%;
width: 60%;
max-width: 60%;
height: 500px;
}
.water-product__feature__item.water-product__cado#water-product__item__feature__07 .water-product__feature__item__text {
width: 29%;
max-width: 29%;
}
@media screen and (max-width: 960px) {
.water-product__feature__item.water-product__cado#water-product__item__feature__07 .water-product__feature__item__text {
width: 100%;
max-width: 100%;
}
}
.water-product__feature__item.water-product__cado#water-product__item__feature__07 .water-product__feature__item__img {
float: right;
}
@media screen and (max-width: 960px) {
.water-product__feature__item.water-product__cado#water-product__item__feature__07 .water-product__feature__item__img {
float: none;
margin-right: auto;
max-width: 90%;
}
}
.water-product__feature__item.water-product__cado .swiper-outer {
position: relative;
}
@media screen and (max-width: 960px) {
.water-product__feature__item.water-product__cado .swiper-outer {
height: auto;
}
}
.water-product__feature__item.water-product__cado .swiper-slide {
overflow: hidden;
}
@media screen and (max-width: 960px) {
.water-product__feature__item.water-product__cado .swiper-slide {
height: auto;
}
}
.water-product__feature__item.water-product__cado .swiper-slide img {
left: -50%;
right: -50%;
margin: auto;
}
.water-product__feature__item.water-product__cado .swiper-button-prev, .water-product__feature__item.water-product__cado .swiper-button-next {
width: 4.7rem;
height: 4.7rem;
border-radius: 50%;
margin-top: 0;
top: 50%;
margin-top: -3.95rem;
background: #fff;
box-shadow: 0 0 2px 3px rgba(0, 0, 0, 0.16);
opacity: 1;
z-index: 1;
}
.water-product__feature__item.water-product__cado .swiper-button-prev:after, .water-product__feature__item.water-product__cado .swiper-button-next:after {
position: absolute;
content: "";
width: 16px;
height: 16px;
top: 50%;
margin-top: -0.8rem;
border-top: 2px solid #707070;
border-right: 2px solid #707070;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.water-product__feature__item.water-product__cado .swiper-button-prev {
left: -23.5px;
}
.water-product__feature__item.water-product__cado .swiper-button-prev:after {
left: 1.8rem;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.water-product__feature__item.water-product__cado .swiper-button-next {
right: -23.5px;
}
.water-product__feature__item.water-product__cado .swiper-button-next:after {
right: 1.8rem;
}
.water-product__feature__item.water-product__cado .swiper-pagination-bullets {
position: relative;
margin-top: 2.3rem;
}
.water-product__feature__item.water-product__cado .swiper-pagination-bullet {
margin: 0 1.8rem;
width: 9px;
height: 9px;
background-color: #707070;
border-radius: 50%;
opacity: 1;
vertical-align: middle;
}
.water-product__feature__item.water-product__cado .swiper-pagination-bullet.swiper-pagination-bullet-active {
width: 13px;
height: 13px;
background-color: #fff;
border: 2px solid #707070;
}
.water-product__feature__item.water-product__cado .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.water-product__feature__item.water-product__cado .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 1.8rem;
}
@media screen and (max-width: 960px) {
.water-product__feature__item.water-product__cado .water-product__feature__item__text {
padding: 0 40px;
width: 100%;
}
.water-product__feature__item.water-product__cado .water-product__feature__item__img {
margin-bottom: 20px;
padding-right: 5%;
padding-left: 5%;
width: 100%;
max-width: 100%;
height: auto;
}
}
@media screen and (max-width: 590px) {
.water-product__feature__item.water-product__cado .water-product__feature__item__text {
padding: 0 20px;
}
}
@media screen and (max-width: 590px) {
.water-product__feature {
padding: 40px 0 !important;
}
}
.water-product__variation {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/top/about_bg.png) no-repeat center center/cover;
color: #fff;
text-align: center;
}
@media screen and (max-width: 590px) {
.water-product__variation {
padding: 40px 20px !important;
}
}
.water-product__variation .container {
padding: 0;
}
.water-product__variation__headline {
font-size: 2.8rem;
margin-bottom: 1.5rem;
}
@media screen and (max-width: 590px) {
.water-product__variation__headline {
font-size: 20px;
text-align: center;
}
}
.water-product__variation__lead {
text-align: center;
line-height: 2;
}
@media screen and (max-width: 960px) {
.water-product__variation__lead {
text-align: left;
}
.water-product__variation__lead br {
display: none;
}
}
.water-product__variation__list {
text-align: left;
margin-top: 40px;
margin-bottom: 3rem;
}
.water-product__variation__items {
justify-content: center;
margin: 0;
}
@media screen and (max-width: 960px) {
.water-product__variation__items {
justify-content: space-between;
}
}
.water-product__variation__item {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-color: #fff;
width: 23%;
padding: 1.5rem 1rem;
border-radius: 4px;
text-align: center;
}
.water-product__variation__item:not(:last-of-type) {
margin-right: 2%;
}
@media screen and (max-width: 960px) {
.water-product__variation__item:not(:last-of-type) {
margin-right: 0;
}
}
@media screen and (max-width: 960px) {
.water-product__variation__item {
width: 48%;
margin-bottom: 2rem;
}
}
@media screen and (max-width: 590px) {
.water-product__variation__item {
width: 100%;
}
.water-product__variation__item:not(:last-of-type) {
margin-bottom: 2rem;
}
}
.water-product__variation__item img {
width: 100%;
max-width: 96px;
height: auto;
}
@media screen and (max-width: 960px) {
.water-product__variation__item img {
width: 30%;
}
}
.water-product__variation__name {
margin-top: 2rem;
color: #838383;
font-size: 1.8rem;
}
.water-product__variation .water-product__sec__button {
margin-top: 7.5rem;
}
@media screen and (max-width: 960px) {
.water-product__variation .water-product__sec__button {
margin-top: 0;
padding: 0;
}
}
@media screen and (max-width: 590px) {
.water-product__spec {
padding: 20px 0 !important;
}
}
.water-product__spec__text {
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.water-product__spec__text .table {
border: 1px solid #707070;
margin-bottom: 2.5rem;
font-size: 1.4rem;
}
@media screen and (max-width: 590px) {
.water-product__spec__text .table {
width: 100%;
}
}
.water-product__spec__text .table th, .water-product__spec__text .table td {
border: 1px solid #707070;
padding: 1.8rem 2.5rem;
}
@media screen and (max-width: 960px) {
.water-product__spec__text .table th, .water-product__spec__text .table td {
padding: 1.5rem;
}
}
.water-product__spec__text .table th {
background: #175190;
color: #fff;
}
@media screen and (max-width: 590px) {
.water-product__spec__text .table th {
width: 34%;
}
}
.water-product__spec__text .table td {
background: #F7F7F7;
line-height: 2;
}
@media screen and (max-width: 960px) {
.water-product__spec__text {
margin: 0 auto 2rem;
flex: 0 0 75%;
max-width: 75%;
}
}
@media screen and (max-width: 590px) {
.water-product__spec__text {
flex: 0 0 100%;
max-width: 100%;
}
}
.water-product__spec__img {
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
@media screen and (max-width: 960px) {
.water-product__spec__img {
flex: 0 0 65%;
max-width: 65%;
}
}
@media screen and (max-width: 590px) {
.water-product__spec__img {
flex: 0 0 100%;
max-width: 100%;
padding: 10px;
}
}
.water-product__spec__img img {
max-width: 100%;
height: auto;
}
.water-product__design {
background: #EAF7FF;
margin: 0 5rem 7rem;
}
@media screen and (max-width: 960px) {
.water-product__design {
margin: 0 2rem 7rem;
}
}
@media screen and (max-width: 590px) {
.water-product__design {
margin: 0;
padding: 40px 0 !important;
}
}
.water-product__design__inner {
background: #eaf7ff;
}
@media screen and (max-width: 590px) {
.water-product__design .flow-wrap_tab-only {
padding-left: 15px;
padding-right: 15px;
}
}
.water-product__design .flow-wrap_tab-only .slide-water {
padding-bottom: 10px;
}
.water-product__design__item {
margin-top: 20px;
display: flex;
flex-wrap: wrap;
gap: 40px 0;
padding: 0 15px;
justify-content: center;
}
.water-product__design__item li {
display: flex;
justify-content: center;
align-items: flex-end;
padding: 0 0 3rem;
width: 180px;
}
@media screen and (max-width: 1390px) {
.water-product__design__item li {
flex: 1;
}
}
@media screen and (max-width: 590px) {
.water-product__design__item {
display: none;
}
.water-product__design__item li {
margin-top: 40px;
width: 100%;
}
}
.water-product__design__item_icon {
display: flex;
justify-content: center;
align-items: flex-end;
}
.water-product__design__item_icon img {
width: 80%;
max-width: 100px;
height: auto;
}
.water-product__design__text {
font-size: 20px;
font-weight: 600;
line-height: 34px;
}
@media screen and (max-width: 960px) {
.water-product__design__text {
padding: 0 2rem;
font-size: 16px;
font-weight: 600;
line-height: 28px;
}
}
.water-product__design .water_servername {
font-size: 18px;
color: #838383;
margin-top: 40px;
font-weight: 500;
text-align: center;
position: relative;
color: #333;
}
@media screen and (min-width: 960.1px) {
.water-product__design .water_servername {
height: 54px;
display: flex;
align-items: center;
}
}
@media screen and (max-width: 960px) {
.water-product__design .water_servername {
margin-bottom: 7rem;
}
}
.water-product__design .water_servername:before {
content: "";
position: absolute;
bottom: -3rem;
left: 0;
margin-left: calc(50% - 1.3rem);
width: 2.6rem;
height: 2.6rem;
border-radius: 50%;
background: #2D77C1;
}
.water-product__design .water_servername:after {
content: "";
position: absolute;
bottom: -2.15rem;
left: 50%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(45deg);
-webkit-transform: translateX(-50%) rotate(45deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
.water-product__design__button {
margin-top: 60px;
}
@media screen and (max-width: 960px) {
.water-product__design__button {
margin-top: 20px;
}
} .water-price_plan__header {
padding-top: 0 !important;
}
.water-price_plan .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
@media screen and (max-width: 590px) {
.water-price_plan__sec#water-price_plan__sec_01 {
padding-bottom: 4rem;
}
}
.water-price_plan__sec__inner {
margin-top: 40px;
padding: 40px 0;
position: relative;
}
.water-price_plan__sec__inner:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 70%;
height: 100%;
z-index: 0;
background-color: #eaf7ff;
}
@media screen and (max-width: 960px) {
.water-price_plan__sec__inner:before {
width: 90%;
}
}
.water-price_plan__sec__inner .container {
position: relative;
z-index: 1;
display: flex;
}
@media screen and (max-width: 590px) {
.water-price_plan__sec__inner .container {
padding-left: 0;
}
}
@media screen and (max-width: 590px) {
.water-price_plan__sec__inner .container .row {
margin: 0;
}
}
.water-price_plan__sec__img img {
width: auto;
height: 500px;
}
.water-price_plan__sec__box {
padding: 40px;
background-color: #fff;
}
.water-price_plan__sec__text {
margin-top: 4rem;
}
.water-price_plan__sec__text .table {
font-size: 2rem;
border: 1px solid #707070;
}
.water-price_plan__sec__text .table th, .water-price_plan__sec__text .table td {
border: 1px solid #707070;
vertical-align: middle;
}
.water-price_plan__sec__text .table th {
background: #E8E8E8;
padding: 1.8rem 3rem 0.5rem;
}
.water-price_plan__sec__text .table th span {
font-size: 1.3rem;
}
.water-price_plan__sec__text .table td {
padding: 1.8rem 1.8rem 0.5rem;
}
.water-price_plan__sec__text .table td span {
font-size: 1.4rem;
}
.water-price_plan__sec__button {
margin: 40px auto 0 auto;
}
@media screen and (max-width: 960px) {
.water-price_plan__sec__img {
text-align: center;
}
.water-price_plan__sec__img img {
width: 50% !important;
height: auto;
}
.water-price_plan__sec__text {
margin-top: 4rem;
}
.water-price_plan__sec__text .table th, .water-price_plan__sec__text .table td {
padding: 6px 20px 10px 20px;
}
.water-price_plan__sec__text .table th {
font-weight: normal;
font-size: 18px;
}
.water-price_plan__sec__text .table td {
font-size: 16px;
}
}
@media screen and (max-width: 590px) {
.water-price_plan__sec__inner {
width: 100%;
margin-top: 0;
padding: 40px 20px !important;
position: relative;
}
.water-price_plan__sec__inner .container {
padding: 0;
}
.water-price_plan__sec__text .table {
display: flex;
flex-wrap: wrap;
justify-content: center;
border: 0;
}
.water-price_plan__sec__text .table th, .water-price_plan__sec__text .table td {
display: block;
border-top: 1px solid #707070;
border-right: 1px solid #707070;
border-bottom: 1px solid #707070;
border-left: 1px solid #707070;
}
}
.water-price_plan__sec.postage {
background: linear-gradient(90deg, #F0FBFF, #F7F7FF);
}
.water-price_plan__sec.postage .table {
width: 100%;
margin-top: 4rem;
margin-bottom: 0;
border: 1px solid #707070;
}
.water-price_plan__sec.postage .table thead th {
background: #212671;
color: #fff;
vertical-align: middle;
padding: 1rem 0;
line-height: 1;
font-size: 1.8rem;
font-weight: normal;
}
.water-price_plan__sec.postage .table thead th.loc {
background: #343BA2;
font-size: 1.6rem;
}
@media screen and (max-width: 590px) {
.water-price_plan__sec.postage .table thead th.loc {
font-size: 1.3rem;
}
}
.water-price_plan__sec.postage .table th, .water-price_plan__sec.postage .table td {
border-left: 1px solid #707070;
border-right: 1px solid #707070;
border-bottom: none;
border-top: none;
text-align: center;
vertical-align: middle;
}
.water-price_plan__sec.postage .table td {
padding: 1.5rem 2.6rem;
font-size: 1.5rem;
}
.water-price_plan__sec.postage .table td:nth-of-type(2) {
text-align: left;
}
.water-price_plan__sec.postage .table tbody tr:nth-child(even) {
background: #F4F4F4;
}
.water-price_plan__sec.postage .table tbody tr:nth-child(odd) {
background: #fff;
}
.water-price_plan__sec.postage .table .grey {
background: #D0CECE;
}
.water-price_plan__sec.postage .table__sp-only__wrapper {
display: none;
}
@media screen and (max-width: 960px) {
.water-price_plan__sec.postage .table__pc-only {
display: none;
}
.water-price_plan__sec.postage .table__sp-only {
width: 100%;
border: 0;
margin: 40px auto 0 auto;
padding: 0;
}
.water-price_plan__sec.postage .table__sp-only__wrapper {
display: block;
}
.water-price_plan__sec.postage .table__sp-only th, .water-price_plan__sec.postage .table__sp-only td {
display: block;
width: 100%;
padding: 10px;
}
.water-price_plan__sec.postage .table__sp-only th {
background: #212671;
color: #fff;
vertical-align: middle;
line-height: 1;
text-align: left;
border-top: 1px solid #707070;
border-right: 1px solid #707070;
font-weight: normal;
}
.water-price_plan__sec.postage .table__sp-only th.type {
background: rgba(33, 38, 113, 0.5);
}
}
@media screen and (max-width: 590px) {
.water-price_plan__sec.postage {
padding: 40px 20px !important;
}
.water-price_plan__sec.postage .table__sp-only tr, .water-price_plan__sec.postage .table__sp-only th, .water-price_plan__sec.postage .table__sp-only td {
display: block;
text-align: center;
width: 100% !important;
font-size: 14px;
}
}
.water-price_plan__sec .note {
margin-top: 2rem;
line-height: 2em;
}
.water-price_plan__sec .note_black {
font-size: 1.4rem;
margin-top: 2rem;
line-height: 2em;
}
@media screen and (max-width: 590px) {
.water-price_plan__sec__inner {
margin-top: 0;
padding-bottom: 0 !important;
height: auto;
background-image: none;
}
.water-price_plan__sec__inner:before {
content: none;
}
.water-price_plan__sec__inner .container {
display: block;
background: none;
height: auto;
}
.water-price_plan__sec__box {
margin-top: 0;
padding: 20px;
}
.water-price_plan__sec__text {
margin-top: 20px;
}
.water-price_plan__sec__img {
display: block;
margin-top: 2rem;
}
.water-price_plan__sec__img img {
width: 100%;
height: auto;
}
.water-price_plan__sec .note {
margin-top: 20px;
}
}
.water-price_plan__sec__button {
padding: 0;
}
.water-price_plan__sec__button:not(:last-of-type) {
margin-top: 4rem;
} .water-about {
font-size: 1.6rem;
}
.water-about-header {
padding-top: 0 !important;
}
.water-about__sec {
padding: 7rem 0;
}
.water-about .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.water-about .headline_about_02 {
color: #175190;
font-size: 40px;
margin-bottom: 5rem;
margin-bottom: 2.8rem;
line-height: 1.6;
text-align: center;
}
.water-about .headline_about_02 br {
display: none;
}
@media screen and (max-width: 960px) {
.water-about .headline_about_02 br {
display: block;
}
}
@media screen and (max-width: 590px) {
.water-about .headline_about_02 {
font-size: 24px;
}
}
.water-about__hero__text {
text-align: center;
font-weight: bold;
line-height: 2;
}
.water-about__hero__items {
margin-top: 40px;
justify-content: center;
}
.water-about__hero__item {
margin: 0 2.15rem;
}
@media screen and (max-width: 590px) {
.water-about__hero__item {
margin-right: 0;
margin-bottom: 2rem;
}
}
.water-about__hero__item a {
display: flex;
align-items: center;
justify-content: center;
width: 22.3rem;
height: 22.3rem;
border-radius: 50%;
text-align: center;
font-size: 2rem;
color: #fff;
letter-spacing: 0.5rem;
}
.water-about__hero__item:first-child a {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/hero_01.webp) no-repeat center center/cover;
}
.water-about__hero__item:nth-child(2) a {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/hero_02.webp) no-repeat center center/cover;
}
.water-about__hero__item:nth-child(3) a {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/hero_03.webp) no-repeat center center/cover;
}
@media screen and (max-width: 960px) {
.water-about__hero {
padding: 0 !important;
}
}
@media screen and (max-width: 590px) {
.water-about__hero__text {
font-weight: normal;
}
}
@media screen and (max-width: 960px) {
.water-about__location {
padding-top: 40px !important;
padding-bottom: 0 !important;
}
}
@media screen and (max-width: 590px) {
.water-about__location {
padding-top: 20px !important;
}
}
.water-about__location.water-about__location__fuji .water-about__location__kv {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/kv_01.webp) no-repeat center center/cover;
}
.water-about__location.water-about__location__asago {
padding-top: 0px;
}
@media screen and (max-width: 960px) {
.water-about__location.water-about__location__asago {
padding-top: 75px !important;
}
}
.water-about__location.water-about__location__asago .water-about__location__kv {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/kv_02.webp) no-repeat center center/cover;
}
.water-about__location.water-about__location__minamiaso {
padding-top: 0px;
}
@media screen and (max-width: 960px) {
.water-about__location.water-about__location__minamiaso {
padding-top: 75px !important;
padding-bottom: 75px !important;
}
}
.water-about__location.water-about__location__minamiaso .water-about__location__kv {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/natural_water/kv_03.webp) no-repeat center center/cover;
}
.water-about__location:nth-child(odd) .water-about__location__kv__text {
right: 10rem;
text-align: right;
}
@media screen and (max-width: 960px) {
.water-about__location:nth-child(odd) .water-about__location__kv__text {
right: 0;
}
}
.water-about__location:nth-child(even) .water-about__location__kv__text {
left: 10rem;
}
@media screen and (max-width: 960px) {
.water-about__location:nth-child(even) .water-about__location__kv__text {
left: 0;
}
}
.water-about__location__kv {
color: #fff;
height: 395px;
width: 100%;
margin-bottom: 6.8rem;
position: relative;
}
@media screen and (max-width: 960px) {
.water-about__location__kv {
height: 30vh;
margin-bottom: 0;
}
}
.water-about__location__kv__text {
position: absolute;
bottom: 4.3rem;
}
.water-about__location__kv__text br {
display: none;
}
@media screen and (max-width: 960px) {
.water-about__location__kv__text {
bottom: 0;
width: 100%;
padding: 20px;
}
}
@media screen and (max-width: 590px) {
.water-about__location__kv__text br {
display: block;
}
}
.water-about__location__kv__text__heading {
font-size: 3.2rem;
margin-bottom: 2.3rem;
}
@media screen and (max-width: 960px) {
.water-about__location__kv__text__heading {
font-size: 2.8rem;
margin-bottom: 1.3rem;
}
}
.water-about__location__kv__text__heading span {
font-size: 2.6rem;
}
@media screen and (max-width: 960px) {
.water-about__location__kv__text__heading span {
font-size: 2.2rem;
}
}
.water-about__location__feature .headline_1 {
margin-bottom: 3.7rem;
}
@media screen and (max-width: 590px) {
.water-about__location__feature {
padding: 40px 0 0 0 !important;
}
.water-about__location__feature .headline_1 br {
display: none;
}
}
.water-about__location__feature__item {
padding: 40px 0 !important;
}
@media screen and (max-width: 590px) {
.water-about__location__feature__item {
padding-top: 0 !important;
}
}
.water-about__location__feature__item .container {
max-width: 1400px;
width: 100%;
padding: 4rem 12rem;
position: relative;
clear: both;
overflow: hidden;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item .container {
padding: 1.5rem;
}
}
.water-about__location__feature__item .container:before {
position: absolute;
content: "";
background-color: #eaf7ff;
width: 70%;
height: 100%;
z-index: 0;
top: 0;
}
.water-about__location__feature__item__text {
max-width: 46%;
position: relative;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item__text {
padding: 0 20px;
margin-bottom: 2rem;
}
}
.water-about__location__feature__item__text__header {
flex-flow: column-reverse;
margin-bottom: 4rem;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item__text__header {
margin-bottom: 3rem;
}
}
.water-about__location__feature__item__text__header__headline {
color: #175190;
font-size: 30px;
line-height: 1.6;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item__text__header__headline {
font-size: 3.2rem;
}
}
@media screen and (max-width: 590px) {
.water-about__location__feature__item__text__header__headline {
font-size: 20px;
}
.water-about__location__feature__item__text__header__headline br {
display: none;
}
}
.water-about__location__feature__item__text__header__num {
color: #11A9da;
font-weight: bold;
font-size: 1.6rem;
position: relative;
margin-bottom: 2.5rem;
}
.water-about__location__feature__item__text__header__num:before {
position: absolute;
content: "";
background-color: #11A9da;
height: 2px;
width: 25px;
left: 0;
bottom: -4px;
}
.water-about__location__feature__item__text__header__num span {
font-size: 2.4rem;
padding-left: 0.5rem;
}
.water-about__location__feature__item__text__lead {
line-height: 2;
}
.water-about__location__feature__item__text__sub {
line-height: 2;
margin-top: 2.3rem;
}
.water-about__location__feature__item__text .note {
margin-top: 2rem;
}
.water-about__location__feature__item__img {
max-width: 51%;
position: relative;
flex-shrink: 0;
}
.water-about__location__feature__item__img img {
width: 100%;
max-width: 100%;
height: auto;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item__img {
margin-top: 40px;
margin-bottom: 20px;
display: flex;
justify-content: center;
align-items: flex-start;
}
.water-about__location__feature__item__img img {
max-width: 60%;
}
}
.water-about__location__feature__item:nth-child(odd) .container:before {
left: 0;
}
.water-about__location__feature__item:nth-child(odd) .water-about__location__feature__item__text {
float: right;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item:nth-child(odd) .water-about__location__feature__item__text {
float: none;
max-width: 100%;
}
}
.water-about__location__feature__item:nth-child(odd) .water-about__location__feature__item__img {
float: left;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item:nth-child(odd) .water-about__location__feature__item__img {
float: none;
max-width: 100%;
}
}
.water-about__location__feature__item:nth-child(even) .container:before {
right: 0;
}
.water-about__location__feature__item:nth-child(even) .water-about__location__feature__item__text {
float: left;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item:nth-child(even) .water-about__location__feature__item__text {
float: none;
max-width: 100%;
}
}
.water-about__location__feature__item:nth-child(even) .water-about__location__feature__item__img {
float: right;
}
@media screen and (max-width: 960px) {
.water-about__location__feature__item:nth-child(even) .water-about__location__feature__item__img {
float: none;
max-width: 100%;
}
}
.water-about__location__feature__bottom_btns.container {
margin-top: 7.5rem;
}
@media screen and (max-width: 960) {
.water-about__location__feature__bottom_btns.container {
margin-bottom: 7.5rem;
}
}
.water-about__location__ingredient {
background: #eaf7ff;
}
.water-about__location__ingredient .table {
margin: 3.85rem auto 0 auto;
border: 1px solid #707070;
}
@media screen and (max-width: 960px) {
.water-about__location__ingredient .table {
width: 90%;
}
}
.water-about__location__ingredient .table td, .water-about__location__ingredient .table th {
padding: 1.7rem 2.5rem;
border: 1px solid #707070;
}
@media screen and (max-width: 960px) {
.water-about__location__ingredient .table td, .water-about__location__ingredient .table th {
padding: 1.2rem;
}
}
.water-about__location__ingredient .table th {
background: #E8E8E8;
line-height: 1.875;
vertical-align: middle;
}
@media screen and (max-width: 960px) {
.water-about__location__ingredient .table th {
font-size: 1.5rem;
}
}
.water-about__location__ingredient .table td {
background: #fff;
font-size: 1.4rem;
}
@media screen and (max-width: 960px) {
.water-about__location__ingredient .table td {
font-size: 1.3rem;
}
}
@media screen and (max-width: 590px) {
.water-about__location__ingredient {
margin: 0;
padding: 40px 20px !important;
}
.water-about__location__ingredient .table tr {
display: flex;
flex-wrap: wrap;
}
.water-about__location__ingredient .table td, .water-about__location__ingredient .table th {
display: block;
}
.water-about__location__ingredient .table th {
width: 100%;
}
.water-about__location__ingredient .table th br {
display: none;
}
.water-about__location__ingredient .table td {
width: 50% !important;
}
}
.water-about__location__bottom_btns.container {
margin-top: 7.5rem;
}
@media screen and (max-width: 960px) {
.water-about__location__bottom_btns.container {
padding: 0;
}
.water-about__location__bottom_btns.container .water-list__item__under_button {
padding: 0;
width: 100%;
}
}
.water-list__item__under_button {
margin-right: auto;
margin-left: auto;
} .water-option-header {
padding-top: 0 !important;
}
.water-option__inner {
position: relative;
margin-top: 30px;
}
.water-option .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/headline_1_line.svg);
}
.water-option__heading {
color: #175190;
font-size: 34px;
line-height: 58px;
font-weight: 200;
}
.water-option__read {
margin-top: 40px;
font-size: 20px;
line-height: 2em;
}
.water-option__table {
margin-top: 2.4rem;
width: 100%;
border: 1px solid #707070;
}
@media screen and (max-width: 960px) {
.water-option__table {
width: 100%;
}
}
.water-option__table td, .water-option__table th {
padding: 20px;
border: 1px solid #707070;
}
@media screen and (max-width: 960px) {
.water-option__table td, .water-option__table th {
padding: 1.2rem;
}
}
.water-option__table th {
padding-top: 24px;
line-height: 1;
background: #E8E8E8;
word-break: keep-all;
}
@media screen and (max-width: 960px) {
.water-option__table th {
font-size: 1.5rem;
padding: 1.8rem 1.5rem;
}
}
.water-option__table th span {
font-size: 1.4rem;
}
.water-option__table td {
line-height: 1.5;
background: #fff;
}
@media screen and (max-width: 960px) {
.water-option__table td {
font-size: 1.3rem;
padding: 1.8rem 1.5rem;
}
}
.water-option__button {
margin: 80px auto 0 auto;
}
@media screen and (max-width: 960px) {
.water-option__inner {
margin-top: 20px;
}
.water-option__heading {
font-size: 24px;
}
.water-option__read {
margin-top: 20px;
font-size: 16px;
line-height: 28px;
}
.water-option__table {
width: 100%;
}
.water-option__button {
margin: 40px auto 0 auto;
}
}
@media screen and (max-width: 590px) {
.water-option__heading {
font-size: 22px;
font-weight: 300;
line-height: 34px;
text-align: left;
}
.water-option__heading br {
display: block;
}
.water-option__button {
margin: 40px auto 0 auto;
}
}
.water-option__support {
margin-top: 80px;
background: linear-gradient(90deg, #F0FBFF, #F7F7FF);
}
.water-option__support__img {
position: absolute;
left: 0;
padding-left: 10%;
width: 45%;
height: auto;
z-index: 1;
}
.water-option__support__img img {
width: 100%;
height: auto;
}
.water-option__support__text {
width: 52%;
}
.water-option__support__text_wrapper {
display: flex;
justify-content: flex-end;
}
.water-option__support__caution {
margin-top: 20px;
background: #FF4C40;
color: #fff;
text-align: center;
width: 100%;
padding: 1.6rem 0 2.7rem;
}
.water-option__support__caution__read {
font-size: 2rem;
font-weight: bold;
text-align: center;
}
.water-option__support__caution__aside {
text-align: center;
font-size: 1.3rem;
}
.water-option__support__caution br {
display: none;
}
.water-option__support__caution {
background: #FF4C40;
color: #fff;
text-align: center;
width: 100%;
padding: 1.6rem 0 2.7rem;
}
.water-option__support__caution__read {
font-size: 2rem;
font-weight: bold;
}
.water-option__support__caution__aside {
font-size: 1.3rem;
}
@media screen and (max-width: 960px) {
.water-option__support {
margin-top: 0;
}
.water-option__support__img {
position: static;
left: 0;
margin-top: 40px;
padding-left: 0;
width: 100%;
text-align: center;
}
.water-option__support__img img {
width: 100%;
height: auto;
}
.water-option__support__text {
margin-top: 20px;
width: 100%;
}
.water-option__support__text_wrapper {
justify-content: flex-start;
}
}
@media screen and (max-width: 590px) {
.water-option__support {
padding: 40px 20px !important;
}
.water-option__support__text {
margin-top: 40px;
}
}
.water-option__kit {
margin-top: 80px;
}
.water-option__kit_01 {
padding: 80px 0;
}
.water-option__kit_01:before {
position: absolute;
top: 50%;
right: 0;
transform: translateY(-50%);
content: "";
background: #eaf7ff;
width: 65%;
height: 85%;
z-index: 1;
}
.water-option__kit_01__img {
position: absolute;
top: 35px;
left: 50%;
width: 750px;
z-index: 2;
}
.water-option__kit_01__img img {
width: 80%;
object-fit: cover;
height: auto;
}
.water-option__kit_01__text {
padding: 40px;
width: 55%;
background-color: #fff;
z-index: 3;
}
.water-option__kit_02 {
padding: 80px 0;
}
.water-option__kit_02:before {
position: absolute;
top: 50%;
left: 0;
transform: translateY(-50%);
content: "";
background: #eaf7ff;
width: 65%;
height: 90%;
z-index: 1;
}
.water-option__kit_02__img {
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 100%;
z-index: 2;
}
.water-option__kit_02__img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.water-option__kit_02__text {
padding: 40px;
width: 60%;
background-color: #fff;
z-index: 3;
}
.water-option__kit_02__text_wrapper {
display: flex;
justify-content: flex-end;
}
@media screen and (max-width: 960px) {
.water-option__kit {
margin-top: 0;
}
.water-option__kit_01 {
padding: 20px 0;
}
.water-option__kit_01:before {
display: none;
}
.water-option__kit_01__img {
position: static;
top: 0;
left: 0;
width: 100%;
height: auto;
text-align: center;
}
.water-option__kit_01__img img {
width: 70%;
height: auto;
}
.water-option__kit_01__text {
margin-top: 40px;
padding: 0;
width: 100%;
}
.water-option__kit_01__text br {
display: none;
}
.water-option__kit_02 {
padding: 0;
}
.water-option__kit_02:before {
display: none;
}
.water-option__kit_02__img {
position: static;
top: 0;
left: 0;
width: 100%;
height: auto;
text-align: center;
}
.water-option__kit_02__img img {
width: 80%;
height: auto;
}
.water-option__kit_02__text {
padding: 0;
width: 100%;
}
.water-option__kit_02__text_wrapper {
justify-content: flex-start;
}
}
@media screen and (max-width: 590px) {
.water-option__kit {
padding: 40px 20px !important;
}
.water-option__kit_02 {
padding: 0;
}
.water-option__kit_02__text {
margin-top: 40px;
}
}
.water-option__content {
text-align: center;
}
.water-option__content .water-option__heading br {
display: none;
}
.water-option__content__heading_01 {
color: #175190;
font-size: 4rem;
margin-bottom: 1.6rem;
line-height: 1.6;
}
@media screen and (max-width: 960px) {
.water-option__content__heading_01 {
line-height: 1.3;
text-align: left;
}
}
.water-option__content__heading_02 {
margin-top: 40px;
color: #175190;
font-size: 2.4rem;
margin-bottom: 1.7rem;
line-height: 1.5;
}
@media screen and (max-width: 590px) {
.water-option__content__heading_02 {
font-size: 20px;
line-height: 1.1;
}
}
.water-option__content__heading_03 {
color: #175190;
font-size: 2rem;
line-height: 1.5;
font-weight: bold;
margin-top: 1rem;
}
.water-option__content__read {
margin-top: 40px;
font-size: 18px;
line-height: 2;
text-align: center;
}
@media screen and (max-width: 960px) {
.water-option__content__read {
text-align: left;
margin-bottom: 4rem;
font-size: 16px;
}
}
.water-option__content__items {
display: flex;
margin: 20px auto 0 auto;
width: 80%;
}
@media screen and (max-width: 960px) {
.water-option__content__items {
margin-bottom: 4rem;
width: 100%;
}
}
.water-option__content__item {
margin-top: 20px;
width: 30%;
margin-right: 5%;
text-align: center;
}
.water-option__content__item:nth-child(3n) {
margin-right: 0;
}
.water-option__content__item__area {
box-shadow: 0px 0px 5px 3px rgba(0, 0, 0, 0.1);
padding: 1rem 0;
height: 26.7rem;
display: flex;
flex-direction: column;
justify-content: space-around;
}
@media screen and (max-width: 960px) {
.water-option__content__item__area {
height: auto;
}
}
.water-option__content__item img {
max-width: 100%;
width: 100%;
height: auto;
}
.water-option__content__item__note {
margin-top: 1rem;
text-align: left;
}
.water-option__content__item__note span {
font-size: 1.3rem;
}
.water-option__content__caution {
margin: 40px auto;
width: 80%;
border: 1px solid #707070;
padding: 3.5rem;
text-align: left;
font-size: 14px;
}
.water-option__content__caution__heading {
font-size: 2rem;
font-weight: bold;
margin-bottom: 2.4rem;
}
.water-option__content__caution__read {
line-height: 2;
}
@media screen and (max-width: 960px) {
.water-option__content {
padding: 0 !important;
}
.water-option__content__heading_02 {
margin-top: 20px;
}
.water-option__content__heading_03 {
font-size: 18px;
line-height: 1.2;
font-weight: normal;
}
.water-option__content__items {
width: 100%;
}
.water-option__content__item__area {
min-height: 22rem;
}
.water-option__content__caution {
margin: 20px auto;
width: 100%;
}
}
@media screen and (max-width: 590px) {
.water-option__content {
padding-bottom: 40px !important;
}
.water-option__content .water-option__heading br {
display: block;
}
.water-option__content__item {
width: 50%;
margin-right: 0;
padding: 5px;
}
.water-option__content__item img {
margin: 0 auto;
max-width: 60%;
}
.water-option__content__item__area {
min-height: auto;
}
.water-option__content__caution {
padding: 15px;
font-size: 12px;
}
.water-option__content__caution__heading {
font-size: 16px;
margin-bottom: 10px;
font-weight: normal;
}
.water-option__content__caution__read {
line-height: 2;
}
} .water-flow-header {
padding-top: 0 !important;
}
.water-flow__sec {
font-size: 1.6rem;
background: #E2F8FF;
}
.water-flow__sec__illust {
margin-bottom: 80px;
background: #fff;
border: 1px solid #707070;
padding: 2.7rem 5.3rem;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust {
padding: 2.7rem 3rem;
}
}
.water-flow__sec__illust li:first-child {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_moushikomi.svg) no-repeat left 10px/90px auto;
padding-left: 14rem;
margin-bottom: 8.7rem;
position: relative;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust li:first-child {
padding-left: 0;
background: none;
}
.water-flow__sec__illust li:first-child .water-flow__sec__illust__heading {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_moushikomi.svg) no-repeat right center/13% auto;
}
}
@media screen and (max-width: 960px) and (max-width: 590px) {
.water-flow__sec__illust li:first-child .water-flow__sec__illust__heading {
background-size: 13% auto;
}
}
.water-flow__sec__illust li:first-child:before {
position: absolute;
content: "";
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/arrow_down.png) no-repeat center center/82px 19px;
width: 82px;
height: 19px;
bottom: -56px;
left: calc(50% - 41px);
}
.water-flow__sec__illust li:nth-child(2) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_kakunin.svg) no-repeat left top/109px 109px;
padding-left: 13.4rem;
margin-bottom: 8.7rem;
position: relative;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust li:nth-child(2) {
background: none;
padding-left: 0;
}
.water-flow__sec__illust li:nth-child(2) .water-flow__sec__illust__heading {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_kakunin.svg) no-repeat right center/10% auto;
}
}
@media screen and (max-width: 960px) and (max-width: 590px) {
.water-flow__sec__illust li:nth-child(2) .water-flow__sec__illust__heading {
background-size: 13% auto;
}
}
.water-flow__sec__illust li:nth-child(2):before {
position: absolute;
content: "";
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/arrow_down.png) no-repeat center center/82px 19px;
width: 82px;
height: 19px;
bottom: -56px;
left: calc(50% - 41px);
}
.water-flow__sec__illust li:nth-child(3) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_start.svg) no-repeat left top/109px 109px;
padding-left: 13.4rem;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust li:nth-child(3) {
padding-left: 0;
background: none;
}
.water-flow__sec__illust li:nth-child(3) .water-flow__sec__illust__heading {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/water/flow/water_nagare_start.svg) no-repeat right center/10% auto;
}
}
@media screen and (max-width: 960px) and (max-width: 590px) {
.water-flow__sec__illust li:nth-child(3) .water-flow__sec__illust__heading {
background-size: 13% auto;
}
}
.water-flow__sec__illust__heading {
color: #11A9da;
margin-bottom: 1.6rem;
font-weight: bold;
font-size: 2.2rem;
display: flex;
align-items: center;
line-height: 1.5;
}
.water-flow__sec__illust__heading span {
margin-right: 1.6rem;
font-size: 4rem;
}
.water-flow__sec__illust__heading br {
display: none;
}
.water-flow__sec__illust__read {
line-height: 1.75;
margin-bottom: 1.8rem;
}
.water-flow__sec__illust__button {
padding: 0;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust__button {
margin: 0 auto;
}
}
.water-flow__sec__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
.water-flow__sec__illust {
margin-bottom: 40px;
}
.water-flow__sec__illust__heading {
font-weight: normal;
font-size: 20px;
text-align: left;
padding-right: 70px;
}
.water-flow__sec__illust__heading span {
margin-right: 10px;
}
.water-flow__sec__button {
margin: 20px auto 0 auto;
padding: 0;
}
}
@media screen and (max-width: 590px) {
.water-flow__sec {
margin-top: 0;
padding: 40px 0 !important;
}
.water-flow__sec__illust {
margin-bottom: 20px;
}
.water-flow__sec__illust__heading {
font-size: 18px;
}
.water-flow__sec__illust__heading span {
text-align: center;
}
.water-flow__sec__illust__heading br {
display: block;
}
}
@media screen and (max-width: 590px) {
.low_water_sec_05__catch {
text-align: left;
}
}  #wifi-top .attention {
background-color: #fff;
width: 100%;
}
#wifi-top .attention .attention-box {
max-width: 1140px;
width: calc(100% - 30px);
margin: 0px auto;
padding: 20px;
border: solid 1px #f00;
border-radius: 20px;
}
#wifi-top .attention .attention-box p {
color: #ff0000;
font-size: 16px;
font-weight: 700;
line-height: 1.8em;
}
#wifi-top .attention .attention-box2 {
max-width: 1140px;
width: calc(100% - 30px);
margin: 0px auto;
padding: 20px;
border: solid 3px #000;
border-radius: 10px;
}
@media screen and (max-width: 960px) {
#wifi-top .attention .attention-box2 h1 {
font-size: 20px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .attention .attention-box2 h1 {
font-size: 16px;
}
}
#wifi-top .attention .attention-box2 a {
color: #0000FF;
}
#wifi-top .low { }
#wifi-top .low__kv {
margin: 0px;
}
#wifi-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_top_back_01.jpg);
background-attachment: fixed;
position: relative;
}
#wifi-top .low__kv__back .kv-ttl_pc {
position: absolute;
bottom: 45px;
right: 75px;
}
#wifi-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 45vw;
}
#wifi-top .low__kv__back .kv-ttl_sp {
width: 85%;
right: 30px;
bottom: 0;
height: auto;
object-fit: contain;
position: absolute;
}
#wifi-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#wifi-top .low__kv__back {
height: 300px;
background-position: 50% -100px;
}
#wifi-top .low__kv__back .kv-ttl_pc {
bottom: 20px;
}
#wifi-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low__kv {
position: relative;
height: 200px;
}
#wifi-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#wifi-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 20px;
width: 100%;
height: 670px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 48% 100%;
background-size: 430%;
}
} #wifi-top .headline_1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_textline.svg);
}
#wifi-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_wi-fi.jpg);
}
#wifi-top .headline_2 {
color: #746216;
}
#wifi-top .headline_4 {
font-family: "Trebuchet MS", "Hind", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#wifi-top .low_top_sec_01 {
background-color: #fff;
}
#wifi-top .low_top_sec_01__item a:hover {
background-color: rgba(82, 63, 135, 0.3);
}
#wifi-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#wifi-top .low_top_sec_01__item_icon img {
width: 100%;
height: auto;
}
#wifi-top .low_top_sec_01__item_text {
color: #523f87;
}
#wifi-top .low_top_sec_01__item__wrapper {
margin-bottom: 60px;
}
#wifi-top .low_top_sec_01__item {
padding: 0 15px;
}
#wifi-top .low_top_sec_01__item li {
padding: 0 15px;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_01__item {
text-align: center;
}
#wifi-top .low_top_sec_01__item li {
margin-top: 10px;
width: 50%;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_01__item li {
margin-bottom: 0;
padding: 0px 5px;
}
#wifi-top .low_top_sec_01__item li a {
padding: 15px 5px;
}
#wifi-top .low_top_sec_01__item_icon img {
width: 60%;
}
#wifi-top .low_top_sec_01__item_text {
margin-top: 15px;
font-size: 16px;
}
}
#wifi-top .low_top_sec_01 .note {
margin-top: 20px;
}
#wifi-top .low_top_sec_01 {
padding: 75px 0 0 0;
padding-bottom: 0 !important;
}
@media screen and (max-width: 590px) {
.low_top_sec_01 {
padding: 40px 0 0 0 !important;
}
} #wifi-top .low_top_sec_02 {
background-color: #fff;
padding-top: 0 !important;
}
@media screen and (max-width: 960px) {
.low_top_sec_02 {
padding-top: 0 !important;
}
}
#wifi-top .low_top_sec_02__inner {
background: transparent;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_02__inner {
padding: 45px 0 0 0;
background: transparent;
}
}
#wifi-top .tbl-price-index {
width: 80%;
margin: 30px auto;
}
#wifi-top .tbl-price-index th, .tbl-price-index td {
padding: 15px;
text-align: center;
}
#wifi-top .tbl-price-index td:first-child {
background: #F4F4F4;
}
#wifi-top .tbl-price-index .thead {
background: #523F87;
color: white;
font-size: 25px;
font-weight: normal;
}
#wifi-top .tbl-price-index ul {
width: 100%;
display: table;
}
#wifi-top .tbl-price-index ul li {
vertical-align: middle;
padding: 10px 0;
}
#wifi-top .tbl-price-index .price {
color: #524FB2;
}
#wifi-top .tbl-price-index .price-md {
font-size: 22px;
font-weight: bold;
}
#wifi-top .tbl-price-index .price-lg {
font-size: 41px;
letter-spacing: 2px;
margin: 0 3px;
}
#wifi-top .tbl-price-index ul #price-sm {
font-size: 18px;
}
#wifi-top .tbl-price-index ul #price-xs {
font-size: 16px;
}
#wifi-top table.tbl-price-index, #wifi-top table.tbl-price-index td, #wifi-top table.tbl-price-index th {
border-collapse: collapse;
border: 1px solid #707070;
}
#wifi-top .wifi-table th {
font-weight: normal;
padding: 20px 20px 14px 20px;
font-size: 22px;
}
#wifi-top .wifi-table .wifi-table__img {
width: 150px;
}
#wifi-top .wifi-table__details {
width: 80%;
margin: 0 auto;
}
#wifi-top .wifi-table__details__wrapper {
margin-top: 30px;
padding: 20px;
background-color: #fff;
border: 1px #ff4c40 solid;
z-index: 1;
}
#wifi-top .wifi-table__details__wrapper p {
color: #ff4c40;
font-size: 14px;
font-weight: 600;
line-height: 27px;
}
@media screen and (max-width: 960px) {
#wifi-top .wifi-table__details {
width: 100%;
}
}
#wifi-top .wifi-table__details li {
margin-top: 10px;
font-size: 14px;
}
#wifi-top .wifi-table_sp-only {
display: none;
}
@media screen and (max-width: 768px) {
#wifi-top .tbl-price-index {
width: 100%;
}
#wifi-top .wifi-table .wifi-table__img {
width: 100px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .wifi-table__details {
margin-left: 10px;
}
#wifi-top .wifi-table.pc-only {
display: none;
}
#wifi-top .wifi-table_sp-only {
display: block;
}
#wifi-top .wifi-table_sp-only th, #wifi-top .wifi-table_sp-only td {
display: block;
width: 100%;
}
#wifi-top .wifi-table_sp-only th {
padding: 10px 10px 4px 10px;
font-size: 18px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_02__item {
margin-top: 20px;
}
#wifi-top .low_top_sec_02 .headline_2 {
margin-top: 40px;
}
#wifi-top .low_top_sec_02 .headline_2 br {
display: block;
}
#wifi-top .low_top_sec_02__text {
margin-top: 20px;
}
#wifi-top .low_top_sec_02__button {
margin-top: 20px;
}
}
#wifi-top .low_top_sec_02 {
margin: 40px 0;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_02 {
margin: 0;
}
}
#wifi-top .low_top_sec_02__inner {
margin: 40px 0;
padding: 40px 0;
background: #f4ecf2;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_02__inner {
padding: 45px 0 0 0;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_02__inner {
margin: 0;
}
}
#wifi-top .low_top_sec_02__inner .row {
justify-content: center;
} .wifiPlan {
margin: 20px 10px 10px;
padding: 20px;
background-color: #fff;
}
@media screen and (max-width: 590px) {
.wifiPlan {
padding: 10px;
}
}
.wifiPlan__figure {
text-align: center;
padding: 10px 0 0;
}
.wifiPlan__figure img {
width: 200px;
height: auto;
}
.wifiPlan table {
margin-top: 10px;
}
.wifiPlan table tr th {
text-align: center;
}
.wifiPlan .kome {
margin-top: 10px;
}
.wifiPlan__headline {
margin-top: 30px;
font-size: 32px;
font-weight: normal;
}
.wifiPlan__listDisk {
margin-top: 10px;
padding: 15px;
background-color: #F6F1F4;
list-style-type: none;
}
.wifiPlan__data {
display: flex;
flex-wrap: wrap;
margin-top: 10px;
}
.wifiPlan__dataTitle {
margin-top: 20px;
}
.wifiPlan__dataTitle b {
font-size: 14px;
}
@media screen and (max-width: 590px) {
.wifiPlan__dataTitle b {
font-size: 12px;
}
}
.wifiPlan__data dt {
width: 30%;
font-size: 14px;
}
@media screen and (max-width: 590px) {
.wifiPlan__data dt {
font-size: 12px;
}
}
.wifiPlan__data dd {
width: 70%;
font-size: 14px;
}
@media screen and (max-width: 590px) {
.wifiPlan__data dd {
font-size: 12px;
}
}
.planText.is-planBasic {
color: #A96F98;
}
.planText.is-planPremium {
color: #523F87;
}
.planText.is-planPremium li {
font-weight: 500;
} #wifi-top .wifi-top_sec_03__inner-1 {
position: relative;
margin-top: 40px;
padding: 40px 0 20px 0;
}
#wifi-top .wifi-top_sec_03__inner-1 {
position: relative;
margin-top: 80px;
padding: 40px 60px;
padding-bottom: 100px;
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__inner-1 {
padding-bottom: 0px;
}
}
#wifi-top .wifi-top_sec_03__inner-1:before {
display: block;
position: absolute;
content: "";
width: 100%;
height: 92%;
top: 0px;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/bg_wifi.png);
background-size: 60% 100%;
background-position: right center;
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__inner-1:before {
display: none !important;
}
}
#wifi-top .wifi-top_sec_03__inner-2:before {
display: block;
position: absolute;
content: "";
top: -25px;
bottom: -25px;
width: 100%;
height: 110%;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/bg_wifi.png);
background-size: 60% 100%;
background-position: left center;
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__inner-2:before {
display: none !important;
}
}
#wifi-top .wifi-top_sec_03__inner-2 .wifi-top_sec_03__box {
padding: 60px 40px 40px 40px;
background-color: #fff;
}
#wifi-top .wifi-top_sec_03__inner-1 .wifi-top_sec_03__box {
padding: 60px 40px 40px 40px;
background-color: #fff;
}
#wifi-top .wifi-top_sec_03__img-1 img {
width: 700px;
max-width: 100%;
margin-top: 100px;
margin-left: 40px;
}
#wifi-top .wifi-top_sec_03__img-2 {
display: flex;
align-items: center;
}
#wifi-top .wifi-top_sec_03__img-2 img {
width: 700px;
max-width: 100%;
margin-left: -40px;
}
#wifi-top .wifi-top_sec_03 .headline_2 {
color: #523F87;
line-height: 1.4;
margin-bottom: 38px;
}
#wifi-top .wifi-top_sec_03 .headline_2 span {
font-size: 24px;
}
#wifi-top .wifi-top_sec_03 .main-price {
text-align: center;
color: #523F87;
background-color: #f7f7f7;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
}
#wifi-top .wifi-top_sec_03 .price-lg {
font-size: 32px;
}
#wifi-top .wifi-top_sec_03 .price-md {
font-size: 24px;
}
#wifi-top .wifi-top_sec_03__box .main-option {
color: #A96F98;
margin-top: 20px;
margin-bottom: 20px;
line-height: 32px;
font-weight: bold;
}
#wifi-top .wifi-top_sec_03__box .main-info {
margin-top: 20px;
}
#wifi-top .wifi-top_sec_03__box .main-info__title {
font-weight: bold;
}
#wifi-top .wifi-top_sec_03__box .main-info dl {
display: flex;
flex-wrap: wrap;
margin-top: 10px;
}
#wifi-top .wifi-top_sec_03__box .main-info dl dt {
width: 30%;
font-weight: bold;
}
#wifi-top .wifi-top_sec_03__box .main-info dl dd {
width: 70%;
}
@media screen and (max-width: 960px) {
#wifi-top .wifi-top_sec_03__box .main-info dl dt, #wifi-top .wifi-top_sec_03__box .main-info dl dd {
width: 100%;
}
#wifi-top .wifi-top_sec_03__box .main-info dl dt {
margin-top: 20px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .wifi-top_sec_03__box {
margin: 0;
padding: 20px;
}
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__inner-1:before {
position: absolute;
margin-top: 40px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/bg_wifi.png);
background-size: 100%;
background-position: right center;
}
#wifi-top .wifi-top_sec_03__inner-2:before {
position: absolute;
margin-top: 40px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/bg_wifi.png);
background-size: 100% cover;
background-position: center;
}
#wifi-top .wifi-top_sec_03__inner-1 .wifi-top_sec_03__box, #wifi-top .wifi-top_sec_03__inner-2 .wifi-top_sec_03__box {
margin-top: 0px;
margin-right: 10px;
margin-left: 10px;
margin-bottom: 80px;
padding: 40px 40px 40px 40px;
background-color: #fff;
}
#wifi-top .wifi-top_sec_03__img img {
width: 700px;
max-width: 60%;
margin-top: 20px;
}
#wifi-top .wifi-top_sec_03__img {
text-align: center;
}
#wifi-top .wifi-top_sec_03__img-1 img, #wifi-top .wifi-top_sec_03__img-2 img {
max-width: 80%;
margin-top: 80px;
margin-bottom: 80px;
margin-left: auto;
margin-right: auto;
}
}
@media screen and (max-width: 992px) and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__img-2 img {
margin-top: 0px;
}
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__img-2, #wifi-top .wifi-top_sec_03__img-1 {
text-align: center;
}
}
@media screen and (max-width: 992px) {
#wifi-top .wifi-top_sec_03__inner-1, #wifi-top .wifi-top_sec_03__inner-2 {
background-color: #EEEBF2;
background-image: none;
}
}
@media screen and (max-width: 590px) {
#wifi-top .wifi-top_sec_03__inner-1 {
background-size: 100% 100%;
padding: 20px 15px 40px 15px;
}
#wifi-top .wifi-top_sec_03__inner-2 {
margin: 0;
padding: 20px 15px 40px 15px;
background-size: 100% 100%;
}
#wifi-top .wifi-top_sec_03__img-1, #wifi-top .wifi-top_sec_03__img-2 {
display: flex;
justify-content: center;
align-items: flex-start;
margin: 0;
padding: 0 !important;
width: 100%;
}
#wifi-top .wifi-top_sec_03__img-1 img, #wifi-top .wifi-top_sec_03__img-2 img {
width: 80%;
max-width: 80%;
margin: 20px auto;
}
#wifi-top .wifi-top_sec_03__inner-1 .wifi-top_sec_03__box, #wifi-top .wifi-top_sec_03__inner-2 .wifi-top_sec_03__box {
margin-top: 20px;
margin-bottom: 0;
padding: 20px;
}
#wifi-top .wifi-top_sec_03 .main-price {
margin-top: 20px;
line-height: 1.2em;
padding: 15px 0 5px 0;
}
#wifi-top .wifi-top_sec_03 .main-price .tax {
display: block;
}
} #teigaku-top .wifi-top_sec_04 {
margin-top: 160px;
}
#wifi-top .wifi-top_sec_04__inner {
position: relative;
margin-top: 40px;
height: 600px;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/bg_wifi.png);
background-size: 60% 80%;
background-position: right 30%;
}
#wifi-top .wifi-top_sec_04__box {
margin-top: 80px;
padding: 80px 80px 80px 0;
background-color: #fff;
}
#wifi-top .headline_2 {
color: #551D00;
}
#wifi-top .wifi-top_sec_04__box p {
margin-top: 40px;
line-height: 2em;
}
#wifi-top .wifi-top_sec_04__img {
position: absolute;
top: 0;
left: 45%;
align-items: center;
}
#wifi-top .wifi-top_sec_04__img img {
width: 800px;
display: block;
}
@media screen and (max-width: 960px) {
#wifi-top .wifi-top_sec_04__inner {
height: auto;
background-image: none;
}
#wifi-top .wifi-top_sec_04__img {
position: static;
display: flex;
justify-content: center;
height: auto;
}
#wifi-top .wifi-top_sec_04__img img {
width: 100%;
height: auto;
}
#wifi-top .wifi-top_sec_04__box {
margin-top: 40px;
padding: 0;
}
#wifi-top .wifi-top_sec_04__box p {
margin-top: 20px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .wifi-top_sec_04 {
padding: 40px 0 !important;
}
} .low_top_sec_04__table .tbl-country-index {
margin-top: 80px;
}
.low_top_sec_04__table .tbl-price-index th, .tbl-price-index td {
padding: 15px;
text-align: center;
}
.low_top_sec_04__table .tbl-country-index .thead th {
padding-top: 20px;
padding-bottom: 14px;
background: #523F87;
text-align: center;
color: #fff;
font-size: 20px;
letter-spacing: 2px;
font-weight: normal;
}
.low_top_sec_04__table .tbl-country-index #table-continent {
width: 15%;
text-align: center;
font-size: 15px;
color: #523F87;
font-weight: bold;
}
.low_top_sec_04__table .tbl-country-index #table-country {
padding: 25px;
text-align: justify;
}
.low_top_sec_04__table .tbl-country-index #table-grey {
background-color: #f4f4f4;
}
#wifi-top table.tbl-country-index {
border-collapse: collapse;
border: 1px solid #707070;
}
#wifi-top table.tbl-country-index td {
border-left: 1px solid #707070;
}
@media screen and (max-width: 960px) {
.low_top_sec_04__table .tbl-country-index th, .low_top_sec_04__table .tbl-country-index td, .low_top_sec_04__table .tbl-country-index #table-continent {
display: block;
padding: 20px;
width: 100%;
}
.low_top_sec_04__table .tbl-country-index td, .low_top_sec_04__table .tbl-country-index #table-continent {
border-bottom: 1px solid #707070;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_04__table .tbl-country-index {
margin-top: 20px;
}
}  #wifi-top .low_top_sec_04-data {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_bg_01.jpg);
background-size: cover;
position: relative;
}
#wifi-top .low_top_sec_04-data .wifi-overlay {
width: 100%;
height: 100%;
background: linear-gradient(320deg, #524fb2 0%, #c86f98 100%);
opacity: 0.64;
position: absolute;
top: 0;
left: 0;
}
#wifi-top .low_top_sec_04-data .headline_1 {
margin-bottom: 40px;
text-align: center;
color: #fff;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_04-data .headline_1 {
margin-bottom: 20px;
}
}
#wifi-top .low_top_sec_04-data .headline_2 {
color: #fff;
font-size: 44px;
font-weight: bold;
line-height: 1.2;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_04-data .headline_2 {
font-size: 24px;
margin-bottom: 20px;
}
}
#wifi-top .low_top_sec_04-data .headline_2 span.bold-yellow {
color: #f9e504;
}
#wifi-top .low_top_sec_04-data .headline_2 span.bold-yellow span.gb {
font-size: 70px;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_04-data .headline_2 span.bold-yellow span.gb {
font-size: 72px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_04-data .headline_2 .sub_disp {
line-height: 0;
font-size: 20px;
}
}
#wifi-top .low_top_sec_04-data .data__table {
display: flex;
flex-wrap: wrap;
}
#wifi-top .low_top_sec_04-data .data__table__wrapper {
padding: 0;
margin: 0 -20px;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_04-data .data__table__wrapper {
margin: 0 auto;
}
}
#wifi-top .low_top_sec_04-data .data__table dt, #wifi-top .low_top_sec_04-data .data__table dd {
display: flex;
align-items: center;
margin-top: 20px;
font-weight: bold;
letter-spacing: 1px;
color: #fff;
}
#wifi-top .low_top_sec_04-data .data__table dt {
width: 65%;
font-size: 28px;
}
#wifi-top .low_top_sec_04-data .data__table dt span {
padding-top: 6px;
line-height: 1;
}
#wifi-top .low_top_sec_04-data .data__table dd {
position: relative;
justify-content: flex-end;
width: 35%;
font-size: 32px;
}
#wifi-top .low_top_sec_04-data .data__table dd span {
margin: 0 4px;
padding-top: 8px;
font-size: 18px;
}
#wifi-top .low_top_sec_04-data .data__table dd::before { position: absolute;
top: 50%;
z-index: 10;
display: block;
height: 10px;
left: -30px;
width: 45px;
background: url("data:image/svg+xml;charset=utf8,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%3Csvg%20viewBox%3D%220%200%2045%2010%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20transform%3D%22translate(-1076%20-6640)%22%20fill%3D%22%23fff%22%20%3E%3Cg%20transform%3D%22translate(1076%206640)%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%225%22%20stroke%3D%22none%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%224.5%22%20fill%3D%22none%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(1094%206640)%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%225%22%20stroke%3D%22none%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%224.5%22%20fill%3D%22none%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%22translate(1111%206640)%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%225%22%20stroke%3D%22none%22%2F%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%224.5%22%20fill%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat center center;
transform: translateY(-50%); content: "";
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_04-data .data__table dd::before {
left: -60px;
}
}
#wifi-top .low_top_sec_04-data .data__table_img {
display: flex;
justify-content: center;
margin-right: 20px;
width: 60px;
}
#wifi-top .low_top_sec_04-data .data__table_img img {
width: auto;
height: 28px;
}
#wifi-top .low_top_sec_04__button {
margin: 40px auto 0 auto;
}
#wifi-top .low_top_sec_04-data .data__table-details {
color: #fff;
font-size: 14px;
margin-top: 40px;
line-height: 2em;
z-index: 1;
}
#wifi-top .low_top_sec_04-data .data__table-details__strong {
margin-top: 20px;
font-size: 16px;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_04-data {
padding: 40px 20px !important;
}
#wifi-top .low_top_sec_04-data .headline_2 {
padding-left: 0;
text-align: center;
}
#wifi-top .low_top_sec_04-data .headline_2 br {
display: none;
}
#wifi-top .low_top_sec_04-data .data__table dt {
font-size: 22px;
}
#wifi-top .low_top_sec_04-data .data__table dd {
font-size: 32px;
}
#wifi-top .low_top_sec_04-data .data__table dd span {
padding-top: 4px;
}
#wifi-top .low_top_sec_04-data .data__table_img {
width: 45px;
}
#wifi-top .low_top_sec_04-data .data__table_img img {
height: 22px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_04-data .headline_2 br {
display: block;
}
#wifi-top .low_top_sec_04-data .container {
padding: 5px;
}
#wifi-top .low_top_sec_04-data .data__table dt {
width: 50%;
font-size: 16px;
}
#wifi-top .low_top_sec_04-data .data__table dt span {
font-size: 15px;
}
#wifi-top .low_top_sec_04-data .data__table dd {
margin-top: 10px;
width: 50%;
font-size: 18px;
display: flex;
justify-content: space-around;
}
#wifi-top .low_top_sec_04-data .data__table dd span {
padding-top: 4px;
}
#wifi-top .low_top_sec_04-data .data__table dd::before {
margin-right: 5px;
margin-top: 15px;
display: inline-block;
position: static;
width: 25px;
text-align: left;
height: 8px;
}
#wifi-top .low_top_sec_04-data .data__table_img {
margin-right: 0px;
}
#wifi-top .low_top_sec_04-data .data__table_img img {
height: auto;
width: 20px;
}
#wifi-top .low_top_sec_04-data .data__table-details {
margin-top: 20px;
}
} #wifi-top .low_wifi_sec_05 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_03.jpg);
background-size: cover;
}
#wifi-top .low_wifi_sec_05 .headline_1 {
margin-top: 80px;
text-align: center;
}
#wifi-top .low_wifi_sec_05 .headline_2 {
margin-top: 40px;
text-align: center;
}
#wifi-top .low_wifi_sec_05 .headline_2 br {
display: none;
}
#wifi-top .low_wifi_sec_05__text {
margin-top: 40px;
line-height: 2em;
text-align: center;
}
#wifi-top .low_wifi_sec_05__item {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-top: 40px;
}
#wifi-top .low_wifi_sec_05__item li {
display: flex;
flex-direction: column;
justify-content: flex-start;
width: 25%;
}
#wifi-top .low_wifi_sec_05__item li a {
display: flex;
flex-direction: column;
justify-content: flex-start;
padding: 50px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
#wifi-top .low_wifi_sec_05__icon {
width: 100%;
}
#wifi-top .low_wifi_sec_05__icon img {
width: 40%;
height: auto;
}
#wifi-top .low_wifi_sec_05__logo {
width: 100%;
}
#wifi-top .low_wifi_sec_05__logo img {
width: 70%;
height: auto;
}
#wifi-top .low_wifi_sec_05__cath {
width: 100%;
padding: 20px;
font-size: 15px;
}
#wifi-top .low_wifi_sec_05__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
#wifi-top .low_wifi_sec_05__item {
flex-wrap: wrap;
}
#wifi-top .low_wifi_sec_05__item li {
width: 50%;
}
#wifi-top .low_wifi_sec_05__item li a {
margin: 0 auto;
padding: 20px 0 0 0;
width: 150px;
height: 150px;
}
#wifi-top .low_wifi_sec_05__icon img {
width: 60px;
height: auto;
}
#wifi-top .low_wifi_sec_05__logo img {
width: 100px;
height: auto;
}
#wifi-top .low_wifi_sec_05__cath {
padding: 10px 20px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_wifi_sec_05 .headline_1 {
margin-top: 40px;
}
#wifi-top .low_wifi_sec_05 .headline_2 {
margin-top: 20px;
}
#wifi-top .low_wifi_sec_05 .headline_2 br {
display: block;
}
#wifi-top .low_wifi_sec_05__text {
margin-top: 20px;
font-size: 14px;
}
#wifi-top .low_wifi_sec_05__item {
margin-top: 0;
}
#wifi-top .low_wifi_sec_05__item li {
margin-top: 40px;
width: 100%;
}
#wifi-top .low_wifi_sec_05__item li a {
padding: 30px 0;
}
#wifi-top .low_wifi_sec_05__cath {
padding: 10px 20px 0 20px;
}
#wifi-top .low_wifi_sec_05__button {
padding: 0 20px;
}
}
#wifi-top .low_top_sec_06 {
padding: 40px;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06 {
padding-top: 20px;
padding-bottom: 0;
}
}
#wifi-top .low_top_sec_06__inner {
padding: 80px 0;
background-color: #F4ECF2;
}
#wifi-top .low_top_sec_06__cont {
background: #fff;
width: 90%;
max-width: 90rem;
margin: 2rem auto 4rem;
padding: 4rem 0 2rem;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont {
margin: 0 auto !important;
padding: 20px 0 !important;
}
}
#wifi-top .low_top_sec_06__cont__list {
display: flex;
justify-content: space-between;
width: 80%;
margin: 0 auto;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list {
display: block;
}
}
#wifi-top .low_top_sec_06__cont__list__item {
padding: 0 10px;
width: 33.333%;
}
#wifi-top .low_top_sec_06__cont__list__item figure {
width: 100%;
display: flex;
justify-content: center;
align-items: flex-start;
}
#wifi-top .low_top_sec_06__cont__list__item figure img {
width: 80px;
height: auto;
}
#wifi-top .low_top_sec_06__cont__list__item_text {
margin-top: 10px;
width: 100%;
font-size: 14px;
font-weight: 400;
}
#wifi-top .low_top_sec_06__cont__list__item_text.red {
color: red;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list__item_text {
font-size: 12px;
}
}
#wifi-top .low_top_sec_06__cont__list__item:not(:last-of-type) {
position: relative;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list__item:not(:last-of-type) {
margin-bottom: 5rem;
}
#wifi-top .low_top_sec_06__cont__list__item:not(:last-of-type):after {
position: absolute;
font-family: "Font Awesome 5 Free";
font-weight: 900;
font-size: 20px;
left: 50%;
top: 105%;
font-family: "Font Awesome 5 Free";
transform: translateX(-50%);
opacity: 0.7;
content: "\f078";
}
}
#wifi-top .low_top_sec_06__cont__list__item:not(:last-of-type):before {
position: absolute;
right: -10px;
top: 30px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list__item:not(:last-of-type):before {
content: none;
}
}
#wifi-top .low_top_sec_06__cont__list__item__read {
margin-top: 20px;
width: 100%;
display: flex;
align-items: flex-start;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list__item__read {
justify-content: center;
}
}
#wifi-top .low_top_sec_06__cont__list__item__read span {
display: block;
}
#wifi-top .low_top_sec_06__cont__list__item__read span:first-child {
color: #895a8c;
font-size: 3rem;
margin-right: 1rem;
}
#wifi-top .low_top_sec_06__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_06 {
padding: 0;
}
#wifi-top .low_top_sec_06__inner {
padding: 40px 20px;
}
#wifi-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#wifi-top .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#wifi-top .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#wifi-top .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#wifi-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: center;
align-items: flex-start;
width: 100%;
}
#wifi-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#wifi-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#wifi-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#wifi-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_06 {
padding: 0;
}
#wifi-top .low_top_sec_06__inner {
padding: 40px 20px 30px;
}
#wifi-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#wifi-top .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#wifi-top .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#wifi-top .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#wifi-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#wifi-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#wifi-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#wifi-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#wifi-top .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
}
#wifi-top .m-flow_list {
display: flex;
}
#wifi-top .m-flow_list__item {
position: relative;
background: #fff;
width: calc(33.3% - 20px);
margin-right: 30px;
min-height: 300px;
padding: 10px 15px 10px;
}
#wifi-top .m-flow_list__item:before {
position: absolute;
width: 70px;
height: 70px;
content: "";
display: block;
top: -80px;
left: 0;
right: 0;
margin: 0px auto;
}
#wifi-top .m-flow_list__item:nth-last-child(1):before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow3.svg);
}
#wifi-top .m-flow_list__item:nth-last-child(2):before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow2.svg);
}
#wifi-top .m-flow_list__item:nth-last-child(3):before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow1.svg);
}
#wifi-top .m-flow_list__item .list__title {
font-size: 20px;
text-align: center;
}
#wifi-top .m-flow_list__item .list__icon {
width: 135px;
display: block;
margin: 40px auto;
}
#wifi-top .m-flow_list__item .list__txt {
font-size: 14px;
font-weight: 400;
}
#wifi-top .m-flow_list__item .list__txt .is-red {
color: #ff0000;
}
#wifi-top .m-flow_list__item:last-child {
margin-right: 0px;
}
#wifi-top #wifi_slide .slide__item {
position: relative;
padding-top: 50px;
}
#wifi-top #wifi_slide .slide__item:before {
position: absolute;
width: 70px;
height: 70px;
content: "";
display: block;
top: 30px;
left: 0;
right: 0;
margin: 0px auto;
}
#wifi-top #wifi_slide .slide__item.is-one:before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow1.svg);
}
#wifi-top #wifi_slide .slide__item.is-two:before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow2.svg);
}
#wifi-top #wifi_slide .slide__item.is-three:before {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_flow3.svg);
}
#wifi-top #wifi_slide .slide__item .slide__wrapper {
padding-top: 61px;
display: block;
background: #fff;
border-radius: 5px;
min-height: 340px;
padding: 60px 15px 20px;
}
#wifi-top #wifi_slide .slide__item .slide__icon {
height: auto;
}
#wifi-top #wifi_slide .slide__item .slide__icon img {
width: auto;
display: block;
height: 100px;
margin: 20px auto;
}
#wifi-top #wifi_slide .slide__item .slide__title {
text-align: center;
}
#wifi-top #wifi_slide .slide__item .slide__txt {
font-size: 14px;
font-weight: 400;
}
#wifi-top #wifi_slide .slide__item .slide__txt.is-red {
color: #ff0000;
}
#wifi-top .is-pc {
display: flex;
}
@media screen and (max-width: 590px) {
#wifi-top .is-pc {
display: none;
}
}
#wifi-top .is-sp {
display: none;
}
@media screen and (max-width: 590px) {
#wifi-top .is-sp {
display: block;
}
} #wifi-top .low_top_sec_07 {
padding: 60px 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: right;
}
#wifi-top .low_top_sec_07_block {
margin: 50px 0;
}
#wifi-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #A96F98;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#wifi-top .low_top_sec_07 input {
display: none;
}
#wifi-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#wifi-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#wifi-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#wifi-top .low_top_sec_07 .answer {
overflow: hidden;
color: #A96F98;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#wifi-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ .answer {
max-height: 10000px;
transition: all 1s;
margin: 10px 0;
}
#wifi-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#wifi-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#wifi-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#wifi-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#wifi-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#wifi-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#wifi-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#wifi-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
} @media screen and (max-width: 590px) {
#wifi-top #tag__container {
height: 560px;
}
}
.headline_6::before {
background-color: #C86F98;
}
.headline_6 > span {
color: #C86F98;
}
.low section {
margin-top: 0px;
margin-bottom: 0px;
}
.wifi-flow {
padding: 0 !important;
}
.wifi-flow__inner {
margin-top: 80px;
padding: 80px;
background-color: #F4ECF2;
}
.wifi-flow__tag__wrapper {
padding: 0;
}
.wifi-flow__tag__wrapper .tab-wrap {
background-color: transparent;
}
.wifi-flow__tag__wrapper .tab__content {
margin-top: 20px;
padding: 80px 20px 20px 20px;
border: 2px solid #d9d3c9;
background-color: #fff;
}
.wifi-flow__tag__wrapper .tab__content > ol > li {
position: relative;
display: flex;
margin-bottom: 80px;
}
.wifi-flow__tag__wrapper .tab__content > ol > li::after {
content: "";
margin: 0 0 0 -20px;
padding: 0;
width: 40px;
height: 40px;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
bottom: -50px;
left: 50%;
}
.wifi-flow__tag__wrapper .tab__content > ol > li:last-child::after {
display: none;
margin-bottom: 0;
} .wifi-flow__tag__wrapper .wifi-flow__tag__content_01__icon {
width: 100px;
height: auto;
margin-left: 30px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__content {
flex: 1;
display: flex;
flex-wrap: wrap;
margin-left: 60px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__no {
font-size: 34px;
font-weight: bold;
color: #A96F98;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__title {
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
font-size: 18px;
font-weight: bold;
color: #A96F98;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__text {
margin-top: 10px;
line-height: 2em;
width: 100%;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__text span {
display: block;
font-weight: bold;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01 .komg, .wifi-flow__tag__wrapper .wifi-flow__tag__content_01__button {
margin-top: 20px;
width: 100%;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01 .komg .button, .wifi-flow__tag__wrapper .wifi-flow__tag__content_01__button .button {
width: 50%;
}
.wifi-flow__button {
margin: 80px auto 0 auto;
}
.wifi-flow__button li:last-child {
margin-top: 20px;
}
@media screen and (max-width: 960px) {
.wifi-flow .tab-wrap {
display: block;
}
.wifi-flow__tag__wrapper .tab__content {
padding-top: 20px;
}
.wifi-flow__tag__wrapper .tab__content > ol > li {
flex-wrap: wrap;
margin-bottom: 87px;
}
.wifi-flow__tag__wrapper .tab__content > ol > li:last-child {
margin-bottom: 0;
}
.wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01__icon {
display: none;
}
.wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01__content {
margin-left: 0;
}
.wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01__no {
width: 10%;
}
.wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01__title {
justify-content: flex-start;
padding-right: 14%;
width: 90%;
margin-left: 0;
}
.wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01 .komg .butto, .wifi-flow__tag__wrapper .tab__content > ol > li .wifi-flow__tag__content_01__button .button {
width: 100%;
}
.wifi-flow__tag__wrapper .tab__content > ol > li:nth-child(1) .wifi-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_nagare_moushikomi.svg) no-repeat right center/10vw auto;
}
.wifi-flow__tag__wrapper .tab__content > ol > li:nth-child(2) .wifi-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_nagare_kakunin.svg) no-repeat right top/10vw auto;
}
.wifi-flow__tag__wrapper .tab__content > ol > li:nth-child(3) .wifi-flow__tag__content_01__title {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/wifi/wifi_nagare_start.svg) no-repeat right center/10vw auto;
}
}
@media screen and (max-width: 590px) {
.wifi-flow__inner {
margin-top: 20px;
padding: 20px;
}
.wifi-flow__tag__wrapper {
margin-top: 40px;
padding: 0;
}
.wifi-flow__tag__wrapper .tab__content ol li:nth-child(n+2) .wifi-flow__tag__content_01__icon {
margin-top: 80px;
}
.wifi-flow__tag__wrapper .tab__content ol li:nth-child(n+2) .wifi-flow__tag__content_02__icon {
margin-top: 80px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__text {
font-size: 14px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__icon img {
width: 100px;
height: auto;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__content {
margin-top: 20px;
margin-left: 0;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__no {
width: 20px;
font-size: 26px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01__title {
flex: 1;
margin-left: 10px;
}
.wifi-flow__tag__wrapper .wifi-flow__tag__content_01 .komg .button, .wifi-flow__tag__wrapper .wifi-flow__tag__content_01__button .button {
width: 100%;
}
.wifi-flow__button {
margin: 20px auto 0 auto;
}
} #wifi-top .m-option_service {
background-color: #fff;
}
#wifi-top .m-option_service__inner {
position: relative;
margin-top: 40px;
padding: 60px 0 100px 0;
background-size: 100% auto;
background: linear-gradient(90deg, #f1e8ef, #d1cbde);
background-size: 60% 90%;
background-repeat: no-repeat;
background-position: left;
}
@media screen and (max-width: 960px) {
#wifi-top .m-option_service__inner {
margin-top: 0;
padding: 20px;
background-image: none;
}
}
@media screen and (max-width: 590px) {
#wifi-top .m-option_service__inner {
padding-bottom: 0;
}
}
#wifi-top .m-option_service__img img {
position: absolute;
top: 0;
left: 10%;
width: 45%;
height: auto;
object-fit: cover;
}
@media screen and (max-width: 960px) {
#wifi-top .m-option_service__img img {
position: static;
width: 100%;
height: auto;
}
}
#wifi-top .m-option_service .headline_2 {
color: #A96F98;
font-size: 34px;
font-weight: lighter;
}
@media screen and (max-width: 960px) {
#wifi-top .m-option_service .headline_2 {
font-weight: 300;
}
}
#wifi-top .m-option_service__text {
display: flex;
align-items: center;
justify-content: flex-end;
}
@media screen and (max-width: 960px) {
#wifi-top .m-option_service__text {
align-items: flex-start;
justify-content: center;
}
}
@media screen and (max-width: 590px) {
#wifi-top .m-option_service__text {
padding: 0;
}
}
#wifi-top .m-option_service__box {
width: 50%;
padding: 40px 0 40px 40px;
background-color: #fff;
}
@media screen and (max-width: 960px) {
#wifi-top .m-option_service__box {
width: 100%;
padding: 20px;
}
}
@media screen and (max-width: 590px) {
#wifi-top .m-option_service__box {
margin: 0;
padding: 20px 0;
}
}
#wifi-top .m-option_service .text {
margin-top: 18px;
line-height: 2;
}
#wifi-top .m-option_service .note {
margin-top: 14px;
line-height: 2;
color: #333333;
margin-bottom: 10px;
}
@media screen and (max-width: 590px) {
#wifi-top .m-option_service .note {
font-size: 12px;
}
}
#wifi-top .m-description {
width: 100%;
background-color: #fff;
}
#wifi-top .m-description__inner {
width: calc(100% - 56px);
max-width: 790px;
margin: 30px auto;
border: solid 1px #424242;
padding: 32px;
}
#wifi-top .m-description__inner__title {
text-align: center;
font-size: 18px;
margin-bottom: 27px;
color: #666;
}
#wifi-top .m-description__inner__text {
margin-bottom: 16px;
font-size: 16px;
}
@media screen and (max-width: 590px) {
#wifi-top .m-description {
padding: 20px 0;
}
#wifi-top .m-description__inner {
width: calc(100% - 16px);
padding: 32px 16px;
margin: 0 auto;
}
}  #teigaku-top .low__kv__back {
height: 50vh;
background-size: cover;
background-repeat: no-repeat;
background-position: bottom;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_top_back.jpg);
background-attachment: fixed;
position: relative;
}
#teigaku-top .low__kv__back .kv-ttl_pc {
position: absolute;
bottom: 30px;
right: 75px;
}
#teigaku-top .low__kv__back .kv-ttl_pc img {
height: auto;
object-fit: contain;
width: 700px;
}
#teigaku-top .low__kv__back .kv-ttl_sp {
width: 85%;
top: 0px;
right: 30px;
object-fit: contain;
position: absolute;
bottom: -20px;
}
#teigaku-top .low__kv__back .kv-ttl_sp img {
object-fit: contain;
}
@media screen and (max-width: 960px) {
#teigaku-top .low__kv__back {
height: 300px;
}
#teigaku-top .low__kv__back .kv-ttl_pc {
top: 80px;
right: 50px;
}
#teigaku-top .low__kv__back .kv-ttl_pc img {
height: auto;
width: 400px;
object-fit: contain;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .low__kv {
position: relative;
height: 200px;
}
#teigaku-top .low__kv__back {
background-image: none;
background-attachment: unset;
height: 200px;
}
#teigaku-top .low__kv__back:before {
content: "";
display: block;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 310px;
z-index: -10;
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_top_back.jpg);
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-position: 20% 0%;
background-size: 200%;
}
} #teigaku-top .teigaku-top_sec_03 {
background-color: #fff;
}
#teigaku-top .subline_1 {
text-align: center;
font-size: 20px;
font-weight: bold;
margin-top: 40px;
line-height: 2em;
}
@media screen and (max-width: 590px) {
#teigaku-top .subline_1 {
margin: 0px 15px;
}
}
#teigaku-top .main-price {
padding: 5px 10px 10px 10px;
}
#teigaku-top .headline_4 {
font-family: "Trebuchet MS", "Hind", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "メイリオ", sans-serif;
}
#teigaku-top .teigaku-top_sec_03__inner-1 {
position: relative;
margin-top: 40px;
height: 450px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_bg1.png);
background-size: 65% 90%;
background-position: right center;
}
#teigaku-top .teigaku-top_sec_03__inner-2 {
height: 450px;
margin-top: 40px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_bg2.png);
background-size: 70% 90%;
background-position: left center;
}
#teigaku-top .teigaku-top_sec_03__inner-1 .teigaku-top_sec_03__box {
margin-top: 10%;
padding: 40px 40px 40px 0;
background-color: #fff;
}
#teigaku-top .teigaku-top_sec_03__inner-2 .teigaku-top_sec_03__box {
margin-top: 10%;
padding: 40px 0 40px 40px;
background-color: #fff;
}
#teigaku-top .teigaku-top_sec_03__inner-2 .teigaku-top_sec_03__box__wrapper {
display: flex;
justify-content: flex-end;
}
#teigaku-top .teigaku-top_sec_03__text {
margin-top: 20px;
margin-bottom: 20px;
font-size: 16px;
line-height: 2em;
}
#teigaku-top .teigaku-top_sec_03__text-2 {
font-size: 13px;
margin-bottom: 20px;
}
#teigaku-top .teigaku-top_sec_03__img-1 {
position: absolute;
top: 0;
left: 40%;
height: 100%;
}
#teigaku-top .teigaku-top_sec_03__img-1 img {
width: auto;
height: 100%;
}
#teigaku-top .teigaku-top_sec_03__img-2 {
position: absolute;
top: 0;
left: 20%;
height: 100%;
}
#teigaku-top .teigaku-top_sec_03__img-2 img {
width: auto;
height: 100%;
}
#teigaku-top .teigaku-top_sec_03__inner-1 .headline_2 {
color: #008793;
font-weight: 200;
}
@media screen and (max-width: 590px) {
#teigaku-top .teigaku-top_sec_03__inner-1 .headline_2 {
font-weight: 300;
}
}
#teigaku-top .teigaku-top_sec_03__inner-1 .main-price {
text-align: center;
color: #008793;
background-color: #f7f7f7;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
}
#teigaku-top .teigaku-top_sec_03__inner-2 .headline_2 {
color: #FF8B40;
}
@media screen and (max-width: 590px) {
#teigaku-top .teigaku-top_sec_03__inner-2 .headline_2 {
font-weight: 300;
}
}
#teigaku-top .teigaku-top_sec_03__inner-2 .main-price {
text-align: center;
color: #FF8B40;
background-color: #f7f7f7;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
}
#teigaku-top .teigaku-top_sec_03 #price-lg {
font-size: 32px;
}
#teigaku-top .teigaku-top_sec_03 #price-md {
font-size: 24px;
}
@media screen and (max-width: 960px) {
#teigaku-top .teigaku-top_sec_03__inner-1, #teigaku-top .teigaku-top_sec_03__inner-2 {
height: auto;
}
#teigaku-top .teigaku-top_sec_03__img-1, #teigaku-top .teigaku-top_sec_03__img-2 {
position: static;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: auto;
}
#teigaku-top .teigaku-top_sec_03__img-1 img, #teigaku-top .teigaku-top_sec_03__img-2 img {
width: 70%;
height: auto;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .teigaku-top_sec_03 {
padding: 30px 0 !important;
}
#teigaku-top .teigaku-top_sec_03__inner-1 {
background: none;
}
#teigaku-top .teigaku-top_sec_03__img-1 img, #teigaku-top .teigaku-top_sec_03__img-2 img {
width: 100%;
}
#teigaku-top .teigaku-top_sec_03__inner-2 {
background: none;
}
#teigaku-top .teigaku-top_sec_03__inner-1 .teigaku-top_sec_03__box {
margin-top: 20px;
padding: 0px;
}
#teigaku-top .teigaku-top_sec_03__inner-2 .teigaku-top_sec_03__box {
margin-top: 20px;
padding: 0px;
}
#teigaku-top .teigaku-top_sec_03__inner-2 .teigaku-top_sec_03__box__wrapper {
display: flex;
justify-content: flex-end;
}
#teigaku-top .teigaku-top_sec_03__text {
margin-top: 20px;
}
#teigaku-top .subline_1 {
font-size: 15px;
font-weight: normal;
margin-top: 20px;
text-align: left;
}
#teigaku-top .subline_1 br {
display: none;
}
} #teigaku-top .teigaku-top_sec_03__inner-3 {
margin-top: 80px;
}
#teigaku-top .teigaku-top_sec_03__inner-3__item {
display: flex;
justify-content: space-between;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1 {
width: 48%;
border: solid 1px #005090;
border-radius: 10px;
padding: 20px 40px;
text-align: center;
} #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1 ul {
font-size: 13px;
text-align: left;
margin-top: 20px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1 ul li:nth-child(2) {
padding-left: 90px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1 ul li small {
vertical-align: super;
} #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 ul {
font-size: 13px;
text-align: left;
margin-top: 20px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 ul li:nth-child(2), #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 ul li:nth-child(3), #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 ul li:nth-child(4) {
padding-left: 90px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 ul li small {
vertical-align: super;
} #teigaku-top .teigaku-top_sec_03__inner-3 ul {
font-size: 13px;
text-align: left;
margin-top: 15px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 {
width: 48%;
border: solid 1px #FF8B40;
border-radius: 10px;
padding: 20px 40px;
text-align: center;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1__title {
color: #008793;
font-size: 28px;
font-weight: bold;
text-align: center;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2__title {
color: #FF8B40;
font-size: 28px;
font-weight: bold;
text-align: center;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1__img {
height: 100px;
max-width: 100%;
margin-top: 10px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2__img {
height: 100px;
max-width: 100%;
margin-top: 10px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2__text {
font-size: 13px;
margin-top: 20px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1 .main-price {
text-align: center;
color: #008793;
background-color: #f7f7f7;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
margin-top: 50px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 .main-price {
text-align: center;
color: #FF8B40;
background-color: #f7f7f7;
font-size: 18px;
font-weight: bold;
letter-spacing: 2px;
margin-top: 10px;
}
@media screen and (max-width: 960px) {
#teigaku-top .teigaku-top_sec_03__inner-3 {
margin-top: 0;
}
#teigaku-top .teigaku-top_sec_03__inner-3__item {
flex-wrap: wrap;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1, #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 {
margin-top: 20px;
width: 100%;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .teigaku-top_sec_03__inner-3 {
margin-top: 0;
}
#teigaku-top .teigaku-top_sec_03__inner-3 ul.note {
margin: 15px 15px 0 15px;
}
#teigaku-top .teigaku-top_sec_03__inner-3__item {
padding: 0 10px;
}
#teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-1, #teigaku-top .teigaku-top_sec_03 .teigaku-plan__box-2 {
margin-top: 20px;
padding: 20px 10px;
width: 100%;
}
} #teigaku-top .headline_1 {
text-align: center !important;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_textline.svg);
}
#teigaku-top .column {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/column/column_bg_denki.jpg);
}
#teigaku-top .headline_2 {
color: #746216;
}
#teigaku-top .low_top_sec_01 {
background-color: #fff;
}
#teigaku-top .low_top_sec_01__item {
justify-content: center;
}
#teigaku-top .low_top_sec_01__item a:hover {
background-color: rgba(255, 185, 74, 0.3);
}
#teigaku-top .low_top_sec_01__item_icon {
width: 100px;
height: auto;
}
#teigaku-top .low_top_sec_01__item_text {
color: #551d00;
line-height: 2em;
}
#teigaku-top .low_top_sec_01 .note {
margin-top: 20px;
}
@media screen and (max-width: 992px) {
.low_top_sec_01__item li {
margin-bottom: 20px;
}
}
@media screen and (max-width: 960px) {
#teigaku-top .low_top_sec_01__item {
padding: 0 5px;
}
#teigaku-top .low_top_sec_01__item a {
padding: 15px 0;
}
#teigaku-top .low_top_sec_01__item li {
width: 33.3%;
padding: 0 5px;
}
#teigaku-top .low_top_sec_01__item_icon {
width: 60%;
}
#teigaku-top .low_top_sec_01__item_text {
margin-top: 15px;
padding: 0 5px;
font-size: 13px;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .low_top_sec_01__item {
padding: 0 5px;
}
#teigaku-top .low_top_sec_01__item__text {
margin: 15px 5px;
font-size: 13px;
}
#teigaku-top .low_top_sec_01__item__text br {
display: none;
}
} #teigaku-top .teigaku-top_sec_04 {
background-color: #fff;
}
#teigaku-top .teigaku-top_sec_04__inner {
margin: 60px 0 40px;
padding: 40px 0;
background-size: 80% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/teigaku/teigaku_bg1.png);
background-size: 60% 100%;
background-position: right center;
}
.teigaku-top_sec_04__wrapper {
display: flex;
align-items: flex-end;
}
#teigaku-top .teigaku-top_sec_04__box {
padding: 40px 40px 40px 0;
background-color: #fff;
}
#teigaku-top .headline_2 {
color: #551D00;
}
#teigaku-top .teigaku-top_sec_04__box p {
margin-top: 40px;
line-height: 2em;
}
#teigaku-top .teigaku-top_sec_04__box ul li:first-child {
margin-bottom: 40px;
}
#teigaku-top .teigaku-top_sec_04__img img {
width: 751px;
max-width: 100%;
margin-top: 0;
}
#teigaku-top .teigaku-top_sec_04__img {
vertical-align: middle;
}
@media screen and (max-width: 960px) {
#teigaku-top .teigaku-top_sec_04 {
padding: 40px 0 !important;
}
#teigaku-top .teigaku-top_sec_04__inner {
background-color: #E5FFF7;
background-image: none;
padding: 20px 0;
}
#teigaku-top .teigaku-top_sec_04__box {
margin-top: 20px;
padding: 20px;
}
#teigaku-top .teigaku-top_sec_04__box .headline_2 {
font-size: 26px;
}
#teigaku-top .teigaku-top_sec_04__box p {
margin-top: 20px;
}
#teigaku-top .teigaku-top_sec_04__img {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
height: auto;
}
#teigaku-top .teigaku-top_sec_04__img img {
margin-top: 0;
width: 100%;
height: auto;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .teigaku-top_sec_04 {
background-color: #e5fff7;
}
#teigaku-top .teigaku-top_sec_04__wrapper {
padding: 10px;
}
#teigaku-top .teigaku-top_sec_04__inner {
margin: 20px 0 0;
}
#teigaku-top .teigaku-top_sec_04__box {
margin: 0 !important;
padding: 0 0px;
width: 100%;
background: none;
}
} #teigaku-top .low_top_sec_05 {
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/img_03.jpg);
background-size: cover;
}
#teigaku-top .low_top_sec_05 .headline_1 {
margin-top: 80px;
text-align: center;
}
#teigaku-top .low_top_sec_05 .headline_2 {
margin-top: 40px;
text-align: center;
}
#teigaku-top .low_top_sec_05 .headline_2 br {
display: none;
}
#teigaku-top .low_top_sec_05__text {
margin-top: 40px;
line-height: 2em;
text-align: center;
}
#teigaku-top .low_top_sec_05__item {
margin-top: 40px;
}
#teigaku-top .low_top_sec_05__item li {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
align-items: flex-start;
}
#teigaku-top .low_top_sec_05__item li a {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
align-items: flex-start;
padding: 50px 0;
width: 250px;
height: 250px;
background-color: #fff;
text-align: center;
border-radius: 100%;
}
#teigaku-top .low_top_sec_05__icon {
width: 100%;
}
#teigaku-top .low_top_sec_05__icon img {
width: 40%;
height: auto;
}
#teigaku-top .low_top_sec_05__logo {
width: 100%;
}
#teigaku-top .low_top_sec_05__logo img {
width: 70%;
height: auto;
}
#teigaku-top .low_top_sec_05__cath {
width: 100%;
padding: 20px;
font-size: 14px;
}
#teigaku-top .low_top_sec_05__button {
margin: 40px auto 0 auto;
padding: 0;
}
@media screen and (max-width: 960px) {
#teigaku-top .low_top_sec_05__item li a {
width: 150px;
height: 150px;
}
#teigaku-top .low_top_sec_05__icon img {
width: 60px;
height: auto;
}
#teigaku-top .low_top_sec_05__logo img {
width: 100px;
height: auto;
}
#teigaku-top .low_top_sec_05__cath {
padding: 10px 0;
}
}
@media screen and (max-width: 590px) {
#teigaku-top .low_top_sec_05 .headline_1 {
margin-top: 40px;
}
#teigaku-top .low_top_sec_05 .headline_2 {
margin-top: 20px;
}
#teigaku-top .low_top_sec_05 .headline_2 br {
display: block;
}
#teigaku-top .low_top_sec_05__text {
margin-top: 20px;
}
#teigaku-top .low_top_sec_05__item {
margin-top: 0;
}
#teigaku-top .low_top_sec_05__item li {
margin-top: 40px;
}
#teigaku-top .low_top_sec_05__item li a {
padding: 30px 0;
}
#teigaku-top .low_top_sec_05__cath {
padding: 10px 20px 0 20px;
}
}
#teigaku-top .low_top_sec_06 {
padding: 0 40px 20px;
}
#teigaku-top .low_top_sec_06__inner {
padding: 80px 0;
background-color: #FFF8D8;
}
#teigaku-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-top .low_top_sec_06__tag__content ol {
display: flex;
justify-content: space-between;
}
#teigaku-top .low_top_sec_06__tag__content li {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
padding: 0 10px;
width: 20%;
}
#teigaku-top .low_top_sec_06__tag__content li::after {
position: absolute;
right: -30px;
top: 30px;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
opacity: 0.7;
}
#teigaku-top .low_top_sec_06__tag__content li:last-child::after {
display: none;
}
#teigaku-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #FF4C40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#teigaku-flow .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
#teigaku-flow .low_top_sec_06 {
padding: 0;
}
#teigaku-flow .low_top_sec_06__inner {
padding: 40px 20px;
}
#teigaku-flow .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-flow .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#teigaku-flow .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-flow .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-flow .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#teigaku-flow .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
@media screen and (max-width: 590px) {
#teigaku-top .low_top_sec_06 {
padding: 0;
}
#teigaku-top .low_top_sec_06__inner {
padding: 40px 20px;
}
#teigaku-top .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-top .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#teigaku-top .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#teigaku-top .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#teigaku-top .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-top .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-top .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-top .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
} .teigaku-flow {
padding: 0 !important;
}
.teigaku-flow .headline_6::before {
background-color: #FFB036;
}
.teigaku-flow .headline_6 > span {
color: #FFB036;
}
.teigaku-flow__inner {
margin-top: 80px;
padding: 80px;
background-color: #FFF8D8;
}
#teigaku-flow .low_top_sec_06 {
padding: 0 40px;
margin-top: 60px;
}
#teigaku-flow .low_top_sec_06__inner {
padding: 80px 0;
margin-bottom: 80px;
background-color: #FFF8D8;
}
@media screen and (max-width: 590px) {
#teigaku-flow .low_top_sec_06 {
padding: 0;
}
#teigaku-flow .low_top_sec_06__inner {
padding: 40px 20px;
}
#teigaku-flow .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-flow .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#teigaku-flow .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-flow .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-flow .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
}
#teigaku-flow .low_top_sec_06__inner {
padding: 80px 0;
margin-bottom: 80px;
background-color: #FFF8D8;
}
#teigaku-flow .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-flow .low_top_sec_06__tag__content ol {
display: flex;
justify-content: space-between;
}
#teigaku-flow .low_top_sec_06__tag__content li {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
padding: 0 10px;
width: 20% !important;
}
#teigaku-flow .low_top_sec_06__tag__content li::after {
position: absolute;
left: 100% !important;
top: 30px !important;
margin: 0 10px;
font-family: "Font Awesome 5 Free";
content: "\f054" !important;
font-weight: 900;
opacity: 0.7;
}
#teigaku-flow .low_top_sec_06__tag__content li:last-child::after {
display: none;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-flow .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-flow .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #FF4C40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#teigaku-flow .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
#teigaku-flow .low_top_sec_06 {
padding: 0;
}
#teigaku-flow .low_top_sec_06__inner {
padding: 40px 20px;
}
#teigaku-flow .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-flow .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#teigaku-flow .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-flow .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-flow .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
#teigaku-flow .low_top_sec_06__tag__content_01__text {
flex: 1;
font-weight: bold;
font-size: 15px;
}
@media screen and (max-width: 590px) {
#teigaku-flow .low_top_sec_06 {
padding: 0;
}
#teigaku-flow .low_top_sec_06__inner {
padding: 40px 20px;
}
#teigaku-flow .low_top_sec_06__tag__wrapper {
margin-top: 40px;
}
#teigaku-flow .low_top_sec_06__tag__content ol {
flex-wrap: wrap;
}
#teigaku-flow .low_top_sec_06__tag__content li {
margin-bottom: 40px;
padding: 0;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content li::after {
left: 50%;
top: 100%;
margin: 0;
text-align: center;
transform: translateX(-50%);
content: "\f078";
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon {
display: flex;
justify-content: center;
align-items: flex-start;
width: 100%;
}
#teigaku-flow .low_top_sec_06__tag__content_01__icon img {
width: 80px;
height: 80px;
}
#teigaku-flow .low_top_sec_06__tag__content_01__content {
margin-top: 20px;
display: flex;
align-items: center;
}
#teigaku-flow .low_top_sec_06__tag__content_01__no {
width: 50px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
}
.teigaku-flow__button {
margin: 40px auto 0 auto;
}
.teigaku-flow__button li {
margin-top: 20px;
}
#teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content_01__text {
padding-left: 10px;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol {
flex-wrap: wrap;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li {
display: flex;
margin-top: 100px;
width: 100% !important;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li::after, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li::after {
display: none;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li::before, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li::before {
content: "";
margin-left: -25px;
padding: 0;
width: 50px;
height: 50px;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
position: absolute;
top: 110%;
left: 50%;
opacity: 0.7;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li:first-child, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li:first-child {
margin-top: 0;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li:last-child::before, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second ol > li:last-child::before {
display: none;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__icon, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__icon {
display: flex;
padding-top: 30px;
width: 20%;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__content, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__content {
flex-wrap: wrap !important;
width: 80%;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__no, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__no {
width: 10%;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__title, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__title {
width: 90%;
font-weight: bold;
font-size: 18px;
color: #ff4c40;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text {
margin-top: 20px;
width: 100% !important;
line-height: 2em;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul {
flex-wrap: wrap;
margin-top: 20px;
width: 100% !important;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul li, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul li {
width: 100%;
width: 100% !important;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul li::after, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__text ul li::after {
display: none;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__button, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__button {
width: 100% !important;
margin-top: 20px;
}
#teigaku-flow .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__button a, #teigaku-top .low_top_sec_06 .low_top_sec_06__tag__content#second .low_top_sec_06__tag__content_01__button a {
width: 60% !important;
}
#teigaku-top .low_top { }
#teigaku-top .low_top_sec_07 {
padding: 60px 0;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/denki_QA_back.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#teigaku-top .low_top_sec_07_block {
margin: 50px 0;
}
#teigaku-top .low_top_sec_07 .low_top_sec_07-box {
background-color: white;
border: solid 3px #04c48a;
border-radius: 36px;
margin: 20px 0;
padding: 20px 40px 15px 60px;
}
#teigaku-top .low_top_sec_07 input {
display: none;
}
#teigaku-top .low_top_sec_07 label {
display: block !important;
font-size: 18px;
position: relative;
font-weight: 600;
}
#teigaku-top .low_top_sec_07 label:before {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_Q.svg);
font-size: 36px;
position: absolute;
height: 22px;
width: 22px;
left: -35px;
top: -13px;
font-weight: bold;
}
#teigaku-top .low_top_sec_07 label:after {
content: url(//marutto.co.jp/wp-content/themes/marutto/app/img/gas/gas_Q_arrow.svg);
position: absolute;
bottom: -2.15rem;
right: 0;
top: 0;
margin-left: -0.1rem;
width: 20px;
height: 20px;
transition: all 0.3s;
}
#teigaku-top .low_top_sec_07 .answer {
overflow: hidden;
color: #04c48a;
font-size: 16px;
transition: max-height 0.3s;
max-height: 0px;
}
#teigaku-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label ~ p {
max-height: 300px;
transition: all 1s;
margin: 10px 0;
}
#teigaku-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
transform: rotate(-180deg);
-webkit-transform: rotate(-180deg);
top: 0;
transition: all 0.3s;
}
@media screen and (max-width: 590px) {
#teigaku-top .low_top_sec_07 {
margin-top: -30px !important;
}
#teigaku-top .low_top_sec_07 .low_top_sec_07-box {
margin: 10px 0;
padding: 10px 15px 0;
}
#teigaku-top .low_top_sec_07 .low_top_sec_07-box input[type=checkbox]:checked ~ label::after {
top: 10px;
}
#teigaku-top .low_top_sec_07 .container {
margin: 0px;
width: auto;
}
#teigaku-top .low_top_sec_07 label {
font-size: 15px;
margin-bottom: 0px !important;
padding: 5px 20px 0 25px;
}
#teigaku-top .low_top_sec_07 label:before {
font-size: 24px;
left: 0px;
top: 0;
width: 20px;
}
#teigaku-top .low_top_sec_07 label:after {
width: 15px;
height: 15px;
top: 5px;
}
#teigaku-top .low_top_sec_07 .answer {
font-size: 14px;
padding: 10px 0 0 0;
}
} .header-lp {
position: relative;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/head_back.jpg);
background-size: cover;
text-align: center;
}
.header-lp__logo {
padding: 30px 0 0 30px;
width: 230px;
}
.header-lp__logo img {
width: 100%;
height: auto;
}
.header-lp__h1 {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 100px;
padding-left: 10%;
width: 100%;
}
.header-lp__h1 img {
width: 90%;
height: auto;
}
.header-lp__button {
position: absolute;
bottom: 60px;
left: 50%;
width: 400px;
transform: translateX(-50%);
}
.container, .row {
clear: both;
}
@media screen and (max-width: 960px) {
.header-lp {
position: relative;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/head_back.jpg);
background-size: cover;
}
.header-lp__logo {
padding: 10px 0 0 10px;
}
.header-lp__h1 {
margin-top: 40px;
}
.header-lp__h1 img {
width: 950%;
}
.header-lp__button {
bottom: -30px;
width: 50%;
}
}
@media screen and (max-width: 590px) {
.header-lp {
position: relative;
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/head_back.jpg);
background-size: cover;
}
.header-lp__logo {
padding: 10px 0 0 10px;
}
.header-lp__h1 {
margin-top: 40px;
}
.header-lp__h1 img {
width: 950%;
}
.header-lp__button {
bottom: -40px;
width: 100%;
padding: 0 20px;
}
}
.header-lp .yellow {
background-color: #FFDF57;
border: solid 1px #181E21;
font-size: 18px;
}
.low_top_sec_01__img-pc {
width: 100%;
max-width: 100%;
display: block;
}
.low_top_sec_01__img-sp {
display: none;
max-width: 100%;
} #lp-top .headline_1 .pinkmark {
display: inline-block;
background: linear-gradient(transparent 60%, #FFDEDF 60%);
width: auto;
height: 50px;
}
#lp-top .headline_1 .yellowmark {
display: inline-block;
background: linear-gradient(transparent 60%, #FFF03E 60%);
width: auto;
height: 50px;
}
#lp-top .headline_1 {
background-image: none;
}
#lp-top .low_top_sec_01__intro {
text-align: center;
font-weight: bold;
letter-spacing: 5px;
font-size: 18px;
margin: 30px auto 50px;
line-height: 2em;
}
#lp-top .green {
background-color: #A6FCD4;
border: solid 1px #181E21;
font-size: 18px;
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_01__intro {
text-align: left;
font-weight: normal;
letter-spacing: 0;
font-size: 16px;
margin: 20px auto;
line-height: 1.5em;
}
} #lp-top .low_top_sec_02 {
background-color: #fff4f4;
transform: skewY(-4deg);
-webkit-transform: skewY(-4deg);
-ms-transform: skewY(-4deg);
-moz-transform: skewY(-4deg);
-o-transform: skewY(-4deg);
}
#lp-top .low_top_sec_02 > .container {
transform: skewY(4deg);
-webkit-transform: skewY(4deg);
-ms-transform: skewY(4deg);
-moz-transform: skewY(4deg);
-o-transform: skewY(4deg);
}
#lp-top .headline_1 {
text-align: center;
font-size: 30px;
font-weight: bold;
letter-spacing: 5px;
}
#lp-top .headline_1 br {
display: none;
}
@media screen and (max-width: 960px) {
#lp-top .headline_1 {
font-size: 26px;
}
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_02 .headline_1 {
margin-top: 40px;
}
}
#lp-top .headline_1 .pinkmark {
height: 30px;
background: linear-gradient(transparent 56%, #FFDEDF 20%);
}
#lp-top .headline_1 .yellowmark {
background: linear-gradient(transparent 56%, #FFF03E 20%);
height: 30px;
}
@media screen and (max-width: 960px) {
#lp-top .low_top_sec_01__intro {
text-align: left;
padding: 0 40px;
}
#lp-top .low_top_sec_01__intro br {
display: none;
}
#lp-top .low_top_sec_03 .headline_4 {
font-size: 18px !important;
}
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_01__intro {
text-align: left;
}
#lp-top .low_top_sec_03 .headline_4 {
font-size: 18px !important;
}
}
#lp-top .headline_2 {
font-size: 22px;
font-weight: bold;
margin-top: 20px;
display: flex;
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_03 .headline_4 {
font-size: 18px;
}
#lp-top .headline_2 {
font-size: 18px;
}
}
#lp-top .headline_2-icon {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/lp_bubble.svg);
height: 100px;
width: 100px;
background-repeat: no-repeat;
background-position: center;
line-height: 100px;
text-align: center;
font-size: 22px;
font-weight: bold;
margin-right: 25px;
}
@media screen and (max-width: 590px) {
#lp-top .headline_2-icon {
width: 70px;
height: 70px;
line-height: 70px;
font-size: 16px;
font-weight: normal;
margin-right: 10px;
}
}
#lp-top .headline_2-title {
padding-top: 10px;
}
#lp-top .low_top_sec_02__block-1 {
background-color: #DEDEDE;
border: solid 1px #909090;
border-radius: 50px;
padding: 30px;
text-align: center;
margin-top: 10px;
margin-bottom: 50px;
}
#lp-top .low_top_sec_02__block-2 {
background-color: white;
border: solid 1px #FFD92C;
border-radius: 50px;
padding: 30px;
text-align: center;
margin-top: 10px;
margin-bottom: 50px;
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_02__block-1 {
margin-bottom: 10px;
}
#lp-top .low_top_sec_02__block-1 img {
width: 80%;
height: auto;
}
#lp-top .low_top_sec_02__block-2 {
margin-bottom: 10px;
}
#lp-top .low_top_sec_02__block-2 img {
height: auto;
}
}
.low_top_sec_02__block-1 img {
width: 400px;
max-width: 100%;
margin-top: 20px;
}
.low_top_sec_02__block-2 > img {
width: 380px;
max-width: 100%;
margin-top: 20px;
}
#lp-top .low_top_sec_02 .headline_3 {
font-size: 20px;
font-weight: bold;
text-align: center;
}
.low_top_sec_02__block-2__logo {
width: 220px;
max-width: 100%;
}
#lp-top .low_top_sec_02__block__text {
font-size: 16px;
font-weight: bold;
letter-spacing: 3px;
text-align: left;
margin-top: 10px;
}
#lp-top .low_top_sec_02__block__img-hito {
height: 100px;
vertical-align: bottom;
}
#lp-top .low_top_sec_02__block-3__back {
background-color: white;
padding: 30px 30px 0px 30px;
border-radius: 50px;
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_02__block-3__back {
padding: 20px;
}
#lp-top .low_top_sec_02__block-3 {
margin-top: 0;
}
#lp-top .low_top_sec_02__block-3__back {
margin-top: 30px;
}
}
#lp-top .low_top_sec_02__block-3__text {
font-size: 16px;
font-weight: bold;
letter-spacing: 3px;
text-align: left;
margin-top: 10px;
}
#lp-top .low_top_sec_02__block-3__title {
font-size: 16px;
font-weight: bold;
letter-spacing: 3px;
text-align: left;
margin-top: 10px;
}
@media screen and (max-width: 992px) {
#lp-top .low_top_sec_02__block-3 {
text-align: center;
}
#lp-top .low_top_sec_02__block-3__text {
text-align: center;
margin-top: 20px;
}
#lp-top .low_top_sec_02__block-3__title {
margin-top: 20px;
text-align: center;
}
}
@media screen and (max-width: 768px) {
#lp-top .low_top_sec_02__block-3__text {
margin-top: 40px;
}
#lp-top .low_top_sec_02__block-3__title {
margin-top: 0px;
}
}
#lp-top .low_top_sec_02__block-3__details {
font-size: 13px;
margin-top: 20px;
} .low_top_sec_05__item {
margin-top: 40px;
}
.low_top_sec_05__item li {
height: 155px;
}
.low_top_sec_05__item li a {
position: relative;
display: block;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding-top: 5px;
align-items: center;
text-align: center;
color: #fff;
font-size: 22px;
letter-spacing: 2px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-color: rgba(0, 0, 0, 0.2);
}
.low_top_sec_05__item li a::after {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
content: "";
}
.low_top_sec_05__item li a span {
margin-top: 4px;
line-height: 1;
}
.low_top_sec_05__item li:nth-child(1) a {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_04.jpg);
}
.low_top_sec_05__item li:nth-child(2) a {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_05.jpg);
}
.low_top_sec_05__item li:nth-child(3) a {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_06.jpg);
}
.low_top_sec_05__item li:nth-child(4) a {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_07.jpg);
}
.low_top_sec_05__item li:nth-child(n+3) {
margin-top: 30px;
}
.low_top_sec_05__item li img {
margin-left: 40px;
width: 80px;
height: auto;
}
@media screen and (max-width: 960px) {
.low_top_sec_05__item {
margin-top: 0;
padding: 0 20px;
}
.low_top_sec_05__item li {
margin-top: 20px;
height: 100px;
}
.low_top_sec_05__item li a {
font-size: 16px;
}
.low_top_sec_05__item li img {
margin-left: 10px;
width: 40px;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_05__item {
margin-top: 0;
padding: 0 20px;
}
.low_top_sec_05__item li {
margin-top: 20px;
height: 80px;
}
.low_top_sec_05__item li a {
font-size: 16px;
}
.low_top_sec_05__item li img {
margin-left: 10px;
width: 40px;
}
}
#lp-top .low_top_sec_04__button {
margin: 40px auto 50px auto;
padding: 0;
} #lp-top .low_top_sec_03 {
margin-bottom: 0px;
padding-bottom: 0px;
}
#lp-top .low_top_sec_03 .headline_4 {
font-size: 24px;
text-align: center;
font-weight: bold;
margin-top: 40px;
}
#lp-top .low_top_sec_03 .headline_4 br {
display: none;
}
@media screen and (max-width: 590px) {
#lp-top .low_top_sec_03 .headline_4 {
margin-top: 0;
}
#lp-top .low_top_sec_03 .headline_4 br {
display: block;
}
}
#lp-top .low_top_sec_03 .container {
padding: 0;
}
.low_top_sec_03__block-1 {
margin-top: 40px;
padding: 0;
}
@media screen and (max-width: 590px) {
.low_top_sec_03__block-1 {
padding: 0 20px !important;
}
}
.low_top_sec_03__block-2 {
margin-top: 40px;
}
@media screen and (max-width: 590px) {
.low_top_sec_03__block-2 {
margin-top: 0;
padding: 0 20px;
}
}
.low_top_sec_03__block-2 img {
width: 100%;
}
.low_top_sec_03__block-2 {
margin-bottom: 70px;
}
.low_top_sec_03 .button {
height: 60px;
}
.low_top_sec_03__block-1__element-1, .low_top_sec_03__block-1__element-2, .low_top_sec_03__block-1__element-3, .low_top_sec_03__block-1__element-4, .low_top_sec_03__block-1__element-5, .low_top_sec_03__block-1__element-6 {
margin-bottom: 20px;
text-align: center;
}
.low_top_sec_03__block-1__element-1__back, .low_top_sec_03__block-1__element-2__back, .low_top_sec_03__block-1__element-3__back, .low_top_sec_03__block-1__element-4__back, .low_top_sec_03__block-1__element-5__back, .low_top_sec_03__block-1__element-6__back {
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
border-radius: 5px;
height: 280px;
}
@media screen and (max-width: 590px) {
.low_top_sec_03__block-1__element-1__back, .low_top_sec_03__block-1__element-2__back, .low_top_sec_03__block-1__element-3__back, .low_top_sec_03__block-1__element-4__back, .low_top_sec_03__block-1__element-5__back, .low_top_sec_03__block-1__element-6__back {
height: auto;
padding-bottom: 30px;
}
}
.low_top_sec_03__icon img {
width: 50px;
margin-bottom: 15px;
max-width: 100%;
}
.low_top_sec_03__logo img {
width: 120px;
max-width: 100%;
}
@media screen and (max-width: 768px) {
.low_top_sec_03__logo img {
width: 90%;
}
}
.low_top_sec_03__block-1__element-1__top, .low_top_sec_03__block-1__element-2__top, .low_top_sec_03__block-1__element-3__top, .low_top_sec_03__block-1__element-4__top, .low_top_sec_03__block-1__element-5__top, .low_top_sec_03__block-1__element-6__top {
padding: 30px 20px 40px 20px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.low_top_sec_03__block-1__element-1__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/denki_back.jpg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-2__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/gas_back.jpeg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-3__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/hikari_back.jpg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-4__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/water_back.jpg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-5__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/iot_back.jpg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-6__top {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/lp/wifi_back.jpg) rgba(75, 61, 61, 0.7);
background-size: cover;
background-blend-mode: multiply;
}
.low_top_sec_03__block-1__element-1__down, .low_top_sec_03__block-1__element-2__down, .low_top_sec_03__block-1__element-3__down, .low_top_sec_03__block-1__element-4__down, .low_top_sec_03__block-1__element-5__down, .low_top_sec_03__block-1__element-6__down {
padding: 15px 10px 15px 10px;
text-align: left;
font-size: 12px;
position: relative;
}
.low_top_sec_03__block-1__element-1__down::before {
content: "";
position: absolute;
bottom: -4.8rem;
left: 0;
margin-left: calc(50% - 1.3rem);
width: 2.6rem;
height: 2.6rem;
border-radius: 50%;
background: #2D77C1;
}
.low_top_sec_03__block-1__element-2__down::before, .low_top_sec_03__block-1__element-3__down::before, .low_top_sec_03__block-1__element-4__down::before, .low_top_sec_03__block-1__element-5__down::before {
content: "";
position: absolute;
bottom: -3rem;
left: 0;
margin-left: calc(50% - 1.3rem);
width: 2.6rem;
height: 2.6rem;
border-radius: 50%;
background: #2D77C1;
}
.low_top_sec_03__block-1__element-6__down::before {
content: "";
position: absolute;
bottom: -6.6rem;
left: 0;
margin-left: calc(50% - 1.3rem);
width: 2.6rem;
height: 2.6rem;
border-radius: 50%;
background: #2D77C1;
}
.low_top_sec_03__block-1__element-1__down::after {
content: "";
position: absolute;
bottom: -3.85rem;
left: 50%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(45deg);
-webkit-transform: translateX(-50%) rotate(45deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
.low_top_sec_03__block-1__element-2__down::after, .low_top_sec_03__block-1__element-3__down::after, .low_top_sec_03__block-1__element-4__down::after, .low_top_sec_03__block-1__element-5__down::after {
content: "";
position: absolute;
bottom: -2.15rem;
left: 50%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(45deg);
-webkit-transform: translateX(-50%) rotate(45deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
.low_top_sec_03__block-1__element-6__down::after {
content: "";
position: absolute;
bottom: -5.75rem;
left: 50%;
margin-left: -0.1rem;
transform: translateX(-50%) rotate(45deg);
-webkit-transform: translateX(-50%) rotate(45deg);
vertical-align: middle;
width: 0.89rem;
height: 0.89rem;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}
@media (max-width: 767px) {
.low_top_sec_03__block-1__element-1__down::after, .low_top_sec_03__block-1__element-2__down::after, .low_top_sec_03__block-1__element-3__down::after, .low_top_sec_03__block-1__element-4__down::after, .low_top_sec_03__block-1__element-5__down::after, .low_top_sec_03__block-1__element-6__down::after {
bottom: -1.15rem;
}
.low_top_sec_03__block-1__element-1__down::before, .low_top_sec_03__block-1__element-2__down::before, .low_top_sec_03__block-1__element-3__down::before, .low_top_sec_03__block-1__element-4__down::before, .low_top_sec_03__block-1__element-5__down::before, .low_top_sec_03__block-1__element-6__down::before {
bottom: -2rem;
}
} #lp-top .low_top_sec_03__button__back {
background-color: #FFF4A0;
transform: skewY(-4deg);
-webkit-transform: skewY(-4deg);
-ms-transform: skewY(-4deg);
-moz-transform: skewY(-4deg);
-o-transform: skewY(-4deg);
padding-bottom: 150px;
margin-top: 80px;
margin-bottom: -60px;
}
#lp-top .low_top_sec_03__button-2 {
margin: 20px 0px 0px 0px;
transform: skewY(4deg);
-webkit-transform: skewY(4deg);
-ms-transform: skewY(4deg);
-moz-transform: skewY(4deg);
-o-transform: skewY(4deg);
}
#lp-top .low_top_sec_03__button {
margin-top: 40px;
}
#lp-top .low_top_sec_03__button .green {
background-color: #A6FCD4;
width: 100%;
}
@media screen and (max-width: 590px) {
#lp-top .headline_1 {
font-size: 20px;
line-height: 1em;
}
#lp-top .headline_1 br {
display: block;
}
#lp-top .low_top_sec_03__button {
margin-top: 20px;
}
#lp-top .low_top_sec_03__button__wrapper {
padding: 0 20px;
}
#lp-top .low_top_sec_03__button .button {
height: 60px;
}
#lp-top .low_top_sec_03__button__back {
padding-top: 20px;
padding-bottom: 40px;
margin-top: 20px;
margin-bottom: -10px;
}
#lp-top .low_top_sec_03__button__back .button {
height: 60px;
}
}
.inqury__fluid {
padding-top: 0 !important;
}
.inqury .headline_6.other > span {
color: #FF4C40;
-webkit-background-clip: text;
-webkit-text-fill-color: #FF4C40;
}
.inqury__intro {
margin-top: 80px;
text-align: center;
}
.inqury__intro_elem {
font-size: 20px;
font-weight: bold;
line-height: 2em;
}
.inqury__intro_elem .sp-only {
display: none;
}
@media screen and (max-width: 590px) {
.inqury__intro {
margin-top: 40px;
}
.inqury__intro_elem {
font-size: 18px;
font-weight: normal;
line-height: 2em;
}
.inqury__intro_elem .sp-only {
display: block;
width: 0;
height: 0;
}
}
.inqury__item {
display: flex;
justify-content: space-between;
margin-top: 80px;
padding: 0;
}
.inqury__item a {
position: relative;
display: block;
width: 49%;
}
@media screen and (max-width: 960px) {
.inqury__item {
flex-wrap: wrap;
margin-top: 20px;
padding: 0 20px;
}
.inqury__item a {
margin-top: 20px;
width: 100%;
}
}
.inqury__title {
font-size: 30px;
font-weight: bold;
line-height: 2em;
letter-spacing: 2px;
}
@media screen and (max-width: 590px) {
.inqury__title {
font-size: 20px;
line-height: 1.5em;
letter-spacing: 0;
}
}
.inqury__elem {
margin-top: 20px;
line-height: 2em;
color: #181E21;
font-size: 18px;
font-weight: bold;
}
@media screen and (max-width: 590px) {
.inqury__elem {
margin-top: 10px;
line-height: 1.5em;
font-size: 14px;
font-weight: normal;
}
}
.inqury__click {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
background-color: #fff;
border-radius: 100%;
}
.inqury__click:before {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
font-family: "Font Awesome 5 Free";
content: "\f054";
font-weight: 900;
font-size: 20px;
}
@media screen and (max-width: 590px) {
.inqury__click {
right: 10px;
width: 30px;
height: 30px;
}
.inqury__click:before {
right: 7px;
}
}
.inqury .member span {
color: #fe5348;
}
.inqury .guest span {
color: #005090;
}
.inqury .member_character-img {
position: absolute;
right: 25px;
bottom: 0;
height: 143px;
}
@media screen and (max-width: 960px) {
.inqury .member_character-img {
height: 100px;
}
}
@media screen and (max-width: 590px) {
.inqury .member_character-img {
position: absolute;
right: 5px;
bottom: 0;
height: 30px;
}
}
.inqury__wrapper {
padding: 50px 0;
text-align: center;
background-color: #D1FFF3;
border-radius: 5px;
}
.inqury__wrapper.member {
background: linear-gradient(120deg, rgba(255, 76, 64, 0.2), rgba(169, 111, 152, 0.2), rgba(0, 151, 251, 0.2));
}
.inqury__wrapper.guest {
background-color: #D1FFF3;
}
@media screen and (max-width: 590px) {
.inqury__wrapper {
padding: 20px 0;
}
}
.inqury__condition {
margin-top: 40px;
padding: 20px 30px;
border: solid 1px #707070;
}
.inqury__condition li {
margin-top: 10px;
line-height: 2em;
opacity: 1;
font-size: 14px;
}
@media screen and (max-width: 590px) {
.inqury__condition {
margin-right: auto;
margin-left: auto;
width: 90%;
}
}
.inqury__button {
margin-top: 60px;
}
.inqury__button .button {
margin-top: 20px;
}
@media screen and (max-width: 590px) {
.inqury__button {
margin-top: 20px;
}
.inqury__button .button:last-child {
margin-top: 20px;
}
}
.privilege__intro {
padding-top: 0 !important;
}
.privilege__intro .headline_1 {
margin-top: 80px;
}
.privilege__img {
margin-top: 40px;
}
.privilege__img img {
width: 100%;
height: auto;
}
@media screen and (max-width: 590px) {
.privilege__img {
padding: 0 20px;
}
}
.privilege__denki {
padding: 0 40px;
}
.privilege__denki__inner {
padding: 80px 0;
background-color: #fff4e3;
}
.privilege__denki__item {
margin-top: 40px;
}
.privilege__denki__item li {
height: 155px;
position: relative;
}
.privilege__denki__item li a {
position: relative;
display: block;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
align-items: center;
text-align: center;
color: #fff;
font-weight: bold;
font-size: 20px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
letter-spacing: 2px;
background-color: rgba(0, 0, 0, 0.2);
overflow: hidden;
}
.privilege__denki__item li a span {
margin-top: 4px;
line-height: 1;
z-index: 2;
}
.privilege__denki__item li a::before {
position: absolute;
top: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
content: "";
transition: all 0.3s ease-out;
z-index: 1;
overflow: hidden;
}
.privilege__denki__item li a::after {
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center center;
background-size: cover;
background-position: center center;
content: "";
transition: all 0.3s ease-out;
z-index: 0;
overflow: hidden;
}
.privilege__denki__item li a:hover::after {
transform: scale(1.05);
}
.privilege__denki__item li:nth-child(1) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_04.jpg);
}
.privilege__denki__item li:nth-child(2) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_05.jpg);
}
.privilege__denki__item li:nth-child(3) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_06.jpg);
}
.privilege__denki__item li:nth-child(4) a:after {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/img_07.jpg);
}
.privilege__denki__item li:nth-child(n+3) {
margin-top: 30px;
}
.privilege__denki__item li img {
margin-left: 40px;
width: 80px;
height: auto;
z-index: 2;
}
@media screen and (max-width: 960px) {
.privilege__denki {
padding: 0;
}
.privilege__denki__item li a {
font-size: 18px;
}
.privilege__denki__item li a img {
margin-left: 10px;
width: 40px;
}
}
@media screen and (max-width: 590px) {
.privilege__denki {
padding: 0;
}
.privilege__denki__inner {
padding: 40px 20px;
}
.privilege__denki__item {
margin-top: 0;
}
.privilege__denki__item li {
margin-top: 10px;
height: 80px;
}
.privilege__denki__item li:nth-child(n+3) {
margin-top: 10px;
}
.privilege__denki__item li a {
font-size: 18px;
}
.privilege__denki__item li a img {
margin-left: 20px;
width: 40px;
height: auto;
}
}
.privilege__button {
display: flex;
justify-content: center;
align-items: center;
padding: 60px 0 !important;
}
@media screen and (max-width: 590px) {
.privilege__button {
padding: 20px 0 !important;
}
} .lower__sec-header__nav a {
color: #000000;
text-decoration: none;
cursor: pointer;
-webkit-transition: all 0.3s;
transition: all 0.3s;
color: #484848;
}
a:hover {
text-decoration: none;
filter: alpha(opaCity=70);
-moz-opacity: 0.7;
opacity: 0.7;
} @media screen and (max-width: 590px) {
#tokusho .low_top_sec_waribiki {
background: linear-gradient(90deg, #ffe4e3, #def0f8);
padding: 20px 0;
}
}
#tokusho .headline_privilege {
font-size: 24px;
font-weight: bold;
text-align: center;
line-height: 1.5em;
letter-spacing: 2px;
}
@media screen and (max-width: 590px) {
#tokusho .headline_privilege {
font-size: 20px;
}
}
.container-fluid {
position: relative;
}
#waribiki {
padding: 0;
}
.low_top_sec_waribiki {
background-color: #fff;
}
.low_top_sec_waribiki .discount_about {
padding: 80px 0;
background: linear-gradient(90deg, #ffe4e3, #def0f8);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
.low_top_sec_waribiki .discount_about.denki {
background: linear-gradient(90deg, #fff0d8, #ffdcda);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.denki {
background: none;
margin-top: 20px;
background-size: 100%;
}
}
.low_top_sec_waribiki .discount_about.gas {
background: linear-gradient(90deg, #D4F9EF, #CBDEE9);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.gas {
margin-top: 15px;
background: none;
}
}
.low_top_sec_waribiki .discount_about.gas .discount_about_box_title {
color: #005090;
}
.low_top_sec_waribiki .discount_about.water {
background: linear-gradient(90deg, #F0FBFF, #F7F7FF);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.water {
background: none;
margin-top: 20px;
background-size: 100%;
}
}
.low_top_sec_waribiki .discount_about.water .discount_about_box_title {
color: #11A9DA;
}
.low_top_sec_waribiki .discount_about.hikari {
background: linear-gradient(90deg, #FFF8DC, #FFE9D9);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.hikari {
margin-top: 20px;
background-size: 100%;
}
}
.low_top_sec_waribiki .discount_about.hikari .discount_about_box_title {
color: #FF8B40;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.hikari {
background: #ffffff;
}
}
.low_top_sec_waribiki .discount_about.wifi {
background: linear-gradient(90deg, #F1E8EF, #D1CBDE);
margin: 50px 0 0;
background-size: 60%;
background-repeat: no-repeat;
background-position: right;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.wifi {
margin-top: 20px;
background-size: 100%;
}
}
.low_top_sec_waribiki .discount_about.wifi .discount_about_box_title {
color: #A96F98;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about.wifi {
background: #ffffff;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about {
padding: 5px;
background-size: 100%;
}
}
.low_top_sec_waribiki .discount_about_box {
background-color: white;
padding: 30px 20px;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_box {
background-color: transparent;
padding: 10px;
}
}
.low_top_sec_waribiki .discount_about_box_title {
text-align: left;
color: #FF4C40;
font-size: 34px;
font-weight: lighter;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_box_title {
font-size: 22px;
font-weight: 300;
}
}
.low_top_sec_waribiki .discount_about_box_intro {
font-size: 18px;
line-height: 24px;
font-weight: 400;
margin: 20px 0 10px;
text-align: left;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_box_intro {
font-size: 16px;
}
}
.low_top_sec_waribiki .discount_about_box_text {
font-size: 14px;
line-height: 24px;
margin-top: 15px;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_box_text {
font-size: 12px;
line-height: 20px;
}
}
.low_top_sec_waribiki .discount_about_waribiki_img {
margin-top: 60px;
width: 784px;
max-width: 120%;
}
@media screen and (max-width: 960px) {
.low_top_sec_waribiki .discount_about_waribiki_img {
max-width: 100%;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_waribiki_img {
display: none;
max-width: 100%;
margin: 0;
}
}
.low_top_sec_waribiki .discount_about_waribiki_img-sp {
display: none;
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_waribiki_img-sp {
display: block;
max-width: 100%;
}
}
.low_top_sec_waribiki .discount_about .tab-only {
display: none;
}
@media screen and (max-width: 960px) {
.low_top_sec_waribiki .discount_about .tab-only {
display: block;
}
}
@media screen and (max-width: 590px) {
.low_top_sec_waribiki .discount_about_inner {
padding: 20px 10px;
}
.low_top_sec_waribiki .discount_about_intro {
margin-top: 40px;
font-weight: normal;
font-size: 16px;
line-height: 1.5em;
}
.low_top_sec_waribiki .discount_about .tab-only {
display: none;
}
}
.marutto_discount_sec_02 {
margin-top: 50px;
}
.marutto_discount_sec_02_box {
border: 1px solid #FF4C40;
border-radius: 8px;
padding: 20px;
margin: 50px 0 -60px;
min-height: 600px;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_02_box {
min-height: unset;
margin: 20px 0;
padding: 0px;
border: none;
}
}
.marutto_discount_sec_02_box .headline_2 {
text-align: center;
font-size: 34px;
letter-spacing: 0px;
color: #FF4C40;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_02_box .headline_2 {
font-size: 22px;
font-weight: 300;
text-align: left;
}
}
.marutto_discount_sec_02_box p {
font-size: 18px;
margin: 20px 0;
}
.marutto_discount_sec_02_box .img-1 img {
margin: 20px auto;
width: 50%;
display: block;
height: auto;
}
.marutto_discount_sec_02_box .img-2 img {
margin: 20px auto;
width: 80%;
height: auto;
display: block;
padding-top: 40px;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_02_box .img-2 img {
padding-top: 0;
}
}
.marutto_discount_sec_privilege {
padding-bottom: 0 !important;
}
.marutto_discount_sec_privilege .headline_1.denki {
margin-top: 40px;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_privilege .headline_1.denki {
margin: 0;
}
}
.marutto_discount_sec_privilege .heading_2.denki {
color: #551d00;
}
.marutto_discount_sec_privilege__ttl {
margin: 40px auto;
display: flex;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_privilege__ttl {
margin: 20px auto;
flex-flow: column;
align-items: center;
}
}
.marutto_discount_sec_privilege__ttl .tokuten-img {
display: block;
width: 40px;
height: auto;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_privilege__ttl .tokuten-img {
width: 60px;
}
}
.marutto_discount_sec_privilege__ttl .tokuten-text {
color: #ff4c40;
margin: auto 15px;
font-weight: 500;
font-size: 34px;
}
@media screen and (max-width: 590px) {
.marutto_discount_sec_privilege__ttl .tokuten-text {
margin-top: 10px;
font-size: 20px;
}
}
.terms {
text-align: center;
}
.terms__text {
margin-top: 80px;
font-size: 20px;
font-weight: bold;
text-align: center;
}
.terms__menu {
padding-top: 0 !important;
}
.terms__list {
margin-top: 40px;
}
.terms__title {
position: relative;
display: flex;
align-items: center;
padding-left: 40px;
height: 50px;
line-height: 50px;
text-align: left;
background-color: #f7f7f7;
border-radius: 4px;
}
.terms__title span {
padding-top: 5px;
font-size: 20px;
font-weight: bold;
box-sizing: border-box;
}
.terms__title::before {
position: absolute;
left: 20px;
top: 50%;
transform: translateY(-50%);
display: inline-block;
width: 6px;
height: 60%;
background-color: #d1d1d1;
border-radius: 4px;
content: "";
}
.terms__item {
display: flex;
flex-wrap: wrap;
padding: 0;
}
.terms__item li {
margin-top: 20px;
margin-right: 40px;
}
.terms__item li a {
color: #2a77c1;
font-size: 18px;
}
.terms__item li a::before {
margin-right: 10px;
font-size: 20px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: "\f1c1";
}
@media screen and (max-width: 590px) {
.terms__text {
margin-top: 40px;
font-size: 16px;
font-weight: normal;
}
.terms__list {
margin-top: 40px;
}
.terms__title {
padding-left: 30px;
height: 40px;
line-height: 40px;
}
.terms__title span {
font-size: 16px;
}
.terms__title::before {
left: 10px;
}
.terms__item li {
width: 100%;
text-align: left;
}
.terms__item li a {
color: #2a77c1;
font-size: 16px;
}
.terms__item li a::before {
margin-right: 5px;
}
} .privacy {
padding-top: 0 !important;
}
.privacy__headline {
margin-bottom: 40px;
text-align: center;
font-size: 24px;
font-weight: bold;
}
.privacy__headline_2 {
margin-top: 20px;
font-weight: bold;
}
.privacy__wrapper {
margin-top: 60px;
}
.privacy__text {
margin-top: 20px;
padding: 0;
line-height: 2em;
}
.privacy__text_3 {
margin-top: 20px;
padding-left: 2em;
text-indent: -2em;
}
.privacy__text_no {
margin-top: 10px !important;
counter-reset: number;
}
.privacy__text_no > li {
margin-top: 10px;
padding-left: 2em;
text-indent: -2em;
}
.privacy__text_no > li::before {
counter-increment: number;
content: "( " counter(number) " )";
}
.privacy__text_no.circle > li {
position: relative;
padding-left: 4em;
}
.privacy__text_no.circle > li::before, .privacy__text_no.circle > li::after {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.privacy__text_no.circle > li::before {
left: 2.5em;
counter-increment: number;
content: counter(number);
}
.privacy__text_no.circle > li::after {
margin-top: -2px;
margin-left: 1px;
left: 0;
width: 20px;
height: 20px;
border-radius: 100%;
display: block;
border: 1px solid #aaa;
content: "";
}
.privacy__item {
display: flex;
flex-wrap: wrap;
}
.privacy__item dt {
width: 10%;
font-weight: normal;
}
.privacy__item dd {
width: 90%;
}
.privacy__item_2 dt {
margin-top: 20px;
}
.privacy__item_2 dd, .privacy__item_2 li {
line-height: 2em;
}
.privacy__item_2 dd::before, .privacy__item_2 li::before {
content: "・";
}
.privacy__item_3 {
margin-left: 2.2em;
}
.privacy__table {
margin-top: 40px;
margin-left: auto;
margin-right: auto;
width: 80%;
}
.privacy__table th, .privacy__table td {
padding: 20px;
}
.privacy__table th {
padding: 20px;
color: #fff;
text-align: center;
font-weight: normal;
background: #908F8F;
font-size: 18px;
border: 1px solid #707070;
}
.privacy__table td {
border: 1px #707070 solid;
}
.privacy__table td:nth-child(1) {
background: #F4F4F4;
width: 50%;
}
.privacy .kome {
margin-left: -1.5em;
padding-left: 0;
}
.privacy a {
text-decoration: underline;
}
@media screen and (max-width: 960px) {
.privacy__text_3 {
padding-left: 0;
text-indent: 0;
}
.privacy__text_no > li {
padding-left: 1.6em;
text-indent: -1.6em;
}
.privacy__text_no.circle > li::before {
left: 2.1em;
}
.privacy__item dt {
width: 30%;
}
.privacy__item dd {
width: 70%;
}
.privacy__item_3 {
margin-left: 0;
}
.privacy__item_3 > li {
padding-left: 0;
text-indent: 0;
}
.privacy__table {
width: 100%;
}
.privacy__table th, .privacy__table td {
padding: 20px 10px;
}
.privacy .kome {
margin-left: 0;
}
}
@media screen and (max-width: 590px) {
.privacy .headline_6 {
font-size: 24px;
}
.privacy .headline_7 {
font-size: 18px;
}
.privacy__headline {
font-size: 20px;
}
.privacy__headline_2 {
margin-top: 20px;
}
.privacy__wrapper {
margin-top: 40px;
}
.privacy__text_3 {
padding-left: 0;
text-indent: 0;
}
.privacy__text_no > li {
padding-left: 1.5em;
text-indent: -1.5em;
}
.privacy__text_no.circle > li {
padding-left: 2em;
text-indent: 0;
}
.privacy__text_no.circle > li::before, .privacy__text_no.circle > li::after {
top: 5px;
transform: translateY(0);
}
.privacy__text_no.circle > li::before {
margin-top: -6px;
left: 0.5em;
}
.privacy__item {
margin-top: 10px;
}
.privacy__item dt {
margin-top: 10px;
width: 100%;
}
.privacy__item dd {
width: 100%;
}
.privacy__item_2 dt {
margin-top: 20px;
}
.privacy__item_2 dd, .privacy__item_2 li {
padding-left: 1em;
text-indent: -1em;
}
.privacy__item_3 {
margin-left: 0;
padding-left: 0;
text-indent: 0;
}
.privacy__table {
width: 100%;
}
.privacy__table th, .privacy__table td {
padding: 10px;
}
.privacy__table th {
font-size: 16px;
}
.privacy__table td:nth-child(1) {
background: #F4F4F4;
}
.privacy .kome {
margin-left: 0;
}
}
.mypage {               }
@media screen and (max-width: 590px) {
.mypage .lower__exp {
padding: 30px 10px;
}
}
.mypage .lower__exp__kome {
padding: 0;
}
.mypage .headline_6 br {
display: none;
}
.mypage .headline_6 span {
display: inline-block;
}
.mypage__wrapper {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.mypage__text {
margin-top: 80px;
font-size: 20px;
font-weight: bold;
text-align: center;
}
.mypage__button {
display: flex;
justify-content: space-between;
}
.mypage__button li {
width: 48%;
}
@media screen and (max-width: 590px) {
.mypage__text {
margin-top: 40px;
}
.mypage__text br {
display: none;
}
.mypage__button {
flex-wrap: wrap;
}
.mypage__button li {
width: 100%;
}
.mypage__button li:last-child {
margin-top: 20px;
}
.mypage .headline_6 {
font-size: 24px;
}
.mypage .headline_6 br {
display: block;
}
}
.mypage .block {
display: flex;
justify-content: space-between;
column-gap: 20px;
margin-bottom: 20px;
margin-top: 50px;
}
@media screen and (max-width: 590px) {
.mypage .block .svg-inline--fa {
vertical-align: -6px;
}
}
.mypage .block > a {
display: block;
flex: 1;
max-width: 35%;
}
@media screen and (max-width: 960px) {
.mypage .block > a {
flex-basis: calc(50% - 10px);
max-width: 230px;
}
}
@media screen and (max-width: 590px) {
.mypage .block > a {
flex: auto;
max-width: 100%;
}
}
.mypage .block > a .block_border {
border: solid 1px #333;
border-radius: 5px;
text-align: center;
}
@media screen and (max-width: 590px) {
.mypage .block > a .block_border .hide_sp {
display: none;
}
}
.mypage .block_series_down {
position: relative;
}
@media screen and (max-width: 590px) {
.mypage .block_series_down {
display: none;
}
}
.mypage .block_portal_down {
position: relative;
}
@media screen and (max-width: 590px) {
.mypage .block_portal_down {
display: none;
}
}
.mypage .block_click {
position: absolute;
right: 20px;
top: 50%;
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
transform: translateY(-50%);
background-color: #fff;
border-radius: 100%;
}
.mypage .block_caution {
font-size: 14px;
margin-top: 0.5rem;
}
.mypage .block_series .block_click {
color: #ff4c40;
}
.mypage .block_portal .block_click {
color: #099bdd;
}
.mypage .block_best .block_click {
color: #ffc531;
}
.mypage .block_water .block_click {
color: #0196f9;
}
.mypage .block_line .block_click {
color: #00b900;
}
.mypage .block_water .block__mypage {
color: #ff4c40;
}
@media screen and (max-width: 960px) {
.mypage .block {
padding: 0 10px;
flex-wrap: wrap;
margin-bottom: 30px;
margin-top: 20px;
}
.mypage .block > a {
margin: 10px 0px;
width: 100%;
}
.mypage .block.group1 {
margin-top: 20px;
margin-bottom: 0;
}
.mypage .block.group2 {
margin-top: 0;
margin-bottom: 30px;
}
}
.mypage .block_series_up {
position: relative;
padding: 20px 10px 0 10px;
}
@media screen and (max-width: 590px) {
.mypage .block_series_up {
padding-top: 10px;
padding-bottom: 10px;
position: relative;
background: linear-gradient(120deg, rgba(255, 76, 64, 0.2), rgba(169, 111, 152, 0.2), rgba(0, 151, 251, 0.2));
}
}
.mypage .block_series_up .show_sp {
display: none;
}
@media screen and (max-width: 590px) {
.mypage .block_series_up .show_sp {
display: block;
}
}
.mypage .block_series_up-icon {
display: block;
width: 90%;
height: auto;
}
@media screen and (max-width: 590px) {
.mypage .block_series_up-icon {
position: absolute;
text-align: left;
left: -115px;
height: 80px;
bottom: 0;
}
}
.mypage .block_series_up-character {
height: 100px;
position: absolute;
bottom: 0;
right: 15px;
}
@media screen and (max-width: 590px) {
.mypage .block_series_up-character {
height: 70px;
bottom: 0;
left: 35px;
}
}
.mypage .block_series_down {
background: linear-gradient(120deg, rgba(255, 76, 64, 0.2), rgba(169, 111, 152, 0.2), rgba(0, 151, 251, 0.2));
}
.mypage .block_series_down_title {
padding-top: 16px;
padding-bottom: 16px;
color: #ff4c40;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_series_down {
position: relative;
}
.mypage .block_series_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #ff4c40;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_series_click:hover .block_series_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
.mypage .block_portal_up {
position: relative;
padding: 20px 10px 0 10px;
}
@media screen and (max-width: 590px) {
.mypage .block_portal_up {
padding-top: 10px;
padding-bottom: 10px;
position: relative;
background: linear-gradient(135.49deg, rgba(200, 111, 152, 0.3), rgb(181, 225, 245));
}
}
.mypage .block_portal_up .show_sp {
display: none;
}
@media screen and (max-width: 590px) {
.mypage .block_portal_up .show_sp {
display: block;
}
}
.mypage .block_portal_up-icon {
display: block;
width: 90%;
}
@media screen and (max-width: 590px) {
.mypage .block_portal_up-icon {
position: absolute;
text-align: left;
left: -115px;
height: 80px;
bottom: 0;
}
}
.mypage .block_portal_up-character {
height: 100px;
position: absolute;
bottom: 0;
right: 15px;
}
@media screen and (max-width: 590px) {
.mypage .block_portal_up-character {
height: 70px;
bottom: 0;
left: 35px;
}
}
.mypage .block_portal_down {
background: linear-gradient(135.49deg, rgba(200, 111, 152, 0.3), rgb(181, 225, 245));
}
.mypage .block_portal_down_title {
padding-top: 16px;
padding-bottom: 16px;
color: #099bdd;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_portal_down {
position: relative;
}
.mypage .block_portal_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #099bdd;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_portal_click:hover .block_portal_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
@media screen and (max-width: 960px) {
.mypage .option .row .option_number {
text-align: center;
margin: auto;
}
.mypage .option .row .option_dial {
text-align: center;
margin: auto;
}
}
@media screen and (max-width: 590px) {
.mypage .headline_6 {
font-size: 24px;
}
.mypage .headline_6 br {
display: block;
}
}
.mypage .block_best_up {
position: relative;
padding: 10px;
}
.mypage .block_best_up .show_sp {
display: none;
}
@media screen and (max-width: 590px) {
.mypage .block_best_up .show_sp {
display: block;
}
}
@media screen and (max-width: 590px) {
.mypage .block_best_up {
background: linear-gradient(120deg, rgba(255, 217, 44, 0.2), rgba(255, 139, 64, 0.2));
padding-top: 10px;
padding-bottom: 10px;
position: relative;
}
}
.mypage .block_best_up-icon {
text-align: center;
display: block;
margin: auto;
width: 90%;
}
@media screen and (max-width: 590px) {
.mypage .block_best_up-icon {
position: absolute;
text-align: left;
top: 0;
left: -110px;
height: 80px;
bottom: 0;
}
}
.mypage .block_best_down {
background: linear-gradient(120deg, rgba(255, 217, 44, 0.2), rgba(255, 139, 64, 0.2));
}
@media screen and (max-width: 590px) {
.mypage .block_best_down {
display: none;
}
}
.mypage .block_best_down_title {
padding-top: 16px;
padding-bottom: 16px;
color: #655300;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_best_down {
position: relative;
}
.mypage .block_best_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #ff8b40;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_best_click:hover .block_water_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
.mypage .block_water_up {
position: relative;
padding: 10px;
}
@media screen and (max-width: 590px) {
.mypage .block_water_up {
background: linear-gradient(120deg, rgba(17, 169, 218, 0.2), rgba(42, 55, 255, 0.2));
padding-top: 10px;
padding-bottom: 10px;
position: relative;
}
}
.mypage .block_water_up .show_sp {
display: none;
}
@media screen and (max-width: 590px) {
.mypage .block_water_up .show_sp {
display: block;
}
}
.mypage .block_water_up-icon {
text-align: center;
display: block;
margin: auto;
width: 90%;
height: auto;
}
@media screen and (max-width: 590px) {
.mypage .block_water_up-icon {
position: absolute;
text-align: left;
top: 0;
left: -110px;
height: 80px;
bottom: 0;
}
}
.mypage .block_water_down {
background: linear-gradient(120deg, rgba(17, 169, 218, 0.2), rgba(42, 55, 255, 0.2));
}
@media screen and (max-width: 590px) {
.mypage .block_water_down {
display: none;
}
}
.mypage .block_water_down_title {
padding-top: 16px;
padding-bottom: 16px;
color: #005090;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_water_down {
position: relative;
}
.mypage .block_water_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #005090;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_water_click:hover .block_water_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
.mypage .block_line_up {
position: relative;
padding: 10px;
}
@media screen and (max-width: 590px) {
.mypage .block_line_up {
background: linear-gradient(135.48deg, rgb(255, 222, 162), rgb(170, 240, 217));
padding-top: 10px;
padding-bottom: 10px;
position: relative;
}
}
.mypage .block_line_up .show_sp {
display: none;
}
@media screen and (max-width: 590px) {
.mypage .block_line_up .show_sp {
display: block;
}
}
.mypage .block_line_up-icon {
text-align: center;
display: block;
margin: auto;
width: 90%;
height: auto;
}
@media screen and (max-width: 590px) {
.mypage .block_line_up-icon {
position: absolute;
text-align: left;
top: 0;
left: -110px;
height: 80px;
bottom: 0;
}
}
.mypage .block_line_down {
background: linear-gradient(135.48deg, rgb(255, 222, 162), rgb(170, 240, 217));
}
@media screen and (max-width: 590px) {
.mypage .block_line_down {
display: none;
}
}
.mypage .block_line_down_title {
padding-top: 16px;
padding-bottom: 16px;
color: #00b900;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_line_down {
position: relative;
}
.mypage .block_line_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #00b900;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_line_click:hover .block_water_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
.mypage .block_series:hover,
.mypage .block_portal:hover,
.mypage .block_best:hover,
.mypage .block_line:hover,
.mypage .block_water:hover,
.mypage .block_mypage:hover {
text-decoration: none;
}
.mypage .block_mypage_up {
position: relative;
padding-top: 30px;
padding-bottom: 30px;
}
.mypage .block_mypage_up-icon {
height: 97px;
text-align: center;
display: block;
margin: auto;
}
.mypage .block_mypage_down {
background: linear-gradient(120deg, rgba(0, 220, 163, 0.2), rgba(255, 217, 44, 0.2));
}
.mypage .block_mypage_down_title {
padding-top: 28px;
padding-bottom: 28px;
color: #004046;
font-size: 16px;
font-weight: bold;
margin-bottom: 0px;
text-align: center;
}
.mypage .block_mypage_down {
position: relative;
}
.mypage .block_mypage_click_svg {
height: 40px;
width: 40px;
position: absolute;
right: 10px;
bottom: 20px;
background-color: white;
border-radius: 50%;
stroke: #ff8b40;
stroke-width: 2;
stroke-linecap: round;
fill: none;
}
.mypage .block_mypage_click:hover .block_mypage_click_svg {
background-color: rgba(255, 255, 255, 0.5);
transition: 0.3s;
}
.mypage .container_button {
margin-top: 20px;
margin-bottom: 20px;
}
.mypage .option {
background: #fffbe6 0% 0%;
}
.mypage .option_intro {
text-align: center;
font-size: 20px;
font-weight: bold;
line-height: 2em;
}
.mypage .option_white {
padding: 20px 0;
width: 80%;
}
.mypage .option__tel {
display: flex;
justify-content: space-between;
width: 100%;
}
.mypage .option__tel li {
display: flex;
align-items: center;
padding: 0;
margin: auto;
}
.mypage .option__tel li span {
display: block;
margin-right: 20px;
}
.mypage .option__tel li span.fd {
width: 60px;
}
.mypage .option__tel li span.fd img {
width: 100%;
height: auto;
}
.mypage .option__tel li span.option_number_title {
background-color: #f09138;
padding: 10px;
color: #fff;
}
.mypage .option__tel li a {
padding-top: 5px;
font-size: 40px;
font-weight: bold;
letter-spacing: 3px;
}
.mypage .option p {
margin-top: 20px;
text-align: center;
}
.mypage .option__time {
display: flex;
justify-content: center;
align-items: center;
margin-top: 20px;
}
.mypage .option__time_title {
padding: 5px 10px;
letter-spacing: 1px;
background-color: #333;
color: #fff;
}
.mypage .option__time_time {
padding-left: 15px;
padding-right: 15px;
font-size: 24px;
font-weight: 600;
}
.mypage .option__time_exception {
font-size: 16px;
font-weight: 600;
}
@media screen and (max-width: 590px) {
.mypage .option {
padding: 30px 10px;
}
.mypage .option_intro {
margin-top: 10px;
padding: 0;
font-size: 16px;
}
.mypage .option_intro br {
display: none;
}
.mypage .option_white {
padding: 20px 10px;
margin-top: 20px;
width: 100%;
}
.mypage .option__tel {
flex-wrap: wrap;
justify-content: flex-start;
}
.mypage .option__tel li {
flex-wrap: wrap;
width: 100%;
}
.mypage .option__tel li:last-child {
margin-top: 20px;
align-items: center;
}
.mypage .option__tel li span {
margin-right: 0;
}
.mypage .option__tel li span.fd {
width: 40px;
}
.mypage .option__tel li span.fd img {
width: 100%;
height: auto;
margin-left: 30px;
}
.mypage .option__tel li a {
width: auto;
font-size: 24px;
text-align: center;
margin-left: 48px;
}
.mypage .option__time {
flex-wrap: wrap;
justify-content: space-around;
}
.mypage .option__time span {
text-align: center;
}
.mypage .option__time_time {
width: auto;
margin-top: 10px;
padding-left: 0;
padding-right: 0;
font-size: 24px;
}
.mypage .option__time_exception {
margin-top: 10px;
width: 100%;
font-size: 14px;
font-weight: normal;
}
}
@media screen and (max-width: 590px) {
.mypage .option .no-padding {
padding: 0px;
}
}
.mypage .option_button {
padding-top: 40px;
}
@media screen and (max-width: 590px) {
.mypage .button {
font-size: 14px;
}
.mypage .button::before, .mypage .button::after {
right: 10px;
}
} .lower__kv.is_repair_support {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/repair/kv.jpg);
}
.lower__kv.is_repair_support .sp-show {
display: none;
}
@media screen and (max-width: 590px) {
.lower__kv.is_repair_support {
padding: 0px;
background-image: none;
}
.lower__kv.is_repair_support .sp-show {
display: block;
}
.lower__kv.is_repair_support .sp-show IMG {
max-width: 100%;
}
}
.lower__kv.is_repair_support p {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.lower__kv.is_repair_support p {
font-size: 16px;
line-height: 28px;
}
}
.lower__kv.is_repair_support .headline_2 {
color: #551d00;
}
.lower__kv.is_home_moving {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/moving_discount/kv.jpg);
}
.lower__kv.is_home_moving .sp-show {
display: none;
}
@media screen and (max-width: 590px) {
.lower__kv.is_home_moving {
padding: 0px;
background-image: none;
}
.lower__kv.is_home_moving .sp-show {
display: block;
}
.lower__kv.is_home_moving .sp-show IMG {
max-width: 100%;
}
}
.lower__kv.is_home_moving p {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.lower__kv.is_home_moving p {
font-size: 16px;
line-height: 28px;
}
}
.lower__kv.is_home_moving .headline_2 {
color: #551d00;
}
.lower__kv.is_kaketuke {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/kaketuke/kv.jpg);
}
.lower__kv.is_kaketuke .sp-show {
display: none;
}
@media screen and (max-width: 590px) {
.lower__kv.is_kaketuke {
padding: 0px;
background-image: none;
}
.lower__kv.is_kaketuke .sp-show {
display: block;
}
.lower__kv.is_kaketuke .sp-show IMG {
max-width: 100%;
}
}
.lower__kv.is_kaketuke p {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.lower__kv.is_kaketuke p {
font-size: 16px;
line-height: 28px;
}
}
.lower__kv.is_kaketuke .headline_2 {
color: #551d00;
}
.lower__kv.is_purchase {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/purchase/kv.jpg);
}
.lower__kv.is_purchase .sp-show {
display: none;
}
@media screen and (max-width: 590px) {
.lower__kv.is_purchase {
padding: 0px;
background-image: none;
}
.lower__kv.is_purchase .sp-show {
display: block;
}
.lower__kv.is_purchase .sp-show IMG {
max-width: 100%;
}
}
.lower__kv.is_purchase p {
font-size: 18px;
line-height: 32px;
}
@media screen and (max-width: 590px) {
.lower__kv.is_purchase p {
font-size: 16px;
line-height: 28px;
}
}
.lower__kv.is_purchase .headline_2 {
color: #551d00;
}
.lower__kv.is_purchase .lower__kv__logo {
width: 320px;
height: auto;
}
.lower__kv.is_purchase .lower__kv__logo img {
width: 70%;
height: auto;
}
@media screen and (max-width: 590px) {
.lower__kv.is_purchase .lower__kv__logo {
width: 100%;
text-align: center;
}
.lower__kv.is_purchase .lower__kv__logo img {
width: 50%;
margin: 10px 0;
}
}
@media screen and (max-width: 590px) {
.lower__kv__lead {
padding: 20px;
}
} .mypage_tokuten2 {
padding: 0 0 40px !important;
}
@media screen and (max-width: 590px) {
.mypage_tokuten2 {
padding: 0 !important;
}
} @media screen and (max-width: 590px) {
.mypage_tokuten3 {
padding: 0 !important;
}
} .mypage_tokuten4 {
padding-bottom: 0 !important;
}
.sitemap__wrapper {
margin: -60px;
padding-top: 0 !important;
}
@media screen and (max-width: 960px) {
.sitemap__wrapper {
margin: 0;
}
}
.sitemap__item {
margin-top: 80px;
}
@media screen and (max-width: 960px) {
.sitemap__item {
margin-top: 40px;
}
}
.sitemap h2 {
padding-bottom: 10px;
font-size: 20px;
font-weight: bold;
border-bottom: 3px #ddd solid;
}
@media screen and (max-width: 960px) {
.sitemap h2 {
margin-bottom: 0.5em;
}
}
.sitemap__cate_01 {
margin-top: 30px;
}
.sitemap__cate_01 > li {
margin-top: 10px;
padding-right: 20px;
}
.sitemap__cate_02 {
margin-top: 20px;
margin-left: 2em;
}
.sitemap__cate_02 > li {
margin-top: 10px;
}
@media screen and (max-width: 960px) {
.sitemap__cate_01 {
margin-top: 0;
}
.sitemap__cate_01 > li {
padding-right: 0;
}
.sitemap__cate_02 {
margin-top: 10px;
margin-left: 1em;
}
.sitemap__cate_02 > li {
margin-top: 10px;
}
}
.sitemap__title {
position: relative;
padding-left: 1em;
color: #2a77c1;
font-size: 18px;
cursor: pointer;
}
.sitemap__title::before {
position: absolute;
top: -5px;
left: 0;
font-family: "Font Awesome 5 Free";
content: "\f0da";
font-weight: 900;
font-size: 22px;
}
@media screen and (max-width: 590px) {
.sitemap__title {
font-size: 16px;
}
}
.sitemap__title a {
color: #2a77c1;
}
.sitemap__text {
margin-top: 10px;
margin-bottom: 20px;
padding: 1em;
line-height: 2em;
background-color: rgba(133, 197, 230, 0.1);
}
@media screen and (max-width: 960px) {
.low_top_sec_06__tag__wrapper {
margin-top: 20px !important;
padding-right: 0;
padding-left: 0;
}
}
@media screen and (max-width: 960px) {
.low_top_sec_06__inner__lead.is-text-justify {
margin-top: 10px !important;
}
}
@media screen and (max-width: 960px) {
.tab-wrap.pc-only {
display: none !important;
}
}
.flow-wrap_tab-only {
display: none;
}
@media screen and (max-width: 960px) {
.flow-wrap_tab-only {
display: block;
padding-bottom: 20px;
}
}
.flow-wrap_tab-only input[name=tab_item] {
display: none;
}
.flow-wrap_tab-only .slide,
.flow-wrap_tab-only .flow-wrap__inner {
padding: 10px 0 0 0;
width: 100%;
}
.flow-wrap_tab-only .slide > div,
.flow-wrap_tab-only .slide .flow-wrap__item,
.flow-wrap_tab-only .flow-wrap__inner > div,
.flow-wrap_tab-only .flow-wrap__inner .flow-wrap__item {
margin-bottom: 10px;
}
.flow-wrap_tab-only .slide__wrapper,
.flow-wrap_tab-only .flow-wrap__inner__wrapper {
margin: 0 2%;
padding: 10px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.1);
}
.flow-wrap_tab-only .slide__wrapper > img,
.flow-wrap_tab-only .flow-wrap__inner__wrapper > img {
width: 100%;
height: auto;
}
.flow-wrap_tab-only .slide__icon, .flow-wrap_tab-only .slide__content,
.flow-wrap_tab-only .flow-wrap__inner__icon,
.flow-wrap_tab-only .flow-wrap__inner__content {
width: 100%;
}
.flow-wrap_tab-only .slide__icon,
.flow-wrap_tab-only .flow-wrap__inner__icon {
height: 60px;
}
.flow-wrap_tab-only .slide__icon img,
.flow-wrap_tab-only .flow-wrap__inner__icon img {
margin: 0 auto;
width: 60px;
height: auto;
}
.flow-wrap_tab-only .slide__content,
.flow-wrap_tab-only .flow-wrap__inner__content {
display: flex;
justify-content: center;
margin-top: 10px;
}
.flow-wrap_tab-only .slide__no,
.flow-wrap_tab-only .flow-wrap__inner__no {
margin-right: 10px;
color: #ff4c40;
font-size: 40px;
font-weight: bold;
line-height: 1;
}
.flow-wrap_tab-only .slide__text,
.flow-wrap_tab-only .flow-wrap__inner__text {
font-size: 14px;
}
.flow-wrap_tab-only .tabs {
width: 100%;
}
.flow-wrap_tab-only .tab_item {
float: left;
display: flex;
padding: 45px 10px 10px 10px;
width: 50%;
min-height: 120px;
background-color: #fff;
transition: all 0.2s ease;
cursor: pointer;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;
background-position: center 10px;
background-size: 30px auto;
text-align: left;
font-size: 14px;
}
.flow-wrap_tab-only .tab_item.denki-top1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_2.svg);
}
.flow-wrap_tab-only .tab_item.denki-top2 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_2.svg);
}
.flow-wrap_tab-only .tab_item.hikari-top1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_02.svg);
}
.flow-wrap_tab-only .tab_item.hikari-top2 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-2.svg);
}
.flow-wrap_tab-only .tab_content {
display: none;
clear: both;
overflow: hidden;
}
.flow-wrap_tab-only #tab01:checked ~ #tab01_content, .flow-wrap_tab-only #tab02:checked ~ #tab02_content {
display: block;
}
.flow-wrap_tab-only .tabs input:checked + .tab_item {
position: relative;
background-color: #333;
color: #fff;
}
.flow-wrap_tab-only .tabs input:checked + .tab_item::after {
position: absolute;
left: 50%;
bottom: -10px;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #333;
content: "";
}
.flow-wrap_tab-only .tabs input:checked + .tab_item.denki-top1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_12_1.svg);
}
.flow-wrap_tab-only .tabs input:checked + .tab_item.denki-top2 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/denki/icon_13_1.svg);
}
.flow-wrap_tab-only .tabs input:checked + .tab_item.hikari-top1 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_arrow_3_01.svg);
}
.flow-wrap_tab-only .tabs input:checked + .tab_item.hikari-top2 {
background-image: url(//marutto.co.jp/wp-content/themes/marutto/app/img/hikari/hikari-flow_icon_2-1.svg);
}
.flow-wrap_tab-only.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin-left: 10px;
margin-right: 10px;
}
.flow-wrap_tab-only .swiper-pagination-bullet-active {
background: #000 !important;
}
.slick-prev, .slick-next {
display: none;
}
.slick-arrow {
display: none;
}
@media screen and (max-width: 960px) {
#gas-top_06 .low_top_sec_06__content {
display: none;
}
}
#gas-top_06 .slide__no {
color: #00b089;
}
#denki-top_06 .slide__no {
color: #ffc531;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont {
background-color: transparent;
}
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont__list {
display: none;
}
}
#water-top .slide__no {
color: #0196f9;
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont {
background-color: transparent;
}
}
@media screen and (max-width: 960px) {
#wifi-top .low_top_sec_06__cont__list {
display: none;
}
}
#wifi-top .slide__no {
color: #c86f98;
}
@media screen and (max-width: 960px) {
#water-top .low_top_sec_06__cont {
margin: 0 auto !important;
padding: 20px 0 0 0;
}
}
@media screen and (max-width: 960px) {
#water-top_02 .low_water_sec_02__item {
display: none;
}
}
#water-top_02 .slide-water__img {
width: 100%;
}
#water-top_02 .slide-water__img img {
margin: 0 auto;
width: auto;
height: 200px;
}
#water-top_02 .slide-water__text {
font-size: 18px;
color: #838383;
text-align: center;
}
@media screen and (max-width: 590px) {
#water-top_02 .slide-water__text {
font-size: 14px;
}
}
#water-top_02 .slide-water .slick-arrow {
top: 30%;
}
@media screen and (max-width: 960px) {
.water-product__design__item {
display: none;
}
}
@media screen and (max-width: 960px) {
.water-product__design .swiper-container-for-water-lineup {
max-width: 100%;
overflow: hidden;
padding-bottom: 25px;
}
}
.water-product__design .swiper-container-for-water-lineup .swiper-pagination-bullets, .water-product__design .swiper-container-for-water-lineup .swiper-pagination-custom, .water-product__design .swiper-container-for-water-lineup .swiper-pagination-fraction {
bottom: 0;
}
.water-product__design .swiper-container-for-water-lineup .swiper-pagination-bullet {
margin-left: 10px;
margin-right: 10px;
}
.water-product__design .swiper-container-for-water-lineup .swiper-pagination-bullet-active {
background: #000 !important;
}
.water-product__design .slide-water__img {
width: 100%;
text-align: center;
}
.water-product__design .slide-water__img img {
margin: 0 auto;
width: auto;
height: 200px;
}
.water-product__design .slide-water__text {
font-size: 18px;
color: #838383;
text-align: center;
}
@media screen and (max-width: 590px) {
.water-product__design .slide-water__text {
font-size: 14px;
min-height: 42px;
display: flex;
justify-content: center;
align-items: center;
}
}
.water-product__design .slide-water .slick-arrow {
top: 30%;
}
#sms {
display: block;
font-size: 14px;
padding-bottom: 20px;
width: calc(100% - 40px);
max-width: 1000px;
line-height: 1.5;
}
#sms h2 {
margin-top: 20px;
margin-bottom: 10px;
text-indent: -0.5em;
font-size: 16px;
}
#sms h3 {
margin-top: 20px;
margin-bottom: 10px;
font-size: 14px;
}
#sms .sms-lead {
margin: 20px 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
padding: 10px 0;
}
#sms .sms-info {
margin: 20px 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
padding: 10px 0;
}
#sms span.kome {
padding-left: 0;
line-height: 2.5;
}
#sms img {
margin: 20px 0;
width: 100%;
}
#sms .red-text {
color: red;
}
#sms .ul_disc {
list-style-type: disc;
padding-left: 2rem;
}
#sms .ul_square {
list-style-type: square;
padding-left: 2rem;
}
#sms a {
color: #007bff;
text-decoration: underline;
}
#sms a.button {
background-color: #fff;
border: 1px solid #000;
color: #333333;
text-decoration: none;
}
#sms a.button:hover {
color: #fff;
background-color: rgba(0, 0, 0, 0.5);
}
#sms .m-line_btn {
display: flex;
width: 120px;
padding: 6px 10px;
font-weight: 400;
color: #ffffff;
text-decoration: none;
border-radius: 5px;
font-size: 14px;
background-color: #00af26;
text-decoration: none;
}
#sms .m-line_btn:before {
content: "";
display: inline-block;
width: 20px;
margin-right: 5px;
background-size: contain;
background-repeat: no-repeat;
height: 20px;
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2287.382%22%20height%3D%2283.259%22%20viewBox%3D%220%200%2087.382%2083.259%22%3E%20%3Cg%20id%3D%22TYPE_A%22%20data-name%3D%22TYPE%20A%22%20transform%3D%22translate(-377.059%20-257.805)%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_2%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%202%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_1%22%20data-name%3D%22%E3%83%91%E3%82%B9%201%22%20d%3D%22M464.441%2C293.261c0-19.551-19.6-35.456-43.691-35.456s-43.691%2C15.9-43.691%2C35.456c0%2C17.526%2C15.544%2C32.205%2C36.54%2C34.98%2C1.422.307%2C3.359.938%2C3.849%2C2.155a8.981%2C8.981%2C0%2C0%2C1%2C.141%2C3.95s-.512%2C3.083-.623%2C3.74c-.191%2C1.1-.878%2C4.32%2C3.784%2C2.355s25.161-14.815%2C34.328-25.366h0c6.332-6.944%2C9.365-13.99%2C9.365-21.814%22%20fill%3D%22%23fff%22%2F%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_1%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%201%22%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_2%22%20data-name%3D%22%E3%83%91%E3%82%B9%202%22%20d%3D%22M411.873%2C283.813h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.065a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_3%22%20data-name%3D%22%E3%83%91%E3%82%B9%203%22%20d%3D%22M432.967%2C283.813H429.9a.85.85%2C0%2C0%2C0-.851.85v11.31l-8.725-11.782a1.082%2C1.082%2C0%2C0%2C0-.066-.086l-.006-.006c-.016-.018-.033-.035-.051-.052l-.016-.014a.325.325%2C0%2C0%2C0-.045-.038l-.022-.018-.044-.03-.026-.015-.045-.026-.027-.013-.049-.02-.028-.01-.05-.017-.03-.007-.049-.011-.036-.005c-.014%2C0-.029%2C0-.044-.006l-.045%2C0-.029%2C0h-3.064a.851.851%2C0%2C0%2C0-.851.85V303.7a.85.85%2C0%2C0%2C0%2C.851.849h3.064a.851.851%2C0%2C0%2C0%2C.852-.849V292.393l8.734%2C11.8a.844.844%2C0%2C0%2C0%2C.216.21l.009.007.053.032.024.013.04.02c.014.005.027.012.042.017l.025.01.058.018.013%2C0a.819.819%2C0%2C0%2C0%2C.218.029h3.064a.85.85%2C0%2C0%2C0%2C.851-.849V284.663a.851.851%2C0%2C0%2C0-.851-.85%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_4%22%20data-name%3D%22%E3%83%91%E3%82%B9%204%22%20d%3D%22M404.486%2C299.782h-8.328V284.663a.85.85%2C0%2C0%2C0-.85-.85h-3.065a.851.851%2C0%2C0%2C0-.851.85V303.7a.842.842%2C0%2C0%2C0%2C.238.587l.012.014.012.011a.844.844%2C0%2C0%2C0%2C.588.237h12.244a.85.85%2C0%2C0%2C0%2C.849-.851v-3.065a.851.851%2C0%2C0%2C0-.849-.851%22%20fill%3D%22%2300b900%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_5%22%20data-name%3D%22%E3%83%91%E3%82%B9%205%22%20d%3D%22M449.891%2C288.58a.851.851%2C0%2C0%2C0%2C.85-.851v-3.064a.851.851%2C0%2C0%2C0-.85-.852H437.647a.845.845%2C0%2C0%2C0-.59.24l-.01.009-.014.015a.851.851%2C0%2C0%2C0-.236.586V303.7h0a.846.846%2C0%2C0%2C0%2C.238.588l.012.013.012.011a.847.847%2C0%2C0%2C0%2C.588.238h12.244a.851.851%2C0%2C0%2C0%2C.85-.851v-3.065a.851.851%2C0%2C0%2C0-.85-.851h-8.327v-3.218h8.327a.851.851%2C0%2C0%2C0%2C.85-.852v-3.064a.852.852%2C0%2C0%2C0-.85-.852h-8.327V288.58Z%22%20fill%3D%22%2300b900%22%2F%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
}
#sms table.flow {
max-width: 680px;
margin-top: 20px;
margin-bottom: 10px;
border-collapse: collapse;
border: 1px #000 solid;
}
#sms table.flow th {
padding: 15px 10px;
border-collapse: collapse;
border: 1px #000 solid;
text-align: center;
background-color: #dfdfdf;
}
#sms table.flow td {
padding: 15px 10px;
border-collapse: collapse;
border: 1px #000 solid;
}
#sms table.flow td.days {
text-align: center;
}
#sms table.flow td.nagare {
width: 40%;
}
.pw-sms {
color: #333333;
font-family: "Hiragino Kaku Gothic ProN", メイリオ, sans-serif !important;
}
.pw-sms a {
color: inherit;
}
.pw-sms .sp-only {
display: none;
}
@media screen and (max-width: 590px) {
.pw-sms .sp-only {
display: block;
}
}
.pw-sms .pc-only {
display: block;
}
@media screen and (max-width: 590px) {
.pw-sms .pc-only {
display: none;
}
}
.pw-sms img {
max-width: 100%;
height: auto;
}
.pw-sms__sec-01 {
padding: 30px 30px 24px 30px;
background: linear-gradient(90deg, #FFFFFF, #F5F2DA);
}
.pw-sms__sec-01.l-slim-sms {
background: linear-gradient(90deg, #D2D9E0, #FFFFFF, #D2D9E0);
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01 {
padding-top: 60px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__wrap {
max-width: 1136px;
margin: 0 auto;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__upper {
display: flex;
max-width: 1136px;
margin: 0 auto 46px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__upper.l-slim-sms {
display: block;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__ttl {
width: 50%;
}
}
.pw-sms__sec-01__ttl img {
width: 100%;
height: auto;
}
.pw-sms__sec-01__logo {
width: 90%;
margin: 25px auto 30px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__logo {
width: 32%;
margin-top: 38px;
margin-right: 20px;
}
.pw-sms__sec-01__logo img {
width: 90%;
}
}
.pw-sms__sec-01__logo.l-slim-sms {
font-size: 30px;
margin: 20px auto 8px;
text-align: center;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__logo.l-slim-sms {
width: 100%;
font-size: 39px;
margin-top: 35px;
margin-right: 0;
text-align: left;
}
}
.pw-sms__sec-01__middle {
position: relative;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle {
display: flex;
max-width: 1136px;
margin: 0 auto;
}
}
.pw-sms__sec-01__middle.l-slim-sms .pw-sms__sec-01__middle__kv__sp:first-of-type {
margin-bottom: -22px;
}
.pw-sms__sec-01__middle__kv__sp {
margin-bottom: 23px;
text-align: center;
display: block;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__kv__sp {
display: none;
}
}
.pw-sms__sec-01__middle__badges {
display: none;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__badges {
flex-basis: 50%;
display: flex;
justify-content: space-between;
margin-bottom: 47px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__badges.l-slim-sms {
display: block;
position: absolute;
right: 0;
top: -375px;
width: 45%;
height: auto;
}
}
.pw-sms__sec-01__middle__badges.l-slim-sms img {
width: 100%;
height: auto;
}
.pw-sms__sec-01__middle__badges__item {
width: 140px;
height: 140px;
}
.pw-sms__sec-01__middle__badges__item:first-child {
margin-bottom: 10px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__badges__item {
flex-basis: 48%;
height: auto;
}
}
.pw-sms__sec-01__middle__products {
display: none;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__products {
display: flex;
justify-content: center;
align-items: center;
display: block;
position: absolute;
right: 30px;
top: -130px;
width: 32%;
height: auto;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__middle__products.l-slim-sms {
flex-basis: 50%;
display: flex;
justify-content: space-between;
margin-bottom: 47px;
}
}
.pw-sms__sec-01__lower {
font-size: 12px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__lower {
width: 50%;
margin-right: 50%;
}
}
.pw-sms__sec-01__lower.l-slim-sms .pw-sms__sec-01__lower__products {
display: none;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-01__lower.l-slim-sms {
width: 100%;
margin-right: 0;
}
.pw-sms__sec-01__lower.l-slim-sms .pw-sms__sec-01__lower__products {
display: block;
width: 90%;
margin: 0 auto 22px;
}
.pw-sms__sec-01__lower.l-slim-sms .pw-sms__sec-01__lower__products img {
width: 100%;
height: auto;
}
}
.pw-sms__sec-02 {
padding: 30px 22px 13px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02 {
padding: 68px 0 70px;
}
}
.pw-sms__sec-02__features {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-bottom: 46px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__features {
margin: 0 auto 54px;
max-width: 1136px;
}
}
.pw-sms__sec-02__features__item {
width: 48%;
margin-bottom: 10px;
}
.pw-sms__sec-02__features__item img {
width: 100%;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__features__item {
width: 22%;
}
}
.pw-sms__sec-02__middle {
text-align: center;
}
.pw-sms__sec-02__middle__ttl {
margin-bottom: 40px;
}
.pw-sms__sec-02__middle__ttl br {
display: none;
}
.pw-sms__sec-02__middle__ttl__upper {
margin-bottom: 5px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__upper {
margin-bottom: 15px;
}
}
.pw-sms__sec-02__middle__ttl__span-01 {
font-size: 25px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-01 {
font-size: 44px;
}
}
.pw-sms__sec-02__middle__ttl__span-02 {
font-size: 18px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-02 {
font-size: 32px;
}
}
.pw-sms__sec-02__middle__ttl__span-03 {
font-size: 18px;
display: block;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-03 {
display: inline;
font-size: 32px;
}
}
.pw-sms__sec-02__middle__ttl__span-04 {
font-size: 18px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-04 {
font-size: 32px;
}
}
.pw-sms__sec-02__middle__ttl__span-05 {
font-size: 34px;
color: #ED3434;
line-height: 1;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-05 {
font-size: 60px;
}
}
.pw-sms__sec-02__middle__ttl__span-06 {
font-size: 25px;
color: #ED3434;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-06 {
font-size: 44px;
}
}
.pw-sms__sec-02__middle__ttl__span-07 {
font-size: 18px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__middle__ttl__span-07 {
font-size: 32px;
}
}
.pw-sms__sec-02__lower__tbl {
width: 100%;
font-size: 16px;
border: 1px solid #707070;
margin: 0 auto 13px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl {
margin: 0 auto 13px;
max-width: 1136px;
}
}
.pw-sms__sec-02__lower__tbl th, .pw-sms__sec-02__lower__tbl td {
border-bottom: 1px solid #707070;
display: block;
padding: 10px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl th, .pw-sms__sec-02__lower__tbl td {
display: table-cell;
padding: 15px;
}
}
.pw-sms__sec-02__lower__tbl th {
background: #8E8E8E;
color: #fff;
text-align: center;
font-size: 16px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl th {
width: 22%;
}
}
.pw-sms__sec-02__lower__tbl td {
font-size: 14px;
}
.pw-sms__sec-02__lower__tbl td.pw-sms__sec-02__lower__tbl__ex {
padding: 30px 45px;
}
.pw-sms__sec-02__lower__tbl__ttl {
font-size: 16px;
font-weight: bold;
margin-bottom: 15px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__ttl {
text-align: center;
}
}
.pw-sms__sec-02__lower__tbl__caution {
font-size: 12px;
}
.pw-sms__sec-02__lower__tbl__price {
font-size: 24px;
font-weight: bold;
padding-bottom: 13px;
border-bottom: 1px dotted #707070;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__price {
border-bottom: none;
padding-bottom: 8px;
}
}
.pw-sms__sec-02__lower__tbl__price span {
font-size: 16px;
}
.pw-sms__sec-02__lower__tbl__ex {
background: #FFD5D5;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__ex {
width: 30%;
}
}
.pw-sms__sec-02__lower__tbl__ex + td__ttl {
font-size: 24px;
font-weight: bold;
margin-bottom: 15px;
}
.pw-sms__sec-02__lower__tbl__ex + td__ttl span {
font-size: 16px;
}
.pw-sms__sec-02__lower__tbl__refer {
display: flex;
padding-top: 10px;
}
.pw-sms__sec-02__lower__tbl__refer__arrw {
background: #707070;
color: #fff;
margin-right: 15px;
height: 28px;
width: 50px;
padding: 7px 6px;
display: flex;
justify-content: center;
align-items: center;
position: relative;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__refer__arrw {
height: 38px;
width: 67px;
letter-spacing: 1px;
}
}
.pw-sms__sec-02__lower__tbl__refer__arrw:before {
position: absolute;
content: "";
top: 0;
right: -10px;
width: 0;
height: 0;
border-style: solid;
border-width: 14px 0 14px 10px;
border-color: transparent transparent transparent #707070;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__refer__arrw:before {
border-width: 19px 0 19px 10px;
}
}
.pw-sms__sec-02__lower__tbl__refer__text {
flex-basis: 70%;
font-size: 13px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-02__lower__tbl__refer__text__wrap {
display: flex;
}
}
.pw-sms__sec-02__lower__tbl__refer__text span {
display: block;
}
.pw-sms__sec-02__lower__tbl__refer__text dt {
font-size: 13px;
margin-bottom: 3px;
font-weight: normal;
}
.pw-sms__sec-02__lower__tbl__refer__text dd {
font-size: 14px;
font-weight: bold;
}
.pw-sms__sec-02__lower__tbl__refer__text dd + dt {
margin-top: 17px;
margin-bottom: 0;
}
.pw-sms__sec-02__lower__caution {
font-size: 14px;
display: block;
margin: 0 auto;
max-width: 1136px;
}
.pw-sms__sec-03 {
padding: 41px 20px 27px;
background: linear-gradient(90deg, #FFFFFF, #F5F2DA);
}
.pw-sms__sec-03.l-slim-sms {
background: linear-gradient(90deg, #D2D9E0, #FFFFFF, #D2D9E0);
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03 {
padding: 55px 0 38px;
}
}
.pw-sms__sec-03__ttl {
text-align: center;
max-width: 282px;
display: block;
margin: 0 auto;
margin-bottom: 10px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__ttl {
max-width: 808px;
font-size: 43px;
margin: 0 auto 56px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts {
max-width: 1136px;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
}
.pw-sms__sec-03__parts__ttl-01 {
font-size: 18px;
background: #333333;
color: #fff;
width: 100%;
max-width: 190px;
text-align: center;
line-height: 1;
padding: 7px 0;
margin: 0 auto 10px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__ttl-01 {
display: inline-block;
max-width: 255px;
}
}
.pw-sms__sec-03__parts__ttl-02 {
display: inline-block;
font-size: 18px;
font-weight: bold;
text-align: center;
padding: 7px 14px;
background: #333333;
color: #fff;
margin: 0 auto 13px;
line-height: 1.2;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__ttl-02 {
font-size: 22px;
}
}
.pw-sms__sec-03__parts__item {
border: 1px solid #CBC885;
border-radius: 14px;
box-shadow: 0 3px 6px rgba(121, 121, 77, 0.16);
padding: 20px 15px;
margin-bottom: 17px;
text-align: center;
background: #fff;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item {
order: 3;
margin-bottom: 26px;
}
}
.pw-sms__sec-03__parts__item.l-img {
border: none;
box-shadow: none;
width: 70%;
margin: 0 auto;
background: none;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-img {
flex-basis: 19%;
order: 2;
padding: 0;
}
}
.pw-sms__sec-03__parts__item__lead {
font-size: 14px;
text-align: left;
}
.pw-sms__sec-03__parts__item__sub {
font-size: 12px;
text-align: left;
}
.pw-sms__sec-03__parts__item__dl__parts {
padding-right: 30%;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl__parts {
padding-right: 37%;
margin-bottom: 30px;
}
}
.pw-sms__sec-03__parts__item__dl__parts:first-child {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_01.png) no-repeat right center/25% auto;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl__parts:first-child {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_01.png) no-repeat right top/33% auto;
}
}
.pw-sms__sec-03__parts__item__dl__parts:nth-child(2) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_02.png) no-repeat right center/25% auto;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl__parts:nth-child(2) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_02.png) no-repeat right top/33% auto;
}
}
.pw-sms__sec-03__parts__item__dl__parts:nth-child(3) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_03.png) no-repeat right center/25% auto;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl__parts:nth-child(3) {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/bottle_03.png) no-repeat right top/33% auto;
}
}
.pw-sms__sec-03__parts__item__dl dt {
font-size: 18px;
font-weight: bold;
margin-bottom: 13px;
display: flex;
align-items: center;
position: relative;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl dt {
margin-bottom: 0;
}
}
.pw-sms__sec-03__parts__item__dl dd {
font-size: 14px;
margin-bottom: 21px;
margin-left: 9px;
text-align: left;
}
@media screen and (max-width: 590px) {
.pw-sms__sec-03__parts__item__dl dd {
margin-left: 0;
}
}
.pw-sms__sec-03__parts__item__dl__point {
width: 46px;
height: 46px;
margin-right: 18px;
}
.pw-sms__sec-03__parts__item__dl__point span {
line-height: 1;
}
.pw-sms__sec-03__parts__item__dl__point.point_ico {
position: absolute;
left: 0;
top: 50%;
margin-top: -11px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item__dl__ttl {
margin-top: 5px;
}
}
.pw-sms__sec-03__parts__item__dl__num {
font-size: 21px;
}
.pw-sms__sec-03__parts__item__dl__catch {
color: #fff;
background: #ECBC3F;
padding: 2px 4px;
font-size: 12px;
line-height: 1;
border-radius: 5px;
margin-left: 6px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-01 {
flex-basis: 38%;
order: 0;
}
.pw-sms__sec-03__parts__item.l-parts__item-01 dt {
align-items: flex-start;
margin-bottom: -22px;
}
.pw-sms__sec-03__parts__item.l-parts__item-01 dd {
padding-left: 72px;
}
.pw-sms__sec-03__parts__item.l-parts__item-01 .pw-sms__sec-03__parts__item__dl__point {
width: 61px;
height: 61px;
}
.pw-sms__sec-03__parts__item.l-parts__item-01 .pw-sms__sec-03__parts__item__dl__point img {
width: 100%;
height: auto;
}
.pw-sms__sec-03__parts__item.l-parts__item-01 .pw-sms__sec-03__parts__item__dl__point .pw-sms__sec-03__parts__item__dl__num {
font-size: 30px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-02 {
flex-basis: 38%;
}
}
.pw-sms__sec-03__parts__item.l-parts__item-02 dl {
margin-top: 20px;
}
.pw-sms__sec-03__parts__item.l-parts__item-02 dt {
padding-left: 70px;
margin-bottom: 0;
}
.pw-sms__sec-03__parts__item.l-parts__item-02 dt .point_ico {
width: 62px;
height: auto;
}
.pw-sms__sec-03__parts__item.l-parts__item-02 dd {
padding-left: 70px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-02 dd {
padding-left: 63px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-03 {
flex-basis: 32%;
}
.pw-sms__sec-03__parts__item.l-parts__item-03 .pw-sms__sec-03__parts__ttl-02 {
margin-bottom: 50px;
}
}
.pw-sms__sec-03__parts__item.l-parts__item-03 .pw-sms__sec-03__parts__item__fig {
width: 85%;
margin: 0 auto;
}
.pw-sms__sec-03__parts__item.l-parts__item-03 .pw-sms__sec-03__parts__item__fig img {
width: 100%;
height: auto;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-04 {
flex-basis: 32%;
}
}
.pw-sms__sec-03__parts__item.l-parts__item-04 .pw-sms__sec-03__parts__item__fig {
width: 90%;
margin: 0 auto 10px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-04 .pw-sms__sec-03__parts__item__fig {
margin-top: 13.5px;
}
}
@media screen and (min-width: 960px) {
.pw-sms__sec-03__parts__item.l-parts__item-05 {
flex-basis: 32%;
}
}
.pw-sms__sec-04 {
padding: 37px 20px 30px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04 {
padding: 44px 0 45px;
}
}
.pw-sms__sec-04__ttl {
color: #59C8D0;
font-size: 24px;
margin: 0 auto 13px;
text-align: center;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__ttl {
font-size: 34px;
margin-bottom: 21px;
}
}
.pw-sms__sec-04__lead {
color: #59C8D0;
font-size: 16px;
margin: 0 auto 17.5px;
text-align: center;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__lead {
font-size: 18px;
margin-bottom: 88.5px;
}
}
.pw-sms__sec-04__features {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features {
max-width: 1136px;
margin: 0 auto;
}
}
.pw-sms__sec-04__features__item {
flex-basis: 48%;
margin-bottom: 23px;
order: 1;
position: relative;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item {
flex-basis: 32%;
margin-bottom: 96px;
}
.pw-sms__sec-04__features__item:nth-of-type(n+4) {
margin-bottom: 0;
}
}
.pw-sms__sec-04__features__item__ttl {
font-size: 14px;
margin-bottom: 4px;
color: #59C8D0;
text-align: center;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item__ttl {
color: #fff;
font-size: 16px;
background: #59C8D0;
width: 105px;
height: 105px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
left: 50%;
margin-left: -52.5px;
top: -52.5px;
}
}
.pw-sms__sec-04__features__item__cont {
width: 100%;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item__cont {
flex-basis: 100%;
}
}
.pw-sms__sec-04__features__item__cont img {
border: 2px solid #59C8D0;
border-radius: 14px;
width: 100%;
height: auto;
}
.pw-sms__sec-04__features__item__sub {
display: none;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item__sub {
display: block;
font-size: 14px;
margin-top: 6px;
}
}
.pw-sms__sec-04__features__item__text {
font-size: 10px;
}
.pw-sms__sec-04__features__item__figures {
display: flex;
justify-content: space-around;
margin-bottom: 12px;
}
.pw-sms__sec-04__features__item__figures__i {
flex-basis: 40%;
height: 73px;
background: #C6C6C6;
}
.pw-sms__sec-04__features__item__badges {
margin: 0 auto 6px;
width: 90%;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item__badges {
width: 67.01%;
}
}
.pw-sms__sec-04__features__item__badges img {
width: 100%;
height: auto;
}
.pw-sms__sec-04__features__item.l-odr-01 {
order: -1;
}
@media screen and (max-width: 960px) {
.pw-sms__sec-04__features__item.l-odr-01 img {
display: none;
height: 100%;
}
.pw-sms__sec-04__features__item.l-odr-01 .pw-sms__sec-04__features__item__cont {
background: url(//marutto.co.jp/wp-content/themes/marutto/app/img/pw-sms/loco_fujiyoshida.jpg) no-repeat center center/cover;
width: 100%;
height: 88%;
border: 2px solid #59c8d0;
border-radius: 14px;
}
}
.pw-sms__sec-04__features__item.no-bdr {
order: 0;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-04__features__item.no-bdr {
order: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
}
}
.pw-sms__sec-05 {
background: #EDFEFF;
padding: 34px 20px 37px;
}
.pw-sms__sec-05__ttl {
color: #59C8D0;
font-size: 24px;
margin: 0 auto 27px;
text-align: center;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-05__ttl {
font-size: 32px;
margin-bottom: 39px;
}
}
.pw-sms__sec-05__list {
display: flex;
justify-content: space-between;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-05__list {
justify-content: center;
}
}
.pw-sms__sec-05__list__item {
text-align: center;
width: 48%;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-05__list__item {
max-width: 288px;
}
.pw-sms__sec-05__list__item:first-child {
margin-right: 16px;
}
}
.pw-sms__sec-05__list__item__ttl {
font-size: 14px;
font-weight: bold;
margin-bottom: 18px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-05__list__item__ttl {
font-size: 24px;
margin-bottom: 15px;
}
}
.pw-sms__sec-05__list__item__img {
width: 100%;
}
.pw-sms__sec-05__list__item__img img {
border-radius: 14px;
width: 100%;
height: auto;
}
.pw-sms__sec-06 {
padding: 33px 20px 36px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-06 {
padding: 40px 0 48px;
}
}
.pw-sms__sec-06__ttl {
color: #59C8D0;
font-size: 24px;
margin: 0 auto 12px;
text-align: center;
}
.pw-sms__sec-06__tel {
background: #59C8D0;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 9px;
box-shadow: 0 3px 6px rgba(121, 121, 77, 0.16);
padding: 15px 0;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-06__tel {
padding: 27px 0;
margin: 0 auto;
max-width: 600px;
}
}
.pw-sms__sec-06__tel__ico {
width: 26.7px;
height: 26.7px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-06__tel__ico {
width: 47.6px;
height: 47.6px;
}
}
.pw-sms__sec-06__tel__ico img {
width: 100%;
height: auto;
}
.pw-sms__sec-06__tel__num {
font-size: 30px;
margin-left: 13px;
font-weight: bold;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-06__tel__num {
font-size: 53px;
}
}
.pw-sms__sec-07 {
background: #EDEDED;
padding: 18px 18.5px 34.5px;
}
@media screen and (min-width: 960px) {
.pw-sms__sec-07 {
padding: 30px 0;
text-align: center;
}
}
.pw-sms__sec-07__text {
font-size: 12px;
line-height: 2;
}  .low .attention-block {
margin: 50px auto 0;
padding: 27px 19px 33px;
border: 1px solid;
border-radius: 6px;
max-width: 746px;
color: #EF0000;
text-align: center;
}
.low .attention-block * {
color: inherit;
}
.low .attention-block_title {
margin: 0;
padding: 0;
font-family: "Noto Sans JP", sans-serif !important;
font-weight: 500;
font-size: 26px;
line-height: 44px;
}
.low .attention-block_note-mark {
position: static;
margin: 0;
padding: 0;
font-size: 50%;
font-weight: 400;
vertical-align: 12px;
}
.low .attention-block_note {
margin: 16px 0 0;
padding: 0;
font-size: 13px;
line-height: 1;
text-align: center;
}
.low .attention-block_note small {
font-size: 100%;
}
.low .attention-block_button-block {
margin: 30.5px 0 0;
padding: 0;
}
.low .attention-block_button {
margin: 0 auto;
border: 1px solid #181E21;
max-width: 419px;
color: #333;
font-family: "Noto Sans JP", sans-serif !important;
font-size: 18px;
line-height: 18px;
letter-spacing: 0.1em;
}
@media screen and (max-width: 960px) {
.low .attention-block {
margin-top: 20px;
padding-top: 16px;
padding-bottom: 18px;
}
.low .attention-block_title {
font-size: 15px;
line-height: 25px;
}
.low .attention-block_title sup {
vertical-align: 6px;
}
.low .attention-block_note {
margin-top: 12px;
font-size: 12px;
}
.low .attention-block_button-block {
margin-top: 21.5px;
}
.low .attention-block_button {
font-size: 16px;
height: 56px;
}
}.single .p-yoast-breadcrumbs {
display: none;
}
.single .inner.pankuzu .p-yoast-breadcrumbs {
display: block;
padding: 12px 0;
}

.fancybox__backdrop {
--fancybox-bg: rgba(0, 0, 0, .6);
}
.fancybox__container:not(.is-compact) .has-iframe .fancybox__content, .fancybox__container:not(.is-compact) .has-map .fancybox__content, .fancybox__container:not(.is-compact) .has-pdf .fancybox__content{
border: 10px solid #fff;
box-shadow: 0 0 20px #111;
}
.fancybox__content>.f-button.is-close-btn {
--f-button-svg-width: 16px;
--f-button-svg-height: 16px;
--f-button-svg-stroke-width: 4px;
top: -26px;
right: -26px;
opacity: 1;
display: block;
width: 30px;
height: 30px;
border-radius: 50%;
background: #000;
border: 2px solid white;
box-shadow: 0 0 4px #000;
transition: transform .25s ease-in-out;
}
.fancybox__content>.f-button.is-close-btn:hover {
opacity: .7;
transform: rotate(360deg);
}
.fancybox__content>.f-button.is-close-btn svg {
transition: transform .25s ease-in-out;
}