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

*{
font-family: 'Nanum Pen Script', serif;}
.clear{clear:both;}

#header .bgm-wrap{
  /* height:55px; */
         position:relative; }
#header .bgm{position: absolute;top: 18px;left: 18px;z-index: 9999;width: 14px;background-color: rgba(0, 0, 0, 0.13); height: 14px;padding: 8px;border-radius: 20px;}
#header .bgm img{width: 100%; vertical-align: top;}
#container{position: relative; z-index: 99; background-color: #fff;}


#container > .topimg-wrap{position:relative;width:100%;min-height:355px;padding-top:10%;    background: #bacad6;}
#container > .topimg-wrap .btm li{display:inline-block;
left:51.1%; padding-top:36.9%; position:absolute; width:3.5%; padding-left:1.2%; z-index:100;}
#container > .topimg-wrap .btm li p{float:left; width:50%; }

    #container .topimg-wrap .btm li >
    .t-0{content: url(/skin/I/images/0.png);}
    #container .topimg-wrap .btm li >
    .t-1{content: url(/skin/I/images/1.png);}
    #container .topimg-wrap .btm li >
    .t-2{content: url(/skin/I/images/2.png);}
    #container .topimg-wrap .btm li >
    .t-3{content: url(/skin/I/images/3.png);}
    #container .topimg-wrap .btm li >
    .t-4{content: url(/skin/I/images/4.png);}
    #container .topimg-wrap .btm li >
    .t-5{content: url(/skin/I/images/5.png);}
    #container .topimg-wrap .btm li >
    .t-6{content: url(/skin/I/images/6.png);}
    #container .topimg-wrap .btm li >
    .t-7{content: url(/skin/I/images/7.png);}
    #container .topimg-wrap .btm li >
    .t-8{content: url(/skin/I/images/8.png);}
    #container .topimg-wrap .btm li >
    .t-9{content: url(/skin/I/images/9.png);}

#container > .invitation-wrap .btm > p img{width:100%;}
#container > .topimg-wrap .top-bg{background-image:url(/skin/baby-B/images/top-duck.png);padding: 5% 5% 5% 5%;color:#534741;background-position: top center;background-repeat: no-repeat;background-size:85%;margin-top: 30px;padding-bottom: 50px;}
#container > .topimg-wrap > .top-txt{color:#534741;width: 100%;text-align: center;font-size:35px;margin-top: 20px;}
#container > .topimg-wrap .top-bg .topimg{}
#container > .topimg-wrap .top-bg .topimg p font{font-size:15px;}
#container > .topimg-wrap .top-bg img{width:100%; height:100%;}
#container > .invitation-wrap{}
#container > .invitation-wrap .article{
    font-size: 13px;
    line-height: 23px;
    word-break:break-all;
    margin:0 auto;
    width: 70%;
    font-family: 'Noto_R';
    }
#container > .invitation-wrap .article img{width:15%;padding: 50px 0 10px;}

/* 연락하기 */
#container> .invitation-wrap .call {}
#container> .invitation-wrap .call .calling {margin-bottom: 20px;}
#container> .invitation-wrap .call .calling span {font-size: 13px;font-family: 'Noto_R';}
#container> .invitation-wrap .call .calling>a {display: inline-block;vertical-align: middle;}
#container> .invitation-wrap .call .calling>a i {margin: 0 10px;font-size: 18px;border-radius: 100%; color: #333;}

#container > .invitation-wrap h2.title{padding:20px 0 10px;}
#container > .invitation-wrap h2.title img{width:150px; height:auto;
margin-top:-10px;}

#container > .invitation-wrap .profile{overflow:hidden;}
#container > .invitation-wrap .profile img{width:100%;}


#container > .invitation-wrap .profile .heart{position:absolute; top:25px; left:0; right:0;}
#container > .invitation-wrap .profile .heart img{width:35px;}
#container > .invitation-wrap .profile-detail{text-align:left; float:left; width:35%; padding:13% 0% 5% 7%;color:black; position:absolute }
#container > .invitation-wrap .profile-detail p{width:120%;}



#container > .contact{border-top:3px solid #b3ab9e; background-color:#ede8de;padding:10px 0;}
#container > .contact ul{overflow:hidden}
#container > .contact ul li{float:left; width:25%;}
#container > .contact ul li a{display:block; color:#555; font-size:12px; margin:10px;}
#container > .contact ul li a img{width:20px; vertical-align:middle; }
#container > .contact ul li a span{display:block; margin-bottom:5px; background-color:#fff; background: linear-gradient( to bottom, #fff, #eee );border:1px solid #ddd; padding:10px; border-radius:5px; box-shadow: inset 0px 0px 2px rgba(255,255,255,1);}

