@charset "UTF-8";

:root {
  --media_pc: 1680; /* VW計算用 calc(vw / var(--media_pc)) */
  --media_sp: 750;
}

p,span{color:#1e1e1e;}
picture{display:block;}
.img{position:relative;font-size:0;}
p {
  font-family: YakuHanMP,'Zen Old Mincho', serif;
}

.kv-wrap{
  width: 100%;
  margin-top:122px;
}
.kv-wrap{
  display:block;
  position:relative;
}
.kv-wrap .kv-ttl{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%,-50%);
  font-family: "OptimaLTPro-Roman";
  font-size:100px;
  color:#fff;
  white-space: nowrap;
}
.kv-wrap .kv-cap{
  position:absolute;
  bottom:0;
  right:0;
  margin:5px;
  font-size:12px;
  color:#fff;
  text-shadow: 1px 1px 20px #333;
}

.img .cap {
  position: absolute;
  bottom: 0;
  left: 0;
  margin: 5px;
  font-size: 12px;
  color: #fff;
  text-shadow: 1px 1px 20px #333;
  /*font-family: 'Noto Sans JP', sans-serif;*/
}

@media screen and (max-width: 1366px) {
  .kv-wrap{
    margin-top:8.931vw;
  }
  .kv-wrap .kv-ttl{
    font-size:7.321vw;
  }
  .kv-wrap .kv-cap{
    margin:0.366vw;
    font-size:0.878vw;
  }
}

@media screen and (max-width: 768px) {
  .kv-wrap{
    margin-top:16.276vw;
  }
  .kv-wrap .kv-ttl{
    font-size:11.467vw;
  }
  .kv-wrap .kv-cap{
    margin:0.667vw 1.333vw;
    font-size:2.667vw;
  }
  .img .cap {
    font-size: 2.666vw; 
  }
}

.bg_wrap{
  background: url("../img/pick_up_plan/bg_pickupplan_pc.jpg")repeat top center;
  background-size: 100%;
  width:100%;
  padding:85px 0 200px;
}
.intro_wrap{
  text-align: center;
  margin-bottom:70px;
}
.i_ttl{
  font-size:36px;
  line-height: 1.889;
  letter-spacing: 0.13em;
  margin-bottom:10px;
}
.i_txt{
  font-size:18px;
  line-height: 2.833;
  letter-spacing: 0.06em;
}

@media screen and (max-width: 768px) {
  .bg_wrap{
    background: url("../img/pick_up_plan/bg_pickupplan_sp.jpg")repeat top center;
    background-size: 100%;
    padding: calc(100 / var(--media_sp) * 100vw) 0 calc(158 / var(--media_sp) * 100vw);
  }
  .intro_wrap{
    margin-bottom: calc(125 / var(--media_sp) * 100vw);
  }
  .i_ttl{
    font-size: calc(44 / var(--media_sp) * 100vw);
    line-height: 1.832;
    letter-spacing: 0.145em;
    margin-bottom: calc(35 / var(--media_sp) * 100vw);
  }
  .i_txt{
    font-size: calc(26 / var(--media_sp) * 100vw);
    line-height: 2.077;
    letter-spacing: 0.02em;
  }  
}

