@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);

html {
    font-family: "Nanum Gothic", sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body, h1, h2, h3, ul, li, dl, dt, dd {
    margin:0;
    padding:0;
}
h1, h2, h3, ul, li, dl, dt, dd {
    list-style:none;
}
body,html{width:100%;height: 100%;}



select { width:100%; border:1px solid #c6c6c6; text-align:center; height:30px; background-color:#FFF;}

a {color:#202020}
a:link {text-decoration:none}
a:visited {}
a:active {text-decoration:none}
a:hover {text-decoration:none}
a img {border:0;}

#wrapper { margin:0 auto; min-height:100%; position: relative;}

header nav { margin:0; padding:0;}
header nav ul { list-style:none; }

header {
    margin:0 auto;
    width:100%;
}

header nav ul li img {width:100%;}

footer {
    width:100%;
    position: relative;
}

footer .footerIn {
    width:100%;
    margin:0 auto;
    text-align:center;
    font:bold 14px dotum;
    color:#cdcdcd;
    background:url(/images/bg_foot.gif) repeat-x #000;
    display: inline-block;
    line-height: 3em;
}

footer .footerIn a { color:#cdcdcd;}

#banner {
    max-width:750px;
    /*overflow:hidden;*/

    }
#banner img { width:100%; }

/*중복확인*/
#movie {
width: 97%;
    border: 4px solid #dbdbdb;
    padding-bottom: 10px;
    overflow: auto;
    margin: 0 auto;
}

#movie li {
    padding: 0 5px ;
    float: left;
    width: 30%;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: -1px;
}


#movie li img {
    width: 100%;
}
/**/

#content_box {

    /*padding-bottom:10px;*/
    background-color:#f8f8f8;
    width:100%;
    /*width:900px;*/
    overflow:hidden;
    }

#content_box .text_box li span {
    color:#e90000;
}

/*쇼핑몰 신청동의*/

.tit_line {
    width:100%;
    text-align: center;
    overflow:hidden;
    }

.tit_line h3 {
    /*margin:2%;*/
    font-size: 18px;
    text-align: center;
    margin: 20px auto 20px;
}

#mall_box { width:100%; overflow:hidden;}
.mall_read {
    height:300px;
    overflow:hidden;
    border:1px solid #e8e8e8;
    background-color:#ffffff;
    overflow-x:hidden;
    overflow-y:auto;
    font-family: "돋움",Dotum,verdana;
    font-size: 12px;
    line-height: 15px;
    font-weight: normal;
    font-style: normal;
    text-decoration: none;
    color: #666;
    margin:10px;
    padding:10px;
    }

.textbox {
    border: solid 1px #dedede;
    font-family: 돋움,Dotum;
    font-size:11px;
    color:#555555;
    padding:4px 0 0 3px
    }

#btn {
    width:96%;
    height:50px;
    background-color:#447dff;
    text-align:center;
    margin:2%;
    cursor:pointer;
    }
#btn h3 {padding-top:13px;}

#btn h3 a {
    color:#ffffff;
    font-weight:600;
}

/* 쇼핑몰 신청하기 */

#content_check {
    overflow:hidden;
    background-color:#f3f3f3;
    }
#content_check .tit_line {background-color:#FFF;}

#check_box {position:relative; border:1px solid #c6c6c6; padding:10px;}

#request_box {
    width:95%;
    margin:15px 5px 5px;
    }

#request_box table {width:100%;color: #666; }

#request_box table th{
    width:25%;
    height:30px;
    text-align:center;
    font-family: 'GmarketSansMedium';
    font-size: 0.9em;
}