/*갤러리*/
#container .photo { height: auto; display: block; overflow: hidden; margin: 50px 0; font-size: 12px;}
#container .photo .title {color: #9fbfd6;font-size: 20px;margin-bottom: 10px;border-bottom: 1px solid #9fbfd6;display: inline-block;padding: 5px 10px;font-family: 'Nanum Pen Script', serif;}
#container .photo .gallery-wrap { background-repeat: repeat; padding: 4px 0px 0px; width: 90%; margin: 0 auto 10px;}
#container .photo .gallery div { width: 32%; height: 140px; display: inline-block; background-position: center; background-repeat: no-repeat; background-size: cover;}
#container .photo .txt {font-family: 'noto_r' !important;color: #777;font-size: 11px;}
/*갤러리 전체화면*/
#gallery-view {width: 100%; height: 100%; position: fixed; top: 0; left: 50%; background: #333; z-index: 9; max-width: 420px; transform: translate(-50%, 100%);}
#gallery-view .swiper-container {height: 100%;}
#gallery-view .swiper-slide {background-size: contain; background-repeat: no-repeat; background-position: center;}
#gallery-view .close {background-image: url("/skin/test/images/close.png"); background-repeat: no-repeat; background-size: cover; color: #fff; height: 20px; position: absolute; right: 10px; text-indent: -9999px; top: 10px; width: 20px; z-index: 99;}

#gallery-view .swiper-button-next.swiper-button-disabled, #gallery-view  .swiper-button-prev.swiper-button-disabled {opacity: 1;}

#gallery-view .swiper-button-next {background-image: url(/skin/test/images/right_btn.png) !important; background-size: auto; right: 0px; width: 30px; height: 40px; background-color: rgb(0,0,0,0.2);}
#gallery-view .swiper-button-prev {background-image: url(/skin/test/images/left_btn.png) !important; background-size: auto; left: 0px; width: 30px; height: 40px; background-color: rgb(0,0,0,0.2);}

#gallery-view .swiper-button-prev:after, #gallery-view .swiper-container-rtl .swiper-button-next:after {content: none;}
#gallery-view .swiper-button-next:after, #gallery-view .swiper-container-rtl .swiper-button-prev:after {content: none;}


#container .movie{padding: 0% 0% 10%;/* background-color:#f0e5db; */margin-top: 50px;}
#container .movie .title {color: #9fbfd6;font-size: 20px;margin-bottom: 10px;border-bottom: 1px solid #9fbfd6;display: inline-block;padding: 5px 10px;font-family: 'Nanum Pen Script', serif;}
#container .movie .cont{margin:0 15px;}
#container .movie iframe{width:100% !important;}
#container .movie .mv-wrap{position:relative;width:100%;height:200px;}
#container .movie .mv-wrap iframe{position: absolute;width: 100%;height: 200px;left:0;top:0;}

/* 방명록 */
#container > .guestbook {margin-top: 50px; text-align: center;}
#container > .guestbook .title .tit {color: #9fbfd6;font-size: 20px;margin-bottom: 10px;border-bottom: 1px solid #9fbfd6;display: inline-block;padding: 5px 10px;font-family: 'Nanum Pen Script', serif;}
#container > .guestbook .cont {padding: 0;border-radius: 3px;text-align: left;display: inline-block; width: calc(100% - 20px);}
#container > .guestbook .cont .arrow_box {position: relative;padding: 10px;font-size: 12px;background-color: #fff;margin-bottom: 5px; border-bottom: 1px solid #eee;}
#container > .guestbook .cont .arrow_box:last-of-type {border: 0;}
#container > .guestbook .cont .name {display: inline-block;padding-right: 3px;color: #444;font-family: 'Noto_B';font-size: 12px;}
#container > .guestbook .cont .name:after {content: " | "; opacity: 0.5}
#container > .guestbook .cont .date {display: inline-block; padding-left: 3px; font-size: 12px; color: #333; font-family: 'Noto Sans KR', sans-serif !important;}
#container > .guestbook .cont .memo {display: inline-block; padding-top: 5px; font-size: 12px; word-break: break-all; color: #333; font-family: 'Noto Sans KR', sans-serif !important; width: 100%;}
#container > .guestbook .write a {width: 49%;background-color: #bacad6;font-size: 13px;display: inline-block;text-align: center;float: left;font-family: 'Noto Sans KR';line-height: 2.5rem;color: #fff;}
#container > .guestbook .write a:first-of-type {margin-right: 2%;}

/* 계좌 */
#container .deliver_bank {font-size: 13px; color: #fff; font-size: 14px;margin-top: 50px;}
#container .deliver_bank img {width: 3%; margin: 5% 0;}
#container .deliver_bank>p {color: #9fbfd6;font-size: 20px;margin-bottom: 10px;border-bottom: 1px solid #9fbfd6;display: inline-block;padding: 5px 10px;font-family: 'Nanum Pen Script', serif;}
#container > .deliver_bank > .cont {padding: 0; margin: 0 0 5px;
 text-align: left;display: inline-block;border: 1px solid #9fbfd6; width: calc(100% - 20px);}
