@charset "UTF-8";
/*===========
body
============*/
@media screen and (orientation: landscape) {/* 横向きの場合のスタイル*/}
@media screen and (orientation: portrait) {/* 縦向きの場合のスタイル */}

/* html/body
------------------------------------------------- */
html{width: 100%;font-size: 62.5%;-webkit-font-smoothing: antialiased;}

@media only screen and (max-width:750px){
html {overflow-x: hidden;}
}
body {
font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
font-size: 20px;line-height: 1.8;
position: relative;
width: 100%;
color: #000;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;overflow-x: hidden;position: relative;transition: 0.4s;overflow-x: hidden;box-sizing:border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-ms-box-sizing: border-box;-o-box-sizing: border-box;text-size-adjust: 100%;-webkit-text-size-adjust: 100%;/*Chrome,Safari*/-ms-text-size-adjust: 100%;/*EgdeMobile*/-moz-text-size-adjust: 100%;/*firefox*/
  background: #00b4ed;
}
@media screen and (max-width: 550px) {/*スマホのスタイル*/
body {font-size: 12px;font-size: 1.2rem;}
}
/*STYLE
------------------------------------------------- */
.justify{
text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
text-align-last: left;
}
.justify2{text-align:justify;text-align-last: justify}
@media screen and (max-width:640px){/*スマホ設定*/
.justify,.justify2{
text-align:left;display: inline;text-align-last: left
}
}
@media screen and (max-width: 550px) {/*スマホのスタイル*/

.justify{display: block;
text-align:justify;
  word-break:break-all; 
  text-justify:inter-ideograph;
  text-justify:inter-character;
  word-wrap:break-word;
  overflow-wrap:break-word;
text-align-last: left;
}
.justify2{display: block;text-align:justify;text-align-last: justify}
}


#wrapper {position: relative;max-width: 100%;margin: auto;background: #feec00;width:640px;margin: auto;box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;}
@media screen and (max-width:640px){/*スマホ設定*/
#wrapper {width: 100%}
}

/*header*/
#header{position: relative;}
#header .logo{width: 11%; position: absolute;left: 3%;top: 1.5%}
#header img{width: 100%;height: auto}

#header h2{width: 90%;margin: 20px auto 0}
@media screen and (max-width:767px){/*スマホ設定*/

}
.contents{padding: 0 40px;}
.contents img{width: 100%;height: auto}
.contents li{margin-top: 40px}
.contents .bt{margin-top: 30px}

@media screen and (max-width:767px){/*スマホ設定*/
.contents{padding: 0 20px;}
}
/*===========
inview
===========*/

.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}
.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

#footer{padding: 40px 0 0;font-size: 1rem;}
#footer .address{background: #0068b7;color: #fff;padding: 12px 0;margin-top: 20px; text-align: center}
@media screen and (max-width:767px){/*スマホ設定*/
#footer .coution{text-align: left;padding: 0 20px}
#footer{font-size: 1rem;}
}