/* subpage header */
.header{position: fixed; border-bottom: unset;  height: 90px; background-color: rgba(34, 34, 34, 0.7);-webkit-transition: -webkit-transform 0.3s;-moz-transition: -moz-transform 0.3s;transition: transform 0.3s;}
.header #head-full a i{ line-height: 90px;}
.header #head-full a{ position: relative; top: -5px;}
.header #head-full p{ line-height: 90px;}
.header .logo-wrap a {display: block;width: 100%;height: 70px;margin-top: 10px; object-fit: cover;}
.header .header-icon > a{ display: inline-block; margin-top: 25px; width: 140px; height: 40px; border-radius: 50px; line-height: 40px; background-color: #D17028; margin-right: 40px; transition: .3s; text-align: center;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  .header{ height: 60px;  background-color: #fff;}
  .header .logo-wrap a {height: 40px; margin-top: 8px;}
  .header .header-icon > a{ display: inline-block; margin-top: 20px; width: unset; height: unset; border-radius:unset; line-height:unset; background-color: unset; margin-right: 10px; transition: .3s; text-align: center; color: #D17028;}
  .header .header-icon > a i{ color: #D17028;}
  .header .menu-icon__line {background-color: #D17028; }
}
/* section01 */
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  #section01{ margin-top: 60px;}
}

/* section02 */
#section02{ padding: 100px 0 0; position: relative;}
#section02 .box01{ position: absolute; top: 0; right: 0; width: 545px; height: 431px; border-radius: 0px 0px 0px 100px; background-color: #FFE8D9;}
#section02 .box02{ position: absolute; top: 440px; left: 0; width: 545px; height: 431px; border-radius: 0px 100px 0px 0px; background-color: #D17028;}
#section02 .top{ padding: 100px 0 227px; text-align: center; background-size: contain; background-repeat: no-repeat; background-position: top center;}
#section02 .top p{ line-height: 24px;}
#section02 .btm{ width: 100%; display: flex; justify-content: space-between; align-items: center; text-align: left;} 
#section02 .btm .img01{ width: 790px; height: 480px; border-radius: 10px; position: relative; overflow: hidden;}
#section02 .btm .s-img{width: 385px; height: 240px; border-radius: 10px; position: relative; overflow: hidden;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  #section02{ padding: 60px 0 0; position: relative;}
  #section02 .box01{ width: 190px; height: 160px; z-index: 1;}
  #section02 .box02{ top: 512px; width: 190px; height: 160px; z-index: 1;}
  #section02 .top{ padding: 106px 0 245px; }
  #section02 .top p{ line-height: 20px;}
  #section02 .btm{ flex-direction: column; position: relative; z-index: 2;} 
  #section02 .btm .img01{ width: 100%; height: 61.54vw;}
  #section02 .btm .img-wrap{ width: 100%;}
  #section02 .btm .s-img{width: 100%; height: 61.54vw; }
}

/* section02-2 */
#section02-2{ padding: 100px 0; text-align: center;}
#section02-2 img.map{ width: 100%; object-fit: cover;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section02-2{ padding: 60px 0 0; text-align: center;}
}

/* section03 */
#section03{ padding: 200px 0 100px; position: relative;}
#section03 .box{ position: absolute; right: 0; top: 100px; width: 815px; height: 345px; border-radius: 100px 0px 0px 0px; background-color: #FFF8F3;}
#section03 .deco-text{ line-height: 115px; color: #FFA35F; opacity: .1; position: absolute; top: 0; right: 160px;}
#section03 .map-wrap{ display: flex; width: 100%; align-items: flex-end;}
#section03 .map-wrap #map{ width: 1195px; height: 640px; border-radius: 10px; overflow: hidden; position: relative; background-color: #FFE8D9;}
#section03 .map-wrap .text-wrap{ width: calc(100% - 1195px); padding-left: 90px; padding-bottom: 66px;}
#section03 .map-wrap .text-wrap h3{ display: inline-block; position: relative; top: -3px;}
#section03 .map-wrap .text-wrap i{ padding-right: 10px;}
#section03 .map-wrap .text-wrap p{ line-height: 26px;}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
  #section03{ padding: 356px 0 60px; position: relative;}
  #section03 .box{ position: absolute; right: 0; top: 60px; width: 280px; height: 160px; }
  #section03 .deco-text{ line-height: 60px; top: 120px; right: 20px;}
  #section03 .map-wrap{ display: block; width: 100%;}
  #section03 .map-wrap #map{ width: 100%; height: 61.54vw;}
  #section03 .map-wrap .text-wrap{ width: 100%; padding-left: 0; padding-bottom: 0;}
  #section03 .map-wrap .text-wrap h3{ display: inline-block; position: relative; top: -3px;}
  #section03 .map-wrap .text-wrap p{ line-height: 20px;}
}