/* ***** ***** 나눔바른고딕 font ***** ***** */
@font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 400;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.ttf') format('truetype');
}

@font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 700;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.ttf') format('truetype')
}

@font-face {
	font-family: 'NanumBarunGothic';
	font-style: normal;
	font-weight: 300;
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot');
	src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot?#iefix') format('embedded-opentype'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.woff') format('woff'), url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.ttf') format('truetype');
}

/* ***** ***** html5 tag 초기화 ***** ***** */
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    color: #333;
    font-size: 16px;
    font-family: 'NanumBarunGothic', sans-serif;
    vertical-align: baseline;
    background: transparent;

    -webkit-text-size-adjust: none;
    max-height: 99999px;
    /* 버그방지 */

    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;

    /*
	-webkit-user-drag: none;
	-webkit-user-select: none;
	*/

    touch-action: manipulation;
}

body {
    line-height: 1;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

a {
    margin: 0;
    padding: 0;
    font-size: inherit;
    color: inherit;
    vertical-align: baseline;
    background: transparent;
    text-decoration: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

input,
select,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    padding: 0;
    margin: 0;
    color: #333;
    font-size: 14px;
    font-family: 'NanumBarunGothic', sans-serif;
    border: 1px solid #ddd;
    border-radius: 10px;
    background: transparent;
    vertical-align: middle;
}

input,
select,
textarea:focus {
    outline: none;
}

select::-ms-expand {
    display: none;
}

li {
    list-style: none;
}

/* ***** ***** 스킨앤빔 ***** ***** */
/* ***** 공통 ***** */
.wrap {
    position: relative;
}

/* ***** 헤더 ***** */
.headerBox {
    position: relative;
    height: 100%;
}

.headerBox h1 {
    display: flex;
    width: 184px;
    height: 38px;
    background: url(/shinebeam/img/logo.png) no-repeat 0 50% / 184px;
    font-size: 0;
    color: transparent;
    cursor: pointer;
}

.headerBox .sbList {
    position: absolute;
    right: 0;
    z-index: 10;
}

.headerBox .sbList li {
    float: left;
    width: 136px;
    height: 46px;
    line-height: 45px;
    border-radius: 25px;
    text-align: center;
    color: #fff;
    box-sizing: border-box;
    cursor: pointer;
}

.headerBox .sbList li.on {
    border: 1px solid #fff;
}

.headerBox .sbTxt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
}

.headerBox .sbTxt li:nth-child(1) {
    height: 46px;
    background: url(/shinebeam/img/mainLogo.png) no-repeat 50%;
    font-size: 0;
    color: transparent;
    margin: 0 0 30px;
}

.headerBox .sbTxt li:nth-child(2) {
    font-size: 20px;
    color: #fff;
    line-height: 32px;
}

.headerBox .sbTxt li:nth-child(2) span {
    font-size: 20px;
    color: #ffec00;
    font-weight: bold;
}

.headerBox .sbTxt li:nth-child(3) {
    font-size: 20px;
    color: #fff;
    line-height: 32px;
    margin-top: 15px;
}


/* ***** 지점 리스트 ***** */
.list {
    position: relative;
    background: #242424;
    text-align: center;
    z-index: 50;
}

.list>ul>li {
    position: relative;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
}

.list>ul>li.on {
    color: #ff110f;
}

/* ***** 지점 상세 ***** */
.select {
    background: #fff;
}

.sl .slBox {
    overflow: hidden;
}

.slBox .slInfo {
    box-sizing: border-box;
}

.slInfo .slImg {
    overflow: hidden;
    position: relative;
}

.slInfo .slImg>img {
    position: relative;
    float: left;
    width: 100%;
}

.slInfo .slImg>.op_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.slInfo .slImg>.op_bg img {
    position: absolute;
    width: auto;
    top: calc(50% - 120px);
    left: calc(50% - 44.5px);
}

