/* ------------------------------------------------------------- */
/* ------------------- 공통으로 들어가는 부분  ------------------- */
/* ------------------------------------------------------------- */

::selection{background-color: #292e91; color: #fff;}


html {overflow-y:scroll; overflow-x:hidden; font-size: 15px; scroll-behavior: smooth; }

body{
    font-weight: 400;
	color:#333;
    width:100%;
    font-family: 'Play', "SCoreDream", 'Pretendard','Noto Sans JP','Noto Sans SC','Noto Sans TC', sans-serif;
    /* letter-spacing:-.02em; */
	line-height: 1.4;
    font-size:16px;       
}

:lang(en) body{line-height: 1.2;}
:lang(jp) section{word-break: break-all;}
:lang(ch) section{word-break: break-all;}

::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
    background-color: #e5e5e5;
    /* border-radius: 100px; */
}
::-webkit-scrollbar-thumb {
    background-color: #fff;
    /* border-radius: 100px; */
}
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #4ca9df, #292e91);
    box-shadow: inset 2px 2px 5px 0 rgba(#fff, 0.5);
    /* border-radius: 100px; */
}


/* 전체 */
.wrap{width: 100%; min-height: 100%; position: relative;}

/* clearfix */
.cf::before, .cf::after{display:block; content:''; clear: both;}


/* blind */
.blind{position: absolute; top: -9999999px; text-indent: -9999px; font-size: 0!important;}
.hidden{opacity: 0; visibility: hidden;}
.hide{position: absolute; width: 1px; height: 1px; margin:-1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0;}

/* boundary */
[class*='bd']{width: 100%; margin-left:auto; margin-right:auto; position: relative;}
.bd-xs{max-width: 640px;} .bd-sm{max-width: 960px;} .bd-md{max-width: 1200px;} .bd-lg{max-width: 1440px;} .bd-xl{max-width: 1600px;}

/* responsive */
.mo_ver{display: none;}

/* font-size */
.xsmall{font-size:0.9em;}
.medium{font-size:1.225em;}


/* --------------------------------------------------
-------------------------text--------------------- */
.text-left{text-align: left !important;}
.text-right{text-align: right !important;}
.text-center{text-align: center !important;}



