@charset "UTF-8";

/*reset/////////////////////////////////////////////////*/
.displayPc{display: none;}/*モバイルでは非表示*/

html,body{height: 100%;}

#Content{
  width:100%;
  max-width: 1290px;
  min-height: 100%;
}
.contentsBG {
    padding: 0 6% 4% 6%;
}
.wrap{
  width:100%;
}

section ul{
  padding: 10px 0;
}
section li{
  text-indent: 2rem;
}
section img{
  width: 100%;
  max-width: 640px;
  height: auto;
  margin-bottom: 5px;
  margin-right: 5px;
}

/*独自見出し*/
#helpTitle{
  width: 100%;
    margin: 0;
    padding: 7px;
    color: #ffffff;
    background: linear-gradient(to bottom,#5a78dd,#394f9b);
    text-shadow: #1d337a 1px 1px 1px;
    border-bottom: 1px solid #3a70bf;
    text-align: center;
    line-height: 1.4em;
    font-weight: bold;
    font-size: 1.2rem;
}

h1 {
    margin: 0px auto 10px auto;
    color: #446dd4;
    font-size: 1.5rem;
    background: linear-gradient(to right, rgba(30,87,153,0) 0%,rgb(228, 245, 255) 30%,rgb(228, 245, 255) 70%,rgba(125,185,232,0) 100%);
    text-shadow: 1px 1px 1px #fff;
    border-bottom: none;
}

.accordion label, .introductory{
  text-shadow: 1px 1px 1px #fff;
}
.introductory,section p{
  line-height: 1.4rem;
}
.introductory{
  width: 100%;
  margin:1% auto 2% auto;
  padding: 15px;
  font-size: 0.9rem;
  border-radius: 10px;
  border: 1px solid #e5f6ff;
  background: linear-gradient(#f6faff,#d1e7ff);
  box-shadow:5px 5px 5px -5px #a2b6e6;
}

/*PageTopボタン*/
#PageTopBtn{
  width: 100%;
  text-align:right;
  margin: 10px auto;
  padding: 10px 0;
  position: relative;
}
#PageTopBtn a{
  text-decoration: none;
  color: #ff5466;
  font-weight: bold;
}
#PageTopBtn::before {
  position: absolute;
  content: "";
  border-top: 4px solid #ffc4ca;
  border-right: 4px solid #ffc4ca;
  width: 12px;
  height: 12px;
  transform: rotate(-45deg);
  top: 40%;
  margin: 0 0 0 -19px;
  right: 5.5rem;
}

/*pager/////////////////////////////////////////////////*/
#pager{
  display: flex;
  justify-content: center;
  margin: 2rem auto;
}
#pager p:last-child{
  margin-right: 0;
}
#pager p a{
  padding: 10px;
  font-size: 1em;
  border-radius: 5px;
  border: 1px solid #fafdff;
  background: linear-gradient(#f6faff,#d1e7ff);
  box-shadow: 0px 4px 7px -6px #a2b6e6;
  text-shadow: 1px 1px 1px #fff;
  margin-right: 3px;
  line-height: 1.2em;
  width: 7rem;
  display:block;
  color:#040000;
  text-decoration: none;
}
#pager p.prev a{
  padding-left: 30px;
}
#pager p.prev::before,#pager p.next::after{
  position: absolute;
  content: "";
  border-top: 2px solid #839aff;
  border-right: 2px solid #839aff;
  width: 10px;
  height: 10px;
}
#pager .prev a::before{
  content: "\524D\30DA\30FC\30B8";
}
#pager .next a::before{
  content: "\6B21\30DA\30FC\30B8";
}
#pager .list a::after{
  content: "\30EA\30B9\30C8";
}
#pager p.prev::before {
    transform: rotate(-135deg);
        margin: 15px 0 0 10px;
}
#pager p.next::after {
    transform: rotate(45deg);
        margin: -25px 0 0 5.5rem;
}
.prevNon,.nextNon{
  visibility:hidden;
}

/*モバイル縦持ち（幅414px以下）/////////////////////////////////////////////////*/
@media screen and (max-width: 414px){
  /*menu*/
  #sideBar{
    left: -100%;
    width: 100%;
  }

  #menuBackground{
    display: none;
  }
  #menuCb:checked ~ #sideBar{
    transform: translate(100%);
  }

  #menuBtn img,#closeBtn img{
    height: 6%;
    display: block;
  }

.targetBox:last-child{
border-bottom: 2px solid #90c1ff;
}

}

/*PC（幅1025px以上）----------------------------*/
@media screen and (min-width: 1025px){
  .displayPc{
    display: block;
  }

  #menuBtn,#closeBtn{
    display: none;
  }

  #Content{
    display:flex;
  }
  #sideBar{
    flex: 0 0 300px;
    position: static;
  }
  #mainContent img:first-child{
    width: calc(100% + 8.4%);
    margin: -4.2% 0px 0px -4.2%;
  }
  .accordion li:hover{
    background: linear-gradient(#e3fbff,#bbe7ff);
  }
  section img{
    max-width: 640px;
  }
}
/*スマホ縦----------------------------*/
@media screen and (max-width: 559px) {
  section img{
    width: 100%!important;
  }
}