mizumawari-campaign.scss
HTML {
font-size:10px!important;
}
.header{
box-shadow: initial!important;
}
HTML #layout01_bg,
HTML .top_width.top_infoarea,
HTML #layout04_bg{ font-size:16px!important;}
#mizumawari-campaign h2,
#mizumawari-campaign h3,
#mizumawari-campaign h4,
#mizumawari-campaign h5 { font-weight: normal;}
#mizumawari-campaign *,
.cdt_wrapper * { font-family: 'Noto Sans JP', sans-serif;}
#mizumawari-campaign .section001 *,
#mizumawari-campaign .section002 *,
#mizumawari-campaign .section003 *,
#mizumawari-campaign .section004 *,
#mizumawari-campaign .section005 *,
#mizumawari-campaign .section006 *,
#mizumawari-campaign .section007 *,
#mizumawari-campaign .section008 *,
#mizumawari-campaign .section009 *,
#mizumawari-campaign .section010 *,
#mizumawari-campaign .section011 *,
#mizumawari-campaign .section012 *,
#mizumawari-campaign .section013 *,
#mizumawari-campaign .section014 *{
letter-spacing: 0!important;
}
.cdt_wrapper {
height: 60px;
margin: 3% 0;
}
@media screen and (max-width: 768px) {
.cdt_wrapper {
margin: 5% 0 3%;
}
}
.cdt_wrapper .cdt {
text-align: center;
}
.cdt_wrapper .cdt_txt {
display: inline-block;
font-size: 2.5rem;
margin-bottom: 1%;
}
@media screen and (max-width: 768px) {
.cdt_wrapper .cdt_txt {
font-size: 1.6rem;
}
}
.cdt_wrapper .cdt_date {
display: inline-block;
font-size: 4rem;
font-weight: bold;
color: #ff0201;
}
@media screen and (max-width: 768px) {
.cdt_wrapper .cdt_date {
font-size: 2.5rem;
}
}
.cdt_wrapper .cdt.is-fixed {
position: fixed;
top: 85px;
left: 50%;
transform: translateX(-50%);
width: 100%;
margin: 0;
padding: 1%;
background: #fff;
z-index: 9;
}
.cdt_wrapper .cdt.is-fixed {
@media (max-width: 1024px) {
top: 65px;
}
@media (max-width: 767px) {
top: 50px;
z-index: 11;
}
}
#mizumawari-campaign {
overflow: hidden;
}
#mizumawari-campaign .display-none {
display: none;
}
#mizumawari-campaign .display-pc {
display: block;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .display-pc {
display: none;
}
}
#mizumawari-campaign .display-sp {
display: none;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .display-sp {
display: block;
}
}
#mizumawari-campaign .display-sp2 {
display: none;
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .display-sp2 {
display: block;
}
}
#mizumawari-campaign img {
display: block;
margin: 0 auto;
}
#mizumawari-campaign section {
box-sizing: border-box;
}
#mizumawari-campaign a {
display: block;
}
#mizumawari-campaign strong {
color: #f70d3e !important;
background: none !important;
}
#mizumawari-campaign .mx {
max-width: 780px;
margin: 0 auto;
}
#mizumawari-campaign #contact, #mizumawari-campaign #contact2, #mizumawari-campaign #contact3, #mizumawari-campaign #contact4 {
margin-top: -100px;
padding-top: 100px;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign #contact, #mizumawari-campaign #contact2, #mizumawari-campaign #contact3, #mizumawari-campaign #contact4 {
margin-top: -10vw;
padding-top: 10vw;
}
}
#mizumawari-campaign .water__inner {
max-width: 980px;
box-sizing: border-box;
padding: 0 20px;
margin: 0 auto;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .water__inner {
padding: 0 2%;
}
}
#mizumawari-campaign .water-bg {
background-repeat: no-repeat;
background-size: cover;
background-position: top;
}
#mizumawari-campaign .water-h2 {
display: block;
background-color: #fff;
width: 620px;
border-radius: 60px 0 0 60px;
margin: 0 auto;
text-align: center;
line-height: 60px;
height: 60px;
position: relative;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2 {
line-height: 45px;
height: 45px;
width: 96%;
max-width: 830px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .water-h2 {
height: 35px;
line-height: 35px;
}
}
#mizumawari-campaign .water-h2::before {
content: "";
position: absolute;
display: block;
background-color: #34b9d6;
width: 10px;
height: 10px;
border-radius: 5px;
top: 0;
bottom: 0;
left: 15px;
margin: auto;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2::before {
width: 7px;
height: 7px;
border-radius: 7px;
left: 10px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .water-h2::before {
left: 5px;
}
}
#mizumawari-campaign .water-h2::after {
content: "";
position: absolute;
display: block;
background-color: #34b9d6;
width: 47px;
height: 2px;
top: 0;
bottom: 0;
left: -30px;
margin: auto;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2::after {
width: 23.5px;
left: -8px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2::after {
left: -13px;
}
}
#mizumawari-campaign .water-h2__span01 {
font-size: 2.7rem;
color: #333;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2__span01 {
font-size: 1.5rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .water-h2__span01 {
font-size: 1.4rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .water-h2__span01 {
font-size: 1.3rem;
}
}
#mizumawari-campaign .water-h2__span02 {
font-size: 3.2rem;
color: #2c92c7;
background: linear-gradient(transparent 60%, #ffef66 60%);
margin: 0 .15em;
}
#mizumawari-campaign .water-h2__span02>span {
font-size: .8em;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2__span02 {
font-size: 1.8rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .water-h2__span02 {
font-size: 1.4rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .water-h2__span02 {
font-size: 1.4rem;
}
}
#mizumawari-campaign .water-h2__span03 {
font-size: 2.1rem;
color: #333;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-h2__span03 {
font-size: 1.3rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .water-h2__span03 {
font-size: 1.4rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .water-h2__span03 {
font-size: 1.3rem;
}
}
#mizumawari-campaign .water-cta {
background-color: #34b9d6;
padding: 60px 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .water-cta {
padding: 6% 0;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .water-cta {
padding: 3% 0 4.5%;
}
}
#mizumawari-campaign .water-cta__inner {
max-width: 980px;
box-sizing: border-box;
padding: 0 20px;
margin: 0 auto;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .water-cta__inner {
padding: 0 2%;
}
}
#mizumawari-campaign .water-cta__inner a:nth-of-type(1) {
max-width: 880px;
margin-bottom: 25px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .water-cta__inner a:nth-of-type(1) {
margin-bottom: 3%;
}
}
#mizumawari-campaign .water-cta__inner a:nth-of-type(2) {
max-width: 880px;
}
#mizumawari-campaign .section001 {
background-image: url(../images/mizumawari-campaign/water_img001_bg_pc.jpg);
padding: 60px 0 70px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section001 {
background-image: url(../images/mizumawari-campaign/water_img001_bg_tb.jpg);
padding: 6% 0 7%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section001 {
background-image: url(../images/mizumawari-campaign/water_img001_bg_sp.jpg);
padding: 5% 0 4.5%;
}
}
#mizumawari-campaign .section001__inner .water-h2 {
width: 620px;
margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section001__inner .water-h2 {
margin-bottom: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section001__inner .water-h2 {
margin-bottom: 3%;
width: 96%;
max-width: 380px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section001__inner h2 img {
width: 80%;
}
}
#mizumawari-campaign .section003 {
padding: 80px 0 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003 {
padding: 8% 0 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003 {
padding: 8% 0 2%;
}
}
#mizumawari-campaign .section003__inner .water-h2 {
width: 720px;
border: 1px solid #34b9d6;
margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner .water-h2 {
width: 650px;
margin-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner .water-h2 {
width: 94%;
max-width: 380px;
}
}
#mizumawari-campaign .section003__inner .water-h2 span:last-of-type::after {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_h2_01_pc.png);
width: 120px;
height: 42px;
display: block;
top: -25px;
right: -60px;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner .water-h2 span:last-of-type::after {
width: 60px;
height: 21px;
top: -15px;
right: -15px;
}
}
#mizumawari-campaign .section003__inner h3 {
margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner h3 {
margin-bottom: 6%;
}
}
#mizumawari-campaign .section003__inner--cnt > li {
background-color: #34b9d6;
background-image: radial-gradient(#42bed9 20%, transparent 20%), radial-gradient(#42bed9 20%, transparent 20%);
background-size: 20px 20px;
background-position: 0 0, 10px 10px;
display: block;
max-width: 940px;
border-radius: 10px;
box-sizing: border-box;
padding: 40px 30px;
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li {
padding: 4% 3%;
margin-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li {
padding: 0;
border: 2px solid #34b9d6;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 10px;
justify-content: center;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 {
margin-bottom: 3%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 {
box-sizing: border-box;
padding: 2%;
margin-bottom: 0;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 img {
width: 145px;
margin-right: 20px;
margin-left: 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 img {
width: 22%;
margin-right: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 img {
width: 15%;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div {
border-bottom: 3px dashed #fff;
box-sizing: border-box;
padding-bottom: 20px;
width: 715px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div {
width: 76%;
padding-bottom: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div {
width: fit-content;
padding-bottom: 2%;
border-bottom: 1px dashed #fff;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span01 {
font-size: 3.2rem;
font-weight: bold;
color: #fff;
letter-spacing: 0.05em;
line-height: 1.33em;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span01 {
font-size: 2.8rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span01 {
font-size: 1.8rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span01 {
font-size: 1.6rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span01 {
font-size: 1.4rem;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span02 {
font-size: 3.6rem;
font-weight: bold;
color: #f3dc23;
letter-spacing: 0.05em;
line-height: 1.33em;
text-shadow: 3px 3px #2c92c7;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span02 {
font-size: 3rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span02 {
font-size: 2rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span02 {
font-size: 1.8rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt01 > div .section003__inner--cnt01--span02 {
font-size: 1.4rem;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 {
width: 715px;
margin-right: 0;
margin-left: auto;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 {
width: 94%;
margin: 0 auto;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 {
background-color: #fff;
background-image: radial-gradient(#f7f7f7 20%, transparent 20%), radial-gradient(#f7f7f7 20%, transparent 20%);
background-size: 10px 10px;
background-position: 0 0, 5px 5px;
width: 100%;
border-radius: 0 0 10px 10px;
box-sizing: border-box;
padding: 3% 3% 1%;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li {
font-size: 2.2rem;
letter-spacing: 0.01em;
line-height: 1.5em;
color: #fff;
box-sizing: border-box;
padding-left: 35px;
padding-bottom: 10px;
position: relative;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li {
padding-bottom: 1%;
font-size: 2rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li {
padding-bottom: 2%;
font-size: 1.6rem;
color: #333;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li {
font-size: 1.4rem;
padding-left: 25px;
}
}
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li::before {
content: "";
width: 26px;
height: 23px;
background-image: url(../images/mizumawari-campaign/water_icon_01_pc.png);
position: absolute;
top: 7px;
left: 0;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li::before {
background-repeat: no-repeat;
background-size: cover;
background-image: url(../images/mizumawari-campaign/water_icon_01_sp.png);
width: 25px;
height: 25px;
top: 0;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section003__inner--cnt > li .section003__inner--cnt02 > li::before {
width: 12.5px;
height: 12.5px;
top: 3px;
}
}
#mizumawari-campaign .section004 {
background-image: url(../images/mizumawari-campaign/water_img004_bg_pc.jpg);
padding: 100px 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section004 {
background-image: url(../images/mizumawari-campaign/water_img004_bg_tb.jpg);
padding: 10% 0;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section004 {
background-image: url(../images/mizumawari-campaign/water_img004_bg_sp.jpg);
padding: 6% 0;
}
}
#mizumawari-campaign .section004__inner {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
#mizumawari-campaign .section004__inner h2 {
position: relative;
font-size: 4rem;
font-weight: bold;
color: #fff;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section004__inner h2 {
font-size: 3.5rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section004__inner h2 {
text-align: center;
line-height: 1.33em;
font-size: 3rem;
}
}
#mizumawari-campaign .section004__inner h2::before {
content: "";
background-image: url(../images/mizumawari-campaign/water_icon_02_pc.png);
width: 35px;
height: 35px;
position: absolute;
top: -30px;
left: -30px;
background-size: cover;
background-repeat: no-repeat;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section004__inner h2::before {
background-image: url(../images/mizumawari-campaign/water_icon_02_sp.png);
width: 17.5px;
height: 17.5px;
top: -15px;
left: -15px;
}
}
#mizumawari-campaign .section004__inner h2::after {
content: "";
background-image: url(../images/mizumawari-campaign/water_icon_03_pc.png);
width: 155px;
height: 70px;
position: absolute;
top: -50px;
right: -130px;
background-size: cover;
background-repeat: no-repeat;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section004__inner h2::after {
right: -100px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section004__inner h2::after {
background-image: url(../images/mizumawari-campaign/water_icon_03_sp.png);
width: 70px;
height: 29px;
top: -15px;
right: -35px;
}
}
#mizumawari-campaign .section005 {
padding: 50px 0 70px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section005 {
padding: 5% 0 7%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section005 {
padding: 5% 0 6%;
}
}
#mizumawari-campaign .section005__inner--cnt {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
#mizumawari-campaign .section005__inner--cnt li {
width: 452px;
max-width: 452px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section005__inner--cnt li {
width: 48%;
}
}
#mizumawari-campaign .section005__inner > img {
margin-right: 0;
margin-left: auto;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section005__inner > img {
width: 46%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section005__inner > img {
width: 50%;
}
}
#mizumawari-campaign .section007 {
padding: 90px 0 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007 {
padding: 9% 0 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007 {
padding: 11% 0 6%;
}
}
#mizumawari-campaign .section007__inner {
max-width: 984px;
}
#mizumawari-campaign .section007__inner .water-h2 {
width: 720px;
border: 1px solid #34b9d6;
margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .water-h2 {
width: 680px;
margin-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .water-h2 {
max-width: 380px;
width: 96%;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section007__inner .water-h2 span {
font-size: 1.2rem;
}
}
#mizumawari-campaign .section007__inner .water-h2 span:last-of-type::after {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_h2_02_pc.png);
width: 210px;
height: 50px;
display: block;
top: -35px;
right: -35px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .water-h2 span:last-of-type::after {
top: -30px;
right: -10px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .water-h2 span:last-of-type::after {
width: 105px;
height: 25px; top: -17px;
}
}
#mizumawari-campaign .section007__inner h3 {
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner h3 {
margin-bottom: 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner h3 {
margin-bottom: 8%;
}
}
#mizumawari-campaign .section007__inner--cnt {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding-top: 100px;
margin-top: -100px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner--cnt {
padding-top: 60px;
margin-top: -60px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner--cnt {
// padding-top: 160px;
// margin-top: -160px;
}
}
#mizumawari-campaign .section007__inner--cnt li.active {
cursor: auto;
}
#mizumawari-campaign .section007__inner--cnt li {
max-width: 467px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner--cnt li {
width: 49.5%;
}
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner--cnt a.type-1, #mizumawari-campaign .section007__inner--cnt a.type-2 {
width: 49.5%;
}
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .area {
margin: 0 auto;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .area {
width: 100%;
margin: 0 auto;
}
}
#mizumawari-campaign .section007__inner .area > div {
box-sizing: border-box;
padding: 20px 27px 0;
display: none;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .area > div {
padding: 2% 3% 0;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .area > div {
padding: 1% 2% 0;
}
}
#mizumawari-campaign .section007__inner .area > div.show {
display: block;
}
#mizumawari-campaign .section007__inner .area .section007__inner--cnt--blue {
border: 3px solid #2c92c7;
}
#mizumawari-campaign .section007__inner .area .section007__inner--cnt--pink {
border: 3px solid #ea6088;
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 h3 {
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 h3 {
margin-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 h3 {
margin-bottom: 3%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--01 {
margin-bottom: 70px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--01 {
margin-bottom: 7%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--01 {
margin-bottom: 6%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--03 {
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--03 {
margin-bottom: 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--03 {
margin-bottom: 4%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span {
display: block;
font-size: 2rem;
color: #333;
text-align: center;
max-width: 240px;
position: relative;
margin: 0 auto 15px; line-height: 1em;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span {
margin-bottom: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span {
font-size: 1.6rem;
max-width: 190px;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span::before {
content: "";
background-color: #000;
width: 2px;
height: 20px;
position: absolute;
display: block;
top: 0;
left: 0;
transform: rotate(-15deg);
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span::before {
height: 16px;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span::after {
content: "";
background-color: #000;
width: 2px;
height: 20px;
position: absolute;
display: block;
top: 0;
right: 0;
transform: rotate(15deg);
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 > span::after {
height: 16px;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--01 {
font-size: 2.4rem;
color: #fff;
background-color: #333;
text-align: center;
display: block;
width: 100%;
border-radius: 15px;
line-height: 45px;
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--01 {
margin-bottom: 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--01 {
font-size: 2rem;
border-radius: 10px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--01 {
font-size: 1.6rem;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding-bottom: 20px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box {
padding-bottom: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box {
display: block;
padding-bottom: 3%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li {
width: 422px;
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li {
width: 48%;
margin-bottom: 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li {
width: 100%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li h5 {
margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li h5 {
margin-bottom: 3%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li img:nth-of-type(1) {
margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--box > li img:nth-of-type(1) {
margin-bottom: 3%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 {
font-size: 3rem;
color: #000;
letter-spacing: 0.08em;
font-weight: bold;
line-height: 1.33em;
display: block;
text-align: center;
border-bottom: 2px dotted #eb678d;
margin: 0 auto 50px;
max-width: 830px;
padding-bottom: 10px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 {
font-size: 2.4rem;
margin-bottom: 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 {
font-size: 2rem;
margin-bottom: 8%;
padding-bottom: 1%;
max-width: 375px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 {
font-size: 1.8rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 {
font-size: 1.6rem;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 > span {
font-size: 2.6rem;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 > span {
font-size: 2.4rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 > span {
font-size: 1.8rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 > span {
font-size: 1.6rem;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--h4--02 > span {
font-size: 1.4rem;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--02 {
position: relative;
display: block;
margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--02 {
margin-bottom: 3%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--img--02::before {
content: "";
position: absolute;
background-image: url(../images/mizumawari-campaign/water_img007_a_23_pc.png);
width: 107px;
height: 41px;
display: block;
top: -15px;
left: 0;
z-index: 1;
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table {
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table {
margin-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table {
margin-bottom: 5%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr {
display: flex;
display: -webkit-flex;
display: -ms-flexbox;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr {
margin-bottom: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr {
margin-bottom: 5%;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(1) {
display: block;
width: 185px;
height: 33px;
line-height: 33px;
font-size: 2rem;
background-color: #333;
text-align: center;
color: #fff;
margin-right: 20px;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(1) {
width: 135px;
font-size: 1.6rem;
margin-right: 10px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(1) {
width: 115px;
font-size: 1.4rem;
margin-right: 10px;
}
}
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(2) {
font-size: 1.8rem;
color: #000;
vertical-align: middle;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(2) {
width: calc(100% - 205px);
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(2) {
width: calc(100% - 145px);
font-size: 1.6rem;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section007__inner .section007__inner--cnt--01 .section007__inner--cnt--01--table tr td:nth-of-type(2) {
width: calc(100% - 125px);
font-size: 1.5rem;
line-height: 1.3em;
}
}
#mizumawari-campaign .section007__inner > img {
margin-top: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section007__inner > img {
margin-top: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section007__inner > img {
margin-top: 5%;
}
}
#mizumawari-campaign .section009 {
padding: 100px 0 50px;
position: relative;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section009 {
padding: 10% 0 5%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section009 {
padding: 7% 0 3%;
}
}
#mizumawari-campaign .section009::before {
content: "";
position: absolute;
right: 0;
left: 0;
bottom: -80px;
margin: auto;
background-color: #fff;
display: block;
width: 100%;
height: 160px;
border-radius: 0 0 100% 100%;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section009::before {
bottom: -40px;
height: 80px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section009::before {
height: 40px;
bottom: -20px;
}
}
#mizumawari-campaign .section009__inner {
position: relative;
}
#mizumawari-campaign .section009__inner .water-h2 {
width: 720px;
border: 1px solid #34b9d6;
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section009__inner .water-h2 {
width: 680px;
margin-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section009__inner .water-h2 {
max-width: 380px;
width: 96%;
}
}
#mizumawari-campaign .section009__inner .water-h2 span:last-of-type::after {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_h2_03_pc.png);
width: 170px;
height: 40px;
display: block;
top: -20px;
right: -40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section009__inner .water-h2 span:last-of-type::after {
top: -30px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section009__inner .water-h2 span:last-of-type::after {
background-image: url(../images/mizumawari-campaign/water_h2_03_pc.png);
width: 85px;
height: 20px;
top: -12px;
right: -15px;
}
}
#mizumawari-campaign .section010 {
padding: 180px 0 60px;
background-image: radial-gradient(#d6f9e6 20%, transparent 20%), radial-gradient(#d6f9e6 20%, transparent 20%);
background-color: #dafeeb;
background-size: 20px 20px;
background-position: 0 0, 10px 10px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010 {
padding-top: calc(40px + 10%);
padding-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010 {
padding-top: calc(20px + 7%);
}
}
#mizumawari-campaign .section010__inner--cnt > li {
background-color: #fff;
border-radius: 15px;
box-sizing: border-box;
padding: 90px 50px 40px;
position: relative;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li {
padding-top: calc(40px + 5%);
padding-left: 5%;
padding-right: 5%;
padding-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li {
padding-top: calc(25px + 6.5%);
}
}
#mizumawari-campaign .section010__inner--cnt > li::before {
text-align: center;
font-size: 4rem;
box-sizing: border-box;
width: 90px;
height: 90px;
background-color: #34b9d6;
color: #fff;
border-radius: 90px;
line-height: 90px;
position: absolute;
top: -40px;
right: 0;
left: 0;
margin: auto;
font-weight: bold;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li::before {
width: 60px;
height: 60px;
font-size: 3rem;
line-height: 60px;
border-radius: 60px;
top: -25px;
}
}
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(1) {
margin-bottom: 80px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(1) {
margin-bottom: calc(50px + 3%);
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(1) {
margin-bottom: calc(25px + 6.5%);
}
}
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(1)::before {
content: "01";
}
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(2) {
margin-bottom: 80px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(2) {
margin-bottom: calc(50px + 3%);
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(2) {
margin-bottom: calc(25px + 6.5%);
}
}
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(2)::before {
content: "02";
}
#mizumawari-campaign .section010__inner--cnt > li:nth-of-type(3)::before {
content: "03";
}
#mizumawari-campaign .section010__inner--cnt > li h4 {
font-size: 3rem;
text-align: center;
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li h4 {
font-size: 2.4rem;
margin-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li h4 {
font-size: 1.6rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li h4 {
letter-spacing: -0.06em;
}
}
#mizumawari-campaign .section010__inner--cnt > li h4 .section010__inner--cnt--h4--span01 {
color: #333;
line-height: 2em;
}
#mizumawari-campaign .section010__inner--cnt > li h4 .section010__inner--cnt--h4--span02 {
background-color: #ffef66;
line-height: 2em;
box-sizing: border-box;
padding: 0 10px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li h4 .section010__inner--cnt--h4--span02 {
padding: 0 5px;
}
}
#mizumawari-campaign .section010__inner--cnt > li img {
margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section010__inner--cnt > li img {
margin-bottom: 3%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li img {
margin-bottom: 4%;
}
}
#mizumawari-campaign .section010__inner--cnt > li p {
font-size: 1.8rem;
line-height: 2em;
letter-spacing: 0.05em;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section010__inner--cnt > li p {
font-size: 1.6rem;
letter-spacing: 0;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section010__inner--cnt > li p {
font-size: 1.4rem;
}
}
#mizumawari-campaign .section012 {
padding: 80px 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012 {
padding: 8% 0;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012 {
padding: 8% 0 2%;
}
}
#mizumawari-campaign .section012__inner .water-h2 {
width: 720px;
border: 1px solid #34b9d6;
margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner .water-h2 {
width: 680px;
margin-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner .water-h2 {
width: 96%;
margin-bottom: 3%;
max-width: 380px;
}
}
#mizumawari-campaign .section012__inner .water-h2 span:last-of-type::after {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_h2_04_pc.png);
width: 210px;
height: 45px;
display: block;
top: -30px;
right: -35px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner .water-h2 span:last-of-type::after {
top: -25px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner .water-h2 span:last-of-type::after {
width: 105px;
height: 22.5px;
top: -12px;
right: -20px;
}
}
#mizumawari-campaign .section012__inner h3 {
margin-bottom: 20px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner h3 {
margin-bottom: 2%;
}
}
#mizumawari-campaign .section012__inner--cnt > li {
padding: 50px 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li {
padding: 5% 0;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li {
padding: 4% 0;
}
}
#mizumawari-campaign .section012__inner--cnt > li:not(:last-of-type) {
border-bottom: 1px dashed #333;
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q {
position: relative;
box-sizing: border-box;
padding-left: 70px;
margin-bottom: 40px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q {
margin-bottom: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q {
padding-left: 35px;
margin-bottom: 3%;
}
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q::before {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_icon_04_pc.png);
width: 43px;
height: 43px;
display: block;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q::before {
top: 4px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q::before {
width: 21.5px;
height: 21.5px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q::before {
top: 2px;
}
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q > span {
color: #2c92c7;
font-size: 2.4rem;
line-height: 43px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q > span {
font-size: 2rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q > span {
font-size: 1.8rem;
line-height: 1.5em;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--Q > span {
font-size: 1.6rem;
}
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A {
position: relative;
box-sizing: border-box;
padding-left: 70px;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A {
padding-left: 35px;
}
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A::before {
content: "";
position: absolute;
background-size: cover;
background-repeat: no-repeat;
background-image: url(../images/mizumawari-campaign/water_icon_05_pc.png);
width: 43px;
height: 43px;
display: block;
top: 0;
left: 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A::before {
top: 4px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A::before {
width: 21.5px;
height: 21.5px;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A::before {
top: 2px;
}
}
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A > span {
color: #333;
font-size: 2rem;
line-height: 43px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A > span {
font-size: 1.8rem;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A > span {
font-size: 1.6rem;
line-height: 1.5em;
}
}
@media screen and (max-width: 414px) {
#mizumawari-campaign .section012__inner--cnt > li > ul .section012__inner--cnt--A > span {
font-size: 1.4rem;
}
}
#mizumawari-campaign .section013 {
background-color: #34b9d6;
background-image: radial-gradient(#42bed9 20%, transparent 20%), radial-gradient(#42bed9 20%, transparent 20%);
background-size: 20px 20px;
background-position: 0 0, 10px 10px;
}
#mizumawari-campaign .section013__inner {
position: relative;
padding-top: 60px;
padding-bottom: 60px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section013__inner {
padding-top: 6%;
padding-bottom: 6%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner {
padding-top: 6%;
padding-bottom: 6%;
}
}
#mizumawari-campaign .section013__inner::before {
content: "";
position: absolute;
background-repeat: no-repeat;
background-size: cover;
background-image: url(../images/mizumawari-campaign/water_img013_01_pc.png);
width: 190px;
height: 130px;
display: block;
bottom: 0;
right: 0;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner::before {
background-image: url(../images/mizumawari-campaign/water_img013_02_sp.png);
width: 40px;
opacity: 0.6;
height: 32.5px;
right: 2%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner::after {
content: "";
position: absolute;
background-repeat: no-repeat;
background-size: cover;
background-image: url(../images/mizumawari-campaign/water_img013_03_sp.png);
opacity: 0.6;
width: 17px;
height: 22.5px;
display: block;
bottom: 0;
left: 4.5%;
}
}
#mizumawari-campaign .section013__inner h2 {
font-size: 4rem;
font-weight: bold;
color: #fff;
text-align: center;
letter-spacing: 0.1em;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner h2 {
font-size: 3rem;
letter-spacing: 0;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section013__inner h2 {
font-size: 2rem;
}
}
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span01 {
position: relative;
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span01::after {
content: "";
position: absolute;
background-repeat: no-repeat;
background-size: cover;
background-image: url(../images/mizumawari-campaign/water_img013_01_sp.png);
width: 52.5px;
height: 27.5px;
display: block;
top: -6px;
left: -25px;
}
}
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span02 {
display: block;
font-size: 2rem;
letter-spacing: 0.1em;
text-align: center;
margin-top: 20px; font-weight: normal;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span02 {
margin-top: 4%;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span02 {
margin-top: 4%;
font-size: 3.8vw;
letter-spacing: 0;
}
}
@media screen and (max-width: 374px) {
#mizumawari-campaign .section013__inner h2 .section013__inner--h2--span02 {
font-size: 1.2rem;
}
}
#mizumawari-campaign .section014 {
padding: 70px 0 0;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section014 {
padding: 6% 0 0;
}
}
#mizumawari-campaign .section014__inner > img {
margin-bottom: 70px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section014__inner > img {
margin-bottom: 7%;
}
}
#mizumawari-campaign .section014 #contact {
margin-top: -100px;
padding-top: 100px;
}
#mizumawari-campaign .section014 #contact2 {
margin-top: -100px;
padding-top: 100px;
}
#mizumawari-campaign .section014 #contact3 {
margin-top: -100px;
padding-top: 100px;
}
#mizumawari-campaign .section014 #contact4 {
margin-top: -100px;
padding-top: 100px;
}
@media screen and (max-width: 1024px) {
#mizumawari-campaign .section014 #contact {
margin-top: -40px;
padding-top: 40px;
}
}
@media screen and (max-width: 767px) {
#mizumawari-campaign .section014 #contact {
margin-top: -45px;
padding-top: 45px;
}
}
@media screen and (min-width: 768px) {
#mizumawari-campaign .water-tel {
pointer-events: none;
}
}
#mizumawari-campaign .layout02 {
display: none;
}
// #mizumawari-campaign .form.inquiry_wrap {
// max-width: 980px;
// }
// #mizumawari-campaign .form.inquiry_wrap * {
// border: 0;
// }
// #mizumawari-campaign .form.inquiry_wrap .scroll {
// border: solid 1px #d4d4d4 !important;
// }
// #mizumawari-campaign .form.inquiry_wrap img.wpcf7c-elm-step1 {
// display: none;
// }
// #mizumawari-campaign .form.inquiry_wrap .itemform2 {
// display: none;
// }
// #mizumawari-campaign .form.inquiry_wrap .itemname {
// font-size: 18px;
// font-weight: normal;
// float: none;
// background: none;
// border-top: 0;
// height: auto;
// width: 100%; min-height: 2em;
// margin: 0 auto; padding: .5em 20px; box-sizing: border-box;
// }
// @media screen and (max-width: 1024px) {
// #mizumawari-campaign .form.inquiry_wrap .itemname {
// padding: .5em 2%;
// }
// }
// @media screen and (max-width: 767px) {
// #mizumawari-campaign .form.inquiry_wrap .itemname {
// padding: .5em 4%;
// }
// }
// #mizumawari-campaign .wpcf7-text {
// width: 100%;
// }
// #mizumawari-campaign .itemform {
// width: 100%; margin: 0 auto; padding: .5em 20px 2.5em; box-sizing: border-box; height: auto;
// }
// @media screen and (max-width: 1024px) {
// #mizumawari-campaign .itemform {
// padding: .5em 2% 2.5em;
// }
// }
// @media screen and (max-width: 767px) {
// #mizumawari-campaign .itemform {
// padding: .5em 4% 2.5em;
// }
// }
// #mizumawari-campaign .wpcf7-form-control-wrap {
// max-width: 100%;
// }
// #mizumawari-campaign .form ul.formlist li input {
// max-width: 100% !important; width: 100% !important;
// background: #fff89d !important;
// margin: 0 auto;
// }
// #mizumawari-campaign .form textarea {
// height: 200px;
// width: 100%;
// background: #fff89d; margin: 0 auto;
// }
// #mizumawari-campaign .item_required {
// border: 1px solid #ff3332 !important;
// color: #ff3332;
// }
// #mizumawari-campaign .item_unrequired {
// border: 1px solid #c4bfbf !important;
// color: #c4bfbf;
// }
// #mizumawari-campaign .item_required,
// #mizumawari-campaign .item_unrequired {
// padding: 0px 6px !important;
// border-radius: 0 !important;
// margin-right: 5px !important;
// margin-left: .3em;
// background: none; font-size: .8em;
// }
// #mizumawari-campaign .form ul.formlist { margin: 10px 0 20px;}
// @media screen and (max-width: 1024px) {
// #mizumawari-campaign .form ul.formlist { margin: 2% auto 2%;}
// }
// #mizumawari-campaign div.wpcf7c-elm-step1.form_description p {
// font-size: 16px;
// width:96%; margin: 0px auto 1.5em;
// }
// @media screen and (max-width: 1024px) {
// #mizumawari-campaign div.wpcf7c-elm-step1.form_description p { margin: 1% auto 1.5em;}
// }
// @media screen and (max-width: 767px) {
// #mizumawari-campaign div.wpcf7c-elm-step1.form_description p { width:92%;}
// }
// #mizumawari-campaign div.wpcf7c-elm-step1.form_description .wpcf7c-elm-step1.privacy { margin: 0px 14px;}
// #mizumawari-campaign input[class*="form_btn"] { background: #34bad7;}
// #mizumawari-campaign input[class*="form_btn"]:hover { background: #ff7800;}
// #mizumawari-campaign .scroll {
// height: 230px;
// overflow-y: scroll;
// width: 96%;
// margin: 0 auto 30px;
// border: solid 1px #d4d4d4;
// padding: 1em;
// box-sizing: border-box;
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .scroll { height: 250px; padding: 20px;}
// }
// @media (min-width: 1025px) {
// #mizumawari-campaign .privacy { width: 940px;}
// }
// #mizumawari-campaign .privacy__wrap {
// padding: 0 3%;
// box-sizing: border-box;
// }
// @media (min-width: 1025px) {
// #mizumawari-campaign .privacy__wrap { padding: 0;}
// }
// #mizumawari-campaign .privacy__paragraph { margin: 0 0 20px;}
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy__paragraph { margin: 0 0 30px;}
// }
// #mizumawari-campaign .privacy p {
// font-size: 1.4rem;
// letter-spacing: 0.175em;
// line-height: 1.75em;
// color: #353535;
// display: block;
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy p { font-size: 1.6rem;}
// }
// #mizumawari-campaign .privacy__h3 {
// margin: 0 0 15px;
// font-size: 1.8rem;
// font-weight: bold;
// letter-spacing: 0.175em;
// color: #222;
// display: block;
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy__h3 {
// font-size: 2rem;
// text-align: center;
// margin-bottom: 15px;
// }
// }
// #mizumawari-campaign .privacy__box--end { margin: 0 0 20px;}
// #mizumawari-campaign .privacy__h4 {
// font-size: 1.4rem;
// font-weight: 500;
// letter-spacing: 0.175em;
// line-height: 1.75em;
// color: #353535;
// padding: 15px;
// box-sizing: border-box;
// background-color: #eee;
// display: block; margin-bottom: 1em;
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy__h4 {
// font-size: 1.6rem;
// text-align: center;
// }
// }
// #mizumawari-campaign .privacy__inner {
// padding: 15px;
// box-sizing: border-box;
// border-left: 1px solid #eee;
// border-right: 1px solid #eee;
// border-bottom: 1px solid #eee;
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy__inner {
// padding: 50px;
// margin-bottom: 30px;
// }
// }
// @media (min-width: 768px) {
// #mizumawari-campaign .privacy__inner--small { padding: 30px 50px;}
// }
// .form input[type="text"], .form textarea { padding: 5px; box-sizing: border-box; border-radius: 5px; font-size: 16px;}
// #mizumawari-campaign button.form_btn01 { background: url(../images/mizumawari-campaign/form_btn01.svg) no-repeat 0 0; background-size: 100% auto;}
.section007__inner--cnt+.add-k{
margin-top: 4%;
margin-bottom: 4%;
}
.cta-floating{
display: none!important;
}