/* --------------------------------------------------
-------------------------ellipsis--------------------- */
.ellipsis{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ellipsis2{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;
  -webkit-line-clamp: 3;-webkit-box-orient: vertical; word-wrap:break-word; line-height:1.7;}
.ellipsis3{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;
    -webkit-line-clamp: 3;-webkit-box-orient: vertical; word-wrap:break-word; line-height:1.7;}


/* --------------------------------------------------
------------------------display------------------- */
.dis-block{display: block;}
.dis-in-block{display: inline-block;}
.dis-none{display: none;}

.fl-left{float:left;}
.fl-right{float: right;}



/* --------------------------------------------------
------------------------margin-------------------- */
.mt-0{margin-top:0;} .mt-1{margin-top:8px;} .mt-2{margin-top:16px;} .mt-3{margin-top:24px;} .mt-4{margin-top:32px;} .mt-5{margin-top:40px;} .mt-6{margin-top:48px;} .mt-7{margin-top:56px;} .mt-8{margin-top:64px;} .mt-9{margin-top:72px;} .mt-10{margin-top:80px;}
.mb-0{margin-bottom:0;} .mb-1{margin-bottom:8px;} .mb-2{margin-bottom:16px;} .mb-3{margin-bottom:24px;} .mb-4{margin-bottom:32px;} .mb-5{margin-bottom:40px;} .mb-6{margin-bottom:48px;} .mb-7{margin-bottom:56px;} .mb-8{margin-bottom:64px;} .mb-9{margin-bottom:72px;} .mb-10{margin-bottom:80px;}
.mr-0{margin-right:0;} .mr-1{margin-right:8px;} .mr-2{margin-right:16px;} .mr-3{margin-right:24px;} .mr-4{margin-right:32px;} .mr-5{margin-right:40px;} .mr-6{margin-right:48px;} .mr-7{margin-right:56px;} .mr-8{margin-right:64px;} .mr-9{margin-right:72px;} .mr-10{margin-right:80px;}
.ml-0{margin-left:0;} .ml-1{margin-left:8px;} .ml-2{margin-left:16px;} .ml-3{margin-left:24px;} .ml-4{margin-left:32px;} .ml-5{margin-left:40px;} .ml-6{margin-left:48px;} .ml-7{margin-left:56px;} .ml-8{margin-left:64px;} .ml-9{margin-left:72px;} .ml-10{margin-left:80px;}



/* --------------------------------------------------
------------------------padding------------------- */
.pt-0{padding-top:0;} .pt-1{padding-top:8px;} .pt-2{padding-top:16px;} .pt-3{padding-top:24px;} .pt-4{padding-top:32px;} .pt-5{padding-top:40px;} .pt-6{padding-top:48px;} .pt-7{padding-top:56px;} .pt-8{padding-top:64px;} .pt-9{padding-top:72px;} .pt-10{padding-top:80px;}
.pb-0{padding-bottom:0;} .pb-1{padding-bottom:8px;} .pb-2{padding-bottom:16px;} .pb-3{padding-bottom:24px;} .pb-4{padding-bottom:32px;} .pb-5{padding-bottom:40px;} .pb-6{padding-bottom:48px;} .pb-7{padding-bottom:56px;} .pb-8{padding-bottom:64px;} .pb-9{padding-bottom:72px;} .pb-10{padding-bottom:80px;}
.pr-0{padding-right:0;} .pr-1{padding-right:8px;} .pr-2{padding-right:16px;} .pr-3{padding-right:24px;} .pr-4{padding-right:32px;} .pr-5{padding-right:40px;} .pr-6{padding-right:48px;} .pr-7{padding-right:56px;} .pr-8{padding-right:64px;} .pr-9{padding-right:72px;} .pr-10{padding-right:80px;}
.pl-0{padding-left:0;} .pl-1{padding-left:8px;} .pl-2{padding-left:16px;} .pl-3{padding-left:24px;} .pl-4{padding-left:32px;} .pl-5{padding-left:40px;} .pl-6{padding-left:48px;} .pl-7{padding-left:56px;} .pl-8{padding-left:64px;} .pl-9{padding-left:72px;} .pl-10{padding-left:80px;}


/* --------------------------------------------------
------------------------revers------------------- */
.revers{flex-direction: row-reverse;
    -webkit-flex-direction: row-reverse;}
    


/* --------------------------------------------------
------------------------button------------------ */

.button{position: relative;}
.button button{ -webkit-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    -moz-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    -o-transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}



/* --------------------------------------------------
------------------------checkbox------------------ */
.check-mark{cursor: pointer;}
.check-mark > input{position: absolute; box-sizing: border-box; width: 20px; height: 20px; vertical-align: top; border:0;-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-border-radius: 0;
    opacity: 0; }
.check-mark em{display: inline-block; position: relative; font-size: 14px; padding-left: 30px; text-align: left; box-sizing: border-box;vertical-align: top; line-height: 19px;}
.check-mark em::before{border: 1px solid #ddd; background-color:#fff; content: ""; display: block; left: 0; position: absolute; width: 20px; height: 20px;}
.check-mark em::after{content: ""; display: block; position: absolute;}
.check-mark input:checked + em::before{background-color: #E2C344; border-color: #E2C344}
.check-mark input:checked + em::after{width: 11px; height: 6px; top: 5px; left: 4px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}


/* --------------------------------------------------
------------------------radiobox------------------ */
.check-mark em.radio::before{border-radius: 50%;}
.check-mark input:checked + em.radio::before{background-color: #18b0e2; border-color: #18b0e2}
.check-mark input:checked + em.radio::after{width: 10px;height: 10px; left: 5px; top: 5px; border-radius: 50%;background: #fff; }




/* 페이지네이션 */
.pagination{text-align: center; margin-top: 60px; width: auto; font-size: 0;}
.pagination .page a{display: inline-block; height: 34px; font-weight: bold; font-size: 15px; line-height: 34px; cursor:pointer;
 box-sizing: border-box; /* border: 1px solid #ddd; */ vertical-align: top; text-align: center; margin: 0 7px;  }
.pagination .page a + a{margin-left: 20px;}
.pagination .page a.active, .pagination .page a:hover{color:#E2C344; border-bottom: 2px solid;}

/* loading */
.loading{width:100%;height:100%;position:fixed;left:0px;top:0px;background:#fff;opacity:0.5;z-index:9999;display:none; /* 이 값으로 레이어의 위치를 조정합니다. */}
.loading_img{position:absolute; left: 50%; top: 50%; width: 200px; height: 200px; transform: translateX(-50%); transform: translateY(-50%)}





/* --------------------------------------------------
------------------------inputbox------------------ */
form input{width: 100%;}
form input[type=text],form input[type=password]{border: none; outline: none;background-color: #fff; border: 1px solid #ddd; padding: 2px 8px; width: 100%; height: 50px; line-height: 50px; }
form input{ height:40px;}
form input[type=text]:disabled{background-color:#dcdee1 !important; color:#939496;}
form input[type=text], .form input[type=password]{background-color:#fff;border:1px solid #ececec; padding-left:8px; padding-right:8px; width: 100%;}
form input[type=button]{font-weight:700; outline: none; border:0; border-radius: 4px; cursor: pointer; padding-left:24px; padding-right:24px;}
form input.btn-default{background-color: #fff;  border: 1px solid #ddd;}

input.input-min{max-width: 48px;}
input.input-xs{max-width: 128px;}
input.input-sm{max-width: 360px}
input.input-md{max-width: 480px;}
input.input-lg{max-width: 100%;}



/* --------------------------------------------------
---------------------grid system------------------ */
.row {margin-left:-16px; margin-right:-16px;}
.row-too-short{margin-left:-2px; margin-right:-2px;}
.row-short{margin-left:-8px; margin-right:-8px;}
.row-wide{margin-left:-32px; margin-right:-32px;}
.row-too-wide{margin-left:-48px; margin-right:-48px;}

[class*='row']:before, [class*='row']:after{display: table; content: " "; clear: both;}

.row > [class*='col']{padding-right: 16px; padding-left: 16px;}
.row-too-short > [class*='col']{padding-right: 2px; padding-left: 2px;}
.row-short > [class*='col']{padding-right: 8px; padding-left: 8px;}
.row-wide > [class*='col']{padding-right: 32px; padding-left: 32px;}
.row-too-wide > [class*='col']{padding-right:48px; padding-left:48px;}

.col-xs-1, .col-sm-1, .col-md-1, .col-xs-2, .col-sm-2, .col-md-2, .col-xs-3, .col-sm-3, .col-md-3, .col-xs-4, .col-sm-4, .col-md-4,
.col-xs-5, .col-sm-5, .col-md-5, .col-xs-6, .col-sm-6, .col-md-6, .col-xs-7, .col-sm-7, .col-md-7, .col-xs-8, .col-sm-8, .col-md-8,
.col-xs-9, .col-sm-9, .col-md-9, .col-xs-10, .col-sm-10, .col-md-10, .col-xs-11, .col-sm-11, .col-md-11, .col-xs-12, .col-sm-12, .col-md-12 {
    position:relative;
    min-height:1px; 
}

.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12,
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {float: left;}

.col-xs-12 {width:100%;}
.col-xs-11 {width:91.66666667%;}
.col-xs-10 {width:83.33333333%;}
.col-xs-9 {width:75%;}
.col-xs-8 {width:66.66666667%;}
.col-xs-7 {width:58.33333333%;}
.col-xs-6 {width:50%;}
.col-xs-5 {width: 41.66666667%;}
.col-xs-4 {width: 33.33333333%;}
.col-xs-3 {width: 25%;}
.col-xs-2 {width: 16.66666667%;}
.col-xs-1 {width: 8.33333333%;}



.col-sm-12 {width: 100%;}
.col-sm-11 {width: 91.66666667%;}
.col-sm-10 {width: 83.33333333%;}
.col-sm-9 {width: 75%;}
.col-sm-8 {width: 66.66666667%;}
.col-sm-7 {width: 58.33333333%;}
.col-sm-6 {width: 50%;}
.col-sm-5 {width: 41.66666667%;}
.col-sm-4 {width: 33.33333333%;}
.col-sm-3 {width: 25%;}
.col-sm-2 {width:20%;}
.col-sm-1 {width: 8.33333333%;}



.col-md-12 {width: 100%;}
.col-md-11 {width: 91.66666667%;}
.col-md-10 {width: 83.33333333%;}
.col-md-9 {width: 75%;}
.col-md-8 {width: 66.66666667%;}
.col-md-7 {width: 58.33333333%;}
.col-md-6 {width: 50%;}
.col-md-5 {width: 40%;}
.col-md-4 {width: 33.33333333%;}
.col-md-3 {width: 25%;}
.col-md-2 {width: 20%;}
.col-md-1 {width: 15%;}





/* ********************************************* *
 * 1660px max
 * ********************************************* */
 @media (max-width:1660px){

    [class*='bd']{padding-left: 16px; padding-right:16px;}

   
    
}
/* ********************************************* *
* 1024px max
* ********************************************* */
@media (max-width:1200px){

   
    
}

    
/* ********************************************* *
* 1024px max
* ********************************************* */
@media (max-width:1024px){

    html{font-size: 16px;}

    /* responsive */
    .mo_ver{display: block;}
    .pc_ver{display: none;}

    .col-sm-12 {width:100%;}
    .col-sm-11 {width:91.66666667%;}
    .col-sm-10 {width:83.33333333%;}
    .col-sm-9 {width:75%;}
    .col-sm-8 {width:66.66666667%;}
    .col-sm-7 {width:58.33333333%;}
    .col-sm-6 {width:50%;}
    .col-sm-5 {width: 41.66666667%;}
    .col-sm-4 {width: 33.33333333%;}
    .col-sm-3 {width: 25%;}
    .col-sm-2 {width: 16.66666667%;}
    .col-sm-1 {width: 8.33333333%;}


    
}


/* ********************************************* *
* 760px max
* ********************************************* */

@media (max-width:768px)
{
    html{font-size: 15px;}



}

/* ********************************************* *
* 840px max
* ********************************************* */

@media (max-width:840px)
{

    .col-xs-12 {width:100%;}
    .col-xs-11 {width:91.66666667%;}
    .col-xs-10 {width:83.33333333%;}
    .col-xs-9 {width:75%;}
    .col-xs-8 {width:66.66666667%;}
    .col-xs-7 {width:58.33333333%;}
    .col-xs-6 {width:50%;}
    .col-xs-5 {width: 41.66666667%;}
    .col-xs-4 {width: 33.33333333%;}
    .col-xs-3 {width: 25%;}
    .col-xs-2 {width: 16.66666667%;}
    .col-xs-1 {width: 8.33333333%;}


}