.plan_wrap{
  width:1260px;
  margin:0 auto;
}
.type_wrap{
  display:flex;
  align-items: flex-end;
  justify-content: space-between;
  border-bottom:1px solid #b39872;
  padding-bottom:20px;
}
.type_wrap *{
  line-height: 1;
}
.typeblk{
  display:flex;
  align-items: flex-end;
}
.type_topblk *{
  font-family: "OptimaLTPro-Roman";
  line-height: 0.6;
}
.typeblk .lar{
  font-weight: normal;
}
.typeblk .type{
  font-size:38px;
  color:#b39872;
  letter-spacing: 0;
}
.typeblk .type .lar{
  font-size:112px;
  letter-spacing: 0.025em;
}
.typeblk .ldk{
  font-size:38px;
  letter-spacing: 0.055em;
  margin:0 0 0 58px;
}
.typeblk .ldk .lar{
  font-size:84px;
  letter-spacing: 0.055em;
}
.area-name{
  font-size:16px;
  line-height:1.5;
  color:#b39872;
  letter-spacing: 0;
}
.area-value{
  font-size:54px;
  line-height:1;
  letter-spacing: 0.06em;
}
.area-value .lar{
  font-size:75.5px;
  line-height:1;
  letter-spacing: 0.06em;
}
.area-value .sml{
  font-size:16px;
  line-height:1;
  letter-spacing: 0;
  margin-left:-3px;
}
.sub_area-value_wrap{
  margin-left:30px;
}
.sub_areablk:nth-child(n+2){
  margin-top:5px;
}
.sub_area-value_wrap .area-name{
  letter-spacing: 0.06em;
}
.sub_area-value_wrap .sub_area-value{
  font-size:16px;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

@media screen and (max-width: 768px) {
  .plan_wrap{
    width:100%;
  }
  .type_wrap{
    width:80.8%;
    margin:0 auto;
    display:block;
    border-bottom:none;
    padding-bottom:0;
  }
  .typeblk{
    width:100%;
    border-bottom: 1px solid #b39872;
    padding-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .type_bottomblk{
    margin-top: calc(10 / var(--media_sp) * 100vw);
  }
  .typeblk .type{
    font-size: calc(32.2 / var(--media_sp) * 100vw);
  }
  .typeblk .type .lar{
    font-size: calc(95.72 / var(--media_sp) * 100vw);
  }
  .typeblk .ldk{
    font-size: calc(32.2 / var(--media_sp) * 100vw);
    margin:0 0 0 auto;
  }
  .typeblk .ldk .lar{
    font-size: calc(71.4 / var(--media_sp) * 100vw);
  }
  .area-name{
    font-size: calc(20 / var(--media_sp) * 100vw);
    line-height:2;
  }
  .area-value{
    font-size: calc(52.3 / var(--media_sp) * 100vw);
    letter-spacing: 0.02em;
  }
  .area-value .lar{
    font-size: calc(72.78 / var(--media_sp) * 100vw);
  }
  .area-value .sml{
    font-size: calc(20 / var(--media_sp) * 100vw);
    line-height:1;
    margin-left: calc(-3 / var(--media_sp) * 100vw);
  }
  .sub_area-value_wrap{
    margin-left:auto;
    margin-bottom: calc(-3 / var(--media_sp) * 100vw);
  }
  .sub_areablk:nth-child(n+2){
    margin-top: calc(0 / var(--media_sp) * 100vw);
  }
  .sub_area-value_wrap .area-name{
    letter-spacing: 0.06em;
    line-height:1.2;
  }
  .sub_area-value_wrap .sub_area-value{
    font-size: calc(20 / var(--media_sp) * 100vw);
  }
}

.fig_wrap{
  width:1260px;
  margin:0 auto;
  position: relative;
}
.fig_wrap .fig_ttl{
  position: absolute;
  top:-26px;
  left:0;
  font-size:36px;
  line-height: 1.444;
  color:#b39872;
  letter-spacing: 0.13em;
}
.fig_wrap .inner_fig_wrap{
  width:510px;
  margin:70px auto 0;
  position: relative;
}
.fig_wrap .inner_fig_wrap .img_line{
  width:598px;
  position: absolute;
  top:274px;
  left:-37px;
}
.fig_wrap .inner_fig_wrap .cap{
  font-size:12px;
  line-height: 1;
  letter-spacing: -0.02em;
  white-space: nowrap;
  margin:15px 0 0 10px;
}
.pointblk{
  width:329px;
  background-color:rgba(170,142,89,.15);
  box-sizing: border-box;
  border-radius: 40px 0 0 0;
  padding:30px 20px 20px;
  position: absolute;
  top:0;
}
.pointblk.pblk02{
  padding-bottom:30px;
}
.pointblk.pblk03{
  padding-bottom:35px;
}
.pointblk.left{
  left:0;
}
.pointblk.right{
  right:0;
}
.pointblk.pblk01{
  top:-10px;
}
.pointblk.pblk02{
  top:119px;
}
.pointblk.pblk03{
  top:715px;
}
.pointblk.pblk04{
  top:368px;
}
.pointblk.pblk05{
  top:792px;
}
.p_enttl{
  width:100%;
  border-bottom:1px solid #aa8e59;
  padding-bottom:9px;
  margin-bottom:13px;
}
.pblk01 .p_enttl img{
  width:81px;
}
.pblk02 .p_enttl img,
.pblk03 .p_enttl img{
  width:82px;
}
.pblk04 .p_enttl img{
  width:221px;
}
.pblk05 .p_enttl img{
  width:70px;
}
.p_intro_txt{
  font-size:18px;
  line-height:1.611;
  margin-bottom:12px;
  letter-spacing: -0.02em;
}
.pblk02 .p_intro_txt{
  margin-bottom:26px;
}
.pblk03 .p_intro_txt{
  margin-bottom:26px;
}
.pblk05 .p_intro_txt{
  margin-bottom:0;
}
.pointblk .img{
  width:134px;
  position: relative;
  float:right;
  margin:7px 0 0 7px;
}
.pointblk.pblk02 .img{
  width:131px;
}
.pointblk.pblk05 .img{
  margin-top:0;
}
.pointblk .img .ico{
  width:56px;
  position: absolute;
  top:-25px;
  right:-10px;
}
.p_ttl{
  font-size:18px;
  line-height:1.297;
  color:#1b3f90;
  margin-bottom:8px;
  letter-spacing: -0.02em;
}
.pblk05 .p_ttl{
  margin:17px 0 5px;
}
.p_ttl.ls15{
  letter-spacing: -0.15em;
}
.p_txt{
  font-size:13px;
  line-height:1.846;
  letter-spacing: 0;
}
.p_cap{
  font-size:10px;
  line-height:1;
  letter-spacing: -0.03em;
  margin-top:5px;
}
.under_txt_wrap{
  margin-top:20px;
}

@media screen and (max-width: 768px) {
  .fig_wrap{
    width:100%;
  }
  .fig_wrap .fig_ttl{
    position: static;
    top:auto;
    left:auto;
    font-size: calc(36 / var(--media_sp) * 100vw);
    text-align: center;
    margin-top: calc(40 / var(--media_sp) * 100vw);
  }
  .fig_wrap .inner_fig_wrap{
    width:76.533%;
    margin: calc(33 / var(--media_sp) * 100vw) auto 0 6.933%;
    position: relative;
  }
  .fig_wrap .inner_fig_wrap .img_line{
    display:none;
  }
  .fig_wrap .inner_fig_wrap .cap{
    font-size: calc(20 / var(--media_sp) * 100vw);
    line-height: 1.631;
    margin: 0 auto 0 8.93%;
    text-align: center;
  }
  .pointblk{
    width:80%;
    margin: calc(40 / var(--media_sp) * 100vw) auto 0;
    border-radius: 10.667vw 0 0 0;
    padding: calc(50 / var(--media_sp) * 100vw) 6.667% calc(40 / var(--media_sp) * 100vw);
    position: static;
    top:auto;
  }
  .pointblk.pblk01{
    margin: calc(110 / var(--media_sp) * 100vw) auto 0;
  }
  .pointblk.pblk02{
    padding-bottom: calc(40 / var(--media_sp) * 100vw);
  }
  .pointblk.pblk03{
    padding-bottom: calc(40 / var(--media_sp) * 100vw);
  }
  .pointblk.left{
    left:auto;
  }
  .pointblk.right{
    right:auto;
  }
  .pointblk.pblk01,
  .pointblk.pblk02,
  .pointblk.pblk03,
  .pointblk.pblk04,
  .pointblk.pblk05{
    top:auto;
  }
  .p_enttl{
    padding-bottom: calc(18 / var(--media_sp) * 100vw);
    margin-bottom: calc(27 / var(--media_sp) * 100vw);
  }
  .pblk01 .p_enttl img{
    width:28.077%;
  }
  .pblk02 .p_enttl img,
  .pblk03 .p_enttl img{
    width:28.462%;
  }
  .pblk04 .p_enttl img{
    width:76.923%;
  }
  .pblk05 .p_enttl img{
    width:24.038%;
  }
  .p_intro_txt{
    font-size: calc(32 / var(--media_sp) * 100vw);
    line-height:1.647;
    margin-bottom: calc(28 / var(--media_sp) * 100vw);
    letter-spacing: -0.03em;
  }
  .pblk02 .p_intro_txt{
    margin-bottom: calc(48 / var(--media_sp) * 100vw);
  }
  .pblk03 .p_intro_txt{
    margin-bottom: calc(48 / var(--media_sp) * 100vw);
  }
  .pblk05 .p_intro_txt{
    margin-bottom:0;
  }
  .pointblk .img{
    width:46.346%;
    margin: calc(12 / var(--media_sp) * 100vw) 0 0 calc(10 / var(--media_sp) * 100vw);
  }
  .pointblk.pblk02 .img{
    width:45.577%;
  }
  .pointblk.pblk05 .img{
    margin-top:0;
  }
  .pointblk .img .ico{
    width: calc(70 / var(--media_sp) * 100vw);
    top: calc(-40 / var(--media_sp) * 100vw);
    right: calc(-20 / var(--media_sp) * 100vw);
  }
  .p_ttl{
    font-size: calc(33.12 / var(--media_sp) * 100vw);
    margin-bottom: calc(7 / var(--media_sp) * 100vw);
    letter-spacing: -0.03em;
  }
  .pblk05 .p_ttl{
    margin: calc(35 / var(--media_sp) * 100vw) 0 calc(0 / var(--media_sp) * 100vw);
  }
  .p_txt{
    font-size: calc(24 / var(--media_sp) * 100vw);
    line-height:1.833;
  }
  .p_cap{
    font-size: calc(20 / var(--media_sp) * 100vw);
    letter-spacing: -0.1em;
    margin-top: calc(25 / var(--media_sp) * 100vw);
    white-space: nowrap;
  }
  .under_txt_wrap{
    margin-top: calc(35 / var(--media_sp) * 100vw);
  }
}