@charset "UTF-8";

body {}



p {

  margin-top: 0;

}



article {

  clear: both;

}



section {

  background: #fff;

  margin: 0 auto;

}



.inner {

  box-sizing: border-box;

  margin: 0 auto;

  padding: 0 0 70px;

  width: 800px;

}



h1 {

  margin: 0;

}



h2 {

  color: #737373;

  font-size: 180%;

  font-weight: 600;

  margin: auto auto 30px;

  text-align: center;

}



h3 br {

  display: none;

}



.normal_box {

  box-sizing: border-box;

  border: solid 1px #24ade3;

  padding: 15px 20px;

  margin-bottom: 20px;

}



@media screen and (max-width: 800px) {

  h2 {

    font-size: 6vw;

  }

  h3 br {

    display: block !important;

  }

  section p br {

    display: none;

  }

  section {

    width: 100%;

  }

  .inner {

    width: 100%;

    padding: 0 5% 80px;

  }

}





/* 内容紹介



   ========================================================================== */



.contents .inner {

  padding-top: 20px;

}



.book_txt {

  padding-bottom: 30px !important;

}



.dl_btn a {

  display: block;

  border-radius: 5px;

  color: #fff;

  font-weight: 600;

  text-decoration: none;

  text-align: center;

  margin: auto;

  padding: 10px;

  width: 50%;

}



.dl_btn a:hover {

  opacity: 0.8;

  transition: 0.3s;

  cursor: pointer;

}



.dl_btn .pdf {

  background: #c80a0a;

  background: #ed9226;

}



@media screen and (max-width: 800px) {

  .dl_btn a {

    width: 80%;

  }

}





/* 立ち読み用無料公開



   ========================================================================== */



.bwing_box {

  background: #949494;

}



.bwing_box .inner {

  padding-top: 20px;

  padding-bottom: 50px;

}



.bwing_box h2 {

  color: #fff;

}



.bwing_box p {

  color: #fff;

  text-align: center;

}



@media screen and (max-width: 800px) {

  .bwing_box p {

    text-align: left;

  }

}





/*  お申込み



   ========================================================================== */



.application {

  text-align: center;

}



.app_day3 {

  background: #fdfadb;

}



.application .inner {

  padding-bottom: 40px;

}



.app_img {

  display: block;

  margin: auto auto 30px;

  width: 100%;

}



.app_txt {

  font-size: 110%;

  font-weight: 600;

  margin-bottom: 30px;

  text-align: center;

}



.present_box {

  box-sizing: border-box;

  background: #fff;

  margin: 10px auto 20px;

  padding: 10px;

  text-align: center;

  width: 100%;

}



.present_box dt {

  color: #583231;

  ;

  font-size: 150%;

  font-weight: 600;

}



