@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: YakuHanMP,'Zen Old Mincho', serif;
  font-size:96px;
  color:#fff;
  white-space: nowrap;
  text-align: center;
  letter-spacing: 0.05em;
}
.kv-wrap .kv-ttl .kv-jp{
  display:block;
  font-size:24px;
  margin-top:27px;
  letter-spacing: 0.04em;
  color:#fff;
  font-family: "OptimaLTPro-Roman";
}
.kv-wrap .kv-cap{
  position:absolute;
  bottom:0;
  right:0;
  margin:5px;
  font-size:12px;
  color:#fff;
  text-shadow: 1px 1px 10px #333;
}

.img .cap {
  position: absolute;
  margin: 5px;
  font-size: 12px;
  color: #fff;
  text-shadow: 1px 1px 10px #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.028vw;
  }
  .kv-wrap .kv-ttl .kv-jp{
    font-size:1.757vw;
    margin-top:1.977vw;
  }
  .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.168vw;
  }
  .kv-wrap .kv-ttl .kv-jp{
    font-size:3.272vw;
    margin-top:5.333vw;
  }
  .kv-wrap .kv-cap{
    margin:0.667vw 1.333vw;
    font-size:2.667vw;
  }
  .img .cap {
    font-size: 2.667vw; 
  }
}


.intro_wrap{
  padding:160px 0 0;
}
.inner_wrap{
  width:1280px;
  margin:0 auto;
}
.intro_wrap .inner_wrap {
  display: grid;
  grid-template-columns: 455px 775px;
  grid-template-rows: auto 1fr;
  gap:27px 50px;
}
.intro_wrap .inner_wrap .intro_ttl {
  grid-column: 1;
  grid-row: 1;
  font-size:36px;
  line-height:1.944;
}
.intro_wrap .inner_wrap .intro_txt{
  grid-column: 1;
  grid-row: 2;
  font-size:18px;
  line-height:2.833;
  padding-right:60px;
  box-sizing: border-box;
}
.intro_wrap .inner_wrap .img{
  grid-column: 2;
  grid-row: 1 / 3;
}
.intro_wrap .inner_wrap .img .cap{
  position: absolute;
  bottom:12px;
  right:70px;
}
.intro_wrap .img_wrap{
  width:100%;
  display:flex;
  margin-top:140px;
}
.intro_wrap .img_wrap .img{
  width:calc(100% / 3);
}
.intro_wrap .img_wrap .img .cap{
  position: absolute;
  bottom:0;
  right:0;
}

@media screen and (max-width: 768px) {
  .intro_wrap{
    padding:calc(80 / var(--media_sp) * 100vw) 0 0;
  }
  .inner_wrap{
    width:86.667%;
  }
  .intro_wrap .inner_wrap {
    display: block;
  }
  .intro_wrap .inner_wrap .intro_ttl {
    font-size: calc(44 / var(--media_sp) * 100vw);
    line-height:1.832;
    text-align: center;
    margin-bottom: calc(50 / var(--media_sp) * 100vw);
  }
  .intro_wrap .inner_wrap .intro_txt{
    font-size: calc(26 / var(--media_sp) * 100vw);
    line-height:2.077;
    padding-right:0;
  }
  .intro_wrap .inner_wrap .img{
    width:100%;
    margin-bottom: calc(50 / var(--media_sp) * 100vw);
  }
  .intro_wrap .inner_wrap .img .cap{
    font-size: calc(8.4 / var(--media_sp) * 100vw);
    bottom: calc(5 / var(--media_sp) * 100vw);
    right: calc(80 / var(--media_sp) * 100vw);
  }
  .intro_wrap .img_wrap{
    flex-wrap: wrap;
    margin-top: calc(90 / var(--media_sp) * 100vw);
  }
  .intro_wrap .img_wrap .img{
    width:50%;
  }
  .intro_wrap .img_wrap .img:last-child{
    width:100%;
  }
  .intro_wrap .img_wrap .img .cap{
    font-size: calc(10 / var(--media_sp) * 100vw);
  }
}

