@charset "UTF-8";

body{--spacing:2em;}
@media only screen and (max-width:480px){
	body{--spacing:1.5em;}
}

#SearchContent{flex:auto;display: flex;}
#SearchContent>.inner{flex:auto;max-width:var(--MaxContentWidth);margin-inline:auto;padding:var(--spacing);box-sizing:border-box;display:flex;flex-direction:column;gap:var(--spacing);}


#search_container{display:flex;flex-direction:column;gap:var(--spacing);}
#search_container:only-child{width:60em;max-width:100%;margin-inline:auto;}
#search_container .search_empty{padding:unset;margin-block-end:calc(var(--spacing) * -1);}
#search_container .search_empty img{width:min(30em,100%);}
#search_container .search_recommend{grid-column:1/-1;}


.search_input_wrp{--CPT-US:4em;height:var(--CPT-US);position: relative;z-index: 2;}
.search_input{width:min(60em,100%);display:grid;grid-template-columns:1fr auto;--background-focus-color:transparent !important;}
.search_input.focus{--border-color:var(--SiteTHM);height:auto;background-color:var(--background-color-L0,#fff);}
.search_input:not(.focus) .search_expand_info{display:none;}
.search_input:not(.focus) .btw.search{--color:var(--body-text-color-a50,rgba(0 0 0/50%));--background-color:transparent;--border-color:transparent;--shadow-color:transparent;}
.search_input .btw.search{--CPT-US:3em;margin-inline-end:.5em;}

.search_expand_info{grid-column:1/-1;display:flex;flex-direction:column;gap:1.5em;padding:1.5em;box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 -1px 0;}
.search_recommend{display:flex;flex-direction:column;align-items:baseline;gap:1em;}
.search_recommend .title{color:var(--body-text-color-a50,rgba(0 0 0/50%));}
.search_recommend .list{display:flex;flex-wrap:wrap;gap:.5em;}
.search_recommend .item{padding:.5em 1em;border-radius:var(--CPT-BDR);background-color:var(--body-text-color-a5,rgba(0 0 0/5%));cursor:pointer;transition:color 300ms,background-color 300ms;}
.search_recommend .item:hover{color:var(--SiteTHM);background-color:var(--SiteTHM-A10);}
.search_recommend .item>span{display:block;max-width:12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.search_autofill{display:flex;flex-direction:column;gap:.25em;}
.search_autofill .link{display: grid;grid-template-columns:1fr auto;align-items:center;gap:1em;height:3.5em;padding-block:.75em;padding-inline:1.5em 1em;box-sizing:border-box;border-radius:var(--CPT-BDR);color:inherit;background-color:var(--body-text-color-a5,rgba(0 0 0/5%));cursor:pointer;transition:color 300ms,background-color 300ms;}
.search_autofill .link::before{content:attr(icon);font-size:1.5em;opacity:.5;order:9;}
.search_autofill .link:hover{color:var(--SiteTHM);background-color:var(--SiteTHM-A10);}
.search_autofill .link>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.search_recommend{display:flex;flex-wrap:wrap;align-items:baseline;gap:1em;}
.search_recommend .title{color:var(--body-text-color-a50,rgba(0 0 0/50%));}
.search_recommend .list{display:flex;flex-wrap:wrap;gap:.5em;}
.search_recommend .item{padding:.5em 1em;border-radius:var(--CPT-BDR);background-color:var(--body-text-color-a5,rgba(0 0 0/5%));cursor:pointer;transition:color 300ms,background-color 300ms;}
.search_recommend .item:hover{color:var(--SiteTHM);background-color:var(--SiteTHM-A10);}
.search_recommend .item>span{display:block;max-width:12em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}




/* search result */
#search_result_container{display:flex;flex-direction:column;flex:auto;}
@media only screen and (max-width:480px){
	#search_result_container{margin-inline:calc(var(--spacing) * -1);}
}

#search_result_tabs{display:flex;padding-block-start:1px;padding-inline:var(--spacing);}
#search_result_tabs .tab{flex:none;display:flex;align-items:center;height:var(--CPT-US);padding-inline:var(--spacing);border-start-start-radius:var(--CPT-BDR);border-start-end-radius:var(--CPT-BDR);cursor:pointer;position:relative;transition:background-color 300ms;}
#search_result_tabs .tab::before{content:'';display:block;height:.25em;position:absolute;inset-block-end:0;inset-inline:var(--spacing);z-index:1;transition:background-color 300ms;}
#search_result_tabs .tab span{display:block;font-weight:var(--CPT-FW-B);text-transform:uppercase;}
#search_result_tabs .tab.on{background-color:var(--background-color-L3,#fff);}
#search_result_tabs .tab.on::before{background-color:var(--SiteTHM);}
#search_result_tabs .tab[data-item-counter]:not([data-item-counter=""],[data-item-counter="0"]){display:grid;grid-template-columns:1fr auto;align-items:center;gap:1em;}
#search_result_tabs .tab[data-item-counter]:not([data-item-counter=""],[data-item-counter="0"])::after{content:attr(data-item-counter);display:block;min-width:1.5em;max-width:2em;height:2em;line-height:2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;}
#search_result_tabs .tab.loading::after{content:'';width:2em;height:2em;background:url("/skin/store/images/placeholder/loading-e68d1a61.svg") no-repeat center/contain;color:transparent;filter:invert(var(--brightness-filter,0));}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#search_result_tabs{overflow:hidden;overflow-x:auto;}
	#search_result_tabs::-webkit-scrollbar{display:none;}
	#search_result_tabs:not(.scroll){scroll-snap-type:x mandatory;}
	#search_result_tabs:not(.scroll) .tab.on{scroll-snap-align:center;}
}


#search_result_content{display:flex;flex-direction:column;gap:var(--spacing);padding:var(--spacing);border-radius:1em;background:var(--background-color-L3,#fff);flex:auto;}
#search_result_content>div:not(.show){display:none;}
#search_result_content>div{flex:auto;}
#search_result_content>div>div.load{margin:auto;}
#search_result_content .pager_wrp{margin-block-start:auto;}
#search_result_content .search_empty{padding:unset;margin:auto;}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){}


/* game list */
#game_list{display:flex;flex-direction:column;gap:var(--spacing);}
#game_list .list{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-size,28em),1fr));align-items:start;gap:1em;}
#game_list .list .item{display:flex;flex-direction:column;border-radius:.5em;box-shadow:var(--body-text-color-a10,rgba(0 0 0/10%)) 0 0 0 1px inset;background:var(--body-text-color-a5,#fff);overflow:hidden;}
#game_list .list .game{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1.25em;padding:1.25em;color:inherit;transition:background-color 300ms;}
#game_list .list .game:hover{background-color:var(--SiteTHM-A10);}
#game_list .list .cover{width:var(--item-link-img-size,5em);height:var(--item-link-img-size,5em);background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a10,rgba(0 0 0 / 10%)) 0 0 0 1px;border-radius:25%;}
#game_list .list .cover>img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;}
#game_list .list .info{display:flex;flex-direction:column;gap:.25em;}
#game_list .list .name{font-weight:var(--CPT-FW-B);}
#game_list .list .publisher{color:var(--body-text-color-a50,rgba(0 0 0/50%));}
#game_list .list .categories{display:flex;flex-wrap:wrap;align-items:center;padding:.75em;box-shadow:var(--body-text-color-a5,rgba(0 0 0 / 5%)) 0 -1px 0;}
#game_list .list .category{color:inherit;padding:.5em .75em;border-radius:var(--CPT-BDR);transition:color 300ms,background-color 300ms;}
#game_list .list .category:hover{color:var(--SiteTHM);background-color:var(--SiteTHM-A10);}
/* #game_list .list .category span{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.5em;} */
/* #game_list .list .category span::before{content:var(--i);display:block;font-size:1.5em;opacity:.5;} */
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#game_list .list{--column-size:20em;}
}


/* card list */
#card_list{display:flex;flex-direction:column;gap:var(--spacing);}
#card_list .list{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-size,28em),1fr));align-items:start;gap:1em;}
#card_list .list .item{display:flex;flex-direction:column;border-radius:.5em;box-shadow:var(--body-text-color-a10,rgba(0 0 0/10%)) 0 0 0 1px inset;background:var(--body-text-color-a5,#fff);overflow:hidden;}
#card_list .list .card{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:1.25em;padding:1.25em;color:inherit;transition:background-color 300ms;}
#card_list .list .card:hover{background-color:var(--SiteTHM-A10);}
#card_list .list .cover{width:var(--item-link-img-size,5em);height:var(--item-link-img-size,5em);background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a10,rgba(0 0 0 / 10%)) 0 0 0 1px;border-radius:25%;}
#card_list .list .cover>img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;}
#card_list .list .info{display:flex;flex-direction:column;gap:.25em;}
#card_list .list .name{font-weight:var(--CPT-FW-B);}
#card_list .list .region{color:var(--body-text-color-a50,rgba(0 0 0/50%));}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#card_list .list{--column-size:20em;}
}


