/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.clearfix:before,
.clearfix:after{display:table;content:" ";}
.clearfix:after,
.container:after,
.container-fluid:after{clear:both;}
.container-fluid{width:100%}
.container{width:640px; margin:0 auto;}
.img-responsive{max-width:100%; width:100%;}
.position_rel{position:relative;}
input{border: 1px solid #f6d1cf; vertical-align: middle;}
#content_back {background-image:url('../img/back.png'); background-size:100% 100%; width:100%; max-width:640px; overflow:hidden; }

#kakaostory_head {position:relative; width:100%;}
#kakaostory_head img.img-responsive.delivery_info {position:absolute; right:10px; top:0; width:20%; max-width:76px; max-height:24px;}
#kakaostory_content_wrap{background-color:#fff; width:95%; margin:0 auto; vertical-align:top; padding-bottom:10px; margin-bottom:20px; position:relative;}

#kakaostory_content_wrap .input_box_line.input_box1 {padding-top:8%; overflow:hidden;}
#kakaostory_content_wrap .input_box_line {padding-top:3%; overflow:hidden;}
#kakaostory_content_wrap .input_box_line input.inpout_box {background-color:#f7e5e4; width:60%; color:#555353; padding:0 1%; border-radius:0px;}
#kakaostory_content_wrap .input_box_line label img.label_img {max-width:100%; width:28%;float:left; margin-left:5%; }
#kakaostory_content_wrap.other .input_box_line.input_box1 {padding-top:3%;}
#kakaostory_content_wrap .agree_box{width:95%; margin:0 auto; padding-top:5%;}
#kakaostory_content_wrap .agree_box .left_agree {width:44%; float:left; margin-left:4.5%;}
#kakaostory_content_wrap .agree_box .right_agree {width:44%; float:right;  margin-right:4.5%;}
#kakaostory_content_wrap .agree_box .agree_content {width:100%; height:77px; overflow-y:scroll; border:1px solid #757575;  margin:2% 0; font-size:12px; color:#757575; padding:5px;}
#kakaostory_content_wrap .agree_box label{color:#696969; font-size:12px;}
#kakaostory_content_wrap .agree_content_detail_btn_wrap {float:right; width:40%; margin-right:4.8%; margin-top:1%;}
#kakaostory_content_wrap .confirm_btn_wrap,
#kakaostory_content_wrap .close_btn_wrap {width:50%; margin:20px auto;}

#agree_detail_pop { width:95%; margin:0 auto; background-color:#fff; position:absolute; top:0; padding:5% 0; max-height:630px; height:100%; display:none;}
#agree_detail_pop .agree_detail_pop_title {width:50%;}
#agree_detail_pop .agree_detail_pop_title > img {max-width:265px;}
#agree_detail_pop .agree_detail_content { font-size:13px; line-height:1.5; padding:10px; border:1px solid #dbdbdb; overflow:hidden; max-height:480px; height:70%; overflow-y: scroll; margin-top:3%;}
#agree_detail_pop .agree_detail_content_ok_wrap {width:25%; margin:20px auto;}

#footer {margin:0 auto;}

#kakaostory_content_wrap .event_ok_img_wrap {width:95%; margin:0 auto; padding: 15% 0;}
#kakaostory_content_wrap .search_ok_title{width:100%; margin:0 auto; text-align:center; font-size:1.7em; line-height:2; color:#555555; font-weight:bold;}
#kakaostory_content_wrap .search_ok_title .red_col {color:#f32525}

@media (max-width:640px){
 .container,
 #content_back {width:100%;}
 #kakaostory_content_wrap .agree_box label{color:#696969; font-size:10px;}
 #agree_detail_pop .agree_detail_content { font-size:12px; line-height:1.3;}
 #kakaostory_content_wrap .search_ok_title {font-size:1.4em;}
}
@media (max-width:400px){
 #kakaostory_content_wrap .label_title {display:block; margin-top:10px;font-size:12px;}
 #agree_detail_pop .agree_detail_content { font-size:12px; line-height:1.3;}
 #kakaostory_content_wrap .search_ok_title {font-size:1em;}
}