@charset "utf-8";

/*Howto
---------------------------------------------------*/
.sectionHowto{
  background: #e7f5fd;
  font-size: 14px;
}
.sectionHowto .sectionTitle1 {
  background: #009fec;
}
.sectionHowto .sectionTitle1 a {
  background: url(/sp/kazashite-bokin/img/201802/howto_ttl_open.gif) 96% center no-repeat;
  background-size: 7%;
}
.sectionHowto .sectionTitle1 a.active {
  background: url(/sp/kazashite-bokin/img/201802/howto_ttl_close.gif) 96% center no-repeat;
  background-size: 7%;
}
.sectionHowto .sectionTitle1 img {
  width:85%;
  vertical-align:middle;
}
.sectionHowto_wrap {
  padding-top: 15px;
  background: #e7f5fd;
}
.sectionHowto_wrap .txt {
  width: 87.7%;
  margin: 0 auto 10px auto;
  line-height: 1.5;
  font-size: 15px;
}
.sectionHowto_wrap .txtLast{
  margin-bottom: 25px;
}
.sectionHowto_wrap span {
  font-weight: bold;
}

.sectionHowto .sectionreport {
  background-color: #fff;
}
.sectionHowto .sectionreport .contents_box {
  background: #fff none repeat scroll 0 0;
  padding: 0 2%;
  width: 96%;
}
.sectionHowto .sectionreport .img1 {
  float: left;
  padding: 0 0 15px 0;
  width: 42%;
}
.sectionHowto .sectionreport .text1 {
  font-size: 16px;
  float: left;
  padding: 5px 3% 15px;
  width: 52%;
}
.sectionHowto .sectionreport .text2 {
    text-align: right;
    font-size: 13px;
    margin: 5px 2% 10px;
}

.mb15 {
  margin-bottom: 15px;
}
.pb15 {
  padding-bottom: 15px;
}
.sns_area {
  width: 92%;
  margin: 0 4%;
}
.sns_area a {
  display: inline-block;
}
.sns_area img {
  height: 21px!important;
}

.credit {
  font-size: 9px;
  margin: 2% 5% 5%;
}

/*youtube responsive
---------------------------------------------------*/

.youtube-area {
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}

.youtube-area iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}