/* scroll bar */
::-webkit-scrollbar {width: 0;}

/* default style */
body, button, input, select, table, textarea {color: #fff;}
html {width: 100%; height: 100%; background: #000;}
body {width: 100%;height: 100%;}

/* common : container*/
.container {width: 100%; height: 100%;}

/* index page */
.container .contents {width: 90%; margin: 140px auto 40px;}

/* list page (type select) */
.main {padding-bottom: 0; color: #fff; left: 0;}
.main .content {overflow-y: scroll;}
.main .main_cont {width: 80%;}

.main_cont .main_cont_header {display: flex; align-items: flex-end; justify-content: flex-start; width: 100%;}
.main_cont .main_cont_header .main_title, .main_cont .main_cont_header .main_desc, .main_cont .main_cont_header .main_global_box {width: 33.33%;}

.main_cont .main_cont_header .main_title .brand_logo {width: 150px; margin: auto;}
.main .title {position: relative;padding: 20px 0 10px 0; font-size: 23px; font-weight: 700; letter-spacing: -1.15px; line-height: 1.47; text-align: center;}
.main .desc {font-size: 16px; letter-spacing: -.8px; line-height: 1.5; text-align: center;}

/* product_list css */
/* .product_list .main .main_cont {margin-top: 60px;} */
.main .ib_item a.usd_url {display: none;}
.product_list .main .content {background: #0F4C82;}
.product_list .container .contents {margin: 0;}
.product_list .main_cont .main_cont_header .main_title {order: 2;}
.product_list .main_cont .main_map {display: flex; justify-content: flex-end; order: 3; text-align: center;}
.product_list .main_cont .main_map .map_img {width: 200px; padding-bottom: 10px;}
.product_list .main_cont .main_global {display: flex;}
.product_list .main_cont .main_global .global_btn {display: flex; align-items: center;}
.product_list .main_cont .main_global .global_btn p {font-weight: 600; color: #fff;}
.product_list .main_cont .main_global .global_btn.usd {margin-left: 20px;}
.product_list .main_cont .global_desc {padding-top: 10px;}
.product_list .main_cont .global_img {width: 100px; height: 50px; background-size: auto 100%!important;}
.product_list .main_cont .krw.on .global_img {background: url(../../img/ico_global_KRW_1.png) no-repeat center center;}
.product_list .main_cont .krw.off .global_img {background: url(../../img/ico_global_KRW_2.png) no-repeat center center;}
.product_list .main_cont .usd.on .global_img {background: url(../../img/ico_global_USD_1.png) no-repeat center center;}
.product_list .main_cont .usd.off .global_img {background: url(../../img/ico_global_USD_2.png) no-repeat center center;}
.product_list .main_cont .main_cont_header .main_desc {order: 1;}
.product_list .main_cont .main_cont_header .main_desc p:not(:last-child) {padding-bottom: 14px; line-height: 1.56;}

.main .ib_item .item_title {font-size: 20px; letter-spacing: -2px; text-align: center; padding-top: 6px;}
.main .ib_wrap {display: flex; flex-wrap: wrap; justify-content: center; margin-top: 40px; padding-bottom: 80px;}
.main .ib_item {width: 25%; padding: 10px;}
.main .ib_item a {display: block; position: relative; width: 100%; height: 18vw; background-color: #fff; border: 1px solid #fff; border-radius: 30px; overflow: hidden; -webkit-transition: ease-in-out .4s; transition: ease-in-out .4s;}
.main .ib_item a:after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: no-repeat 50% 50%; background-size: 100% auto; content: ''; -webkit-transition: ease-in-out .4s; transition: ease-in-out .4s;}
.main .goods_01 a:after {background-image: url(../../img/01_shop_goods_F.jpg);}
.main .goods_02 a:after {background-image: url(../../img/02_shop_goods_F.jpg);}
.main .goods_03 a:after {background-image: url(../../img/03_shop_goods_F.jpg);}
.main .goods_04 a:after {background-image: url(../../img/04_shop_goods_F.jpg);}
.main .goods_05 a:after {background-image: url(../../img/05_shop_goods_F.jpg);}
.main .goods_06 a:after {background-image: url(../../img/06_shop_goods_F.jpg);}
.main .goods_07 a:after {background-image: url(../../img/07_shop_goods_F.jpg);}
.main .goods_08 a:after {background-image: url(../../img/08_shop_goods_F.jpg);}
.main .goods_09 a:after {background-image: url(../../img/09_shop_goods_F.jpg);}
.main .goods_10 a:after {background-image: url(../../img/10_shop_goods_F.jpg);}
.main .goods_11 a:after {background-image: url(../../img/11_shop_goods_F.jpg);}
.main .goods_12 a:after {background-image: url(../../img/12_shop_goods_F.jpg);}
.main .goods_01 a:hover:after {background-image: url(../../img/01_shop_goods_B.jpg);}
.main .goods_02 a:hover:after {background-image: url(../../img/02_shop_goods_B.jpg);}
.main .goods_03 a:hover:after {background-image: url(../../img/03_shop_goods_B.jpg);}
.main .goods_04 a:hover:after {background-image: url(../../img/04_shop_goods_B.jpg);}
.main .goods_05 a:hover:after {background-image: url(../../img/05_shop_goods_F.jpg);}
.main .goods_06 a:hover:after {background-image: url(../../img/06_shop_goods_F.jpg);}
.main .goods_07 a:hover:after {background-image: url(../../img/07_shop_goods_B.jpg);}
.main .goods_08 a:hover:after {background-image: url(../../img/08_shop_goods_B.jpg);}
.main .goods_09 a:hover:after {background-image: url(../../img/09_shop_goods_F.jpg);}
.main .goods_10 a:hover:after {background-image: url(../../img/10_shop_goods_F.jpg);}
.main .goods_11 a:hover:after {background-image: url(../../img/11_shop_goods_F.jpg);}
.main .goods_12 a:hover:after {background-image: url(../../img/12_shop_goods_F.jpg);}
.main .ib_item p {padding-top: 10px; font-size: 18px; font-weight: 600; text-align: center; line-height: 1.56;}
.main .ib_item .item_price {font-size: 16px; text-align: center; font-weight: 400; padding-top: 6px;}
.main .ib_item .kr_price {display: block;}
.main .ib_item .us_price {display: none;}
.main .ib_item del{color: #999; font-weight: 400;}

/* character_list css */
.character_list .main .content {overflow-y: hidden; background: #242557;}
.character_list .container .contents {margin: 0;}
.character_list .main_cont{overflow-y: auto; padding-bottom: 180px;}
.character_list .main_cont .main_cont_header {justify-content: center;}
.character_list .main_cont .main_cont_header .main_title .brand_logo {width: 200px;}
.character_list .main .ib_item a .ab_vert {left: 0; width: 100%; z-index: 399; color: transparent;}
.character_list .main .ib_item a:hover .ab_vert {color: #fff;}
.character_list .main .ib_item a:before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); opacity: 0; z-index: 1; -webkit-transition: ease-in-out .4s; transition: ease-in-out .4s;}
.character_list .main .ib_item a:hover:before { opacity: 1;}

/* terms, NFT 페이지 공통 css */
.total_list_box {display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; margin: 30px auto 0; padding: 3rem; width: 90%; border-radius: 20px; background-color: rgba(255, 255, 255, 0.65)}

/* terms css */
.terms_list{display: flex; flex-direction: row; padding: 1.5rem 0; width: 100%; border-bottom: 2px solid #333;}
.terms_list p{color: #333; font-size: 18px; line-height: 1.5}
.terms_list:last-of-type{border: 0;}
.terms .terms_box{padding-bottom: 3rem; width: 100%; text-align: center; font-size: 26px; font-weight: bold;}
.terms .terms_left{padding: 0 14px;  width: 25%; }
.terms .terms_right{padding: 0 14px; width: 75%; }
.terms a{color: #6768ab; text-decoration: underline;}

/* NFT css */
.NFT .total_list_box {align-items: center; color: #333; font-size: 18px; line-height: 1.5;}
.NFT .title {width: 100%;}
.NFT .title p {font-size: 30px;}
.NFT .contents_box {display: flex; flex-direction: column; width: 80%; border: 1px solid #fff; border-radius: 25px; overflow: hidden; margin-top: 3rem;}
.NFT .contents_box .contents_title {background: rgba(255,255,255,1);}
.NFT .contents_box .contents_title p {padding: 20px 0; text-align: center; font-weight: 600;}
.NFT .contents_box .contents_main {padding: 30px 40px;}
.NFT .contents_box .contents_main li:not(:last-child) {margin-bottom: 20px;}
.form_link {text-decoration: underline;}
.NFT .contents_box .contents_main.pass_info li {position: relative;}
.NFT .contents_box .contents_main.pass_info li p{padding-left: 20px;}
.NFT .contents_box .contents_main.pass_info li::before {content: ''; position: absolute; top: 10px; width: 8px; height: 8px; background: #333; border-radius: 50%;}
.NFT .apply_btn {width: 400px; height: 70px; background: #fff; border-radius: 15px; margin-top: 3rem;}
.NFT .apply_btn a {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.NFT .apply_btn:hover {background: #000; color: #fff;}

/*------------------------------ media query ------------------------------*/
@media screen and (max-width: 1280px) {
  /* index page */
  .container .contents {margin: 90px auto 40px;}
  .main_cont .main_cont_header .global_img {width: 80px; height: 40px;}
  .main_cont .main_cont_header .main_global .global_btn.usd {margin-left: 10px;}
}

@media screen and (max-width: 1024px) {
  .product_list .main .main_cont {width: 100%; padding: 0 20px;}
  .product_list .main .ib_item {width: 33.33%;}
  .product_list .main .ib_item a {height: 29vw;}
  .product_list .main .ib_item a:after {background-size: auto 100%;}
  .product_list .main_cont .main_global_box {padding-right: 10px;}

  /* terms (about_BADS) css */
  .about .main .main_cont, .NFT .main .main_cont {width: 90%;}
  .total_list_box.terms, .NFT .total_list_box {width: 100%;}
  .terms_list p {font-size: 16px;}

  /* NFT css */
  .NFT .contents_box {width: 100%;}
}

@media screen and (max-width: 999px) {
  /* common : container*/
  .container {overflow-y: visible;}

  /* index page */
  .container .contents {position: static; -webkit-transform: none; transform: none; min-width: 0; width: auto; max-width: 400px; margin: 90px auto 40px; padding: 0 24px;}

  /* list page (type select) */
  .main_cont .main_cont_header .main_title, .main_cont .main_cont_header .main_desc, .main_cont .main_cont_header .main_global_box {width: 100%;}
  
  .product_list .main_cont .main_cont_header {flex-direction: column; align-items: center;}
  .product_list .main_cont .main_cont_header .main_title {order: 1;}
  .product_list .main_cont .main_cont_header .main_global_box {display: flex; flex-direction: column; align-items: center; order: 2; padding-top: 20px;}
  .product_list .main_cont .main_cont_header .main_global .global_btn {display: block;}
  .product_list .main_cont .main_cont_header .global_img {width: 60px; height: 36px;}
  .product_list .main .ib_item .item_title {font-size: 18px;}
  .product_list .main .ib_item .item_price {font-size: 14px;}
  .main .desc {font-size: 1.5rem;}
  .product_list .main .ib_item:first-child {margin-top: 0;}
  .product_list .main .ib_item a {font-size: 2.8rem;}
  .product_list .main .ib_item a:after {opacity: 1; background-size: contain;}
  .product_list .main .ib_item a .ab_vert {padding-left: 48%; text-align: left; -webkit-box-sizing: border-box; box-sizing: border-box;}
  .product_list .main .ib_item a:hover .ab_vert {color: #fff;}
  .product_list .main .ib_item a:focus .ab_vert {color: #fff;}
}

@media screen and (max-width: 760px) {
  /* list page (type select) */
  .main .title {padding: 10px 0 4px 0;}
  .main_cont .main_cont_header .main_title .brand_logo {width: 120px!important;}

  .product_list .main .ib_item {width: 50%;}
  .product_list .main .ib_item a {height: 35vw;}
  .product_list .main .ib_item .item_title {font-size: 3vw;}
  .product_list .main_cont .main_cont_header .global_desc {font-size: 14px;}

  .terms_list p {font-size: 14px;}

  .NFT .total_list_box {font-size: 16px;}
}


@media screen and (max-width: 680px) {
  /* list page (type select) */
  .product_list .main .ib_item .item_title {font-size: 2.6vw;}
  .product_list .main .ib_item .kr_price {font-size: 13px;}
  .product_list .main .ib_item .us_price {font-size: 13px;}

  .character_list .main_cont {padding-bottom: 100px;}
  .terms .terms_box {font-size: 22px;}
  .terms_list {flex-direction: column;}
  .terms .terms_left {width: 100%; text-align: left; padding: 0px 10px 10px 10px; font-size: 18px;}
  .terms .terms_right {width: 100%;}

  .NFT .title p {font-size: 26px;}
  .NFT .contents_box .contents_main {padding: 20px 30px;}
  .NFT .apply_btn {width: 56vw; height: 60px; font-size: 1.5rem;}
}

@media screen and (max-width: 480px) {
  /* list page (type select) */
  .product_list .main .ib_item {width: 100%; padding: 4px;}
  .product_list .main .ib_item a {height: 60vw;}
  .product_list .main .ib_item .item_title {font-size: 3.5vw;}

  .total_list_box.terms, .NFT .total_list_box {padding: 2rem;}
  .terms .terms_box {font-size: 20px;}

  .NFT .total_list_box {font-size: 14px;}
  .NFT .contents_box .contents_main {padding: 14px 1.5rem;}
  .NFT .contents_box .contents_main li:not(:last-child) {margin-bottom: 1.2rem;}
  .NFT .title p {font-size: 5vw;}
}

@media screen and (max-width: 360px) {
  /* list page (type select) */
  .main_cont .main_cont_header .main_title .brand_logo {width: 100px;}
  .main .title {font-size: 20px;}
  .main .desc {font-size: 14px;}
  .product_list .main_cont .global_img {width: 50px; height: 30px;}
  .product_list .main_cont .main_global .global_btn p {font-size: 14px; font-weight: 400;}
  .product_list .main_cont .global_desc {padding-top: 6px; text-align: center;}
  .product_list .main .ib_item .item_title {font-size: 14px;}
}