@charset "UTF-8";

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,button{margin:0;padding:0}
fieldset,img{border:0 none}
dl,ul,ol,menu,li{list-style:none}
blockquote, q{quotes:none}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none}
input,select,textarea,button{vertical-align:middle;font-size:100%}
button{border:0 none;background-color:transparent;cursor:pointer}
table{border-collapse:collapse;border-spacing:0}
body{min-width:320px;background-color:#fff;-webkit-text-size-adjust:none}
input:checked[type='checkbox']{background-color:#666; -webkit-appearance:checkbox}
input[type='text'],input[type='password'],input[type='submit'],input[type='search'],input[type='tel'],input[type='email'],html input[type='button'],input[type='reset']{-webkit-appearance:none;border-radius:0}
input[type='search']::-webkit-search-cancel-button{-webkit-appearance:none}
body,th,td,input,select,textarea,button{font-size:14px;line-height:1.5;  font-family: 'Apple SD Gothic Neo', 'Malgun Gothic','맑은 고딕', system-ui, sans-serif;color:#000}
a{color:#005a96;text-decoration:none}
a:active, a:hover{text-decoration:none}
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
hr {border: 0 none;}
div:focus {outline: none;}
img {vertical-align: top;}
.ir {display:block; font-size:0; text-indent: -99999px; height:0;}
.is-app {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: -moz-none;
    -o-user-select: none;
    user-select: none;
}
.is-app a, .is-app button {outline: none;-webkit-tap-highlight-color : transparent !important;}
/*
body {
    padding-bottom: 130px;
}
*/

main {
    overflow: hidden;
    position: relative;
    width: 100%;
}

.inner {
    max-width: 325px;
    margin: 0 auto;
    text-align: center;
}

.inner img {
    width: 100%;
}

.section1 {
    padding: 24px 0 101px;
    background: #fffca6 url('https://og.kakaobank.io/view/add75654-deb4-4d35-b010-fc323bbb1338') center bottom no-repeat;
}

.section1 .title {
    padding: 0 48px;
}

.section1 .sub-title {
    margin-top: 7px;
    padding: 0 51px;
}

.section1 .content {
    margin-top: 25px;
}

.section1 hr {
    margin: 35px 7px 0;
    height: 3px;
    background: #000;
}

.section1 .share-title {
    margin: 45px 39px 0;
}

.section1 .share-btns {
    margin: 29px 0 0;
}

.section1 .share-btns button{
    width: 60px;
    height: 60px;
    margin: 0 14px;
}

.detail-info {
    padding: 45px 10px 130px;
    background: #f8f8f8;
    color: #888;
}

.nobtn .detail-info {
    padding-bottom: 60px;
}

.detail-info .inner {
    text-align: left;
}

.detail-info .title {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}

.detail-info .sub-title:first-of-type {
    margin-top: 48px;
    font-weight: bold;
    color: #333;
}

.detail-info .sub-title {
    margin-top: 25px;
    font-weight: bold;
    color: #333;
}

.detail-info ul {
    margin-top: 20px;
    padding: 0 0 0 10px;
}

.detail-info li {
    line-height: 23px;
    /*margin-top: 14px;*/
}

.detail-info li.period {
    margin-top: 0;
    color: #333;
    font-weight: 600;
}

.detail-info li:before {
    content: "·";
    margin-left: -10px;
    margin-right: 6px;
}
.detail-info hr {
    margin: 30px 7px 0;
    height: 1px;
    background: #ddd;
}
.serial-number {
    margin: 30px 7px 0;
    color: #888;
}
.btn-send {
    position: fixed;
    bottom: -90px;
    left: 0;
    z-index: 100;
    width: 100%;
    padding: 0 20px;
    box-sizing: border-box;
    text-align: center;
    transition: transform 0.3s;
    -webkit-transition: -webkit-transform 0.3s;
}
.btn-send .link {
    display: block;
    width: 100%;
    max-width: 335px;
    height: 67px;
    line-height: 72px;
    margin: 0 auto;
    border-radius: 14px;
    background:#333;
    color: #333;
    /*text-indent: -9999px;*/
}

.btn-send.active {
    transform: translateY(-120px);
    -webkit-transform: translateY(-120px);
}

/****** popups **************************/
.popups {position:fixed; top:0; left:0; width:100%; height:100%; z-index:999; display: table; text-align: center; visibility: hidden; opacity:0;}
.popups.on {visibility: visible; opacity:1;}
.popups .pop-inner {display: table-cell; vertical-align: middle;}
.popups .bg {position:absolute; top:0; left:0; width:100%; height:200%; background-color:rgba(0,0,0,0.6);}
.popups .pop-content {position:relative; max-width:300px; /*padding:0 20px;*/ margin:0 auto;}
.popups .pop-content-inner {background:#fff;border-radius: 30px; font-size:0;}
.popups .copy {position:relative; display: block; padding:34px 0 ; text-align: center; }
.popups .copy-sub {position:relative; display: block; margin-top: -25px; padding:0 0 39px; text-align: center; }
.popups .ok-btn {display: block; width:100%; padding:0 12px 12px; box-sizing: border-box;}
.popups .ok-btn button,
.popups .ok-btn a {display:block; width:100%; font-size:0; background-color:#fffca6; text-align: center; padding:21px 0; border-radius: 20px;}