/* BASIC css start */
	/* Style for our header texts
	* --------------------------------------- */
    /*
	h1{
		font-size: 5em;
		font-family: arial,helvetica;
		color: #000;
		margin:0;
		padding:0;
	}
    */

	/* Centered texts in each section
	* --------------------------------------- */
	.section {
    position: relative;
    text-align: center;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    background-size: cover;
    display: table;
    table-layout: fixed;
    overflow: hidden;
}

.section.active .anime.dur0{
    animation-delay: 0.5s;
}

.section.active .anime.dur1{
    animation-delay: 1.0s;
}

.section.active .anime.dur2{
    animation-delay: 1.5s;
}

.section.active .anime.dur2_0{
    animation-delay: 2.0s;
}

.section.active .anime.dur3{
    animation-delay: 3.0s;
}

.section.active .anime.dur4{
    animation-delay: 4.0s;
}

.section.active .anime.dur5{
    animation-delay: 5.0s;
}

.section.active .anime.dur7{
    animation-delay: 7.0s;
}


.section.active .anime.dur8{
    animation-delay: 8.0s;
}

.section.active .anime.dur9{
    animation-delay: 9.0s;
}




.section.active .anime.dur15{
    animation-delay: 15.0s;
}
.section.active .anime.dur16{
    animation-delay: 16.0s;
}

.section.active .anime.dur17{
    animation-delay: 17.0s;
}

.section.active .anime {
    -webkit-animation-duration: 3.2s;
    -moz-animation-duration: 3.2s;
    -o-animation-duration: 3.2s;
    animation-duration: 3.2s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}


.section.active .anime7 {
    -webkit-animation-duration: 7s;
    -moz-animation-duration: 7s;
    -o-animation-duration: 7s;
    animation-duration: 7s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
}

.section.active .anime.fa_down {
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown;
}