.present_box dd {

  display: inline-block;

  color: #583231;

  font-size: 150%;

  font-weight: 600;

  margin: auto auto 20px;

  padding: 0 5px;

  display: inline;

  background: linear-gradient(transparent 50%, #ff0 0%);

}



.pre_list {

  font-size: 90%;

  text-align: center;

}



.decimal {

  list-style-position: inside !important;

  margin: 0 auto 30px;

  padding: 0;

}



.appli {

  color: #f00;

  font-weight: 600;

  font-size: 150%;

  margin-bottom: 5px;

  text-align: center;

  line-height: 1.5;

}



.appli:after {

  display: block;

  content: "▼";

  font-size: 200%;

  transform: scale(3, 0.7);

  -moz-transform: scale(3, 0.7);

  -webkit-transform: scale(3, 0.7);

  line-height: 1;

  margin: -5px auto 0;

  width: 23.333333333%;

}



.amazon_btn {

  list-style: none;

  overflow: hidden;

  padding: 0;

}



.amazon_btn li {

  box-sizing: border-box;

  float: left;

  margin: 0 1% 1% 0;

  width: 49.5%;

}



.amazon_btn li:nth-of-type(even) {

  margin-right: 0;

}



.amazon_btn a {

  box-sizing: border-box;

  display: block;

  background: #fbc98b;

  border: solid 1px #9b5807;

  border-radius: 7px;

  padding: 15px 10px 2px;

  text-align: center;

}



.amazon_btn img {

  width: 50%;

}



.amazon_btn a:hover {

  opacity: 0.7;

  transition: 0.3s;

}



.quiz_box {

  box-sizing: border-box;

  background: #fff;

  border: solid 2px #583231;

  margin: 30px auto 40px;

  text-align: center;

  padding: 10px;

}



.quiz_box p {

  margin-bottom: 0;

}



.quiz_box .qttl {

  color: #583231;

  font-weight: 600;

}



.sample {

  text-align: center;

  display: block;

}



.sample ul {

  padding-left: 0;

  list-style: none;

  display: inline-block;

}



.sample ul li {

  font-size: 90%;

  text-align: left;

  margin-left: 1em;

  text-indent: -1em;

}



@media print, screen and (max-width: 800px) {

  .amazon_btn img {

    width: 60%;

  }

  .application {

    text-align: left;

  }

  .app_img {

    width: 100%;

  }

  .app_txt {

    text-align: left;

  }

  .present_box {

    width: 100%;

    padding: 10px;

  }

  .present_box dt {

    font-size: 110%;

  }

  .present_box dd {

    font-size: 110%;

  }

  .pre_list {

    text-align: left;

  }

  .amazon_btn li {

    float: none;

    padding: 0 0 10px;

    width: 100%;

  }

  .quiz_box {

    text-align: left;

  }

  .quiz_box .qttl {

    text-align: center;

  }

}





/* form



   ========================================================================== */



.form_box {

  /*background: #fffeee;*/

  background: #f9f2e1;

  color: #333;

}



.form_box h2 {

  color: #883732;

}



.form_box .inner {

  padding-top: 30px;

  padding-bottom: 30px;

}



.form {

  width: 100%;

}



.form th {

  display: block;

  width: 100%;

  margin: 0 0 5px;

  padding: 0;

  text-align: left;

}



.form td {

  display: block;

  width: 100%;

  margin: 0 0 20px;

  padding: 0;

  font-weight: 600;

}



input {

  box-sizing: border-box;

  border: solid 1px #ccc;

  border-radius: 5px;

  width: 100%;

  padding: 10px;

  line-height: 1.5;

  -webkit-appearance: none;

  margin-top: 5px;

}



.form input::-webkit-input-placeholder {

  color: #ccc;

  font-weight: normal;

}



.form input:-ms-input-placeholder {

  color: #ccc;

  font-weight: normal;

}



.form input::-moz-placeholder {

  color: #ccc;

  font-weight: normal;

}



.submit {

  display: block;

  background: #883732;

  border-radius: 5px;

  border: none;

  color: #fff;

  font-size: 150%;

  font-weight: 600;

  padding: 20px;

  margin: auto auto 30px;

  width: 100%;

  -webkit-font-smoothing: antialiased;

}



.submit:hover {

  cursor: pointer;

  opacity: 0.7;

  transition: 0.3s;

}



@media screen and (max-width: 800px) {

  .form_box br {

    display: none;

  }

  .form_box h2 {

    text-align: center;

  }

  .form_book {

    float: none;

    display: block;

    width: 50%;

    margin: auto auto 20px;

  }

  .form_left {

    width: 100%;

  }

  .submit {

    padding: 20px 5px;

  }

}





/* profile



   ========================================================================== */



.profile_box .inner {

  padding-top: 30px;

  font-size: 90%;

}



.pro_author {

  font-size: 120%;

  font-weight: 600;

  margin-bottom: 10px;

}



.pro_img {

  width: 300px;

  display: block;

  float: right;

  margin: 0 0 20px 20px;

}



@media screen and (max-width: 800px) {

  .profile_box .inner {

    font-size: 90%;

  }

  .pro_author {

    font-size: 120%;

    text-align: center;

  }

  .pro_txt {

    padding-right: 0;

  }

  .pro_img {

    width: 50%;

    float: none;

    margin: auto auto 30px;

    text-align: center;

  }

}





/* 書籍詳細



   ========================================================================== */



.shoseki_box .inner {

  padding-bottom: 40px;

}



.shoseki_box h2 {

  text-align: center;

}



.sho_all {

  overflow: hidden;

  margin-bottom: 20px;

}



.sho_left {

  box-sizing: border-box;

  width: 25%;

  margin-right: 3%;

  display: inline-block;

}



.sho_book {

  width: 100%;

  border: solid 1px #ccc;

}



.buy_button a {

  box-sizing: border-box;

  display: block;

  background: #ed9226;

  border-radius: 5px;

  color: #fff;

  font-size: 110%;

  font-weight: 600;

  padding: 15px;

  margin: 0 auto;

  text-align: center;

  text-decoration: none;

  position: relative;

  -webkit-font-smoothing: antialiased;

}



.buy_button a:hover {

  opacity: 0.7;

  transition: 0.3s;

}



.sho_right {

  display: inline-block;

  text-align: left;

  vertical-align: top;

  margin-top: -3%;

}



.shoseki_box h3 {

  margin-bottom: 10px !important;

}



.shoseki_box span {

  font-size: 80%;

}



.sho_index {

  margin-bottom: 3px !important;

}



.sho_list {

  list-style: none;

  margin: 0;

  padding: 0;

}



.sho_list li {

  margin-bottom: 2px;

}



.sho_list li:nth-last-child(1) {

  margin-top: 5px

}



.sho_button a {

  box-sizing: border-box;

  display: block;

  background: #883732;

  color: #fff;

  padding: 7px;

  margin: auto;

  text-align: center;

  text-decoration: none;

  position: relative;

  -webkit-font-smoothing: antialiased;

}



.sho_button a:hover {

  opacity: 0.7;

  transition: 0.3s;

}



@media screen and (max-width: 800px) {

  .sho_all {

    margin-bottom: 0;

  }

  .shoseki_box h3 {

    text-align: center;

  }

  .shoseki_box p {

    font-size: 90%;

  }

  .sho_button a {

    font-size: 90%;

    margin: 10px auto auto;

  }

  .sho_left {

    width: 70%;

    margin: auto auto 20px;

    display: block;

  }

  .sho_right {

    display: block;

    margin: auto;

    width: 100%;

  }

  .sho_list {

    list-style: none;

    list-style-position: inside;

    margin: auto auto 20px;

    font-size: 90%;

    padding: 0;

  }

  .sho_list li {

    margin-left: 1em;

    text-indent: -1em;

  }

  .sho_list li:last-child {

    margin: 10px 0 0 0;

    text-indent: 0;

  }

  .buy_button a {

    font-size: 100%;

  }

}





/* youtube



   ========================================================================== */



.sp_tube {

  list-style: none;

  margin: 0;

  padding: 0;

  overflow: hidden;

  display: none;

  ;

}



.sp_tube li {

  width: 32.33333%;

  margin-left: 1%;

  float: left;

}



.sp_tube li:first-child {

  margin-left: 0;

}



.yt {

  position: relative;

  width: 100%;

  padding-top: 56.25%;

}



.yt iframe {

  position: absolute;

  top: 0;

  right: 0;

  width: 100%;

  height: 100%;

}



.yt_video {

  position: absolute;

  width: 100%;

  height: auto;

  top: 0;

}



.yt_video img {

  width: 100%;

  height: auto;

}



.yt_video::before {

  position: absolute;

  background: #333;

  border-radius: 8px;

  content: "▶︎";

  font-weight: 600;

  color: #fff;

  font-size: 150%;

  top: 50%;

  left: 50%;

  padding: 2px 20px;

  transform: translate(-50%, -50%);

  opacity: .90;

  transition: .5s;

}



.yt_video img:hover {

  cursor: pointer;

  width: 100%;

  height: auto;

  box-sizing: border-box;

}



.yt_video:hover::before {

  background: #f00;

  color: #fff;

  transition: 0.5s;

}



@media screen and (max-width: 800px) {

  .sp_tube {

    display: block;

    list-style: none;

    margin: 0;

    padding: 0;

    overflow: hidden;

  }

  .sp_tube li {

    width: 100%;

    margin: 0 0 20px;

    float: none;

  }

}