@charset "UTF-8";
/*
 *  File Name : /ui_resource/css/responsive/about.css
 *  Description : ABOUT 페이지 스타일
 *  Page : /about/*
 *  Selector : .page-about, .page-about--slot-list, .page-about--slot-detail
 */

/* common */
[class*=page-about] .section-top-banner {background-image: url(../../images/about/bg_top_banner.jpg);}

/* page-about : common */
.page-about .comm-title-wrap {margin-bottom: 0 !important;}
.page-about .section-main-contents [class^=wrapper-],
.page-about .section-main-contents .comm-content-wrap + .comm-content-wrap  {margin-top: 90px;}

/* .page-about : wrapper-about-list */
.page-about .wrapper-about-list .about-list {display: flex; flex-direction: column;}
.page-about .wrapper-about-list .about-list .list-item {display: flex; justify-content: space-between; align-items: center; position: relative; width: 100%; height: 376px; padding: 0 0 0 80px; margin-top: 50px; background: linear-gradient(90deg, #3811AE 0%, #4C17E4 80%); border-radius: 30px; box-sizing: border-box;}
.page-about .wrapper-about-list .about-list .list-item:nth-child(2n) {flex-direction: row-reverse; padding: 0 80px 0 0;}
.page-about .wrapper-about-list .about-list .list-item .info-area .info-tit {color: #fff; font-family: var(--ft-family_Poppins-600); font-size: 50px; line-height: 1;}
.page-about .wrapper-about-list .about-list .list-item .info-area .info-cont {margin-top: 15px; color: #DBD4EC; font-family: var(--ft-family_Poppins-300); font-size: 24px; line-height: 1.4;}
.page-about .wrapper-about-list .about-list .list-item .img-area {position: absolute; top: -24px;}
.page-about .wrapper-about-list .about-list .list-item:nth-child(1) .img-area {right: -50px;}
.page-about .wrapper-about-list .about-list .list-item:nth-child(2) .img-area {left: -25px;}
.page-about .wrapper-about-list .about-list .list-item:nth-child(3) .img-area {right: -11px;}
.page-about .wrapper-about-list .about-list .list-item:nth-child(4) .img-area {left: -44px;}

/* .page-about : wrapper-about-imgbox */
.page-about .wrapper-about-imgbox {display: flex; position: relative;}
.page-about .wrapper-about-imgbox > .info-area {width: 920px;}
.page-about .wrapper-about-imgbox > .img-area {position: absolute; right: -170px; top: -65px;}

/* page-about--slot-list : common */
.page-about--slot-list .top-area {display: flex;}
.page-about--slot-list .top-area .field-item,
.page-about--slot-list .top-area .field-item::placeholder {color: #fff; font-family: var(--ft-family_Poppins-300); font-size: 24px;}
.page-about--slot-list .top-area .field-item:focus {outline: none; border: 1px solid #1398FF;}
.page-about--slot-list .top-area .field-item {overflow: hidden; display: flex; height: 60px; padding: 0 30px; background: #3811AE; border: 0; border-radius: 5px; box-sizing: border-box;}
.page-about--slot-list .top-area .sort-slot {position: relative; width: 320px; appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='14' viewBox='0 0 25 14' fill='none'%3E%3Cpath d='M23.9728 2.03964C24.4935 1.47641 24.4935 0.563231 23.9728 0H0.753806C0.233106 0.563231 0.233106 1.47641 0.753806 2.03964L11.4205 13.5776C11.9412 14.1408 12.7854 14.1408 13.3061 13.5776L23.9728 2.03964Z' fill='%231398FF'/%3E%3C/svg%3E"); background-size: 24px; background-repeat: no-repeat; background-position: calc(100% - 30px) center;}
.page-about--slot-list .top-area .searchbox {display: flex; position: relative; width: 460px; margin-left: 20px;}
.page-about--slot-list .top-area .searchbox .inp-search {width: 100%; padding-right: 90px;}
.page-about--slot-list .top-area .searchbox .btn-search {position: absolute; right: 0; top: 0; width: 90px; height: 100%;}
.page-about--slot-list .top-area .searchbox .btn-search::after {content: ""; display: inline-block; width: 30px; height: 30px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M12.3807 24.5299C14.882 24.5299 17.226 23.7818 19.1767 22.5039L26.0671 29.3455C26.5233 29.7818 27.1054 30 27.7347 30C29.0404 30 30 28.987 30 27.7091C30 27.1169 29.7955 26.5403 29.355 26.1039L22.5118 19.2935C23.9276 17.2987 24.7614 14.8831 24.7614 12.2649C24.7614 5.51688 19.1924 0 12.3807 0C5.58469 0 0 5.51688 0 12.2649C0 19.013 5.56896 24.5299 12.3807 24.5299ZM12.3807 21.2571C7.39381 21.2571 3.30362 17.2052 3.30362 12.2649C3.30362 7.32468 7.39381 3.27273 12.3807 3.27273C17.3676 3.27273 21.4578 7.32468 21.4578 12.2649C21.4578 17.2052 17.3676 21.2571 12.3807 21.2571Z' fill='%231398FF'/%3E%3C/svg%3E"); background-size: cover;}
.page-about--slot-list .top-area .searchbox .inp-search:focus::placeholder {opacity: 0;}
.page-about--slot-list .pagination-comm {padding-top: 10px;}

/* page-about--slot-list : wrapper-slot-list  */
.page-about--slot-list .wrapper-slot-list {margin-top: 50px;}
.page-about--slot-list .wrapper-slot-list .slot-list {display: flex; flex-wrap: wrap;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item {width: 320px; margin-right: 40px; margin-bottom: 40px;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item:nth-child(4n) {margin-right: 0 !important;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item > a {display: flex; flex-direction: column; align-items: center;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item .slot-thumbnail {overflow: hidden; display: block; border-radius: 30px;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item .slot-thumbnail img {transform: scale(1); transition: transform .6s ease-out;} 
.page-about--slot-list .wrapper-slot-list .slot-list .list-item .slot-name {margin-top: 10px; color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 20px;}
.page-about--slot-list .wrapper-slot-list .slot-list .list-item:hover .slot-thumbnail img {transform: scale(1.05);}

/* page-about--slot-detail */
.page-about--slot-detail .section-main-contents {padding-top: 50px;}
.page-about--slot-detail .layout-inner {width: 1240px;}
.page-about--slot-detail img {width: 100%;}
.page-about--slot-detail .btn-back {display: flex; align-items: center; height: 50px; padding: 0 32px; background: #1398FF; border-radius: 120px; box-sizing: border-box;}
.page-about--slot-detail .btn-back > .txt {display: flex; align-items: center; color: #fff; font-family: var(--ft-family_Poppins-400); font-size: 24px;}
.page-about--slot-detail .btn-back > .txt::before {content: ""; display: inline-block; width: 12px; height: 19px; margin-right: 15px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='20' viewBox='0 0 12 20' fill='none'%3E%3Cpath d='M11.5411 1.14836C11.8349 1.40944 12 1.76349 12 2.13265C12 2.50182 11.8349 2.85587 11.5411 3.11695L3.78308 10.0084L11.5411 16.8999C11.8266 17.1624 11.9846 17.5141 11.981 17.8791C11.9774 18.2442 11.8126 18.5934 11.522 18.8515C11.2314 19.1096 10.8383 19.256 10.4274 19.2592C10.0165 19.2624 9.62058 19.122 9.32499 18.8684L0.458878 10.9927C0.165059 10.7316 0 10.3776 0 10.0084C0 9.63924 0.165059 9.28519 0.458878 9.02411L9.32499 1.14836C9.6189 0.887359 10.0175 0.740738 10.4331 0.740738C10.8486 0.740738 11.2472 0.887359 11.5411 1.14836Z' fill='white'/%3E%3C/svg%3E"); background-size: contain; background-repeat: no-repeat;}

/* page-about--slot-detail : wrapper-detail-info */
.page-about--slot-detail .wrapper-detail-info {display: flex; align-items: center;}
.page-about--slot-detail .wrapper-detail-info .info-area {width: calc(100% - 370px);}
.page-about--slot-detail .wrapper-detail-info .info-area > * {color: #fff !important;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area {display: flex; justify-content: center; align-items: center; position: relative; width: 365px; height: 414px; background: url(../../images/about/bg_slot_machines.png?v=2) center no-repeat; background-size: contain;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area::after {content: ""; z-index: 1; position: absolute; bottom: 0; width: 365px; height: 92px; background: url(../../images/about/bg_slot_coins.png) center no-repeat;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area .slot-machine,
.page-about--slot-detail .wrapper-detail-info .slot-machine-area .slot-machine .screenbox {width: 228px;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area .slot-machine {position: relative;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area .slot-machine .screenbox {position: absolute; left: 0; top: 0;}
.page-about--slot-detail .wrapper-detail-info .slot-machine-area .slot-machine .screenbox .motion-img {position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); width: 130px;}

/* page-about--slot-detail : wrapper-image-preview */
.page-about--slot-detail .wrapper-image-preview {display: flex; justify-content: center; margin-top: 50px;}
.page-about--slot-detail .wrapper-image-preview > * {border-radius: 15px; border: 5px solid #1398FF; box-sizing: border-box;}

/* 
 *  [해상도 769px ~ 1024px]
 *  - 낮은 해상도의 PC
 *  - 태블릿 가로모드
 */
 @media all and (max-width:1024px) {

}