@charset "UTF-8";
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/font.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/common.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/modal.css);
@import url(https://lwres.nexon.com/css/mabinogim/brand/common/loading.css);
#mabinogim .my_page,
#mabinogim .support,
#mabinogim .container {
  max-width: 1740px;
  margin: 0 auto;
  padding: 70px 60px 140px;
}
#mabinogim .my_page .user_profile_wrap,
#mabinogim .support .user_profile_wrap,
#mabinogim .container .user_profile_wrap {
  background: #fff;
  border-radius: 24px;
  display: flex;
}
#mabinogim .my_page .user_profile_wrap .order_1,
#mabinogim .support .user_profile_wrap .order_1,
#mabinogim .container .user_profile_wrap .order_1 {
  position: relative;
  background: #2e313c;
  width: 50%;
  max-width: 800px;
  max-height: 295px;
  display: flex;
  align-items: center;
  border-radius: 24px;
  flex: 1;
  padding: 38px 10px 38px 70px;
}
#mabinogim .my_page .user_profile_wrap .order_1::before,
#mabinogim .support .user_profile_wrap .order_1::before,
#mabinogim .container .user_profile_wrap .order_1::before {
  display: block;
  position: absolute;
  top: 10px;
  left: 30px;
  content: "";
  width: calc(100% - 60px);
  height: 2px;
  background: #585a63;
}
#mabinogim .my_page .user_profile_wrap .order_1::after,
#mabinogim .support .user_profile_wrap .order_1::after,
#mabinogim .container .user_profile_wrap .order_1::after {
  display: block;
  position: absolute;
  bottom: 10px;
  left: 30px;
  content: "";
  width: calc(100% - 60px);
  height: 2px;
  background: #585a63;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout,
