@import url('/css/icheck/icheck-material-custom.css');
	
	

/* wrap */
#wrap {position: absolute;z-index: 10;width: 72%;height: 64%;padding: 10px;top: 0;overflow-x: hidden;/* overflow-y: auto; */left: 50%;transform: translate(-50%, 0%);}
#wrap::-webkit-scrollbar-track{background-color:rgb(255 255 255 / 21%)}
#wrap::-webkit-scrollbar{width:2px;background-color:rgb(0 0 0 / 13%)}
#wrap::-webkit-scrollbar-thumb{background-color:#838383}

/* detail_title */
#detail_title {width: 100%;margin-bottom: 30px;}
#detail_title h2 {font-size: 24px;color: #243139;}
#detail_title h2:after {position: absolute;width: 100%;height: 1px;background: #474747;bottom: -2px;content: "";top: 50%;left: 75%;transform: translate(-50%, -50%);}

/* waylink */
.waylink {margin: 15px 0 30px;display: none;}
.waylink ol li, .waylink ol li a { font-size: 13px; color: #6d6d6d; }
.waylink ol li:after { margin: 0 10px; display: inline-block; color: #6d6d6d; content: "|"; }
.waylink ol li:last-child:after { margin: 0; content: ""; }

/* aside */
aside {padding: 0 10px 0 0;width: 240px;margin-top: 0px;}
aside h4, aside ul li>div { position: relative; }
aside li a {padding: 10px 10px;display: block;font-weight: bold;font-size: 17px;color: #2f3e47;}
aside b[data-action="sideOpen"] { position: absolute; height: 100%; width: 40px; display: flex; justify-content: center; align-items: center; top: 0; right: 0; }
aside b[data-action="sideOpen"] i:before, aside b[data-action="sideOpen"] i:after { width: 15px; height: 1px; background: #747474; display: block; content: ""; }
aside b[data-action="sideOpen"] i:after { -webkit-transform: translateY(-1px) rotate(90deg); transform: translateY(-1px) rotate(90deg); -webkit-transition: all .2s linear; transition: all .2s linear; }
aside b[data-action="sideOpen"] i.fa-minus:after { -webkit-transform: translateY(-1px) rotate(0deg); transform: translateY(-1px) rotate(0deg); }
aside .action h4 a {color: #000000;}
aside .action h4 a::before {content: "";position: absolute;top: 53%;right: 30px;width: 10px;height: 10px;border-left: 2px solid rgb(0 0 0 / 50%);border-bottom: 2px solid rgb(0 0 0 / 50%);-webkit-transform: translateX(-50%) translateY(-50%) rotate(-135deg);transform: translateX(-50%) translateY(-50%) rotate(-135deg);}
aside .action h4 b[data-action="sideOpen"] i:before, aside .action h4 b[data-action="sideOpen"] i:after { background: #fff; }
aside>ul>li ul { margin-left: .5em; display: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
aside>ul>li li a { padding: 8px 40px 8px 10px; font-size: 16px; color: var(--dark_gary); }
aside li.action>ul { display: block; }

#sub_banner .banner_tit{display: none;}


/* content_wrap */
#content_wrap {width: 1%;flex: auto 1;/* margin-top: 3vw; */}
#content_wrap  .time{display: none;}

/* list_box */
.list_box li { margin-top: 10px; margin-bottom: 10px; }
.list_box li h3 {height: 30px;font-weight: 500;font-size: 20px;letter-spacing: 1px;}

/* describe */
#describe {margin-bottom: 1vw;}
#describe * { vertical-align: bottom; }

/* article_list */
#article_list img {width: 100%;aspect-ratio: 6 / 3;}
#article_list .info_box {padding: 20px 10px;}
#article_list .info_box article { font-weight: 300; }
#article_list .info_box {background-image: none;background-color: rgb(31 44 92);letter-spacing: 1.3px;position: relative;}
#article_list li h3{
    color: #fff;
    font-size: 18px;
}

/* news_list */
#news_list li { padding-bottom: 30px; }
#news_list li img { height: 320px; }
#news_list li .info_box { padding: 15px; width: calc(100% - 70px); box-shadow: 0 0 10px rgba(var(--black-rgb), .3); left: 20px; bottom: 0; }
#news_list li .info_box p * { font-weight: 100; font-size: 14px; }
#news_list li .info_box p a { margin-right: 10px; padding: 0 2px; max-width: calc(100% - 82px); height: 23px; z-index: 2; }

/* pagenav */
#pagenav {padding: 50px 0 20px;display: flex;justify-content: center;align-items: center;/* position: absolute; */width: 100%;/* left: 50%; *//* top: 40%; *//* transform: translate(-50%, 40%); */z-index: 10;position: relative;}
#pagenav a, #pagenav strong { margin: 0 4px; display: flex; justify-content: center; align-items: center; border-radius: .2rem; font-size: 15px; color: #808080; }
#pagenav a, #pagenav strong { margin: 0 10px; display: inline-block; font-weight: 400; vertical-align: middle; }
#pagenav a:first-child, #pagenav a:last-child { line-height: 9px; }
#pagenav strong { color: var(--primary); }
#pagenav a[class^="page-"] {float: left;width: calc(100% - 20px);display: block;}
#pagenav a[class^="page-"] font { width: calc(100% - 22px); display: inline-block; vertical-align: text-top; }
#pagenav a[class^="page-"] i { margin: 0 10px 0 0; display: inline-block; }
#pagenav a.page-next { float: right; text-align: right; }
#pagenav a.page-next font { text-align: right; }
#pagenav a.page-next i { margin: 0 0 0 10px; }

/* product_list */
#product_list {margin-top: 0px;grid-template-columns: repeat(6, 1fr);grid-gap: 55px 0;}
#product_list li>div {margin: 0 10px;background: #fff;border-radius: .5rem;}
#product_list li img {width: 100%;aspect-ratio: 1 / 1.4;object-fit: cover;}
#product_list li .info_box {padding: 15px 15px;border-bottom: 1px #cccccc solid;margin-top: 0;}
#product_list li .info_box p { font-weight: 300; font-size: 16px; }
#product_list li .info_box h3 {height: 80px;font-weight: 500;font-size: 16px;color: #3c3c3c;-webkit-line-clamp: 3;}
#product_list li .price_box {padding: 10px 15px;display: flex;justify-content: space-between;align-items: center;}
#product_list li .price_box .price {font-weight: 500;font-size: 15px;color: #222;}
#product_list li .price_box a { font-weight: 500; font-size: 14px; color: #3a4351; z-index: 6; }
#product_list .slick-prev{width: 44px;height: 85px;left: -50px;}
#product_list .slick-next{width: 44px;height: 85px;right: -50px;}
#product_list .slick-prev:before{content:url(/images/00/arrow-left.png);opacity: 1;}
#product_list .slick-next:before{content:url(/images/00/arrow-right.png);opacity: 1;}

/* product_add */
#product_add { margin: 40px 0; border: 1px #e8e8e8 solid; }
#product_add .tit_box { padding: .5em 3%; background: #f5f5f5; font-size: 20px; color: #363636; }
#product_add .body_box { padding: 3%; }

/* add_product_list */
#add_product_list { grid-template-columns: repeat(2, 1fr); grid-gap: 40px 25px; }
#add_product_list .img_box { margin-right: 40px; width: 100px; height: 100px; }
#add_product_list .img_box img { width: 100%; height: 100%; }
#add_product_list .info_box h3 { font-weight: 500; font-size: 16px; color: #262626; }
#add_product_list .info_box .price_box p { font-weight: bold; font-size: 14px; color: #262626; }
#add_product_list .info_box .price_box p.original { text-decoration: line-through; color: #949494; }

/* other_product_box */
#other_product_box{}
#other_product_box .tit_box {margin-top: 3%;margin-bottom: 3%;padding-bottom: 5px;border-bottom: 1px #c2c2c2  solid;text-align: center;font-weight: bold;font-size: 28px;color: #252525;}

/* book_list */
#book_list { display: flex; flex-wrap: wrap; }
#book_list li h3 { text-align: inherit; margin-bottom: 10px; }
#book_list li p { color: #919191; overflow: hidden; height: 54px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
#book_list .row img { width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top; border-radius: 25px; }
#book_list .row .info_box { padding: 20px 15px 30px; width: calc(100% - 0px); background: -webkit-linear-gradient(top, transparent 0, rgba(var(--black-rgb), .01) 2%, rgba(var(--black-rgb), .8) 90%); background: linear-gradient(to bottom, transparent 0, rgba(var(--black-rgb), .01) 2%, rgba(var(--black-rgb), .8) 90%); bottom: 0; left: 0; }


/* search_list */
#search_list { grid-template-columns: repeat(4, 1fr); grid-gap: 55px 0; }
#search_list li>div { margin: 0 15px; background: #fff; border-radius: .5rem; box-shadow: 0 0 30px rgb(0 0 0 / 20%); }
#search_list li img { width: 100%; height: 300px; }
#search_list li .info_box { padding: 5px 35px 10px; border-bottom: 1px #a5a5a5 solid; }
#search_list li .info_box h3 { height: 30px; font-weight: 500; font-size: 19px; color: #3a4351; }
#search_list li .more_box { padding: 10px 35px; display: flex; justify-content: flex-end; font-weight: 300; font-size: 15px; color: #222; }

/* community */
#community li { margin-right: 5px; }
#community li, #community li * { line-height: 100%; }
#community li .fb_iframe_widget { display: block !important; }

/* form_box */
.form_box{display:flex;flex-wrap:wrap;justify-content:space-between;flex-direction: column;align-items: center;}
.form_box .description_box{margin-bottom: 80px;width: 100%;text-align: center;}
#form1{width:55%}
.form_box p.note{display:flex;align-items:flex-end;position:relative;margin-bottom:27px;padding-bottom:20px;justify-content: center;}
.form_box p.note:after{content:'';position:absolute;bottom:-2px;width:30px;height:2px;background: #000000;left: 50%;transform: translate(-50%, -50%);}
.form_box p.note b{font-size:20px;color:var(--primary)}
.form_box p.note b{color: var(--complement);position:relative;font-size: 22px;font-weight: 500;}
.form_box p.note b::first-letter{color:var(--primary)}
.form_box p.note .red,.form_box p label span{color:#e82929}
.form_box p label{color:#000;margin-bottom:5px}
.form_box p{margin-bottom: 20px;width:calc((100% / 1) - 0px);}
input,textarea{padding:10px 10px;background-color: rgb(255 255 255 / 45%);width: calc(100% - 0px);}
.form_box p select{background: url(/images/00/arrow3.png) no-repeat scroll 100% center rgb(255 255 255 / 45%);background-repeat: no-repeat;background-position: 98% 50%;padding: 15px 10px;}
.form_box input#Checknum { margin-right: 10px; width: 100px; }
.form_box #btnOK {padding: 5px 10px;color: #fff;width: 150px;line-height: 220%;height: 50px;background-color: #407dab;border-radius: 25px;}

/* lodbg */
[data-action="loader"] {width: 100vw;height: 100vh;background: rgba(var(--black-rgb), .3);line-height: 100vh;top: 0;left: 0;opacity: 0;z-index: -1;display: none;}
[data-action="loader"] .loader_circle { border: 2px rgba(var(--black-rgb), .6) solid; border-left-color: rgba(var(--white-rgb), .4); }
#lodbg { opacity: 1; z-index: 99999; }

@keyframes circle { 0%{ transform: rotate(0); } 100% { transform: rotate(360deg); } }
@-webkit-keyframes circle { 0%{ -webkit-transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); } }
@-moz-keyframes circle { 0%{ -webkit-transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); } }
@-o-keyframes circle { 0%{ -webkit-transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); } }

#top_title .m_title {display: flex;flex-direction: column;align-items: center;margin-bottom: 40px;}
#top_title .description_box { text-align: center; }

#contentBox { width: 80%; margin: auto; }

@media screen and (min-width: 1501px) {
	#wrap:before { width: calc((100% - 1440px) / 2); }
}
@media screen and (max-width: 1500px) {
	#wrap{
    width: 85%;
}
	.workframe, .workframe_s{
    width: 100%;
}
}



@media screen and (min-width: 1281px) {
	#wrap {padding-bottom: calc(10px + 0vmax);margin-top: 120px;padding: 0 30px 0 0;}
	aside h4:hover a {background: rgb(31 44 92);color: #fff;}
	aside h4:hover b[data-action="sideOpen"] i:before, aside h4:hover b[data-action="sideOpen"] i:after { background: #fff; }
aside .action h4:hover a::before{
    border-left: 2px solid rgb(255 255 255 / 50%);
    border-bottom: 2px solid rgb(255 255 255 / 50%);
}
}
@media screen and (max-width: 1280px) {
	#search_list { grid-template-columns: repeat(3, 1fr); }
	#wrap .workframe {padding: 0px 0 50px;}
    #wrap{top: 100px;width: 90%;height: 58%;}
	aside {position: relative;padding: 0;width: 100%;top: 0px;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);z-index: 1;}
	aside #sidebtn {padding: 7px 10px;width: 100%;background: #1a3459;border: 1px solid var(--light_gary);z-index: 12;}
	aside #sidebtn font{
    color: #fff;
}
	aside #sidebtn i {position: absolute;top: 50%;right: 10px;-webkit-transform: translateY(-40%);transform: translateY(-40%);color: #fff;}
	aside #sidebtn[data-type="2"] i { -webkit-transform: rotate(180deg) translateY(40%); transform: rotate(180deg) translateY(40%); }
	aside>ul { position: absolute; overflow: hidden; margin-top: 1px; width: 100%; height: 0; background: var(--light); border: 0 var(--light_gary) solid; left: 0; z-index: 11; -webkit-transform: translateY(-30px); transform: translateY(-30px); }
	aside>ul.open { height: auto; border-width: 1px; -webkit-transform: translateY(5px); transform: translateY(5px); }
	aside ul li { position: relative; border-bottom: 0; }
	aside ul li h4 a { padding: 10px; text-align: center; }
	aside>ul>li ul.subUL { overflow: hidden; width: 100%; height: 0; background: var(--light); top: 0; left: 0; }
	aside>ul.open>li[data-type="2"]>ul { position: relative; height: auto; top: auto; bottom: 0; opacity: 1; }
#detail_title {width: 100%;margin-bottom: 10px;}
	#content_wrap {width: 100%;flex: inherit;margin-top: 20px;}
	#detail_title h2 {font-size: 22px;padding: 0px 0 10px;}
	#detail_title h2:before { left: 0; }
	#detail_title h2:after {
    display: none;
}
	#contentBox { width: 100%; margin: auto; }
	#form1{width:100%}
}
@media screen and (max-width: 980px) {
	#product_list { padding: 0 30px; grid-template-columns: repeat(2, 1fr); }
	#book_list { display: flex; flex-direction: column; }
	#book_list .row img { height: 400px; }
	#search_list li img { height: 30vw; }
	#pagenav{padding: 30px 0 10px;}
}
@media screen and (max-width: 768px) {
	#search_list { grid-template-columns: repeat(2, 1fr); }
	#search_list li img { height: 40vw; }
#product_list .slick-prev{left: -30px;}
#product_list .slick-next{right: -30px;}
}
@media screen and (max-width: 640px) {
	#wrap {padding-top: 0;top: 110px;height: 55%;}
	#detail_title h2 {font-size: 24px;padding: 0px 0 10px;}
    #describe {margin-bottom: 3vw;}
}
@media screen and (max-width: 550px) {
	#wrap .workframe {padding: 0px 0 30px;}
	#product_list { padding: 0 10px; grid-template-columns: repeat(1, 1fr); }
	#book_list .row img { height: 300px; }
	#search_list { padding: 0 10vw; grid-template-columns: repeat(1, 1fr); }
	#search_list li img { height: 55vw; }
}