@charset "utf-8";

/* =====================
chapter3 page style
===================== */


.con_body_block{
  padding-bottom: 20px;
}

[data-page-category="kinki"] .con_body_block{
  background-color: #EBF4E2;
}

[data-page-category="kanto"] .con_body_block{
  background-color: #D1E9DD;
}

.sec_a{
  color: #009D3B;
}

.sec_list{
  color: #EB6D4E;
}
.sec_list::after{
  background: #F3D8D1;
}





/* section1 */

.sec1{
  padding-bottom: 20px;
}

.sec1 .sec_a{
  margin-top: 10px;
}

.sec1 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec1 .sec_inner_1 img{
  margin-top: 10px;
}

.sec1 .sec_inner_1{
  width: 390px;
}
.sec1 .sec_inner_2{
  width: 212px;
  padding-top: 150px;
}
[data-page-category="kanto"] .sec1 .sec_inner_2{
}

.sec1 .sec_inner_2 p{
  padding-top: 20px;
}

.sec1_img2{
  position: absolute;
  width: 103px;
  top: -20px;
  right: 75px;
}

/* section2 */

.sec2{
  padding-bottom: 20px;
}

.sec2 .sec_a{
  margin-top: 10px;
}

.sec2 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec2 .sec_inner_1{
  width: 202px;
  padding-top: 23px;
}

.sec2 .sec_inner_1 img{
  margin-bottom: 10px;
}

.sec2_img1{
  position: absolute;
  bottom: 42px;
  right: 20px;
}

.sec2_img2{
  position: absolute;
  bottom: 30px;
  left: 250px;
}

[data-page-category="kanto"] .sec2_img2{
      position: absolute;
    bottom: 9px;
    left: 250px;
}

/* section3 */

.sec3::before{
  top: 103px;
}

.sec3 .sec_a{
  margin-top: 10px;
}

.sec3 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec3 .sec_inner_1{
  width: 143px;
  padding: 20px 0 20px 30px;
}

.sec3_img1{
  position: absolute;
  top: 20px;
  right: 20px;
} 

.sec3_img2{
  position: absolute;
  width: 180px;
  bottom: 9px;
  right: 242px;
}

.sec3_btn{
  position: absolute;
  bottom: -20px;
  right: -20px;
}
.sec3_btn:hover{
  opacity: 0.7;
}

/* section4 */

.sec4{
  padding-bottom: 20px;
}

.sec4 .sec_a{
  margin-top: 10px;
}

.sec4 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec4 .sec_inner_1{
  width: 310px;
}

.sec4 .sec_inner_1 p{
  width: 246px;
  padding-left: 30px;
  margin-top: 15px;
}


.con_body_block_bnr a{
  display: block;
  width: 543px;
  margin: 0 auto;
  margin-top: 36px;
  margin-bottom: 36px;
}
.con_body_block_bnr a:hover{
  opacity: 0.7;
}

/* section5 */

.sec5{
  padding-bottom: 20px;
}

.sec5 .sec_a{
  margin-top: 10px;
}

.sec5 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec5 .sec_inner_1{
  width: 244px;
  padding-top: 10px;
}

.sec5 .sec_inner_2{
  width: 271px;
}

.sec5 .sec_inner_2 img{
  padding-top: 10px;
}
.sec5 .sec_inner_2 p{
  padding-top: 10px;
}

.sec5_img3{
  position: absolute;
  top: -10px;
  right: -10px;
}

/* section6 */

.sec6{
  padding-bottom: 20px;
}

.sec6 .sec_a{
  margin-top: 10px;
}

.sec6 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec6 .sec_inner + p{
  padding-top: 15px;
}

.sec6 .sec_inner_1{
  width: 300px;
}

.sec6_img1{
  padding-top: 10px;
}
[data-page-category="kanto"] .sec6_img1{
  margin-left: -20px;
}

.sec6_img2{
  padding-top: 20px;
  padding-left: 40px;
  width: 240px;
}

/* section7 */

.sec7{
  padding-bottom: 20px;
}

.sec7 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec7 .sec_inner_1{
  width: 293px;
}

.sec7 .sec_inner + p{
  padding-top: 20px;
}

.sec7 .sec_inner_2 img{
  margin-top: -48px;
  margin-right: -40px;
}

/* section8 */

.sec8{
  padding-bottom: 20px;
}

.sec8 .sec_inner{
  display: flex;
  justify-content: space-between;
}

.sec8 .sec_inner_1{
  width: 249px;
  padding-top: 20px;
}

.sec8 .sec_inner_2{
  width: 294px;
  padding-top: 20px;
}

.sec8 .sec_inner_2 img{
  width: 225px;
  margin-left: 98px;
  padding-top: 10px;
}

.sec8_img2{
  position: absolute;
  right: -20px;
  bottom: -20px;
}

/* section9 */

.sec9 .sec_q{
}

.sec9 .sec_a{
}

.sec9 .sec_inner{
  display: flex;
}

.sec9 .sec_inner_1{
  width: 276px;
  padding-top: 20px;
}

.sec9 .sec_inner_1 img{
}
.sec9 .sec_inner_1 p{
  padding-top: 30px;
}

.sec9 .sec_inner_2{
}

.sec9_img1{
  position: absolute;
  bottom: -15px;
  right: -27px;
}

/* footer block */

.con_footer_block{
  margin-top: -20px;
  padding-bottom: 420px;
  background: url(../img/chapter3/pc/c3_ft_bar_k.png) bottom center no-repeat;
}

[data-page-category="kanto"] .con_footer_block{
  background: url(../img/chapter3/pc/c3_ft_bar_s.png) bottom center no-repeat;
}

.ft_voice{
  background: #EBF4E2;
}
.ft_voice.tail1::before,
.ft_voice.tail2::before{
  border-left: 16px solid #EBF4E2;
  border-top: 16px solid #EBF4E2;
}

.ft_voice span{
  color: #009D3B;
}

.voice1{
  top: 60px;
  right: 95px;
}

.voice1.tail1::before{
  left: 160px;
}
.voice1.tail1::after{
  left: 148px;
}

.voice2{
  width: 230px;
  top: 120px;
  left: 175px;
}
.voice2.tail2::before{
  left: 60px;
}
.voice2.tail2::after{
  left: 72px;
}

.voice3{
  top: 220px;
  right: 80px;
}
.voice3.tail1::before{
  left: 60px;
}
.voice3.tail1::after{
  left: 48px;
}

.voice4{
  top: 240px;
  left: 124px;
}

.ft_bird{
  position: absolute;
  top: 117px;
  left: 15px;
}
[data-page-category="kanto"] 
.ft_bird{
  position: absolute;
  top: 279px;
  left: 49px;
}

.voice5{
  top: 430px;
  left: 384px;
}
.voice5.tail1::before{
  left: 200px;
}
.voice5.tail1::after{
  left: 188px;
}

.voice6{
  top: 400px;
  left: 88px;
}
.voice6.tail2::before{
  left: 60px;
}
.voice6.tail2::after{
  left: 72px;
}

.ft_clock{
  position: absolute;
  top: 300px;
  left: 10px;
}

.ft_light{
  position: absolute;
  top: 340px;
  right: 160px;
}

.ft_rv{
  position: absolute;
  top: 45px;
  right: 0;
}