body {
  background: var(--page-theme-primary-color); --page-theme-primary-color: #b87c55
}
headlines {
  display: flex; width: 100%; height: calc(100vh / 4); min-height: 200px; max-height: 600px; background: none center center no-repeat; background-size: cover; align-items: center; justify-content: center; position: relative
}
headlines div.mask {
  width: 100%; height: 100%; background: var(--page-theme-primary-color); opacity: 0.3
}
headlines div.text {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 100
}
headlines div.text p {
  text-align: center; padding: calc(var(--page-gap) / 2) 0px; color: #fff; font-size: 2.4rem; line-height: 100%; text-shadow: 1px 1px 1px var(--page-theme-primary-color)
}
headlines div.text p:last-of-type {
  padding-left: 4px; letter-spacing: 4px
}
headlines.aboutus {
  background-image: url(../images/headlines.aboutus.jpg)
}
headlines.case {
  background-image: url(../images/headlines.case.jpg)
}
headlines.news {
  background-image: url(../images/headlines.news.jpg)
}
headlines.recruitment {
  background-image: url(../images/headlines.recruitment.jpg)
}
headlines.contactus {
  background-image: url(../images/headlines.contactus.jpg)
}
.package_header {
  --header-anchor-color: #17233d; --header-anchor-padding: 40px; --header-anchor-icon-right: 14px; --header-anchor-hover-color: var(--page-theme-primary-color); --header-border-top: var(--page-theme-primary-color) 2px solid; --header-submenu-anchor-hover-color: var(--page-theme-primary-color); --header-navicon-color: var(--page-theme-primary-color); --header-mobile-mainmenu-background: rgba(184, 124, 85, 0.9); --header-mobile-menu-li-border-bottom: rgba(255, 255, 255, 0.1) 1px solid
}
.package_banner {
  --banner-dot-active-background: var(--page-theme-primary-color)
}
.package_banner::part(title) {
  font-size: 4.8rem
}
.package_banner::part(subtitle) {
  font-size: 3.2rem
}
.package_section {
  width: 100%; margin-top: var(--page-gap)
}
.package_section h3 {
  position: relative
}
.package_section h3 span {
  display: block; font-size: 3.6rem; padding-bottom: 2.4rem; line-height: 120%; font-weight: normal; text-align: center; position: relative; z-index: 200
}
.package_section h3 em {
  font-size: 4rem; color: #e7e6e6; line-height: 120%; transform: translate(-50%, 0); white-space: nowrap; font-style: normal; font-weight: lighter; position: absolute; left: 50%; bottom: 0px; z-index: 100
}
.package_main div.sidebar div.section {
  border: var(--page-theme-primary-color) 2px solid; border-radius: 10px; overflow: hidden
}
.package_main div.sidebar div.section h3 {
  padding: var(--page-gap); background: var(--page-theme-primary-color); color: #fff; text-align: center
}
.package_main div.sidebar div.section ul {
  padding: calc(var(--page-gap) / 2)
}
.package_main div.sidebar div.section ul li {
  margin-bottom: calc(var(--page-gap) / 2); padding: calc(var(--page-gap) / 2); border: #999 1px solid; border-radius: 5px; overflow: hidden; transition: all .3s ease
}
.package_main div.sidebar div.section ul li a {
  display: block; font-size: 1.4rem; color: #666; text-align: center; transition: color .3s ease
}
.package_main div.sidebar div.section ul li.pitchon,
.package_main div.sidebar div.section ul li:hover {
  background: var(--page-theme-primary-color); border-color: var(--page-theme-primary-color)
}
.package_main div.sidebar div.section ul li.pitchon a,
.package_main div.sidebar div.section ul li:hover a {
  color: #fff
}
.package_main div.sidebar div.section ul li:last-of-type {
  margin-bottom: 0px
}
.package_home_promise {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: var(--page-theme-primary-color)
}
.package_home_promise div.box {
  display: block; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding); padding-bottom: 0px
}
.package_home_promise div.items {
  width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-around
}
.package_home_promise div.items div.item {
  width: 20%
}
.package_home_promise div.items div.item p.icon {
  padding: var(--page-gap) 0px; text-align: center
}
.package_home_promise div.items div.item p.icon jtbc-svg {
  width: 50px; height: 50px; --fore-color: #fff
}
.package_home_promise div.items div.item p.text {
  font-size: 2rem; line-height: 120%; font-weight: lighter; text-align: center; color: #fff
}
.package_home_promise_bar {
  display: block; box-sizing: border-box; width: 100%; height: 40px; background: #fff
}
.package_home_promise_bar div.box {
  display: block; box-sizing: border-box; width: 100%; height: 100%; background: var(--page-theme-primary-color); border-bottom-left-radius: 100%; border-bottom-right-radius: 100%
}
.package_home_aboutus {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: #fff
}
.package_home_aboutus div.box {
  display: block; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding); padding-bottom: calc(var(--page-gap) * 2)
}
.package_home_aboutus div.content div.intro {
  font-size: 1.4rem; line-height: 160%; padding: var(--page-gap) 0px; text-align: center
}
.package_home_aboutus div.content div.image {
  width: 100%; overflow: hidden; border-radius: 10px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px
}
.package_home_aboutus div.content div.image img {
  display: block; width: 100%
}
.package_home_process {
  width: 100%; background: url(../images/img.home.service.jpg) center center no-repeat; background-size: cover; position: relative
}
.package_home_process::before {
  content: ''; width: 100%; height: 100%; background: var(--page-theme-primary-color); opacity: 0.8; position: absolute; top: 0px; left: 0px; z-index: 10
}
.package_home_process div.box {
  display: block; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding); position: relative; z-index: 100
}
.package_home_process div.box h3 span {
  color: #fff !important
}
.package_home_process div.box h3 em {
  color: rgba(255, 255, 255, 0.5) !important
}
.package_home_process div.box div.content {
  width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr; justify-items: center; padding-bottom: var(--page-gap)
}
.package_home_process div.box div.content div.item {
  width: 150px; height: 150px; box-sizing: border-box; margin-top: var(--page-gap); border: #fff 3px solid; border-radius: 100%
}
.package_home_process div.box div.content div.item span {
  display: block; width: 100%; font-size: 4.8rem; color: #fff; text-align: center; padding-top: 20px; line-height: 160%
}
.package_home_process div.box div.content div.item em {
  display: block; width: 100%; font-size: 1.4rem; color: rgba(255, 255, 255, 0.7); text-align: center; font-style: normal; letter-spacing: 2px
}
.package_aboutus_detail {
  font-size: 1.4rem; line-height: 160%; padding: calc(var(--page-gap) * 2) 0px; text-align: left
}
.package_aboutus_image {
  width: 100%; overflow: hidden; border-radius: 10px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px
}
.package_aboutus_image img {
  display: block; width: 100%
}
.package_aboutus_others {
  width: 100%; padding-top: var(--page-gap)
}
.package_aboutus_others div.box {
  width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--page-gap); padding: var(--page-gap) 0px
}
.package_aboutus_others div.box div.item {
  width: 100%; padding-top: var(--page-gap)
}
.package_aboutus_others div.box div.item div.icon {
  width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; margin: auto; border: var(--page-theme-primary-color) 1px solid; border-radius: 100%
}
.package_aboutus_others div.box div.item div.icon jtbc-svg {
  width: 30%; height: 30%; --fore-color: var(--page-theme-primary-color)
}
.package_aboutus_others div.box div.item div.number {
  font-size: 2.4rem; text-align: center; color: var(--page-theme-primary-color); padding-top: var(--page-gap); font-weight: bold
}
.package_aboutus_others div.box div.item div.number em {
  font-size: 1.4rem; font-style: normal
}
.package_aboutus_others div.box div.item div.text {
  font-size: 1.4rem; color: #999; text-align: center; padding-top: calc(var(--page-gap) / 2)
}
.package_aboutus_team {
  width: 100%; padding: var(--page-gap) 0px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between
}
.package_aboutus_team div.item {
  width: calc(25% - var(--page-gap) * 3 / 4); padding-bottom: var(--page-gap)
}
.package_aboutus_team div.item p.image {
  text-align: center
}
.package_aboutus_team div.item p.image img {
  display: block; width: 100%; margin: auto; border-radius: 10px
}
.package_aboutus_team div.item p.title {
  font-size: 2rem; padding-top: calc(var(--page-gap) / 2); padding-bottom: calc(var(--page-gap) / 2); color: var(--page-theme-primary-color); text-align: center
}
.package_aboutus_team div.item p.title a {
  font-size: 2rem; color: var(--page-theme-primary-color)
}
.package_aboutus_team div.item p.subtitle {
  font-size: 1.4rem; color: #999; text-align: center
}
.package_aboutus_advantages {
  width: 100%; padding: var(--page-gap); box-sizing: border-box
}
.package_aboutus_advantages div.item {
  width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding-bottom: calc(var(--page-gap) * 2)
}
.package_aboutus_advantages div.item div.texts {
  width: 50%
}
.package_aboutus_advantages div.item div.texts div.text {
  width: 100%; box-sizing: border-box; padding-left: 80px; padding-bottom: calc(var(--page-gap) * 2); position: relative
}
.package_aboutus_advantages div.item div.texts div.text::before {
  content: attr(i); position: absolute; top: 0px; left: 0px; font-size: 4.8rem; color: var(--page-theme-primary-color); line-height: 120%; font-style: italic
}
.package_aboutus_advantages div.item div.texts div.text p[type=title] {
  font-size: 3rem; padding-bottom: calc(var(--page-gap) / 2); line-height: 160%; border-bottom: #dcdcdc 1px dashed
}
.package_aboutus_advantages div.item div.texts div.text p[type=subtitle] {
  font-size: 2rem; padding-top: calc(var(--page-gap) / 2); line-height: 160%; font-weight: lighter
}
.package_aboutus_advantages div.item div.texts div.text:last-of-type {
  padding-bottom: 0px
}
.package_aboutus_advantages div.item div.image {
  width: 40%
}
.package_aboutus_advantages div.item div.image img {
  width: 100%; border-radius: 10px; display: block
}
.package_aboutus_advantages div.item:nth-child(even) {
  flex-direction: row-reverse
}
.package_case_list {
  width: 100%; padding: var(--page-gap) 0px; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between
}
.package_case_list div.sidebar {
  width: 240px
}
.package_case_list div.cases {
  width: calc(100% - 240px - var(--page-gap) * 2)
}
.package_case_list div.cases div.items {
  width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--page-gap)
}
.package_case_list div.cases div.items div.item {
  width: auto; box-sizing: border-box; padding: calc(var(--page-gap) / 2); border: #dcdcdc 1px solid; border-radius: 10px
}
.package_case_list div.cases div.items div.item p[type=image] {
  padding-bottom: calc(var(--page-gap) / 2)
}
.package_case_list div.cases div.items div.item p[type=image] img {
  display: block; width: 100%; border-radius: 10px
}
.package_case_list div.cases div.items div.item p[type=title] {
  padding-bottom: calc(var(--page-gap) / 2); text-align: center
}
.package_case_list div.cases div.items div.item p[type=title] a {
  font-size: 1.6rem; color: var(--page-theme-primary-color); display: inline-block; line-height: 120%; border-bottom: transparent 1px solid
}
.package_case_list div.cases div.items div.item p[type=title] a:hover {
  border-color: var(--page-theme-primary-color)
}
.package_news_list {
  width: 100%; padding: var(--page-gap) 0px; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between
}
.package_news_list div.sidebar {
  width: 240px
}
.package_news_list div.news {
  width: calc(100% - 240px - var(--page-gap) * 2)
}
.package_news_list div.news div.item {
  width: 100%; padding: var(--page-gap) 0px; border-bottom: #eee 1px solid; display: flex; box-sizing: border-box; align-items: flex-start
}
.package_news_list div.news div.item div.image {
  width: 25%; box-sizing: border-box; padding-right: var(--page-gap)
}
.package_news_list div.news div.item div.image img {
  width: 100%; display: block
}
.package_news_list div.news div.item div.text {
  flex: 1
}
.package_news_list div.news div.item div.text p[type=title] {
  padding-bottom: calc(var(--page-gap) / 2)
}
.package_news_list div.news div.item div.text p[type=title] a {
  font-size: 2rem; color: var(--page-theme-primary-color); line-height: 120%; display: inline-block; padding-bottom: 4px; border-bottom: transparent 1px solid
}
.package_news_list div.news div.item div.text p[type=title] a:hover {
  border-color: var(--page-theme-primary-color)
}
.package_news_list div.news div.item div.text p[type=info] {
  padding-bottom: calc(var(--page-gap) / 2); color: #999; line-height: 120%
}
.package_news_list div.news div.item div.text p[type=summary] {
  font-size: 1.4rem; color: #333; line-height: 160%
}
.package_news_list div.news div.item:first-of-type {
  padding-top: 0px
}
.package_news_list div.news div.item:last-of-type {
  padding-bottom: 0px; border-bottom: 0px
}
.package_home_team {
  width: 100%; padding: var(--page-gap) 0px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between
}
.package_home_team div.item {
  width: calc(25% - var(--page-gap) * 3 / 4)
}
.package_home_team div.item div.image img {
  display: block; width: 100%; border-radius: 10px
}
.package_home_team div.item div.title {
  padding-top: calc(var(--page-gap) / 2); text-align: center
}
.package_home_team div.item div.title a {
  font-size: 1.6rem; color: var(--page-theme-primary-color); display: inline-block; padding-bottom: 4px; border-bottom: transparent 1px solid; line-height: 120%
}
.package_home_team div.item div.title a:hover {
  border-color: var(--page-theme-primary-color)
}
.package_home_team div.item div.subtitle {
  text-align: center; font-size: 1.4rem; line-height: 160%; color: #999
}
.package_home_case {
  width: 100%; padding: var(--page-gap) 0px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between
}
.package_home_case div.item {
  width: calc(25% - var(--page-gap) * 3 / 4)
}
.package_home_case div.item div.image img {
  display: block; width: 100%; border-radius: 10px
}
.package_home_case div.item div.title {
  padding-top: calc(var(--page-gap) / 2); text-align: center
}
.package_home_case div.item div.title a {
  font-size: 1.6rem; color: var(--page-theme-primary-color); display: inline-block; padding-bottom: 4px; border-bottom: transparent 1px solid; line-height: 120%
}
.package_home_case div.item div.title a:hover {
  border-color: var(--page-theme-primary-color)
}
.package_recruitment_list {
  width: 100%; padding-top: var(--page-gap)
}
.package_contactus {
  width: 100%; padding-top: var(--page-gap)
}
.package_contactus div.map {
  width: 100%; box-sizing: border-box; border: #d1d1d1 1px solid; margin-bottom: var(--page-gap)
}
.package_contactus div.box div.tip {
  font-size: 1.4rem; color: var(--page-theme-primary-color); text-align: center; padding: calc(var(--page-gap) / 2); line-height: 160%
}
@media screen and (max-width: 1280px) {
  .package_header {
    --header-anchor-padding: 28px; --header-anchor-icon-right: 10px
  }
}
@media screen and (max-width: 960px) {
  .package_header {
    --header-anchor-padding: 15px
  }
  .package_banner::part(title) {
    font-size: 3.6rem
  }
  .package_banner::part(subtitle) {
    font-size: 2.4rem
  }
  .package_section h3 span {
    font-size: 2.4rem; padding-bottom: 1.4rem
  }
  .package_section h3 em {
    font-size: 2rem
  }
  .package_main div.sidebar div.section {
    border-color: transparent
  }
  .package_main div.sidebar div.section h3 {
    display: none
  }
  .package_main div.sidebar div.section ul {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center
  }
  .package_main div.sidebar div.section ul li {
    margin-left: 5px; margin-right: 5px
  }
  .package_main div.sidebar div.section ul li:last-of-type {
    margin-bottom: calc(var(--page-gap) / 2)
  }
  .package_home_promise div.items div.item {
    width: 40%
  }
  .package_home_aboutus div.content div.image img {
    width: 200%; transform: translate(-25%, 0)
  }
  .package_home_process div.box div.content {
    grid-template-columns: 1fr 1fr
  }
  .package_home_team div.item {
    width: calc(50% - var(--page-gap) / 2)
  }
  .package_home_case div.item {
    width: calc(50% - var(--page-gap) / 2)
  }
  .package_aboutus_image img {
    width: 200%; transform: translate(-25%, 0)
  }
  .package_aboutus_others div.box {
    grid-template-columns: 1fr
  }
  .package_aboutus_team div.item {
    width: calc(50% - var(--page-gap) / 2)
  }
  .package_aboutus_advantages div.item {
    display: block
  }
  .package_aboutus_advantages div.item div.texts,
  .package_aboutus_advantages div.item div.image {
    width: 100%
  }
  .package_aboutus_advantages div.item div.texts div.text {
    padding-left: 50px
  }
  .package_aboutus_advantages div.item div.texts div.text::before {
    font-size: 2.4rem; line-height: 160%
  }
  .package_aboutus_advantages div.item div.texts div.text p[type=title] {
    font-size: 1.8rem
  }
  .package_aboutus_advantages div.item div.texts div.text p[type=subtitle] {
    font-size: 1.4rem
  }
  .package_aboutus_advantages div.item div.texts div.text:last-of-type {
    padding-bottom: calc(var(--page-gap) * 2)
  }
  .package_case_list {
    display: block
  }
  .package_case_list div.sidebar,
  .package_case_list div.cases {
    width: 100%
  }
  .package_case_list div.cases div.items {
    grid-template-columns: repeat(2, 1fr)
  }
  .package_case_list div.cases div.items div.item p[type=title] a {
    font-size: 1.4rem
  }
  .package_news_list {
    display: block
  }
  .package_news_list div.sidebar,
  .package_news_list div.news {
    width: 100%
  }
  .package_news_list div.news div.item {
    display: block
  }
  .package_news_list div.news div.item div.image {
    width: 100%; padding: 0px; padding-bottom: var(--page-gap)
  }
}