
html {
	height:101%;
}

body {
  margin:0 auto;
  padding:0 auto;
  width:100%;
  -webkit-text-size-adjust:none;
  touch-action: pan-y;
  -ms-overflow-style: none;
  scrollbar-width: none;
  overflow: -moz-scrollbars-none;
}

body::-webkit-scrollbar {
  display: none;
}

#nsetbody {
  position:relative;
  width:100%;
  height:90px;
  background-color: #FFFFFF;
  border-bottom:1px solid #9F9F83;
}

#nsetbody #testlock {
  position:absolute;
  left:50px;
  top:8px;
  z-index:1;
}

img.artlogomain {
  height:80px;
}

#swipebox {
  position:relative;
  aspect-ratio: 8 / 3;
    width: 100%;
}
  
.swiper {
  vertical-align: top;
  aspect-ratio: 3 / 1;
    width: 100%;
}

.swiper-slide {
  cursor: pointer;
  margin-top:-30px;
  text-align: center;
  font-size: 18px;
  background: #FFFFFF;

  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

.mainstc01 {
  margin:20px 0;
  background-image: url("art04biz");
  background-size: 100%;
  background-repeat: no-repeat;
}

.mainstc02 {
  margin:20px 0;
  background-image: url("art03biz");
  background-size: 100%;
  background-repeat: no-repeat;
}

.mainstc03 {
  margin:20px 0;
  background-image: url("art01biz");
  background-size: 100%;
  background-repeat: no-repeat;
}

.mainstc04 {
  margin:20px 0;
  background-image: url("art02biz");
  background-size: 100%;
  background-repeat: no-repeat;
}

.mainstc05 {
  margin:20px 0;
  background-image: url("art05biz");
  background-size: 100%;
  background-repeat: no-repeat;
}

h1 {
  font-size: 32px;
  line-height:42px;
  font-weight:bold;
}

h1.bizh1tc {
  font-family: 'Noto Sans TC', sans-serif;
  color: black;  
}

h1.bizh1cn {
  font-family: 'Noto Sans TC', sans-serif;
  color: black;  
}

h1.maintitletc {
  font-family: 'Noto Sans TC', sans-serif;
  color: green;
}

h1.maintitlecn {
  font-family: 'Noto Sans SC', sans-serif;
  color: green;
}

h1.plumtitletc {
  font-family: 'Noto Sans TC', sans-serif;
  color: #A2BC6C;
}

h1.plumtitlecn {
  font-family: 'Noto Sans SC', sans-serif;
  color: #A2BC6C;
}

#introtcbody {
  position:relative;
  display:block;
  margin:auto;
  padding:20px 60px 20px 60px;
  width:100%;
}

#askbody {
  position:relative;
  margin:auto;
  padding:20px 60px 20px 60px;
  width:100%;
  height:750px;
}

#askhbox {
  position:absolute;
  top:70px;
  left:50%;
  transform: translate(-50%, 0);
  test-align:center;
  z-index:1;
}

#askbox {
  position:absolute;
  display:block;
  top:150px;
  left:50%;
  transform: translate(-50%, 0);
  width:800px;
  height:600px;
  z-index:1;
}

#askmbox {
  display:none;
}

#inqm01 {
  display:none;
}

#inq01 {
  display:inline-block;
  padding:30px 0 0 0;
  vertical-align:top;
  text-align:left;
  width:100px;
}

#inq02 {
  display:inline-block;
  padding:20px 0 0 0;
  vertical-align:top;
  text-align:left;
  width:590px;
}

#inq03 {
  display:inline-block;
  padding:350px 0 0 0;
  vertical-align:bottom;
  text-align:right;
  width:90px;
}

.inqtxt {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:16px;
}

.inqcntxt {
  font-family: 'Noto Sans SC', sans-serif;
  font-size:16px;
}

input[name="clientname"] {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:16px;
  color: #231F20;
  padding:12px 4px 12px 8px;
  width:280px;
  height:36px;
  border-radius:6px;
  border:1px solid #204E2F;
  background-color: white;
}

input[name="clientname"]:focus {
  outline: none;	
}

input[name="clienttel"] {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:16px;
  color: #231F20;
  padding:12px 4px 12px 8px;
  width:280px;
  height:36px;
  border-radius:6px;
  border:1px solid #204E2F;
  background-color: white;
}

input[name="clienttel"]:focus {
  outline: none;	
}

textarea[name="clientdes"] {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:16px;
  color: #231F20;
  width:560px;
  height:260px;
  border-radius:6px;
  border:1px solid #204E2F;
  background-color: white;
}

