html {
  overflow-y:scroll;
  /* IE, Edge 対応 */
  -ms-overflow-style: none;
  /* Firefox 対応 */
  scrollbar-width: none;
}
/* Chrome, Safari 対応 */
html::-webkit-scrollbar {
  display:none;
}
body {
  background-color: #f0f8ff;
  font-family     : "Helvetica Neue", "Arial", "Mangl";
  color           : rgba(105,105,105,0.98);
}
#add {
  position: relative;
  text-align:center;
  top: 45px; /* 上から*/
}
h2#add {
  font-family: 'Gochi Hand', 'cursive';
  font-size: 90px;
  color: #0069d9
}
p#add {
  font-size: 18px;
}
.sp {
  display: none;
}
.right {
  text-align: right;
  margin-bottom: 0rem;
}

/* スマホ用css 横幅480px以下に適用 */
@media screen and (max-width: 480px) {
.pcview {
   display: none;
  }
.sp {
   display: block;
  }
.hide-off-sp {
   display: none;
  }
.hide-on-pc {
   display: none;
  }
.hide-sp {
   display: none;
  }
  }
/* タブレット用css 横幅481pxから1024pxに適用 */
@media (min-width: 481px) and (max-width: 1024px) {
.hide-off-tb {
   display: none;
  }
.hide-on-pc {
   display: none;
  }
  }
/* PC用css 横幅1024px以上に適用 */
@media screen and (min-width: 1025px) {
.hide-off-tb {
    display: none;
  }
.hide-off-sp {
    display: none;
  }
p {
    font-size: 1rem;
    font-weight: 65;
  }
li {
    font-size: 1rem;
    font-weight: 65;
  }
  }
  /* スマホ用hidecss 横幅767px以下に適用 */
@media screen and (max-width: 767px) {
.hide-sp {
  display: none;
  }
  }
/* PCタブレット両css 横幅768px以上に適用 */
@media screen and (min-width: 768px) {
.hide-tbpc {
   display: none;
  }
  }
/*Portrait（画面縦）*/
/*@media screen and (device-width: 768px) and (device-height: 1024px)  {
  li#list2 {
  padding-left: 6.62em;
}
/*Landscape（画面横）*/
/*@media screen and (device-width: 1024px) and (device-height: 768px)  {
  li#list2 {
  padding-left: 6.62em;
}*/

@media screen and (max-width:480px){
h2#add {
    font-size: 60px;
}
p#add {
  font-size: 16px;
}
}
h1#section3{
  padding-top  : 2rem;
  margin-bottom: 2rem;
  font-size: 20px;
}
h5#section3{
  padding-top  : 2rem;
  margin-bottom: 2rem;
}
@media screen and (max-width:480px){
h2#add {
    font-size: 60px;
}
p#add {
  font-size: 16px;
}
}
p#weight {
  text-transform: uppercase;
  /*font-weight: bold;*/
}
h1 {
  /*線の種類（実線） 太さ 色*/
  border-bottom: solid 2px rgba(105,105,105,0.5);
  padding-bottom: 10px;
}
h5#section2 {
  /*線の種類（実線） 太さ 色*/
  border-bottom: solid 2px rgba(105,105,105,0.5);
  padding-bottom: 10px;
}
.sub-headline {
  margin-top: 2em;
  margin-left: 0.2em;
  padding: 0em 0.5em;/*上下 左右の余白*/
  border-left: solid 5px #0069d9CC;
  background: transparent;/*背景透明に*/
  /*font-size: 1em;*/
  line-height: 1.2;
}
.under {
  margin-bottom: 0;
}
@charset "utf-8";
.container {
  width: 50%;
  /*background: #FFF;*/
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 100px;
  /*background-color: #5796d9;*/
}
@media screen and (max-width:1920px){
  .container {
    width: 55%;
}
}
@media screen and (max-width:1024px){
  .container {
    width: 90%;
}
}
@media screen and (max-width:480px){
  .container {
    width: 90%;
}
}
@media screen and (max-width:1024px){
h1#section3{
  font-size: 18px;
}
}
@media screen and (max-width:480px){
h1#section3{
  font-size: 17px;
}
}
@media screen and (max-width:1024px){
h5#section1, #section2, #section3, #section4, #section5{
  font-size: 18px;
}
}
@media screen and (max-width:480px){
h5#section1, #section2, #section3, #section4, #section5{
  font-size: 17px;
}
}

