
html {width: 100%;background-color: #fff;}
body {width: 100%;color: #000;font-family: "Avenir","Helvetica Neue","Verdana",Helvetica,Arial,YuGothic,"Meiryo UI",メイリオ,Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;line-height: 1.6;word-wrap: break-word;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
p:not(:last-child) {margin-bottom: 15px;}
a {display: inline-block !important;}
img {max-width: 100%;vertical-align: bottom;}
.container {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-flow: column nowrap;flex-flow: column nowrap;font-size: 12px;}
.pageAquaprogram .aquaprogramHeader .videoWrapper {position: relative;z-index: 1;}
.pageAquaprogram .aquaprogramHeader {text-align: center;margin-top: 15px;}
.pageAquaprogram .aquaprogramHeader .headerTitle {position: relative;padding: 100px 0 160px;background-image: -o-linear-gradient(bottom, rgba(247,251,254,0) 0px, #f7fbfe 50px, rgba(247,251,254,0) 100px);background-image: linear-gradient(to top, rgba(247,251,254,0) 0px, #f7fbfe 50px, rgba(247,251,254,0) 100px);z-index: 3;margin-bottom: -50px;}
.pageAquaprogram .aquaprogramHeader .headerTitle h1 {width: 260px;margin: 0 auto;}
.pageAquaprogram .aquaprogramHeader .headerTitle h1 .aquaLogo .cls-1 {opacity: 0;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter1 {opacity: 1;-webkit-transition: opacity 1s 1.08s;-o-transition: opacity 1s 1.08s;transition: opacity 1s 1.08s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter5 {opacity: 1;-webkit-transition: opacity 1s 1.4s;-o-transition: opacity 1s 1.4s;transition: opacity 1s 1.4s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter11 {opacity: 1;-webkit-transition: opacity 1s 1.88s;-o-transition: opacity 1s 1.88s;transition: opacity 1s 1.88s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter4 {opacity: 1;-webkit-transition: opacity 1s 1.32s;-o-transition: opacity 1s 1.32s;transition: opacity 1s 1.32s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter10 {opacity: 1;-webkit-transition: opacity 1s 1.8s;-o-transition: opacity 1s 1.8s;transition: opacity 1s 1.8s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter6 {opacity: 1;-webkit-transition: opacity 1s 1.48s;-o-transition: opacity 1s 1.48s;transition: opacity 1s 1.48s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter7 {opacity: 1;-webkit-transition: opacity 1s 1.56s;-o-transition: opacity 1s 1.56s;transition: opacity 1s 1.56s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter2 {opacity: 1;-webkit-transition: opacity 1s 1.16s;-o-transition: opacity 1s 1.16s;transition: opacity 1s 1.16s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter8 {opacity: 1;-webkit-transition: opacity 1s 1.64s;-o-transition: opacity 1s 1.64s;transition: opacity 1s 1.64s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter3 {opacity: 1;-webkit-transition: opacity 1s 1.24s;-o-transition: opacity 1s 1.24s;transition: opacity 1s 1.24s;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play h1 .aquaLogo .letter9 {opacity: 1;-webkit-transition: opacity 1s 1.72s;-o-transition: opacity 1s 1.72s;transition: opacity 1s 1.72s;}
.pageAquaprogram .aquaprogramHeader .headerTitle .headerCopy {width: 220px;margin: 20px auto 0;opacity: 0;}
.pageAquaprogram .aquaprogramHeader .headerTitle.play .headerCopy {opacity: 1;-webkit-transition: opacity 1.0s 2.2s;-o-transition: opacity 1.0s 2.2s;transition: opacity 1.0s 2.2s;}
.pageAquaprogram .aquaprogramHeader .headerTitle .headerCopy img {width: 100%;}
.pageAquaprogram .aquaprogramHeader .videoWrapper video {width: 100%;opacity: 0.3;z-index: 1;}
.pageAquaprogram .aquaprogramHeader .videoWrapper .archer {position: absolute;top: 70px;left: 50%;width: 20px;margin-left: -15px;z-index: 2;-webkit-animation: updown 1s infinite alternate;animation: updown 1s infinite alternate;}
@keyframes updown {0% {transform: translateY(0);}100% {transform: translateY(-12px);}}
.pageAquaprogram .aquaprogramHeader .headerLede {position: relative;margin-top: -57px;z-index: 2;font-family: "Yu Mincho",YuMincho,serif;font-size: 14px;line-height: 2.2;color: #00235f;padding: 50px 15px;}
.pageAquaprogram .aquaprogramHeader .headerLede::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../img/movie_bg2.png) top center/100% auto;z-index: -1;}
.pageAquaprogram .aquaprogramHeader .headerLede::after {content: '';position: absolute;top: 50px;left: 0;width: 100%;height: calc(100% - 50px);background-color: #E0EEFF;z-index: -2;}
.pageAquaprogram .aquaprogramHeader .headerLede2 {position: relative;margin-top: -40px;z-index: 2;font-family: "Yu Mincho",YuMincho,serif;font-size: 14px;line-height: 2.2;color: #00235f;padding: 50px 15px;}
.pageAquaprogram .aquaprogramHeader .headerLede2::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #E0EEFF; top center/100% auto;z-index: -1;}
.pageAquaprogram .aquaprogramHeader .headerLede2::after {content: '';position: absolute;top: 50px;left: 0;width: 100%;height: calc(100% - 50px);background-color: #E0EEFF;z-index: -2;}
.timelagFadein .timelagFadeinContent {opacity: 0;-webkit-transform: translateY(20px);-ms-transform: translateY(20px);transform: translateY(20px);-webkit-transition: all .5s;-o-transition: all .5s;transition: all .5s;}
.timelagFadein .timelagFadeinContent.show {opacity: 1;-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}
.pageAquaprogram .imageSet {background-color: #E0EEFF;}
.pageAquaprogram .imageSet .eyeCatch {max-height: 250px;overflow: hidden;}
.pageAquaprogram .imageSet .eyeCatch img {width: 100%;}
.pageAquaprogram .contentWrapper {max-width: 920px;}
.pageAquaprogram .imageSet .description {padding: 30px 0;color: #00235f;}
.pageAquaprogram .imageSet .description p {font-size: 1.1rem;line-height: 2;text-align: justify;}
.pageAquaprogram .imageSet .description2 {padding: 30px 0;color: #00235f;}
.pageAquaprogram .imageSet .description2 p {font-size: 1.1rem;line-height: 2;text-align: justify;}
.pageAquaprogram .jwf {padding: 0 0 40px;background-color: #E0EEFF;}
.contentWrapper {max-width: 1080px;margin: 0 auto;padding: 0 10px;}
.pageAquaprogram .jwf .jwfFrame {border: 1px solid #6598ce;background-color: rgba(255,255,255,0.8);padding: 15px;color: #00235f;}
.pageAquaprogram .jwf .jwfFrame .jwfDesc .jwfTitle {font-family: "Yu Mincho",YuMincho,serif;font-size: 18px;}
.pageAquaprogram .jwf .jwfFrame .jwfInfo {margin-top: 15px;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;}
.pageAquaprogram .jwf .jwfFrame .jwfInfo p {font-size: 9px;width: 65%;}
.pageAquaprogram .jwf .jwfFrame .jwfInfo p a {text-decoration: underline;}
.pageAquaprogram .jwf .jwfFrame .jwfInfo .jwfLogo {width: 35%;}
.pageAquaprogram .aquaprogramSubTitle {font-size: 18px;text-align: center;margin-bottom: 15px;font-family: "Yu Mincho",YuMincho,serif;}
.pageAquaprogram .aquaprogramSubTitle2 {font-size: 18px;text-align: center;margin-bottom: 15px;font-family: "Yu Mincho",YuMincho,serif;}
.pageAquaprogram .aquaprogramActive {padding: 50px 0;background: url(../img/main_pic3.jpg) top -40px center/100% auto no-repeat #E0EEFF;}
.pageAquaprogram .aquaprogramActive.Active {padding: 95px 0;}
.pageAquaprogram .aquaprogramActive .aquaprogramSubTitle {color: #00235f;}
.pageAquaprogram .aquaprogramActive .aquaprogramSubTitle2 {color: #00235f;}
.pageAquaprogram .aquaprogramActive p {color: #00235f;font-size: 1.1rem;line-height: 2.2;text-align: justify;}
.pageAquaprogram .aquaprogramActive .balloons {position: relative;height: 500px;max-width: 500px;margin: 15px auto 0;}
.pageAquaprogram .aquaprogramActive .balloons li {position: absolute;}
.pageAquaprogram .aquaprogramActive .balloons li.balloon1 {width: 225px;height: 225px;top: 0;right: 20px;}
.pageAquaprogram .aquaprogramActive .balloons li.balloon2 {width: 187px;height: 187px;top: 230px;left: 0;}
.pageAquaprogram .aquaprogramActive .balloons li.balloon3 {width: 150px;height: 150px;top: 350px;right: 0;}
.pageAquaprogram .aquaprogramActive .balloons li img {width: 100%;}
.pageAquaprogram .pastActive {padding: 20px 0 40px 0;background-color: #E0EEFF;position: relative;overflow: hidden;}
.pageAquaprogram .contentWrapper {max-width: 920px;}
.pageAquaprogram .SDGs {width: 150px;margin-top: 30px;margin-left: auto;margin-right: auto;}

@media (max-width: 768px) {
  .exceptSmall {display: none !important;}
}
@media (min-width: 769px) {
  .container {font-size: 15px;}
  .onlySmall {display: none !important;}
  .container {-webkit-box-orient: vertical;-webkit-box-direction: reverse; nowrap;}
  .pageAquaprogram .aquaprogramHeader .headerTitle {padding: 80px 0;}
  .pageAquaprogram .aquaprogramHeader .headerTitle h1 {width: 450px;}
  .pageAquaprogram .aquaprogramHeader .headerTitle .headerCopy {width: 280px;margin: 40px auto 0;}
  .pageAquaprogram .aquaprogramHeader .videoWrapper {position: relative;z-index: 1;}
  .pageAquaprogram .aquaprogramHeader .videoWrapper .archer {top: 150px;width: 30px;}
  .pageAquaprogram .aquaprogramHeader .headerLede::after {top: 120px;height: calc(100% - 120px);}
  .pageAquaprogram .aquaprogramHeader .headerLede {margin-top: -130px;padding: 205px 15px 100px;font-size: 16px;}
  .pageAquaprogram .aquaprogramHeader .headerLede2::after {top: 120px;height: calc(100% - 120px);}
  .pageAquaprogram .aquaprogramHeader .headerLede2 {margin-top: -20px;padding: 140px 15px 50px;font-size: 16px;}
  .pageAquaprogram .imageSet.aboutAquaprogram {background-image: url(../img/main_pic1_wide.jpg) !important;}
  .pageAquaprogram .imageSet {min-height: 500px;background-size: cover;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}
  .pageAquaprogram .imageSet .contentWrapper {width: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;}
  .pageAquaprogram .imageSet .description p {font-family: "Yu Mincho",YuMincho,serif;font-size: 15px;line-height: 1.8;}
  .pageAquaprogram .imageSet .description {padding: 0;color: #fff;width: 420px;text-shadow: 0 0 10px rgb(0 0 0 / 80%);}
  .pageAquaprogram .imageSet .description2 p {font-family: "Yu Mincho",YuMincho,serif;font-size: 15px;line-height: 1.8;}
  .pageAquaprogram .imageSet .description2 {padding: 0;color: #00235f;width: 420px;}
  .pageAquaprogram .jwf {padding: 70px 0;}
  .pageAquaprogram .jwf .jwfFrame {display: -webkit-box;display: -ms-flexbox;display: flex;padding: 30px;}
  .pageAquaprogram .jwf .jwfFrame .jwfDesc {-webkit-box-flex: 1;-ms-flex: 1;flex: 1;}
  .pageAquaprogram .jwf .jwfFrame .jwfDesc .jwfTitle {font-size: 26px;margin-bottom: 20px;}
  .pageAquaprogram .jwf .jwfFrame .jwfDesc p {padding-left: 20px;}
  .pageAquaprogram .jwf .jwfFrame .jwfInfo {width: 320px;margin-top: 0;display: block;}
  .pageAquaprogram .jwf .jwfFrame .jwfInfo p {font-size: 0.9rem;width: 100%;}
  .pageAquaprogram .jwf .jwfFrame .jwfInfo .jwfLogo {width: 100%;}
  .pageAquaprogram .jwf .jwfFrame .jwfInfo .jwfLogo img {max-width: 220px;}
  .pageAquaprogram .imageSet.waterProblem {background-image: url(../img/main_pic2_wide.jpg) !important;}
  .pageAquaprogram .imageSet.Voice {background-image: url(../img/voice_wide.jpg) !important;}
  .pageAquaprogram .aquaprogramSubTitle {font-size: 28px;margin-bottom: 20px;text-align: left;}
  .pageAquaprogram .aquaprogramSubTitle2 {font-size: 28px;margin-bottom: 20px;text-align: center;}
  .pageAquaprogram .imageSet .contentWrapper.alignRight {-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;}
  .pageAquaprogram .aquaprogramActive {background: url(../img/main_pic3_wide.jpg) top -120px center/1800px auto no-repeat #E0EEFF;}
  .pageAquaprogram .aquaprogramActive .contentWrapper {position: relative;height: 800px;}
  .pageAquaprogram .aquaprogramActive.Active .contentWrapper {height: 430px;}
  .pageAquaprogram .aquaprogramActive .description {position: absolute;top: 250px;left: 0;width: 420px;}
  .pageAquaprogram .aquaprogramActive .description p {font-size: 15px;font-family: "Yu Mincho",YuMincho,serif;}
  .pageAquaprogram .aquaprogramActive .description.Centerdescription{position:static;width: 420px; margin: 0 auto;}
  .pageAquaprogram .aquaprogramActive .balloons {position: absolute;height: 100%;width: 600px;margin: 0;right: 0;}
  .pageAquaprogram .aquaprogramActive .balloons li.balloon1 {width: 320px;height: 320px;top: 0;left: 0;right: auto;}
  .pageAquaprogram .aquaprogramActive .balloons li.balloon2 {width: 260px;height: 260px;top: 330px;left: auto;right: 15px;}
  .pageAquaprogram .aquaprogramActive .balloons li.balloon3 {width: 220px;height: 220px;top: 550px;right: auto;left: 10px;}
  .pageAquaprogram .imageSet.smile {min-height: 640px;background-image: url(../img/main_pic4_wide.jpg);}
  .pageAquaprogram .imageSet.SDGs {background-image: url(../img/SDGs_wide.png);}
  .pageAquaprogram .pastActive {background-color: transparent;padding: 100px 0;}
  .pageAquaprogram .pastActive .banner {position: relative;z-index: 3;}
  .pageAquaprogram .pastActive .banner a {-webkit-transition: opacity .3s;-o-transition: opacity .3s;transition: opacity .3s;}
  .pageAquaprogram .pastActive video {position: absolute;top: 100px;width: 100%;opacity: 0.3;z-index: 1;}
  .pageAquaprogram .pastActive::after {content: '';position: absolute;width: 100%;height: 100%;left: 0;top: 0;background-image: -o-linear-gradient(#f7fbfe 100px, rgba(247,251,254,0) 150px);background-image: linear-gradient(#f7fbfe 100px, rgba(247,251,254,0) 150px);z-index: 2;}
}
  .pageAquaprogram .SDGs {width: 150px;margin-top: 30px;margin-left: auto;margin-right: auto;}


/*# sourceMappingURL=style.css.map */