.width_fixe2 span {white-space:nowrap;}
.round_box {font-size:1em; border:1px solid #c6c6c6; padding:7px; width:100%; -webkit-box-sizing:border-box; border-radius:10px; outline:0;}
.round_box2 {border:1px solid #c6c6c6; padding:7px; width:26%; -webkit-box-sizing:border-box; border-radius:10px; ime-mode:disabled;}
.round_box3 {border:1px solid #c6c6c6; padding:7px; width:35%; -webkit-box-sizing:border-box; border-radius:10px; ime-mode:disabled;}


#btn2 {position:relative; } /*쇼핑몰신청 버튼 동일사용*/
#btn2 li {float:left; padding:10px 5px 0 0; margin:0 auto;}
#btn2 li img {width:150px;}
#ok_box {position:relative; border:1px solid #c6c6c6; padding:10px; margin-top:20px; margin-bottom:45px;}
#ok_box p.text {font-size:15px; text-align:left; clear:both;}
#ok_box span {color:#3169c4;}

/*.ok_buttom { margin:0 3% 5% 3%;}*/
.ok_buttom:after {content:''; display:block; clear:both;}
.ok_buttom ul {width:100%; float:left; margin-top:15px;}
.ok_buttom ul li {float:left; text-align:center; /*width:49.5%;*/ width: 50%; padding:9px 0px; -webkit-border-radius:3px; -webkit-box-sizing:border-box; }
.ok_buttom ul img {width: 80%; height:80px; }

.ok_buttom_01 {border:1px solid #ca1017; background:#ca1017;}
.ok_buttom_02 {border:1px solid #868686; background:#ffffff; background-size:4px 39px;}

.buss_button:after {content:''; display:block; clear:both;}
.buss_button ul {width:100%; float:left; margin-top:15px;}
.buss_button ul li {float:left; text-align:center; /*width:49.5%;*/ width: 50%; padding:9px 0px; -webkit-border-radius:3px; -webkit-box-sizing:border-box; }
.buss_button ul img {width: 80%; height:80px; }

.buss_button_01 {border:1px solid #ca1017; background:#ca1017;}
.buss_button_02 {border:1px solid #868686; background:#ffffff; background-size:4px 39px;}

/*오시는길*/
#map {position:relative; margin-bottom:20px; }
#map p {text-align:left; line-height:150%; margin:5px 0 15px 0;}
#map_box {position:relative; padding:15px;}

#map_box h3 {margin:5px 0; border-bottom:1px solid #999; font-weight:bold; color:#484848; font-size:16px;}
#map_box ul li {padding:0 0 5px 10px; background:url(/images/bt01.png) 3px 7px no-repeat;}
#map_box a { color:#C06;}

/*버튼*/
.mallbtnbox{
    width: 100%;
    float: left;
    text-align: center;
}

.mallbutton {
   background: #ff636b;
   background: -webkit-gradient(linear, left top, left bottom, from(#ff1212), to(#ff636b));
   background: -webkit-linear-gradient(top, #ff1212, #ff636b);
   background: -moz-linear-gradient(top, #ff1212, #ff636b);
   background: -ms-linear-gradient(top, #ff1212, #ff636b);
   background: -o-linear-gradient(top, #ff1212, #ff636b);
   background-image: -ms-linear-gradient(top, #ff1212 0%, #ff636b 100%);
   padding: 10.5px 15%;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   -webkit-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   -moz-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
   text-shadow: #ff6969 0 1px 0;
   color: #ffffff;
   font-size: 16px;
   text-decoration: none;
   vertical-align: middle;
   width: 50%;
   margin-right: 20px;
   }

.mallbutton:active {
   text-shadow: #ff6969 0 1px 0;
   background: #ff3030;
   background: -webkit-gradient(linear, left top, left bottom, from(#c70000), to(#3e779d));
   background: -webkit-linear-gradient(top, #c70000, #ff3030);
   background: -moz-linear-gradient(top, #c70000, #ff3030);
   background: -ms-linear-gradient(top, #c70000, #ff3030);
   background: -o-linear-gradient(top, #c70000, #ff3030);
   background-image: -ms-linear-gradient(top, #c70000 0%, #ff3030 100%);
   color: #000000;
   }

.mallbutton2 {
   background: #ffffff;
   padding: 10.5px 15%;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   text-shadow: #ffffff 0 1px 0;
   color: #656565;
   font-size: 16px;
   text-decoration: none;
   vertical-align: middle;
  border: 1px solid #b3b3b3;
  width: 50%;

   }

.mallbutton2:active {
   text-shadow: #000000 0 1px 0;
   border: 1px solid #b3b3b3;
   background: #ffffff;
   color: #dedede;
   }




/*pc*/
@media all and (min-width:750px){

    #wrapper {
        width:100%;
        max-width:750px;
    }

    header {
        border-top:10px solid #ed1c24;
    }
    header h1 {
        text-align:center;
        margin:13px 0;
    }

    header nav ul {
         overflow:hidden;

    }

    header nav ul li {
        float:left;
        width:50%;
    }
    header nav ul li a {
            display:block;
            height:91px;
    }

    #content_box .text_box  {
        position:relative;
        width:91%;
        padding:3%;
        text-align:left;
        border:1px solid #e8e8e8;
        background-color:#FFF;
        margin-top:10px;
        margin-left:10px;
        display:block;

    }

    #content_box .text_box h2 {
        vertical-align:middle;
        font-size:35px;
        margin-bottom:15px;
    }

    #content_box .text_box h2 span {
        color:#FC0;
        margin-right:10px;
        font-size:35px;
        font-weight:600;
    }

    #content_box .text_box li {
        font-size:1.3em;
        line-height:180%;
        font-weight:600;
        color:#666666;
    }

    #content_box .text_box a {
        position:absolute;
        right:20px;
        top:20px;
    }
.bbooxx2 {
    margin: 0 auto;
    height: 90px;
}
.bbooxx2 li{
    float: left;
    width: 30%;
    padding: 5px 6px;
}
.bbooxx2 img{
    width: 100%;
}
/*동영상삽입*/
.moviebox {
    width: 750px;
    overflow: auto;
    background-color: #e6e6e6;
    padding-bottom: 10px;
    width: 100%;
}
.moviebox ul {
    margin: 0 auto;
    overflow: auto;
}
.moviebox li{
    float: left;
    text-align: center;
    width: 31%;
    padding-left: 7px;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: -1px;
}
.moviebox li img{
    width: 100%;
}
/*신청버튼*/
.btnboxx{
    text-align: center;
    padding: 7px 0;
}
.btnboxx img{
    width: 30%;
}


}
/*mobile*/
@media all and (min-width:320px) and (max-width:750px){

    #wrapper {
        max-width:750px;
        width:100%;
    }
    header {
        border-top:5px solid #ed1c24;
    }
    header h1 {
        text-align:center;
        margin:5px 0;
    }

    header h1 img {width:60%;}

    header nav ul {
         overflow:hidden;

    }

    header nav ul li {
        width:50%;
        max-width:400px;
        float:left;
    }
    header nav ul li a {
        display:block;
    }

    #content_box .text_box  {
    position:relative;
    width:90%;
    padding:3%;
    text-align:left;
    border:1px solid #e8e8e8;
    background-color:#FFF;
    margin:2%;
    display:block;

    }
    #content_box .text_box li {
    font-size:0.95em;
    line-height:160%;
    font-weight:600;
    color:#666666;
    letter-spacing:-1px;
    }

    #content_box .text_box h2 {
        font-size:20px;
        margin-bottom:10px;
        /*vertical-align:top;*/
    }

    #content_box .text_box h2 span {
        color:#FC0;
        margin-right:5px;
        font-size:23px;
        font-weight:700;
    }

    #content_box .text_box a {
        position:absolute;
        right:15px;
        top:10px;

    }

    #content_box .text_box a img { width:120px;}

    img {
    width: 100%;
}
.bbooxx img{
    width: 30%;
}
.bbooxx {
    text-align: center;
}
.bbooxx2 {
    margin: 0 auto;
    height: 76px
}
.bbooxx2 li{
    float: left;
    width: 29%;
    padding: 0 6px;
}
.bbooxx2 img{
    width: 100%;
}
/*동영상삽입*/
.moviebox {
    width: 750px;
    overflow: auto;
    background-color: #e6e6e6;
    padding-bottom: 10px;
    width: 100%;
}
.moviebox ul {
    margin: 0 auto;
    overflow: auto;
}
.moviebox li{
    float: left;
    text-align: center;
    width: 31%;
    padding-left: 7px;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: -1px;
}
.moviebox li img{
    width: 100%;
}
/*신청버튼*/
.btnboxx{
    text-align: center;
    padding: 7px 0;
}
.btnboxx img{
    width: 30%;
}

}

/*정나라삽입*/
#ch_movie {
    background: #ffffff;
    width: 100%;
    overflow: hidden;
    /*padding: 10px 0;*/
}
#ch_movie li {
    padding: 10px 5px;
    float: left;
    width: 29.4%;
}
#ch_movie li img {
    width: 100%;
}
.text{
    font-size: 0.55em;
    font-weight: bold;
    color: #424242;
    margin-top: -11px;
    text-align: center;
}
.title{
    width:100%;
    overflow:hidden;
    /*min-width: 900px;*/
    margin-top: 10px;
    background:url(http://joagift.kr/new/mobile/images/new/bg.png);
}

.title_text{
    background:url(http://joagift.kr/new/mobile/images/new/pattern.png);
    padding-bottom: 26px;
}
.title_text img{
    width: 100%;
}
.mobiletextbox{
    width: 100%;
    overflow: hidden;
    border-bottom: 1px solid#e4e4e4;
    padding-bottom: 20px;

}
.textboxin{
    padding: 20px 0;
    background-color: #ffffff;
    margin: 20px;
    box-shadow: inset 0px 0px 6px #c7c7c7;
    /*min-width: 900px;*/
}
.textboxin li{
    /*float: none;
    font-size: 28px;
    font-weight: bold;
    color: #545454;
    text-align: left;
    line-height: 52px;
    letter-spacing: -1px;*/
    padding: 0 8px 0 14px;
    font-size: 0.95em;
    line-height: 180%;
    font-weight: 600;
    color: #666666;
}
.textboxin li span{
    color: #e40808;
}

.btnbox li{
    float: left;
    width: 40%;
    padding: 0 15px;
}
.btnbox li img{
    width: 100%;
}
/*신청버튼*/
.mobilebtn {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    height: 42px;
    /*padding-top: 17px;*/
    padding-bottom: 20px;
}
.mobilebtn2 {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    height: 42px;
    /*padding-top: 17px;*/
    padding-bottom: 20px;
  }
.classname {
/*    box-shadow: inset 0px 1px 0px 0px #ffffff;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fc4a4a), color-stop(1, #de1818) );
    background: -ms-linear-gradient( #fc4a4a,  #de1818);
*/	
	border-radius:6px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    -moz-border-radius-topright:6px;
	background: #fff;
    text-indent:0;
    display:inline-block;
    font-family:arial;
    font-size:16px;
    font-style:normal;
    height:35px;
    line-height:35px;
    width:90px;
    text-decoration:none;
    text-align:center;
	border:1px solid #333;
	margin:10px 0;
}
.classname:active {
    position:relative;
    top:1px;
}
.classname2 {
    background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #bfb8f3), color-stop(1, #1127c5) );
    background: -moz-gradient( linear, left top, left bottom, color-stop(0.05, #bfb8f3), color-stop(1, #1127c5) );
    background: -ms-linear-gradient( #bfb8f3,  #1127c5);
    background: -o-gradient( linear, left top, left bottom, color-stop(0.05, #bfb8f3), color-stop(1, #1127c5) );
    -webkit-border-top-left-radius:6px;
    -moz-border-radius-topleft:6px;
    border-top-left-radius:6px;
    -webkit-border-top-right-radius:6px;
    -moz-border-radius-topright:6px;
    border-top-right-radius:6px;
    -webkit-border-bottom-right-radius:6px;
    -moz-border-radius-bottomright:6px;
    border-bottom-right-radius:6px;
    -webkit-border-bottom-left-radius:6px;
    -moz-border-radius-bottomleft:6px;
    border-bottom-left-radius:6px;
    text-indent:0;
    display:inline-block;
    color:#ffffff;
    font-family:arial;
    font-size:18px;
    font-style:normal;
    height:40px;
    line-height:40px;
    width:50%;
    text-decoration:none;
    text-align:center;
    text-shadow:1px 1px 0px #4e0000;
    box-shadow: 2px 2px 0px 0px #4a0101;
}
}.classname2:active {
    position:relative;
    top:1px;
}