body{
    font-feature-settings: "palt"1;
    }
    
.msms-top {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit- transform: translateY(-50%);
}


.msms-top2 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit- transform: translateY(-50%);
}








/* msms-topのleft */
@media (min-width: 768px) {
    .msms-top {
    left: 0%;
    }
    }
    @media (min-width: 992px) {
    .msms-top {
        left: 3%;
    }
    }
    @media (min-width: 1200px) {
    .msms-top {
    left: 3%;
    }
    }

    @media (min-width: 1600px) {
    .msms-top {
    left: 10%;
    }
}

body{
font-feature-settings: "palt"1;
}



/* パイプ用 */

.watarpipe-yoko-container {
    position: relative;
    overflow-x: clip;
}

.watarpipe-yoko {
    height: 90px;
    margin-left: 2%;
    margin-right: 2%;
    margin-top: -30px;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 750px;
}

@media screen and ( max-width: 767px ) {
    .watarpipe-yoko {
        height: 50px;
        margin-left: 25px;
        margin-right: 25px;
        margin-top: -15px;
        background: repeat-x url(../images/watarpipe001l.png);
        background-size: 450px;
    }
}


.watarpipe-tate-container {
    height: auto;
    position: relative;
}



.watarpipe-tate-r {
    position: absolute;
    height: 90px;
    width: auto;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 750px;
    transform: rotate(90deg);
    right: -25px;
}



.watarpipe-tate-r0 {
	position: relative;
	overflow: hidden;
}

.watarpipe-tate-r0:before {
    content: "";
    position: absolute;
    width: 5000%;
    height: 62px;
    top: 0;
    left: calc(100% + 20px);
    z-index: 0;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 750px;
}

@media screen and ( max-width: 767px ) {
.watarpipe-tate-r0:before {
    content: "";
    position: absolute;
    width: 5000%;
    height: 62px;
    top: 0;
    left: calc(100% + 12px);
    z-index: 0;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 450px;
}
}




.watarpipe-tate-r0:before {
	transform: rotate(90deg);
    transform-origin: top left;
}




.watarpipe-tate-l0 {
	position: relative;
	overflow: hidden;
}

.watarpipe-tate-l0:before {
    content: "";
    position: absolute;
    width: 5000%;
    height: 62px;
    top: 0;
    left: 45px;
    z-index: 0;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 750px;
}



@media screen and ( max-width: 767px ) {
.watarpipe-tate-l0:before {
    content: "";
    position: absolute;
    width: 5000%;
    height: 62px;
    top: 0;
    left: 27px;
    z-index: 0;
    background: repeat-x url(../images/watarpipe001l.png);
    background-size: 450px;
}
}




.watarpipe-tate-l0:before {
	transform: rotate(90deg);
    transform-origin: top left;
}



.watarpipe002-tlu  {
	position: absolute;
    width: 124px;
    top: 65px;
    left: -50px;
    transform: rotateX(180deg);
    transform-origin: top;
    z-index: 1;
}

.watarpipe002-tld {
	position: absolute;
    width: 124px;
    top: -1px;
    left: -50px;
    z-index: 1;
}

.watarpipe002-hc  {
	position: absolute;
    width: 100px;
    top: -18px;
    left: 25%;
    transform: rotate(180deg);
    z-index: 1;
}

.watarpipe002-vl {
    position: absolute;
    width: 100px;
    top: 30%;
    left: -18px;
    transform: rotate(-90deg);
    z-index: 1;
}

.watarpipe002-vr {
    position: absolute;
    width: 100px;
    top: 30%;
    right: -23px;
    transform: rotate(90deg);
    z-index: 1;
}

@media screen and ( max-width: 767px ) {
    .watarpipe002-tlu  {
        position: absolute;
        width: 70px;
        top: 65px;
        left: -25px;
        transform: rotateX(180deg);
        transform-origin: top;
    }
    .watarpipe002-tld {
        position: absolute;
        width: 70px;
        top: 1px;
        left: -25px;
    }
    .watarpipe002-hc {
        position: absolute;
        width: 72px;
        top: -17px;
        left: 25%;
        transform: rotate(180deg);
    }
    .watarpipe002-vl {
        position: absolute;
        width: 70px;
        top: 30%;
        left: -18px;
    }
    .watarpipe002-vr {
        position: absolute;
        width: 70px;
        top: 30%;
        right: -18px;
        transform: rotate(90deg);
    }
}



.watarpipe003-vr {
    position: absolute;
    width: 100px;
    top: 30%;
    right: -20px;
    transform: rotate(90deg);
    z-index: 1;
}


.watarpipe003-hc {
    position: absolute;
    width: 100px;
    top: -36px;
    left: 65%;
    z-index: 1;
}

@media screen and ( max-width: 767px ) {
    .watarpipe003-vr {
        position: absolute;
        width: 70px;
        top: 30%;
        right: -15px;
        transform: rotate(90deg);
    }
    .watarpipe003-hc {
        position: absolute;
        width: 70px;
        top: -28px;
        left: 65%;
    }
}