div.box {
  width: 100%;
  position: absolute;
  padding: 0.5em 1em;
  /*margin: 2em 0;*/
  background: #FFF;
  border: solid 1px #dcdcdc;/*線*/
  border-radius: 6px;/*角の丸み*/
  box-shadow: 1px 1px 2px 0px #d3d3d3 inset;
  height: 42px;
}
div.btn {
  position: relative;
  top: -10px; /* 上から*/
  left: 340px; /* 左から*/
}
@media screen and (max-width:1024px){
  div.btn {
  top: -10px; /* 上から*/
  left: 110px; /* 左から*/
}
}
@media screen and (max-width:768px){
  div.btn {
  top: -10px; /* 上から*/
  left: 80px; /* 左から*/
}
}
@media screen and (max-width:480px){
  div.btn {
    top: -10px; /* 上から*/
    left: 40px; /* 左から*/
}
}
input.btn-primary {
  width: 75px;
}
p {
  text-align: justify;
  text-justify:inter-word;
  line-height: 1.8;
}

li {
  list-style: none;
  padding-left: 1em;
  line-height: 1.8;
  }
li#list2 {
  /*text-indent: -10em;*/
  padding-left: 6.62em;
  }
  li#list3 {
  list-style: none;
    /*text-indent: -10em;*/
  padding-left: 2.8em;
  }
li#list4 {
  list-style: none;
  /*text-indent: -10em;*/
  padding-left: 3em;
  }
li#list5 {
  list-style: none;
  /*text-indent: -10em;*/
  padding-left: 5em;
  }
li#list6 {
  list-style: none;
  /*text-indent: -10em;*/
  padding-left: 34px;
  }
@media screen and (max-width: 480px) {
  li {
    font-size: 15px;
    text-align: left;
    padding-left: 0em;
  }
  .lig1 {
    text-indent: 0px;
    padding-left: 20px;
  }
  .illustration {
  	width: 100%;
    height:100%;
  }
  li#list2 {
    padding-left: 0em;
  }
  li#list3 {
    padding-left: 0em;
  }
  li#list4 {
    padding-left: 2em;
  }
  li#list5 {
    padding-left: 3em;
  }
  li#list6 {
    padding-left: 16px;
  }
  }

@media screen and (min-width: 481px) and (max-width: 768px) {
  li {
  padding-left: 2em;
  }
  li#list2 {
  padding-left: 2em;
  }
  li#list3 {
  padding-left: 6.5em;
  }
  li#list4 {
  padding-left: 66px;
  }li#list6 {
  padding-left: 50px;
  }
  }

@media screen and (min-width: 769px) {
  li#list2 {
    padding-left: 2em;
    }
  li#list3 {
    padding-left: 6.5em;
    }
  }





@media screen and (max-width:480px){
p {
    font-size: 15px;
    text-justify:none;
    text-align: left;
}
a {
  color: rgba(0,105,217,0.5);
}
a:hover {
  text-decoration: none;
}
}
img {
  pointer-events: none;
}

/*twitter follow icon*/
.btn-social-icon-twitter {
text-decoration: none;
display: inline-block;
text-align: center;
font-size: 30px;
text-decoration: none;
color: inherit;
}
@media screen and (max-width:480px){
.btn-social-icon-twitter {
font-size: 26px;
}
}
.btn-social-icon-twitter:hover {
color: #1da1f3;
transition: .5s;
}
#footer {
  text-decoration: none;
	color           : rgba(128,128,128,0.98);
	justify-content: center;
  text-align: center;
}
@media screen and (max-width:480px){
#footer {
  font-size       : 14px;
}
}
.text-decoration {
  text-decoration: none;
  color: inherit;
}
.copyright {
  text-decoration: none;
  color: inherit;
  text-align: center;
}
.text-decoration-right {
  text-decoration: none;
  color: inherit;
  text-align: right;
}
/* スマホ用画像サイズ指定 横幅767px以下に適用 */
@media screen and (max-width: 767px) {
img {
width: 99%;
}
}

a  {
color: rgba(0,105,217,0.8);
}
a:hover {
text-decoration: none;
color: rgba(0,105,217,0.6);
}

.str {
background: linear-gradient(transparent 90%, rgba(0,105,217,0.6) 90%);
/*color: #87CEFA;*/
/*text-decoration: underline;*/
}
/*background-color: #5796d9; 位置調査用*/

/* この他に Bootstrap4 のCSSも読み込む */