.sec_wrap{
  width:100%;
  background: url("../img/tiomaiko/bg_f_shopping_pc.webp") no-repeat;
  background-size: 100%;
  background-position: top right;
  background-color:#fff;
  padding:135px 0;
}
.sec_intro{
  text-align: center;
  margin-bottom: 90px;
}
h2{
  font-weight: normal;
  font-family: "OptimaLTPro-Roman";
  font-size:62px;
  line-height: 1;
  letter-spacing: 0.04em;
  margin-bottom:43px;
  color:#b0946d;
}
.sec_ttl{
  font-size:28px;
  line-height: 1;
  margin-bottom:34px;
  letter-spacing: -0.02em;
}
.sec_txt{
  font-size:16px;
  line-height: 2.375;
  letter-spacing: 0.05em;
}
.lr_wrap {
  display: grid;
  grid-template-columns: 400px 840px;
  grid-template-rows: auto 1fr;
  gap:20px 40px;
  margin-bottom:80px;
}
.inner_top {
  grid-column: 1;
  grid-row: 1;
}
.inner_bottom {
  grid-column: 1;
  grid-row: 2;
}
.inner_middle {
  grid-column: 2;
  grid-row: 1 / 3;
}
.lr_wrap.rev {
  grid-template-columns: 840px 400px;
}
.lr_wrap.rev .inner_top,
.lr_wrap.rev .inner_bottom {
  grid-column: 2;
}
.lr_wrap.rev .inner_middle {
  grid-column: 1;
}
.sec01 .lr_wrap {
  display: grid;
  grid-template-columns: 400px 840px;
  grid-template-rows: auto 1fr;
  gap:19px 40px;
}
.sec01 .inner_top {
  grid-column: 1;
  grid-row: 1;
}
.sec01 .inner_bottom_sp {
  grid-column: 1;
  grid-row: 2;
}
.sec01 .inner_bottom {
  grid-column: 1;
  grid-row: 3;
}
.sec01 .inner_middle {
  grid-column: 2;
  grid-row: 1 / 4;
}
.f_ttl{
  width:100%;
  height:30px;
  font-size:20px;
  line-height:30px;
  color:#76a8a9;
  background:linear-gradient(90deg,#e8f0f0 40.97%,rgba(255,255,255,0) 100%);
  position: relative;
  border-radius: 15px 0 0 0;
  overflow: hidden;
  margin-bottom:23px;
  padding-left:58px;
  box-sizing: border-box;
}
.f_ttl.mb18{
  margin-bottom:18px;
}
.inner_box .f_ttl{
  margin-bottom:12px;
}
.floor{
  display:flex;
  align-items: center;
  justify-content: center;
  width:47px;
  height:100%;
  font-size:19.6px;
  line-height:1;
  background-color:#76a8a9;
  box-sizing: border-box;
  font-family: "OptimaLTPro-Roman";
  color:#fff;
  position: absolute;
  top:0;
  left:0;
  padding-top:3px;
}
.f_name{
  font-size:30px;
  line-height:1;
  letter-spacing: -0.06em;
}
.f_name.ls0{
  letter-spacing: 0;
}
.inner_box .f_name{
  margin-bottom:12px;
}
.f_txt{
  font-size:15px;
  line-height:2;
}
.inner_bottom .f_txt{
  margin-bottom:21px;
}
.inner_bottom .f_txt.mb10{
  margin-bottom:16px;
}
.inner_box .f_txt{
  margin-top:5px;
}
.box_wrap{
  width:100%;
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
  /*gap:40px;*/
}
.box_wrap .inner_box{
  width:400px;
}
.box_wrap .inner_box:nth-child(n+2){
  margin-left:40px;
}
.box_wrap .inner_box:nth-child(4){
  margin-left:0;
}
.box_wrap .inner_box:nth-child(n+4){
  margin-top:40px;
}
.box_wrap .inner_box .img .circle{
  position: absolute;
  bottom:-30px;
  right:-110px;
  width:158px;
}
.box_wrap .inner_box .img .cap{
  position: absolute;
  bottom:0;
  right:0;
  font-size:12px;
}

@media screen and (max-width: 768px) {
  .sec_wrap{
    background: url("../img/tiomaiko/bg_f_shopping_sp.webp") no-repeat;
    background-size: 100%;
    background-position: top right;
    padding: calc(100 / var(--media_sp) * 100vw) 0 calc(190 / var(--media_sp) * 100vw);
  }
  .sec_intro{
    text-align: left;
    margin-bottom: calc(145 / var(--media_sp) * 100vw);
  }
  h2{
    font-size: calc(62 / var(--media_sp) * 100vw);
    letter-spacing: 0.04em;
    margin-bottom: calc(15 / var(--media_sp) * 100vw);
  }
  h2.ws{
    white-space: nowrap;
  }
  .sec_ttl{
    font-size: calc(32 / var(--media_sp) * 100vw);
    line-height: 1.761;
    margin-bottom: calc(45 / var(--media_sp) * 100vw);
  }
  .sec_txt{
    font-size: calc(26 / var(--media_sp) * 100vw);
    line-height: 2;
    letter-spacing: -0.02em;
  }
  .sec_txt.ls032{
    letter-spacing: -0.032em;
  }
  .sec_txt.ls045{
    letter-spacing: -0.045em;
  }
  .lr_wrap {
    display: block;
    margin-bottom: calc(70 / var(--media_sp) * 100vw);
  }
  .inner_top{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .sec01 .lr_wrap {
    display: block;
    margin-bottom: calc(70 / var(--media_sp) * 100vw);
  }
  .sec01 .inner_bottom {
    margin-bottom: calc(10 / var(--media_sp) * 100vw);
  }
  .sec01 .inner_bottom_sp {
    margin-top: calc(15 / var(--media_sp) * 100vw); 
  }
  .f_ttl{
    height: calc(43 / var(--media_sp) * 100vw);
    font-size: calc(28 / var(--media_sp) * 100vw);
    line-height: calc(43 / var(--media_sp) * 100vw);
    border-radius: calc(23 / var(--media_sp) * 100vw) 0 0 0;
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
    padding-left:12.308%;
  }
  .f_ttl.mb18{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .inner_box .f_ttl{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .floor{
    width:10%;
    font-size: calc(26 / var(--media_sp) * 100vw);
    padding-top: calc(4 / var(--media_sp) * 100vw);
  }
  .f_name{
    font-size: calc(36 / var(--media_sp) * 100vw);
  }
  .inner_box .f_name{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .f_txt{
    font-size: calc(26 / var(--media_sp) * 100vw);
  }
  .inner_bottom .f_txt{
    margin-bottom: calc(35 / var(--media_sp) * 100vw);
  }
  .inner_bottom .f_txt.mb10{
    margin-bottom: calc(35 / var(--media_sp) * 100vw);
  }
  .inner_box .f_txt{
    margin-top: calc(15 / var(--media_sp) * 100vw);
  }
  .box_wrap{
    display:block;
  }
  .box_wrap .inner_box{
    width:100%;
  }
  .box_wrap .inner_box:nth-child(n+2){
    margin-left:0;
  }
  .box_wrap .inner_box:nth-child(n+4){
    margin-top:0;
  }
  .box_wrap .inner_box:nth-child(n+2){
    margin-top: calc(50 / var(--media_sp) * 100vw);    
  }
  .box_wrap .inner_box .img .circle{
    bottom: calc(7 / var(--media_sp) * 100vw);
    right: -3.692%;
    width:35.385%;
  }
  .box_wrap .inner_box .img .cap{
    font-size:2.667vw;
  }
}

.sec_wrap.sec02{
  background: url("../img/tiomaiko/bg_f_eating_pc.webp") no-repeat;
  background-size: 100%;
  background-position: top left;
}
.sec02 .lr_wrap {
  margin-bottom:100px;
}
.sec02 .f_ttl{
  color:#db9074;
  background:linear-gradient(90deg,#fcecde 40.97%,rgba(255,255,255,0) 100%);
}
.sec02 .floor{
  background-color:#db9074;
}
.f_subttl{
  font-size:24px;
  line-height: 1;
  letter-spacing: -0.06em;
  margin-bottom:14px;
}
.f_subttl.mb09{
  margin-bottom:9px;
}
.shop_wrap{
  width:100%;
  margin-top:26px;
}
.shop_wrap.mt15{
  width:100%;
  margin-top:15px;
}
.shop_ttl{
  font-size:17px;
  font-family: "OptimaLTPro-Roman";
  color:#b39872;
  display:flex;
  align-items: center;
  gap:10px;
  margin-bottom:4px;
}
.shop_ttl::after{
  content:'';
  display:block;
  flex:1;
  height:1px;
  background:#b39872; 
}
.shop_data{
  font-size:12px;
  line-height:2;
  letter-spacing: 0.04em;
}
.shop_data.ka{
  word-break: keep-all;
}
.shop_data.ls0{
  letter-spacing: 0;
}

@media screen and (max-width: 768px) {
  .sec_wrap.sec02{
    background: url("../img/tiomaiko/bg_f_eating_sp.webp") no-repeat;
    background-size: 100%;
    background-position: top left;
  }
  .sec02 .lr_wrap {
    margin-bottom: calc(90 / var(--media_sp) * 100vw);
  }
  .f_subttl{
    font-size: calc(32 / var(--media_sp) * 100vw);
    margin-top: calc(35 / var(--media_sp) * 100vw);
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .f_subttl.mb09{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .shop_wrap{
    margin-top: calc(25 / var(--media_sp) * 100vw);
  }
  .shop_wrap.mt15{
    margin-top: calc(25 / var(--media_sp) * 100vw);
  }
  .shop_ttl{
    font-size: calc(20 / var(--media_sp) * 100vw);;
    gap:2.615%;
    margin-bottom: calc(15 / var(--media_sp) * 100vw);
  }
  .shop_data{
    font-size: calc(20 / var(--media_sp) * 100vw);;
    line-height:1.8;
  }
  .shop_data.ls0{
    letter-spacing: -0.02em;
  }
}

.sec_wrap.sec03{
  background: url("../img/tiomaiko/bg_f_comforts_of_living_pc.webp") no-repeat;
  background-size: 100%;
  background-position: top right;
}
.for_conforts_of_living{
  margin-bottom:188px;
}
.for_medical_treatment{
  margin-bottom:153px;
}
.for_conforts_of_living .inner_box{
  background-color:#a7b3da;
  border-radius: 70px 0 0 0;
  box-sizing: border-box;
}
.for_conforts_of_living .inner_box.box02{
  background-color:#ebbdc6;
}
.for_conforts_of_living .inner_box.box03{
  background-color:#abc2d4;
}
.for_conforts_of_living .inner_box.box04{
  background-color:#9cc2d1;
}
.for_conforts_of_living .inner_box.box05{
  background-color:#cab2ce;
}
.for_conforts_of_living .inner_box.box06{
  background-color:#9cd2e3;
}
.s03_txt_wrap{
  text-align: center;
}
.s03_floor{
  font-size:26px;
  margin-bottom:8px;
  color:#fff;
  font-family: "OptimaLTPro-Roman";
}
.for_conforts_of_living .s03_txt_wrap{
  padding:23px 0 18px;
  box-sizing: border-box;
}
.s03_name{
  font-size:32px;
  letter-spacing: -0.06em;
}
.s03_name.ls01{
  letter-spacing: -0.1em;
}
.s03_name span{
  display:block;
  font-size:22px;
  margin-top:2px;
}
.for_medical_treatment .inner_box{
  background-color:#54bfc6;
  border-radius: 70px 0 0 0;
  box-sizing: border-box;
}
.for_medical_treatment .inner_box.box02{
  background-color:#66c6e2;
}
.for_medical_treatment .inner_box.box03{
  background-color:#73c7ce;
}
.for_medical_treatment .inner_box.box04{
  background-color:#a0d8ea;
}
.for_medical_treatment .inner_box.box05{
  background-color:#00b3d6;
}
.for_medical_treatment .s03_txt_wrap{
  padding:34px 0 24px;
  box-sizing: border-box;
}
.for_medical_treatment .s03_name span{
  margin-top:6px;
}
.others .box_wrap .inner_box .img{
  margin-bottom:32px;
}
.others .box_wrap .inner_box .img .cap{
  position: absolute;
  right:auto;
  left:50%;
  bottom:5px;
  transform: translate(-50%,0);
}
.others .s03_floor{
  font-size:20px;
  margin-bottom:3px;
  color:#b39872;
}
.others .s03_name{
  line-height: 1.75;
  letter-spacing: -0.02em;
}

@media screen and (max-width: 768px) {
  .sec_wrap.sec03{
    background: url("../img/tiomaiko/bg_f_comforts_of_living_sp.webp") no-repeat;
    background-size: 100%;
    background-position: top right;
  }
  .for_conforts_of_living{
    margin-bottom: calc(190 / var(--media_sp) * 100vw);
  }
  .for_medical_treatment{
    margin-bottom: calc(180 / var(--media_sp) * 100vw);
  }
  .sec03 .sec_intro {
    margin-bottom: calc(50 / var(--media_sp) * 100vw);
  }
  .sec03 .box_wrap{
    display:flex;
    /*gap:4.616%;*/
  }
  .sec03 .box_wrap .inner_box:nth-child(2n){
    margin-left:4.616%;
  }
  .sec03 .box_wrap .inner_box:nth-child(n+2) {
    margin-top: 0;
  }
  .sec03 .box_wrap .inner_box:nth-child(n+3) {
    margin-top: calc(35 / var(--media_sp) * 100vw);
  }
  .sec03 .box_wrap .inner_box{
    width:47.692%;
  }
  .sec03 .box_wrap .inner_box .img .cap{
    font-size: calc(10 / var(--media_sp) * 100vw);
  }
  .s03_floor{
    font-size: calc(24 / var(--media_sp) * 100vw);
    margin-bottom: calc(12 / var(--media_sp) * 100vw);
  }
  .for_conforts_of_living .s03_txt_wrap{
    padding: calc(30 / var(--media_sp) * 100vw) 0 calc(13 / var(--media_sp) * 100vw);
  }
  .s03_name{
    font-size: calc(28 / var(--media_sp) * 100vw);
  }
  .s03_name span.pc{
    display:none;
  }
  .s03_name span{
    font-size: calc(18 / var(--media_sp) * 100vw);
    margin-top: calc(5 / var(--media_sp) * 100vw);
  }
  .for_medical_treatment .inner_box{
    border-radius: calc(70 / var(--media_sp) * 100vw) 0 0 0;
  }
  .for_medical_treatment .s03_txt_wrap{
    padding: calc(30 / var(--media_sp) * 100vw) 0 calc(20 / var(--media_sp) * 100vw);
  }
  .for_medical_treatment .s03_name span{
    margin-top: calc(10 / var(--media_sp) * 100vw);
  }
  .others .box_wrap .inner_box .img{
    margin-bottom: calc(20 / var(--media_sp) * 100vw);
  }
  .others .box_wrap .inner_box .img .cap{
    bottom: calc(5 / var(--media_sp) * 100vw);
  }
  .others .s03_floor{
    font-size: calc(26 / var(--media_sp) * 100vw);
    margin-bottom: 0;
  }
}