.watarpipe004-tru {
	position: absolute;
    width: 124px;
    top: 65px;
    right: -25px;
    transform: rotateX(180deg);
    transform-origin: top;
    z-index: 1;
}


.watarpipe004-trd {
	position: absolute;
    width: 124px;
    top: -1px;
    right: -25px;
    z-index: 1;
}


@media screen and ( max-width: 767px ) {
    .watarpipe004-tru {
        position: absolute;
        width: 70px;
        top: 38px;
        right: -10px;
        transform: rotateX(180deg);
        transform-origin: top;
    }
    
    .watarpipe004-trd {
        position: absolute;
        width: 70px;
        top: 0px;
        right: -10px;
}
}



.watarpipe004-tlu {
	position: absolute;
    width: 124px;
    top: 65px;
    left: -25px;
    transform: rotate(180deg);
    transform-origin: top;
    z-index: 1;
}



.watarpipe004-tld {
	position: absolute;
    width: 124px;
    top: -1px;
    left: -25px;
    transform: rotate(-90deg);
    z-index: 1;
}



@media screen and ( max-width: 767px ) {
.watarpipe004-tlu {
    position: absolute;
    width: 70px;
    top: 38px;
    left: -10px;
    transform: rotate(180deg);
    transform-origin: top;
}
.watarpipe004-tld {
	position: absolute;
    width: 70px;
    top: 1px;
    left: -10px;
    transform: rotate(-90deg);
}




}





.watarpipe005-tr {
	position: absolute;
    width: 48px;
    top: 2px;
    right: -2px;
    z-index: 1;
}


@media screen and ( max-width: 767px ) {
.watarpipe005-tr {
    position: absolute;
    width: 28px;
    top: 2px;
    right: -2px;
}
}




.watarpipe006-vl {
    position: absolute;
    width: 100px;
    top: 70%;
    left: -18px;
    transform: rotate(90deg);
    z-index: 1;
}

.watarpipe006-hcd {
    position: absolute;
    width: 100px;
    top: 4px;
    left: 20%;
    transform: rotate(180deg);
    z-index: 1;
}

.watarpipe006-hcu {
    position: absolute;
    width: 100px;
    top: -36px;
    left: 70%;
    z-index: 1;
}


@media screen and ( max-width: 767px ) {
    .watarpipe006-vl {
        position: absolute;
        width: 70px;
        top: 70%;
        left: -15px;
        transform: rotate(90deg);
    }
    .watarpipe006-hcd {
        position: absolute;
        width: 70px;
        top: 0px;
        left: 20%;
        transform: rotate(180deg);
    }
    .watarpipe006-hcu {
        position: absolute;
        width: 70px;
        top: -29px;
        left: 70%;
    }
    
}



.bg-001 {
	position: absolute;
    width: 100%;
    height: 100%;
    background-color: #F8F5ED;
    z-index: -2;
}



.bg-002 {
	position: absolute;
    width: 100%;
    height: 100%;
    background-color: #DED6C6;
    z-index: -2;
}


.bg-003 {
	position: absolute;
    width: 100%;
    height: 100%;
    background-color: #161616;
    z-index: -2;
}





/* パイプ用 - レイアウト調整 */

.watarpipe-pl {
	padding-left: 35px;
    padding-top: 50px;
    padding-bottom: 60px;
}


.watarpipe-pr {
	padding-right: 35px;
    padding-top: 50px;
    padding-bottom: 60px;
}


@media screen and ( min-width: 768px ) {
.pull-right-md {
    float: right !important;
}
}


@media (max-width: 480px) {
    footer {
      padding: 10px;
      /* padding-bottom: 60px; */
      /* height: 200px; */
    }
    footer .pull-right-md {
      font-size: 11.2px;
      padding-bottom: 10px;
      text-align: left;
    }
    footer a {
      display: inline-block;
      padding: 5px 10px 5px 2px;
      color: #337ab7;
    }
  }









  /* ヘッダー用 - 各パーツの動き */



.header-hikouki{
animation: open-elem-anim 5s ease-in 1s forwards, Orbita 5s infinite linear;
}


@-webkit-keyframes open-elem-anim {
    0% { 
      transform: scale(3);
    }
    100% { 
      transform: scale(1.1);
    }
  }




@keyframes open-elem-anim {
    0% { 
      transform: scale(3);
    }
    100% { 
      transform: scale(1.1);
    }
  }


@-webkit-keyframes Orbita{0%{-webkit-transform:scale(1.1) rotate(0deg) translateX(10px) rotate(0deg);transform:scale(1.1) rotate(0deg) translateX(10px) rotate(0deg)}to{-webkit-transform:scale(1.1) rotate(1turn) translateX(10px) rotate(-1turn);transform:scale(1.1) rotate(1turn) translateX(10px) rotate(-1turn)}}
@keyframes Orbita{0%{-webkit-transform:scale(1.1) rotate(0deg) translateX(10px) rotate(0deg);transform:scale(1.1) rotate(0deg) translateX(10px) rotate(0deg)}to{-webkit-transform:scale(1.1) rotate(1turn) translateX(10px) rotate(-1turn);transform:scale(1.1) rotate(1turn) translateX(10px) rotate(-1turn)}}