.slInfo .slImg>.op_bg .op_open {
    position: absolute;
    top: calc(50%);
    left: 50%;
    transform: translate(-50%, 0);
    padding: 7px 3px 4px;
    font-size: 30px;
    border-top: 1px solid #333;
    border-bottom: 1px solid #333;
}

.slInfo .slImg>.op_bg .op_date {
    position: absolute;
    top: calc(50% + 60px);
    left: 50%;
    transform: translate(-50%, 0);
    font-size: 32px;
    line-height: 34px;
    font-weight: bold;
    text-align: center;
}

.slInfo .slImg.open {
    height: 420px;
}

.slInfo .slImg.open>div.op_bg {
    background: #f4f4f4;
    text-align: center;
    display: flex;
    height: 100%;
}

.slInfo .slImg.open>div.op_bg>div {
    align-self: center;
    margin: 0 auto;
}

.slInfo .slImg.open .op_logo img {
    float: initial;
    width: auto;
}

.slInfo .slImg.open .op_open {
    width: 300px;
    margin: 10px auto 10px;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    padding: 15px 0px 11px;
    font-size: 30px;
}

.slInfo .slImg.open .op_date {
    font-size: 55px;
    font-weight: bold;
    color: #000;
    margin-top: 20px;
}

.slInfo h1 {
    font-size: 30px;
    font-weight: 400;
    padding: 50px 0 30px;
}

.slInfo h1::after {
    content: '';
    position: absolute;
    margin: -8px 0 0 4px;
    width: 8px;
    height: 8px;
    background: #ff110f;
    border-radius: 50%;
}

.slInfo dl {
    overflow: hidden;
}

.slInfo dt,
.slInfo dd {
    float: left;
    color: #777;
    line-height: 34px;
}

.slInfo dt {
    text-align: justify;
    overflow: hidden;
    height: 34px;
}

.slInfo dt::after {
    content: '';
    display: inline-block;
}

.slInfo dd {
    letter-spacing: -.5px;
    overflow: hidden;
}

.slInfo dd::before {
    content: ':';
    padding: 0 0 0 5px;
    margin: 0 3px 0 0;
}

.slInfo dd>span {
    display: block;
    color: #999;
}

.slInfo ul {
    margin: 30px 0 15px;
    overflow: hidden;
}

.slInfo li {
    width: 202px;
    height: 55px;
    line-height: 55px;
    padding: 0 0 0 32px;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-align: center;
    font-weight: 700;
    box-sizing: border-box;
    cursor: pointer;
}

.slInfo li:nth-child(1) {
    float: left;
    background: #fff url(/shinebeam/img/i_tel.jpg) no-repeat 32px 50% / 18px;
}

.slInfo li:nth-child(2) {
    float: right;
    background: #fff url(/shinebeam/img/i_kakao.jpg) no-repeat 32px 50% / 20px;
}

.slInfo>a {
    display: block;
    height: 55px;
    line-height: 55px;
    background: #fff;
    border: 1px solid #222;
    border-radius: 5px;
    text-align: center;
    font-size: 19px;
    font-weight: 700;
}


/* ***** 지하철 ***** */
.sl {
    position: relative;
}

.sl .slBox {
    position: relative;
}

.sl .slInfo dd>span.icon {
    background-position: 0 50%;
    background-repeat: no-repeat;
    background-size: 96px;
}

.sl .slInfo dd>span.nicon {
    padding: 0;
    margin-top: 0;
}

