@charset "utf-8";
/* CSS Document */
.edit_area {line-height: 1.55555556; color: #010101; width: 100%; position: relative; z-index: 10;}
.edit_area h2 {font-size: 137.5%; color: rgba(75, 5, 14, 0.9);}
.edit_area h3 {font-size: 131.25%; color: rgba(75, 5, 14, 0.8);}
.edit_area h4 {font-size: 125%; color: rgba(75, 5, 14, 0.7);}
.edit_area h5 {font-size: 118.75%; color: rgba(75, 5, 14, 0.6);}
.edit_area h6 {font-size: 106.25%; color: rgba(75, 5, 14, 0.5);}

.seo-content {line-height: 1.666667; letter-spacing: 0.53px; color: #010101; width: 100%; position: relative; z-index: 10; padding: 12px 0 29px 16px; border-bottom: 1px solid #a0a0a0;}
.seo-content::after {content: ''; background: #4b050e; height: 3px; width: 19.382%; position: absolute; bottom: -2px; left: 50%; z-index: 10; transform:translateX(-50%);}
.seo-content h2 {font-size: 175%; color: rgba(75, 5, 14,1);}
.seo-content h3 {font-size: 162.5%; color: rgba(75, 5, 14,0.9);}
.seo-content h4 {font-size: 150%; color: rgba(75, 5, 14,0.8);}
.seo-content h5 {font-size: 137.5%; color: rgba(75, 5, 14,0.7);}
.seo-content h6 {font-size: 125%; color: rgba(75, 5, 14,0.6);}

.sub_bn {position: relative; z-index: 1; overflow: hidden;}
.sub_bn > .img {line-height: 0; font-size: 0;}
.sub_bn > .tit {position: absolute; top: 27.675%; bottom: 0; left: 49.818%; z-index: 10; transform:translateX(-50%); width: 100%; max-width: 1567px; padding: 20px 100px 20px 100px;}

.abo_wrap {background: #fff; position: relative; z-index: 1;}

.sub_wrap {background: url("../images/bg_11.jpg") repeat-y top center / 100%; position: relative; z-index: 1; padding: 2px 0 0 0;}
.sub_wrap::before {content: ''; background: url("../images/bg_12.png") no-repeat center / cover; width: 29.219%; padding-bottom: 51.9271%; position: absolute; top: 0; left: 0; z-index: 2;}
.sub_wrap::after {content: ''; background: url("../images/bg_13.png") no-repeat center / cover; width: 11.563%; padding-bottom: 20.573%; position: absolute; bottom: 0; right: 0; z-index: 3;}

.path {width: 100%; max-width: 1662px; padding: 51px 100px 33px 100px; margin: 0 auto; position: relative; z-index: 100;}
.path ul, .path ul li {list-style-type:none; margin: 0; padding: 0; font-weight: 500; line-height: 1.25; letter-spacing: 0.5px;}
.path ul {width: 100%; display: flex; flex-wrap: wrap;}
.path ul li {color:#4b050e; position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center;}
.path ul li:first-child::before {content: ''; background: url("../images/icon_01g.png") no-repeat center / cover; width: 17px; height: 18px; display: block; margin: 0 5px 0 0;}
.path ul li::after {content: ''; background: url("../images/icon_01h.png") no-repeat center / cover; width: 13px; height: 18px; display: block; margin: 0 9px 0 8px;}
.path ul li:last-child::after {content: none;}
.path ul li a:link, .path ul li a:visited {text-decoration:none; color:#676767; font-weight: 300; letter-spacing: 0.3px; position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.path ul li a:active, .path ul li a:hover {text-decoration:none; color:#4b050e; font-weight: 500; cursor:pointer; transition: all 0.5s ease 0s;}
.path ul li a::after {content: ''; height: 2px; background: #79484a; width: 0; position: absolute; top: -3px; right: 0; z-index: -10; transition: all 0.5s ease 0s;}
.path ul li a:hover::after {width: 100%; left: 0;}

.float_tab {position: fixed; left: 28px; top: 50%; transform:translateY(-50%); z-index: 200;}
.float_tab > ul, .float_tab > ul > li {list-style-type:none; margin: 0; padding: 0;}
.float_tab > ul {display: flex; flex-flow: column;}
.float_tab > ul > li {padding: 2px 0;}
.float_tab > ul > li > a {position: relative; z-index: 1; display: block; text-decoration:none!important;}
.float_tab > ul > li > a > .num {width: 29px; height: 29px; border-radius: 29px; background: #9b6e71; font-family: "Roboto Condensed", sans-serif; color: #fff; font-weight: 600; line-height: 1; letter-spacing: 0; display: flex; flex-flow: wrap; justify-content: center; align-items: center; position: relative; z-index: 1;}
.float_tab > ul > li > a > .num::after {content: ''; background: #93696e; width: 11px; height: 2px; position: absolute; left: 0; top: calc(50% - 1px); z-index: -10; opacity: 0; visibility: hidden; transition: all 0.15s ease 0s;}
.float_tab > ul > li > a:hover > .num::after, .float_tab > ul > li.pick > a > .num::after {left: 100%; opacity: 1; visibility: visible;}
.float_tab > ul > li > a > .tit {position: absolute; left: 44px; top: 49%; transform:translateY(-50%); font-family: "Roboto Condensed", sans-serif; color: #343434; font-weight: 700; line-height: 1; letter-spacing: -0.1px; width: 130px; text-shadow: -1px -1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,1px 1px 0 #fff; opacity: 0; visibility: hidden; transition: all 0.5s ease 0s;}
.float_tab > ul > li > a:hover > .tit, .float_tab > ul > li.pick > a > .tit {opacity: 1; visibility: visible;}

.tab_M {width: 100%; max-width: 1663px; padding: 17px 100px 54px 100px; margin: 0 auto; position: sticky; top: 83px; z-index: 100; }
.tab_M ul, .tab_M ul li {list-style-type:none; margin: 0; padding: 0; color: #000; font-weight: 700; line-height: 1.142857; letter-spacing: 0.97px;}
.tab_M ul {width: 100%; display: flex; flex-wrap: wrap;}
.tab_M ul li {width: 23.924%; min-height: 69px; margin: 0 1.43433336% 10px 0; display: flex; flex-flow: row; border: 1px solid #000; background: #fff; transition: all 0.5s ease 0s;}
.tab_M ul li:nth-child(4n+4) {margin: 0 0 10px 0;}
.tab_M ul li a {width: 100%; padding: 10px 20px; display: flex; flex-flow: row; justify-content: center; align-items: center;}
.tab_M ul li a:link, .tab_M ul li a:visited {text-decoration:none; color:#000; transition: all 0.5s ease 0s;}
.tab_M ul li a:active, .tab_M ul li a:hover {text-decoration:none; color:#edeaea; cursor:pointer; transition: all 0.5s ease 0s;}
.tab_M ul li a > span {font-size: 171.42857%; color: #4f0d0f; font-weight: 800; line-height: 1; letter-spacing: 0; padding: 0 5.52% 0 0; margin: 2px 6.82% 0 0; position: relative; z-index: 1;}
.tab_M ul li a > span::after {content: ''; background: #848484; width: 2px; position: absolute; top: 3px; bottom: 6px; right: 0; z-index: -1;}
.tab_M ul li:hover, .tab_M ul li.current {background: #4f0d0f;}
.tab_M ul li.current a:link, .tab_M ul li.current a:visited {color: #edeaea;}
.tab_M ul li:hover a > span, .tab_M ul li.current a > span {color: #936568;}
.tab_M ul li:hover a > span::after, .tab_M ul li.current a > span::after {background: #885659;}

.sub_main {display: flex; flex-flow: wrap; align-items: flex-start; position: relative; z-index: 100; padding: 0 0 0 1px;}
.sub_menu {width: 300px; padding: 0; position: sticky; top: 110px; z-index: 50; max-height: calc(100vh - 130px); overflow-y: auto;}
.sub_menu > .tit {background: url("../images/bg_21.png") no-repeat #4b050e 49px 0; color: #fff; font-weight: 600; font-style: italic; line-height: 1.07142857; letter-spacing: 0.2px; padding: 11.661% 9.541% 12.02% 9.541%; margin: 0 0 2px 0; display: flex; flex-flow: column;}
.sub_menu > .tit > span {font-size: 12px; color: #9b6e71; line-height: 1; letter-spacing: 0.8px; padding: 8px 0 0 1px; margin: 0;}
.sub_cont {width: 100%; position: relative; z-index: 10;}
.sub_cont > .tit_F {justify-content: center; padding: 1.233% 0 54px 0;}
.sub_cont > .tit {color: #4b050e; font-weight: 600; line-height: 1.111111; letter-spacing: -0.2px; text-align: center; padding: 0 0 3.731% 0; margin: -0.546% 0 0 0; border-bottom: 1px solid #a0a0a0; position: relative; z-index: 1;}
.sub_cont > .tit::after {content: ''; background: #4b050e; height: 3px; width: 19.382%; position: absolute; bottom: -2px; left: 50%; z-index: 10; transform:translateX(-50%);}
.sub_main > .sub_menu + .sub_cont {width: calc(100% - 300px); padding: 0 1.027% 0 3.217%;}

.pages {display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 0 0 6.188% 0px;}
.pages a:link, .pages a:visited {text-decoration:none; color:rgba(255, 255, 255, 0.87); background: #9b6e71; font-weight: 500; line-height: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; min-width: 43px; height: 38px; overflow: hidden; padding: 2px 10px 0 10px; margin: 0 8.5px 5px 8.5px; position: relative; z-index: 10; transition: all 0.5s ease 0s;}
.pages a:active, .pages a:hover {text-decoration:none; color:#fff; background: #4b050e; cursor:pointer; transition: all 0.5s ease 0s;}
.pages .prev {background: #9b6e71; color: rgba(0, 0, 0, 0.67); font-size: 125%; min-width: 41px!important;}
.pages .next {background: #9b6e71; color: rgba(0, 0, 0, 0.67); font-size: 125%; min-width: 41px!important;}
.pages .prev_pages {font-family: "Roboto Condensed", sans-serif; background: #9b6e71; color: rgba(0, 0, 0, 0.67); font-size: 125%; letter-spacing: 3px!important; min-width: 50px!important;}
.pages .next_pages {font-family: "Roboto Condensed", sans-serif; background: #9b6e71; color: rgba(0, 0, 0, 0.67); font-size: 125%; letter-spacing: 3px!important; min-width: 50px!important;}
.pages .current {color:#fff!important; background: #4b050e!important; box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.14); pointer-events: none; cursor: text; box-shadow: 0 0 10px rgba(0, 0, 0, 0.24);}

.btnPNB {width: 100%; display: flex; flex-wrap: wrap; border-top: 1px solid #cacaca; border-bottom: 1px solid #cacaca; color: #010101; position: relative; z-index: 1; padding: 3.156% 3.226% 3.156% 3.367%; margin: 0 0 0 2px; transition: all 0.5s ease 0s;}
.btnPNB::before {content: ''; background: #4b050e; width: 17.532%; height: 3px; position: absolute; top: -2px; left: 1px; z-index: 10; transition: all 0.5s ease 0s;}
.btnPNB::after {content: ''; background: #4b050e; width: 17.532%; height: 3px; position: absolute; bottom: -2px; right: 1px; z-index: 10; transition: all 0.5s ease 0s;}
.btnPNB:hover::before, .btnPNB:hover::after {width: 100%;}
.btnPNB a:link, .btnPNB a:visited {text-decoration:none; color:#010101; transition: all 0.5s ease 0s;}
.btnPNB a:active, .btnPNB a:hover {text-decoration:none; color:#010101; cursor:pointer; transition: all 0.5s ease 0s;}
.btnP {width: 27%; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; padding: 0 10px 0 0; margin: -2px 0 0 0; letter-spacing: 2px;}
.btnP a img {margin-right: 12px; -moz-transform:scaleX(1); -webkit-transform:scaleX(1); -o-transform:scaleX(1); -ms-transform:scaleX(1); transform:scaleX(1); transition: all 0.5s ease 0s;}
.btnP a:hover img {margin-right: 4px; -moz-transform:scaleX(-1); -webkit-transform:scaleX(-1); -o-transform:scaleX(-1); -ms-transform:scaleX(-1); transform:scaleX(-1); transition: all 0.5s ease 0s;}
.btnB {width: 46%; display: flex; flex-wrap: wrap; justify-content: center; padding: 0 5px; letter-spacing: 1.65px;}
.btnB a img {margin: -2px 13px 0 0; -moz-transform:scaleX(1); -webkit-transform:scaleX(1); -o-transform:scaleX(1); -ms-transform:scaleX(1); transform:scaleX(1); transition: all 0.5s ease 0s;}
.btnB a:hover img {margin-right: 4px; -moz-transform:scaleX(-1); -webkit-transform:scaleX(-1); -o-transform:scaleX(-1); -ms-transform:scaleX(-1); transform:scaleX(-1); transition: all 0.5s ease 0s;}
.btnN {width: 27%; display: flex; flex-wrap: wrap; justify-content: flex-end; padding: 0 0 0 10px; margin: -1px 0 0 0; letter-spacing: 1.4px;}
.btnN a img {margin-left: 14px; -moz-transform:scaleX(1); -webkit-transform:scaleX(1); -o-transform:scaleX(1); -ms-transform:scaleX(1); transform:scaleX(1); transition: all 0.5s ease 0s;}
.btnN a:hover img {margin-left: 4px; -moz-transform:scaleX(-1); -webkit-transform:scaleX(-1); -o-transform:scaleX(-1); -ms-transform:scaleX(-1); transform:scaleX(-1); transition: all 0.5s ease 0s;}


.stay_line {position: absolute; top: -100px; left: 0; line-height: 0; font-size: 0; z-index: -100;}
.abou_A {position: relative; z-index: 1; background: url("../images/bg_01.jpg") no-repeat top center / cover; padding: 6.042% 0; overflow:hidden;}
.abou_A .con {width: 100%; max-width: 599px; margin: 0 0 0 auto;}
.abou_A .con > .tit_C {margin: 0 0 9.85% 0;}
.abou_A .con > .fs_20 {font-weight: 600; line-height: 1.5; letter-spacing: 0.75px; padding: 0; margin: 0 0 28px 0;}
.abou_A .con > p {margin: 12px 0;}
.abou_B {position: relative; z-index: 1; background: url("../images/bg_02.jpg") no-repeat fixed top center / cover; padding: 6.094% 0 4.74% 0; overflow:hidden;}
.abou_B .tit_A {justify-content: center;}
.abou_B_lis {width: 100%; max-width: 1477px; margin: auto; display: flex; flex-flow: wrap; padding: 3.772% 0 0 0;}
.abou_B_lis > div {width: 32.025%; margin: 0 1.9625% 30px 0; position: relative; z-index: 1;}
.abou_B_lis > div:nth-child(3n+3) {margin: 0 0 30px 0;}
.abou_B_lis > div > .photo-item {position: relative;}
.abou_B_lis > div > .photo-item > .img {line-height: 0; font-size: 0;}
.abou_B_lis > div > .photo-item .txt {color: #8e8e8e; line-height: 1.25; letter-spacing: -0.22px; text-align: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; display: flex; flex-flow: column; justify-content: center; align-items: center; padding: 0 0 10px 0;}
.abou_B_lis > div > .photo-item > .txt > .num {color: #fff; font-size: 300%; font-weight: 500; line-height: 1.05555556; letter-spacing: 0; text-shadow: -2px -2px 0 #4b050e,2px -2px 0 #4b050e,-2px 2px 0 #4b050e,2px 2px 0 #4b050e; margin: 0 0 16px 10px;}
.abou_B_lis > div > .photo-item > .txt > .fon {font-family: "Roboto Condensed", sans-serif; font-weight: 600; padding: 0; margin: 0; min-height: 60px; display: flex; flex-flow: wrap; justify-content: center; align-items: center;}
.abou_B_lis > div > .photo-item > .txt > .pho {width: 20.085%; line-height: 0; font-size: 0; margin: 20px auto 0 auto;}
.abou_B_con {width: 100%; max-width: 1030px; margin: auto; color: #fff; line-height: 1.777777778; letter-spacing: -0.2px; column-count: 2; column-gap: 53px; text-align: justify; padding: 2.452% 0.692% 0 0.692%;}
.abou_B_lis > div > .text{color: #fff; padding: 0 20px;}
.abou_B_con p {margin: 0;}
.abou_C {background: url("../images/bg_03.jpg") no-repeat top center / cover; padding: 3.49% 0 3.438% 0; overflow:hidden;}
.abou_C .tit_B {justify-content: center;}
.abou_C_lis {display: flex; flex-flow: wrap; justify-content: center; padding: 2.012% 0 0 0;}
.abou_C_lis > div {width: 16.028%; margin: 0 1.132% 20px 1.195%; border: 1px solid rgba(0, 0, 0, 0.3); border-radius: 4px; overflow: hidden; position: relative; z-index: 1; box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);}
.abou_C_lis > div > .img {line-height: 0; font-size: 0;}
.abou_C_lis > div > .txt {/*min-height: 30.99%;*/ position: absolute; left: 0; right: 0; bottom: 0; z-index: 10; display: flex; flex-flow: wrap; justify-content: center; align-items: center; text-align: center; background: rgba(75, 5, 14, 0.7); color: #fff; font-weight: 600; line-height: 1.5; padding: 10.87% 10px 11.27% 10px; margin: 0; opacity: 0; transition: all 0.5s ease 0s;}
.abou_C_lis > div:hover > .txt {opacity: 1;}
.abou_D {position: relative; z-index: 1; background: url("../images/bg_04.jpg") no-repeat top center / cover; padding: 3.855% 0 4.271% 0; overflow:hidden;}
.abou_D .tit_C {justify-content: center; margin: 0 0 2.138% 0;}
.abou_D .txt {width: 100%; max-width: 645px; margin: auto; text-align: center; color: #2f2f2f; padding: 0 0 22px 0;}
.abou_D .img {line-height: 0; font-size: 0; text-align: center; padding: 0 1.195% 0 0;}
.abou_E {position: relative; z-index: 1; padding: 5.6771% 0 3.438% 0; overflow:hidden;}
.abou_E::before {content: ''; background: #e5e5e5; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -10;}
.abou_E::after {content: ''; background: #4b050e; position: absolute; top: 0; left: 0; right: 0; z-index: -1; height: 40.424%;}
.abou_E .tit_A {justify-content: center; margin: 0 0 20px 0;}
.abou_E_lis {width: 100%; max-width: 1172px; margin: auto; display: flex; flex-flow: wrap; padding: 4.39% 0 0 0;}
.abou_E_lis > div {width: 31.57%; margin: 0 2.56% 34px 0; border-radius: 4px; overflow: hidden; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);}
.abou_E_lis > div:nth-child(3n+3) {margin: 0 0 34px 0;}
.abou_E_lis > div > .img {line-height: 0; font-size: 0;}
.abou_E_lis > div > .txt {color: rgba(0, 0, 0, 0.87); font-weight: 700; line-height: 1.142857; letter-spacing: -0.5px; background: #fff; padding: 24px 14.5px 22px 14.5px;}


.pro_cla {display: flex; flex-flow: wrap; align-items: flex-start; padding: 4.733% 0;}
.pro_cla > div {width: 30.847%; margin: 0 3.7295% 44px 0; border-bottom: 5px solid #4b050e; box-shadow: 0 0 1px rgba(0, 0, 0, 0.2); position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.pro_cla > div:nth-child(3n+3) {margin: 0 0 44px 0;}
.pro_cla > div > .img {height: 0; padding-bottom: 66.962%; overflow: hidden; position: relative; z-index: 1;}
.pro_cla > div > .img img {transform: translate(-50%,-50%) scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.pro_cla > div > .txt {background: #eeeeee; padding: 15px 14px 55px 15px;}
.pro_cla > div > .txt > .tit {font-weight: 500; line-height: 1.111111; letter-spacing: 0.1px; padding: 0; margin: 0 0 12px -1px; transition: all 0.5s ease 0s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical;}
.pro_cla > div > .txt > .lin {height: 1px; background: #cacaca; font-size: 0; line-height: 0; transition: all 0.5s ease 0s;}
.pro_cla > div > .txt > .mor {color: #6f6f6f; line-height: 1; letter-spacing: 1.6px; padding: 0; margin: 0; position: absolute; bottom: 17px; left: 17px; z-index: 50; transition: all 0.5s ease 0s;}
.pro_cla > div > .txt > .lks {width: 91px; height: 44px; border-radius: 92px 92px 0 0; background: #4b050e; position: absolute; bottom: 0; right: 23.5px; z-index: 50; display: flex; flex-flow: wrap; justify-content: center; align-items: center; padding: 4px 1px 0 0;}
.pro_cla > div:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
.pro_cla > div:hover > .img img {transform: translate(-50%,-50%) scale(1.2, 1.2);}
.pro_cla > div:hover > .txt > .tit {color: #4b050e;}
.pro_cla > div:hover > .txt > .lin {background: #4b050e;}
.pro_cla > div:hover > .txt > .mor {color: #000;}
.pro_cla > div:hover > .txt > .lks img {opacity: 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-animation-name: hvr-drop; animation-name: hvr-drop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
.pro_lis {display: flex; flex-flow: wrap; padding: 4.46% 0 3.094% 0; margin: 0 -3px 0 0;}
.pro_lis > div {width: 23.204%; margin: 0 2.366% 25px 0; border-bottom: 4px solid #4b050e; background: #eeeeee; box-shadow: 0 0 1px rgba(0, 0, 0, 0.2); position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.pro_lis > div:nth-child(4n+4) {margin: 0 0 25px 0;}
.pro_lis > div > .img {height: 0; padding-bottom: 66.49%; overflow: hidden; position: relative; z-index: 1;}
.pro_lis > div > .img img {transform: translate(-50%,-50%) scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.pro_lis > div > .txt {padding: 7px 12px 12px 12px;}
.pro_lis > div > .txt > .tit {font-weight: 500; line-height: 1.111111; letter-spacing: 0.1px; padding: 0; margin: 0 0 8px -1px; transition: all 0.5s ease 0s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical;}
.pro_lis > div > .txt > .lin {height: 1px; background: #cacaca; font-size: 0; line-height: 0; transition: all 0.5s ease 0s;}
/*.pro_lis > div > .txt > .mor {color: #6f6f6f; line-height: 1; letter-spacing: 1.6px; padding: 0; margin: 0; position: absolute; bottom: 12px; left: 12px; z-index: 50; transition: all 0.5s ease 0s;}*/
.pro_lis > div > .txt > .mod {color: #6f6f6f; line-height: 1; letter-spacing: 1.6px; padding: 13px 70px 0 0; margin: 0; transition: all 0.5s ease 0s;}
.pro_lis > div > .txt > .lks {width: 68px; height: 33px; border-radius: 92px 92px 0 0; background: #4b050e; position: absolute; bottom: 0; right: 17px; z-index: 50; display: flex; flex-flow: wrap; justify-content: center; align-items: center; padding: 4px 2px 0 0;}
.pro_lis > div > .txt > .lks img {width: 14px;}
.pro_lis > div:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
.pro_lis > div:hover > .img img {transform: translate(-50%,-50%) scale(1.2, 1.2);}
.pro_lis > div:hover > .txt > .tit {color: #4b050e;}
.pro_lis > div:hover > .txt > .lin {background: #4b050e;}
/*.pro_lis > div:hover > .txt > .mor {color: #000;}*/
.pro_lis > div:hover > .txt > .mod {color: #000;}
.pro_lis > div:hover > .txt > .lks img {opacity: 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-animation-name: hvr-drop; animation-name: hvr-drop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
.prod_sub {display: flex; flex-flow: wrap; padding: 0 0 6.43% 0;}
.prod_sub_lef {width: 654px;}
.prod_sub_rig {width: calc(100% - 654px); padding: 0 0.89% 0 5.609%;}
.prod_sub_rig > .tit {color: #040404; font-weight: 600; line-height: 1.1111111; letter-spacing: -0.3px; padding: 0; margin: -3px 0 11px 0;}
.prod_sub_rig > .suj {color: #000; font-weight: 400; line-height: 1.2; letter-spacing: 0; padding: 0; margin: 0 0 20px 1px;}
.prod_sub_rig > .edit_area {min-height: 236px; max-height: 236px; margin: 58px 0 20px 0; overflow-y: auto;}
.prod_sub_rig > .but {display: flex; flex-flow: row; align-items: center; justify-content: space-between; padding: 0 5px 0 1px; margin: 0 0 39px 0;}
.prod_sub_rig > .but > .inq {}
.prod_sub_rig > .but > .inq a:link, .prod_sub_rig > .but > .inq a:visited {text-decoration:none; color:#fff; letter-spacing: 2px; min-width: 201px; height: 52px; display: flex; flex-flow: wrap; justify-content: center; align-items: center; position: relative; z-index: 1; padding: 0 4px 0 0; transition: all 0.5s ease 0s;}
.prod_sub_rig > .but > .inq a:active, .prod_sub_rig > .but > .inq a:hover {text-decoration:none; color:#fff; background: #4b050e; cursor:pointer; transition: all 0.5s ease 0s;}
.prod_sub_rig > .but > .inq a::before {content: ''; background: #535353; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -10;}
.prod_sub_rig > .but > .inq a::after {content: ''; background: #4b050e; width: 0; position: absolute; top: 0; right: 0; bottom: 0; z-index: -5; transition: all 0.5s ease 0s;}
.prod_sub_rig > .but > .inq a:hover::after {left: 0; width: 100%;}
.prod_sub_rig > .but > .inq a img {margin: -1px 11px 0 0;}
.prod_sub_rig > .but > .inq a:hover img {opacity: 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-animation-name: hvr-drop; animation-name: hvr-drop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
.prod_sub_rig > .but > .sha {}
.prod_sub_bot {width: 100%; padding: 79px 0 0 0; margin: 0 0.616% 0 -0.5px;}
.resp-tabs-container .edit_area {color: #fff;}
.resp-tabs-container .edit_area h2, .resp-tabs-container .edit_area h3, .resp-tabs-container .edit_area h4, .resp-tabs-container .edit_area h5, .resp-tabs-container .edit_area h6 {color: #e4bbc0;}
.demo_A {display: flex; flex-flow: wrap;}
.demo_A > .lef {width: 405px; line-height: 0; font-size: 0;}
.demo_A > .rig {width: calc(100% - 405px); padding: 0 0 0 2.354%;}


.related_pro {background: #1b1b1b; padding: 3.1771% 0 4.844% 0;}
.related_pro > div > .tit {color: #fff; font-weight: 500; line-height: 1.111111; letter-spacing: 3.5px; text-align: center; padding: 0 0 1.984% 0; margin: 0 0 2.805% -1px; border-bottom: 1px solid #fff;}
.related_lis {max-width: 339px; margin: 0 auto; border-bottom: 5px solid #4b050e; box-shadow: 0 0 1px rgba(0, 0, 0, 0.2); position: relative; z-index: 1; transition: all 0.5s ease 0s;}
.related_lis > .img {height: 0; padding-bottom: 66.962%; overflow: hidden; position: relative; z-index: 1;}
.related_lis > .img img {transform: translate(-50%,-50%) scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.related_lis > .txt {background: #eeeeee; padding: 15px 14px 17px 15px;}
.related_lis > .txt > .tit {font-weight: 500; line-height: 1.111111; letter-spacing: 0.1px; padding: 0; margin: 0 0 12px -1px; transition: all 0.5s ease 0s; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical;}
.related_lis > .txt > .lin {height: 1px; background: #cacaca; font-size: 0; line-height: 0; transition: all 0.5s ease 0s;}
/*.related_lis > .txt > .mor {color: #6f6f6f; line-height: 1; letter-spacing: 1.6px; padding: 0; margin: 0; position: absolute; bottom: 17px; left: 17px; z-index: 50; transition: all 0.5s ease 0s;}*/
.related_lis > .txt > .mod {color: #6f6f6f; line-height: 1; letter-spacing: 1.6px; padding: 22px 100px 0 0; margin: 0; transition: all 0.5s ease 0s;}
.related_lis > .txt > .lks {width: 91px; height: 44px; border-radius: 92px 92px 0 0; background: #4b050e; position: absolute; bottom: 0; right: 23.5px; z-index: 50; display: flex; flex-flow: wrap; justify-content: center; align-items: center; padding: 4px 1px 0 0;}
.related_lis:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);}
.related_lis:hover > .img img {transform: translate(-50%,-50%) scale(1.2, 1.2);}
.related_lis:hover > .txt > .tit {color: #4b050e;}
.related_lis:hover > .txt > .lin {background: #4b050e;}
/*.related_lis:hover > .txt > .mor {color: #000;}*/
.related_lis:hover > .txt > .mod {color: #000;}
.related_lis:hover > .txt > .lks img {opacity: 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-animation-name: hvr-drop; animation-name: hvr-drop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}


.app_lis {display: flex; flex-flow: wrap; align-items: flex-start; padding: 8.556% 0 6.914% 0; margin: 0 0 0 -1px;}
.app_lis > div {width: 23.051%; margin: 0 2.59866666667% 61px 0; position: relative; z-index: 1; border-radius: 150px 0 150px 0; overflow: hidden;}
.app_lis > div:nth-child(4n+4) {margin: 0 0 61px 0;}
.app_lis > div > .img {height: 0; padding-bottom: 129.081%; overflow: hidden; position: relative; z-index: 1;}
.app_lis > div > .img img {transform: translate(-50%,-50%) scale(1.0, 1.0); transition: all 0.5s ease 0s;}
.app_lis > div:hover > .img img {transform: translate(-50%,-50%) scale(1.2, 1.2);}
.app_lis > div > .tit {color: #fff; font-weight: 600; line-height: 1.4; min-height: 153px; padding: 19px 8.907% 70px 8.61%; margin: 0; position: relative; z-index: 10; overflow: hidden;}
.app_lis > div > .tit::before {content: ''; background: #898989; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -10;}
.app_lis > div > .tit::after {content: ''; background: #946a6f; width: 0; position: absolute; top: 0; right: 0; bottom: 0; z-index: -5; transition: all 0.5s ease 0s;}
.app_lis > div:hover > .tit::after {width: 100%; left: 0;}
.app_lis > div > .but {width: 120px; height: 60px; border-radius: 60px 60px 0 0; background: #4f0d0f; position: absolute; bottom: 0; left: 8.907%; z-index: 100; display: flex; flex-flow: wrap; justify-content: center; align-items: center; padding: 13px 6px 0 0;}
.app_lis > div:hover > .but img {opacity: 0; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-animation-name: hvr-drop; animation-name: hvr-drop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);animation-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}


.con_wrap {display: flex; flex-flow: wrap; justify-content: space-between; color: #fff; font-weight: 500; position: relative; z-index: 1; background: rgba(75, 5, 14, 0.7); box-shadow: 0 0 18px rgba(101, 99, 99, 0.4); padding: 4.929% 4.176% 4.586% 4.107%; margin: 3.149% -6px 7.461% -6px;}
.con_wrap label {color: #e60013; font-weight: 500; padding: 0 0 0 15px; margin: 0;}
.con_wrap > div.lef {width: 48.152%;}
.con_wrap > div.rig {width: 43.492%; padding: 1px 0 0 0;}
.row_A {display: flex; flex-flow: row; align-items: center; padding: 0 0 19px 0;}
.row_B {display: flex; flex-flow: row; align-items: center; padding: 0 0 21px 0;}
.row_C {display: flex; flex-flow: row; align-items: center; padding: 0 0 43px 0;}
.row_D {display: flex; flex-flow: row; align-items: flex-start; padding: 0 0 35px 0;}
.row_E {position: relative; z-index: 1; line-height: 1.111111; letter-spacing: 1px;}
.row_E label {padding: 0; position: absolute; top: 0; left: -24px;}
.col_A {width: 198px; padding: 0 10px 2px 0;}
.col_B {width: calc(100% - 198px); display: flex; flex-flow: row; align-items: center; justify-content: space-between;}
.col_C {width: 135px; padding: 1px 10px 0 0;}
.col_D {width: calc(100% - 135px); display: flex; flex-flow: row; align-items: center; justify-content: space-between;}
.col_E {width: 135px; padding: 14px 10px 0 0;}
.con_wrap > div.bot {width: 100%; display: flex; flex-flow: wrap; justify-content: center; position: absolute; left: 0; bottom: -29px;}
.con_wrap > div.bot button {width: 17.584%; height: 50px; border: 2px solid #4b050e; background: #909090; color: #fff; letter-spacing: -0.5px; text-align: center; display: flex; flex-flow: wrap; justify-content: center; align-items: center; margin: 5px 1.732%; cursor: pointer; transition: all 0.5s ease 0s;}
.con_wrap > div.bot button:hover {background: #fff; color: #4b050e;}

.con_map {position: relative; height: 0; overflow: hidden; padding-bottom: 27.761%;}
.con_map iframe, .con_map object, .con_map embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.cust-bg{ background: url("../images/cust-pic-bg.png") center bottom no-repeat;margin-bottom: -20px;}
.cust-r2{ display: flex;flex-wrap: wrap;align-items: center; padding: 0 0 30px;}
.cust-r2 > div{ width: 50%; }

.cust-section-1 h3 {text-align: right;}
.cust-section-1 h3 span{ display: none;}
.cust-section-1 .cust-txt { padding-left: 5%;position: relative;}
.cust-section-1 .cust-txt .tit_B{ display: block;text-align: right;}
.cust-section-1 .cust-txt::before{ content: "";position: absolute;width: 70%;height: 1px;background: #4e0a10;left: 0;top: 40px;z-index: -1;}
.cust-section-2{ padding: 30px 0 50px; }
.cust-section-2 .cust_tit_pic img{margin: 0 12px 0 0;}
.cust-section-2 .cust_tit_pic span{display: none;}
.cust-section-2 .cust_tit_pic{font-size: 405.556%!important; font-family: "Roboto Condensed", sans-serif; color: #4e0a10!important; font-weight: 600; line-height: 1.109589; letter-spacing: -1.9px; display: flex; flex-flow: wrap; padding: 0; margin: 0 0 50px;align-items: center;}
.cust-section-2 div:nth-child(3){ max-width: 800px;  margin: 0 auto; text-align: center; font-weight: 500;}

.cust-list-items{position: relative;}
.cust-list-items img{margin: 0;}
.cust-list-items .mask{ position: absolute; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; background: rgba(78,10,16,.7);   pointer-events: none;transition: all 0.5s ease 0s;}
.cust-list-items:hover .mask{width: 70%; height: 50%; left: 50%;top: 50% ;right: 50%;bottom: 50%;transform: translate(-50%,-50%); }
.cust-list-items .cust-list-txt{ font-family: "Roboto Condensed", sans-serif; position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%); color: #fff;z-index: 1; text-align: center; width: 60%; }
.cust-list-items .cust-list-txt .cust-tit{ color: #FFF;font-weight: 600;}

@media only screen and (max-width:1400px){
    .cust-section-2 .cust_tit_pic img{width: 28%;max-height: 82px;}
    .cust-section-2 .cust_tit_pic{font-size: 400%!important; }     
}
@media only screen and (max-width:1200px){
    .cust-list-items:hover .mask{ height: 85%; } 
    .cust-section-2 .cust_tit_pic img{width: 28%;max-height: 72px;}
    .cust-section-2 .cust_tit_pic{font-size: 350%!important; }  
}
@media only screen and (max-width:992px){
    .cust-r2 > div{ width: 100%; }    
    .cust-section-1 h3 {text-align: left;}
    .cust-section-1 h3 span{ display: block; text-shadow: -1px -1px 0 #4e0a10,1px -1px 0 #4e0a10,-1px 1px 0 #4e0a10,1px 1px 0 #4e0a10; color: #fff; font-size: calc(100% - 3px); letter-spacing: 1px; margin: 2px 8px 0 0;}
    .cust-section-1 h3 img{ display: none;}  
    .cust-section-1 .cust-txt { padding-left: 0;}
    .cust-section-1 .cust-txt .tit_B{ padding-right: 20px;}
    .cust-section-2 .cust_tit_pic{font-size: 300%!important; }
    .cust-section-2 .cust_tit_pic img{display: none} 
    .cust-section-2 .cust_tit_pic span{display: block; text-shadow: -2px -2px 0 #4e0a10,2px -2px 0 #4e0a10,-2px 2px 0 #4e0a10,2px 2px 0 #4e0a10; color: #fff; letter-spacing: 1px; margin: 2px 8px 0 0;} 
    .cust-list-items{margin-bottom: 20px;}
    .cust-list-items .mask{ position: absolute; width: 70%; height: 60%; left: 50%;top: 50% ;right: 50%;bottom: 50%;transform: translate(-50%,-50%); }
    .cust-list-items:hover .mask{width: 70%; height: 60%; }
	
	.sub_cont > .tit_F {padding: 1.233% 0 40px 0;}
}
@media only screen and (max-width:576px){   
    .cust-r2{ padding: 0;}
    .cust-section-2{ padding: 10px 0 50px; }
    .cust-section-2 .cust_tit_pic{font-size: 250%!important; margin: 0 0 30px;}
    .cust-list-items .mask{ display: none;}
    .cust-list-items .cust-list-txt{ background: rgba(78,10,16,.7); position: relative; transform: translate(0,0);  width: 100%; left: auto;top: auto;padding: 20px 10px;}
}
@media only screen and (max-width:430px){
    .cust-section-2 .cust_tit_pic{font-size: 180%!important; }
}


/* 20250625 contactus 文字顏色*/

.con_wrap input::placeholder, .con_wrap select, textarea::placeholder, .con_wrap textarea {
    color: black;
}