/* item list */
#item_list{display:flex;flex-direction:column;gap:var(--spacing);}
#item_list .list{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-size,15em),1fr));align-items:start;gap:var(--spacing);}
#item_list .unit{display:flex;flex-direction:column;gap:1em;}

#item_list .item{display:flex;flex-direction:column;gap:1em;color:inherit;}
#item_list .item:hover{color:var(--SiteTHM);}
#item_list .item .img{background:var(--body-background-color,#fff);box-shadow:var(--body-text-color-a10,rgba(0 0 0/10%)) 0 0 0 1px;border-radius:.5em;overflow:hidden;aspect-ratio:1/1;}
#item_list .item .img img{display:block;width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;}
#item_list .item .info{}
#item_list .item .name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;max-height:3em;overflow:hidden;text-overflow:ellipsis;hyphens:auto;}

#item_list .data{display:flex;flex-wrap:wrap;gap:.5em 1em;margin-block-start:auto;align-items:center;}
#item_list .data .price{font-size:1.166667em;font-weight:var(--CPT-FW-B);line-height:1;color:var(--SiteTHM);}
#item_list .data .package_unit{display:flex;align-items:center;gap:1em;color:var(--body-text-color-a50,rgba(0 0 0/50%));}
#item_list .data .package_unit::before{content:'/';display:block;color:var(--body-text-color-a25,rgba(0 0 0/25%));}