.section.active .anime.fa_left {
    -webkit-animation-name: fadeInLeft;
    -moz-animation-name: fadeInLeft;
    -o-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

.section.active .anime.fain {
    -webkit-animation-name: fadeIn;
    -moz-animation-name: fadeIn;
    -o-animation-name: fadeIn;
    animation-name: fadeIn;
}

.section.active .anime7.fadeInUp {
    -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp;
}





body .section .cont_bg{width:100%; height:100%; position:absolute; top:0; left:0; background-position: center center; background-repeat: no-repeat; background-size:cover;}

#fullpage { position:relative; }

/* Defining each section background and styles
* --------------------------------------- */
body #section0 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/01.jpg);}
body #section1 {background-color:#fffaec;}
body #section1 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/02.jpg);}
body #section2 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/03.jpg);}
body #section3 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/04.jpg);}
body #section4 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/05.jpg);}
body #section5 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/06.jpg);}
body #section6 .cont_bg{background-image: url(http://bamboobebe.img16.kr/img_m/brand/07.jpg);}
body #section7{background-color:#97bc61;}
body #section8{background-color:rgba(0,0,0,0.3);}

/* Bottom menu
* --------------------------------------- */
body #infoMenu li a { color: #fff;}
body #menu{position:fixed; top:50%; right:0; }

    
/* --------------------------------------- */
    
body .header{position:fixed; top:0; left:0; width:100%; height:55px; z-index:10; }
body .header .logo{display:block; float:left; margin:15px 0 0 20px;}
body .header .logo img{width:17px; height:auto;}
body .header .btn_home{display:block; float:right; margin:16px 20px 0 20px;}
body .header .btn_home img{width:23px; height:auto;}

body .btn_scroll{width:84px; height:65px; position:fixed; bottom:60px; left:50%; margin-left:-42px; opacity:0;  transition: all 0.5s;}
body .btn_scroll.show{opacity:1;}
body .btn_scroll span.scroll_text{display:block; height:20px; text-align:center; line-height:20px; font-family:'Montserrat', 'Noto Sans KR', sans-serif; font-weight:100; color:#aaaaaa; font-size:12px; margin-bottom:10px; letter-spacing:1px; }
body .btn_scroll img.scroll_img{display:block;  height:35px; position:relative; margin:0 auto; animation: btn_scroll 1.5s  ease-in-out infinite;}

body #paging{width:84px; height:20px; position:fixed; bottom:35px; right:25px; opacity:1; color:#ddd; font-family:'Montserrat', 'Noto Sans KR', sans-serif; font-weight:700; text-align:right; line-height:20px; }
body #paging.hide{opacity:0;}



body #fp-nav{right:50px; width:24px; transform:translateY(0%); transform:translateY(0%); -webkit-transform: translate3d(0,0,0); }
body #fp-nav ul{}
body #fp-nav li{ position:relative; display: block; width:10px; height:10px; margin:10px 6px;}    
body #fp-nav li a{ position: relative; display: block; z-index: 1; width: 100%; height: 100%; cursor: pointer;}
body #fp-nav ul li a span{ position: absolute; z-index: 1; height:10px; width:10px; background:rgba(255,255,255,0.5); background-clip: padding-box; left: 50%; top: 50%; border: 0;  margin: -5px 0 0 -5px; transition: all 0.5s ease-in-out; border:2px solid transparent; border-radius: 100%; box-sizing:border-box;  }    
body #fp-nav ul li a.active span{ background:rgba(255,255,255,0); border:2px solid #FFF;}



body .section .inner{width:100%; margin:0 auto; box-sizing:border-box; padding-top:55px; padding-bottom:55px;  }
body .section .inner *{letter-spacing:-1px; }
body .section#section7 .inner{padding-top:55px; padding-bottom:0;}


body #section0 h1{font-size:33px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#FFF; line-height:1.2; font-weight:100;}    

body #section1 .inner{text-align:left; padding-left:30px; }    
body #section1 .inner .logo_history{position:relative; font-size:0; vertical-align:top; }
body #section1 .inner .logo_history .now_logo{position:relative; height:42px; margin-bottom:20px;}
body #section1 .inner .section1_logo{display:inline-block; margin-bottom:20px; width:27px; margin-right:20px; position:absolute; top:0; left:0;   }    
body #section1 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#222; line-height:1.2; font-weight:100;}
body #section1 .inner p.desc{padding-top:20px; color:#404040; line-height:1.5; font-size:15px;}


body #section2 .inner{text-align:center; }
body #section2 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#fff; line-height:1.2; font-weight:100;}
body #section2 .inner p.desc{padding-top:20px; color:#cccccc; line-height:1.5; font-size:15px;}



body #section3 .inner{text-align:left; padding-left:30px;}    
body #section3 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#222; line-height:1.2; font-weight:100; text-indent:-3px;}
body #section3 .inner p.desc{padding-top:20px; color:#404040; line-height:1.5; font-size:15px;}

body #section4 .inner{text-align:left; padding-left:30px;}    
body #section4 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#FFF; line-height:1.2; font-weight:100;}


body #section4 .inner dl{padding-top:20px; color:#404040; line-height:1.5;}
body #section4 .inner dl *{font-family:'Montserrat', 'Noto Sans KR', sans-serif; font-size:15px;}

body #section4 .inner dl dt{color:#fff; font-weight:700; font-size:15px; margin-bottom:6px;  }
body #section4 .inner dl dd{/*color:#e1f7c3;*/ color:#cccccc; font-size:15px;}

body #section5 .inner{text-align:left; padding:180px 0 50px 30px; }    
body #section5 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#222; line-height:1.2; font-weight:100;}

body #section5 .inner p.desc{padding:20px 0; color:#404040; line-height:1.5; font-size:15px;}


body #section6 .inner{text-align:left; padding-left:30px;  }    
body #section6 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#FFF; line-height:1.2; font-weight:100;}
body #section6 .inner p.desc{padding-top:20px; color:#ccc; line-height:1.5; font-size:15px; }

body #section7 .inner{text-align:left; }    
body #section7 .inner h1{font-size:23px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif; color:#d8f9a8; line-height:1.2; margin-bottom:20px; font-weight:500; padding-left:30px; }
body #section7 .inner .history_box{overflow:hidden; /*overflow-x:hidden;overflow-y:scroll;*/ }
body #section7 .history_list  > li{font-size:45px;  font-family:'Montserrat', 'Noto Sans KR', sans-serif;  font-weight:500; line-height:1.1; color:#fff;}
body #section7 .history_list  > li.open{height:calc(100vh - 150px);}

body #section7 .history_list  > li div.year{padding-left:30px; border-bottom:1px solid #d8f9a8; font-size:40px; font-weight:700; position:relative; height:calc((100vh - 150px) / 7); line-height:calc((100vh - 150px) / 7); box-sizing:border-box; }


body #section7 .history_list  > li div.year:after{display:block; width:25px; height:25px; line-height:25px; border-radius:100%; border:1px solid #fff; text-align:center; vertical-align:middle; color:#FFF; font-size:13px; content:">"; font-family:"Dotum","µ¸¿ò"; position:absolute ; right:30px; top:50%; margin-top:-12.5px; -ms-transform: rotate(90deg); /* IE 9 */  transform: rotate(90deg);}
body #section7 .history_list  > li.open div.year{}
body #section7 .history_list  > li.open div.year:after{-ms-transform: rotate(-90deg); /* IE 9 */  transform: rotate(-90deg);}
body #section7 .inner .history_box dl{padding-top:15px; padding-left:30px; display:none;}
body #section7 .history_list  > li.open dl{display:block;}
body #section7 .history_list  > li.close dl{display:none;}
body #section7 .history_list  > li.close div.year{display:none;}
body #section7 .inner .history_box dl dt,
body #section7 .inner .history_box dl dd{font-size:13px; line-height:1.5; font-family:'Montserrat', 'Noto Sans KR', sans-serif;}
body #section7 .inner .history_box dl dt{color:#b9de83; }
body #section7 .inner .history_box dl dd{color:#fff; }

body #section7 .history_list  { overflow:auto; -ms-overflow-style:none; }
body #section7 .history_list::-webkit-scrollbar {display:none;}    

body .link_list{width:100%; height:100vh; }
body .link_list li{width:100%; height:25vh transition: all 0.5s;   transition-timing-function: ease-in-out; background-position:center; background-repeat:no-repeat; background-size:cover; vertical-align:middle;}
body .link_list li:nth-of-type(1){background-image:url(http://bamboobebe.img16.kr/img_m/brand/sub_01.png);}
body .link_list li:nth-of-type(2){background-image:url(http://bamboobebe.img16.kr/img_m/brand/sub_02.png);}
body .link_list li:nth-of-type(3){background-image:url(http://bamboobebe.img16.kr/img_m/brand/sub_03.png);}
body .link_list li:nth-of-type(4){background-image:url(http://bamboobebe.img16.kr/img_m/brand/sub_04.png);}
body .link_list li h2 {height:100%;}    
body .link_list li h2 a{height:100%; display:block;}
body .link_list li h2 a span{color:#FFF; font-size:23px; font-weight:600;  display:block; height:100%; line-height:25vh; width:100%; font-family:'Montserrat', 'Noto Sans KR', sans-serif; }


@keyframes btn_scroll {        
  0% {transform: translateY(0);}
  50% {transform: translateY(10px);}
  100% {transform: translateY(0);}
}

@-webkit-keyframes fadeInDown{
    0%{opacity:0;-webkit-transform: translateY(-20px);}
    100%{opacity:1;-webkit-transform: translateY(0);}
}
@-moz-keyframes fadeInDown{
    0%{opacity:0;-moz-transform: translateY(-20px);}
    100%{opacity:1;-moz-transform: translateY(0);}
}
@-o-keyframes fadeInDown{
    0%{opacity:0;-o-transform: translateY(-20px);}
    100%{opacity:1;-o-transform: translateY(0);}
}

@keyframes fadeInDown{
    0%{opacity:0;transform: translateY(-20px);}
    100%{opacity:1;transform: translateY(0);}
}


@-webkit-keyframes fadeInUp{
    0%{opacity:1;-webkit-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    80%{opacity:1;-webkit-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    90%{opacity:1;-webkit-transform: translate(calc(50vw - 75px), 0);}
    100%{opacity:1;-webkit-transform: translate(0);}
}
@-moz-keyframes fadeInUp{
    0%{opacity:1;-moz-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    80%{opacity:1;-moz-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    90%{opacity:1;-moz-transform: translate(calc(50vw - 75px), 0);}
    100%{opacity:1;-moz-transform: translate(0);}
}
@-o-keyframes fadeInUp{
    0%{opacity:1;-o-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    80%{opacity:1;-o-transform: translate(calc(50vw - 75px), calc(50vh - 112px));}
    90%{opacity:1;-o-transform: translate(calc(50vw - 75px),0);}
    100%{opacity:1;-o-transform: translate(0);}
}

@keyframes fadeInUp{
    0%{transform: translate(calc(50vw - 75px), calc(50vh - 200px));}  /*112px ±âÁØ*/
    80%{transform: translate(calc(50vw - 75px), calc(50vh - 200px));}
    90%{transform: translate(calc(50vw - 75px), 0);}
    100%{transform: translate(0);}
}




@-webkit-keyframes fadeInLeft{
    0%{opacity:0;-webkit-transform: translateX(300px);}
    50%{opacity:1;-webkit-transform: translateX(0);}    
    90%{opacity:1;-webkit-transform: translateX(0);}    
    100%{opacity:0;-webkit-transform: translateX(0);}
}
@-moz-keyframes fadeInLeft{
    0%{opacity:0;-moz-transform: translateX(300px);}
    50%{opacity:1;-moz-transform: translateX(0);}
    80%{opacity:1;-moz-transform: translateX(0);}
    100%{opacity:0;-moz-transform: translateX(0);}
}
@-o-keyframes fadeInLeft{
    0%{opacity:0;-o-transform: translateX(300px);}
    50%{opacity:1;-o-transform: translateX(0);}
    80%{opacity:1;-o-transform: translateX(0);}
    100%{opacity:0;-o-transform: translateX(0);}
}

@keyframes fadeInLeft{
    0%{opacity:0;transform: translateX(300px);}
    50%{opacity:1;transform: translateX(0);}
    80%{opacity:1;transform: translateX(0);}
    100%{opacity:0;transform: translateX(0);}
}


@keyframes fadeIn{
    0%{opacity:0;} 
    100%{opacity:1;}
}




/* BASIC css end */