input[name="s2023btn"] {
  font-family: 'Noto Sans TC', sans-serif;
  color: #231F20;
  font-size:16px;
  text-align:center;
  vertical-align:middle;
  width:60px;
  height:24px;
  border:none;
  background:#C8E9F2;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  text-decoration: none;
}

input[name="s2023btn"]:hover {
  background: #FBF6B9;
  cursor:pointer;
}

input[name="s2023btn"]:focus {
  outline: none;	
}

input[name="s2023cnbtn"] {
  font-family: 'Noto Sans SC', sans-serif;
  color: #231F20;
  font-size:16px;
  text-align:center;
  vertical-align:middle;
  width:60px;
  height:24px;
  border:none;
  background:#C8E9F2;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  text-decoration: none;
}

input[name="s2023cnbtn"]:hover {
  background: #FBF6B9;
  cursor:pointer;
}

input[name="s2023cnbtn"]:focus {
  outline: none;	
}

#introcnbody {
  position:relative;
  display:block;
  margin:auto;
  padding:20px 100px 20px 100px;
  width:100%;
}

#introenbody {
  position:relative;
  display:block;
  margin:auto;
  padding:20px 100px 20px 100px;
  width:100%;
}

#meatbox {
  display:inline-block;
  margin:0;
  padding:0;
  width:300px;
  height:410px;
}

#snackbox {
  display:inline-block;
  margin:0;
  padding:0;
  width:300px;
  height:320px;
}

img.mboxset {
  width:90%;
}

#topbar01 {
  position:relative;
  display:block;
  width:100%;
  height:auto;
  overflow:hidden;
  overflow-wrap: break-word;
}

#fwinebar01 {
  display:block;
  width:100%;
}

img.meatmain {
  width:100%;
}

img.meatmobile {
    display:none;
  }

#topbar01 #chickinfo {
  position:absolute;
  width:62%;
  left:33%;
  top:18%;
  z-index:1;
}

#cataglog {
  display:block;
  margin:auto;
  padding:auto;
  width:100%;
}

#cataglognex {
  display:block;
  margin:auto;
  padding:auto;
  width:100%; 
}

p.catnote {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:24px;
  line-height:36px;
}

p.cncatnote {
  font-family: 'Noto Sans SC', sans-serif;
  font-size:24px;
  line-height:36px;
}

.swiper-slide img {
  display: block;
  vertical-align:top;
  width: 100%;
  object-fit: cover;
}
  
.swiper-pagination-bullet {
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  font-size: 24px;
  color: #FFFFFF;
  opacity: 1;
  background: rgba(0, 0, 0, 0.2);
}
  
.swiper-pagination-bullet-active {
  color: #093646;
  background: #FFFFFF;
}

#nsetfooter {
  margin:auto;
  padding:0 60px 0 60px;
  width:100%;
  height:560px;
  max-height:560px;
  background:#FDF9CA;
  border-top:2px solid #9F9F83;
}

#nbottom {
  display:block;
  margin:auto;
  width:100%;
  height:560px;
  min-height:560px;
  vertical-align:top;
}

.nb01div {
  display:inline-block;
  padding:0 0 0 20px;
  width:20%;
  height:400px;
  min-height:400px;
  overflow:hidden;
  overflow-wrap: break-word;
}

.nb02div {
  position:relative;
  display:inline-block;
  width:55%;
  height:400px;
  min-height:400px;
  overflow:hidden;
  overflow-wrap: break-word;
}

.sboxset {
  position:absolute;
  top:40px;
  right:0;
}

.slangset {
  position:absolute;
  top:180px;
  right:20px;
}

a.aexponote {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:24px;
  line-height:36px;
  text-decoration: none;
  color:#00002E;
}

a.aexponote:hover {
  cursor:pointer;
  color:#58b7da;
}

a.aexcnponote {
  font-family: 'Noto Sans SC', sans-serif;
  font-size:24px;
  line-height:36px;
  text-decoration: none;
  color:#00002E;
}

a.aexcnponote:hover {
  cursor:pointer;
  color:#58b7da;
}

p.footnote {
  font-family: 'Noto Sans TC', sans-serif;
  font-size:24px;
  line-height:36px;
  text-align:center;
  color:#00002E;
}

p.footcnnote {
  font-family: 'Noto Sans SC', sans-serif;
  font-size:24px;
  line-height:36px;
  text-align:center;
  color:#00002E;
}

img.socialbox {
  padding:0 14px 0 14px;
  width:180px;
}

img.socialbox:hover {
  opacity:0.6;
  cursor: pointer;
}

img.solidimgbox {
  padding:0 14px 0 14px;
  width:180px;
}