.sl01 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s01.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl02 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s02.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl03 .slInfo dd>span:nth-child(1) {
    background: url(/shinebeam/img/subway/s03_1.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl03 .slInfo dd>span:nth-child(2) {
    background: url(/shinebeam/img/subway/s03_2.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl04 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s04.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl05 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s05.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl06 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s06.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl07 .slInfo dd>span {
    padding: 0;
    margin-top: 0;
}

.sl08 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s08.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl09 .slInfo dd>span:nth-child(1) {
    background: url(/shinebeam/img/subway/s09_1.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl09 .slInfo dd>span:nth-child(2) {
    background: url(/shinebeam/img/subway/s09_2.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl10 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s10.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl11 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s11.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl12 .slInfo dd>span {
    padding: 0;
    margin-top: 0;
}

.sl14 .slInfo dd>span {
    background: url(/shinebeam/img/subway/s14.png) 0 50% no-repeat;
    background-size: 96px;
}

.sl .slBuisness {
    overflow: hidden;
    position: absolute;
    margin: 25px 0 0;
}

.sl .slBuisness dl {
    float: left;
    width: 50%;
}

.sl .slBuisness dl dt {
    width: auto;
}

.sl .slBuisness dl dt:after {
    content: none;
}

.sl .slBuisness dl dd {
    width: auto;
    padding: 0 0 0 4px;
}

.sl .slBuisness dl dd::before {
    content: none;
}

.sl .slBuisness dl:nth-child(3) {
    width: 100%;
}

.sl .slBuisness dl dt,
.sl .slBuisness dl dd {
    height: 26px;
    line-height: 26px;
}

/* 
** SUB MAIN 팝업
**/
.introPopup {
    display: none;
    position: fixed;
    top: 85px;
    width: 450px;
    height: auto;
    z-index: 900;
    border: 1px solid #333;
    overflow: hidden;
}

.introPopup.sP1 {
    left: 30px;
    z-index: 100;
}

.introPopup .closeBox {
    float: left;
    width: 100%;
    height: 35px;
    background: #333;
    overflow: hidden;
    padding: 0 0 0 10px;
    box-sizing: border-box;
}

.introPopup .subPopup_close {
    float: right;
    width: 35px;
    height: 35px;
    background: url(/shinebeam/img/btn_popup_close.png) no-repeat 50% 50% / 16px;
    z-index: 10;
    cursor: pointer;
}

.introPopup .subPopup_todayClose {
    float: left;
    width: auto;
    line-height: 36px;
    padding: 0 10px 0 22px;
    color: #fbfbfb;
    font-size: 14px;
    font-weight: 300;
    background: url(/shinebeam/img/btn_todayClose_m.png) no-repeat 0 50% / 16px;
    cursor: pointer;
}

.introPopup>img {
    float: left;
    width: 100%;
    height: 450px;
}


/* ***** 푸터 ***** */
.footer {
    padding: 20px 30px;
    text-align: center;
}


/* ***** ***** PC ***** ***** */
@media screen and (min-width:1000px) {

    /* ***** 공통 ***** */
    .wrap {
        min-width: 1320px;
    }

    /* ***** 해외지점 ***** */
    .branch,
    .pcBranch {
        position: absolute;
        top: 67px;
        right: 143px;
        z-index: -1;
        width: 132px;
        background: #FFF;
        border-radius: 3px;
        overflow: hidden;
        opacity: 0;
        transition: opacity .2s;
    }

    .branch dt,
    .pcBranch dt {
        line-height: 44px;
        height: 44px;
        font-size: 14px;
        text-align: left;
        padding: 0 0 0 38px;
        cursor: pointer;
    }

    .branch dt.hk,
    .branch dt.hongkong,
    .pcBranch dt.hongkong,
    .pcBranch dt.hk {
        background: url(/shinebeam/img/i_hk.png?v2) no-repeat 10px 50%;
        background-size: 20px;
    }

    .branch dt.vn,
    .branch dt.vietnam,
    .pcBranch dt.vietnam,
    .pcBranch dt.vn {
        background: url(/shinebeam/img/i_vn.png?v2) no-repeat 10px 50%;
        background-size: 20px;
    }

    .branch dt:hover,
    .pcBranch dt:hover {
        background-color: #EEE;
    }

    .branch dd {
        display: none;
    }

    .pcBranch {
        top: 56px;
        right: -25px;
        box-shadow: 0 0 5px 0 rgba(19, 4, 6, 0.28);
    }

    .header.section.on .branch {
        opacity: 1;
        z-index: 1;
    }

    /* ***** 헤더 ***** */
    .header {
        height: auto;
        background: url(/shinebeam/img/main1018.jpg) no-repeat 50% 50% / cover;
    }

    .headerBox {
        width: 1160px;
        height: 490px;
        margin: 0 auto;
    }

    .headerBox h1 {
        padding: 26px 0;
    }

    .headerBox .sbList {
        top: 22px;
    }

    .headerBox .sbTxt {
        padding: 45px 0 0;
    }

    /* ***** 지점 리스트 ***** */
    .list {
        padding: 10px 0;
    }

    .list.fixed {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        z-index: 100;
    }

    .list>ul {
        position: relative;
        display: inline-block;
        width: 1050px;
        padding: 0 0 0 110px;
    }

    .list>ul>li {
        float: left;
        width: 102px;
        line-height: 66px;
        margin: 0 0 0 14px;
    }

    .list>ul>li:nth-child(1) {
        position: absolute;
        left: 0;
        width: 110px;
        text-align: left;
        margin: 0;
    }

    .list>ul>li:hover {
        color: #ff110f;
    }

    /*.list>ul>li.Exception {
        position: absolute;
        left: 0;
        bottom: 0;
        text-align: center;
        margin: 0;
    }*/

    .list .Exception.mobile {
        display: none;
    }

    .list .Exception .pcBranch {
        display: none;
    }

    .list .Exception:hover .pcBranch {
        display: block;
        opacity: 1;
        z-index: 1;
    }

    /* ***** 지점 상세 ***** */
    .select .sl {
        border-bottom: 1px solid #ddd;
    }

    .sl .slBox {
        width: 1160px;
        min-height: 587px;
        box-sizing: border-box;
        padding: 70px 0;
        margin: 0 auto;
    }

    .slBox .slInfo {
        position: relative;
        min-height: 420px;
        padding: 0 0 0 740px;
    }

    .slInfo .sltext {
        display: none;
    }

    .slInfo .slImg {
        position: absolute;
        left: 0;
        top: 0;
        width: 680px;
    }

    .slInfo dt {
        width: 55px;
    }

    .slInfo dt::after {
        width: 55px;
    }

    .slInfo dd {
        width: calc(100% - 55px);
    }

    .slInfo dd>span {
        margin: 5px 0 0 15px;
        padding: 0 0 0 106px;
    }

    .slInfo>a.openA {
        position: absolute;
        width: 420px;
        box-sizing: border-box;
        bottom: 0px;
    }

    .pad0 .slInfo h1 {
        padding: 0 0 30px;
    }
}


/* ***** ***** PAD ***** ***** */
@media screen and (max-width:999px) {

    /* ***** 공통 ***** */
    html,
    body,
    .wrap {
        height: 100%;
    }

    /* ***** 해외지점 ***** */
    .branch {
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 100;
        transform: translateY(500px);
        transition: all .3s;
        opacity: 0;
        width: 100%;
        height: 0;
        padding: 0 38px;
        background: #FFF;
        border-top: 1px solid #707070;
        overflow: hidden;
        box-sizing: border-box;
    }

    .branch::before {
        content: '해외지점';
        position: absolute;
        top: 52px;
        left: 38px;
        font-size: 40px;
        color: #555;
        letter-spacing: -.8px;
    }

    .branch dt {
        height: 50px;
        line-height: 52px;
        padding: 0 0 0 100px;
        color: #343434;
        font-size: 38px;
        font-weight: 700;
        letter-spacing: 1.6px;
        cursor: pointer;
    }

    .branch dt.hk,
    .branch dt.hongkong {
        background: url(/shinebeam/img/i_hk.png?v2) no-repeat 24px 50%;
        background-size: 50px;
        margin: 80px 0 0;
    }

    .branch dt.vn,
    .branch dt.vietnam {
        background: url(/shinebeam/img/i_vn.png?v2) no-repeat 24px 50%;
        background-size: 50px;
    }

    .branch dd {
        position: absolute;
        top: 52px;
        right: 38px;
        width: 44px;
        height: 40px;
        font-size: 0;
        color: transparent;
        background: url(/shinebeam/img/i_Close.svg) no-repeat right 0 top 50%;
        background-size: auto 40px;
        cursor: pointer;
    }

    .header.section.on .branch {
        transform: translateY(0);
        height: auto;
        padding-top: 176px;
        padding-bottom: 94px;
        opacity: 1;
    }

    /* ***** 헤더 ***** */
    .header {
        position: relative;
        z-index: 20;
        height: 100%;
        padding: 30px;
        background: url(/shinebeam/img/main_m.jpg) no-repeat 50% 50% / cover;
        box-sizing: border-box;
    }

    .header.section.on::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 99;
        background: rgba(0, 0, 0, .7);
        pointer-events: auto;
    }

    .headerBox {
        width: 100%;
    }

    .headerBox .sbList {
        top: 0;
    }

    .headerBox .sbTxt {
        padding: 0 0 426px;
    }

    /* ***** 지점 리스트 ***** */
    .list {
        position: absolute;
        bottom: 120px;
        left: 30px;
        width: calc(100% - 60px);
    }

    .list>ul {
        overflow: hidden;
        border-width: 1px 0 0 1px;
        border-style: solid;
        border-color: #333;
    }

    .list>ul>li {
        float: left;
        width: 33.3%;
        line-height: 86px;
        border-width: 0 1px 1px 0;
        border-style: solid;
        border-color: #333;
        font-size: 24px;
        box-sizing: border-box;
    }

    .list>ul>li:nth-child(1) {
        display: none;
    }

    .list>ul>li:nth-child(3n) {
        width: 33.4%;
    }

    .list>ul>li.on::after {
        content: '';
        position: absolute;
        left: 0;
        bottom: -2px;
        width: 100%;
        height: 4px;
        background: #ff110f;
    }

    .list .Exception.pc {
        display: none;
    }

    /* ***** 지점 상세 ***** */
    .select {
        padding: 30px 0 175px;
        box-sizing: border-box;
    }

    .select .sl {
        padding: 0 30px;
        box-sizing: border-box;
    }

    .slInfo .sltext {
        padding: 0px 0 15px;
        text-align: center;
        color: #777;
        font-size: 14px;
    }

    .slInfo .slImg {
        padding: 0 0 30px;
    }

    .slInfo h1 {
        font-size: 50px;
        text-align: center;
        padding: 120px 0 15px;
    }

    .slInfo dl:nth-of-type(3) {
        min-height: 156px;
    }

    .slInfo dt,
    .slInfo dd {
        font-size: 26px;
        line-height: 52px;
    }

    .slInfo dt {
        width: 85px;
        height: 52px;
    }

    .slInfo dt::after {
        width: 85px;
    }

    .slInfo dd>span {
        font-size: 26px;
        margin: 0 0 0 15px;
        padding: 0 0 0 152px;
    }

    .slInfo ul {
        margin: 50px 0 20px;
    }

    .slInfo li {
        width: calc(50% - 15px);
        height: 86px;
        line-height: 86px;
        padding: 0 0 0 55px;
        font-size: 24px;
    }

    .slInfo li:nth-child(1),
    .slInfo li:nth-child(2) {
        background-size: auto;
        background-position: 55px 50%;
    }

    .slInfo>a {
        height: 86px;
        line-height: 86px;
        font-size: 24px;
    }

    /* ***** 지하철 ***** */
    .sl .slInfo dd>span.icon {
        background-size: auto;
    }

    .sl01 .slInfo dd>span,
    .sl02 .slInfo dd>span,
    .sl03 .slInfo dd>span:nth-child(1),
    .sl03 .slInfo dd>span:nth-child(2),
    .sl04 .slInfo dd>span,
    .sl05 .slInfo dd>span,
    .sl06 .slInfo dd>span,
    .sl08 .slInfo dd>span,
    .sl09 .slInfo dd>span:nth-child(1),
    .sl09 .slInfo dd>span:nth-child(2),
    .sl10 .slInfo dd>span,
    .sl11 .slInfo dd>span,
    .sl14 .slInfo dd>span {
        background-size: auto !important;
    }

    /* 사업자정보 */
    .sl .slBuisness {
        position: relative;
        margin: 35px 0 0;
    }

    .sl .slBuisness dl dt,
    .sl .slBuisness dl dd {
        height: 46px;
        line-height: 46px;
    }

    /* ***** 페이징 ***** */
    .swiper-pagination-fraction {
        position: absolute;
        left: 50%;
        bottom: 60px;
        transform: translateX(-50%);
        width: 50px;
        height: 55px;
        font-size: 0;
        color: transparent;
        background: url(/shinebeam/img/pagination.jpg) no-repeat 50% 50%;
    }

    .swiper-pagination-current,
    .swiper-pagination-total {
        position: absolute;
        font-size: 28px;
        color: #555;
    }

    .swiper-pagination-current {
        left: 0;
        top: 0;
    }

    .swiper-pagination-total {
        right: -4px;
        bottom: -2px;
    }

    .fp-auto-height.fp-section,
    .fp-auto-height .fp-slide,
    .fp-auto-height .fp-tableCell {
        height: auto !important;
    }


    /* ***** 푸터 ***** */
    .footer {
        border-top: 1px solid #ddd;
    }
}


/* ***** ***** MOBILE ***** ***** */
@media screen and (max-width:720px) {

    /* ***** 해외지점 ***** */
    .branch {
        padding: 0 19px;
        transform: translateY(230px);
    }

    .branch::before {
        top: 26px;
        left: 19px;
        font-size: 20px;
        letter-spacing: -.4px;
    }

    .branch dt {
        height: 25px;
        line-height: 26px;
        padding: 0 0 0 50px;
        font-size: 19px;
        letter-spacing: .8px;
    }

    .branch dt.hk,
    .branch dt.hongkong {
        background-position: 12px 50%;
        background-size: auto 25px;
        margin: 40px 0 0;
    }

    .branch dt.vn,
    .branch dt.vietnam {
        background-position: 12px 50%;
        background-size: auto 25px;
    }

    .branch dd {
        top: 26px;
        right: 19px;
        width: 22px;
        height: 20px;
        background-size: auto 20px;
    }

    .header.section.on .branch {
        padding-top: 88px;
        padding-bottom: 47px;
    }

    /* ***** 헤더 ***** */
    .header {
        padding: 0;
    }

    .headerBox h1 {
        position: relative;
        top: 15px;
        left: 15px;
        width: 92px;
        height: 19px;
        background-size: 92px;
    }

    .headerBox .sbList {
        top: 15px;
        right: 15px;
    }

    .headerBox .sbList li {
        width: 68px;
        height: 23px;
        line-height: 22px;
        font-size: 10px;
    }

    .headerBox .sbTxt {
        padding: 0 0 276px;
    }

    .headerBox .sbTxt li:nth-child(1) {
        height: 23px;
        background-size: auto 100%;
        margin: 0 0 15px;
    }

    .headerBox .sbTxt li:nth-child(2) {
        font-size: 12px;
        line-height: 18px;
    }

    .headerBox .sbTxt li:nth-child(2) span {
        font-size: 12px;
    }

    .headerBox .sbTxt li:nth-child(3) {
        font-size: 12px;
        line-height: 18px;
    }

    /* ***** 지점 리스트 ***** */
    .list {
        bottom: 60px;
        left: 15px;
        width: calc(100% - 30px);
    }

    .list>ul>li {
        font-size: 16px;
        line-height: 54px;
    }

    /* ***** 지점 상세 ***** */
    .select {
        padding: 15px 0 30px;
    }

    .select .sl {
        padding: 0 15px;
    }

    .sl .slBox {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        padding: 0 0 65px;
    }

    .slInfo .sltext {
        padding: 0px 0 15px;
    }

    .slInfo .slImg {
        padding: 0;
    }

    .slInfo .slImg>img {
        top: -15px;
    }

    .slInfo .slImg.open {
        height: 100%;
        margin-bottom: 15px;
    }

    .slInfo .slImg.open .op_logo img {
        width: 40px;
    }

    .slInfo .slImg.open .op_open {
        width: 170px;
        margin: 5px auto 5px;
        padding: 7px 0px 5px;
        font-size: 16px;
    }

    .slInfo .slImg.open .op_date {
        font-size: 25px;
        margin-top: 10px;
    }

    .slInfo h1 {
        font-size: 24px;
        padding: 15px 0 8px;
    }

    .slInfo h1::after {
        width: 4px;
        height: 4px;
        margin: -4px 0 0 2px;
    }

    .slInfo dl:nth-of-type(3) {
        min-height: 72px;
    }

    .slInfo dt,
    .slInfo dd {
        font-size: 12px;
        line-height: 24px;
    }

    .slInfo dt {
        width: 55px;
        height: 24px;
    }

    .slInfo dt::after {
        width: 55px;
    }

    .slInfo dd {
        width: calc(100% - 55px);
    }

    .slInfo dd>span {
        font-size: 12px;
        margin: 0 0 0 7px;
        padding: 0 0 0 76px;
    }

    .slInfo ul {
        margin: 15px 0 10px;
    }

    .slInfo li {
        width: calc(50% - 7px);
        height: 38px;
        line-height: 38px;
        padding: 0 0 0 27px;
        font-size: 12px;
    }

    .slInfo li:nth-child(1) {
        background-size: 18px;
        background-position: 18px 50%;
    }

    .slInfo li:nth-child(2) {
        background-size: 20px;
        background-position: 20px 50%;
    }

    .slInfo>a {
        height: 38px;
        line-height: 38px;
        font-size: 12px;
    }

    .slInfo .slImg>.op_bg img {
        width: 50px;
        top: calc(50% - 75px);
        left: calc(50% - 25px);
    }

    .slInfo .slImg>.op_bg .op_open {
        position: absolute;
        top: calc(50% - 10px);
        font-size: 16px;
    }

    .slInfo .slImg>.op_bg .op_date {
        width: fit-content;
        position: absolute;
        top: calc(50% + 30px);
        font-size: 22px;
        line-height: 26px;
    }

    /* ***** 지하철 ***** */
    .sl .slInfo dd>span.icon {
        background-size: 66px;
    }

    .sl01 .slInfo dd>span,
    .sl02 .slInfo dd>span,
    .sl03 .slInfo dd>span:nth-child(1),
    .sl03 .slInfo dd>span:nth-child(2),
    .sl04 .slInfo dd>span,
    .sl05 .slInfo dd>span,
    .sl06 .slInfo dd>span,
    .sl08 .slInfo dd>span,
    .sl09 .slInfo dd>span:nth-child(1),
    .sl09 .slInfo dd>span:nth-child(2),
    .sl10 .slInfo dd>span,
    .sl11 .slInfo dd>span,
    .sl14 .slInfo dd>span {
        background-size: 66px !important;
    }

    /* 사업자정보 */
    .sl .slBuisness {
        margin: 10px 0 0;
        position: absolute;
    }

    .sl .slBuisness dl dt,
    .sl .slBuisness dl dd {
        height: 20px;
        line-height: 20px;
    }


    /* ***** 페이징 ***** */
    .swiper-pagination-fraction {
        bottom: 15px;
        width: 25px;
        height: 25px;
        background: url(/shinebeam/img/pagination.jpg) no-repeat 48% 50% / 25px;
    }

    .swiper-pagination-current,
    .swiper-pagination-total {
        font-size: 12px;
    }


    /* 
	** SUB MAIN 팝업
	**/
    .introPopup {
        top: 50px;
        width: 350px;
    }

    .introPopup.sP1 {
        left: 50%;
        transform: translateX(-50%);
    }

    .introPopup>img {
        height: 350px;
    }



    /* ***** 푸터 ***** */
    .footer {
        padding: 10px 15px;
    }

    .footer>div {
        font-size: 10px;
    }
}