#container .deliver_bank a.side {width: 100%;color: #fff;background-color: #bacad6;border: 1px solid #f5f5f5; padding: 10px;display: inline-block;box-sizing: border-box;font-family: 'noto_r' !important;margin-bottom: 10px;font-size: 13px;position: relative; }
#container .deliver_bank a>span {position: absolute;right: 19px;top: 50%;display: block;width: 9px;height: 1px;background-color: #fff;}
#container .deliver_bank a>.plus {transform: rotate(90deg); background-color: #fff;}
/* #container .deliver_bank a.on>span.plus {display: none;}
#container .deliver_bank .bank_hide {display: none;} */
#container .deliver_bank .bank_hide>ul li {padding: 0 10px 10px;}

#container .deliver_bank .deliver_bank_inner {width: calc(100% - 20px); display: inline-block;}

#container .deliver_bank .deliver_bank_inner li {margin-bottom: 20px;text-align: left;}
#container .deliver_bank .deliver_bank_inner li:last-of-type {margin-bottom: 0;}
#container .deliver_bank .deliver_bank_inner li>p {text-align: left;height: 2rem;line-height: 2rem;font-size: 13px;font-family: 'Noto_M' !important;color: #555;}
#container .deliver_bank .middle_border>li {width: 100%; height: 1px; background-color: #ddd; display: block; margin-top: 20px; margin-bottom: 10px !important; padding: 0 !important}

#container .deliver_bank .deliver_bank_inner li span {font-size: 12px;font-family: 'noto_r';line-height: 2.5rem;color: #555}
#container .deliver_bank .deliver_bank_inner li span:nth-of-type(1) {text-align: left;color: #555; min-width: 100px;}
#container .deliver_bank .deliver_bank_inner li span:nth-of-type(3) {width: 80%;display: inline-block;text-align: left;background-color: #fafafa;text-indent: 10px;}
#container .deliver_bank .deliver_bank_inner li .account_copy {width: 17%;display: inline-block;background-color: #bacad6;color: #fff;text-align: center;cursor: pointer;}

/* 지도 */
#container > .map{margin-top: 50px;}
#container > .map a {color: #9fbfd6;font-size: 20px;margin-bottom: 10px;border-bottom: 1px solid #9fbfd6;display: inline-block;padding: 5px 10px;font-family: 'Nanum Pen Script', serif;}
#container > .map a img{width:100%;}
#container > .map .adress{text-align:center; margin:15px 0; }
#container > .map .adress .name{font-size:25px; padding-bottom:5px;}
#container > .map .adress .addr{font-size:20px;}
#container > .map #nmap{height:500px; overflow:hidden; width:auto !important;  border:1px solid #dddddd;}
#container > .map #nmap .nmap{ }
#container > .map .map-zoom{}
#container > .map .map-zoom p{ background-color:#2f2f2f; padding:0px 0px; ;}
#container > .map .map-zoom a{color:#9d9d9d; font-size:22px;display:block }
#container > .map .navi {width: 100%;text-align: right;padding: 15px 15px 0;box-sizing: border-box;}
#container > .map .navi_in span {font-family: 'noto_b' !important;font-size: 12px;}
#container > .map .navi_in {font-family: 'noto_r' !important;display: inline-block;padding: 0.4rem 11px;font-size: 11px;border-radius: 25px;border: 1px solid #eee;}
#container > .map .navi_in img {height: 18px;vertical-align: middle;margin-right: 5px;}

/* 찾아오시는길 */
#container > .map .direction{padding:10px 8%;}
#container > .map .direction table{width:100%; border-collapse: collapse; }
#container > .map .direction th,
#container > .map .direction td{color:#333; font-size:13px; padding:0 5px 5px 0; font-family: 'Noto Sans KR', sans-serif !important;}
#container > .map .direction th{width: 10%;text-align: left;color: #333;padding: 10px 0px;font-family: 'Noto Sans KR', sans-serif !important;}
#container > .map .direction th img{width:26px;}
#container > .map .direction td{width:auto; text-align:left; line-height:18px;}

/* sns */
#container .sns {margin: 0;display: inline-block;width: 100%;color: #555; margin-top: 30px;}
#container .sns ul {display: inline-block;text-align: center;width: 85%;}
#container .sns li {float: left; width: 25%; font-size: 13px;}
#container .sns li i {font-size: 25px; text-align: center;vertical-align: middle;}
#container .sns li span {display: none;}

/* 광고 */
#footer{}
#footer > .pm{position:relative;padding-bottom:25px; }
#footer > .pm img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%;}

.sign {
    font-size: 13px;
    background-color: #bacad6;
    display: inline-block;
    width: calc(100% - 20px);
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
    height: 3rem;
    line-height: 3rem;
}
.sign > a{
  color: #fff;
    font-family: 'Noto Sans KR', sans-serif !important;
    display: block;
}
.sign > a > i {
  font-size: 20px;
vertical-align: sub;
color: #fff;
}