img.solidimgbox:hover {
  cursor: pointer;
}


@media only screen and (max-width: 1279px) {

  #nsetbody {
    position:relative;
    width:100%;
    height:70px;
    background-color: #FFFFFF;
    border-bottom:1px solid #9F9F83;
  }

  #nsetbody #testlock {
    position:absolute;
    left:20px;
    top:4px;
    z-index:1;
  }

  img.artlogomain {
    height:60px;
  }

  #swipebox {
    position:relative;
    aspect-ratio: 16 / 12;
    width: 100%;
  }
    
  .swiper {
    vertical-align: top;
    aspect-ratio: 16 / 11;
    width: 100%;
  }

  .swiper-slide {
    cursor: pointer;
    margin-top:-30px;
    text-align: center;
    font-size: 18px;
    background: #FFFFFF;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
  }

  .mainstc01 {
    margin:20px 0;
    background-image: url("artm04biz");
    background-size: 100%;
    background-repeat: no-repeat;
  }

  .mainstc02 {
    margin:20px 0;
    background-image: url("artm03biz");
    background-size: 100%;
    background-repeat: no-repeat;
  }

  .mainstc03 {
    margin:20px 0;
    background-image: url("artm01biz");
    background-size: 100%;
    background-repeat: no-repeat;
  }

  .mainstc04 {
    margin:20px 0;
    background-image: url("artm02biz");
    background-size: 100%;
    background-repeat: no-repeat;
  }

  .mainstc05 {
    margin:20px 0;
    background-image: url("artm05biz");
    background-size: 100%;
    background-repeat: no-repeat;
  }

  h1 {
    font-size: 20px;
    line-height: 30px;
    font-weight: bold;
  }

  h1.bizh1tc {
    font-family: 'Noto Sans TC', sans-serif;
    color: black;  
  }

  h1.bizh1cn {
    font-family: 'Noto Sans TC', sans-serif;
    color: black;  
  }

  h1.maintitletc {
    font-family: 'Noto Sans TC', sans-serif;
    color: green;
  }

  h1.maintitlecn {
    font-family: 'Noto Sans SC', sans-serif;
    color: green;
  }

  h1.plumtitletc {
    font-family: 'Noto Sans TC', sans-serif;
    color: #A2BC6C;
  }

  h1.plumtitlecn {
    font-family: 'Noto Sans SC', sans-serif;
    color: #A2BC6C;
  }

  #introtcbody {
    position:relative;
    display:block;
    margin:auto;
    padding:20px 10px 20px 10px;
    width:100%;
  }

  #askbody {
    position:relative;
    margin:auto;
    padding:20px 30px 20px 30px;
    width:100%;
    height:750px;
  }

  #askhbox {
    position:absolute;
    top:50px;
    left:50%;
    transform: translate(-50%, 0);
    test-align:center;
    z-index:1;
  }

  #askbox {
    display:none;
  }

  #askmbox {
    position:absolute;
    display:block;
    top:90px;
    left:50%;
    transform: translate(-50%, 0);
    width:100%;
    height:600px;
    z-index:1;
  }

  #inqm01{
    display:block;
    padding:30px 0 0 10px;
    vertical-align:top;
    text-align:left;
    width:100%;
  }

  #inq01 {
    display:none;
  }

  #inq02 {
    display:none;
  }

  #inq03 {
    display:none;
  }

  .inqtxt {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
  }

  .inqcntxt {
    font-family: 'Noto Sans SC', sans-serif;
    font-size:16px;
  }

  input[name="clientname"] {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
    color: #231F20;
    padding:12px 4px 12px 8px;
    width:85%;
    height:36px;
    border-radius:6px;
    border:1px solid #204E2F;
    background-color: white;
  }

  input[name="clientname"]:focus {
    outline: none;	
  }

  input[name="clienttel"] {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
    color: #231F20;
    padding:12px 4px 12px 8px;
    width:85%;
    height:36px;
    border-radius:6px;
    border:1px solid #204E2F;
    background-color: white;
  }

  input[name="clienttel"]:focus {
    outline: none;	
  }

  textarea[name="clientdes"] {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
    color: #231F20;
    width:90%;
    height:200px;
    border-radius:6px;
    border:1px solid #204E2F;
    background-color: white;
  }

  input[name="s2023btn"] {
    font-family: 'Noto Sans TC', sans-serif;
    color: #231F20;
    font-size:16px;
    text-align:center;
    vertical-align:middle;
    width:60px;
    height:24px;
    border:none;
    background:#C8E9F2;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none;
  }

  input[name="s2023btn"]:hover {
    background: #FBF6B9;
    cursor:pointer;
  }

  input[name="s2023btn"]:focus {
    outline: none;	
  }

  input[name="s2023cnbtn"] {
    font-family: 'Noto Sans SC', sans-serif;
    color: #231F20;
    font-size:16px;
    text-align:center;
    vertical-align:middle;
    width:60px;
    height:24px;
    border:none;
    background:#C8E9F2;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    text-decoration: none;
  }

  input[name="s2023cnbtn"]:hover {
    background: #FBF6B9;
    cursor:pointer;
  }

  input[name="s2023cnbtn"]:focus {
    outline: none;	
  }

  #introcnbody {
    position:relative;
    display:block;
    margin:auto;
    padding:20px 100px 20px 100px;
    width:100%;
  }

  #introenbody {
    position:relative;
    display:block;
    margin:auto;
    padding:20px 100px 20px 100px;
    width:100%;
  }

  #meatbox {
    display:inline-block;
    margin:0;
    padding:0;
    width:160px;
    height:218px;
  }

  #snackbox {
    display:inline-block;
    margin:0;
    padding:0;
    width:160px;
    height:170px;
  }

  img.mboxset {
    width:90%;
  }

  #topbar01 {
    position:relative;
    display:block;
    width:100%;
    height:auto;
    overflow:hidden;
    overflow-wrap: break-word;
  }
  
  #fwinebar01 {
    display:none;
  }

  img.meatmain {
    display:none;
  }

  img.meatmobile {
    display:block;
    width:100%;
  }

  #topbar01 #chickinfo {
    position:absolute;
    width:62%;
    left:33%;
    top:10%;
    z-index:1;
  }

  #cataglog {
    display:block;
    margin:auto;
    padding:auto;
    width:100%;
  }

  #cataglognex {
    display:block;
    margin:auto;
    padding:auto;
    width:100%;
    text-align:justify; 
  }

  p.catnote {
    font-family: 'Noto Sans TC', sans-serif;
    font-size: 18px;
    line-height: 28px;
  }

  p.cncatnote {
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 18px;
    line-height: 28px;
  }

  .swiper-slide img {
    display: block;
    vertical-align:top;
    width: 100%;
    object-fit: cover;
  }
    
  .swiper-pagination-bullet {
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-size: 24px;
    color: #FFFFFF;
    opacity: 1;
    background: rgba(0, 0, 0, 0.2);
  }
    
  .swiper-pagination-bullet-active {
    color: #093646;
    background: #FFFFFF;
  }

  #nsetfooter {
    margin:auto;
    padding:0 20px 0 20px;
    width:100%;
    height:1360px;
    max-height:1360px;
    background:#FDF9CA;
    border-top:2px solid #9F9F83;
  }

  #nbottom {
    display:block;
    margin:auto;
    width:100%;
    height:1860px;
    min-height:1860px;
    vertical-align:top;
  }

  .nb01div {
    display:inline-block;
    padding:0 0 0 20px;
    width:200px;
    height:300px;
    min-height:300px;
    overflow:hidden;
    overflow-wrap: break-word;
  }

  .nb02div {
    position:relative;
    display:block;
    width:280px;
    height:630px;
    min-height:630px;
    overflow:hidden;
    overflow-wrap: break-word;
  }

  .sboxset {
    position:absolute;
    top:60px;
    left:20px;
  }

  .slangset {
    position:absolute;
    top:600px;
    left:20px;
  }

  a.aexponote {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
    line-height:24px;
    text-decoration: none;
    color:#00002E;
  }

  a.aexponote:hover {
    cursor:pointer;
    color:#58b7da;
  }

  a.aexcnponote {
    font-family: 'Noto Sans SC', sans-serif;
    font-size:16px;
    line-height:24px;
    text-decoration: none;
    color:#00002E;
  }

  a.aexcnponote:hover {
    cursor:pointer;
    color:#58b7da;
  }

  p.footnote {
    font-family: 'Noto Sans TC', sans-serif;
    font-size:16px;
    line-height:24px;
    text-align:center;
    color:#00002E;
  }

  p.footcnnote {
    font-family: 'Noto Sans SC', sans-serif;
    font-size:16px;
    line-height:24px;
    text-align:center;
    color:#00002E;
  }

  img.socialbox {
    padding:10px 0 10px 0;
    width:180px;
  }

  img.socialbox:hover {
    opacity:0.6;
    cursor: pointer;
  }

  img.solidimgbox {
    padding:10px 0 10px 0;
    width:180px;
  }

  img.solidimgbox:hover {
    cursor: pointer;
  }

}