@import url('https://fonts.googleapis.com/css?family=Lusitana');
#ssbanner .bxslider{ margin:0 }
#ssbanner .bxslider a{ display:block;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;position:relative;transition:linear all .3s }
#ssbanner .bxslider a img{ width:100% }
#ssbanner .bxslider .info{ display: none;height:325px;position:absolute;color:#fff;width:325px;left:calc(50% - 162px);top:calc(50% - 162px);z-index:2;display:table;vertical-align:middle }
#ssbanner .bxslider .info h2{ font-weight:400;text-align:center;letter-spacing:.1em;font-size:24px;position:relative;display:table-cell;vertical-align:middle }
#ssbanner .bxslider .info h2:first-letter{ font-size:30px;margin-right:2px }
#NewsBox{ background-repeat:no-repeat;background-position:50% 50%;background-size:cover;/* padding: 0 0 80px; */position:relative; }
#NewsTitle{ position:relative;z-index:2 }
#NewsBox .webframe,#pandr-title .webframe,#product .webframe,#bookBox .webframe{ width:1440px;margin:0 auto;text-align:center }
#NewsTitle .index-title{ /* display:inline-block; */position:relative; }
#NewsTitle .index-title h2{ text-align:center;color:#413f3f;font-weight:400;font-size:30px;line-height:120% }
#NewsTitle .index-title h3{ text-align:center;color:#e9c68b;font-size:60px;line-height:100%;/* font-family:'Lusitana',serif; */font-weight:400;margin-top:5px; }
#NewsTitle .more{ text-align:center;margin-top:45px;display: none; }
#NewsTitle p{ position:relative;text-align:center }
#NewsTitle p a{ color:#413f3f;display:inline-block;border:1px solid #a7a7a7;border-radius:25px;padding:3px 40px;font-family:'Lusitana',serif;position:relative;z-index:2;transition:transform 1s cubic-bezier(0.08,0.65,0.38,1.08) }
#NewsTitle p a b{ font-weight:400;margin-right:10px }
#news{ margin:50px 0 20px;position:relative;z-index:2 }
#news ul li{ /* float:left; *//* width:20%; */ }
#news .border{ margin: 10px 12.5px;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-content:center;align-content:center; }
#news .border .photo{ width:100% }
#news .border .photo a{ display:block;background-repeat:no-repeat;background-position:50% 50%;background-size: cover;background-color:#e4dde1;position:relative; }
#news .border .photo a img{ width:100% }
#news .border .photo .news-bottom{ position:absolute;top:0;left:0;color:#fff;background: rgba(0, 0, 0, 0.8);width:100%;height:100%;transition:all linear .3s;opacity:0; }
#news .border .photo .news-bottom .info{ position:absolute;width:50px;left:calc(50% - 56px);top:calc(50% - 52px);border:1px solid #fff;padding:20px 30px }
#news .border .photo .news-bottom .info p{ text-align:center;font-family:'Lusitana',serif;font-size:15px }
#news .border .photo .news-bottom .info p.year{ font-size:24px }
#news .border .photo .news-bottom .info span{ display:block;width:30%;height:1px;background:#fff;margin:6px auto 10px }
#news ul li .news-info{ width:100% }
#news .border .news-info h3{ overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;margin:20px }
#news .border .news-info h3 a{ color:#4b4b4b;font-size:18px }
#news .border .news-info p{ color:#727272;font-size:15px;line-height:20px;overflow:hidden;height:40px;margin:20px;display: none; }
#aboutFunc{ padding:150px 0;background-repeat:no-repeat;background-position:50% 50%;background-size:cover;overflow:hidden }
#aboutFunc #about{ float:right;width:calc(50% - 80px);margin-right:50px }
#aboutFunc #about h2{ color:#c35696;border-left:7px solid #c35696;padding-left:40px;font-size:22px;font-family:'cwTeXHei',serif;font-weight:400;animation-name:fadeInLeft }
#aboutFunc #about h2 b{ display:block;font-family:'Lusitana',serif;color:#e9c68b;font-size:80px;line-height:100%;margin-top:15px;font-weight:400 }
#aboutFunc .arts{ font-size:17px;line-height:190%;margin-left:45px;margin-top:30px;animation-delay:.7s }
#aboutFunc .more{ margin-left:45px;margin-top:40px;position:relative;display:inline-block;border-radius:25px;overflow:hidden;animation-delay:1s }
#aboutFunc .more a,#bookBox #BookTitle .index-title .more p a{ color:#e9c68b;display:inline-block;border:1px solid #e9c68b;border-radius:25px;padding:3px 30px;font-family:'Lusitana',serif;position:relative;z-index:2 }
#aboutFunc .more a b,#bookBox #BookTitle .index-title .more p a b{ margin-right:10px }
#youtube{ float:left;width:calc(50% - 100px);margin-left:50px;background-repeat:no-repeat;background-position:50% 50%;background-size:cover; }
.UTwo{ position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden }
.UTwo a{ display:block;width:100px;height:100px;text-align:center;line-height:100px;border-radius:50%;background:rgba(0,0,0,0.6);position:absolute;z-index:5;color:#dcdcdc;font-size:30px;left:calc(50% - 50px);top:calc(50% - 50px);transition:all linear .3s }
.UTwo a:hover{ width:110px;height:110px;line-height:110px;left:calc(50% - 55px);top:calc(50% - 55px);font-size:34px }
.UTwo iframe,.UTwo object,.UTwo embed{ position:absolute;top:0;left:0;width:100%;height:100% }
#pandr-title{ background-color:#944473;background-image:url(/images/21/index-book-title-bg.png);background-repeat:no-repeat;background-position:50% 50%;background-size:cover;padding:80px 0;color:#fff }
#pandr-title .webframe{ overflow:hidden;width:1160px }
#pandr-title .title-set{ float:left }
#pandr-title .title-set h2{ font-weight:400;font-size:24px }
#pandr-title .title-set h3{ color:#e9c68b;font-weight:400;font-size:50px;line-height:130% }
#pandr-title .small-talk{ float:right }
#pandr-title .small-talk p{ text-align:right;font-size:16px;color:#e19dc5;line-height:180%;width:280px }
.big-content{ background-image:url(/images/21/index-book-room-bg.png);background-repeat:no-repeat;background-position:0 50% }
#productWrap{ overflow:hidden;padding: 50px 0 0; }
#productWrap .tit h3 ,
#productWrap .tit p a{ color:#ffffff;text-shadow:0 0 2px #5a5a5a;text-align: center;margin-bottom: 70px; }
#serviceWrap .tit h3 ,
#serviceWrap .tit p{ color:#565656; }
#productWrap ul{ overflow:hidden; }
#productWrap ul li{ background:rgba(255, 252, 248, 0.24);margin: 10px 12.5px; }
#productWrap ul li .productPhoto a{ overflow:hidden;position:relative; }
#productWrap ul li .productPhoto a:after{ position:absolute;width:100%;height:100%;top:-100%;background:url(/images/11/index/logo.png) rgba(0,0,0,0.5) no-repeat 50%;display:block;content:"";transition:all 0.4s ease; }
#productWrap ul li:hover .productPhoto a:after{ top:0; }
#productWrap ul li h3 a{ margin:0;color:#5b5957;display:block;padding:15px 10px;text-align: center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:calc(100% - 20px);font-size:18px;line-height:22px; }
#productWrap ul li p.price{ padding:0 10px;overflow:hidden;height:22px; }
#productWrap ul li p.price span{ float:right;color:#000;font-size:12px; }
#productWrap ul li p.price span b{ font-size:18px;margin:0 3px;color:#c50202; }
#productWrap ul li p.price span.old{ float:left;color:#545454; }
#productWrap ul li p.price span.old b{ font-size:12px;margin:0;color:#545454; }
#productWrap ul li a.more{ color:#575757;display:block;text-align:center;font-weight:bold;background:#ddcebd;font-size:14px;line-height:130%;padding:5px 0;width:100px;display: none;margin:0 auto;border-radius:5px;margin:10px auto;border:1px solid #747474; }
#productWrap ul li a.more:hover{ background:#747474;color:#f8f8f8; }
#prolay .slick-prev{ left:calc(40% - 90px);top:50px;width:60px;height:60px;z-index:2 }
#prolay .slick-next{ left:calc(40% - 30px);right:inherit;top:50px;width:60px;z-index:2;height:60px }
#prolay .slick-prev:before,#prolay .slick-next:before{ color:#272727;font-size:60px }
#prolay .slick-prev:hover:before,#prolay .slick-prev:focus:before,#prolay .slick-next:hover:before,#prolay .slick-next:focus:before{ color:#c35696 }
#bookBox{ overflow:hidden;position:relative;background-repeat:no-repeat;background-position:50%;background-size:cover }
#bookBox #BookTitle{ position:absolute;width:463px;left:7.5%;top:calc(50% - 150px);z-index:5 }
#bookBox #BookTitle .index-title h3{ font-size:24px;font-weight:400;margin-bottom:10px }
#bookBox #BookTitle .index-title h2{ color:#e9c68b;font-family:'Lusitana',serif;font-size:70px;line-height:120%;font-weight:400;letter-spacing:.1em }
#bookBox #BookTitle .index-title >p{ font-size:17px;line-height:180%;margin-top:50px;width:60% }
#bookBox #BookTitle .index-title .more{ text-align:right;width:60%;margin-top:41px }
#bookBox #BookTitle .index-title .more p{ text-align:right }
#bookBox #book{ width:70%;margin-left:30% }
#bookBox #book li{ float:left;width:calc(100% / 3) }
#bookBox #book .photo{ overflow:hidden }
#bookBox #book .photo a{ position:relative }
#bookBox #book .info{ position:absolute;width:100%;height:100%;color:#fff;z-index: 3; }
#bookBox #book .info h3{ font-size:27px;line-height:110%;margin:50px;position:relative;z-index:1;text-shadow:0 0 3px #592543 }
#bookBox #book .info p{ line-height:110%;margin:50px;position:absolute;right:0;bottom:0;font-size:18px;z-index:1;text-shadow:0 0 2px #592543 }
#bookBox #book .info span{ vertical-align:super;display:inline-block;width:50px;height:1px;background:#fff;margin-right:30px }
#bookBox #book .photo .pic{ position:absolute;left:0;top:0;width:100%;height:100%;z-index: 1;transition:linear all .6s; }

/* aboutBox */
#aboutBox section { overflow: hidden;display: flex;margin: 0 auto;padding: 5vw 0 2vw;align-items: center;justify-content: space-between;flex-direction: row; }
#aboutBox .imgs { width: 50%;z-index: 1;height: 70vh; }
#aboutBox .imgs .list { height: 100%;background: no-repeat 50% / contain; }
#aboutBox .info { position: relative;width: 45%;z-index: 3; }
#aboutBox .info .bgTxt { text-align: left;  }
#aboutBox .info .stitle { position: relative;margin-bottom: 25px;padding: 0px 0 15px;font-size: 18px;color: #6D6D6D;font-weight: 400; }
#aboutBox .info .stitle:after{ position: absolute;top: 33%;width: 70px;height: 1px;display: inline-block;background: #cfcfcf;content: "";margin-left: 10px; }
#aboutBox .info article { line-height: 200%;width: 90%;text-align: justify;font-weight: 500;margin: 30px 0; }
#aboutBox #SeoStarRating {  margin: 15px 0 30px; text-align: right;  }
#aboutBox p.more { text-align: left; }

/* more */
p.more { padding: 20px 0; }
p.more a { position: relative;overflow: hidden;padding: 8px 50px;display: inline-block;align-items: center;letter-spacing: .06em;line-height: 30px;transition: 1.2s ease 1.8s;transform: translateY(0%);background-color: #d87d5b;border-radius: 10px; }
p.more a:before { position: absolute;width: 100%;height: 100%;background: #fff;top: 0;left: 0;transform: translateY(110%);transition: .4s cubic-bezier(.23,1,.32,1);content: "";opacity: .15; }
p.more a font { position: relative;display: inline-block;font-size: 14px;color: #fff;padding-bottom: 5px;z-index: 2;font-weight: 400; }
p.more a:hover:before {  transform: translateY(0);  }

/* photo_area */
#photo_area { background-image: url(/images/21/bg-body.png);padding: 3vw 0 4vw;border-radius: 50% 50% 0 0; }
#photo_area:after{ content:url(/images/44/img-paper-airplane2.png);position:absolute;left:-50px;top:25% }
#photo_area .coinn{ position:absolute;right:8%;top:-70px;animation-name:coin2;animation-direction:alternate;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:2s }
@keyframes coin2{ 0%{ top:-70px }
100%{ top:20px }
 }#photo_area .title_box{ position:relative;display:flex;justify-content:space-between;align-items:center }
#photo_area .title_box .more_btn{ position:absolute;bottom:3vw;right:0 }
#photo_area .sixbox{ display:flex;flex-wrap:wrap;justify-content:space-between }
#photo_area .item{ margin:20px 0;box-shadow:4px 0px 20px 0px rgb(0 0 0 / 5%);width:calc((100%/3) - 90px);display:flex;flex-direction:row;background:#fff;padding:30px;border-radius:30px;flex-wrap:wrap;justify-content:center;align-items:center;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#photo_area .item:hover{ transform:translateY(-5%) }
#photo_area .item img{ width:85px;aspect-ratio:1/1;object-fit:contain }
#photo_area .item h3{ font-size:28px;font-weight:600;color:#d87d5b;margin:30px 0 0 15px }
#photo_area .item:hover h3{ color:#51a095 }
#photo_area .item p{ text-align:justify;font-size:16px;color:#3a3939;letter-spacing:1px;width:100%;margin-top:15px }
#photo_area p.more a:not(:last-child){ margin-right:20px }
.list_box .info_box h3{ height:30px;font-weight:500;font-size:17px;color:#3a4856 }

/*product_area*/
#product_area { position: relative;padding: 90px 0px 30px;background-image: url(/images/21/bg-body.png); }
#product_area .more{ display:flex;justify-content:center;text-align:center;align-items:center;margin-top:20px }
#product_area .productBG02{ display:none }
#product_area .info{ display:flex;flex-direction:column }
#product_area .info .topnote{ display:flex;justify-content:flex-start;margin-bottom:0px;flex-direction:column;align-items:center }
#product_area .title_box{ position:relative }
#product_area .list_box{ margin:50px 0 40px 0 }
#product_area .applicationMList{ border:1px solid rgba(220,220,220,0.25) }
#product_area .applicationItem{ padding:0;margin:0;position:relative;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .applicationItem.title .item{ display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;padding:50px 25px 54px 25px }
#product_area .applicationItem.title .item .more_btn{ position:relative }
.more_btn.white span{ margin-left:20px }
#product_area .more_btn.white span img{ margin-left:10px;margin-bottom:6px }
#product_area .title_box .page_title{ margin-bottom:10px }
#product_area .applicationItem:not(.title) .item{ padding:0;width:100%;height:100%;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .item{ position:relative;overflow:hidden;border-radius:30px }
#product_area .item .Img:after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;background: #000000;opacity: 0.3;-webkit-transition:all .5s;-o-transition:all .5s;transition:all .5s;border-radius:30px}
#product_area .item h4{ font-weight:500;font-size:26px;line-height:220% }
#product_area .item h5{ width:80%;margin:auto;text-align:center }
#product_area .item .atag_item{ z-index:10;position:absolute }
#product_area .deck02{ position:absolute;right:-140px;z-index:-1;top:-190px }
#product_area .deck02 .Img{ font-size:180px;font-weight:100;opacity:0.1;font-family:'Poppins',sans-serif;letter-spacing:20.5px;text-transform:uppercase }
#product_area .Img{ position:absolute;width:100%;height:100%;top:0;left:0 }
#product_area .Img img{ width:100%;height:100%;object-fit:cover;border-radius:30px;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .item:hover .Img img{ transform:scale(1.08) }
#product_area .Txt{ width:calc(100% - 40px);height:100%;margin:auto;position:absolute;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:flex-start;-ms-flex-pack:center;justify-content:flex-start;color:#fff;padding:40px 20px 0;z-index:1;transform:translate(0%,0%);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .Txt .title{ display:inline-block;font-size:24px;color:#ffffff;letter-spacing:1px;font-weight:600;line-height:160%;position:relative;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .Txt .subtitle{ color:#fff;font-size:23px;font-weight:600;letter-spacing:1px;padding-top:0;padding-right:0px;position:relative;padding-bottom:30px;font-family:'Roboto',sans-serif }
#product_area .Txt .text{ height:85.5px;color:#e9eef5;font-size:15px;line-height:1.9;letter-spacing:0.7px;margin-top:17px }
#product_area .Txt .text{ font-size:14px }
#product_area .moreBtn{ padding:10px 0;opacity:0;transform:translate(0%,20%);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .moreBtn a{ position:relative;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;width:81px;color:#fff;font-weight:200;letter-spacing:0.12em;z-index:1;font-size:14px }
#product_area .moreBtn a::after{ content:"";position:absolute;top:calc(50% - 7.5px);right:-10px;width:20px;height:17px;background:url("/images/21/arrow_right_white.png") no-repeat center/cover;z-index:1;-webkit-filter:contrast(0) brightness(150%);filter:contrast(0) brightness(200%);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#product_area .productBG02::before{ content:'';position:absolute;height:420px;width:55px;bottom:-110px;left:270px;background:#038849;opacity:1;z-index:3;-webkit-transform:skewX(-30deg);-ms-transform:skewX(-30deg);transform:skewX(-30deg) }
.atag_item{ width:100%;height:100%;top:0;left:0 }

/* twoBox */
#twoBox{ display:flex;flex-wrap:wrap;justify-content:space-between }
#twoBox .boxx{ width:50%;position:relative }
#twoBox .boxx a{ position:absolute;top:0;left:0;width:100%;height:100%;z-index:3 }
#twoBox .boxx img{ height:350px;width:100%;object-fit:cover }
#twoBox .boxx .img:after,#service_area .custom_list >div:after{ content:'';width:100%;height:100%;position:absolute;top:0;left:0;background:rgb(65 63 63 / 20%);opacity:1;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
#twoBox .boxx:hover .img:after,#service_area .custom_list >div:after{ opacity:0 }
#twoBox .boxx .info{ position:absolute;bottom:90px;left:90px;z-index:2 }
#twoBox .boxx .info p{ color:#fff;font-size:17px;margin-bottom:10px }
#twoBox .boxx .info h3{ font-family:"Lato",sans-serif;font-size:33px;color:#fff;position:relative;display:flex;flex-direction:column;align-items:flex-start }
#twoBox .boxx .info h3 svg{ fill:#fff;width:30px;aspect-ratio:1/1;object-fit:contain;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;margin-top:20px }
#twoBox .boxx:hover .info h3 svg{ margin-left:20px }

@media screen and (min-width:1025px){ 
    #ssbanner .bxslider a:after{ content:'';background:rgba(0,0,0,0.8);position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;transition:linear all .3s }
    #ssbanner .bxslider a:hover:after,#news .border .photo:hover .news-bottom,#bookBox #book .info:hover:after{ opacity:1 }
    #news .border .photo .news-bottom .info{ transition:linear all .3s;transform:scale(0.8) }
    #news .border .photo:hover .news-bottom .info{ transform:scale(1) }
    #pandr-title,#NewsBox{ background-attachment:fixed }
    #bookBox #book .info:after{ position:absolute;width:calc(100% - 30px);height:calc(100% - 30px);left:15px;top:15px;background:rgba(96,37,70,0.73);content:'';display:block;transition:linear all .3s;opacity:0 }
    #bookBox #book .info:before{ position:absolute;width:calc(100% - 30px);height:calc(100% - 30px);left:15px;top:15px;background:rgba(220,204,214,0.49);content:'';display:block;transition:linear all .6s;opacity:0 }
    #bookBox #book .info:hover:before{ opacity:1;width:100%;height:100%;left:0;top:0 }
    #bookBox #book .photo:hover .pic{ transform:scale(1.2) }
    #aboutFunc .more p,#bookBox #BookTitle .index-title .more p,#NewsTitle p{ position:relative;overflow:hidden;display:inline-block;border-radius:25px }
    #aboutFunc .more:after,#bookBox #BookTitle .index-title .more p:after,#NewsTitle p:after{ content:'';position:absolute;width:100%;height:100%;left:0;top:0;background:#8c4747;display:block;z-index:1;transform:scale(0,1);transform-origin:right center 0;transition:transform 1s cubic-bezier(0.08,0.65,0.38,1.08) }
    #aboutFunc .more:hover:after,#bookBox #BookTitle .index-title .more p:hover:after,#NewsTitle p:hover:after{ transform:scale(1,1);transform-origin:left center 0 }
    #NewsTitle p:hover a{ color:#e9c68b;border:1px solid #e9c68b }
    #pandr-title .title-set{ width:calc(100% - 350px) }
 }
@media screen and (max-width:1680px){ 
    #ssbanner .bxslider .info{ width:270px;left:calc(50% - 135px);top:calc(50% - 135px);height:270px }
    #ssbanner .bxslider .info .circle{ width:151px;height:151px;font-size:50px;line-height:151px;margin:0 auto 20px }
    #ssbanner .bxslider .info span{ margin:10px auto }
    #NewsBox .webframe,#pandr-title .webframe,#product .webframe,#bookBox .webframe{ width:1280px }
    #bookBox #BookTitle{ left:5% }
    #bookBox #BookTitle .index-title h2{ font-size:65px }
 }
@media screen and (max-width:1440px){ 
    #bookBox #BookTitle .index-title h2{ font-size:60px }
    #pandr-title .title-set h3{ font-size:40px }
    #product_area .productBG::before{ right:160px }
    #product_area .productBG02::before{ left:120px }
 }
@media screen and (max-width:1366px){ 
    #NewsBox .webframe,#pandr-title .webframe,#product .webframe,#bookBox .webframe{ width:1000px }
    #NewsTitle .index-title h3{ font-size:50px }
    #NewsTitle .index-title:before,#NewsTitle .index-title:after{ width:131px;background-size:100% }
    #NewsTitle .index-title h2{ font-size:24px }
    #NewsTitle .more{ margin-top:30px }
    #news ul{ text-align:center }
    #news ul li{ width:calc((100% / 3) - 4px);display:inline-block;float:none;vertical-align:top }
    #bookBox #BookTitle .index-title h2{ font-size:52px }
    #bookBox #BookTitle{ width:350px }
 }
@media screen and (max-width:1280px){ 
    #ssbanner .bxslider .info{ width:230px;height:230px;left:calc(50% - 115px);top:calc(50% - 115px) }
    #ssbanner .bxslider .info .circle{ width:121px;height:121px;font-size:40px;line-height:121px }
    #ssbanner .bxslider .info h2{ font-size:20px }
    #ssbanner .bxslider .info h2:first-letter{ font-size:24px }
    #NewsBox .webframe,#product .webframe,#bookBox .webframe{ width:98% }
    #pandr-title .webframe{ width:90% }
    #aboutFunc .more a,#bookBox #BookTitle .index-title .more p a{ color:#fff;background:#d0b07b;border:1px solid #fff }
    #aboutFunc #about h2 b{ font-size:60px }
    #prolay .slick-next,#prolay .slick-prev{ top:initial;bottom:-20px;left:90px }
    #prolay .slick-prev{ left:30px }
    #bookBox #BookTitle{ margin-left:5%;width:90%;position:initial;margin-bottom:50px;margin-top:50px }
    #bookBox #book{ width:100%;margin-left:0 }
    #bookBox #BookTitle .index-title >p,#bookBox #BookTitle .index-title .more{ width:100% }
    #product_area .deck02 .Img{ font-size:110px }
    #product_area .deck02{ right:-80px;top:-130px }
    #product_area .info .topnote{ margin-bottom:30px }
 }
@media (min-width:1201px){ 
    #product_area .applicationMList{ display:none }
    #product_area .applicationItem:not(.title) .item:hover::before{ width:calc(100% + 0px);height:310px;opacity:1 }
    #product_area .applicationItem:not(.title) .item:hover .moreBtn a::after{ -webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-filter:initial;filter:initial }
    #product_area .moreBtn a:hover::after{ -webkit-animation:arrowAnimation 1s ease-out infinite;animation:arrowAnimation 1s ease-out infinite }
    .linkArea .link:hover + .btn1::before{ -webkit-animation:btnHover 1.4s linear infinite forwards;animation:btnHover 1.4s linear infinite forwards }
    .btn1:hover::before{ -webkit-animation:btnHover 1.4s linear infinite forwards;animation:btnHover 1.4s linear infinite forwards }
    .btn1:hover a::before{ -webkit-transform:rotate(-45deg);transform:rotate(-45deg) }
    #product_area .more_btn.white a:hover font{ color:#ffffff }
    #product_area .item:hover .Txt{ transform:translate(0%,0%) }
    #product_area .item:hover .Txt{  }
    #product_area .item:hover .Txt .title{ transform:translate(0%,30%) }
    #product_area .applicationItem .item::after{ position:absolute;content:"";width:100%;height:100%;bottom:0;right:0 }
    #product_area .applicationItem .item::before{ position:absolute;top:0;left:0;z-index:1;content:"";width:100%;height:150px;display:block;pointer-events:none;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
    #product_area .applicationItem:not(.title) .Txt:hover{ transform:translate(0%,-90%) }
    #product_area .applicationItem:not(.title) .item:hover .text{ color:#3e3e3e }
    #product_area .applicationItem:not(.title) .item:hover .moreBtn a{ color:#ffffff }
    #product_area .applicationItem:not(.title) .item:hover .moreBtn{ opacity:1 }
    #product_area .applicationItem:first-child{ grid-row-start:1;grid-row-end:4 }
    #product_area .applicationItem:nth-child(2){ grid-column-start:2;grid-column-end:4 }
    #product_area .applicationItem:last-child{ grid-column-start:3;grid-row-start:2;grid-row-end:4 }
    #product_area .applicationList{ display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);grid-gap:25px;height:770px;transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out }
 }
@media screen and (max-width:1200px){ 
    #product_area{ padding:74px 0 33px }
    #product_area .applicationList{ display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);grid-gap:25px;height:530px }
 }
@media screen and (max-width:1024px){ 
    #pandr-title .title-set{ float:none;width:100% }
    #pandr-title .small-talk{ float:none;width:100% }
    #pandr-title .small-talk p{ width:100% }
    #product_area .productBG::before,#product_area .productBG02::before{ display:none }
    #product_area .title_box font::after{ width:110px;right:-130px }
    #product_area .item h5{ width:100% }
 }
@media screen and (min-width:981px){ 
    #news ul li:nth-child(even) .news-info{  }
 }
@media screen and (max-width:980px){ 
    #photo_area .item{ width:calc((100% / 2) - 70px) }
    #news .border .news-info p,#news .border .news-info h3{ margin:20px 0 }
    #pandr-title{ padding:60px 0 }
    #pandr-title .title-set h3,#bookBox #BookTitle .index-title h2{ font-size:35px;line-height:110% }
    #bookBox #BookTitle .index-title h2{ letter-spacing:0 }
    #prolay .slick-next,#prolay .slick-prev{ left:calc(100% - 90px) }
    #prolay .slick-prev{ left:calc(100% - 150px) }
    #bookBox #book .info h3{ font-size:22px;margin:40px }
    #bookBox #book .info p{ margin:40px;font-size:15px }
    #product_area .Txt .title{ font-size:19px }
    #product_area .Img{ right:30px }
    #product_area .applicationItem{ border-left:1px solid rgba(220,220,220,0.25) }
    #product_area .applicationItem.title .item .more_btn{ text-align:center }
    #product_area{ background-position:70% 50% }
    #product_area .item{ height:auto }
    #product_area .applicationItem{ width:calc(100% / 1);padding:0px 0px 0px 0px }
 }
@media (min-width:961px){ 
    #product_area .applicationMList::before{ content:"";position:absolute;top:0;left:calc(50% - 0.5px);width:1px;height:100%;background-color:rgba(220,220,220,0.25) }
 }
@media screen and (max-width:768px){ 
    #aboutBox section{ flex-direction:column }
    #aboutBox .imgs{ width:90%;height:45vh }
    #aboutBox .info{ width:90%;margin-top:60px }
    #product_area .applicationList{ display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);grid-gap:25px;height:670px }
    #twoBox{ display:flex;flex-direction:column }
    #twoBox .boxx{ width:100% }
    #twoBox .boxx img{ height:280px }
 }
@media screen and (max-width:640px){ 
    #ssbanner .bxslider .info .circle{ width:100px;height:100px;font-size:32px;line-height:100px }
    #ssbanner .slick-slide img{ height:165px }
    #news ul li{ width:calc(50% - 4px) }
    #NewsTitle .index-title h3{ font-size:30px }
    #NewsTitle .index-title h2{ font-size:20px }
    #NewsTitle .index-title:before,#NewsTitle .index-title:after{ width:101px }
    #NewsTitle .more{ margin-top:20px }
    #news .border{ margin:10px }
    #NewsBox:after{ background-size:50% }
    #pandr-title .title-set h2,#bookBox #BookTitle .index-title h3{ font-size:18px }
    #pandr-title .small-talk{ float:none;width:100%;clear:both;text-align:right }
    #pandr-title .small-talk p{ font-size:8pt }
    #pandr-title{ padding:40px 0 }
    #prolay .slick-next,#prolay .slick-prev{ left:calc(100% - 60px);width:40px;height:40px;bottom:7px }
    #prolay .slick-prev{ left:calc(100% - 100px) }
    #prolay .slick-prev:before,#prolay .slick-next:before{ font-size:40px }
    #bookBox #book li{ float:left;width:50% }
    #bookBox #BookTitle .index-title >p{ margin-top:0;font-size:.8rem }
    #productWrap ul li{ width:48% }
    #photo_area .title_box{ display:flex;flex-direction:column }
    #product_area .info{ display:flex;flex-direction:column;align-items:flex-start }
    #product_area .info .topnote{ width:auto;margin-bottom:0px }
    #product_area .list_box{ width:calc(100% - 0px);margin:40px 0 20px 0 }
    #product_area .deck02 .Img{ font-size:70px;letter-spacing:10.5px }
    #product_area{ padding:50px 0 20px }
    #product_area .title_box font::after{ display:none }
    #product_area .applicationList{ display:grid;grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(5,1fr);grid-gap:20px;height:980px }
 }
@media screen and (max-width:480px){ 
    #ssbanner .bxslider a img{ padding:30px 0 }
    #ssbanner .bxslider .info{ width:90%;left:5% }
    #aboutFunc #about{ width:calc(100% - 60px);margin-top:50px;margin-right:30px }
    #youtube{ width:calc(100% - 60px);margin-left:30px }
    #aboutFunc #about h2{ padding-left:25px }
    #aboutFunc .arts,#aboutFunc .more{ margin-left:25px }
    #aboutFunc{ padding:50px 0 }
    #bookBox #book .info h3{ font-size:20px;margin:20px }
    #bookBox #book .info p{ margin:20px;font-size:12px }
    #productWrap ul li p.price span.old{ font-size:7pt;margin-top:4px }
    #productWrap ul li p.price span.old b{ font-size:7pt }
    #aboutFunc #about h2 b{ font-size:40px }
    #pandr-title .title-set h3,#bookBox #BookTitle .index-title h2{ font-size:28px }
    #ssbanner .slick-slide img{ height:190px }
    #photo_area .item{ width:100%;margin:6px 0 }
    #photo_area .item img{ width:60px }
    #product_area .Img{ right:20px } }
@media screen and (max-width:450px){ 
    #ssbanner .slick-slide img{ height:161px }
    #twoBox .boxx .info{ bottom:40px;left:50px }
    #twoBox .boxx img{ height:200px } }
@media screen and (max-width:375px){ 
    #ssbanner .slick-slide img{ height:135px } }
@media screen and (max-width:325px){ 
    #ssbanner .slick-slide img{ height:105px } }