#mabinogim .support .user_profile_wrap .order_1 .layout,
#mabinogim .container .user_profile_wrap .order_1 .layout {
  width: 100%;
  display: flex;
  align-items: center;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_image,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_image,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_image {
  position: relative;
  width: 146px;
  min-width: 146px;
  height: 144px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='146' height='144' fill-opacity='.2' fill='none'%3E%3Cpath fill='%23C4C4C4' d='M52.65 57.976a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.621ZM58.21 52.342a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.622ZM65.24 48.698a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM80.882 48.588a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.62ZM87.966 52.126a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM93.603 57.68a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM97.25 64.702a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.621ZM97.364 80.328a.81.81 0 1 0 .001-1.622.81.81 0 0 0 0 1.621ZM93.819 87.403a.81.81 0 1 0 0-1.62.81.81 0 0 0 0 1.62ZM88.26 93.034a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM81.229 96.678a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM65.587 96.792a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.622ZM58.503 93.25a.81.81 0 1 0 .001-1.622.81.81 0 0 0 0 1.622ZM52.867 87.697a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM49.219 80.674a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM49.109 65.048a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.621Z'/%3E%3Cpath fill='%23C4C4C4' d='m77.361 76.216 32.988-4.32-32.968-4.136-4.528-32.957-4.022 32.94L35.9 72.258l33 4.019 4.316 32.895 4.145-32.956Z'/%3E%3Cpath fill='%23C4C4C4' d='m78.45 71.782 5.587-11.375L73 66.44l-11.196-5.492 5.918 10.805-5.962 10.818 11.212-5.431 11.02 6.066-5.543-11.424ZM47.898 101.746a4.965 4.965 0 0 1-4.964-4.958 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.958Zm0-9.103a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M44.882 93.624a.413.413 0 0 1-.326-.163 35.59 35.59 0 0 1-6.782-16.09.406.406 0 0 1 .343-.463.407.407 0 0 1 .464.342 34.819 34.819 0 0 0 6.627 15.723.404.404 0 0 1-.081.57.393.393 0 0 1-.245.081ZM66.94 107.129c-.025 0-.045 0-.07-.009a35.7 35.7 0 0 1-15.776-7.014.404.404 0 0 1-.07-.57.404.404 0 0 1 .57-.07 34.887 34.887 0 0 0 15.415 6.857c.22.036.37.248.33.472a.406.406 0 0 1-.4.338v-.004Z'/%3E%3Cpath fill='%23C4C4C4' d='M64.09 127.481c-.02 0-.04 0-.064-.004a.405.405 0 0 1-.339-.464l3.224-20.336a.407.407 0 0 1 .803.126l-3.224 20.336a.408.408 0 0 1-.403.342h.004ZM50.816 140.012a.404.404 0 0 1-.387-.533l1.203-3.697a.407.407 0 0 1 .774.253l-1.202 3.696a.41.41 0 0 1-.388.281ZM53.413 132.033a.404.404 0 0 1-.387-.534l8.436-26.072a.408.408 0 0 1 .514-.261c.216.069.33.297.26.513L53.8 131.752a.41.41 0 0 1-.387.281ZM47.45 122.074a.409.409 0 0 1-.363-.594l9.37-18.37a.41.41 0 0 1 .73.371l-9.37 18.369a.408.408 0 0 1-.363.224h-.004ZM31.021 129.785a.405.405 0 0 1-.33-.647l21.08-28.983a.41.41 0 0 1 .57-.09c.183.13.224.387.09.57l-21.08 28.983a.407.407 0 0 1-.33.167ZM32.892 112.185a.405.405 0 0 1-.29-.692l11.702-11.689a.406.406 0 0 1 .574.574l-11.7 11.689a.402.402 0 0 1-.29.118h.004ZM14.176 114.848a.407.407 0 0 1-.24-.737l2.967-2.154a.414.414 0 0 1 .57.09.409.409 0 0 1-.09.57l-2.966 2.153a.403.403 0 0 1-.24.078ZM20.852 110.003a.407.407 0 0 1-.24-.737l23.46-17.026a.409.409 0 0 1 .48.66l-23.46 17.026a.402.402 0 0 1-.24.077ZM21.244 98.522a.409.409 0 0 1-.183-.774l20.182-10.271a.409.409 0 1 1 .37.729L21.432 98.476a.434.434 0 0 1-.183.045h-.004ZM3.898 94.63a.408.408 0 0 1-.126-.794l35.42-11.497a.408.408 0 0 1 .253.773L4.024 94.61a.455.455 0 0 1-.126.02ZM15.049 81.736a.403.403 0 0 1-.4-.338.412.412 0 0 1 .33-.472l22.991-3.99a.41.41 0 0 1 .473.33.412.412 0 0 1-.33.472l-22.991 3.99c-.024 0-.049.004-.07.004l-.003.004ZM46.953 97.565l.937 2.744.807-2.752 2.763-.802-2.738-.949-.816-2.809-.97 2.793-2.795.953 2.812.822Zm.847-1.718.808.806-.807.806-.808-.806.807-.806ZM47.898 52.167a4.965 4.965 0 0 1-4.964-4.96 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.96Zm0-9.104a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M38.178 67.092s-.04 0-.061-.004a.406.406 0 0 1-.343-.464 35.614 35.614 0 0 1 6.782-16.09.408.408 0 0 1 .652.489 34.8 34.8 0 0 0-6.627 15.723.404.404 0 0 1-.403.346ZM51.346 44.618a.407.407 0 0 1-.253-.725A35.663 35.663 0 0 1 66.87 36.88a.41.41 0 0 1 .473.33c.041.22-.11.431-.33.472A34.877 34.877 0 0 0 51.6 44.537a.412.412 0 0 1-.253.086v-.005Z'/%3E%3Cpath fill='%23C4C4C4' d='M67.315 37.665a.41.41 0 0 1-.404-.342l-3.224-20.336a.403.403 0 0 1 .339-.464.406.406 0 0 1 .464.338l3.224 20.335a.403.403 0 0 1-.338.465c-.02 0-.045.004-.065.004h.004ZM52.019 8.494a.41.41 0 0 1-.387-.28L50.429 4.52a.408.408 0 0 1 .775-.253l1.202 3.693a.408.408 0 0 1-.387.533ZM61.85 38.85a.41.41 0 0 1-.388-.281l-8.437-26.073a.408.408 0 0 1 .775-.252l8.436 26.072a.408.408 0 0 1-.387.533ZM56.82 41.105a.404.404 0 0 1-.363-.224l-9.37-18.37a.409.409 0 1 1 .73-.37l9.37 18.37a.409.409 0 0 1-.363.594h-.004ZM52.1 44.008a.407.407 0 0 1-.33-.167L30.69 14.858a.409.409 0 0 1 .661-.48l21.08 28.982a.409.409 0 0 1-.33.648ZM44.593 44.313a.418.418 0 0 1-.29-.118l-11.7-11.689a.405.405 0 1 1 .574-.574l11.701 11.689a.405.405 0 0 1-.29.692h.005ZM17.143 32.12a.412.412 0 0 1-.24-.078l-2.967-2.153a.405.405 0 0 1-.09-.57.406.406 0 0 1 .57-.09l2.968 2.154a.408.408 0 0 1-.24.737ZM44.308 51.833a.412.412 0 0 1-.24-.078L20.607 34.73a.405.405 0 0 1-.09-.57.406.406 0 0 1 .57-.09l23.46 17.027a.408.408 0 0 1-.24.737ZM41.426 56.56a.37.37 0 0 1-.183-.045L21.06 46.243a.41.41 0 0 1-.18-.55.41.41 0 0 1 .551-.179l20.183 10.272a.41.41 0 0 1-.184.773h-.004ZM39.32 61.681a.456.456 0 0 1-.127-.02L3.77 50.163a.404.404 0 0 1-.26-.512.408.408 0 0 1 .513-.261l35.421 11.497c.216.07.33.297.261.513a.41.41 0 0 1-.387.281ZM38.04 67.063c-.025 0-.045 0-.07-.004l-22.99-3.99a.408.408 0 0 1 .143-.802l22.99 3.99c.22.037.37.249.33.472a.406.406 0 0 1-.4.338l-.004-.004ZM44.14 47.253l2.797.952.97 2.793.815-2.809 2.738-.949-2.763-.802-.807-2.752-.937 2.744-2.812.823Zm2.853.09.807-.807.808.806-.807.806-.808-.806ZM98.106 101.746a4.965 4.965 0 0 1-4.964-4.958 4.965 4.965 0 0 1 9.928 0 4.964 4.964 0 0 1-4.964 4.958Zm0-9.103a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M101.118 93.624a.408.408 0 0 1-.326-.651 34.796 34.796 0 0 0 6.627-15.723.407.407 0 0 1 .465-.342c.224.032.375.24.342.464a35.593 35.593 0 0 1-6.782 16.09.413.413 0 0 1-.326.162ZM79.06 107.129a.41.41 0 0 1-.07-.811 34.874 34.874 0 0 0 15.416-6.856.407.407 0 0 1 .501.64 35.667 35.667 0 0 1-15.777 7.014c-.024.004-.049.009-.07.009v.004Z'/%3E%3Cpath fill='%23C4C4C4' d='M81.91 127.481a.41.41 0 0 1-.404-.342l-3.224-20.336a.403.403 0 0 1 .339-.464.408.408 0 0 1 .464.338l3.224 20.336a.404.404 0 0 1-.338.464c-.02 0-.045.004-.066.004h.005ZM95.184 140.012a.41.41 0 0 1-.387-.281l-1.203-3.696a.407.407 0 0 1 .775-.253l1.202 3.697a.407.407 0 0 1-.387.533ZM92.592 132.033a.41.41 0 0 1-.387-.281l-8.437-26.073a.407.407 0 0 1 .774-.252l8.437 26.072a.407.407 0 0 1-.387.534ZM98.555 122.074a.403.403 0 0 1-.363-.224l-9.37-18.369a.409.409 0 1 1 .73-.371l9.37 18.37a.408.408 0 0 1-.363.594h-.004ZM114.979 129.785a.408.408 0 0 1-.33-.167L93.57 100.635a.409.409 0 0 1 .66-.48l21.079 28.983a.409.409 0 0 1-.089.57.404.404 0 0 1-.241.077ZM113.109 112.185a.422.422 0 0 1-.29-.118l-11.701-11.689a.407.407 0 0 1 .575-.574l11.701 11.689a.405.405 0 0 1-.289.692h.004ZM131.824 114.848a.409.409 0 0 1-.24-.078l-2.968-2.153a.405.405 0 0 1-.089-.57.405.405 0 0 1 .57-.09l2.967 2.154a.407.407 0 0 1-.24.737ZM125.152 110.003a.41.41 0 0 1-.24-.077L101.452 92.9a.405.405 0 0 1-.089-.57.406.406 0 0 1 .57-.09l23.46 17.026a.407.407 0 0 1-.241.737ZM124.757 98.522a.374.374 0 0 1-.184-.045l-20.182-10.272a.41.41 0 0 1-.18-.55.411.411 0 0 1 .551-.178l20.182 10.271a.41.41 0 0 1-.183.774h-.004ZM142.103 94.63a.46.46 0 0 1-.127-.02l-35.421-11.498a.405.405 0 0 1-.261-.513.41.41 0 0 1 .514-.26l35.421 11.497c.216.07.33.297.261.513a.41.41 0 0 1-.387.28ZM130.956 81.736c-.025 0-.045 0-.069-.004l-22.991-3.99a.405.405 0 0 1-.33-.472.405.405 0 0 1 .473-.33l22.99 3.99c.22.037.371.248.33.472a.404.404 0 0 1-.399.338l-.004-.004ZM101.86 96.743l-2.796-.953-.97-2.793-.815 2.81-2.739.948 2.763.802.807 2.752.938-2.744 2.812-.822Zm-2.853-.09-.807.806-.807-.806.807-.806.807.806ZM98.106 52.167a4.965 4.965 0 0 1-4.964-4.96 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.96Zm0-9.104a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M107.823 67.092a.411.411 0 0 1-.404-.346 34.816 34.816 0 0 0-6.627-15.723.408.408 0 0 1 .652-.489 35.587 35.587 0 0 1 6.782 16.09.406.406 0 0 1-.342.464c-.021 0-.041.004-.061.004ZM94.654 44.618a.42.42 0 0 1-.253-.085 34.877 34.877 0 0 0-15.414-6.856.405.405 0 0 1-.33-.472.405.405 0 0 1 .473-.33 35.709 35.709 0 0 1 15.777 7.015.404.404 0 0 1-.253.724v.005Z'/%3E%3Cpath fill='%23C4C4C4' d='M78.686 37.665c-.02 0-.041 0-.066-.004a.405.405 0 0 1-.338-.465l3.224-20.335a.405.405 0 0 1 .465-.338.405.405 0 0 1 .338.464l-3.224 20.336a.407.407 0 0 1-.403.342h.004ZM93.986 8.494a.404.404 0 0 1-.387-.533L94.8 4.268a.408.408 0 0 1 .513-.26c.216.069.33.297.261.513l-1.202 3.692a.41.41 0 0 1-.387.281ZM84.151 38.85a.404.404 0 0 1-.387-.533l8.437-26.073a.408.408 0 0 1 .774.252L84.538 38.57a.41.41 0 0 1-.387.28ZM89.185 41.105a.41.41 0 0 1-.363-.594l9.37-18.37a.41.41 0 0 1 .73.37l-9.37 18.37a.409.409 0 0 1-.363.224h-.004ZM93.9 44.008a.405.405 0 0 1-.33-.647l21.079-28.984a.41.41 0 0 1 .571-.09c.183.13.224.387.089.57L94.23 43.842a.407.407 0 0 1-.33.167ZM101.407 44.313a.405.405 0 0 1-.289-.692l11.701-11.689a.407.407 0 0 1 .575.574l-11.701 11.689a.402.402 0 0 1-.29.118h.004ZM128.857 32.12a.407.407 0 0 1-.241-.737l2.968-2.154a.408.408 0 1 1 .48.66l-2.967 2.153a.402.402 0 0 1-.24.078ZM101.693 51.833a.409.409 0 0 1-.241-.737l23.46-17.026a.413.413 0 0 1 .57.09.409.409 0 0 1-.089.57l-23.46 17.025a.402.402 0 0 1-.24.078ZM104.574 56.56a.41.41 0 0 1-.183-.774l20.182-10.272a.408.408 0 1 1 .371.729l-20.182 10.272a.437.437 0 0 1-.184.044h-.004ZM106.681 61.681a.408.408 0 0 1-.126-.794l35.421-11.497a.409.409 0 0 1 .514.26.408.408 0 0 1-.261.514L106.808 61.66a.46.46 0 0 1-.127.02ZM107.961 67.063a.401.401 0 0 1-.399-.338.412.412 0 0 1 .33-.472l22.991-3.99a.41.41 0 0 1 .472.33.412.412 0 0 1-.33.472l-22.991 3.99c-.024 0-.048.004-.069.004l-.004.004ZM99.048 46.434l-.938-2.744-.807 2.752-2.763.802 2.739.949.815 2.81.97-2.794 2.796-.952-2.812-.823Zm-.848 1.718-.807-.806.807-.806.807.806-.807.806Z'/%3E%3C/svg%3E");
  background-size: cover;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_image img,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_image img,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_image img {
  width: 100%;
  height: 100%;
  max-width: 104px;
  max-height: 104px;
  border-radius: 50%;
  object-fit: cover;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_image.default img,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_image.default img,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_image.default img {
  width: 104px;
  height: auto;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .line,
#mabinogim .support .user_profile_wrap .order_1 .layout .line,
#mabinogim .container .user_profile_wrap .order_1 .layout .line {
  display: block;
  min-width: 8px;
  width: 8px;
  height: 224px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='224' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath stroke='%23585A63' stroke-miterlimit='10' stroke-width='2' d='m2.164 116.308 4.641-4.366-1.415-1.419M5.836 107.633 1.195 112l1.421 1.418'/%3E%3Cpath fill='%23585A63' d='M5 105.5H3s.266-85 .96-85c.696 0 1.04 85 1.04 85Z'/%3E%3Cpath fill='%23585A63' d='M6.092 105.416 4 107.331l-2.092-1.915L4 103.5l2.092 1.916ZM5 118.5H3s.258 85 .953 85 1.04-85 1.04-85H5ZM2.61 108.737l-1.078-.987 1.079-.988 1.078.988-1.078.987ZM5.8 116.972l-1.078-.988 1.079-.988 1.078.988-1.078.988Z'/%3E%3Cpath fill='%23585A63' d='M4 120.331 2 118.5l2-1.831 2 1.831-2 1.831Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .5v223h8V.5z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-size: cover;
  margin: 0 60px 0 50px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info h1,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info h1,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info h1 {
  font-family: "Pretendard-Bold";
  color: #adb2c6;
  font-size: 14px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .user_name,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .user_name,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .user_name {
  font-family: "Pretendard-Bold";
  margin-top: 15px;
  display: inline-block;
  font-size: 20px;
  line-height: 130%;
  color: #fff;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul {
  margin-top: 30px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li {
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li:last-child,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li:last-child,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li:last-child {
  margin-bottom: 0;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li span,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li span,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li span {
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 16px;
  white-space: nowrap;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child {
  color: #cdcdcd;
  font-size: 12px;
  width: 80px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child::before,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child::before,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li span:first-child::before {
  display: block;
  content: "";
  min-width: 12px;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='13' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23D9D9D9' d='M0 .5h12v12H0z'/%3E%3Cpath fill='%232E313C' d='M9 2.5h1v1H9v-1ZM8 3.5h1v1H8v-1ZM7 4.5h1v1H7v-1ZM6 5.5h1v1H6v-1ZM5 6.5h1v1H5v-1ZM4 7.5h1v1H4v-1ZM3 8.5h1v1H3v-1ZM2 9.5h1v1H2v-1Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='12' height='12' y='.5' fill='%23fff' rx='3'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li span:nth-child(2),
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li span:nth-child(2),
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li span:nth-child(2) {
  font-family: "Pretendard-Bold";
  margin-left: 10px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area {
  margin-top: 30px;
  display: flex;
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button {
  padding: 7px 16px;
  background: #8c8c8c;
  width: min-content;
  display: flex;
  align-items: center;
  white-space: nowrap;
  border-radius: 12px;
  font-size: 12px;
  color: #fff;
  margin-right: 10px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button:hover,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button:hover,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button::before,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button::before,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' d='M13.266 8.44a.667.667 0 0 1 0-.88l.854-.96a.667.667 0 0 0 .08-.78l-1.334-2.307a.667.667 0 0 0-.713-.32l-1.253.254a.667.667 0 0 1-.767-.44l-.407-1.22a.667.667 0 0 0-.633-.454H6.426a.667.667 0 0 0-.666.454l-.374 1.22a.667.667 0 0 1-.766.44l-1.287-.254a.667.667 0 0 0-.667.32L1.333 5.82a.667.667 0 0 0 .067.78l.846.96a.667.667 0 0 1 0 .88L1.4 9.4a.667.667 0 0 0-.067.78l1.333 2.307a.667.667 0 0 0 .714.32l1.253-.254a.667.667 0 0 1 .767.44l.406 1.22a.667.667 0 0 0 .667.454H9.14a.667.667 0 0 0 .633-.454l.407-1.22a.667.667 0 0 1 .766-.44l1.254.254a.667.667 0 0 0 .713-.32l1.333-2.307a.667.667 0 0 0-.08-.78l-.9-.96Zm-.993.893.533.6-.853 1.48-.787-.16a2 2 0 0 0-2.3 1.334l-.253.746H6.906l-.24-.76a2 2 0 0 0-2.3-1.333l-.786.16-.867-1.473.533-.6a2 2 0 0 0 0-2.667l-.533-.6.853-1.467.787.16a2 2 0 0 0 2.3-1.333l.253-.753h1.707l.253.76a2 2 0 0 0 2.3 1.333l.787-.16.853 1.48-.533.6a2 2 0 0 0 0 2.653Zm-4.513-4a2.667 2.667 0 1 0 0 5.334 2.667 2.667 0 0 0 0-5.334Zm0 4a1.333 1.333 0 1 1 0-2.666 1.333 1.333 0 0 1 0 2.666Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button:hover,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button:hover,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button::before,
#mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button::before,
#mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M1.5 3.286A1.286 1.286 0 0 1 2.786 2h6a1.286 1.286 0 0 1 1.286 1.286v1.662a1.714 1.714 0 0 0-.63 1.123H6.43a1.929 1.929 0 1 0 0 3.858h3.014c.055.442.281.845.629 1.123v1.662A1.286 1.286 0 0 1 8.786 14h-6A1.286 1.286 0 0 1 1.5 12.714V3.286Zm9.397 2.406a.642.642 0 0 0-.397.594v.857H6.43a.857.857 0 1 0 0 1.714H10.5v.857a.642.642 0 0 0 1.098.455l1.714-1.715a.643.643 0 0 0 0-.908L11.598 5.83a.643.643 0 0 0-.7-.14Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button:hover,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button:hover,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button.logout_button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_1 .top_left,
#mabinogim .support .user_profile_wrap .order_1 .top_left,
#mabinogim .container .user_profile_wrap .order_1 .top_left {
  display: block;
  position: absolute;
  top: 10px;
  left: 10px;
  min-width: 29px;
  width: 29px;
  height: 100%;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='27' fill='none'%3E%3Cg fill='%23585a63' clip-path='url(%23a)'%3E%3Cpath d='m17.589 17.912-6.77-1.307V13.98h1.957v.961l2.284.446-.504-2.409H9.234v-2.003h6.902l1.453 6.935ZM4.872 13.25H0v-1.002c0-4.01 1.956-6.22 5.503-6.22h4.015v2.004H5.503c-2.153 0-3.258 1.001-3.498 3.215h2.867v2.003Z'/%3E%3Cpath d='M11.797.21c-3.57 0-5.673 1.668-6.016 4.717h1.971c.255-1.602 1.233-2.453 3.067-2.659V9.48h1.957V.21h-.979ZM17.55 0v1.001c0 2.284-1.502 4.227-3.63 4.773v2.043c2.916-.526 5.107-2.885 5.513-5.819H29V0H17.545h.005ZM2 28H0v-9.635h1.01c2.74 0 4.969-2.339 4.969-5.213V9H8v4.152c0 3.686-2.624 6.834-6 7.348V28Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23585a63' d='M0 0h29v27H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat;
  background-size: 29px 27px;
}
#mabinogim .my_page .user_profile_wrap .order_1 .top_left::before,
#mabinogim .support .user_profile_wrap .order_1 .top_left::before,
#mabinogim .container .user_profile_wrap .order_1 .top_left::before {
  position: absolute;
  top: 20px;
  left: 0px;
  content: "";
  width: 2px;
  height: calc(100% - 60px);
  background: #585a63;
}
#mabinogim .my_page .user_profile_wrap .order_1 .top_right,
#mabinogim .support .user_profile_wrap .order_1 .top_right,
#mabinogim .container .user_profile_wrap .order_1 .top_right {
  display: block;
  position: absolute;
  top: 10px;
  right: 10px;
  min-width: 29px;
  width: 29px;
  height: 100%;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='27' fill='none'%3E%3Cg fill='%23585a63' clip-path='url(%23a)'%3E%3Cpath d='m11.411 17.912 6.77-1.307V13.98h-1.957v.961l-2.284.446.504-2.409h5.322v-2.003h-6.902l-1.453 6.935ZM24.128 13.25H29v-1.002c0-4.01-1.956-6.22-5.503-6.22h-4.015v2.004h4.015c2.152 0 3.258 1.001 3.498 3.215h-2.867v2.003Z'/%3E%3Cpath d='M17.203.21c3.57 0 5.673 1.668 6.016 4.717h-1.971c-.255-1.602-1.233-2.453-3.067-2.659V9.48h-1.957V.21h.979ZM11.45 0v1.001c0 2.284 1.502 4.227 3.63 4.773v2.043c-2.915-.526-5.106-2.885-5.512-5.819H0V0h11.456-.005ZM27 28h2v-9.635h-1.01c-2.74 0-4.968-2.339-4.968-5.213V9H21v4.152c0 3.686 2.624 6.834 6 7.348V28Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23585a63' d='M29 0H0v27h29z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat;
}
#mabinogim .my_page .user_profile_wrap .order_1 .top_right::before,
#mabinogim .support .user_profile_wrap .order_1 .top_right::before,
#mabinogim .container .user_profile_wrap .order_1 .top_right::before {
  position: absolute;
  top: 20px;
  right: 0px;
  content: "";
  width: 2px;
  height: calc(100% - 60px);
  background: #585a63;
}
#mabinogim .my_page .user_profile_wrap .order_1 .bottom_left,
#mabinogim .support .user_profile_wrap .order_1 .bottom_left,
#mabinogim .container .user_profile_wrap .order_1 .bottom_left {
  display: block;
  position: absolute;
  bottom: 10px;
  left: 10px;
  min-width: 29px;
  width: 29px;
  height: 27px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='27' fill='none'%3E%3Cg fill='%23585a63' clip-path='url(%23a)'%3E%3Cpath d='m17.589 9.088-6.77 1.307v2.624h1.957v-.961l2.284-.446-.504 2.409H9.234v2.003h6.902l1.453-6.936ZM4.872 13.75H0v1.002c0 4.01 1.956 6.22 5.503 6.22h4.015v-2.004H5.503c-2.153 0-3.258-1.001-3.498-3.215h2.867V13.75Z'/%3E%3Cpath d='M11.797 26.79c-3.57 0-5.673-1.668-6.016-4.717h1.971c.255 1.602 1.233 2.453 3.067 2.659V17.52h1.957v9.269h-.979Zm5.753.21v-1.002c0-2.283-1.502-4.226-3.63-4.772v-2.043c2.916.526 5.107 2.885 5.513 5.819H29V27H17.545h.005ZM2-1H0v9.635h1.01c2.74 0 4.969 2.339 4.969 5.213V18H8v-4.152C8 10.162 5.376 7.014 2 6.5V-1Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23585a63' d='M0 27h29V0H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat;
}
#mabinogim .my_page .user_profile_wrap .order_1 .bottom_right,
#mabinogim .support .user_profile_wrap .order_1 .bottom_right,
#mabinogim .container .user_profile_wrap .order_1 .bottom_right {
  display: block;
  position: absolute;
  bottom: 10px;
  right: 10px;
  min-width: 29px;
  width: 29px;
  height: 27px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29' height='27' fill='none'%3E%3Cg fill='%23585a63' clip-path='url(%23a)'%3E%3Cpath d='m11.411 9.088 6.77 1.307v2.624h-1.957v-.961l-2.284-.446.504 2.409h5.322v2.003h-6.902l-1.453-6.936ZM24.128 13.75H29v1.002c0 4.01-1.956 6.22-5.503 6.22h-4.015v-2.004h4.015c2.152 0 3.258-1.001 3.498-3.215h-2.867V13.75Z'/%3E%3Cpath d='M17.203 26.79c3.57 0 5.673-1.668 6.016-4.717h-1.971c-.255 1.602-1.233 2.453-3.067 2.659V17.52h-1.957v9.269h.979ZM11.45 27v-1.002c0-2.283 1.502-4.226 3.63-4.772v-2.043c-2.915.526-5.106 2.885-5.512 5.819H0V27h11.456-.005ZM27-1h2v9.635h-1.01c-2.74 0-4.968 2.339-4.968 5.213V18H21v-4.152c0-3.686 2.624-6.834 6-7.348V-1Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23585a63' d='M29 27H0V0h29z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat;
}
#mabinogim .my_page .user_profile_wrap .order_2,
#mabinogim .support .user_profile_wrap .order_2,
#mabinogim .container .user_profile_wrap .order_2 {
  position: relative;
  width: 50%;
  max-height: 295px;
  display: flex;
}
#mabinogim .my_page .user_profile_wrap .order_2:has(.layout),
#mabinogim .support .user_profile_wrap .order_2:has(.layout),
#mabinogim .container .user_profile_wrap .order_2:has(.layout) {
  padding: 38px 10px 38px 70px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty,
#mabinogim .support .user_profile_wrap .order_2 .character_empty,
#mabinogim .container .user_profile_wrap .order_2 .character_empty {
  display: flex;
  width: 100%;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty::before,
#mabinogim .support .user_profile_wrap .order_2 .character_empty::before,
#mabinogim .container .user_profile_wrap .order_2 .character_empty::before {
  display: block;
  content: "";
  min-width: 290px;
  height: 295px;
  background: url(https://lwi.nexon.com/m_mabinogim/brand/community/character_default.png);
  background-size: 290px 295px;
  margin-left: 38px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub {
  display: flex;
  width: 100%;
  justify-content: center;
  flex-direction: column;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub span,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub span,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub span {
  font-family: "Pretendard-Bold";
  color: #5c5c5c;
  text-align: center;
  font-size: 20px;
  line-height: 140%; /* 28px */
  letter-spacing: -0.5px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area {
  margin: 30px 0;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area button,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area button,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area button {
  padding: 14px 54px;
  border-radius: 14px;
  background: #0fb376;
  color: #fff;
  font-weight: 500;
  font-size: 16px;
  white-space: nowrap;
  max-width: 164px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1),
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1),
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1) {
  max-width: 195px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area button:hover,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area button:hover,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button {
  background: #0fb376;
}
#mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button,
#mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button,
#mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button {
  background: #8c8c8c;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout,
#mabinogim .support .user_profile_wrap .order_2 .layout,
#mabinogim .container .user_profile_wrap .order_2 .layout {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_image,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_image {
  position: relative;
  width: 146px;
  min-width: 146px;
  height: 144px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='146' height='144' fill='none'%3E%3Cpath fill='%23C4C4C4' d='M52.65 57.976a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.621ZM58.21 52.342a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.622ZM65.24 48.698a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM80.882 48.588a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.62ZM87.966 52.126a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM93.603 57.68a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM97.25 64.702a.81.81 0 1 0 .001-1.621.81.81 0 0 0 0 1.621ZM97.364 80.328a.81.81 0 1 0 .001-1.622.81.81 0 0 0 0 1.621ZM93.819 87.403a.81.81 0 1 0 0-1.62.81.81 0 0 0 0 1.62ZM88.26 93.034a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM81.229 96.678a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.62ZM65.587 96.792a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.622ZM58.503 93.25a.81.81 0 1 0 .001-1.622.81.81 0 0 0 0 1.622ZM52.867 87.697a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM49.219 80.674a.81.81 0 1 0 0-1.622.81.81 0 0 0 0 1.621ZM49.109 65.048a.81.81 0 1 0 0-1.621.81.81 0 0 0 0 1.621Z'/%3E%3Cpath fill='%23C4C4C4' d='m77.361 76.216 32.988-4.32-32.968-4.136-4.528-32.957-4.022 32.94L35.9 72.258l33 4.019 4.316 32.895 4.145-32.956Z'/%3E%3Cpath fill='%23C4C4C4' d='m78.45 71.782 5.587-11.375L73 66.44l-11.196-5.492 5.918 10.805-5.962 10.818 11.212-5.431 11.02 6.066-5.543-11.424ZM47.898 101.746a4.965 4.965 0 0 1-4.964-4.958 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.958Zm0-9.103a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M44.882 93.624a.413.413 0 0 1-.326-.163 35.59 35.59 0 0 1-6.782-16.09.406.406 0 0 1 .343-.463.407.407 0 0 1 .464.342 34.819 34.819 0 0 0 6.627 15.723.404.404 0 0 1-.081.57.393.393 0 0 1-.245.081ZM66.94 107.129c-.025 0-.045 0-.07-.009a35.7 35.7 0 0 1-15.776-7.014.404.404 0 0 1-.07-.57.404.404 0 0 1 .57-.07 34.887 34.887 0 0 0 15.415 6.857c.22.036.37.248.33.472a.406.406 0 0 1-.4.338v-.004Z'/%3E%3Cpath fill='%23C4C4C4' d='M64.09 127.481c-.02 0-.04 0-.064-.004a.405.405 0 0 1-.339-.464l3.224-20.336a.407.407 0 0 1 .803.126l-3.224 20.336a.408.408 0 0 1-.403.342h.004ZM50.816 140.012a.404.404 0 0 1-.387-.533l1.203-3.697a.407.407 0 0 1 .774.253l-1.202 3.696a.41.41 0 0 1-.388.281ZM53.413 132.033a.404.404 0 0 1-.387-.534l8.436-26.072a.408.408 0 0 1 .514-.261c.216.069.33.297.26.513L53.8 131.752a.41.41 0 0 1-.387.281ZM47.45 122.074a.409.409 0 0 1-.363-.594l9.37-18.37a.41.41 0 0 1 .73.371l-9.37 18.369a.408.408 0 0 1-.363.224h-.004ZM31.021 129.785a.405.405 0 0 1-.33-.647l21.08-28.983a.41.41 0 0 1 .57-.09c.183.13.224.387.09.57l-21.08 28.983a.407.407 0 0 1-.33.167ZM32.892 112.185a.405.405 0 0 1-.29-.692l11.702-11.689a.406.406 0 0 1 .574.574l-11.7 11.689a.402.402 0 0 1-.29.118h.004ZM14.176 114.848a.407.407 0 0 1-.24-.737l2.967-2.154a.414.414 0 0 1 .57.09.409.409 0 0 1-.09.57l-2.966 2.153a.403.403 0 0 1-.24.078ZM20.852 110.003a.407.407 0 0 1-.24-.737l23.46-17.026a.409.409 0 0 1 .48.66l-23.46 17.026a.402.402 0 0 1-.24.077ZM21.244 98.522a.409.409 0 0 1-.183-.774l20.182-10.271a.409.409 0 1 1 .37.729L21.432 98.476a.434.434 0 0 1-.183.045h-.004ZM3.898 94.63a.408.408 0 0 1-.126-.794l35.42-11.497a.408.408 0 0 1 .253.773L4.024 94.61a.455.455 0 0 1-.126.02ZM15.049 81.736a.403.403 0 0 1-.4-.338.412.412 0 0 1 .33-.472l22.991-3.99a.41.41 0 0 1 .473.33.412.412 0 0 1-.33.472l-22.991 3.99c-.024 0-.049.004-.07.004l-.003.004ZM46.953 97.565l.937 2.744.807-2.752 2.763-.802-2.738-.949-.816-2.809-.97 2.793-2.795.953 2.812.822Zm.847-1.718.808.806-.807.806-.808-.806.807-.806ZM47.898 52.167a4.965 4.965 0 0 1-4.964-4.96 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.96Zm0-9.104a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M38.178 67.092s-.04 0-.061-.004a.406.406 0 0 1-.343-.464 35.614 35.614 0 0 1 6.782-16.09.408.408 0 0 1 .652.489 34.8 34.8 0 0 0-6.627 15.723.404.404 0 0 1-.403.346ZM51.346 44.618a.407.407 0 0 1-.253-.725A35.663 35.663 0 0 1 66.87 36.88a.41.41 0 0 1 .473.33c.041.22-.11.431-.33.472A34.877 34.877 0 0 0 51.6 44.537a.412.412 0 0 1-.253.086v-.005Z'/%3E%3Cpath fill='%23C4C4C4' d='M67.315 37.665a.41.41 0 0 1-.404-.342l-3.224-20.336a.403.403 0 0 1 .339-.464.406.406 0 0 1 .464.338l3.224 20.335a.403.403 0 0 1-.338.465c-.02 0-.045.004-.065.004h.004ZM52.019 8.494a.41.41 0 0 1-.387-.28L50.429 4.52a.408.408 0 0 1 .775-.253l1.202 3.693a.408.408 0 0 1-.387.533ZM61.85 38.85a.41.41 0 0 1-.388-.281l-8.437-26.073a.408.408 0 0 1 .775-.252l8.436 26.072a.408.408 0 0 1-.387.533ZM56.82 41.105a.404.404 0 0 1-.363-.224l-9.37-18.37a.409.409 0 1 1 .73-.37l9.37 18.37a.409.409 0 0 1-.363.594h-.004ZM52.1 44.008a.407.407 0 0 1-.33-.167L30.69 14.858a.409.409 0 0 1 .661-.48l21.08 28.982a.409.409 0 0 1-.33.648ZM44.593 44.313a.418.418 0 0 1-.29-.118l-11.7-11.689a.405.405 0 1 1 .574-.574l11.701 11.689a.405.405 0 0 1-.29.692h.005ZM17.143 32.12a.412.412 0 0 1-.24-.078l-2.967-2.153a.405.405 0 0 1-.09-.57.406.406 0 0 1 .57-.09l2.968 2.154a.408.408 0 0 1-.24.737ZM44.308 51.833a.412.412 0 0 1-.24-.078L20.607 34.73a.405.405 0 0 1-.09-.57.406.406 0 0 1 .57-.09l23.46 17.027a.408.408 0 0 1-.24.737ZM41.426 56.56a.37.37 0 0 1-.183-.045L21.06 46.243a.41.41 0 0 1-.18-.55.41.41 0 0 1 .551-.179l20.183 10.272a.41.41 0 0 1-.184.773h-.004ZM39.32 61.681a.456.456 0 0 1-.127-.02L3.77 50.163a.404.404 0 0 1-.26-.512.408.408 0 0 1 .513-.261l35.421 11.497c.216.07.33.297.261.513a.41.41 0 0 1-.387.281ZM38.04 67.063c-.025 0-.045 0-.07-.004l-22.99-3.99a.408.408 0 0 1 .143-.802l22.99 3.99c.22.037.37.249.33.472a.406.406 0 0 1-.4.338l-.004-.004ZM44.14 47.253l2.797.952.97 2.793.815-2.809 2.738-.949-2.763-.802-.807-2.752-.937 2.744-2.812.823Zm2.853.09.807-.807.808.806-.807.806-.808-.806ZM98.106 101.746a4.965 4.965 0 0 1-4.964-4.958 4.965 4.965 0 0 1 9.928 0 4.964 4.964 0 0 1-4.964 4.958Zm0-9.103a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M101.118 93.624a.408.408 0 0 1-.326-.651 34.796 34.796 0 0 0 6.627-15.723.407.407 0 0 1 .465-.342c.224.032.375.24.342.464a35.593 35.593 0 0 1-6.782 16.09.413.413 0 0 1-.326.162ZM79.06 107.129a.41.41 0 0 1-.07-.811 34.874 34.874 0 0 0 15.416-6.856.407.407 0 0 1 .501.64 35.667 35.667 0 0 1-15.777 7.014c-.024.004-.049.009-.07.009v.004Z'/%3E%3Cpath fill='%23C4C4C4' d='M81.91 127.481a.41.41 0 0 1-.404-.342l-3.224-20.336a.403.403 0 0 1 .339-.464.408.408 0 0 1 .464.338l3.224 20.336a.404.404 0 0 1-.338.464c-.02 0-.045.004-.066.004h.005ZM95.184 140.012a.41.41 0 0 1-.387-.281l-1.203-3.696a.407.407 0 0 1 .775-.253l1.202 3.697a.407.407 0 0 1-.387.533ZM92.592 132.033a.41.41 0 0 1-.387-.281l-8.437-26.073a.407.407 0 0 1 .774-.252l8.437 26.072a.407.407 0 0 1-.387.534ZM98.555 122.074a.403.403 0 0 1-.363-.224l-9.37-18.369a.409.409 0 1 1 .73-.371l9.37 18.37a.408.408 0 0 1-.363.594h-.004ZM114.979 129.785a.408.408 0 0 1-.33-.167L93.57 100.635a.409.409 0 0 1 .66-.48l21.079 28.983a.409.409 0 0 1-.089.57.404.404 0 0 1-.241.077ZM113.109 112.185a.422.422 0 0 1-.29-.118l-11.701-11.689a.407.407 0 0 1 .575-.574l11.701 11.689a.405.405 0 0 1-.289.692h.004ZM131.824 114.848a.409.409 0 0 1-.24-.078l-2.968-2.153a.405.405 0 0 1-.089-.57.405.405 0 0 1 .57-.09l2.967 2.154a.407.407 0 0 1-.24.737ZM125.152 110.003a.41.41 0 0 1-.24-.077L101.452 92.9a.405.405 0 0 1-.089-.57.406.406 0 0 1 .57-.09l23.46 17.026a.407.407 0 0 1-.241.737ZM124.757 98.522a.374.374 0 0 1-.184-.045l-20.182-10.272a.41.41 0 0 1-.18-.55.411.411 0 0 1 .551-.178l20.182 10.271a.41.41 0 0 1-.183.774h-.004ZM142.103 94.63a.46.46 0 0 1-.127-.02l-35.421-11.498a.405.405 0 0 1-.261-.513.41.41 0 0 1 .514-.26l35.421 11.497c.216.07.33.297.261.513a.41.41 0 0 1-.387.28ZM130.956 81.736c-.025 0-.045 0-.069-.004l-22.991-3.99a.405.405 0 0 1-.33-.472.405.405 0 0 1 .473-.33l22.99 3.99c.22.037.371.248.33.472a.404.404 0 0 1-.399.338l-.004-.004ZM101.86 96.743l-2.796-.953-.97-2.793-.815 2.81-2.739.948 2.763.802.807 2.752.938-2.744 2.812-.822Zm-2.853-.09-.807.806-.807-.806.807-.806.807.806ZM98.106 52.167a4.965 4.965 0 0 1-4.964-4.96 4.965 4.965 0 0 1 9.928 0 4.965 4.965 0 0 1-4.964 4.96Zm0-9.104a4.153 4.153 0 0 0-4.149 4.145 4.153 4.153 0 0 0 4.15 4.144 4.153 4.153 0 0 0 4.148-4.144 4.153 4.153 0 0 0-4.149-4.145Z'/%3E%3Cpath fill='%23C4C4C4' d='M107.823 67.092a.411.411 0 0 1-.404-.346 34.816 34.816 0 0 0-6.627-15.723.408.408 0 0 1 .652-.489 35.587 35.587 0 0 1 6.782 16.09.406.406 0 0 1-.342.464c-.021 0-.041.004-.061.004ZM94.654 44.618a.42.42 0 0 1-.253-.085 34.877 34.877 0 0 0-15.414-6.856.405.405 0 0 1-.33-.472.405.405 0 0 1 .473-.33 35.709 35.709 0 0 1 15.777 7.015.404.404 0 0 1-.253.724v.005Z'/%3E%3Cpath fill='%23C4C4C4' d='M78.686 37.665c-.02 0-.041 0-.066-.004a.405.405 0 0 1-.338-.465l3.224-20.335a.405.405 0 0 1 .465-.338.405.405 0 0 1 .338.464l-3.224 20.336a.407.407 0 0 1-.403.342h.004ZM93.986 8.494a.404.404 0 0 1-.387-.533L94.8 4.268a.408.408 0 0 1 .513-.26c.216.069.33.297.261.513l-1.202 3.692a.41.41 0 0 1-.387.281ZM84.151 38.85a.404.404 0 0 1-.387-.533l8.437-26.073a.408.408 0 0 1 .774.252L84.538 38.57a.41.41 0 0 1-.387.28ZM89.185 41.105a.41.41 0 0 1-.363-.594l9.37-18.37a.41.41 0 0 1 .73.37l-9.37 18.37a.409.409 0 0 1-.363.224h-.004ZM93.9 44.008a.405.405 0 0 1-.33-.647l21.079-28.984a.41.41 0 0 1 .571-.09c.183.13.224.387.089.57L94.23 43.842a.407.407 0 0 1-.33.167ZM101.407 44.313a.405.405 0 0 1-.289-.692l11.701-11.689a.407.407 0 0 1 .575.574l-11.701 11.689a.402.402 0 0 1-.29.118h.004ZM128.857 32.12a.407.407 0 0 1-.241-.737l2.968-2.154a.408.408 0 1 1 .48.66l-2.967 2.153a.402.402 0 0 1-.24.078ZM101.693 51.833a.409.409 0 0 1-.241-.737l23.46-17.026a.413.413 0 0 1 .57.09.409.409 0 0 1-.089.57l-23.46 17.025a.402.402 0 0 1-.24.078ZM104.574 56.56a.41.41 0 0 1-.183-.774l20.182-10.272a.408.408 0 1 1 .371.729l-20.182 10.272a.437.437 0 0 1-.184.044h-.004ZM106.681 61.681a.408.408 0 0 1-.126-.794l35.421-11.497a.409.409 0 0 1 .514.26.408.408 0 0 1-.261.514L106.808 61.66a.46.46 0 0 1-.127.02ZM107.961 67.063a.401.401 0 0 1-.399-.338.412.412 0 0 1 .33-.472l22.991-3.99a.41.41 0 0 1 .472.33.412.412 0 0 1-.33.472l-22.991 3.99c-.024 0-.048.004-.069.004l-.004.004ZM99.048 46.434l-.938-2.744-.807 2.752-2.763.802 2.739.949.815 2.81.97-2.794 2.796-.952-2.812-.823Zm-.848 1.718-.807-.806.807-.806.807.806-.807.806Z'/%3E%3C/svg%3E");
  background-size: cover;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_image::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_image::before {
  display: block;
  content: "";
  width: 104px;
  height: 104px;
  position: absolute;
  background-color: #707070;
  z-index: 1;
  border-radius: 50%;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image img,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_image img,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_image img {
  position: relative;
  width: 77.04px;
  height: 77.04px;
  z-index: 2;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image.default img,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_image.default img,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_image.default img {
  width: 104px;
  height: auto;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .line,
#mabinogim .support .user_profile_wrap .order_2 .layout .line,
#mabinogim .container .user_profile_wrap .order_2 .layout .line {
  display: block;
  min-width: 8px;
  width: 8px;
  height: 224px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='224' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath stroke='%23E8E8E8' stroke-miterlimit='10' stroke-width='2' d='m2.164 116.308 4.641-4.366-1.415-1.419M5.836 107.633 1.196 112l1.42 1.418'/%3E%3Cpath fill='%23E8E8E8' d='M5 105.5H3s.266-85 .96-85c.696 0 1.04 85 1.04 85Z'/%3E%3Cpath fill='%23E8E8E8' d='M6.092 105.416 4 107.331l-2.092-1.915L4 103.5l2.092 1.916ZM5 118.5H3s.258 85 .953 85 1.04-85 1.04-85H5ZM2.61 108.737l-1.079-.987 1.08-.988 1.078.988-1.079.987ZM5.8 116.972l-1.078-.988 1.079-.988 1.078.988-1.078.988Z'/%3E%3Cpath fill='%23E8E8E8' d='M4 120.331 2 118.5l2-1.831 2 1.831-2 1.831Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 .5v223h8V.5z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-size: cover;
  margin: 0 60px 0 50px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  min-height: 160px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info h1,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info h1,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info h1 {
  font-family: "Pretendard-Bold";
  color: #9f9f9f;
  font-size: 14px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_name,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_name,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_name {
  font-family: "Pretendard-Bold";
  display: inline-block;
  margin-top: 15px;
  max-width: 100%;
  font-size: 20px;
  color: #5c5c5c;
  line-height: 130%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul {
  margin-top: 20px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li:last-child,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li:last-child,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li:last-child {
  margin-bottom: 0;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li span,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li span,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li span {
  font-family: "Pretendard-Bold";
  display: flex;
  align-items: center;
  color: #5c5c5c;
  font-size: 16px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child {
  color: #8e8e8e;
  font-size: 12px;
  width: 72px;
  font-weight: 500;
  white-space: nowrap;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before {
  display: block;
  content: "";
  min-width: 12px;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23D9D9D9' d='M0 0h12v12H0z'/%3E%3Cpath fill='%23fff' d='M9 2h1v1H9V2ZM8 3h1v1H8V3ZM7 4h1v1H7V4ZM6 5h1v1H6V5ZM5 6h1v1H5V6ZM4 7h1v1H4V7ZM3 8h1v1H3V8ZM2 9h1v1H2V9Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='12' height='12' fill='%23fff' rx='3'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 10px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area {
  position: relative;
  margin-top: 30px;
  display: flex;
  width: 100%;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button {
  padding: 7px 16px;
  background: #8c8c8c;
  width: min-content;
  display: flex;
  align-items: center;
  white-space: nowrap;
  border-radius: 12px;
  font-size: 12px;
  color: #fff;
  margin-right: 10px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button:hover,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button:hover,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_change_button::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_change_button::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_change_button::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14Zm0-1.4A5.6 5.6 0 1 0 8 2.4a5.6 5.6 0 0 0 0 11.2ZM4.841 9.041a.2.2 0 0 1 .142-.341H10.6c.11 0 .2.09.2.2v1a.2.2 0 0 1-.2.2H8v.893a.5.5 0 0 1-.854.353L4.841 9.041ZM8 5.9v-.893a.5.5 0 0 1 .854-.353l2.305 2.305a.2.2 0 0 1-.142.341H5.4a.2.2 0 0 1-.2-.2v-1c0-.11.09-.2.2-.2H8Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.off::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.off::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.off::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23fff' d='M.667 10V6a4 4 0 0 1 4-4h6.667a4 4 0 0 1 4 4v4a4 4 0 0 1-4 4H4.667a4 4 0 0 1-4-4Z'/%3E%3Cpath stroke='%23fff' d='M4.667 6a2 2 0 1 1 0 4 2 2 0 0 1 0-4Z'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' d='M8 10V6h2m1.333 4V6h2M8 8h1.715m1.618 0h1.715'/%3E%3C/svg%3E");
  background-size: 100% auto;
  margin-right: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.on::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.on::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_onOff_button.on::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23fff' d='M.667 10V6a4 4 0 0 1 4-4h6.667a4 4 0 0 1 4 4v4a4 4 0 0 1-4 4H4.667a4 4 0 0 1-4-4Z'/%3E%3Cpath stroke='%23fff' d='M6 6a2 2 0 1 1 0 4 2 2 0 0 1 0-4Z'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' d='M9.334 10V6l2.667 4V6'/%3E%3C/svg%3E");
  background-size: 100% auto;
  margin-right: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_notice_button::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_notice_button::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button.character_notice_button::before {
  display: block;
  content: "";
  min-width: 18px;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Ccircle cx='6' cy='5' r='4' fill='%23fff'/%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M7.504 9.81A6.01 6.01 0 0 1 6 10a5.973 5.973 0 0 1-3.581-1.185C1.09 9.753 0 11.172 0 13c0 2.006 3.754 2.002 5.807 2h.386c.516 0 1.14.001 1.784-.03A4.978 4.978 0 0 1 7 12c0-.785.181-1.529.504-2.19ZM16 12a4 4 0 1 1-8 0 4 4 0 0 1 8 0Zm-3.5-2a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0Zm-1 1.5a.5.5 0 0 0 0 1V14a.5.5 0 0 0 .5.5h.5a.5.5 0 0 0 0-1V12a.5.5 0 0 0-.5-.5h-.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span {
  color: #5c5c5c;
  display: block;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1),
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1),
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) {
  font-family: "Pretendard-Bold";
  margin-top: 12px;
  max-width: 100%;
  font-size: 24px;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile {
  display: none;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2),
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2),
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) {
  font-family: "Pretendard-Medium";
  margin-top: 16px;
  max-width: 100%;
  font-size: 16px;
  font-weight: 500;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br {
  display: none;
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button {
  margin-top: 10px;
  padding: 5px 10px;
  background: #8c8c8c;
  width: min-content;
  display: flex;
  align-items: center;
  white-space: nowrap;
  border-radius: 12px;
  font-size: 12px;
  color: #fff;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button:hover,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button:hover,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button::before,
#mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button::before,
#mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty button.character_change_button::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' d='M13.266 8.44a.667.667 0 0 1 0-.88l.854-.96a.667.667 0 0 0 .08-.78l-1.334-2.307a.667.667 0 0 0-.713-.32l-1.253.254a.667.667 0 0 1-.767-.44l-.407-1.22a.667.667 0 0 0-.633-.454H6.426a.667.667 0 0 0-.666.454l-.374 1.22a.667.667 0 0 1-.766.44l-1.287-.254a.667.667 0 0 0-.667.32L1.333 5.82a.667.667 0 0 0 .067.78l.846.96a.667.667 0 0 1 0 .88L1.4 9.4a.667.667 0 0 0-.067.78l1.333 2.307a.667.667 0 0 0 .714.32l1.253-.254a.667.667 0 0 1 .767.44l.406 1.22a.667.667 0 0 0 .667.454H9.14a.667.667 0 0 0 .633-.454l.407-1.22a.667.667 0 0 1 .766-.44l1.254.254a.667.667 0 0 0 .713-.32l1.333-2.307a.667.667 0 0 0-.08-.78l-.9-.96Zm-.993.893.533.6-.853 1.48-.787-.16a2 2 0 0 0-2.3 1.334l-.253.746H6.906l-.24-.76a2 2 0 0 0-2.3-1.333l-.786.16-.867-1.473.533-.6a2 2 0 0 0 0-2.667l-.533-.6.853-1.467.787.16a2 2 0 0 0 2.3-1.333l.253-.753h1.707l.253.76a2 2 0 0 0 2.3 1.333l.787-.16.853 1.48-.533.6a2 2 0 0 0 0 2.653Zm-4.513-4a2.667 2.667 0 1 0 0 5.334 2.667 2.667 0 0 0 0-5.334Zm0 4a1.333 1.333 0 1 1 0-2.666 1.333 1.333 0 0 1 0 2.666Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 8px;
}
#mabinogim .my_page .badge_wrap,
#mabinogim .support .badge_wrap,
#mabinogim .container .badge_wrap {
  margin-top: 40px;
}
#mabinogim .my_page .badge_wrap h1,
#mabinogim .support .badge_wrap h1,
#mabinogim .container .badge_wrap h1 {
  display: flex;
  align-items: center;
}
#mabinogim .my_page .badge_wrap h1 span,
#mabinogim .support .badge_wrap h1 span,
#mabinogim .container .badge_wrap h1 span {
  color: #525252;
  font-size: 22px;
  font-weight: 500;
  margin-right: 8px;
}
#mabinogim .my_page .badge_wrap h1 button.badge_history_button,
#mabinogim .support .badge_wrap h1 button.badge_history_button,
#mabinogim .container .badge_wrap h1 button.badge_history_button {
  display: flex;
  align-items: center;
  background: #8c8c8c;
  font-size: 12px;
  font-family: 500;
  border-radius: 12px;
  color: #fff;
  width: min-content;
  padding: 7px 16px;
  white-space: nowrap;
}
#mabinogim .my_page .badge_wrap h1 button.badge_history_button::before,
#mabinogim .support .badge_wrap h1 button.badge_history_button::before,
#mabinogim .container .badge_wrap h1 button.badge_history_button::before {
  display: block;
  content: "";
  min-width: 16px;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath fill='%23fff' d='m8 1.75.296-.69a.75.75 0 0 0-.591 0L8 1.75Zm0 13.5-.372.651a.75.75 0 0 0 .744 0L8 15.251ZM7.705 1.06 2.909 3.117l.591 1.38L8.296 2.44l-.591-1.38ZM2 4.496V9.64h1.5V4.496L2 4.495Zm2.645 9.702 2.983 1.704.744-1.302-2.983-1.704-.744 1.302Zm3.727 1.704 2.983-1.704-.744-1.302-2.983 1.704.744 1.302ZM14 9.64V4.496h-1.5V9.64L14 9.64Zm-.909-6.523L8.296 1.061 7.705 2.44 12.5 4.496l.591-1.38ZM14 4.496a1.5 1.5 0 0 0-.909-1.38l-.591 1.38H14Zm-2.645 9.701A5.247 5.247 0 0 0 14 9.64h-1.5a3.75 3.75 0 0 1-1.89 3.256l.745 1.302ZM2 9.64a5.247 5.247 0 0 0 2.645 4.557l.744-1.302A3.75 3.75 0 0 1 3.5 9.64H2Zm.909-6.524A1.502 1.502 0 0 0 2 4.495h1.5l-.591-1.38ZM7.377 5.47a.647.647 0 0 1 1.246 0l.26.83c.087.28.338.47.622.47h.839c.634 0 .898.844.385 1.232l-.68.513a.696.696 0 0 0-.237.761l.26.83c.195.627-.495 1.149-1.008.76l-.68-.512a.635.635 0 0 0-.769 0l-.679.513c-.513.387-1.203-.134-1.007-.761l.259-.83a.696.696 0 0 0-.238-.761l-.679-.513c-.513-.388-.25-1.231.385-1.231h.84c.283 0 .534-.19.622-.47l.26-.83Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .badge_wrap h1 button.badge_history_button:hover,
  #mabinogim .support .badge_wrap h1 button.badge_history_button:hover,
  #mabinogim .container .badge_wrap h1 button.badge_history_button:hover {
    background: #2c9b72;
  }
}
#mabinogim .my_page .badge_wrap .badge_list_area,
#mabinogim .support .badge_wrap .badge_list_area,
#mabinogim .container .badge_wrap .badge_list_area {
  margin-top: 20px;
  border-radius: 24px;
  border: 1px solid #dbdbdb;
  padding: 20px 30px;
  display: flex;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list,
#mabinogim .support .badge_wrap .badge_list_area .badge_list,
#mabinogim .container .badge_wrap .badge_list_area .badge_list {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding-right: 20px;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul {
  width: 100%;
  display: flex;
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul:active,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul:active,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul:active {
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul::-webkit-scrollbar,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul::-webkit-scrollbar,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul::-webkit-scrollbar {
  display: none;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul li,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul li,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul li {
  margin-right: 30px;
  min-width: 80px;
  width: 80px;
  height: 80px;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul li:last-child,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul li:last-child,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul li:last-child {
  margin-right: 0;
}
#mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul li img,
#mabinogim .support .badge_wrap .badge_list_area .badge_list ul li img,
#mabinogim .container .badge_wrap .badge_list_area .badge_list ul li img {
  -webkit-user-drag: none;
  width: 100%;
}
#mabinogim .my_page .badge_wrap .badge_list_area button,
#mabinogim .support .badge_wrap .badge_list_area button,
#mabinogim .container .badge_wrap .badge_list_area button {
  display: flex;
  min-width: 95px;
  height: 80px;
  padding: 5px 0px 5px 20px;
  justify-content: center;
  align-items: center;
  border-radius: 24px;
  border-left: 1px solid #626262;
  background: linear-gradient(90deg, rgba(223, 223, 223, 0.68) 0%, rgba(223, 223, 223, 0) 36.84%);
  font-size: 14px;
  color: #525252;
}
#mabinogim .my_page .badge_wrap .badge_list_area button::before,
#mabinogim .support .badge_wrap .badge_list_area button::before,
#mabinogim .container .badge_wrap .badge_list_area button::before {
  display: block;
  content: "";
  min-width: 12px;
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect width='14' height='14' fill='%23626262' rx='4'/%3E%3Cpath fill='%23fff' d='M11 6v2H3V6z'/%3E%3Cpath fill='%23fff' d='M6 3h2v8H6z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 10px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .badge_wrap .badge_list_area button:hover,
  #mabinogim .support .badge_wrap .badge_list_area button:hover,
  #mabinogim .container .badge_wrap .badge_list_area button:hover {
    border-left: 1px solid #acacac;
  }
}
#mabinogim .my_page .badge_wrap .badge_empty,
#mabinogim .support .badge_wrap .badge_empty,
#mabinogim .container .badge_wrap .badge_empty {
  margin-top: 20px;
  border-radius: 24px;
  border: 1px solid #dbdbdb;
  padding: 20px 30px;
  display: flex;
  align-items: center;
}
#mabinogim .my_page .badge_wrap .badge_empty::before,
#mabinogim .support .badge_wrap .badge_empty::before,
#mabinogim .container .badge_wrap .badge_empty::before {
  content: "";
  display: block;
  width: 76px;
  min-width: 76px;
  height: 76px;
  background: #aaa url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='M23 15.094v8.625M23 5.03l15.094 5.75v14.375c0 6.469-5.75 12.938-15.094 15.813-9.344-2.875-15.094-8.625-15.094-15.813V10.781L23 5.031Z'/%3E%3Ccircle cx='23' cy='31' r='2' fill='%23fff'/%3E%3C/svg%3E") no-repeat;
  background-position: center center;
  border-radius: 60px;
}
#mabinogim .my_page .badge_wrap .badge_empty span,
#mabinogim .support .badge_wrap .badge_empty span,
#mabinogim .container .badge_wrap .badge_empty span {
  margin-left: 30px;
  color: #626262;
  font-size: 16px;
  line-height: 130%; /* 20.8px */
  letter-spacing: -0.32px;
}
#mabinogim .my_page .normal_list_wrap .filter_area,
#mabinogim .support .normal_list_wrap .filter_area,
#mabinogim .container .normal_list_wrap .filter_area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  display: flex;
  padding: 10px;
  border-radius: 24px;
  background-color: #fff;
  width: 100%;
  margin: 40px 0;
  gap: 10px;
}
#mabinogim .my_page .normal_list_wrap .filter_area button,
#mabinogim .support .normal_list_wrap .filter_area button,
#mabinogim .container .normal_list_wrap .filter_area button {
  position: relative;
  color: #5c5c5c;
  padding: 15px;
  flex: 1;
  font-size: min(16px, 1vw);
  font-weight: 600;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .my_page .normal_list_wrap .filter_area button:hover,
  #mabinogim .support .normal_list_wrap .filter_area button:hover,
  #mabinogim .container .normal_list_wrap .filter_area button:hover {
    background: #222632;
    color: #fff;
    border-radius: 12px;
  }
}
#mabinogim .my_page .normal_list_wrap .filter_area button.active, #mabinogim .my_page .normal_list_wrap .filter_area button.on,
#mabinogim .support .normal_list_wrap .filter_area button.active,
#mabinogim .support .normal_list_wrap .filter_area button.on,
#mabinogim .container .normal_list_wrap .filter_area button.active,
#mabinogim .container .normal_list_wrap .filter_area button.on {
  background: #222632;
  color: #fff;
  border-radius: 12px;
}

@media (max-width: 1620px) {
  #mabinogim .my_page,
  #mabinogim .support,
  #mabinogim .container {
    padding: 20px 20px 57px;
  }
  #mabinogim .my_page .user_profile_wrap,
  #mabinogim .support .user_profile_wrap,
  #mabinogim .container .user_profile_wrap {
    background: #fff;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_1,
  #mabinogim .support .user_profile_wrap .order_1,
  #mabinogim .container .user_profile_wrap .order_1 {
    position: relative;
    background: #2e313c;
    width: 100%;
    max-width: 100%;
    display: flex;
    align-items: center;
    border-radius: 24px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout,
  #mabinogim .support .user_profile_wrap .order_1 .layout,
  #mabinogim .container .user_profile_wrap .order_1 .layout {
    width: 100%;
    display: flex;
    align-items: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .line,
  #mabinogim .support .user_profile_wrap .order_1 .layout .line,
  #mabinogim .container .user_profile_wrap .order_1 .layout .line {
    margin: 0 50px 0 30px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info h1,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info h1,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info h1 {
    color: #adb2c6;
    font-size: 14px;
    font-weight: bold;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul {
    margin-top: 20px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info ul li,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info ul li,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info ul li {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area {
    margin-top: 30px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button.profile_change_button {
    padding: 8px 16px;
    background: #8c8c8c;
    border-radius: 12px;
    font-size: 12px;
    color: #fff;
    display: flex;
    align-items: center;
    white-space: nowrap;
  }
  #mabinogim .my_page .user_profile_wrap .order_2,
  #mabinogim .support .user_profile_wrap .order_2,
  #mabinogim .container .user_profile_wrap .order_2 {
    position: relative;
    display: flex;
    width: 100%;
    max-height: 100%;
  }
  #mabinogim .my_page .user_profile_wrap .order_2:has(.layout),
  #mabinogim .support .user_profile_wrap .order_2:has(.layout),
  #mabinogim .container .user_profile_wrap .order_2:has(.layout) {
    padding: 30px 10px 30px 50px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout,
  #mabinogim .support .user_profile_wrap .order_2 .layout,
  #mabinogim .container .user_profile_wrap .order_2 .layout {
    width: 100%;
    display: flex;
    align-items: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty {
    display: flex;
    width: 100%;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty::before {
    margin-left: 18px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub {
    display: flex;
    width: 100%;
    justify-content: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub span {
    font-family: "Pretendard-Bold";
    color: #5c5c5c;
    text-align: center;
    font-size: 20px;
    line-height: 140%; /* 28px */
    letter-spacing: -0.5px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area {
    margin-top: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area button,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area button,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area button {
    padding: 14px 54px;
    border-radius: 14px;
    background: #0fb376;
    color: #fff;
    font-weight: 500;
    font-size: 16px;
    white-space: nowrap;
    max-width: 164px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1),
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1),
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area button:first-child:nth-last-child(1) {
    max-width: 195px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_regist_button {
    background: #0fb376;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area .pre_character_name_button {
    background: #8c8c8c;
  }
  #mabinogim .my_page .badge_wrap,
  #mabinogim .support .badge_wrap,
  #mabinogim .container .badge_wrap {
    margin-top: 40px;
  }
  #mabinogim .my_page .badge_wrap h1,
  #mabinogim .support .badge_wrap h1,
  #mabinogim .container .badge_wrap h1 {
    display: flex;
    align-items: center;
  }
  #mabinogim .my_page .badge_wrap h1 span,
  #mabinogim .support .badge_wrap h1 span,
  #mabinogim .container .badge_wrap h1 span {
    color: #525252;
    font-size: 16px;
    font-weight: 500;
    margin-right: 8px;
  }
  #mabinogim .my_page .badge_wrap h1 button,
  #mabinogim .support .badge_wrap h1 button,
  #mabinogim .container .badge_wrap h1 button {
    display: flex;
    align-items: center;
    background: #525252;
    font-size: 12px;
    font-family: 500;
    border-radius: 12px;
    color: #fff;
    width: min-content;
    padding: 5px 10px;
    white-space: nowrap;
  }
  #mabinogim .my_page .badge_wrap .badge_list_area,
  #mabinogim .support .badge_wrap .badge_list_area,
  #mabinogim .container .badge_wrap .badge_list_area {
    padding: 10px 15px;
  }
  #mabinogim .my_page .badge_wrap .badge_list_area .badge_list ul li,
  #mabinogim .support .badge_wrap .badge_list_area .badge_list ul li,
  #mabinogim .container .badge_wrap .badge_list_area .badge_list ul li {
    margin-right: 20px;
  }
  #mabinogim .my_page .badge_wrap .badge_list_area button,
  #mabinogim .support .badge_wrap .badge_list_area button,
  #mabinogim .container .badge_wrap .badge_list_area button {
    display: flex;
    min-width: 95px;
    height: 80px;
    padding: 5px 0px 5px 20px;
    justify-content: center;
    align-items: center;
    border-radius: 24px;
    border-left: 1px solid #626262;
    background: linear-gradient(90deg, rgba(223, 223, 223, 0.68) 0%, rgba(223, 223, 223, 0) 36.84%);
    font-size: 14px;
    color: #525252;
  }
  #mabinogim .my_page .badge_wrap .badge_list_area button::before,
  #mabinogim .support .badge_wrap .badge_list_area button::before,
  #mabinogim .container .badge_wrap .badge_list_area button::before {
    display: block;
    content: "";
    min-width: 12px;
    width: 12px;
    height: 12px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none'%3E%3Crect width='14' height='14' fill='%23626262' rx='4'/%3E%3Cpath fill='%23fff' d='M11 6v2H3V6z'/%3E%3Cpath fill='%23fff' d='M6 3h2v8H6z'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 10px;
  }
  #mabinogim .my_page .normal_list_wrap .filter_area,
  #mabinogim .support .normal_list_wrap .filter_area,
  #mabinogim .container .normal_list_wrap .filter_area {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
  }
  #mabinogim .my_page .normal_list_wrap .filter_area button,
  #mabinogim .support .normal_list_wrap .filter_area button,
  #mabinogim .container .normal_list_wrap .filter_area button {
    position: relative;
    padding: 10px;
    font-size: min(12px, 4vw);
  }
}
@media (max-width: 768px) {
  #mabinogim .my_page .user_profile_wrap,
  #mabinogim .support .user_profile_wrap,
  #mabinogim .container .user_profile_wrap {
    background: #fff;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_1,
  #mabinogim .support .user_profile_wrap .order_1,
  #mabinogim .container .user_profile_wrap .order_1 {
    position: relative;
    background: #2e313c;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    justify-content: center;
    border-radius: 24px;
    overflow: hidden;
    padding: 20px 10px 30px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout,
  #mabinogim .support .user_profile_wrap .order_1 .layout,
  #mabinogim .container .user_profile_wrap .order_1 .layout {
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .line,
  #mabinogim .support .user_profile_wrap .order_1 .layout .line,
  #mabinogim .container .user_profile_wrap .order_1 .layout .line {
    display: none;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info {
    margin-top: 16px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info h1,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info h1,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info h1 {
    color: #adb2c6;
    font-size: 12px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .user_name,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .user_name,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .user_name {
    margin-top: 10px;
    font-size: 14px;
    color: #d5d6d8;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area {
    display: flex;
    position: relative;
    left: 0%;
    gap: 4px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout::after,
  #mabinogim .support .user_profile_wrap .order_1 .layout::after,
  #mabinogim .container .user_profile_wrap .order_1 .layout::after {
    bottom: 13px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2,
  #mabinogim .support .user_profile_wrap .order_2,
  #mabinogim .container .user_profile_wrap .order_2 {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
  }
  #mabinogim .my_page .user_profile_wrap .order_2:has(.layout),
  #mabinogim .support .user_profile_wrap .order_2:has(.layout),
  #mabinogim .container .user_profile_wrap .order_2:has(.layout) {
    padding: 20px 20px 25px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout,
  #mabinogim .support .user_profile_wrap .order_2 .layout,
  #mabinogim .container .user_profile_wrap .order_2 .layout {
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .line,
  #mabinogim .support .user_profile_wrap .order_2 .layout .line,
  #mabinogim .container .user_profile_wrap .order_2 .layout .line {
    display: none;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_image,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_image {
    margin: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info {
    margin-top: 16px;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info h1,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info h1,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info h1 {
    font-size: 12px;
    text-align: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_name,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_name,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_name {
    font-size: 14px;
    margin-top: 15px;
    text-align: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child {
    color: #8e8e8e;
    font-size: 12px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info ul li span:first-child::before {
    display: block;
    content: "";
    min-width: 12px;
    width: 12px;
    height: 12px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23D9D9D9' d='M0 0h12v12H0z'/%3E%3Cpath fill='%23fff' d='M9 2h1v1H9V2ZM8 3h1v1H8V3ZM7 4h1v1H7V4ZM6 5h1v1H6V5ZM5 6h1v1H5V6ZM4 7h1v1H4V7ZM3 8h1v1H3V8ZM2 9h1v1H2V9Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Crect width='12' height='12' fill='%23fff' rx='3'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 10px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area {
    display: flex;
    justify-content: center;
    position: relative;
    gap: 4px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button {
    padding: 8px 16px;
    border-radius: 12px;
    font-size: 12px;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
    margin: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty {
    align-items: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span {
    text-align: center;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1),
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1),
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) {
    font-size: 20px;
    line-height: 24px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(1) .only_mobile {
    display: block;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2),
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2),
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) {
    line-height: 140%;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .user_empty span:nth-child(2) br {
    display: block;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty::before {
    margin-left: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub {
    margin-top: 30px;
    margin-left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub span {
    color: #5c5c5c;
    text-align: center;
    font-size: 20px;
    line-height: 140%; /* 28px */
    letter-spacing: -0.5px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area {
    margin-top: 25px;
    font-size: 14px;
  }
}
@media (max-width: 520px) {
  #mabinogim .my_page .user_profile_wrap,
  #mabinogim .support .user_profile_wrap,
  #mabinogim .container .user_profile_wrap {
    background: #fff;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_1,
  #mabinogim .support .user_profile_wrap .order_1,
  #mabinogim .container .user_profile_wrap .order_1 {
    position: relative;
    background: #2e313c;
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    display: flex;
    justify-content: center;
    border-radius: 24px;
    overflow: hidden;
    padding: 20px 10px 30px;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout,
  #mabinogim .support .user_profile_wrap .order_1 .layout,
  #mabinogim .container .user_profile_wrap .order_1 .layout {
    width: 100%;
    display: flex;
    align-items: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .line,
  #mabinogim .support .user_profile_wrap .order_1 .layout .line,
  #mabinogim .container .user_profile_wrap .order_1 .layout .line {
    display: none;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info {
    width: 100%;
    padding: 0 10px;
    display: flex;
    overflow: hidden;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area {
    display: flex;
    flex-wrap: wrap;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout .profile_info .button_area button,
  #mabinogim .support .user_profile_wrap .order_1 .layout .profile_info .button_area button,
  #mabinogim .container .user_profile_wrap .order_1 .layout .profile_info .button_area button {
    width: 100%;
    margin-bottom: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_1 .layout::after,
  #mabinogim .support .user_profile_wrap .order_1 .layout::after,
  #mabinogim .container .user_profile_wrap .order_1 .layout::after {
    bottom: 13px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2,
  #mabinogim .support .user_profile_wrap .order_2,
  #mabinogim .container .user_profile_wrap .order_2 {
    position: relative;
    display: flex;
    justify-content: center;
    width: 100%;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_image,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_image,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_image {
    margin: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area {
    display: flex;
    flex-wrap: wrap;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .layout .profile_info .button_area button,
  #mabinogim .support .user_profile_wrap .order_2 .layout .profile_info .button_area button,
  #mabinogim .container .user_profile_wrap .order_2 .layout .profile_info .button_area button {
    width: 100%;
    margin-bottom: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty::before,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty::before {
    margin-left: 0;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub {
    margin-top: 30px;
    margin-left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub span,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub span {
    color: #5c5c5c;
    text-align: center;
    font-size: 20px;
    line-height: 140%; /* 28px */
    letter-spacing: -0.5px;
  }
  #mabinogim .my_page .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .support .user_profile_wrap .order_2 .character_empty .sub .button_area,
  #mabinogim .container .user_profile_wrap .order_2 .character_empty .sub .button_area {
    margin-top: 25px;
    font-size: 14px;
  }
}
#mabinogim .normal_list_wrap .list_area > ul {
  border-bottom: 1px solid #aaa;
}
#mabinogim .normal_list_wrap .list_area > ul > li {
  position: relative;
  height: 100px;
  border-top: 1px solid #aaa;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
}
#mabinogim .normal_list_wrap .list_area > ul > li::before {
  display: block;
  content: "";
  width: 5px;
  height: 100%;
  background: #00b670;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.5s;
  opacity: 0;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 {
  display: flex;
  align-items: center;
  max-width: 52%;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .type {
  display: flex;
  width: min-content;
  border: 1px solid #d9d9d9;
  font-size: 14px;
  color: #626262;
  background: #fff;
  border-radius: 20px;
  padding: 5px 15px;
  margin-right: 12px;
  white-space: nowrap;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .type span {
  display: flex;
  align-items: center;
  width: min-content;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .type span:last-child::after {
  display: none;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .type span::after {
  display: block;
  content: "";
  width: 5px;
  height: 8px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='8' fill='none'%3E%3Cpath fill='%23D9D9D9' d='M3 3h1v2H3V3ZM2 2h1v1H2V2ZM1 1h1v1H1V1ZM0 0h1v1H0V0ZM2 5h1v1H2V5ZM1 6h1v1H1V6ZM0 7h1v1H0V7ZM0 6h1v1H0V6ZM1 5h1v1H1V5ZM2 3h1v2H2V3ZM1 2h1v1H1V2ZM0 1h1v1H0V1ZM1 7h1v1H1V7ZM2 6h1v1H2V6ZM3 5h1v1H3V5ZM4 3h1v2H4V3ZM3 2h1v1H3V2ZM2 1h1v1H2V1ZM1 0h1v1H1V0Z'/%3E%3C/svg%3E") no-repeat;
  margin: 0 6px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .title {
  position: relative;
  width: 100%;
  margin-right: 6px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .title span {
  display: inline-block;
  max-width: 100%;
  font-size: 18px;
  line-height: 24px;
  color: #525252;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .title span b {
  color: #f65606;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc {
  display: flex;
  align-items: center;
  margin-right: 12px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div {
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #707070;
  margin-right: 6px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.comment {
  white-space: nowrap;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.comment::before {
  display: block;
  content: "";
  width: 18px;
  min-width: 18px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238E8E8E' d='m4 17-3-2h3v2Z'/%3E%3Cpath fill='%23AAA' d='M1 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H1V7Z'/%3E%3Cpath fill='%23F6F4F4' d='M4 9h2v2H4V9ZM8 9h2v2H8V9ZM12 9h2v2h-2V9Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 2px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.etc_photo::before {
  display: block;
  content: "";
  min-width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none'%3E%3Cpath fill='%23AAA' d='M2 4a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4Z'/%3E%3Cpath fill='%23F6F4F4' d='m6.196 9.206-2.16 3.24A1 1 0 0 0 4.87 14h8.592a1 1 0 0 0 .914-1.406l-2.16-4.86c-.39-.877-1.672-.754-1.888.182L10 9.339c-.194.839-1.288 1.057-1.788.356l-.369-.516a1 1 0 0 0-1.646.027Z'/%3E%3Crect width='3' height='3' x='5' y='4' fill='%23F6F4F4' rx='1.5'/%3E%3C/svg%3E");
  background-size: cover;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.etc_video::before {
  display: block;
  content: "";
  min-width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none'%3E%3Cpath fill='%23AAA' d='M2 4a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4Z'/%3E%3Cpath fill='%23fff' d='M11.5 8.134a1 1 0 0 1 0 1.732l-3 1.732a1 1 0 0 1-1.5-.866V7.268a1 1 0 0 1 1.5-.866l3 1.732Z'/%3E%3C/svg%3E");
  background-size: cover;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 {
  display: flex;
  align-items: center;
  max-width: 550px;
  min-width: 550px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .profile_image {
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 50%;
  overflow: hidden;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .profile_image img {
  width: 100%;
  height: 100%;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .name {
  margin-left: 10px;
  color: #5c5c5c;
  font-size: 16px;
  letter-spacing: -0.28px;
  max-width: 230px;
  min-width: 230px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info {
  display: flex;
  margin-left: auto;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info div {
  display: flex;
  align-items: center;
  width: 70px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info div span {
  font-size: 14px;
  color: #707070;
  white-space: nowrap;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .view {
  margin-right: 12px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .view::before {
  display: block;
  content: "";
  min-width: 18px;
  width: 18px;
  height: 10px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' fill='none'%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 10c5.61 0 9-4.22 9-5 0-.78-3.39-5-9-5-4.809 0-9 4.22-9 5 0 .78 4.191 5 9 5Zm0-1.25c2.13 0 3.857-1.679 3.857-3.75 0-2.071-1.727-3.75-3.857-3.75S5.143 2.929 5.143 5C5.143 7.071 6.87 8.75 9 8.75Z' clip-rule='evenodd'/%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 7.5c1.42 0 2.571-1.12 2.571-2.5H9V2.5C7.58 2.5 6.428 3.62 6.428 5S7.58 7.5 9 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 6px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .like::before {
  display: block;
  content: "";
  width: 12px;
  min-width: 12px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='11' fill='none'%3E%3Cpath fill='%23AAA' d='M0 2v4l3 3 3 2 3-2 3-3V2L9 0 6 2 3 0 0 2Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 6px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .date {
  margin-left: 40px;
}
#mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .date span {
  color: #aaa;
}
#mabinogim .normal_list_wrap .list_area > ul > li.on {
  background: #fff;
}
#mabinogim .normal_list_wrap .list_area > ul > li.on::before {
  opacity: 1;
}
#mabinogim .normal_list_wrap .list_area > ul > li.on .order_1 .title span {
  color: #f65606;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .normal_list_wrap .list_area > ul > li:hover {
    background: #fff;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li:hover::before {
    opacity: 1;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li:hover .order_1 .title span {
    color: #f65606;
  }
}
#mabinogim .normal_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .normal_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .normal_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .normal_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .normal_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .normal_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .normal_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .normal_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .normal_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .normal_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .normal_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .normal_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .normal_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .normal_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .normal_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .normal_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .normal_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .event_list_wrap .list_area > ul > li {
  position: relative;
  display: flex;
  margin-bottom: 20px;
  overflow: hidden;
}
#mabinogim .event_list_wrap .list_area > ul > li:last-child {
  margin-bottom: 0;
}
#mabinogim .event_list_wrap .list_area > ul > li .thumbnail {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-width: 385px;
  max-width: 385px;
  max-height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 24px;
}
#mabinogim .event_list_wrap .list_area > ul > li .thumbnail img {
  object-fit: cover;
  width: 100%;
  border-radius: 24px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript {
  width: 100%;
  background: #fff;
  padding: 0 30px;
  border-radius: 24px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  overflow: hidden;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 {
  width: 100%;
  display: flex;
  align-items: center;
  overflow: hidden;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .type {
  color: #626262;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: -0.28px;
  text-transform: uppercase;
  padding: 5px 15px;
  border-radius: 20px;
  border: 1px solid #d9d9d9;
  background: #fff;
  width: min-content;
  white-space: nowrap;
  transition: all 0.3s;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .title {
  position: relative;
  display: flex;
  align-items: center;
  margin-left: 10px;
  width: 100%;
  overflow: hidden;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .title span {
  display: inline-block;
  font-size: 20px;
  color: #626262;
  line-height: 140%;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all 0.3s;
  white-space: nowrap;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .title span b {
  color: #f65606;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .date span {
  color: #aaa;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: -0.24px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info {
  display: flex;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info div {
  display: flex;
  align-items: center;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info div span {
  font-size: 14px;
  color: #707070;
  white-space: nowrap;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .comment {
  margin-right: 12px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .comment::before {
  display: block;
  content: "";
  width: 18px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238E8E8E' d='m4 17-3-2h3v2Z'/%3E%3Cpath fill='%23AAA' d='M1 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H1V7Z'/%3E%3Cpath fill='%23F6F4F4' d='M4 9h2v2H4V9ZM8 9h2v2H8V9ZM12 9h2v2h-2V9Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .view {
  margin-right: 12px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .view::before {
  display: block;
  content: "";
  min-width: 18px;
  width: 18px;
  height: 10px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' fill='none'%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 10c5.61 0 9-4.22 9-5 0-.78-3.39-5-9-5-4.809 0-9 4.22-9 5 0 .78 4.191 5 9 5Zm0-1.25c2.13 0 3.857-1.679 3.857-3.75 0-2.071-1.727-3.75-3.857-3.75S5.143 2.929 5.143 5C5.143 7.071 6.87 8.75 9 8.75Z' clip-rule='evenodd'/%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 7.5c1.42 0 2.571-1.12 2.571-2.5H9V2.5C7.58 2.5 6.428 3.62 6.428 5S7.58 7.5 9 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
#mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .like::before {
  display: block;
  content: "";
  width: 12px;
  min-width: 12px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='11' fill='none'%3E%3Cpath fill='%23AAA' d='M0 2v4l3 3 3 2 3-2 3-3V2L9 0 6 2 3 0 0 2Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .event_list_wrap .list_area > ul > li:hover .descript .order_1 .type {
    color: #21a071;
  }
  #mabinogim .event_list_wrap .list_area > ul > li:hover .descript .order_1 .title span {
    color: #21a071;
  }
}
#mabinogim .event_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .event_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .event_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .event_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .event_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .event_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .event_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .event_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .event_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .event_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .event_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .event_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .event_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .event_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .event_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .event_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .event_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .event_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .event_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .event_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .event_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .event_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .event_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .event_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .event_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .grid_list_wrap {
  margin: 0 auto;
}
#mabinogim .grid_list_wrap .list_area > ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 26px;
}
#mabinogim .grid_list_wrap .list_area > ul > li {
  width: 100%;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div {
  position: relative;
  display: block;
  padding: 20px;
  background: #fff;
  border-radius: 24px;
  cursor: pointer;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .thumbnail {
  position: relative;
  border-radius: 14px;
  width: 100%;
  height: 272px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .grid_list_wrap .list_area > ul > li > div:hover .thumbnail img {
    transform: scale(1.1);
  }
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript {
  margin-top: 40px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .title {
  margin-bottom: auto;
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .title span {
  display: inline-block;
  font-size: 18px;
  letter-spacing: -0.36px;
  color: #5c5c5c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .title span b {
  color: #f65606;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info {
  margin-top: 12px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image {
  width: 20px;
  min-width: 20px;
  height: 20px;
  border-radius: 50%;
  overflow: hidden;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image img {
  width: 100%;
  height: 100%;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .name {
  margin-left: 10px;
  color: #5c5c5c;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: -0.28px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript:has(.user_info) .sub_info {
  margin-top: 9px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .date {
  margin-right: 10px;
  max-width: 40%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .date span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  width: 100%;
  color: #aaa;
  font-size: 12px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc {
  display: flex;
  align-items: center;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc div {
  display: flex;
  align-items: center;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc div span {
  font-size: 14px;
  color: #707070;
  white-space: nowrap;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .comment {
  margin-right: 12px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .comment::before {
  display: block;
  content: "";
  width: 18px;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238E8E8E' d='m4 17-3-2h3v2Z'/%3E%3Cpath fill='%23AAA' d='M1 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H1V7Z'/%3E%3Cpath fill='%23F6F4F4' d='M4 9h2v2H4V9ZM8 9h2v2H8V9ZM12 9h2v2h-2V9Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .view {
  margin-right: 12px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .view::before {
  display: block;
  content: "";
  min-width: 18px;
  width: 18px;
  height: 10px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' fill='none'%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 10c5.61 0 9-4.22 9-5 0-.78-3.39-5-9-5-4.809 0-9 4.22-9 5 0 .78 4.191 5 9 5Zm0-1.25c2.13 0 3.857-1.679 3.857-3.75 0-2.071-1.727-3.75-3.857-3.75S5.143 2.929 5.143 5C5.143 7.071 6.87 8.75 9 8.75Z' clip-rule='evenodd'/%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 7.5c1.42 0 2.571-1.12 2.571-2.5H9V2.5C7.58 2.5 6.428 3.62 6.428 5S7.58 7.5 9 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
#mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .like::before {
  display: block;
  content: "";
  width: 12px;
  min-width: 12px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='11' fill='none'%3E%3Cpath fill='%23AAA' d='M0 2v4l3 3 3 2 3-2 3-3V2L9 0 6 2 3 0 0 2Z'/%3E%3C/svg%3E");
  background-size: cover;
  margin-right: 4px;
}
#mabinogim .grid_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .grid_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .grid_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .grid_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .grid_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .grid_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .grid_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .grid_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .grid_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .grid_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .grid_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .grid_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .grid_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .grid_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .grid_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .grid_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .grid_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .creation .grid_list_wrap {
  margin: 0 auto;
}
#mabinogim .creation .grid_list_wrap .list_area > ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 24px;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li {
  width: 100%;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div {
  position: relative;
  display: block;
  padding: 18px;
  background: #fff;
  border-radius: 24px;
  cursor: pointer;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .aspect_ratio_area {
  position: relative;
  width: 100%;
  height: 0px;
  width: 100%;
  overflow: hidden;
  border-radius: 14px;
  padding-bottom: 56.26%;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .aspect_ratio_area .thumbnail {
  position: absolute;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .aspect_ratio_area .thumbnail img {
  width: auto;
  height: auto;
  max-width: 100%;
  transition: 0.3s;
  image-rendering: -moz-crisp-edges; /* firefox */
  image-rendering: -o-crisp-edges; /* opera */
  image-rendering: -webkit-optimize-contrast; /* chrome(비표준) */
  image-rendering: crisp-edges;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .creation .grid_list_wrap .list_area > ul > li > div:hover .thumbnail img {
    transform: scale(1.05);
  }
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript {
  margin-top: 40px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .title {
  margin-bottom: auto;
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .title span {
  display: inline-block;
  font-size: 18px;
  letter-spacing: -0.36px;
  color: #5c5c5c;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .title span b {
  color: #f65606;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .user_info {
  margin-top: 12px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image {
  width: 20px;
  min-width: 20px;
  height: 20px;
  border-radius: 50%;
  overflow: hidden;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image img {
  width: 100%;
  height: 100%;
}
#mabinogim .creation .grid_list_wrap .list_area > ul > li > div .descript .user_info .name {
  margin-left: 10px;
  color: #5c5c5c;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: -0.28px;
}
#mabinogim .creation .grid_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .creation .grid_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .creation .grid_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .creation .grid_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .creation .grid_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .creation .grid_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .report,
#mabinogim .support {
  min-height: auto;
  max-width: 1740px;
  margin: 0 auto;
  padding: 60px 60px 180px;
}
#mabinogim .report .grid_list_wrap,
#mabinogim .support .grid_list_wrap {
  margin-top: 115px;
}
#mabinogim .report .grid_list_wrap .list_area > ul,
#mabinogim .support .grid_list_wrap .list_area > ul {
  width: fit-content;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
#mabinogim .report .grid_list_wrap .list_area > ul li,
#mabinogim .support .grid_list_wrap .list_area > ul li {
  width: 100%;
  border-radius: 0;
}
#mabinogim .report .grid_list_wrap .list_area > ul li a,
#mabinogim .support .grid_list_wrap .list_area > ul li a {
  font-family: "Pretendard-Bold";
  display: block;
  width: 308px;
  height: 189px;
  background-image: url("https://lwi.nexon.com/m_mabinogim/brand/customer/report_card.png");
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fcfcfc;
  font-size: 30px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .report .grid_list_wrap .list_area > ul li a:hover,
  #mabinogim .support .grid_list_wrap .list_area > ul li a:hover {
    background-image: url("https://lwi.nexon.com/m_mabinogim/brand/customer/report_card_on.png");
    color: #000;
  }
}
#mabinogim .video_list .grid_list_wrap .list_area > ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 30px;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 {
  position: relative;
  padding: 10px 10px 30px;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
  position: relative;
  width: 100%;
  height: 0px;
  width: 100%;
  overflow: hidden;
  border-radius: 14px;
  padding-bottom: 56.26%;
}
@supports (aspect-ratio: 1.77) {
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
    aspect-ratio: 16/9;
    padding-bottom: 0px;
    height: auto;
  }
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail {
  position: absolute;
  inset: 0px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: rgba(0, 182, 112, 0.5) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='50' height='50' fill='none'%3E%3Cpath fill='%23fff' d='M35.067 22.402c2 1.155 2 4.041 0 5.196l-12.85 7.419c-2 1.155-4.5-.289-4.5-2.598V17.581c0-2.31 2.5-3.753 4.5-2.598l12.85 7.419Z'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M36.883 44.696A22.893 22.893 0 0 1 25 48C12.297 48 2 37.703 2 25A22.937 22.937 0 0 1 9.283 8.207L5.45 3.917M44.933 45.7 41.1 41.425A22.93 22.93 0 0 0 48 25C48 12.297 37.703 2 25 2c-4.19 0-8.117 1.12-11.5 3.077'/%3E%3C/svg%3E") no-repeat;
  background-size: 50px 50px;
  background-position: center 60%;
  transition: 0.3s;
  opacity: 0;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1:hover .thumbnail img {
    transform: scale(1);
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1:hover .thumbnail::after {
    background-position: center center;
    opacity: 1;
  }
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .title {
  position: relative;
  margin-top: 20px;
  padding-left: 34px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .title::before {
  content: "";
  position: absolute;
  display: block;
  top: -1px;
  left: 10px;
  width: 22px;
  height: 22px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none'%3E%3Cpath fill='%237B7B7B' d='M10.667 16H16v1.333h-5.333A6.666 6.666 0 1 1 16 14.667h-1.805A5.334 5.334 0 1 0 10.667 16Zm0-6.667a1.333 1.333 0 1 1 0-2.666 1.333 1.333 0 0 1 0 2.666ZM8 12a1.334 1.334 0 1 1 0-2.667A1.334 1.334 0 0 1 8 12Zm5.333 0a1.334 1.334 0 1 1 0-2.667 1.334 1.334 0 0 1 0 2.667Zm-2.666 2.667a1.333 1.333 0 1 1 0-2.667 1.333 1.333 0 0 1 0 2.667Z'/%3E%3C/svg%3E");
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .title span {
  font-size: 16px;
  color: #626262;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 20px;
}
#mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .title span b {
  color: #f65606;
}
#mabinogim .video_list .grid_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .video_list .grid_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .video_list .grid_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .video_list .grid_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .video_list .grid_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .image_list .grid_list_wrap .list_area > ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 30px;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 {
  position: relative;
  padding: 10px 10px 30px;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
  position: relative;
  width: 100%;
  height: 0px;
  width: 100%;
  overflow: hidden;
  border-radius: 14px;
  padding-bottom: 56.26%;
}
@supports (aspect-ratio: 1.77) {
  #mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
    aspect-ratio: 16/9;
    padding-bottom: 0px;
    height: auto;
  }
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail {
  position: absolute;
  inset: 0px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .title {
  position: relative;
  margin-top: 20px;
  padding-left: 34px;
  display: flex;
  align-items: center;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .title::before {
  content: "";
  position: absolute;
  display: block;
  top: -1px;
  left: 10px;
  width: 22px;
  height: 22px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='22' fill='none'%3E%3Cpath stroke='%237E7E7E' stroke-width='1.63' d='m8.5 15.5 3.803-2.958a1 1 0 0 1 1.321.082L15.5 14.5M11 13l-1.367-1.367a1 1 0 0 0-1.332-.074L6.5 13'/%3E%3Ccircle cx='12.5' cy='8.5' r='1.5' fill='%237E7E7E'/%3E%3Ccircle cx='11.5' cy='10.5' r='5.7' stroke='%237B7B7B' stroke-width='1.6'/%3E%3C/svg%3E");
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .title span {
  font-size: 16px;
  color: #626262;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 20px;
}
#mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .title span b {
  color: #f65606;
}
#mabinogim .image_list .grid_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .image_list .grid_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .image_list .grid_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .image_list .grid_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .image_list .grid_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul {
  display: grid;
  grid-template-columns: repeat(4, minmax(0px, 1fr));
  gap: 30px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 {
  position: relative;
  padding: 20px;
  background: #fff;
  border-radius: 24px;
  overflow: hidden;
  cursor: pointer;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
  position: relative;
  width: 100%;
  height: 0px;
  width: 100%;
  overflow: hidden;
  border-radius: 14px;
  padding-bottom: 56.26%;
}
@supports (aspect-ratio: 1.77) {
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area {
    aspect-ratio: 16/9;
    padding-bottom: 0px;
    height: auto;
  }
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail {
  position: absolute;
  inset: 0px;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.3s;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript {
  margin-top: 20px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type {
  width: min-content;
  color: #626262;
  font-size: 14px;
  letter-spacing: -0.28px;
  padding: 5px 15px;
  border-radius: 20px;
  border: 1px solid #d9d9d9;
  background: #fff;
  white-space: nowrap;
  display: flex;
  margin-bottom: 10px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type span {
  display: flex;
  align-items: center;
  width: min-content;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type span:last-child::after {
  display: none;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type span::after {
  display: block;
  content: "";
  width: 5px;
  height: 8px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='8' fill='none'%3E%3Cpath fill='%23D9D9D9' d='M3 3h1v2H3V3ZM2 2h1v1H2V2ZM1 1h1v1H1V1ZM0 0h1v1H0V0ZM2 5h1v1H2V5ZM1 6h1v1H1V6ZM0 7h1v1H0V7ZM0 6h1v1H0V6ZM1 5h1v1H1V5ZM2 3h1v2H2V3ZM1 2h1v1H1V2ZM0 1h1v1H0V1ZM1 7h1v1H1V7ZM2 6h1v1H2V6ZM3 5h1v1H3V5ZM4 3h1v2H4V3ZM3 2h1v1H3V2ZM2 1h1v1H2V1ZM1 0h1v1H1V0Z'/%3E%3C/svg%3E") no-repeat;
  margin: 0 6px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type + .title {
  margin-top: 0;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .title {
  position: relative;
  display: flex;
  align-items: center;
  overflow: hidden;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .title span {
  font-size: 16px;
  color: #626262;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 20px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .title span b {
  color: #f65606;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .digitalgoods .grid_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .faq_list_wrap .list_area > ul.list {
  border-bottom: 1px solid #aaa;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li {
  position: relative;
  height: 100px;
  border-top: 1px solid #aaa;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li::before {
  display: block;
  content: "";
  width: 5px;
  height: 100%;
  background: #00b670;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.5s;
  opacity: 0;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 {
  display: flex;
  align-items: center;
  overflow: hidden;
  width: 100%;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .type {
  display: flex;
  width: min-content;
  border: 1px solid #d9d9d9;
  font-size: 14px;
  color: #626262;
  background: #fff;
  border-radius: 20px;
  padding: 5px 15px;
  margin-right: 12px;
  white-space: nowrap;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .type span {
  display: flex;
  align-items: center;
  width: min-content;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .type span:last-child::after {
  display: none;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .type span::after {
  display: block;
  content: "";
  width: 5px;
  height: 8px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='8' fill='none'%3E%3Cpath fill='%23D9D9D9' d='M3 3h1v2H3V3ZM2 2h1v1H2V2ZM1 1h1v1H1V1ZM0 0h1v1H0V0ZM2 5h1v1H2V5ZM1 6h1v1H1V6ZM0 7h1v1H0V7ZM0 6h1v1H0V6ZM1 5h1v1H1V5ZM2 3h1v2H2V3ZM1 2h1v1H1V2ZM0 1h1v1H0V1ZM1 7h1v1H1V7ZM2 6h1v1H2V6ZM3 5h1v1H3V5ZM4 3h1v2H4V3ZM3 2h1v1H3V2ZM2 1h1v1H2V1ZM1 0h1v1H1V0Z'/%3E%3C/svg%3E") no-repeat;
  margin: 0 6px;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .title {
  position: relative;
  width: 100%;
  margin-right: 6px;
  display: flex;
  align-items: center;
  overflow: hidden;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .title span {
  display: inline-block;
  max-width: 100%;
  font-size: 18px;
  line-height: 24px;
  color: #525252;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .title span b {
  color: #f65606;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_1 .etc {
  display: none;
}
#mabinogim .faq_list_wrap .list_area > ul.list > li .order_2 {
  display: none;
}
#mabinogim .faq_list_wrap .list_area .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .faq_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .faq_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .faq_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .faq_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .faq_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .faq_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .faq_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .faq_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .faq_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .faq_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .faq_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .faq_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .faq_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .faq_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .faq_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .faq_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .policy_list_wrap .list_area > ul {
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 30px;
}
#mabinogim .policy_list_wrap .list_area > ul li {
  width: 380px;
}
#mabinogim .policy_list_wrap .list_area > ul li .thumbnail {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  width: 100%;
  height: 140px;
  background-size: cover;
  background-position: center center;
}
#mabinogim .policy_list_wrap .list_area > ul li .title {
  margin-top: 5px;
  background: #fff;
  max-width: 380px;
  padding: 20px 0;
  border-radius: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
}
#mabinogim .policy_list_wrap .list_area > ul li .title span {
  color: #5c5c5c;
  font-size: 18px;
  display: flex;
  align-items: center;
}
#mabinogim .policy_list_wrap .list_area > ul li .title span::after {
  content: "";
  display: block;
  width: 6px;
  height: 9px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='9' fill='none'%3E%3Cpath stroke='%23626262' stroke-linecap='round' stroke-width='2' d='m1.5 7.5 3-3-3-3'/%3E%3C/svg%3E");
  background-size: cover;
  margin-left: 10px;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .policy_list_wrap .list_area > ul li:hover .title {
    background: #2baf7e;
  }
  #mabinogim .policy_list_wrap .list_area > ul li:hover .title span {
    color: #fff;
  }
  #mabinogim .policy_list_wrap .list_area > ul li:hover .title span::after {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='9' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='2' d='m1.5 7.5 3-3-3-3'/%3E%3C/svg%3E");
  }
}
#mabinogim .policy_list_wrap .list_empty {
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .policy_list_wrap .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .policy_list_wrap .list_empty span b {
  color: #f65606;
}
#mabinogim .audio_list_wrap {
  padding-top: 60px;
}
#mabinogim .audio_list_wrap h1 {
  display: flex;
  align-items: center;
  color: #4e4e4e;
  font-size: 18px;
  font-weight: 500;
}
#mabinogim .audio_list_wrap h1::before {
  content: "";
  display: block;
  width: 25px;
  min-width: 25px;
  height: 25px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M6.25 21.875a3.125 3.125 0 1 0 0-6.25 3.125 3.125 0 0 0 0 6.25ZM9.375 18.75V5.208'/%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-width='1.333' d='m21.875 3.125-12.5 2.083m12.5 2.084-12.5 2.083'/%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M18.75 19.792a3.125 3.125 0 1 0 0-6.25 3.125 3.125 0 0 0 0 6.25ZM21.875 16.667V3.125'/%3E%3C/svg%3E");
  margin-right: 10px;
}
#mabinogim .audio_list_wrap .list_area > ul {
  padding: 20px 0 0 0;
}
#mabinogim .audio_list_wrap .list_area > ul li {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  background: #fff;
  margin-bottom: 10px;
  transition: all 0.3s;
  cursor: pointer;
}
#mabinogim .audio_list_wrap .list_area > ul li:last-child {
  margin-bottom: 0;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_1 {
  position: relative;
  padding: 16px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_1 .thumbnail {
  max-width: 130px;
  max-height: 85px;
  overflow: hidden;
  border-radius: 14px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_1 .thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_1 .play_button {
  width: 50px;
  height: 50px;
  border-radius: 14px;
  border: 1px solid #6f6f6f;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_1 .play_button::before {
  content: "";
  display: block;
  width: 13px;
  min-width: 13px;
  height: 16px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='16' fill='none'%3E%3Cpath fill='%236F6F6F' d='M12 6.268c1.333.77 1.333 2.694 0 3.464l-9 5.196c-1.333.77-3-.192-3-1.732V2.804C0 1.264 1.667.302 3 1.072l9 5.196Z'/%3E%3C/svg%3E") no-repeat;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 {
  position: absolute;
  top: 0;
  left: 150px;
  width: calc(100% - 220px);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px;
  overflow: hidden;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .title {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  overflow: hidden;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .title::before {
  content: "";
  display: block;
  width: 16px;
  min-width: 16px;
  height: 16px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M4 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM6 12V3.333'/%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-width='1.333' d='M14 2 6 3.333m8 1.334L6 6'/%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M12 12.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM14 10.667V2'/%3E%3C/svg%3E") no-repeat;
  margin-right: 6px;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .title span {
  display: block;
  font-size: 16px;
  color: #626262;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .description {
  display: none;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .duration {
  padding: 5px 15px;
  width: min-content;
  border: 1px solid #f3f3f3;
  border-radius: 20px;
  margin-left: 10px;
}
#mabinogim .audio_list_wrap .list_area > ul li .order_2 .duration span {
  color: #6f6f6f;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .audio_list_wrap .list_area > ul li:hover {
    background-color: #00b670;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_1 .play_button {
    border: 1px solid #fff;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_1 .play_button[data-state=false]::before {
    content: "";
    display: block;
    width: 13px;
    min-width: 13px;
    height: 16px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='16' fill='none'%3E%3Cpath fill='%23fff' d='M12 6.268c1.333.77 1.333 2.694 0 3.464l-9 5.196c-1.333.77-3-.192-3-1.732V2.804C0 1.264 1.667.302 3 1.072l9 5.196Z'/%3E%3C/svg%3E") no-repeat;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_2 .title::before {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M4 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM6 12V3.333'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='1.333' d='M14 2 6 3.333m8 1.334L6 6'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M12 12.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM14 10.667V2'/%3E%3C/svg%3E") no-repeat;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_2 .title span {
    color: #fff;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_2 .duration {
    padding: 5px 15px;
    width: min-content;
    border: 1px solid #fff;
    border-radius: 20px;
    background: #fff;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:hover .order_2 .duration span {
    color: #6f6f6f;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
  }
}
#mabinogim .audio_list_wrap .list_area > ul li.on {
  background-color: #00b670;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_1 .play_button, #mabinogim .audio_list_wrap .list_area > ul li.off .order_1 .play_button {
  border: 1px solid #fff;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_1 .play_button[data-state=false]::before, #mabinogim .audio_list_wrap .list_area > ul li.off .order_1 .play_button[data-state=false]::before {
  content: "";
  display: block;
  width: 24px;
  min-width: 24px;
  height: 24px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' fill='none'%3E%3Cpath fill='url(%23a)' d='M0 0h24v24H0z'/%3E%3Cdefs%3E%3Cpattern id='a' width='1' height='1' patternContentUnits='objectBoundingBox'%3E%3Cuse xlink:href='%23b' transform='scale(.02083)'/%3E%3C/pattern%3E%3Cimage xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAAAKlJREFUaEPt1UEKwzAQBEHr/49WrskhyFAswaR9XWas7RZoXQ//1sPPf7XArw1mIANIoCuEADmeAUaIBRlAgBzPACPEggwgQI5ngBFiQQYQIMczwAixIAMIkOMZYIRYkAEEyPH/MbD33u+41lofy0/Pv6m6bWD6gKf+FjgRmp5nYJrwqT8DJ0LTczbAT+ZQwe13YOj/XNsCjBALMoAAOZ4BRogFGUCAHH8B4kuAMYz1/NwAAAAASUVORK5CYII=' id='b' width='48' height='48'/%3E%3C/defs%3E%3C/svg%3E") no-repeat;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_1 .play_button[data-state=true]::before, #mabinogim .audio_list_wrap .list_area > ul li.off .order_1 .play_button[data-state=true]::before {
  content: "";
  display: block;
  width: 24px;
  min-width: 24px;
  height: 24px;
  background: url(https://lwi.nexon.com/m_mabinogim/brand/media/sound_motion.gif);
  background-size: cover;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .title::before, #mabinogim .audio_list_wrap .list_area > ul li.off .order_2 .title::before {
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M4 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM6 12V3.333'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='1.333' d='M14 2 6 3.333m8 1.334L6 6'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M12 12.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM14 10.667V2'/%3E%3C/svg%3E") no-repeat;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .title span, #mabinogim .audio_list_wrap .list_area > ul li.off .order_2 .title span {
  color: #fff;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .duration, #mabinogim .audio_list_wrap .list_area > ul li.off .order_2 .duration {
  padding: 5px 15px;
  width: min-content;
  border: 1px solid #fff;
  border-radius: 20px;
  background: #fff;
}
#mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .duration span, #mabinogim .audio_list_wrap .list_area > ul li.off .order_2 .duration span {
  color: #6f6f6f;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
#mabinogim .audio_list_wrap .list_area .list_empty {
  margin-top: 20px;
  border-top: 1px solid #aaa;
  border-bottom: 1px solid #aaa;
}
#mabinogim .audio_list_wrap .list_area .list_empty span {
  min-height: 220px;
  height: 220px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area .list_empty span b {
  color: #f65606;
}
#mabinogim .audio_list_wrap .list_area .pager {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 40px auto 0;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination {
  display: flex;
  align-items: center;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination ul {
  display: flex;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination ul li {
  font-size: 16px;
  color: #525252;
  margin-right: 4px;
  cursor: pointer;
  width: 44px;
  height: 30px;
  background: #fff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination ul li.on {
  color: #fff;
  background: #2baf7e;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul li:hover {
    color: #fff;
    background: #2baf7e;
  }
}
#mabinogim .audio_list_wrap .list_area .pager .pagination ul li:first-child {
  margin-left: 26px;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination ul li:last-child {
  margin-right: 26px;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination button.prev_button,
#mabinogim .audio_list_wrap .list_area .pager .pagination a.prev_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination button.prev_button::before,
#mabinogim .audio_list_wrap .list_area .pager .pagination a.prev_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m7 1.5-4 4 4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .audio_list_wrap .list_area .pager .pagination button.prev_button:hover::before,
  #mabinogim .audio_list_wrap .list_area .pager .pagination a.prev_button:hover::before {
    transform: translateX(-4px);
  }
}
#mabinogim .audio_list_wrap .list_area .pager .pagination button.next_button,
#mabinogim .audio_list_wrap .list_area .pager .pagination a.next_button {
  width: 48px;
  height: 34px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
#mabinogim .audio_list_wrap .list_area .pager .pagination button.next_button::before,
#mabinogim .audio_list_wrap .list_area .pager .pagination a.next_button::before {
  display: block;
  content: "";
  min-width: 9px;
  width: 9px;
  height: 11px;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='11' fill='none'%3E%3Cpath stroke='%23424242' stroke-linecap='round' stroke-width='3' d='m2 1.5 4 4-4 4'/%3E%3C/svg%3E");
  transition: all 0.3s;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .audio_list_wrap .list_area .pager .pagination button.next_button:hover::before,
  #mabinogim .audio_list_wrap .list_area .pager .pagination a.next_button:hover::before {
    transform: translateX(4px);
  }
}
#mabinogim .audio_list_wrap .list_area .pager .write_button {
  width: min-content;
  padding: 10px 56px;
  background: #00b670;
  border-radius: 12px;
  font-size: 18px;
  color: #fff;
  white-space: nowrap;
  margin-left: auto;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .audio_list_wrap .list_area .pager .write_button:hover {
    background: #0c8b5a;
  }
}
#mabinogim .category_area {
  position: relative;
  width: 100%;
  background: #fff;
  border-radius: 24px;
  margin-bottom: 30px;
  padding: 10px;
}
#mabinogim .category_area ul {
  position: relative;
  display: flex;
  width: 100%;
}
#mabinogim .category_area ul li {
  width: auto;
  flex: 1;
  margin-right: 2px;
}
#mabinogim .category_area ul li:last-child {
  margin-right: 0;
}
#mabinogim .category_area ul li a {
  display: block;
  width: 100%;
  padding: 15px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: min(16px, 1vw);
  border-radius: 12px;
  background: linear-gradient(#222632, #222632) no-repeat 0px -48px;
  white-space: nowrap;
}
#mabinogim .category_area ul li a.active, #mabinogim .category_area ul li a.on {
  background: #222632;
  color: #fff;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .category_area ul li a:hover {
    background: linear-gradient(#222632, #222632) no-repeat 0px 0px;
    color: #fff;
    transition: 0.3s;
  }
}
#mabinogim ._desc_area {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
  padding: 30px;
  border-radius: 24px;
  background: rgba(231, 231, 231, 0.6);
}
#mabinogim ._desc_area ._t {
  color: #7d7d7d;
  font-size: 16px;
  font-weight: 400;
  line-height: 141%; /* 22.56px */
  letter-spacing: -0.32px;
  text-align: center;
}
#mabinogim ._desc_area ._t a {
  color: inherit;
  text-decoration: underline;
}
#mabinogim .filter_area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 30px;
}
#mabinogim .filter_area .order_1 {
  position: relative;
  flex: 1;
  height: 52px;
  display: flex;
  align-items: flex-end;
  padding-left: 20px;
}
#mabinogim .filter_area .order_1 button {
  position: relative;
  margin-right: 18px;
  color: #525252;
  padding: 4px 10px;
  white-space: nowrap;
}
#mabinogim .filter_area .order_1 button.active, #mabinogim .filter_area .order_1 button.on {
  background: #5c5c5c;
  color: #fff;
  border-radius: 6px;
}
#mabinogim .filter_area .order_1 button.active::after, #mabinogim .filter_area .order_1 button.on::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -4px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 5px solid #5c5c5c;
}
@media (hover: hover) and (min-width: 1281px) {
  #mabinogim .filter_area .order_1 button:hover {
    background: #5c5c5c;
    color: #fff;
    border-radius: 6px;
  }
  #mabinogim .filter_area .order_1 button:hover::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -4px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 5px solid #5c5c5c;
  }
}
#mabinogim .filter_area .order_2 {
  position: relative;
  flex: 1;
  height: 52px;
  display: flex;
  justify-content: flex-end;
}
#mabinogim .filter_area .order_2 .total_list {
  position: relative;
  margin-right: 10px;
  border-radius: 16px;
}
#mabinogim .filter_area .order_2 .total_list button {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 52px;
  height: 52px;
  background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' fill='none' viewBox='0 0 52 52'%3E%3Crect width='52' height='52' fill='%23e3e1e1' rx='16'/%3E%3Cpath fill='%235c5c5c' d='M26 37q-4.606 0-7.803-3.197T15 26t3.197-7.803T26 15q2.372 0 4.538.98a10.5 10.5 0 0 1 3.712 2.801v-2.406q0-.584.396-.98a1.33 1.33 0 0 1 .979-.395q.585 0 .979.395.396.395.396.98v6.875q0 .585-.396.979-.395.396-.979.396H28.75q-.585 0-.979-.396a1.33 1.33 0 0 1-.396-.979q0-.584.396-.98a1.33 1.33 0 0 1 .979-.395h4.4a8.03 8.03 0 0 0-3.007-3.025A8.15 8.15 0 0 0 26 17.75q-3.438 0-5.844 2.406T17.75 26t2.406 5.844T26 34.25a8.1 8.1 0 0 0 4.384-1.255q2.01-1.254 3.007-3.351.17-.378.568-.635.394-.26.807-.259.79 0 1.186.55t.086 1.238q-1.307 2.92-4.022 4.691T26 37'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
}
#mabinogim .filter_area .order_2 .total_list button:hover {
  background-image: url("data:image/svg+xml,%0A%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' fill='none' viewBox='0 0 52 52'%3E%3Crect width='52' height='52' fill='%23d0cdcd' rx='16'/%3E%3Cpath fill='%235c5c5c' d='M26 37q-4.606 0-7.803-3.197T15 26t3.197-7.803T26 15q2.372 0 4.538.98a10.5 10.5 0 0 1 3.712 2.801v-2.406q0-.584.396-.98a1.33 1.33 0 0 1 .979-.395q.585 0 .979.395.396.395.396.98v6.875q0 .585-.396.979-.395.396-.979.396H28.75q-.585 0-.979-.396a1.33 1.33 0 0 1-.396-.979q0-.584.396-.98a1.33 1.33 0 0 1 .979-.395h4.4a8.03 8.03 0 0 0-3.007-3.025A8.15 8.15 0 0 0 26 17.75q-3.438 0-5.844 2.406T17.75 26t2.406 5.844T26 34.25a8.1 8.1 0 0 0 4.384-1.255q2.01-1.254 3.007-3.351.17-.378.568-.635.394-.26.807-.259.79 0 1.186.55t.086 1.238q-1.307 2.92-4.022 4.691T26 37'/%3E%3C/svg%3E");
}

@media (max-width: 1740px) {
  #mabinogim .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(3, minmax(0px, 1fr));
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul,
  #mabinogim .image_list .grid_list_wrap .list_area > ul,
  #mabinogim .creation .grid_list_wrap .list_area > ul,
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(3, minmax(0px, 1fr));
  }
}
@media (max-width: 1280px) {
  #mabinogim .normal_list_wrap .list_area > ul {
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li {
    position: relative;
    height: auto;
    border-top: 1px solid #aaa;
    display: block;
    padding: 10px 10px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 {
    display: block;
    max-width: 100%;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .type {
    width: min-content;
    border: 1px solid #d9d9d9;
    font-size: 10px;
    color: #626262;
    background: #fff;
    border-radius: 20px;
    padding: 5px 15px;
    margin-right: 12px;
    margin-bottom: 6px;
    white-space: nowrap;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .title {
    position: relative;
    margin-right: 0px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .title span {
    font-size: 14px;
    color: #525252;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc {
    display: flex;
    align-items: center;
    margin-right: 0;
    margin-top: 8px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div {
    display: flex;
    align-items: center;
    font-size: 12px;
    color: #707070;
    margin-right: 2px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.comment {
    margin-right: 4px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_1 .etc div.comment i {
    margin-right: 2px;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 {
    display: block;
    margin-top: 10px;
    margin-left: 0;
    max-width: 100%;
    min-width: 100%;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info {
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .profile_image {
    width: 20px;
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    overflow: hidden;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .profile_image img {
    width: 100%;
    height: 100%;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .user_info .name {
    margin-left: 10px;
    color: #5c5c5c;
    font-size: 14px;
    letter-spacing: -0.28px;
    max-width: 100%;
    min-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info {
    display: flex;
    margin-top: 25px;
    margin-left: 0;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info div {
    display: flex;
    align-items: center;
    min-width: auto;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info div span {
    font-size: 11px;
    color: #707070;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .view {
    margin-right: 0;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .date {
    margin-left: 0;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li .order_2 .sub_info .date span {
    color: #aaa;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li.on {
    background: #fff;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li.on::before {
    display: block;
    content: "";
    width: 3px;
    height: 100%;
    background: #00b670;
    position: absolute;
    top: 0;
    left: 0;
  }
  #mabinogim .normal_list_wrap .list_area > ul > li.on .order_1 .title span {
    color: #f65606;
  }
  #mabinogim .normal_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .normal_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .normal_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .normal_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .normal_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .normal_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .normal_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .normal_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div {
    position: relative;
    display: block;
    padding: 20px;
    background: #fff;
    border-radius: 24px;
    cursor: pointer;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript {
    margin-top: 24px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .title {
    margin-bottom: auto;
    position: relative;
    display: flex;
    align-items: center;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .title span {
    display: inline-block;
    font-size: 14px;
    letter-spacing: -0.36px;
    color: #626262;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info {
    margin-top: 12px;
    position: relative;
    display: flex;
    align-items: center;
    cursor: pointer;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image {
    width: 20px;
    min-width: 20px;
    height: 20px;
    border-radius: 50%;
    overflow: hidden;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .profile_image img {
    width: 100%;
    height: 100%;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .user_info .name {
    margin-left: 10px;
    color: #5c5c5c;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: -0.28px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .date {
    margin-right: 10px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .date span {
    font-size: 12px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc {
    display: flex;
    align-items: center;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc div {
    display: flex;
    align-items: center;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc div span {
    font-size: 12px;
    color: #707070;
    white-space: nowrap;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .comment {
    margin-right: 12px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .comment::before {
    display: block;
    content: "";
    width: 18px;
    height: 20px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238E8E8E' d='m4 17-3-2h3v2Z'/%3E%3Cpath fill='%23AAA' d='M1 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H1V7Z'/%3E%3Cpath fill='%23F6F4F4' d='M4 9h2v2H4V9ZM8 9h2v2H8V9ZM12 9h2v2h-2V9Z'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .view {
    margin-right: 12px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .view::before {
    display: block;
    content: "";
    min-width: 18px;
    width: 18px;
    height: 10px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' fill='none'%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 10c5.61 0 9-4.22 9-5 0-.78-3.39-5-9-5-4.809 0-9 4.22-9 5 0 .78 4.191 5 9 5Zm0-1.25c2.13 0 3.857-1.679 3.857-3.75 0-2.071-1.727-3.75-3.857-3.75S5.143 2.929 5.143 5C5.143 7.071 6.87 8.75 9 8.75Z' clip-rule='evenodd'/%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 7.5c1.42 0 2.571-1.12 2.571-2.5H9V2.5C7.58 2.5 6.428 3.62 6.428 5S7.58 7.5 9 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .grid_list_wrap .list_area > ul > li > div .descript .sub_info .etc .like::before {
    display: block;
    content: "";
    width: 12px;
    min-width: 12px;
    height: 11px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='11' fill='none'%3E%3Cpath fill='%23AAA' d='M0 2v4l3 3 3 2 3-2 3-3V2L9 0 6 2 3 0 0 2Z'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .grid_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .grid_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .grid_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .grid_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .grid_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .grid_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .grid_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .grid_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .creation .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
  }
  #mabinogim .creation .grid_list_wrap .list_area > ul li div .descript {
    margin-top: 20px;
  }
  #mabinogim .creation .grid_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .creation .grid_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .creation .grid_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li.on, #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul lili:hover {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .creation .grid_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .creation .grid_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .report,
  #mabinogim .support {
    padding: 26px 20px;
  }
  #mabinogim .report .grid_list_wrap,
  #mabinogim .support .grid_list_wrap {
    margin-top: 0;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul,
  #mabinogim .support .grid_list_wrap .list_area > ul {
    max-width: 350px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 10px;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul li,
  #mabinogim .support .grid_list_wrap .list_area > ul li {
    width: 100%;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul li a,
  #mabinogim .support .grid_list_wrap .list_area > ul li a {
    display: block;
    width: 100%;
    height: 74px;
    background-image: url("https://lwi.nexon.com/m_mabinogim/brand/customer/m_report_card.png");
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fcfcfc;
    font-size: 12px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 20px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    cursor: pointer;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 {
    position: relative;
    background: #fff;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title {
    position: relative;
    margin-top: 20px;
    padding-left: 24px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title span {
    font-size: 14px;
    color: #626262;
    line-height: 120%;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title::after {
    display: inline-block;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .video_list .grid_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .video_list .grid_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 20px;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul li {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    cursor: pointer;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 {
    position: relative;
    background: #fff;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title {
    position: relative;
    margin-top: 20px;
    padding-left: 24px;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title span {
    font-size: 14px;
    color: #626262;
    line-height: 120%;
  }
  #mabinogim .image_list .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title::after {
    display: inline-block;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .image_list .grid_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .image_list .grid_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(2, minmax(0px, 1fr));
    gap: 20px;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    cursor: pointer;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 {
    position: relative;
    background: #fff;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title {
    position: relative;
    margin-top: 20px;
    padding-left: 24px;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title span {
    font-size: 14px;
    color: #626262;
    line-height: 120%;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .aspect_ratio_area .title::after {
    display: inline-block;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul li .order_1 .descript .type {
    font-size: 12px;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .digitalgoods .grid_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .faq_list_wrap .list_area ul.list {
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li {
    position: relative;
    height: auto;
    border-top: 1px solid #aaa;
    display: block;
    padding: 20px 10px;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_1 {
    display: block;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_1 .type {
    width: min-content;
    border: 1px solid #d9d9d9;
    font-size: 10px;
    color: #626262;
    background: #fff;
    border-radius: 20px;
    padding: 5px 15px;
    margin-right: 12px;
    margin-bottom: 6px;
    white-space: nowrap;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_1 .title {
    position: relative;
    margin-right: 0px;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_1 .title span {
    font-size: 14px;
    color: #525252;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_1 .etc {
    display: none;
  }
  #mabinogim .faq_list_wrap .list_area ul.list > li .order_2 {
    display: none;
  }
  #mabinogim .faq_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .faq_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .faq_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .faq_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .faq_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .faq_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .faq_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .faq_list_wrap .list_area .pager .write {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .policy_list_wrap .list_area > ul {
    max-width: 380px;
    margin: 0 auto;
    display: flex;
    gap: 20px;
  }
  #mabinogim .policy_list_wrap .list_area > ul li {
    width: 100%;
    max-width: 380px;
  }
  #mabinogim .policy_list_wrap .list_area > ul li .thumbnail {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    width: 100%;
    height: 140px;
    background-size: cover;
    background-position: center center;
  }
  #mabinogim .policy_list_wrap .list_area > ul li .title {
    margin-top: 5px;
    background: #fff;
    max-width: 380px;
    padding: 20px 0;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .policy_list_wrap .list_area > ul li .title span {
    color: #5c5c5c;
    font-size: 12px;
    display: flex;
    align-items: center;
  }
  #mabinogim .policy_list_wrap .list_area > ul li .title span::after {
    content: "";
    display: block;
    width: 6px;
    height: 9px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='9' fill='none'%3E%3Cpath stroke='%23626262' stroke-linecap='round' stroke-width='2' d='m1.5 7.5 3-3-3-3'/%3E%3C/svg%3E") no-repeat;
    background-size: cover;
    margin-left: 10px;
  }
  #mabinogim .audio_list_wrap {
    padding-top: 30px;
  }
  #mabinogim .audio_list_wrap h1 {
    display: flex;
    align-items: center;
    color: #4e4e4e;
    font-size: 16px;
    font-weight: 500;
  }
  #mabinogim .audio_list_wrap h1::before {
    content: "";
    display: block;
    width: 25px;
    min-width: 25px;
    height: 25px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='25' fill='none'%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M6.25 21.875a3.125 3.125 0 1 0 0-6.25 3.125 3.125 0 0 0 0 6.25ZM9.375 18.75V5.208'/%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-width='1.333' d='m21.875 3.125-12.5 2.083m12.5 2.084-12.5 2.083'/%3E%3Cpath stroke='%234E4E4E' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M18.75 19.792a3.125 3.125 0 1 0 0-6.25 3.125 3.125 0 0 0 0 6.25ZM21.875 16.667V3.125'/%3E%3C/svg%3E");
    margin-right: 10px;
  }
  #mabinogim .audio_list_wrap .list_area > ul {
    padding: 10px 0 0 0;
  }
  #mabinogim .audio_list_wrap .list_area > ul li {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    background: #fff;
    margin-bottom: 10px;
    padding: 20px;
    cursor: pointer;
  }
  #mabinogim .audio_list_wrap .list_area > ul li:last-child {
    margin-bottom: 0;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_1 {
    position: relative;
    padding: 0px;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 {
    position: relative;
    top: 0;
    left: 0px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 0 0;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 .title {
    position: relative;
    display: flex;
    align-items: center;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 .title::before {
    content: "";
    display: inline-block;
    width: 16px;
    min-width: 16px;
    height: 16px;
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M4 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM6 12V3.333'/%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-width='1.333' d='M14 2 6 3.333m8 1.334L6 6'/%3E%3Cpath stroke='%23888' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M12 12.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM14 10.667V2'/%3E%3C/svg%3E") no-repeat;
    margin-right: 6px;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 .title span {
    font-size: 14px;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 .duration {
    padding: 2px 10px;
    width: min-content;
    border: 1px solid #f3f3f3;
    border-radius: 20px;
  }
  #mabinogim .audio_list_wrap .list_area > ul li .order_2 .duration span {
    color: #6f6f6f;
    font-size: 10px;
    font-weight: 500;
    white-space: nowrap;
  }
  #mabinogim .audio_list_wrap .list_area > ul li.on {
    background-color: #00b670;
  }
  #mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .title::before {
    background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M4 14a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM6 12V3.333'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-width='1.333' d='M14 2 6 3.333m8 1.334L6 6'/%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.333' d='M12 12.667a2 2 0 1 0 0-4 2 2 0 0 0 0 4ZM14 10.667V2'/%3E%3C/svg%3E") no-repeat;
  }
  #mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .title span {
    color: #fff;
  }
  #mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .duration {
    padding: 2px 10px;
    width: min-content;
    border: 1px solid #fff;
    border-radius: 20px;
    background: #fff;
  }
  #mabinogim .audio_list_wrap .list_area > ul li.on .order_2 .duration span {
    color: #6f6f6f;
    font-size: 10px;
    font-weight: 500;
    white-space: nowrap;
  }
  #mabinogim .audio_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .audio_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .audio_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .audio_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .audio_list_wrap .list_area .pager .pagination a.prev_button {
    width: 30px;
    height: 23px;
  }
  #mabinogim .audio_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .audio_list_wrap .list_area .pager .pagination a.next_button {
    width: 30px;
    height: 23px;
  }
  #mabinogim .audio_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
  #mabinogim .category_area {
    width: 100%;
    margin-bottom: 20px;
  }
  #mabinogim .category_area ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 18px;
    font-size: 12px;
    border-radius: 12px;
    background: linear-gradient(#222632, #222632) no-repeat 0px -48px;
  }
  #mabinogim .category_area ul li a.active, #mabinogim .category_area ul li a.on {
    background: #222632;
    color: #fff;
  }
  #mabinogim .filter_area {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    margin-bottom: 10px;
  }
  #mabinogim .filter_area .order_1 {
    order: 1;
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 20px 0 10px;
  }
  #mabinogim .filter_area .order_1 button {
    position: relative;
    margin-right: 7px;
    color: #525252;
    padding: 4px 10px;
    font-size: 12px;
  }
  #mabinogim .filter_area .order_1 button.active, #mabinogim .filter_area .order_1 button.on {
    background: #5c5c5c;
    color: #fff;
    border-radius: 6px;
  }
  #mabinogim .filter_area .order_2 {
    position: relative;
    height: 42px;
    display: flex;
    width: 100%;
  }
  #mabinogim .filter_area .order_2 .total_list {
    position: relative;
    margin-right: 10px;
    border-radius: 16px;
  }
  #mabinogim .filter_area .order_2 .total_list button {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 42px;
    height: 42px;
    background-size: cover;
  }
}
@media (max-width: 1279px) {
  #mabinogim .event_list_wrap .list_area > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: calc(50% - 10px);
    margin: 0;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .thumbnail {
    width: 100%;
    min-width: 100%;
    aspect-ratio: 385/140;
    position: relative;
    overflow: hidden;
    max-width: none;
    max-height: none;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript {
    background: #fff;
    padding: 18px 30px;
    border-radius: 24px;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .type {
    color: #626262;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: -0.28px;
    text-transform: uppercase;
    padding: 5px 15px;
    border-radius: 20px;
    border: 1px solid #d9d9d9;
    background: #fff;
    width: min-content;
    white-space: nowrap;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .title {
    position: relative;
    display: flex;
    align-items: center;
    margin-left: 0px;
    margin-top: 8px;
    width: 100%;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_1 .title span {
    font-size: 16px;
    color: #626262;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 10px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .date span {
    color: #aaa;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: -0.24px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info {
    display: flex;
    margin-top: 10px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info div {
    display: flex;
    align-items: center;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info div span {
    font-size: 11px;
    color: #707070;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .comment {
    margin-right: 12px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .comment::before {
    display: block;
    content: "";
    width: 18px;
    height: 20px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%238E8E8E' d='m4 17-3-2h3v2Z'/%3E%3Cpath fill='%23AAA' d='M1 7a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v6a2 2 0 0 1-2 2H1V7Z'/%3E%3Cpath fill='%23F6F4F4' d='M4 9h2v2H4V9ZM8 9h2v2H8V9ZM12 9h2v2h-2V9Z'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .view {
    margin-right: 12px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .view::before {
    display: block;
    content: "";
    min-width: 18px;
    width: 18px;
    height: 10px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='10' fill='none'%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 10c5.61 0 9-4.22 9-5 0-.78-3.39-5-9-5-4.809 0-9 4.22-9 5 0 .78 4.191 5 9 5Zm0-1.25c2.13 0 3.857-1.679 3.857-3.75 0-2.071-1.727-3.75-3.857-3.75S5.143 2.929 5.143 5C5.143 7.071 6.87 8.75 9 8.75Z' clip-rule='evenodd'/%3E%3Cpath fill='%23AAA' fill-rule='evenodd' d='M9 7.5c1.42 0 2.571-1.12 2.571-2.5H9V2.5C7.58 2.5 6.428 3.62 6.428 5S7.58 7.5 9 7.5Z' clip-rule='evenodd'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li .descript .order_2 .sub_info .like::before {
    display: block;
    content: "";
    width: 12px;
    min-width: 12px;
    height: 11px;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='11' fill='none'%3E%3Cpath fill='%23AAA' d='M0 2v4l3 3 3 2 3-2 3-3V2L9 0 6 2 3 0 0 2Z'/%3E%3C/svg%3E");
    background-size: cover;
    margin-right: 4px;
  }
  #mabinogim .event_list_wrap .list_area .list_empty {
    border-top: 1px solid #aaa;
    border-bottom: 1px solid #aaa;
  }
  #mabinogim .event_list_wrap .list_area .list_empty span {
    min-height: 220px;
    height: 220px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .event_list_wrap .list_area .list_empty span b {
    color: #f65606;
  }
  #mabinogim .event_list_wrap .list_area .pager {
    display: block;
    width: 100%;
    margin: 20px auto 0;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination ul {
    display: flex;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination ul li {
    font-size: 10px;
    color: #525252;
    margin-right: 4px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination ul li.on {
    color: #fff;
    background: #2baf7e;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination ul li:first-child {
    margin-left: 8px;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination ul li:last-child {
    margin-right: 8px;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination button.prev_button,
  #mabinogim .event_list_wrap .list_area .pager .pagination a.prev_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .event_list_wrap .list_area .pager .pagination button.next_button,
  #mabinogim .event_list_wrap .list_area .pager .pagination a.next_button {
    width: 20px;
    height: 23px;
    border-radius: none;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #mabinogim .event_list_wrap .list_area .pager .write_button {
    display: block;
    background: #00b670;
    border-radius: 12px;
    font-size: 18px;
    color: #fff;
    margin: 30px auto 0;
  }
}
@media (max-width: 700px) {
  #mabinogim .event_list_wrap .list_area > ul {
    gap: 16px;
  }
  #mabinogim .event_list_wrap .list_area > ul > li {
    width: 100%;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul,
  #mabinogim .support .grid_list_wrap .list_area > ul {
    max-width: 170px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(1, minmax(0px, 1fr));
    gap: 10px;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul li,
  #mabinogim .support .grid_list_wrap .list_area > ul li {
    width: 100%;
  }
  #mabinogim .report .grid_list_wrap .list_area > ul li a,
  #mabinogim .support .grid_list_wrap .list_area > ul li a {
    display: block;
    width: 100%;
    height: 74px;
    background-image: url("https://lwi.nexon.com/m_mabinogim/brand/customer/m_report_card.png");
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fcfcfc;
    font-size: 12px;
  }
  #mabinogim .video_list .grid_list_wrap .list_area > ul,
  #mabinogim .image_list .grid_list_wrap .list_area > ul,
  #mabinogim .creation .grid_list_wrap .list_area > ul,
  #mabinogim .digitalgoods .grid_list_wrap .list_area > ul {
    grid-template-columns: repeat(1, minmax(0px, 1fr));
  }
}