@charset "utf-8";
/* CSS Document */

#help_wrap{
    position: relative;
    top: -912px;
    height: 915px;
    width: 100%;
    background: rgba(255,255,255,0.95);
}

.wrapper{ background-color: rgba(255,255,255,0.7);}

.contentArea{
 width: 1180px;
 height: 760px;
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 margin: auto;
 box-shadow: 0 0 15px rgba(131,132,150,0.3);
 background-color: #fff;
 text-align: center;
 padding-top: 63px;
 box-sizing: border-box;
}


/*閉じるボタン*/
.contentArea .closeBtn{
 display: block;
 width: 160px;
 height: 46px;
 line-height: 46px;
 box-sizing: border-box;
 background: url("../images/icon_close.gif") no-repeat left 49px top 16px #ccc;
 border-bottom: 2px solid #c0c0c0;
 text-align: center;
 text-indent: 23px;
 font-size: 1.4rem;
 color: #fff;
 position: absolute;
 top: 33px;
 right: 41px;
 outline: none;
}


/*タイトル*/
.contentArea h1{
 font-size: 2.4rem;
 font-weight: normal;
 margin-bottom: 50px;
 color: #444;
}


/*スライダー部分*/
.helpSlider{
 width: 928px;
 padding-bottom: 60px;
 margin: 0 auto 25px;
}
.slick-slide{ outline: none;}

/*sliderの前へ次へボタン*/
.helpSlider .prevArrow,
.helpSlider .nextArrow{
 width: 120px;
 height: 40px;
 line-height: 40px;
 border-radius: 20px;
 text-align: center;
 background-color: #ff4a57;
 border-bottom: 2px solid #e34954;
 color: #fff;
 font-size: 1.4rem;
 position: absolute;
 bottom: 0;
 cursor: pointer;
 box-sizing: border-box;
 z-index: 1;
}
.helpSlider .prevArrow{ left: calc(50% - 186px);}
.helpSlider .nextArrow{ right: calc(50% - 186px);}
.helpSlider .prevArrow.slick-disabled,
.helpSlider .nextArrow.slick-disabled{
 background-color: #ccc;
 border-bottom: 2px solid #c0c0c0;
 cursor: default;
}

/*sliderの下側ドット*/
.slick-dots{
 position: absolute;
 bottom: 16px;
 left: calc(50% - 66px);
 display: flex;
 justify-content: center;
 align-items: center;
 width: 132px;
}
.slick-dots li{
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background-color: #d6d6d6;
 pointer-events: none;
}
.slick-dots li:not(:last-of-type){ margin-right: 6px;}
.slick-dots li.slick-active{ background-color: #ff4a57;}
.slick-dots li button{
 opacity: 0;
 visibility: hidden;
}


/*下にある説明文*/
.contentArea .bottomText{
 text-align: left;
 display: inline-block;
 font-size: 1.2rem;
 line-height: 2rem;
 color: #a9a9a9;
}
.contentArea .bottomText span{ color: #ff4a57;}