﻿/* common */
.mb-0 {
    margin-bottom:0 !important;
}
.btn-1 {
    font-family: kopl;
    color: #fff;
    font-size: 14px;
}
.btn-2 {
    padding: 0 10px;
    line-height: 32px;
    font-size: 14px;
    letter-spacing: -0.025em;
    color: #fff;
    background: #298aff;
    border-radius: 4px;
}
.btn-3 {
    line-height: 50px;
    font-size: 16px;
    letter-spacing: -0.01em;    
    color: #487bf3;
    border-radius: 6px;
    width: 82%;
    text-align:center;
    border:1px solid #7aa1ff;
}
.btn-4 {
    font-family: kopl;
    font-size: 14px;
    color: #245ed3;
}
.btn-5 {
    display:inline-block;
    width:255px;
    text-align:center;
    font-size: 16px;
    color: #fff;
    letter-spacing: -0.01em;
    line-height: 44px;
    background: #45a5ff;
    border-radius:22px;
}
.btn-6 {
    display: inline-block;
    color: #245ed3;
    border-bottom: 1px solid #245ed3;
}
.btn-7 {
    display: inline-block;
    width: 255px;
    text-align: center;
    font-size: 16px;
    color: #fff;
    letter-spacing: -0.01em;
    line-height: 44px;
    background: #e3e3e3;
    border-radius: 22px;
}
.btn-7.on,
.btn-7:hover{
    background: #45a5ff;
}
.btn-8 {
    font-family: kopl;
    font-size: 12px;
    color: #66738d;
    letter-spacing:-0.025em;
    line-height: 18px;
    text-decoration:underline;
}
.btn-9 {
    padding: 0 10px;
    line-height: 20px;
    font-family: kopl;
    font-size: 12px;
    letter-spacing: -0.025em;
    color: #fff;
    background: #298aff;
    border-radius: 4px;
}
.btn-10 {
    width: 96%;
    line-height: 48px;
    font-family: kopl;
    font-size: 16px;
    color: #45a5ff;
    letter-spacing: -0.01em;
    background: #f3f7fe;
    border-radius: 6px;
    text-align: center;
}
.btn-11 {
    width: 80%;
    line-height: 48px;
    font-family: kopl;
    font-size: 16px;
    color: #fff;
    letter-spacing: -0.01em;
    background: #3c80fd;
    border-radius: 6px;
    text-align: center;
}
.btn-12 {
    width: 96%;
    line-height: 48px;
    font-family: kopl;
    font-size: 16px;
    color: #66738d;
    letter-spacing: -0.01em;
    background: #f3f7fe;
    border-radius: 6px;
    text-align: center;
}
.btn-13 {
    display: inline-block;
    padding: 0 24px 0 8px;
    font-size: 12px;
    color: #fff;
    line-height: 22px;
    letter-spacing: -0.01em;
    background: #ccc url(../imgs/sub/ico_em_2.png) no-repeat right 5px center;
    border-radius: 4px;
    vertical-align: middle;
}
.btn-14 {
    display: inline-block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    color: #fff;
    font-weight: 300;
    height: 48px;
    line-height: 48px;
    letter-spacing: -0.01em;
    background: #2669f2;
    border-radius: 6px;
}
.btn-15 {
    overflow: hidden;
    box-sizing: border-box;
    display: inline-block;
    min-width: 100px;
    height: 48px;
    line-height: 48px;
    width: 100%;
    text-align: center;
    border: 1px solid #669cff;
    font-size: 16px;
    letter-spacing: -0.01em;
    border-radius: 5px;
    background: #669cff;
    color: #fff;
}
.btn-15:hover{
    background:#fff;
    color:#669cff;
}
.btn-16{
    display: inline-block;
    padding: 0 24px 0 5px;
    font-size: 12px;
    color: #fff;
    line-height: 22px;
    letter-spacing: -0.01em;
    background: #003e9b url(../imgs/main/ico_em.png) no-repeat right 5px center;
    border-radius: 4px;
    vertical-align: middle;
}
.check {
    display: inline-block;
    padding-left: 26px;
    line-height: 18px;
    background: url(../imgs/common/check_off.png) no-repeat left center;
    font-family: kopl;
    font-size: 14px;
    color: #999;
    letter-spacing: -0.025em;
}
.check.checked {
    background:url(../imgs/common/check_on.png) no-repeat left center;
    color:#45a5ff;
}
.radio {
    box-sizing: border-box;
    display: inline-block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid #c4c4c4;
    vertical-align: middle;
    cursor: pointer;
}
.radio.checked{
    background:url(../imgs/common/radio_on.png) no-repeat center center;
}
.radio-style-1 {
    display: inline-block;
    width: 46%;
    text-align:center;
    border-style: solid;
    border-color: #e5e5e5;
    border-width: 0 0 1px 0;
    line-height: 36px;
    font-family: kopl;
    font-size: 14px;
    color: #8d8d8d;
}
.radio-style-1.checked{
    color:#4aa7ff;
    border-color:#4aa7ff;
}
.radio-style-2 {
    box-sizing: border-box;
    display: inline-block;
    line-height: 18px;
    padding-left: 27px;
    vertical-align: middle;
    cursor: pointer;
    font-family: kopl;
    font-size: 14px;
    color: #999;
    letter-spacing: -0.025em;
    background: url(../imgs/common/radio_3_off.png) no-repeat left center;
}
.radio-style-2.checked{
    background:url(../imgs/common/radio_3_on.png) no-repeat left center;
    color:#45a5ff;
} 
.color-1 {
    color: #ff4444 !important;
}
.color-2 {
    color: #2669f2 !important;
}
.color-3 {
    color: #112e56 !important;
}
.color-4 {
    color: #ff7200 !important;
}
h3{
    margin-bottom:20px;
    font-size:24px;
    font-weight:normal;
    letter-spacing:-0.01em;
    color:#444;
    line-height:120%;
}
h4 {
    margin-bottom: 8px;
    font-size: 16px;
    font-weight: normal;
    letter-spacing: -0.01em;
    color: #444;
    line-height: 120%;
}
h5 {
    margin-bottom: 15px;
    font-weight: normal;
    font-size: 18px;
    letter-spacing: -0.025em;
    color: #112e56;
}
.text-over {
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}
input[type='text'],
input[type='password'],
select{
    box-sizing:border-box;
    height:44px;
    max-width:100%;
    line-height: 42px;
    border: 1px solid #e1e1e1;
    font-size: 14px;
    text-indent:15px;
    color: #a2a2a2;
    border-radius:6px;
}
.textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 10px 15px;
    border-style: solid;
    border-color: #e1e1e1;
    border-width:1px;
    font-size: 14px;
    color: #a2a2a2;
    height:100px;
}
option {
    line-height: 42px;
    font-size: 14px;
    color: #a2a2a2;
}
inpue[type=text]::placeholder,
inpue[type=password]::placeholder{    
    color: #a2a2a2;
}
.input-box-1{
    position:relative;
    display:block;
    clear:both;
}
.normal-massage,
.error-massage,
.clear-massage {
    display: block;
    margin-top: 8px;
    font-family: kopl;
    font-size: 12px;
    text-align: right;
    letter-spacing: -0.01em;
}
.normal-massage {
    color: #66738d;
}
.error-massage {
    /*display:none;*/
    color: #ff4444;
}
.clear-massage {
    /*display:none;*/
    color: #4ea9ff;
}
.clear .clear-massage{
    display:block;
}
.clear .error-massage,
.clear .normal-massage {
    display: none;
}
.error .error-massage{
    display:block;
}
.error .clear-massage,
.error .normal-massage {
    display: none;
}
input.login-style[type="text"],
input.login-style[type="password"],
input.login-style[type="email"],
input.login-style[type="tel"],
input.login-style[type="number"],
input.setting-style[type="text"],
input.setting-style[type="password"],
input.setting-style[type="email"],
input.setting-style[type="tel"],
input.setting-style[type="number"]{
    width: 100%;
    border-style: solid;
    border-color: #e5e5e5;
    border-width: 0 0 2px 0;
    line-height: 36px;
    text-indent: 10px;
    font-family: kopl;
    font-size: 14px;
    color: #8d8d8d;
    outline: none;
    border-radius: 0;
}
input.login-style[type="text"]::placeholder,
input.login-style[type="password"]::placeholder,
input.login-style[type="email"]::placeholder,
input.login-style[type="tel"]::placeholder,
input.login-style[type="number"]::placeholder,
input.setting-style[type="text"]::placeholder,
input.setting-style[type="password"]::placeholder,
input.setting-style[type="email"]::placeholder,
input.setting-style[type="tel"]::placeholder,
input.setting-style[type="number"]::placeholder{
    color: #8d8d8d;
}
input.login-style[type="text"]:focus,
input.login-style[type="text"]:hover,
input.login-style[type="password"]:focus,
input.login-style[type="password"]:hover,
input.login-style[type="email"]:focus,
input.login-style[type="email"]:hover,
input.login-style[type="tel"]:focus,
input.login-style[type="tel"]:hover,
input.login-style[type="number"]:focus,
input.login-style[type="number"]:hover,
input.setting-style[type="text"]:focus,
input.setting-style[type="text"]:hover,
input.setting-style[type="password"]:focus,
input.setting-style[type="password"]:hover,
input.setting-style[type="email"]:focus,
input.setting-style[type="email"]:hover,
input.setting-style[type="tel"]:focus,
input.setting-style[type="tel"]:hover,
input.setting-style[type="number"]:focus,
input.setting-style[type="number"]:hover{
    color: #4aa7ff;
    border-color: #4aa7ff;
}
.error input.login-style{
    background:url(../imgs/common/input_error_ico.png) no-repeat right 10px center;
}
.clear input.login-style {
    background: url(../imgs/common/input_clear_ico.png) no-repeat right 10px center;
}
.input-in-btn {
    position: absolute;
    display: inline-block;
    right: 10px;
    top: 10px;
    padding:1px 8px 0 8px;
    color: #fff;
    background: #4aa7ff;
    font-family: kopl;
    font-size: 12px;
    line-height: 21px;
    border-radius:4px;
    z-index:10;
}
.ico-in-search {
    background: url(../imgs/common/ico_search.png) no-repeat right 10px center;
    background-size: 15px 15px;
}
.select {
    position: relative;
    display: block;
    box-sizing: border-box;
    height: 44px;
    border: 1px solid #e1e1e1;
    border-radius:6px;
    background: url(../imgs/common/ico_select_off.png) no-repeat center right 14px;
}
.select.checked{
    background-image:url(../imgs/common/ico_select_on.png);
}
.select .select-title,
.select .option{
    display:block;
    line-height: 42px;
    font-size: 14px;
    text-indent: 15px;
    color: #a2a2a2;
}
.select .select-con{
    position:absolute;
    display:none;
    left:-1px;
    top:39px;
    width:100%;
    background:#fff;
    border-style:solid;
    border-width:0 1px 1px 1px;
    border-color:#e1e1e1;
    z-index:10;
    border-bottom-left-radius:6px;
    border-bottom-right-radius:6px;
}
.login-select {
    position: relative;
    display: block;
    border-style: solid;
    border-color: #e5e5e5;
    border-width: 0 0 2px 0;
    line-height: 36px;
    text-indent: 10px;
    font-family: kopl;
    font-size: 14px;
    color: #8d8d8d;
    outline: none;
    border-radius: 0;
    background: url(../imgs/common/ico_select_2_off.png) no-repeat center right 14px;
}
.login-select.checked{
    background-image:url(../imgs/common/ico_select_2_on.png);
}
.login-select .select-title,
.login-select .option{
    display:block;
    line-height: 42px;
    font-size: 14px;
    text-indent: 15px;
    color: #a2a2a2;
}
.login-select .select-con{
    position:absolute;
    overflow:auto;
    display:none;
    left:0;
    top:42px;
    width:100%;
    background:#fff;
    max-height:125px;
    z-index:10;
}
.no-data {
    padding:20px 0 10px 0;
    text-align:center;
    font-family: kopl;
    font-size: 16px;
    color: #2669f2;
    line-height: 130%
}
/* loading */
.loading {
    position:fixed;
    display:none;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(255,255,255,0.7);
    z-index: 1300;
}
.loading-in {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 32px;
    height: 32px;
    margin: -16px 0 0 -16px;
    background: url(../imgs/common/loading_icon.png) no-repeat center center;
    background-size: 25px 30px;
    animation: rotate-loading 1.5s infinite normal;
    transform-origin: 50% 50%;
}
@keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-moz-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-webkit-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
@-o-keyframes rotate-loading {
    0%  {transform: rotate(0deg);-ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -moz-transform: rotate(0deg);}
    100% {transform: rotate(360deg);-ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg);}
}
.link-text-1 {
    font-size: 14px;
    color: #696868;
    letter-spacing: -0.025em;
    line-height: 130%;
    text-decoration: underline;
    cursor:pointer;
}
/* 회원탈퇴 */
.box-s1 {
    max-width: 540px;
    margin: 0 auto;
    margin-bottom: 30px;    
    border-radius: 4px;
}
.member-withdraw {
    width: 92%;
    margin: 0 auto;
    padding-top: 30px;
}
.login-h2 {
    margin-bottom:25px;
    font-size:16px;
    font-weight: bold;
    letter-spacing: -0.05em;
    color: #696868;
    line-height: 110%;
}
.p02, .p03 {
    margin-bottom: 18px;
    font-size: 14px;
    color: #696868;
    letter-spacing: -0.025em;
    line-height: 130%;
}
.p05 {
    margin-bottom: 40px;
    font-size: 14px;
    color: #999;
    letter-spacing: -0.025em;
    line-height: 130%;
}
/* auto search */
.auto-search-box {
    position: relative;
}
.auto-search-box input[type='text']{
    position:relative;
    z-index:11;
}
.auto-search-box .auto-search-con{
    display:none;
    overflow-x:hidden;
    overflow-y:scroll;
    -webkit-overflow-scrolling: touch;
    position:absolute;
    left:0;
    top:40px;
    width:100%;
    max-height:180px;
    padding:23px 7.7%;
    box-sizing:border-box;
    border-style:solid;
    border-color:#e1e1e1;
    border-width:0 1px 1px 1px;
    background:#fff;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    z-index:10;
}
.auto-search-box .auto-search-con li{    
    position:relative;
    overflow:hidden;
    margin-bottom:20px;
    font-size:14px;
    color:#a2a2a2;
    line-height:140%
}
.auto-search-box .as-ticker{
    overflow:hidden;
    display:inline-block;
    position:absolute;
    left:0;
    top:0;
    width:66px;
}
.auto-search-box .as-ico-ticker{
    display:inline-block;
    padding:0 7px;
    color:#fff;
    background:#c1c1c1;
    border-radius:4px;
    font-family:kopl;
    vertical-align:middle;
}
.auto-search-box .as-text{
    display:block;
    box-sizing:border-box;
    overflow: hidden;
    width:100%;
    padding-left:66px;
    font-family:kopl;
    color:#a2a2a2;
    vertical-align:middle;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
}
/* table  */
table {
    width: 100%;
    table-layout: fixed;
}
table th,
table td{
    vertical-align:middle;
}
.table-1 thead th{
    font-size:12px;
    font-weight:normal;
    color:#161616;
    padding:14px 0;
    border-bottom:1px solid #e6e6e6;
}
.table-1 tbody td{
    padding:11px 0;
    font-size:14px;
    font-weight:lighter;
    color:#191919;
}
.table-1 tbody .tr-top td{
    font-weight:bold;
}
.table-1 thead th.text-left,
.table-1 tbody td.text-left{
    padding-left:5px;
}
.table-1 thead th.text-right,
.table-1 tbody td.text-right{
    padding-right:5px;
}
.table-1 thead th.first,
.table-1 tbody td.first{
    padding-left:28px;
}
.table-1 thead th.last,
.table-1 tbody td.last{
    padding-right:28px;
}
.table-5 {
    border-top: 1px solid #f2f2f2;
}
.table-5 tbody th,
.table-5 tbody td{    
    padding:17px 0 17px 20px;
    border-bottom:1px solid #f2f2f2;
    font-family:kopl;
    font-size:14px;
    color:#252525;
    letter-spacing:-0.025em;
}
.table-5 tbody th{
    background:#f6f9ff;
    font-weight:normal;
    text-align:left;
}
.table-5 tbody th.text-center,
.table-5 tbody td.text-center{
    text-align:center;
    padding-left:0;
    padding-right:0;
}
/* table size */
.table-w-1-1{
    width:35%;
}
.table-w-1-2{
    width:23%;
}
.table-w-1-3{
    width:20%;
}
.table-w-1-4{
    width:22%;
}
/* popup */
.pop {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
}
.pop-bg{
    width:100%;
    height:100%;
    background-color:rgba(0, 0, 0,0.25);
}
.pop-bg.type-2{
    background-color:rgba(0, 0, 0,0.4);
}
.pop-in {
    position: absolute;
    overflow: auto;
    left: 5%;
    top: 5%;
    width: 90%;
    max-height: 90%;
    background: #fff;
    border-radius: 6px;
}
.pop-header{
    box-sizing:border-box;
    padding:26px 0 15px 0;
}
.pop-header p{
    font-size:18px;
    letter-spacing:-0.025em;
    color:#112e56;
    text-align:center;
}
.pop-close-btn{
    position:absolute;
    display:block;
    right:5%;
    top:5%;
    margin:22px 22px 0 0;
    width:12px;
    height:12px;
    background:url(../imgs/common/pop_close_btn.png) no-repeat center center;
    z-index:1010
}
.pop .pop-content {
    color: #112e56;
    font-size: 14px;
    font-weight: lighter;
    line-height: 130%;
}
.pop .pop-section-in{
    padding:0 8%;
}
.pop .p-1 {
    margin-bottom: 25px;
    font-size: 16px;
    line-height:130%;
}
.pop .p-2 {
    margin-bottom: 30px;
    font-size: 14px;
}
.pop .ul-1{
    max-height:310px;
    overflow:auto;
    padding:0 7% 15px 7%;
}
.pop .ul-1 li{
    margin-bottom:16px;
}
.pop .text-1 {
    display:inline-block;
    width: 50%;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
    vertical-align:middle;
}
.pop .text-2 {
    float: right;
    display: inline-block;
    vertical-align: middle;
    color: #a2a2a2;
}
.pop .pop-btn-bot {
    display:block;
    box-sizing:border-box;
    width:100%;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    letter-spacing: -0.025em;
    color: #112e56;
    background: #f5f7f8;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    outline:0;
    margin:0;
}
.pop .pop-btn-bot-l,
.pop .pop-btn-bot-r {
    float:left;
    box-sizing:border-box;
    display:inline-block;
    width: 50%;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    letter-spacing: -0.025em;
    color: #112e56;
    background: #f5f7f8;
}
.pop .pop-btn-bot-l {
    border-bottom-left-radius: 6px;
    border-right: 1px solid #ebebeb;
}
.pop .pop-btn-bot-r {
    border-bottom-right-radius: 6px;
}
.btn-box.btn-box-1 {
    background: #1428a0;
}
.pop .pop-btn-bot.bg-1,
.pop .pop-btn-bot-l.bg-1,
.pop .pop-btn-bot-r.bg-1 {
    background: #646469;
    color: #fff;
    border-color: #646469;
}
.pop .pop-btn-bot.bg-2,
.pop .pop-btn-bot-l.bg-2,
.pop .pop-btn-bot-r.bg-2 {
    background: #1428a0;
    color: #fff;
}
.pop .pop-dia-section {
    padding: 0 6%;
}
.pop .pop-dia-h3{
    margin-bottom:10px;
}
.pop .pop-dia-h3,
.pop .pop-dia-text {
    font-size: 16px;
    color: #112e56;
    font-weight: lighter;
    line-height: 150%;
}
.ico-quadrilateral {
    display: inline-block;
    box-sizing: border-box;
    width: 10px;
    height: 10px;
    margin-right: 3px;
    border: 1px solid #314a6d;
}
.pop .pop-dia-text {
    margin-bottom: 32px;
}
.pop .pt {
    font-size: 16px;
    line-height: 130%;
    padding: 0 2%;
    text-indent: -6px;
    margin-left: 10px;
}
.pop .pt-end {
    margin-bottom: 25px;
    font-size: 16px;
    line-height: 130%;
    padding: 0 2%;
    text-indent: -6px;
    margin-left: 10px;
}
.pt .line, 
.pt-end .line {
    padding-left: 6px;
    font-size: 12px;
    color: #474747;
    line-height: 130%;
    background: url(../imgs/common/ico_point_2.png) no-repeat left 5px;
}
/* content */
.section-in {
    padding: 0 5%;
}
.section-ad{
    margin-bottom:20px;
}
.section-a {

}
.section-a gg-ad{
    height:60px;
}
.section-a .newsy-ad{
    display:none;
}
.section-a .newsy-ad a {
    display: block !important;
}
.section-a .newsy-ad img{
    width:100%;
    vertical-align:middle;
}
/* content header */
.content-header {
    min-height:72px;
    background: #003e9b;
    color:#fff;
}
.content-header-in{
    padding:100px 5% 25px 5%
}
.content-header .ticker-box {
    margin-bottom: 9px;
}
.content-header .ico-ticker {
    display: inline-block;
    line-height:20px;
    padding: 0 9px;
    background: #fff;
    color: #001063;
    border-radius:4px;
    font-size:12px;
    letter-spacing:-0.01em;
}
.content-header .ch-clear {
    position:relative;
    clear: both;
    overflow: hidden;
    margin-bottom:30px;
}
.content-header .ch-l,
.content-header .ch-r{
    float:left;
    width:50%;
}
.content-header .ch-r{
    text-align:right;
}
.content-header .ch-name {
    margin-bottom: 5px;
    font-family: kopl;
    font-size: 24px;
    line-height:110%;
}
.content-header .ch-price .ch-num {
    font-family: kopb;
    font-size: 34px;
}
.content-header .ch-price .ch-usd {
    font-family: kopb;
    font-size: 16px;
}
.content-header .ch-price .ch-sub {
    margin-left:10px;
    font-family: kopl;
    font-size: 16px;
}
.content-header .ch-dibs {
    display:inline-block;
    width:22px;
    height:22px;
    background-image: url('../imgs/common/ico_dibs_off.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:20px 20px;
}
.content-header .ch-divs-box {
    margin-bottom:17px;
}
.content-header .ch-dibs.checked {
    background-image: url('../imgs/common/ico_dibs_on.png');
    background-size: 20px 20px;
}
.content-header .ch-num,
.content-header .ch-per {
    font-family: kopb;
    font-size: 14px;
}
.content-header .ch-per{
    margin-left:25px;
}
.content-header .ch-power{
    margin-bottom:25px;
}
.content-header .ch-h5 {
    margin-bottom: 6px;
    font-family: kopl;
    font-size: 11px;
    letter-spacing: -0.01em;
}
.content-header .ch-section {
    clear:both;
    overflow:hidden;
    margin-bottom:25px;
}
.content-header .ch-section-in {
    display: inline-block;
    overflow: hidden;
    line-height: 30px;
    height: 30px;
    padding: 0 13px;
    background: #fff;
    border-radius: 6px;
}
.content-header .ch-section-l,
.content-header .ch-section-r{
    display: inline-block;
    width: 50%;
    float: left;
}
.content-header .ch-section-in li{
    display:inline-block;
    vertical-align:middle;
}
.content-header .ch-section-in .li-1 {
    margin-right: 6px;
    font-size: 12px;
    color: #314565;
    letter-spacing: -0.025em;
}
.content-header .ch-section-in .li-1-2{
    margin-right:2px;
    font-size:11px;
    color:#858585;
}
.content-header .ch-section-in .li-2 {
    margin-right:14px;
    font-size:17px;
    font-weight:bold;
    color: #314565;
}
.content-header .ch-section-in .li-3 {
    min-width:70px;
    margin-right:10px;
    font-size:11px;
    color: #858585;
}
.content-header .ch-section-in .li-3 .span-1{
    margin-right:9px;
}
.content-header .ch-section-in .li-3 .span-2{
    font-size:10px;
}
.content-header .ch-section-in .li-4 .ico-question {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    margin-bottom:3px;
    overflow: hidden;
    background: #003e9b url(../imgs/main/ico_question.png) no-repeat center center;
    vertical-align: middle;
}
.content-header .ch-power-ul{
    overflow:hidden;
}
.content-header .ch-power-ul li {
    float: left;
    display: inline-block;
    padding-right: 12px;
    margin-right: 12px;
    font-size:14px;
    background: url(../imgs/common/content_header_bar.png) no-repeat right center;
}
.content-header .ch-power-ul li:last-child{
    margin-right:0;
    padding-right:0;
    background:none;
}
.content-header .ch-text-1 {
    font-family: kopl;
    font-size: 14px;
    letter-spacing: -0.01em;
}
.content-header .ch-date {
    position: absolute;
    right: 0;
    bottom: 0;
    text-align: right;
    font-family: kopl;
    font-size: 14px;
    line-height:120%;
}
.content-header.type-1 {
    background-image: url(../imgs/common/content_header_bg.png);
    background-size: 100% auto;
    background-repeat: no-repeat;
}
/* 실시간 뉴스 */
.section-news {
    position: relative;
}
.content-header.type-2 .ch-clear {
    margin-bottom: 0;
}
.content-header.type-2 {
    background-image: url('../imgs/common/content_header_bg_2.png');
    background-size: 100% auto;
    background-repeat: no-repeat;
}
.news-item {
    overflow: hidden;
    padding: 30px 5% 0 5%;
    border-bottom: 1px solid #e6e6e6;
}
.news-item .news-top{
    margin-bottom:30px;
}
.news-item .news-title{
    margin-bottom:15px;
    font-size:16px;
    letter-spacing:-0.01em;
    color:#112e56;
    line-height:120%;
}
.news-item .news-attr{
    overflow:hidden;
}
.news-item .news-attr li{
    display:inline-block;
    float:left;
    margin-right:16px;
    font-family: kopl;
    font-size:14px;
    letter-spacing:-0.01em;
    color:#636363;
}
.news-item .news-attr .li-2{
    background:url(../imgs/sub/ico_bar_1.png) no-repeat right center;
    padding-right:17px;
}
.news-item .news-con{
    margin-bottom:30px;
}
.news-item .news-con .p-1{
    margin-bottom:30px;
    font-size:16px;
    letter-spacing:-0.01em;
    color:#272727;
    line-height:120%;
}
.news-item .news-con .p-1-1{
    display:block;
    margin-bottom:20px;
}
.news-item .news-con .ul-1 li{
    line-height:130%;  
    margin-bottom:10px;
    /* background:url(../imgs/main/news_dot.png) no-repeat left 7px;*/
    font-size:14px;
    color:#272727;
    letter-spacing:-0.01em;
}
.news-item .p-translation{
    display:none;
}
.section-news.no-pay {
    overflow:hidden;
}
.section-news.no-pay .news-item{
    filter: blur(2px);
}
.section-news .market-now-box {
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    display: none;
}
.section-news.no-pay .market-now-box {
    display: block;
}
/* 관심종목 폴더 */
.att-table {
    position: relative;
}
.att-table .att-thead{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    overflow:hidden;
    background:#fff;
    z-index:1100;
}
.att-table .att-tbody{
    overflow:hidden;
    width:100%;
    padding:30px 0 30px 0;
}
.att-table .att-tr{
    position:relative;
    width:100%;
    transition:background-color 0.6s;
}
.att-table .att-tbody .att-tr.on,
.att-table .att-tbody .att-tr.on .att-tr-in{
    background: #f6f9ff;
}
.att-table .att-tbody .att-tr{
    height:65px;
}
.att-table .att-tr-in{
    position:absolute;
    box-sizing:border-box;
    overflow:hidden;
    left:0;
    top:0;
    height:100%;
    width:100%;
    padding-top:16px;
    z-index:9;
    background:#fff;
    transition:background-color 0.6s;
}
.att-table .att-th,
.att-table .att-td{
    display:inline-block;
    box-sizing:border-box;
}
.att-table .att-th{
    font-size:16px;
    letter-spacing:-0.01em;
    color:#161616;
}
.att-table .att-th-l,
.att-table .att-td-l{
    float:left;
    width:64%;
    padding-left:11%;
}
.att-table .att-th-r,
.att-table .att-td-r{
    float:right;
    width:35%;
    padding-right:8%;
    text-align:right;
}
.att-table .att-td-r {
    padding-top:6px;
    font-family: kopb;
    font-size: 18px;
}
.att-table .p-1{
    margin-bottom:5px;
    font-size:16px;
    font-family:kopl;
    color:#2669f2;
    line-height:110%;
}
.att-table .p-2{
    font-family:kopl;
    font-size:16px;
    color:#191919;
    line-height:110%;
}
.sort-handle{
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:48px;
    background:url(../imgs/sub/ico_sort.png) no-repeat center center;
    z-index:20;
}
.btn-modify,
.btn-del {
    position: absolute;
    top: 0;
    height: 100%;
    width: 65px;
    font-size: 14px;
    color: #fff;
    line-height: 65px;
    letter-spacing: -0.01em;
    text-align: center;
}
.btn-modify {
    right: 65px;
    background: #cfdfff;
}
.btn-del {
    right:0;
    background: #ff4444;
}
/* 관심종목 파일 */
.content-header.type-3 {
    margin-bottom: 25px;
    background-image: url('../imgs/common/content_header_bg_2.png');
    background-size: 100% auto;
    background-repeat: no-repeat;
}
.content-header.type-3 .ch-clear {
    margin-bottom: 0;
}
.section-att-file .att-table .att-th-l,
.section-att-file .att-table .att-td-l {
    width: 52%;
    padding-left: 11%;
}

.section-att-file .att-table .att-th-r,
.section-att-file .att-table .att-td-r {
    width: 47%;
    padding-right: 8%;
}

.section-att-file .ico-wearther {
    display: inline-block;
    width: 24px;
    height: 18px;
    vertical-align:middle;
}
.section-att-file .ico-wearther.num-20{
    background:url(../imgs/main/ico_weather_20.png) no-repeat center center;
    background-size:auto 100%;
}
.section-att-file .ico-wearther.num-40{
    background:url(../imgs/main/ico_weather_40.png) no-repeat center center;
    background-size:auto 100%;
}
.section-att-file .ico-wearther.num-60{
    background:url(../imgs/main/ico_weather_60.png) no-repeat center center;
    background-size:auto 100%;
}
.section-att-file .ico-wearther.num-80{
    background:url(../imgs/main/ico_weather_80.png) no-repeat center center;
    background-size:auto 100%;
}
.section-att-file .ico-wearther.num-100{
    background:url(../imgs/main/ico_weather_100.png) no-repeat center center;
    background-size:auto 100%;
}
.section-att-file .att-table .att-td-r {
    padding-top:0;
}
.section-att-file .att-td-r-text-1 {
    display: block;
    margin-bottom:8px;
    font-size: 16px;
}
.section-att-file .att-td-r-text-2 {
    font-family: kopl;
    font-size: 14px;
    color: #636363;
}
/* 체크 업다운 팝업 */
.pop-check{
    margin-bottom:15px;
}
.pop-check li {
    text-align: center;
    line-height: 300%;
}
.check-radio {
    display: inline-block;
    padding: 0 20px;
    font-family: kopl;
    font-size: 16px;
    color: #112e56;
}
.check-radio.checked{
    color:#2669f2;
    background:url(../imgs/common/radio_1_on.png) no-repeat center right;
} 
/* 체크 업다운 */
.section-check-top {
    position:fixed;
    left:0;
    top:72px;
    width:100%;
    overflow: hidden;
    background:#fff;
    border-bottom: 1px solid #e6e6e6;
    z-index:90;
}
.section-check-top li{
    display:inline-block;
    float:left;
    width:33.33%;
    line-height:50px;
    text-align:center;
}
.section-check-top .btn-check{
    display:inline-block;
    font-size:16px;
    letter-spacing:-0.01em;
    color:#112e56;
    padding-right:18px;
    background:url(../imgs/common/radio_2_off.png) no-repeat center right;
}
.section-check-top .btn-check.disabled {
    background: none;
    color: #cecece;
}
.updown-text-1 {
    font-size: 16px;
    line-height: 120%;
    letter-spacing: -0.025em;
    text-align: center;
    color: #112e56;
}
.updown-box{
    overflow:hidden;
    padding-top:50px;
}
.updown-box-in {
    position: relative;
    box-sizing: border-box;
    height: 465px;
    padding-top: 30px;
}
.updown-item {
    position: absolute;
    left: 0;
    top: 15px;
    width:100%;
}
.updown-item-in {
    box-sizing: border-box;
    width: 85%;
    min-height: 425px;
    margin: 0 auto;
    border: 1px solid #e8e8e8;
    background: #fff;
}
.updown-item:nth-child(1) {
    top:30px;
}
.updown-item:nth-child(2) {
    left: 90%;
}
.updown-item:nth-child(3) {
    left: 180%;
}
.updown-item:nth-child(4) {
    left: 270%;
}
.updown-item:nth-child(5) {
    left: 360%;
}
.table-2 {
    padding:20px 20px 0 20px;
}
.table-w-2-1{
    width:63%;
}
.table-w-2-2 {
    width: 37%;
}
.table-2 table{
    table-layout:fixed;
}
.table-2 thead th{
    vertical-align:baseline;
    padding-bottom:20px;
}
.table-2 thead .th-1 {
    font-family: kopb;
    font-size: 20px;
    line-height:110%;
    text-align:left;
    color: #112e56;
}
.table-2 thead .th-1 .sub{
    font-size:14px;
}
.table-2 thead .th-2 {
    font-family: kopl;
    font-size: 12px;
    text-align: right;
    color: #636363;
    letter-spacing:-0.05em;
}
.table-2 tbody td{
    height:70px;
}
.updown-item .ico-count {
    display: inline-block;
    padding: 4px 9px;
    background: #1346af;
    font-family: kopl;
    font-size: 12px;
    color: #fff;
    border-radius:4px;
}
.updown-item .text-ticker,
.updown-item .text-name {    
    font-family: kopl;
    font-size: 14px;
    line-height: 100%;
    vertical-align: middle;
}
.updown-item .text-ticker {
    display: inline-block;
    color: #2669f2;
    border-right: 1px solid #2669f2;
    padding-right: 9px;
    margin-right: 8px;
}
.updown-item .text-name {
    color: #191919;
}
.updown-item .text-usd,
.updown-item .text-per {
    text-align: right;
    font-family: kopl;
    font-size: 14px;
    line-height:170%;
}
.updown-item .text-usd {
    color: #636363;
}
/* 로그인 */
.section-login {
    padding: 0 11% 10px 11%;
}
.section-login h3{
    padding:0 10px;
}
.section-login .p-1{
    padding:0 10px;
    margin-bottom:40px;
    font-size:16px;
    letter-spacing:-0.01em;
    color:#66738d;
    line-height:150%;
}
.section-login .p-2{
    font-size:14px;
    color:#66738d;
    line-height:130%;
}
.section-login .p-3{
    margin-bottom:5px;
    font-family: kopl;
    font-size:12px;
    color:#66738d;
    letter-spacing:-0.01em;
    line-height:130%;
}
/* 이용약관 동의 */
.terms-box {
    overflow: auto;
    box-sizing: border-box;
    height: 170px;
    margin-bottom: 14px;
    border: 1px solid #e8e8e8;
    padding: 14px 11px;
    border-radius: 6px;
}
.document-style h4 {
    margin-bottom:18px;
    font-size: 14px;
    color: #66738d;
    font-weight:normal;
    letter-spacing:-0.01em;
}
.document-style p, 
.document-style li, 
.document-style dt, 
.document-style dd, 
.document-style a {
    font-size: 14px;
    color: #999;
    letter-spacing: -0.01em;
    line-height: 130%;
}
.document-style p {
    font-family: kopl;
    margin-bottom: 18px;
}
.document-style ul{
    margin-bottom:18px;
}
.document-style li li {
    padding-left: 36px;
    text-indent: -18px;
}
.document-box-style {
    display:block;
    border:1px solid #b2b2b2;
    padding:18px;
    text-indent:0;
}
.document-box-style .li{
    display:block;
    margin-bottom:10px;
    text-indent:-18px;
    padding-left:36px;
}
.document-box-style .p01{
    display:block;
    margin-bottom:10px;
}
.terms-box.type-2{
    overflow:hidden;
    height:80px;
}
.document-style.type-2{
    padding:30px 5%;
}
.document-style.type-2 h4 {
    font-size: 18px;
}
.document-style.type-2 p,
.document-style.type-2 li,
.document-style.type-2 dt,
.document-style.type-2 dd,
.document-style.type-2 a {
    font-size: 16px;
}
.document-style.type-2 p,
.document-style.type-2 ul{
    padding-left:17px;
}
.document-style.type-2 li{
    padding-left:19px;
    text-indent:-19px;
}
.document-style.type-2 ul ul{
    margin-left:-24px;
}
.document-style.type-2 li li{
    text-indent:-19px;
    padding-left:19px;
}
.document-style.type-2 ul p{
    padding-left:0;
    text-indent:0;
}
.document-style.type-3 p,
.document-style.type-3 ul {
    padding: 0 5%;
    margin-bottom: 20px;
}
.document-style.type-3 p,
.document-style.type-3 li {
    font-family: kopl;
    font-size:16px;
    color: #66738d;
}
.document-style.type-3 p.under-line{
    padding-bottom:20px;
    border-bottom:1px solid #e6e6e6;
}
.document-style.type-3 .ul-1 li {
    text-indent: -18px;
    padding-left: 19px;
}
/* 아이디 찾기 */
.table-3 {
    overflow:hidden;
    margin-bottom: 10px;
    border: 1px solid #e8e8e8;
    border-radius:8px;
}
.table-3 tbody th,
.table-3 tbody td{
    padding:7px 0 7px 20px;
    font-size:16px;
    color:#191919;
}
.table-3 tbody th{
    background:#f6f9ff;
    text-align:left;
}
.table-3 tbody td{
    font-family: kopl;
    padding-left:28px;   
}
.table-3 .top th,
.table-3 .top td{
    padding-top:22px;
}
.table-3 .bot th,
.table-3 .bot td{
    padding-bottom:22px;
}
.point{
    display:inline-block;
    padding-left:10px;
    text-indent:0;
    background:url(../imgs/common/ico_point_2.png) no-repeat left center;
}
/* 시황 */
.section-setting{
    padding-top:72px;
}
.section-setting.type-2{
    padding-top:102px;
}
.market-top {
    margin-bottom: 30px;
}
.market-date {
    position: relative;
    overflow: hidden;
    padding: 10px 0;
    margin-bottom:18px;
    border-bottom: 1px solid #e6e6e6;
}
.market-date .fl,
.market-date .fr{
    width:50%;
    float:left;
}
.market-date p{
    text-align:center;
    font-family: kopl;
    line-height:130%;
}
.market-date input{
    text-align:center;
    font-family: kopl;
    line-height:130%;
}
.market-date .p-1{
    font-size:14px;
    color:#002c57;
}
.market-date .fl .p-2{
    font-size:12px;
    color:#a2a2a2;
}
.market-date .fr .p-2{
    font-size:12px;
    color:#4ea9ff;
}
.market-date .ico-arr{
    position:absolute;
    left:50%;
    top:0;
    width:8px;
    height:100%;
    margin-left:-4px;
    background:url(../imgs/common/ico_arr.png) no-repeat center center;
}
.market-search{
    position:relative;
    width:90%;
    margin:0 auto;
}
.market-search .market-search-btn{
    position:absolute;
    display:inline-block;
    right:10px;
    top:0;
    width:16px;
    height:100%;
    background: url(../imgs/common/ico_search.png) no-repeat center center;
    background-size: 15px 15px;
}
.market-list-item {
    padding: 0 5% 20px 5%;
    margin-bottom: 20px;
    border-bottom: 1px solid #e6e6e6;
}
.market-list-item .p-1{
    height:50px;
    overflow:hidden;
    font-size:16px;
    letter-spacing:-0.01em;
    line-height:130%;
    color:#112e56;
}
.market-list-item .market-list-case{
    display:inline-block;
    min-width:45px;
    margin-right:5px;
    padding-top:1px;
    text-align:center;
    border-radius:4px;
    font-size:12px;
    color:#fff;
    line-height:17px;
    vertical-align:middle;
}
.market-list-item .mlc-1{
    background:#ff4444;
}
.market-list-item .mlc-2{
    background:#2669f2;
}
.market-list-item .mlc-3{
    background:#4a6994;
}
.market-list-item .ul-1{
    overflow:hidden;
}
.market-list-item .ul-1 li{
    display:inline-block;
    float:left;
    margin-right:14px;
    font-family: kopl;
    font-size:14px;
    letter-spacing:-0.01em;
    color:#636363;
}
.market-list-con {
    display:none;
    padding-top:20px;
    line-height: 130%;
    font-size: 16px;
    letter-spacing: -0.01em;
    color: #272727;   
}
.market-list-con img{
    max-width:100%;
}
.market-list-con p,
.market-list-con ul{
    margin-bottom:10px;
}
.ui-datepicker {
    font-size:1.5em;
}
.market-now-box{
    position:relative;
    overflow:hidden;
    display:none;
}
.market-now-box-mask{
    position:absolute;
    height:100%;
    width:100%;
    left:0;
    top:0;
}
.market-now-box-mask-bg{
    position:relative;
    display:block;
    width:100%;
    height:100%;
    background:#fff;
    opacity:0.75;
    z-index:5;
}
.market-now-box-mask-in{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    text-align:center;
    z-index:5;
}
.market-now-box-p {
    padding-top:30px;
    margin-bottom: 22px;
    font-family: kopb;
    font-size: 16px;
    color: #2588ff;
}
.market-now-box .market-list-item {
    filter: blur(2px);
}
.market-now-box.disabled{
    display:block;
}
/* 설정 메인*/
.section-setting .p-2 {
    font-size: 14px;
    color: #66738d;
    line-height: 130%;
}
.section-setting .p-3 {
    margin-bottom: 5px;
    font-family: kopl;
    font-size: 12px;
    color: #66738d;
    letter-spacing: -0.01em;
    line-height: 130%;
}
.section-setting-in{
    padding:0 10%;
}
.setting-list{
    margin-bottom:80px;
}
.setting-list li {
    padding: 0 5%;
    border-bottom: 1px solid #e6e6e6;
}
.setting-list li a {
    display: block;
    line-height: 64px;
    font-size: 16px;
    color: #112e56;
    letter-spacing: -0.01em;
    background:url(../imgs/common/ico_arr_2.png) no-repeat right center;
}
.setting-text-1 {
    font-family: kopl;
    font-size: 12px;
    color: #66738d;
    letter-spacing: -0.01em;
    line-height: 130%;
}
.setting-text-2 {
    padding:0 5%;
    margin-bottom:40px;
    font-family: kopl;
    font-size: 16px;
    color: #66738d;
    letter-spacing:-0.01em;
    line-height:150%;
}
/* 알림설정 */
.setting-text-3 {
    margin-bottom: 18px;
    font-size: 16px;
    color: #112e56;
    line-height: 110%;
    letter-spacing: -0.01em;
}
.setting-notify{
    padding-left:5%;
}
.setting-notify li{
    position:relative;
    margin-bottom:28px;
    line-height:22px;
    font-family: kopl;
    font-size:16px;
    color:#66738d;
    letter-spacing:-0.01em;
}
.setting-notify .notify-check{
    position:absolute;
    right:0;
    top:0;
    height:22px;
    width:40px;
    border-radius:11px;
    transition:all .4s;
    background-color:#e0e0e0;
}
.setting-notify .notify-check-ico{
    position:absolute;
    left:2px;
    top:2px;
    height:18px;
    width:18px;
    border-radius:9px;
    transition:all .4s;
    background:#fff;
}
.setting-notify .notify-check.checked{
    background-color:#45a5ff;
}
.setting-notify .notify-check.checked .notify-check-ico{
    left:20px;
}
/* 서비스 안내*/
.tab-style {
}
.tab-style .tab-header {
    overflow: hidden;
    border-bottom: 1px solid #e6e6e6;
}
.tab-style .tab-header li {
    display:inline-block;
    float:left;
    width:50%;
}
.tab-style .tab-header button{
    box-sizing:border-box;
    display:block;
    width:50%;
    margin:0 auto;
    height:50px;
    line-height:48px;
    font-family: kopl;
    text-align:center;
    font-size:16px;
    color:#112e56;
    letter-spacing:-0.01em;
}
.tab-style .tab-header .on button{    
    font-family: kopb;
    border-bottom:2px solid #002c57;
}
.tab-style .tab-container{
    padding:30px 5%;
}
.tab-content {
    display: none;
    position: relative;
    overflow-x: hidden;
}
.tab-content:first-child{
    display:block;
}
.setting-text-4 {
    margin-bottom: 30px;
    font-family: kopl;
    font-size: 16px;
    color: #112e56;
    line-height: 150%;
    letter-spacing: -0.01em;
}
.h5 {
    font-family: kopb;
    font-size: 16px;
    color: #112e56;
    letter-spacing: -0.01em;
    line-height: 150%;
    padding-left: 14px;
    background: url(../imgs/common/ico_point_2.png) no-repeat 5px center;
}
.table-4{
    width:100%;
    overflow:auto;
    margin-bottom:10px;
    border-style:solid;
    border-color:#dcdcdc;
    border-width:2px 0 1px 0;
}
.table-4 table{
    min-width:760px;
    width:100%;
}
.table-4 th,
.table-4 td{
    padding:7px 0;
    border-bottom:1px solid #dcdcdc;
    font-size:14px;
    line-height:130%;
    letter-spacing:-0.025em;
    text-align:center;
}
.table-4 th{
    background:#f5f7f9;
}
/* intro */
.intro-wrap {
    position: absolute;
    background: #f3f5f5;
    height:100%;
    width:100%;
}
.intro-close{
    position:absolute;
    top:35px;
    right:5%;
    font-size:18px;
    line-height:110%;
    letter-spacing:-0.01em;
    color:#444;
    z-index:10;
}
.intro-con{
    position:relative;
    overflow:hidden;
    width:100%;
    height:100%;
}
.intro-con-in{
    position:absolute;
    left:0;
    top:0;
    height:100%;
    width:500%;
}
.intro-con-item {
    display: inline-block;
    float: left;
    width: 20%;
    height:100%;
}
.intro-con-item.ici-1{
    background:url(../imgs/sub/intro_img_1.png) no-repeat center 80px;
}
.intro-con-item.ici-2{
    background:url(../imgs/sub/intro_img_2.png) no-repeat center 80px;
}
.intro-con-item.ici-3{
    background:url(../imgs/sub/intro_img_3.png) no-repeat center 80px;
}
.intro-con-item.ici-4{
    background:url(../imgs/sub/intro_img_4.png) no-repeat center 80px;
}
.intro-con-item.ici-5{
    background:url(../imgs/sub/intro_img_5.png) no-repeat center 80px;
}
.intro-ios .intro-con-item.ici-1{
    background:url(../imgs/sub/intro_ios_img_1.png) no-repeat center 80px;
}
.intro-ios .intro-con-item.ici-2{
    background:url(../imgs/sub/intro_ios_img_2.png) no-repeat center 80px;
}
.intro-ios .intro-con-item.ici-3{
    background:url(../imgs/sub/intro_ios_img_3.png) no-repeat center 80px;
}
.intro-ios .intro-con-item.ici-4{
    background:url(../imgs/sub/intro_ios_img_4.png) no-repeat center 80px;
}
.intro-ios .intro-con-item.ici-5{
    background:url(../imgs/sub/intro_ios_img_5.png) no-repeat center 80px;
}
.intro-bot {
    overflow: hidden;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 40px 0 30px 0;
    background: #fff;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    text-align: center;
}
.intro-bot-in{
    position:relative;
    width:500%;
    min-height:114px;
}
.intro-bot-item{
    display:inline-block;
    float:left;
    width:20%;
}
.intro-bot-item .p-1{
    margin-bottom:20px;
    font-size:24px;
    line-height:110%;
    letter-spacing:-0.01em;
    color:#444;
}
.intro-bot-item .p-2 {
    font-family: kopl;
    font-size: 16px;
    line-height: 130%;
    letter-spacing: -0.01em;
    color: #66738d;
}
.intro-bot-in-2{
    position:relative;
    height:43px;
}
.intro-bot-in-2 .intro-bot-btn{
    display:inline-block;
    transition:all .4s;
    width:6px;
    height:6px;
    border-radius:3px;
    background:#dfe2e7;
    vertical-align:middle;
    margin:0 3px;
}
.intro-bot-in-2 .intro-bot-btn.on{
    width:8px;
    height:8px;
    border-radius:4px;
    background:#8499af;
}
/* 구독 */
.bg-color-1 {
    background: #f3f5f7;
}
.section-subscription {
    padding-top: 72px;
}
.tab-subscription .tab-header {
    background:#1346af;
    overflow:hidden;
    padding-bottom:30px;
}
.tab-subscription .tab-header li{
    width:50%;
    display:inline-block;
    float:left;
    text-align:center;
    border-bottom:1px solid #8099ce;
}
.tab-subscription .tab-header li span{
    box-sizing:border-box;
    display:inline-block;
    height:50px;
    padding:15px 13px 0 13px;
    font-family: kopb;
    font-size:16px;
    color:#8099ce;
    letter-spacing:-0.01em;
}
.tab-subscription .tab-header li.on span{
    border-bottom:2px solid #fff;
    color:#fff;
}
.my-page-card-box.type-2 {
    height: 260px;
}
.my-page-card-box-in {
    position: absolute;
    left: 0;
    top: 20px;
    width: 100%;
    height: 100%;
}
.my-page-card {
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
}
.my-page-card-add .my-page-card-in {
    background: none;
    border-style: dashed;
    border: 1px dashed #7baaff;
}
.my-page-card-in {
    box-sizing: border-box;
    position: relative;
    width: 83%;
    height: 185px;
    padding: 68px 15px 0 15px;
    margin: 0 auto;
    background: #fff url(../imgs/sub/subscription_bg.png) no-repeat center center;
    background-size: cover;
    border: 1px solid #e9eaec;
    border-radius: 10px;
    overflow: hidden;
}
.my-page-card-box .subscription-title {
    position: absolute;
    left: 5%;
    top: 20px;
}
.my-page-card-box.type-2 .my-page-card-box-in {
    top: 48px;
}
.sdi-span-1 {
    display: inline-block;
    position: absolute;
    overflow: hidden;
    right: 15px;
    top: 15px;
    padding: 0 8px;
    line-height: 26px;
    font-family: kopb;
    font-size: 12px;
    color: #fff;
    letter-spacing: -0.01em;
    border-radius: 4px;
    background: #3c85ff;
}
.sdi-ul{
    overflow:hidden;
}
.sdi-ul li{
    display:inline-block;
    float:left;
    font-family: kopb;
    font-size:14px;
    letter-spacing:-0.01em;
    color:#3c85ff;
}
.sdi-ul .sdi-ul-l{
    float:left;
    width:60%;
}
.sdi-ul .sdi-ul-r{
    float:right;
    width:39%;
}
.p-3-sub {
    font-family: kopl;
    font-size: 10px;
    color: #878787;
    letter-spacing: -0.01em;
}
.subscription-box{
    padding:0 5%;
    background:#fff;
}
.subscription-top{
    padding-top:20px;
    padding-bottom:20px;
}
.subscription-tab-header{
    overflow:hidden;
    clear:both;
    margin-bottom:20px;
}
.subscription-tab-header-btn{
    position:relative;
    box-sizing:border-box;
    display:inline-block;
    float:left;
    width:48%;
    border-style:solid;
    border-color:#e2e2e2;
    border-width:1px;
    border-radius:6px;
    min-height:125px;
}

.subscription-tab-header-btn.sth-btn-r {
    float: right;
}
.subscription-tab-header-btn.sth-btn-l .subscription-tab-header-btn-in{
    background: url(../imgs/sub/ico_payment_month_off.png) no-repeat;
    background-position:center 23px;
}
.subscription-tab-header-btn.sth-btn-r .subscription-tab-header-btn-in{
    background: url(../imgs/sub/ico_payment_one_off.png) no-repeat;
    background-position:center 23px;
}
.subscription-tab-header-btn-in {
    padding-top:57px;
}
.subscription-tab-header-btn .sth-ico-q {
    position:absolute;
    right:10px;
    top:10px;
    display: inline-block;
    width: 12px;
    height: 12px;
    background: url(../imgs/common/ico_point.png) no-repeat center center;
    background-size: cover;
}
.subscription-tab-header-btn .sth-p-1 {
    margin-bottom:3px;
    text-align: center;
    font-size:16px;
    font-weight:bold;
    letter-spacing:-0.01em;
    color: #afafaf;
}
.subscription-tab-header-btn .sth-p-2 {
    margin-bottom: 3px;
    text-align: center;
    font-size: 12px;
    font-weight:300;
    letter-spacing: -0.01em;
    line-height:130%;
    color: #878787;
}
.subscription-tab-header-btn.on,
.subscription-tab-header-btn:hover {
    border-color: #3c85ff;
}
.subscription-tab-header-btn.sth-btn-l.on .subscription-tab-header-btn-in,
.subscription-tab-header-btn.sth-btn-l:hover .subscription-tab-header-btn-in{
    background: url(../imgs/sub/ico_payment_month_on.png) no-repeat;
    background-position:center 23px;
}
.subscription-tab-header-btn.sth-btn-r.on .subscription-tab-header-btn-in,
.subscription-tab-header-btn.sth-btn-r:hover .subscription-tab-header-btn-in {
    background: url(../imgs/sub/ico_payment_one_on.png) no-repeat;
    background-position: center 23px;
}
.subscription-tab-header-btn.on .sth-p-1,
.subscription-tab-header-btn:hover .sth-p-1 {
    color: #112e56;
}
.btn-point-box{
    text-align:center;
    margin-bottom:25px;
}
.btn-point {
    display: inline-block;
    padding-right: 20px;
    background: url(../imgs/common/ico_point.png) no-repeat right center;
    background-size: 12px 12px;
    font-family: kopl;
    font-size: 14px;
    color: #636363;
    letter-spacing: -0.01em;
}
.btn-point-box .btn-point{
    margin:0 10px;
}
.subscription-title {
    margin-bottom: 10px;
    font-size: 16px;
    font-weight: bold;
    color: #66738d;
    letter-spacing: -0.01em;
}
.subscription-box-3{
    padding-bottom:30px;
    margin-bottom:10px;
}
.sb3-box{
    overflow:hidden;
}
.sb3-box .sb3-li{
    float:left;
    box-sizing:border-box;
    display:inline-block;
    width:25%;
}
.sb3-box .sb3-li-in {
    display: block;
    text-align: center;
    border: 1px solid #e2e2e2;
    line-height:38px;
    font-size:14px;
    font-weight:bold;
    color:#112e56;
    letter-spacing:-0.01em;
}
.sb3-box .sb3-li-first .sb3-li-in{
    border-top-left-radius:4px;
    border-bottom-left-radius:4px;
}
.sb3-box .sb3-li-last .sb3-li-in{
    border-top-right-radius:4px;
    border-bottom-right-radius:4px;
}
.sb3-box .sb3-li.on .sb3-li-in,
.sb3-box .sb3-li:hover .sb3-li-in{
    border-color:#3c85ff;
}
.sb4-box .sb4-li{
    line-height:58px;
    overflow:hidden;
}
.sb4-box .sb4-li-1 {
    font-size: 14px;
    font-weight: 300;
    letter-spacing: -0.01em;
    color: #66738d;
    border-bottom: 1px solid #eaeaea;
}
.sb4-box .sb4-li-1-l,
.sb4-box .sb4-li-2-l {
    float: left;
    width: 65%;
}
.sb4-box .sb4-li-1-r,
.sb4-box .sb4-li-2-r {
    float: right;
    text-align: right;
    width: 34%;
}
.sb4-box .sb4-li-2 {
    color: #ff4444;
    font-weight:bold;
}
.sb4-box .sb4-li-2-l{
    font-size:14px;
    letter-spacing:-0.025em;
}
.sb4-box .sb4-li-2-r-1 {
    font-size: 20px;
    letter-spacing: -0.01em;
}
.sb4-box .sb4-li-2-r-2 {
    font-size: 14px;
    letter-spacing: -0.01em;
}
.subscription-box-2 {
    box-sizing: border-box;
    padding-top:20px;
    padding-bottom:20px;
    margin-bottom: 30px;
}
.subscription-box-2 .p-1{
    padding:0 8px 20px 8px;
    margin-bottom:22px;
    font-family: kopl;
    font-size:14px;
    color:#66738d;
    line-height:160%;
    letter-spacing:-0.01em;
    border-bottom:1px solid #eaeaea;
}
.subscription-box-2 .p-1 .span-1,
.subscription-box-2 .p-1 .span-2{
    display:block;
    font-size:12px;
    line-height:140%;
}
.subscription-box-2 .p-1 .span-1{
    margin-bottom:10px;
}
.subscription-box-2 .p-1 .span-2{
}
.sib-bot {
    overflow: hidden;
    padding: 0 8px;
}
.sib-bot .first,
.sib-bot .last{
    float:left;
    display:inline-block;
}
.sib-bot .first{
    width:80%;
}
.sib-bot .last{
    width:20%;
    text-align:right;
}

.sib-bot .line{
    width:100%;
    clear:both;
    padding-top:20px;
}
.sib-data-line {
    overflow: hidden;
    padding: 20px 8px;
    border-bottom: 1px solid #eaeaea;
}
.sib-data-line li{
    display:inline-block;
    float:left;
    vertical-align:middle;
    font-family: kopl;
    font-size:14px;
    color:#66738d;
    letter-spacing:-0.01em;
}
.sib-data-line .li-1{
    line-height:20px;

}
.sib-data-line .li-1,
.sib-data-line .li-4{
    width:28%;
}
.sib-data-line .li-2{
    width:50%;
}
.sib-data-line .li-3{
    float:right;
    width:21%;
}
.sib-data-line .li-5{
    float:left;
    width:71%;
}
.sib-data-line .li-2,
.sib-data-line .li-3,
.sib-data-line .li-5{
    text-align:right;
}
.sib-data-line.line-last{
    border-bottom:none;
    margin-bottom:0;
    padding-bottom:0;
}
.sib-data-line.line-last li{
    color:#ff4444;
} 
.sib-data-line.line-last .li-4{
    font-family:kopb;
}
.sib-data-line.line-last .em-1{
    font-family:kopb;
    font-size:20px;
}
input.sib-input[type="text"],
input.sib-input[type="password"],
input.sib-input[type="number"],
input.sib-input[type="tel"],
input.sib-input[type="email"] {
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    border: none;
    outline: none;
    text-align: right;
    width: 100%;
    color: #66738d;
}
input.sib-input[type="text"]::placeholder,
input.sib-input[type="password"]::placeholder,
input.sib-input[type="number"]::placeholder,
input.sib-input[type="tel"]::placeholder,
input.sib-input[type="email"]::placeholder{
    color: #bebebe;
}
.sib-text-box{
    padding-top:15px;
    text-align:right;
}
.stb-text-1 {
    font-family: kopl;
    font-size:12px;
   letter-spacing:-0.01em;
}
/* 마이페이지 */
.my-page-top {
    min-height: 180px;
    border-bottom: 1px solid #e6e6e6;
    background: #f8f8f8 url(../imgs/sub/mypage_bg_1.png) no-repeat left top;
}
.my-page-img-box {
    padding: 28px 0 19px 0;
}
.my-page-img-box-in {
    position: relative;
    height: 60px;
    width: 60px;
    margin: 0 auto;
}
.my-page-img{
    overflow:hidden;
    width:100%;
    height:100%;
    border-radius:50%;
}
.my-page-ico-plus{
    position:absolute;
    display:none;
    right:5px;
    top:0;
    width:12px;
    height:12px;
    background:url(../imgs/sub/mypage_ico_plus.png) no-repeat center center;
    z-index:1;
}
.my-page-top .p-1 {
    margin-bottom:6px;
    font-size: 18px;
    line-height: 110%;
    letter-spacing: -0.01em;
    color: #444;
    text-align:center;
}
.my-page-top .p-2 {
    font-family: kopl;
    font-size: 14px;
    line-height: 110%;
    letter-spacing: -0.01em;
    color: #66738d;
    text-align: center;
}
.my-page-data-1 {
    overflow: hidden;
    border-bottom: 1px solid #e9eaec;
}
.my-page-data-1 .fl,
.my-page-data-1 .fr{
    box-sizing:border-box;
    width:50%;
    height:70px;
    padding-top:17px;
    text-align:center;
}
.my-page-data-1 .fl{
    border-right:1px solid #e6e6e6;
}
.my-page-data-1 .p-1{
    margin-bottom:2px;
    font-size:14px;
    color:#444;
    letter-spacing:-0.01em;
    line-height:110%;
}
.my-page-data-1 .p-2{
    font-family: kopl;
    font-size:14px;
    color:#66738d;
    letter-spacing:-0.01em;
    line-height:110%;
}
.my-page-ico{
    display:inline-block;
    padding-left:16px;
}
.my-page-ico-1{
    background:url(../imgs/sub/mypage_ico_1.png) no-repeat left top;
}
.my-page-ico-2 {
    background: url(../imgs/sub/mypage_ico_2.png) no-repeat left 2px;
}
.my-page-ico-3 {
    background: url(../imgs/sub/mypage_ico_3.png) no-repeat left 2px;
}
.my-page-card-box {
    position:relative;
    overflow:hidden;
    height:232px;
    background: #f3f5f7;
}

.my-page-card .no-card {
    padding-top:20px;
    text-align: center;
    font-size: 14px;
    color: #66738d;
    letter-spacing: -0.01em;
}
.my-page-card .p-1 {
    font-family: kopb;
    font-size: 16px;
    color: #112e56;
}
.my-page-card .p-2 {
    font-family: kopb;
    font-size: 14px;
    color: #3c80fd;
}
.my-page-card .card-add-text-1,
.my-page-card .card-add-text-2 {
    font-weight:300;
    letter-spacing:-0.01rem;
    line-height:130%;
    text-align:center;
}
.my-page-card .card-add-text-1 {
    padding-top:28px;
    margin-bottom:30px;
    font-size: 14px;
    color: #66738d;
    background:url(../imgs/sub/ico_card_add.png) no-repeat center top;
}
.my-page-card .card-add-text-2 {
    font-size: 12px;
    color: #727272;
}
.my-page-card-btn-box{
    position:absolute;
    left:0;
    bottom:10px;
    width:100%;
    text-align:center;
}
.my-page-card-arr-l,
.my-page-card-arr-r{
    position:absolute;
    top:0;
    height:100%;
    width:14px;
}
.my-page-card-arr-l {
    left: 3%;
    background: url(../imgs/sub/ico_arrow_l.png) no-repeat center center;
}
.my-page-card-arr-r {
    right: 3%;
    background: url(../imgs/sub/ico_arrow_r.png) no-repeat center center;
}
.mpc-btn {
    display: inline-block;
    overflow: hidden;
    width: 6px;
    height: 6px;
    border-radius: 3px;
    margin: 0 2px;
    background: #cecece;
    transition: all 0.4s;
}
.mpc-btn.on{
    background:#7baaff;
}
.my-page-link-box {
}
.my-page-link-box li {
    border-bottom: 1px solid #e6e6e6;
}
.my-page-link-box .mpl-btn {
    display: block;
    padding: 23px 30px 23px 20px;
    line-height: 110%;
    font-size: 16px;
    letter-spacing: -0.01em;
    color:#112e56;
    cursor:pointer;
    background:url(../imgs/sub/mypage_ico_arr_on.png) no-repeat right 20px center;
}
.my-page-link-box .disabled .mpl-btn {
    color: #dedede;
    cursor: default;
    background: url(../imgs/sub/mypage_ico_arr_off.png) no-repeat right 20px center;
}
/* 해지 */
.refund-top {
    padding: 38px 0 50px 0;
    background: #f6f9ff;
    text-align:center;
}
.refund-top-text-1 {
    padding-top: 60px;
    margin-bottom:42px;
    background: url(../imgs/sub/refund_ico_1.png) no-repeat center top;
    font-family: kopl;
    font-size: 18px;
    color: #294ac1;
    letter-spacing: -0.01em;
    line-height: 130%;
}
.refund-top-img-box{
    text-align:center;
}
.refund-top-img-box img{
    max-width:100%;
}
.refund-bot{
    padding:40px 0 20px 0;
    text-align:center;
}
.refund-bot .refund-bot-text{
    margin-bottom:20px;
    font-family: kopl;
    font-size:16px;
    color:#66738d;
    letter-spacing:-0.01em;
    line-height:130%;
}
.refund-btn-box .refund-btn-1,
.refund-btn-box .refund-btn-2 {
    width: 80%;
    margin: 0 auto;
    margin-bottom: 15px;
    line-height: 48px;
    border-radius: 6px;
    cursor: pointer;
    font-family: kopl;
    font-size: 16px;
    letter-spacing: -0.01em;
    text-align: center;
}
.refund-btn-box .refund-btn-1 {
    background: #3c80fd;
    color: #fff;
}
.refund-btn-box .refund-btn-2 {
    background: #f4f4f4;
    color: #66738d;
}
.refund-btn-box .refund-btn-text {
    margin-top: 80px;
    font-family: kopl;
    font-size: 14px;
    letter-spacing: -0.01em;
    color: #66738d;
    line-height: 120%;
}
/* 포트폴리오 */

.tab-portfolio .tab-header-1 {
    overflow:hidden;
    padding-bottom:30px;
    background:#fff;
}
.tab-portfolio .tab-header-1 li{
    width:50%;
    display:inline-block;
    float:left;
    text-align:center;
    border-bottom:1px solid #f3f3f3;
}
.tab-portfolio .tab-header-1 .tab-btn{
    box-sizing:border-box;
    display:inline-block;
    height:50px;
    padding:15px 13px 0 13px;
    font-family: kopl;
    font-size:16px;
    color:#112e56;    
    letter-spacing:-0.01em;
}
.tab-portfolio .tab-header-1 .tab-btn.on{
    border-bottom:2px solid #002c57;
    font-family: kopb;
    color:#112e56;
}
.portfolio-text-1 {
    margin-bottom:28px;
    font-family: kopl;
    font-size: 16px;
    color: #112e56;
    letter-spacing: -0.01em;
    line-height:150%;
}

.portfolio-text-3 {
    padding-right: 3%;
    text-align: right;
    font-size: 12px;
    color: #112e56;
    margin-bottom: 10px;
}
.portfolio-graph {
    overflow: auto;
    min-height: 140px;
    margin-bottom: 45px;
}
.tab-portfolio .tab-container{
    background:#fff;
}
.portfolio-tab-2{
    overflow:hidden;
    text-align:center;
    margin-bottom:10px;
}
.portfolio-tab-2 .pt2-item{
    box-sizing:border-box;    
    overflow:hidden;
    display:inline-block;
    width:26%;
    height:117px;
    border:1px solid #f2f2f2;
    border-radius:6px;
    margin-bottom:20px;
}
.portfolio-tab-2 .pt2-item:nth-child(3n+2){
    margin-left: 5%;
    margin-right: 5%;
}
.portfolio-tab-2 .pt2-item-2{
    margin:0 5%;
}
.portfolio-tab-2 .pt2-item-4,
.portfolio-tab-2 .pt2-item-5{
    margin:0 5%;
}
.portfolio-tab-2 .pt2i-top{
    box-sizing:border-box;
    height:48px;
    padding-top:8px;
    background:#f8f8f8;
    font-family: kopl;
    color:#b9b9b9;   
}
.portfolio-tab-2 .pt2i-top .p-1{
    margin-bottom:6px;
    font-size:14px;
    letter-spacing:-0.01em;
}
.portfolio-tab-2 .pt2i-top .p-2{
    font-size:12px;
    letter-spacing:-0.01em;
}
.portfolio-tab-2 .pt2i-bot{
    padding-top:14px;
    font-family: kopl;
    color:#b9b9b9;
}
.portfolio-tab-2 .pt2i-bot .p-1{
    margin-bottom:3px;
    font-size:14px;
    letter-spacing:-0.01em;
}
.portfolio-tab-2 .pt2i-bot .p-2{
    font-size:20px;
    letter-spacing:-0.01em;
}
.portfolio-tab-2 .pt2i-bot .p-2.color-1,
.portfolio-tab-2 .pt2i-bot .p-2.color-2{
    color:#b9b9b9 !important;
}
.portfolio-tab-2 .on .pt2i-bot .p-2.color-1{
    color:#ff4444 !important;
}
.portfolio-tab-2 .on .pt2i-bot .p-2.color-2{
    color:#2669f2 !important;
}
.portfolio-tab-2 .pt2-item.on{
    border-color:#214970;
}
.portfolio-tab-2 .pt2-item.on .pt2i-top{
    background: #214970;
    color:#fff;
}
.portfolio-tab-2 .pt2-item.on .pt2i-bot{
    color:#272727;
}
.portfolio-tab-2 .pt2-item.on .pt2i-bot .p-2{
    font-family: kopb;
}
.portfolio-tab-3 .tab-header {
    background: #f6f9ff;
    overflow:hidden;
}
.portfolio-tab-3 .tab-header li{
    display:inline-block;
    width:25%;
    float:left;
    text-align:center;
}
.portfolio-tab-3 .tab-header .tab-btn{
    display:block;
    cursor:pointer;
    font-family: kopl;
    font-size:14px;
    color:#9b9b9b;
    line-height:50px;

}
.portfolio-tab-3 .tab-header .tab-btn.on{
    font-family: kopb;
    color:#2669f2;
}
.portfolio-tab-3.length3 .tab-header li {
    width:33.33%;
}
.portfolio-text-2 {
    overflow: hidden;
    padding: 25px 5%;
    font-family: kopl;
    font-size: 16px;
    color: #112e56;
    letter-spacing: -0.01em;
    line-height: 130%;
}
.portfolio-text-2 .pt2-em{
    display:inline-block;
    float:left;
    width:34%;
    padding-top:2px;
    font-family: kopb;
    font-size:18px;
    letter-spacing:-0.01em;
}
.pt2-r{
    float:right;
    width:66%;
    display:inline-block;
}
.pdi-con{
    display:none;
}
.portfolio-div-item .pdi-header {
    position: relative;
    overflow: hidden;
    padding: 13px 5%;
    line-height: 22px;
    border-bottom: 1px solid #f2f2f2;
}
.portfolio-div-item .pdi-header span{
    vertical-align:middle;
}
.portfolio-div-item .pdi-ticker {
    display: inline-block;
    min-width: 56px;
    margin-right:5px;
    font-family: kopb;
    font-size: 14px;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    background: #2669f2;
}
.portfolio-div-item .pdi-text {
    display:inline-block;
    font-family: kopb;
    font-size: 14px;
    color: #191919;
    max-width:50%;
}
.portfolio-div-item .pdi-r {
    float: right;
    margin-right: 8%;
    font-family: kopb;
    font-size: 16px;
}
.portfolio-div-item .pdi-ico {
    position: absolute;
    display: inline-block;
    height: 100%;
    right: 5%;
    top: 0;
    width: 12px;
    background: url(../imgs/sub/portfolio_ico_arr.png) no-repeat center center;
    transition: all ease 0.4s;
}
.portfolio-div-item .pdi-header.on .pdi-ico {
    transform: rotate( 180deg );
}
.portfolio-div-2{
    padding-top:15px;
}
.portfolio-div-item-2 {
    margin-bottom: 15px;
}
.portfolio-div-item-2 .pdi2-top {
    position: relative;
    overflow: hidden;
    padding: 13px 5%;
    line-height: 22px;
}
.portfolio-div-item-2 .pdi2-top span{
    vertical-align:middle;
}
.portfolio-div-item-2 .pdi2-ticker {
    display: inline-block;
    min-width: 62px;
    margin-right: 5px;
    font-family: kopb;
    font-size: 14px;
    color: #fff;
    text-align: center;
    border-radius: 4px;
    background: #ff4444;
}
.portfolio-div-item-2 .pdi2-ticker.down {
    display:none;
    background: #2669f2;
}
.portfolio-div-item-2.up .pdi2-ticker.down,
.portfolio-div-item-2.down .pdi2-ticker.up {
    display: none;
}
.portfolio-div-item-2.down .pdi2-ticker.down{
    display:inline-block;
}
.portfolio-div-item-2 .pdi2-text {
    display: inline-block;
    font-family: kopb;
    font-size: 14px;
    color: #191919;
    max-width: 50%;
}
.portfolio-div-item-2 .pdi2t-1 {
    display: inline-block;
    padding-right: 10px;
    margin-right: 6px;
    background: url(../imgs/sub/portfolio_ico_bar.png) no-repeat right center;
    color: #2669f2;
}
.portfolio-div-item-2 .pdi2-r {
    display:none;
    float: right;
    font-family: kopb;
    font-size: 16px;
}
.portfolio-div-item-2.down .pdi2-r {
    display: block;
}
.portfolio-div-item-2 .table-5 tbody th {
    background: #fff1f1;
}
.portfolio-div-item-2.down .table-5 tbody th {
    background: #edf3ff;
}
/* 구독 / 결제내역 */
.breakdown-div {
    overflow:hidden;
    background: #f3f5f7;
}
.breakdown-item {
    padding: 20px 5% 23px 5%;
    margin-bottom: 10px;
    background: #fff;
}
.breakdown-item .breakdown-item-in{
    position:relative;
    padding-left:22%;
}
.breakdown-item .breakdown-bot{
    clear:both;
    padding-top:20px;
}
.breakdown-item .breakdown-ticker{
    position:absolute;
    overflow:hidden;
    display:inline-block;
    left:0;
    top:0;
    font-size:14px;
    color:#fff;
    letter-spacing:-0.01em;
    line-height:22px;
    min-width:46px;
    padding:0 5px;
    text-align:center;
    background:#2669f2;
    border-radius:4px;
}
.breakdown-item .p-1{
    font-family: kopb;
    font-size:16px;
    color:#112e56;
    letter-spacing:-0.01em;
    line-height:22px;
}
.breakdown-item .ul-1 li{
    font-size:14px;
    color:#b0b0b0;
    letter-spacing:-0.01em;
    line-height:140%;
}
.breakdown-item.disabled .breakdown-ticker{
    background:#c3c3c3;
}
/* 체험하기 */
.exp-portfolio-box {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    min-height: 160px;
}

.exp-portfolio-box .exp-portfolio-message {
    position: absolute;
    left: 0;
    top: 50px;
    width: 100%;
}

.exp-portfolio-box .exp-text {
    margin-bottom: 18px;
    font-size: 14px;
    color: #191919;
    font-weight: bold;
    text-align: center;
    line-height: 130%;
}

.exp-portfolio-box .exp-btn-box {
    text-align: center;
}

.exp-portfolio-box .exp-btn {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    padding: 0 28px;
    border-radius: 15px;
    background: #1346af;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    cursor: pointer;
}

/* 포트폴리오 수정 */
.tab-action .tab-container .tab-content {
    display: none;
}
.tab-action .tab-container .tab-content.on {
    display: block;
}
.portfolio-box-1 {
    position:relative;
    box-sizing: border-box;
    padding: 20px 5% 0 5%;
    height:300px;
    font-size: 26px;
    font-weight: bold;
    color: #2A466B;
    line-height: 140%;
    letter-spacing: -0.01em;
    background:url(../imgs/main/portfolio_img_1.png) no-repeat right bottom 25px;
}
.select-style-1 {
    height: 44px;
    border-width: 0 0 3px 0;
    border-style: solid;
    border-color: #2669F2;
    border-radius: 0;
    outline: 0;
    font-size: 24px;
    font-weight: 900;
    color: #2669F2;
    text-indent: 5px;
    vertical-align: middle;
    letter-spacing: -0.025em;
    background-color: #fff;
}
.portfolio-slide {
    width: 85%;
    margin: 0 auto;
    margin-bottom:35px;
}
.portfolio-slide-item {
    position:relative;
    float: left;
    width: 100%;
    background: #FFFFFF;
    box-shadow: 0px 0px 11px 1px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}
.portfolio-slide .slick-list {
    overflow: visible;
}
.portfolio-slide .slick-slide {
    margin: 0 10px;
}
.portfolio-slide .psi-title-box {
    position:absolute;
    top: -33px;
    left: 50%;
    width: 92px;
    height: 92px;
    margin-left: -46px;
    letter-spacing: -0.01em;
    text-align: center;
}
.portfolio-slide .psi-title {
    box-sizing:border-box;
    overflow:hidden;
    width: 100%;
    height: 100%;
    padding:24px 5px 15px 5px;
    font-size: 23px;
    color: #fff;
    font-weight: bold;
    letter-spacing: -0.01em;
    line-height:110%;
    text-align: center;
    border-radius: 33px;
}
.portfolio-slide .psi-title-in{
    overflow:hidden;
    max-height:100%;
}
.portfolio-slide .psi-title-num {
    box-sizing:border-box;
    position:absolute;
    right:-9px;
    bottom:3px;
    width:32px;
    height:44px;
    padding-top:20px;
    font-size: 16px;
    font-weight: 900;
    color: #fff;
    letter-spacing: -0.01em;
    text-align: center;
    background: url(../imgs/main/portfolio_icn_medal_1.png) no-repeat center center;
}
.portfolio-slide .psi-title-num-2 {
    background: url(../imgs/main/portfolio_icn_medal_2.png) no-repeat center center;
}
.portfolio-slide .psi-title-num-3 {
    background: url(../imgs/main/portfolio_icn_medal_3.png) no-repeat center center;
}
.portfolio-slide-item .psi-top{
    padding:78px 0 20px 0;
    border-bottom:1px solid #eaeaea;
}
.portfolio-slide-item .psi-top-1 {
    overflow: hidden;
    margin-bottom: 15px;
}
.portfolio-slide-item .psi-top-1 li{
    float:left;
    display:inline-block;
    width:33.33%;
    text-align:center;
}
.portfolio-slide-item .psit1-text-1,
.portfolio-slide-item .psit1-text-2{
    display:block;
}
.portfolio-slide-item .psit1-text-1 {
    margin-bottom:3px;
    font-size: 12px;
    color: #112E56;
}
.portfolio-slide-item .psit1-text-2{
    font-size:18px;
    font-weight:bold;
}
.portfolio-slide-item .psi-top-2 {
    padding: 0 4%;
    height:38px;
    font-size: 16px;
    line-height: 120%;
    color: #959595;
    text-align: center;
    display: -webkit-box;
    overflow: hidden;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.portfolio-slide-item .psi-bot {
    overflow:hidden;
    padding:15px 7%;
    margin:0 auto;
    font-size: 20px;
    line-height:130%;
    height:78px;
    letter-spacing:-0.04em;
    color: #112E56;
}
.bsib-text-1 {
    background: url(../imgs/main/portfolio_text_deco.png) repeat-x left bottom;
}
.portfolio-box-2 {
    width: 85%;
    margin: 0 auto;
    clear: both;
}
.portfolio-box-2 .portfolio-box-2-top {
    overflow: hidden;
    margin-bottom:13px;
}
.portfolio-box-2 .pb2t-l {
    float:left;
    display:inline-block;
    width:65%;
    font-size: 20px;
    line-height: 135%;
    color: #112E56;
    letter-spacing: -0.04em;
}
.portfolio-box-2 .pb2t-l-text-1{
    display:inline-block;
    max-width:70%;
    vertical-align:middle;
}
.portfolio-box-2 .pb2t-r {
    float: right;
    display: inline-block;
    width: 33%;
    padding-top:3px;
    font-size: 22px;
    font-weight: bold;
    color: #f83838;
    text-align: right;
}
.portfolio-box-2 .pb2-text-1{
    margin-bottom:60px;
    font-size:14px;
    line-height:120%;
    letter-spacing:-0.01em;
    color:#959595;
}
.graph-bar {
    margin: 0 5%;
    margin-bottom:50px;
}
.graph-bar-in {
    height:180px;
    background: url(../imgs/main/bar_graph_bg.png) repeat-x top;
}
.graph-bar-item {
    position: relative;
    float: left;
    width: 25%;
    height: 130px;
}
.graph-bar-block {
    position: relative;
    height:100%;
}
.graph-bar-block-in {
    overflow:visible;
    position: absolute;
    height: 0;
    width: 100%;
    bottom: 0;
    left: 0;
}
.graph-bar-block-bg {
    position: absolute;
    bottom: 0;
    left: 50%;
    height: 100%;
    width: 10px;
    margin-left: -5px;
    background: #e5e5e5;
    border-radius: 5px 5px 0 0;
}
.graph-bar .graph-bar-item:first-child .graph-bar-block-bg {
    background: #5b91fe;
}
.graph-bar-vol {
    display:none;
    box-sizing:border-box;
    position: absolute;
    top: -29px;
    left: 50%;
    padding-top:5px;
    overflow:hidden;
    width: 37px;
    height: 24px;
    margin-left: -18px;
    font-size: 12px;
    letter-spacing: -0.01em;
    color: #fff;
    background: url(../imgs/main/bar_graph_icn_1_off.png) no-repeat center center;
    text-align: center;
}
.graph-bar-item.on .graph-bar-vol {
    background: url(../imgs/main/bar_graph_icn_1_on.png) no-repeat center center;
}
.graph-bar-label {
    position:absolute;
    box-sizing:border-box;
    top:139px;
    left:0;
    width:100%;
    padding:0 2%;
    font-size: 14px;
    color: #5B91FE;
    letter-spacing: -0.01em;
    text-align: center;
    overflow: hidden;
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.graph-bar.reverse{
    margin-bottom:22px;
}
.graph-bar.reverse .graph-bar-in {
    height: 161px;
    background: url(../imgs/main/bar_graph_bg.png) repeat-x top;
}
.graph-bar.reverse .graph-bar-block-in {
    top: 0;
    bottom: auto;
}
.graph-bar.reverse .graph-bar-block-bg {
    top: 0;
    bottom: auto;
    border-radius: 0 0 5px 5px;
}
.graph-bar.reverse .graph-bar-vol {
    bottom: -29px;
    top:auto;
    padding-top:8px;
    background: url(../imgs/main/bar_graph_icn_2_off.png) no-repeat center center;
}
.graph-bar.reverse .graph-bar-item.on .graph-bar-vol {
    background: url(../imgs/main/bar_graph_icn_2_on.png) no-repeat center center;
}
.graph-bar.reverse .graph-bar-label {
    bottom:138px;
    top:auto;
    padding: 0 2%;
}
/* 포트폴리오 상세 팝업 */
.pop-detail-portfolio {
    position: fixed;
    display: none;
    box-sizing: border-box;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 3.2rem 0 0 0;
    z-index: 110;
}
.pop-detail-portfolio-bg {
    position:absolute;
    left:0;
    top:0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.2);
    z-index:110;
}
.pop-detail-portfolio-container {
    position: relative;
    box-sizing: border-box;
    overflow-y: hidden;
    height: 100%;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    background: #fff;
    z-index:120;
}
.pop-detail-portfolio-content {
    box-sizing: border-box;
    overflow-y: auto;
    height: 100%;
    padding: 0 0 60px 0;
}
.pop-detail-portfolio-header {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height:50px;
    line-height:50px;
    padding:0 4%;
    background:#fff;
    z-index: 10;
}
.pop-detail-portfolio-header p{
    font-size:12px;
    color:#112E56;
    font-weight:bold;
    letter-spacing:-0.01em;
}
.pop-detail-portfolio-header .sub{
    font-weight:normal;
    margin-left:5px;
}
.pop-detail-portfolio-header .pop-detail-close-btn{
    position: absolute;
    display: block;
    right: 12px;
    top: 0;
    width: 50px;
    height: 100%;
    margin:0;
    background: url(../imgs/common/btn_close_2.png) no-repeat center center;
    z-index: 1010;
    cursor:pointer;
}
.pop-detail-portfolio .pop-detail-portfolio-section {
    padding-top:60px;
}
.pop-detail-portfolio .pop-detail-portfolio-section-in {
    padding:0 4%;
}
.pop-detail-portfolio .pop-detail-portfolio-title-box {
    position: relative;
    width: 92px;
    height: 92px;
    margin: 0 auto;
    clear:both;
    margin-bottom:15px;
}
.pop-detail-portfolio .pop-detail-portfolio-title {
    box-sizing: border-box;
    width:100%;
    height:100%;
    overflow: hidden;
    padding: 22px 5px 17px 5px;
    font-size: 24px;
    color: #fff;
    font-weight: bold;
    letter-spacing: -0.01em;
    line-height: 110%;
    text-align: center;
    border-radius: 33px;
}
.psi-title-bg-1 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_1.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-2 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_2.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-3 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_3.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-4 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_4.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-5 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_5.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-6 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_6.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-7 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_7.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-8 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_8.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-9 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_9.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-10 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_10.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-11 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_11.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-12 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_12.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-13 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_13.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-14 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_14.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-15 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_15.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-16 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_16.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-17 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_17.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-18 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_18.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-19 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_19.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-20 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_110.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-21 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_21.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-22 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_22.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-23 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_23.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-24 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_24.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-25 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_25.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-26 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_26.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-27 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_27.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-28 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_28.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-29 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_29.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-30 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_210.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-31 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_31.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-32 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_32.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-33 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_33.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-34 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_34.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-35 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_35.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-36 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_36.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-37 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_37.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-38 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_38.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-39 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_39.png) no-repeat center center;
    background-size: cover;
}
.psi-title-bg-40 {
    background: url(../imgs/main/portfolio_icn/portfolio_slide_title_bg_310.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-1 {
    background: url(../imgs/main/portfolio_icn/bg_gradation1.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-2 {
    background: url(../imgs/main/portfolio_icn/bg_gradation2.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-3 {
    background: url(../imgs/main/portfolio_icn/bg_gradation3.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-4 {
    background: url(../imgs/main/portfolio_icn/bg_gradation4.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-5 {
    background: url(../imgs/main/portfolio_icn/bg_gradation5.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-6 {
    background: url(../imgs/main/portfolio_icn/bg_gradation6.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-7 {
    background: url(../imgs/main/portfolio_icn/bg_gradation7.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-8 {
    background: url(../imgs/main/portfolio_icn/bg_gradation8.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-9 {
    background: url(../imgs/main/portfolio_icn/bg_gradation9.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-10 {
    background: url(../imgs/main/portfolio_icn/bg_gradation10.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-11 {
    background: url(../imgs/main/portfolio_icn/bg_gradation11.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-12 {
    background: url(../imgs/main/portfolio_icn/bg_gradation12.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-13 {
    background: url(../imgs/main/portfolio_icn/bg_gradation13.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-14 {
    background: url(../imgs/main/portfolio_icn/bg_gradation14.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-15 {
    background: url(../imgs/main/portfolio_icn/bg_gradation15.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-16 {
    background: url(../imgs/main/portfolio_icn/bg_gradation16.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-17 {
    background: url(../imgs/main/portfolio_icn/bg_gradation17.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-18 {
    background: url(../imgs/main/portfolio_icn/bg_gradation18.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-19 {
    background: url(../imgs/main/portfolio_icn/bg_gradation19.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-20 {
    background: url(../imgs/main/portfolio_icn/bg_gradation110.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-21 {
    background: url(../imgs/main/portfolio_icn/bg_gradation21.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-22 {
    background: url(../imgs/main/portfolio_icn/bg_gradation22.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-23 {
    background: url(../imgs/main/portfolio_icn/bg_gradation23.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-24 {
    background: url(../imgs/main/portfolio_icn/bg_gradation24.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-25 {
    background: url(../imgs/main/portfolio_icn/bg_gradation25.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-26 {
    background: url(../imgs/main/portfolio_icn/bg_gradation26.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-27 {
    background: url(../imgs/main/portfolio_icn/bg_gradation27.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-28 {
    background: url(../imgs/main/portfolio_icn/bg_gradation28.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-29 {
    background: url(../imgs/main/portfolio_icn/bg_gradation29.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-30 {
    background: url(../imgs/main/portfolio_icn/bg_gradation210.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-31 {
    background: url(../imgs/main/portfolio_icn/bg_gradation31.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-32 {
    background: url(../imgs/main/portfolio_icn/bg_gradation32.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-33 {
    background: url(../imgs/main/portfolio_icn/bg_gradation33.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-34 {
    background: url(../imgs/main/portfolio_icn/bg_gradation34.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-35 {
    background: url(../imgs/main/portfolio_icn/bg_gradation35.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-36 {
    background: url(../imgs/main/portfolio_icn/bg_gradation36.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-37 {
    background: url(../imgs/main/portfolio_icn/bg_gradation37.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-38 {
    background: url(../imgs/main/portfolio_icn/bg_gradation38.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-39 {
    background: url(../imgs/main/portfolio_icn/bg_gradation39.png) no-repeat center center;
    background-size: cover;
}
.psi-color-bg-40 {
    background: url(../imgs/main/portfolio_icn/bg_gradation310.png) no-repeat center center;
    background-size: cover;
}
.portfolio-box-3 {
    position: relative;
    box-sizing: border-box;
    padding: 20px 5% 0 5%;
    height: 192px;
    background: url(../imgs/main/portfolio_img_2.png) no-repeat right bottom -35px;
}
.portfolio-box-3 .p-box{    
    box-sizing:border-box;
    position:absolute;
    width:204px;
    height:92px;
    left:6%;
    top:71px;
    padding:9px 32px 0 14px;
    font-size: 18px;
    font-weight: bold;
    color: #2a466b;
    line-height: 130%;
    letter-spacing: -0.05em;
    background:url(../imgs/main/portfolio_img_3.png) no-repeat left top;
}
.portfolio-box-4{
    padding:0 4%;
}
.pb4-btn-box-1{
    overflow:hidden;
    margin-bottom:13px;
    min-height:20px;
}
.pb4b1-left {
    display: inline-block;
    float: left;
    text-align: left;
}
.pb4b1-right {
    display: inline-block;
    float: right;
}
.pb4-btn {
    display: inline-block;
    padding-right: 16px;
    font-size: 14px;
    color: #143059;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.05em;
    background: url(../imgs/common/icn_union.png) no-repeat right center;
}
.pb4-select-style {
    display:inline-block;
    padding-right:20px;
    font-size:14px;
    font-weight:bold;
    color: #143059;
    letter-spacing:-0.05em;
    line-height:20px;
    background: url(../imgs/common/select_arr.png) no-repeat right center;
}
.pb4-item-wrap{
    margin-bottom:40px;
}
.pb4-item {
    overflow: hidden;
    padding: 16px 13px 25px 16px;
    margin-bottom: 12px;
    box-shadow: 0px 0px 11px 1px rgba(0, 0, 0, 0.05);
    border-radius: 10px;
    cursor: pointer;
}
.portfolio-box-4-top {
    position: relative;
    margin-bottom: 20px;
    line-height: 28px;
}
.pb4t-icn {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    height: 28px;
    width: 28px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    letter-spacing: 0.05em;
    text-align: center;
}
.pb4t-title {
    padding: 0 36px 0 34px;
    font-size: 22px;
    font-weight: bold;
    color: #0f2f54;
    letter-spacing: 0.05em;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}
.pb4t-check {
    box-sizing: border-box;
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
    height: 100%;
    text-align: center;
    background: url(../imgs/common/portfolio_icn_star_off.png) no-repeat center center;
    cursor: pointer;
}
.pb4t-check.checked{
    background: url(../imgs/common/portfolio_icn_star_on.png) no-repeat center center;
}
.portfolio-box-4-con {
    overflow: hidden;
    margin-bottom: 15px;
}
.portfolio-box-4-con li{
    float:left;
    display:inline-block;
    width:25%;
    text-align:center;
}
.pb4-text-1,
.pb4-text-2 {
    display: block;
}
.pb4-text-1 {
    margin-bottom: 3px;
    font-size: 12px;
    color: #112E56;
}
.pb4-text-2 {
    font-size: 18px;
    color: #959595;
    font-weight: bold;
}
.portfolio-text-no-data {
    padding:30px 0;
    font-size: 18px;
    color: #959595;
    font-weight: bold;
    text-align:center;
}
.portfolio-box-4-bot {
    padding: 0 4%;
    font-size: 16px;
    line-height: 110%;
    color: #959595;
    text-align: center;
    display: -webkit-box;
    overflow: hidden;
    word-wrap: break-word;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.pop-detail-portfolio-no-mamber{
    position:relative;
    text-align:center;
}
.pop-detail-portfolio-no-mamber-img{
    max-width:100%;
}
.pop-detail-portfolio-no-mamber-text {
    position: absolute;
    width: 100%;
    top: 80px;
    left: 0;
    font-size: 18px;
    font-weight: bold;
    color: #1346af;
    line-height: 130%;
}
/* 포트 폴리오 상세 */
.pop-detail-portfolio .pop-detail-portfolio-title-in {
    overflow: hidden;
    max-height: 100%;
}
.pop-detail-portfolio .pop-detail-portfolio-title-check {
    box-sizing: border-box;
    position: absolute;
    right: -5px;
    bottom: 0;
    width: 30px;
    height: 30px;
    text-align: center;
    background: url(../imgs/common/portfolio_icn_star_off.png) no-repeat center center;
    cursor:pointer;
}
.pop-detail-portfolio .pop-detail-portfolio-title-check.checked{
    background: url(../imgs/common/portfolio_icn_star_on.png) no-repeat center center;
}
.pop-detail-text-1 {
    margin-bottom:25px;
    font-size: 16px;
    line-height: 110%;
    letter-spacing: -0.05em;
    text-align: center;
    display: -webkit-box;
    overflow: hidden;
    word-wrap: break-word;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
}
.pdp-div-1{
    overflow:hidden;
    padding:0 3%;
    margin-bottom:20px;
}
.pdp-div-1 li{
    float:left;
    display:inline-block;
    width:25%;
}
.pdp-div-1 li .span-1,
.pdp-div-1 li .span-2{
    display:block;
    text-align:center;
}
.pdp-div-1 li .span-1{
    margin-bottom:3px;
    font-size: 12px;
    color: #112E56;
    line-height: 110%;
}
.pdp-div-1 li .span-2{
    font-size: 18px;
    color: #959595;
    font-weight:bold;
    line-height: 110%;
}
.pdp-bar-graph-wrap{
    overflow:hidden;
    margin-bottom:30px;
}
.pdp-bar-graph {
    overflow: hidden;
    height: 7px;
    margin-bottom: 6px;
    border-radius: 4px;
    background: #eaeaea;
}
.pdp-bar-graph-in {
    height:100%;
    background: #5B91fe;
    border-radius:4px;
}
.pdp-bar-graph-text{
    overflow:hidden;
}
.pdp-bar-graph-text li{
    float:left;
    display:inline-block;
    width:33.33%;
    font-size:14px;
    color:#5b91fe;
    line-height:110%;
}
.pdp-bar-graph-text .center{
    text-align:center;
}
.pdp-bar-graph-text .last{
    text-align:right;
}
.pdp-tag-wrap{
    padding:0 2% 0 7%;
    margin-bottom:40px;
}
.pdp-tag-wrap-in{
    overflow:hidden;
    height:70px;
}
.pdp-tag {
    display: inline-block;
    margin:0 7px 10px 0;
    line-height: 28px;
    padding: 0 11px;
    font-size: 13px;
    color: #112e56;
    background: #f6f9ff;
    border-radius:5px;
}
.pdp-graph-box {
    height: 155px;
    margin-bottom: 30px;
}
.pdp-text-box {
    margin-bottom:40px;
}
.pdp-text-box-title{
    margin-bottom:14px;
    font-size:20px;
    line-height:110%;
    letter-spacing:-0.04em;
}
.pdp-text-1 {
    font-size: 16px;
    color: #161616;
    line-height: 140%;
    letter-spacing: -0.05em;
}
.pdp-list{
    overflow:hidden;
    margin-bottom:22px;
}
.pdp-list li {
    overflow: hidden;
    margin-bottom: 18px;
}
.pdp-h2{
    margin-bottom:24px;
    font-size:20px;
    font-weight:bold;    
}
.pdp-guide-text {
    font-size: 12px;
    color: #112e56;
    letter-spacing: -0.04em;
    text-align: right;
}
.pdp-list .left {
    display: inline-block;
    float: left;
    font-size: 16px;
    letter-spacing: -0.05em;
}
.pdp-list .right {
    display: inline-block;
    float: right;
    text-align: right;
    font-size: 16px;
    color: #161616; 
    font-weight:bold;
    letter-spacing: -0.05em;
}
.pdp-div-2{
    min-height:170px;
}
.pdpd2-item-line {
    clear: both;
    min-height:85px;
}
.pdpd2-item{
    float:left;
    width:33.33%;
    height:75px;
    margin-bottom:10px;
}
.pdpd2-item-in {
    overflow: hidden;
    position: relative;
    width: 95%;
    padding-top:20px;
    height:55px;
    box-shadow: 0px 0px 11px -1px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    text-align: center;
}
.pdpd2-item-center .pdpd2-item-in {
    margin: 0 auto;
}
.pdpd2-item-right,
.pdpd2-item-right .pdpd2-item-in {
    float: right;
}
.pdpd2-item-in::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: #f83838;
}
.pdpd2-item .p-1 {
    margin-bottom: 2px;
    font-size: 12px;
    line-height: 110%;
}
.pdpd2-item .p-2 {
    font-size: 18px;
    font-weight: bold;
    color: #f83838; 
    line-height: 110%;
}
.pdpd2-item .pdpd2-icn-arr {
    display: inline-block;
    width: 14px;
    height: 12px;
    margin-right:2px;
    background: url(../imgs/common/pdp_icn_arr_top.png) no-repeat center bottom;
    vertical-align:middle;
}
.pdpd2-item.down .pdpd2-item-in::after {
    background: #2669f2;
}
.pdpd2-item.down .p-2 {
    color: #4e7ff4;
}
.pdpd2-item.down .pdpd2-icn-arr {
    background: url(../imgs/common/pdp_icn_arr_bot.png) no-repeat center top;
}
.pdp-div-3-top {
    margin-bottom: 10px;
    font-size: 12px;
    color: #9b9b9b;
    text-align: right;
}
.pdp-div-3{
    padding-bottom:10px;
}
.pdpd3-item {
    margin-bottom:12px;
    box-shadow: 0px 0px 11px -2px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
}
.pdpd3-header {
    position: relative;
    padding: 16px 16px 16px 16px;
    cursor: pointer;
}
.pdpd3-header-top {
    position:relative;
    overflow: hidden;
    clear: both;
    padding-right:33px;
}
.pdpd3-header .pdpd3-ticker,
.pdpd3-header .pdpd3-ticker-2,
.pdpd3-header .pdpd3-header-title,
.pdpd3-header .pdpd3-header-per {
    display: inline-block;
    line-height: 25px;
    vertical-align: middle;
}
.pdpd3-header .pdpd3-ticker {
    margin-right: 6px;
    padding: 0 9px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    background: #112e56;
    border-radius: 5px;
}
.pdpd3-header .pdpd3-ticker-2 {
    margin-right: 6px;
    min-width: 45px;
    padding: 0 3px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    background: #f83838;
    border-radius: 5px;
    text-align:center;
}
.pdpd3-header .pdpd3-ticker-bg-2 {
    background: #5b91fe;
}
.pdpd3-header .pdpd3-header-title {
    font-size: 16px;
    font-weight: bold;
    color: #0f2f54;
}
.pdpd3-header .pdpd3-header-per {
    position: absolute;
    right: 44px;
    top: 50%;
    margin-top: -12px;
    font-size: 16px;
    font-weight: 700;
}
.pdpd3-header .pdpd3-header-top::after {
    content: '';
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 12px;
    height: 100%;
    background: url(../imgs/common/pdpd3_icn_arr.png) no-repeat center center;
    transition: all 0.4s;
}
.pdpd3-header.on .pdpd3-header-top::after {
    transform: rotate( 180deg );
}
.no-action .pdpd3-header{
    cursor:default;
}
.no-action .pdpd3-header-top {
    padding-right: 0;
}
.no-action .pdpd3-header .pdpd3-header-top::after {
    display: none;
}
.pdpd3-header .pdpd3-header-bot {
    overflow: hidden;
    padding:10px 0 0 0;
}
.pdpd3-header .pdpd3hb-l,
.pdpd3-header .pdpd3hb-r {
    float: right;
    display: inline-block;
}
.pdpd3-header .pdpd3hb-l{
    float:left;
    font-size:12px;
    letter-spacing:0.05em;
}
.pdpd3-header .pdpd3hb-l .em-1{
    font-size:16px;
    letter-spacing:-0.04em;
}
.pdpd3-header .pdpd3hb-l .won{
    font-size:14px;
    letter-spacing:-0.04em;
}
.pdpd3-header .pdpd3hb-r {
    float: right;
    font-size:14px;
    letter-spacing:0.05em;
}
.pdpd3-header .pdpd3hb-r .em-1{
    font-size:16px;
    font-weight:bold;
}
.pdpd3hb-b {
    padding-top:7px;
    clear:both;
    font-size: 14px;
    color: #959595; 
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal;
    overflow: hidden;
}
.pdpd3-con {
    display: none;
    padding: 25px 26px 22px 26px;
}
.pdpd3-list {
    margin-bottom:15px;
}
.pdpd3-list ul {
    overflow:hidden;
    margin-bottom: 30px;
}
.pdpd3-list li {
    overflow: hidden;
    margin-bottom: 10px;
}
.pdpd3-list .left{
    display:inline-block;
    float:left;
    font-size:14px;
    color:#161616;
}
.pdpd3-list .right {
    display: inline-block;
    float:right;
    font-size: 14px;
    font-weight: 700;
    color: #161616;
}
.pdpd3-list .right .span-1{
    font-size:14px;
    font-weight:normal;
}
.pdpd3-list .right .won{
    font-size:12px;
    font-weight:300;
}
.portfolio-box-5 {
    position: relative;
    box-sizing: border-box;
    padding: 20px 5% 0 5%;
    height: 192px;
    background: url(../imgs/main/portfolio_img_4.png) no-repeat right top;
}
.portfolio-box-5 .p-box{    
    box-sizing:border-box;
    position:absolute;
    width:214px;
    height:94px;
    left:6%;
    top:82px;
    padding:11px 21px 0 11px;
    font-size: 18px;
    font-weight: bold;
    color: #2a466b;
    line-height: 130%;
    letter-spacing: -0.05em;
    background:url(../imgs/main/portfolio_img_5.png) no-repeat left top;
}
.portfolio-box-6 {
    position: relative;
    box-sizing: border-box;
    padding: 20px 5% 0 5%;
    height: 192px;
    background: url(../imgs/main/portfolio_img_6.png) no-repeat right bottom;
}
.portfolio-box-6 .p-box{    
    box-sizing:border-box;
    position:absolute;
    width:208px;
    height:92px;
    left:9%;
    top:74px;
    padding:9px 20px 0 14px;
    font-size: 18px;
    font-weight: bold;
    color: #2a466b;
    line-height: 130%;
    letter-spacing: -0.05em;
    background:url(../imgs/main/portfolio_img_7.png) no-repeat left top;
}
/* 관심종목 입구 */
.my-interest-wrap{
    padding-top:30px;
}
.my-interest-box {
    margin-bottom: 30px;
    text-align: center;
}
.my-interest-box img{
    max-width:100%;
}
/* 나의 포트폴리오 */
.portfolio-text-4 {
    margin-bottom:28px;
    font-size: 26px;
    font-weight: bold;
    color: #2a466b;
    letter-spacing:-0.03em;
    line-height:140%;
}
/* ---------------------------------------------------------------------------------------------------------- */