section { position: relative; padding: 2vw 0; background: no-repeat 50%/cover; }
.page_title {margin-top: 29px;text-align: center;font-weight: 500;font-size: 23px;color: #ffffff;z-index: 2;background: #a9866f;padding: 0 20px;letter-spacing: 0.10em;font-weight: 300;border-radius: 10px 0px 10px 0px;line-height: 2;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.page_title:before {content: "";position: absolute;width: 50px;height: 35px;top: -54px;left: calc(50% - 23px);background: url(/images/38/LOGO-ICON.png);z-index: 6;background-size: cover;-moz-transform: rotate(20deg);-webkit-transform: rotate(20deg);-o-transform: rotate(20deg);-ms-transform: rotate(20deg);transform: rotate(20deg);}
section .page_title:first-letter { /* color: #2a5d70; */ }
section .page_title:after { content: ""; width: 50px; height: 1px; background: #c3a452b0; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
section .more_box >* { padding: 5px 30px; border: 1px rgba(255,255,255,.3) solid; display: inline-block; color: #fff; }
/* mmore22 */
.mmore22 { display: flex; flex-direction: column; align-items: center; padding: 50px 0; }
.custom-btn { width: 130px; height: 40px; color: #fff; border-radius: 5px; padding: 10px 25px; font-family: 'Lato',sans-serif; font-weight: 500; background: transparent; cursor: pointer; transition: all 0.3s ease; position: relative; display: inline-block; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1); outline: none; display: flex; flex-direction: column; align-items: center; justify-content: center; }
/* 12 */
.btn-12 { position: relative; border: none; box-shadow: none; width: 130px; height: 40px; line-height: 42px; -webkit-perspective: 230px; perspective: 230px; }
.btn-12 span { background: rgb(0,172,238); background: linear-gradient(0deg,rgb(34 87 105) 0%,rgb(27 72 87) 100%); display: block; position: absolute; width: 140px; height: 45px; line-height: 45px; box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1); border-radius: 5px; margin: 0; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all .3s; transition: all .3s; font-size: 16px; }
.btn-12 span:nth-child(1) { box-shadow: -7px -7px 20px 0px #fff9,-4px -4px 5px 0px #fff9,7px 7px 20px 0px #0002,4px 4px 5px 0px #0001; -webkit-transform: rotateX(90deg); -moz-transform: rotateX(90deg); transform: rotateX(90deg); -webkit-transform-origin: 50% 50% -20px; -moz-transform-origin: 50% 50% -20px; transform-origin: 50% 50% -20px; box-shadow: unset; }
.btn-12 span:nth-child(2) { -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); -webkit-transform-origin: 50% 50% -20px; -moz-transform-origin: 50% 50% -20px; transform-origin: 50% 50% -20px; }
.btn-12:hover span:nth-child(1) { box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1); -webkit-transform: rotateX(0deg); -moz-transform: rotateX(0deg); transform: rotateX(0deg); }
.btn-12:hover span:nth-child(2) { box-shadow: inset 2px 2px 2px 0px rgba(255,255,255,.5),7px 7px 20px 0px rgba(0,0,0,.1),4px 4px 5px 0px rgba(0,0,0,.1); color: transparent; -webkit-transform: rotateX(-90deg); -moz-transform: rotateX(-90deg); transform: rotateX(-90deg); }
.title_box p font { font-family: 'Cormorant Garamond','Times New Roman','serif'; }

.title_box { position: relative; z-index: 1; max-width: 1100px; margin: 0 auto 70px; text-align: center; padding-top: 60px; }
.title_box p {margin: 0;line-height: 0;display: flex;flex-direction: column;width: 100%;align-items: center;align-content: center;}
.title_box .txt_white_5 {font-size: 110px;color: transparent;-webkit-text-stroke: 1px rgba(180,149,90,0.15);font-weight: 600;text-transform: uppercase;letter-spacing: 20px;position: absolute;top: -30px;left: 0%;transform: translateX(-50%);z-index: 0;pointer-events: none;white-space: nowrap;opacity: 0.8;width: 100%;text-align: center;}

/* aboutBox */
#aboutBox .workframe { overflow: hidden; }
#aboutBox .left_box { padding: 0; float: left; width: 700px; bottom: 0; z-index: 10; display: flex; flex-direction: column; justify-content: flex-end; }
#aboutBox .title_box p { position: absolute; z-index: 0; }
#aboutBox { padding-bottom: 3vw; }
#aboutBox  .title_box { display: flex; flex-direction: column; align-items: center; background: white; }
#aboutBox .title_box p font { font-size: 60px; font-weight: 600; opacity: 0.3; z-index: -1; text-transform: uppercase; color: #fadce4; }
#aboutBox .pos_abs { position: absolute; }
#aboutBox .pos_rel { position: relative; }
#aboutBox .left_box .info_box { /* height: 100%; */ }
#aboutBox .info_box b { text-align: center; display: flex; justify-content: center; color: #d9d9d9; text-transform: uppercase; font-weight: 400; margin-top: 35px; }
#aboutBox .info_box h4 { margin: 15px 0; height: 52px; text-align: center; font-weight: 400; font-size: 31px; }
#aboutBox .img_box_cover,#aboutBox .img_box_cover img { height: 450px; }
#aboutBox .left_box .info_box article.text-clamp { margin-bottom: 20px; height: auto; line-height: 190%; -webkit-line-clamp: 3; }
#aboutBox .mmore { z-index: 998; width: 100%; }
#aboutBox .mmore a { display: flex; justify-content: center; padding: 12px 5px; background: #c43131; width: 200px; margin: 0px auto 0; color: white; }
#aboutBox .left_box .info_box p { color: #646464; font-weight: 300; font-size: 18px; }
#aboutBox .right_box { float: right; width: 50%; position: relative; }
#aboutBox .right_box:before { content: ""; position: absolute; width: 1px; height: 100%; background: #34343e40; left: 0; top: 0; }
#aboutBox .right_box:after { content: ""; position: absolute; width: 1px; height: 100%; background: #34343e40; left: 50%; top: 0; }
#aboutBox .right_box .list_box {
  margin-bottom:30px;width:calc(50% - 1px);/* border-left:1px #ccc solid;*/
  display:inline-block;vertical-align:top;
}
#aboutBox .right_box .list_box .relat_box { margin: 0 25px; }
#aboutBox .right_box .list_box .img_box_cover,#aboutBox .right_box .list_box .img_box_cover img { height: 370px; }
#aboutBox .right_box .list_box .info_box h4 { height: 40px; font-size: 28px; color: #b3978e; font-weight: 500; }
#aboutBox .right_box .list_box .info_box p { color: #6a6869; font-weight: 300; font-size: 16px; }
#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover,#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover img { height: 300px; }
#aboutBox .right_box .list_box:nth-child(2n) .info_box h4 { margin: 15px 0 10px; }
#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover:before { content: "after"; font-size: 21px; text-align: center; display: flex; position: absolute; width: 95px; height: 35px; background: #c39e85; color: antiquewhite; right: 0; bottom: 72px; z-index: 9; border-radius: 10px 0px 0px 10px; border: antiquewhite 1px solid; flex-direction: column; justify-content: center; align-items: center; }
#aboutBox .right_box .list_box .img_box_cover:before { content: "before"; font-size: 21px; text-align: center; display: flex; position: absolute; width: 95px; height: 35px; background: #225769; color: #eae9e7; right: 0; bottom: 91px; z-index: 9; border-radius: 10px 0px 0px 10px; border: #a3a09d 1px solid; flex-direction: column; justify-content: center; align-items: center; }
#aboutBox.about_content_end { width: 100%; display: block; }
/* secabout */
#secabout { margin-top: 50px; }
#secabout:before { position: absolute; width: 60%; height: 100%; background: #dc8661; display: block; top: 0; left: 0; content: ""; }
#secabout >div { width: 50%; display: inline-block; vertical-align: top; }
#secabout .customBox ul { margin: 0 auto; width: 500px; }
#secabout .customBox ul li { padding: 60px 0; }
#secabout .customBox ul li .page_sub_title { margin-bottom: 25px; font-weight: 400; font-size: 36px; color: #fff; }
#secabout .customBox ul li article { font-weight: 200; font-size: 18px; color: #ece4e0; }
#secabout .youtubeBox { top: 45px; }
#secabout .youtubeBox iframe { width: 90%; height: 350px; }
/* productBox */
#productBox { padding: 5vw 8vw; }
#productBox .list_box { position: relative; }
#productBox .relat_box:before { position: absolute; width: 100%; height: 100%; background: rgb(0 0 0/.25); display: block; top: 0; left: 0; z-index: 3; content: ""; }
#productBox ul li .img_box_cover img { height: 490px; }
#productBox ul li .info_box.abso_box { height: auto; top: calc((100% - 40px)/2); left: 0; }
#productBox ul li .info_box >* { margin: 5px auto; width: 70%; text-align: center; }
#productBox ul li .info_box h4 { height: 40px; font-weight: 400; font-size: 24px; color: #fff; }
#productBox ul li .info_box article { margin: 80px auto 15px; width: 45%; color: rgb(255 255 255/.7); line-height: 140%; font-size: 15px; -webkit-line-clamp: 2; opacity: 0; }
#productBox ul li .info_box .more_box { opacity: 0; }
#productBox .btn a { position: absolute; width: 26px; height: 26px; border: solid #444; display: block; top: calc((100% - 26px)/2); }
#productBox .btn a#product_prev { border-width: 1px 0 0 1px; transform: rotate(-45deg); left: -50px; }
#productBox .btn a#product_next { border-width: 1px 1px 0 0; transform: rotate(45deg); right: -50px; }
#productBox .slick-slider { margin-bottom: 60px; }
#productBox .slick-dots li button:before { width: 12px; height: 12px; background: transparent; border: 1px #000 solid; border-radius: 50%; text-align: center; opacity: 1; content: ""; }
#productBox .slick-dots li.slick-active button:before { background: #000; }
/*wave-shap*/
.wave-shap { position: relative; }
.wave-shap svg { width: 105%; fill: #ffffff; top: 36px; z-index: 1; position: absolute; -moz-transform: scaleY(1.8); -webkit-transform: scaleY(1.8); -o-transform: scaleY(1.8); -ms-transform: scaleY(1.8); transform: scaleY(2.8); }
/* news_area */
#news_area {
  padding-top:40px;background-image:url(/images/38/DD-BG.jpg);background:#122e46;padding:3vw 0 5vw;/* background-image:linear-gradient(to right,#274c6a 0%,#153149 100%);*/
  outline:1px solid #ffffff8a;outline-offset:-65px;
}
#news_area:before { content: ""; position: absolute; width: 600px; height: 600px; background-image: url(/images/38/BG-1.svg); z-index: 0; top: -162px; background-size: cover; left: -130px; opacity: 0; }
#news_area:after { content: ""; position: absolute; width: 360px; height: 360px; background-image: url(/images/38/BG-2.svg); z-index: 0; top: -180px; right: 4px; background-size: cover; opacity: 0; }
#news_area .list_box .row { padding-bottom: 30px; margin: 15px; }
#news_area .list_box .row img { height: 580px; }
#news_area .list_box .row .info_box {
  padding:15px;width:calc(100% - 70px);/* box-shadow:0 0 6px #4a4a4aab;*/
  left:0;bottom:0;background:#ffffff;border-left:#36363630 1px solid;border-bottom:#ababab4f 1px solid;
}
.title_box {display: flex;flex-direction: column;align-items: center;margin-bottom: 60px;position: relative;}
#news_area .title_box p { position: absolute; top: calc(-3vw + 17px); left: calc(50% - 138px); }
section#news_area .page_title { color: #eaeaea; }
#news_area .title_box p font { opacity: 1; z-index: -1; text-transform: uppercase; color: #ffffff; font-weight: 500; font-size: 25px; letter-spacing: 9.5px; }
#news_area .list_box .row .info_box p { color: #e8e8e8; }
#news_area .list_box .row .info_box a { color: #eaeaea; }
#news_area .list_box .row .info_box h3 { color: #363636; font-weight: 300; font-size: 22px; }
#news_area .pos_abs { position: absolute; }
#news_area .atag_item { width: 100%; height: 100%; top: 0; }
#news_area .pos_rel { position: relative; }
#news_area p.yeear { display: flex; align-items: center; }
#news_area p.yeear a { border: #e7e7e7 1px solid; padding: 5px 15px; margin: 0 16px; }
#news_area .img_cover { object-fit: cover; width: 100%; }
#news_area .list_box .row .info_box p * { font-weight: 100; font-size: 14px; }
#news_area .list_box .row .info_box p a { margin-right: 10px; padding: 0 2px; max-width: calc(100% - 82px); height: 23px; z-index: 2; }
#news_area .tadan { display: flex; align-items: center; flex-direction: column; width: calc(33.3% - 10px); margin: 5px; }
#news_area .list_box { display: flex; flex-wrap: wrap; }
#news_area .tadan .imgbox { display: flex; width: 360px; max-width: 100%; border: #e3e3e31f 2px solid; }
#news_area .tadan .textbox { display: flex; flex-direction: column; width: calc(100% - 80px); padding: 20px 40px; }
#news_area .tadan .textbox h2 { position: relative; padding-left: 20px; }
#news_area .tadan .textbox h2:before { content: ""; position: absolute; width: 5px; height: 30px; background: #bfa451; left: 0; top: 3px; }
#news_area .tadan .textbox h2 { font-size: 24px; color: #bfa451; font-weight: 400; }
#news_area .tadan .textbox p { font-size: 17px; color: #e9e9e9; font-weight: 300; }
/* bookBox */
#bookBox ul { margin: 0 auto; width: 1200px; display: grid; grid-gap: 0; grid-template-columns: repeat(4,1fr); grid-template-rows: repeat(3,1fr); }
#bookBox ul li { overflow: hidden; }
#bookBox ul li img { height: 275px; }
#bookBox ul li:first-child { grid-column-start: 1; grid-column-end: 3; grid-row-start: 1; grid-row-end: 3; }
#bookBox ul li:nth-child(8) { grid-column-start: 4; grid-column-end: 5; grid-row-start: 2; grid-row-end: 4; }
#bookBox ul li:first-child img,#bookBox ul li:nth-child(8) img { height: 550px; }
@media screen and (max-width:1500px) {
  #aboutBox .left_box { width: calc(47.5vw - 25px); }
}
@media screen and (max-width:1440px) {
  #news_area { outline-offset: -40px; }
  #news_area .title_box p { top: calc(0vw + -2px); }
  #news_area .title_box {   }
}
@media screen and (min-width:1281px) {
  #productBox ul li:hover .relat_box:before { background: rgba(0,55,122,.85); }
  #productBox ul li:hover .info_box.abso_box { top: calc((100% - 178px)/2); }
  #productBox ul li:hover .info_box article { margin: 30px auto 15px; height: 44px; opacity: 1; }
  #productBox ul li:hover .info_box .more_box { opacity: 1; }
  #news_area .list_box .row:hover .info_box { bottom: 30px; }
}
@media screen and (max-width:1280px) {
  #productBox ul li.slick-current .relat_box:before { background: rgba(0,55,122,.85); }
  #productBox ul li.slick-current .info_box.abso_box { top: calc((100% - 178px)/2); }
  #productBox ul li.slick-current .info_box article { margin: 30px auto 15px; height: 44px; opacity: 1; }
  #productBox ul li.slick-current .info_box .more_box { opacity: 1; }
  #bookBox ul { width: 90%; }
  #bookBox ul li img { height: 22.5vw; }
  #bookBox ul li:first-child img,#bookBox ul li:nth-child(8) img { height: 45vw; }
}
@media screen and (max-width:1024px) {
  #aboutBox .left_box { width: calc(60vw - 25px); }
  #aboutBox .right_box { width: 35vw; }
  #aboutBox .right_box .list_box { width: calc(100% - 1px); }
  #aboutBox .right_box .list_box .img_box_cover,#aboutBox .right_box .list_box .img_box_cover img { height: 300px; }
  #aboutBox .right_box .list_box:nth-child(2n) .info_box h4 { margin: 15px 0; }
  #secabout:before { width: 90%; height: calc(100% - 300px); }
  #secabout >div { width: 95%; }
  #secabout .customBox ul { width: 80%; }
  #secabout .youtubeBox { width: 100%; text-align: right; top: 0; }
  #productBox ul li .img_box_cover img { height: 400px; }
  #news_area .tadan .textbox { padding: 20px 10px; width: calc(100% - 10px); }
  #news_area .tadan .textbox h2 { font-size: 20px; }
  #news_area { outline-offset: -12px; }
}
@media screen and (max-width:980px) {
  .page_title:before { top: -61px; }
  .page_title { margin-top: 62px; font-size: 30px; }
}
@media screen and (max-width:768px) {
  #aboutBox .img_box_cover,#aboutBox .img_box_cover img { height: 380px; }
  #aboutBox .left_box { margin-bottom: 50px; width: 100%; height: auto; }
  #aboutBox .fixed_box,#aboutBox .abso_box { position: relative; }
  #news_area:before { opacity: 0.5; top: -104px; display: none; }
  #news_area:after { opacity: 0.3; display: none; }
  #news_area .list_box:before { bottom: 0; }
  #news_area { outline-offset: -15px; }
  #news_area .title_box p { top: calc(13vw + -22px); position: relative; left: 0; }
  #aboutBox .right_box:after,#aboutBox .right_box:before { background: #54545e26; }
  #aboutBox .right_box { width: 100%; }
  #aboutBox .right_box .list_box { width: calc((100% - 1px)/2); border-left: 0; border-right: 0; }
  #aboutBox .right_box .list_box:nth-child(2n) { border-right: 0; }
  #aboutBox .right_box .list_box .relat_box { margin: 0 15px; }
  #aboutBox .right_box .list_box .img_box_cover,#aboutBox .right_box .list_box .img_box_cover img,#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover,#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover img { height: 50vw; }
  #aboutBox .right_box .list_box .info_box h4 { height: 30px; font-size: 19px; }
  #aboutBox .right_box .list_box .info_box p,#aboutBox .left_box .info_box p { font-size: 16px; }
  #newsBox ul li { margin: 20px 5px 20px 0; width: calc((100% - 10px)/2); }
  #newsBox ul li:nth-child(2n) { margin: 20px 0 20px 5px; }
  #bookBox ul { grid-template-rows: repeat(4,1fr); }
  #bookBox ul li:first-child { grid-column-end: 4; }
  #bookBox ul li:nth-child(8) { grid-column-start: 3; grid-column-end: 5; grid-row-start: 3; grid-row-end: 5; }
}
@media screen and (max-width:640px) {
  .title_box .txt_white_5{
    font-size: 30px;
    letter-spacing: 6px;
    top: 0;
}
  .title_box{
    margin-bottom: 50px;
    padding-top: 50px;
}
  #bookBox ul { grid-template-columns: repeat(3,1fr); grid-template-rows: repeat(5,1fr); }
  #bookBox ul li:first-child { grid-column-end: 3; }
  #bookBox ul li:nth-child(8) { grid-column-start: 1; grid-column-end: 3; grid-row-start: 5; grid-row-end: 6; }
  #bookBox ul li:nth-child(7) { grid-column-start: 2; grid-column-end: 4; grid-row-start: 3; grid-row-end: 5; }
  #bookBox ul li img,#bookBox ul li:nth-child(8) img { height: 30vw; }
  #bookBox ul li:first-child img,#bookBox ul li:nth-child(7) img { height: 60vw; }
  #news_area .list_box .row img { height: 260px; }
  #news_area .list_box .row .info_box { padding: 5px 10px; }
  #news_area .tadan .imgbox { width: 295px; display: flex; flex-direction: column; }
}
@media screen and (max-width:550px) {
  #news_area .tadan .textbox h2 { font-size: 22px; }
  #news_area .tadan { width: calc(100% - 10px); }
  #secabout:before { width: 100%; }
  #productBox .list_box { margin: 0 auto; width: 350px; }
  #productBox .btn { display: none; }
  #newsBox ul li,#newsBox ul li:nth-child(2n) { margin: 20px 0; width: 100%; }
  .page_title {font-size: 22px;margin-top: 0;}
  #aboutBox .title_box p font,#news_area .title_box p font { font-size: 24px; }
  #news_area .tadan .textbox { padding: 20px 20px; width: calc(100% - 40px); }
  #news_area .tadan .textbox p { font-size: 15px; line-height: 200%; }
}
@media screen and (max-width:480px) {
  #aboutBox .right_box .list_box { width: calc((100% - 1px)/1); }
  #aboutBox .right_box:after,#aboutBox .right_box:before { display: none; }
  #aboutBox .right_box .list_box .img_box_cover,#aboutBox .right_box .list_box .img_box_cover img,#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover,#aboutBox .right_box .list_box:nth-child(2n) .img_box_cover img { height: auto; }
}
@media screen and (max-width:425px) {
  #productBox .list_box { width: 100%; }
}
@media screen and (max-width:320px) {
  #aboutBox .right_box .list_box { width: 100%; border-right: 0; }
  #productBox .list_box { width: 100%; }
}