#item_list .seller{display:grid;grid-template-columns:1fr auto;gap:1em;width:fit-content;}
#item_list .seller .name{color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#item_list .seller .name:hover{color:var(--SiteTHM);}
#item_list .seller .level{}
#item_list .seller [data-seller-level]{}
#item_list .seller [data-seller-badge]{}
@media only screen and (max-width:1280px){
	#item_list .list{--column-size:12.5em;}
	#item_list .data .price{font-size:1em;}
}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#item_list .list{--column-size:12em;}
}


/* seller list */
#seller_list{display:flex;flex-direction:column;gap:var(--spacing);}
#seller_list .list{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-size,28em),1fr));align-items:start;gap:1em;}

#seller_list .list .unit{display:flex;flex-direction:column;border-radius:.5em;box-shadow:var(--body-text-color-a10,rgba(0 0 0 / 10%)) 0 0 0 1px inset;background:var(--body-text-color-a5,#fff);overflow:hidden;}
#seller_list .seller{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.5em;padding:1.5em;color:inherit;transition:background-color 300ms;}
#seller_list .seller:hover{background-color:var(--SiteTHM-A10);}
#seller_list .avatar{width:4em;height:4em;border-radius:100%;overflow:hidden;background:var(--body-text-color-a5,#fff);box-shadow:var(--body-text-color-a5,rgba(0 0 0/5%)) 0 0 0 1px;}
#seller_list .avatar>img{display:block;width:100%;height:100%;aspect-ratio:1/1;object-fit:cover;}
#seller_list .name{font-weight:var(--CPT-FW-B);}
#seller_list .level{display:flex;align-items:center;gap:1em;}
#seller_list .data{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-evenly;column-gap:1.5em;padding:1.25em 1.5em;box-shadow:var(--body-text-color-a5,rgba(0 0 0 / 5%)) 0 -1px 0;}
#seller_list .data .label[icon]{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.75em;white-space:nowrap;}
#seller_list .data .label[icon]::before{content:attr(icon);display:block;font-size:1.5em;color:var(--body-text-color-a25,rgba(0 0 0/25%));}
@media only screen and (max-width:1280px){}
@media only screen and (max-width:1000px){}
@media only screen and (max-width:800px){}
@media only screen and (max-width:480px){
	#seller_list .list{--column-size:20em;}
}