/* ******************** Brand story ******************** */
/* -----section1----- */
#section1 { margin-top: 110px; padding: 100px 0 150px; border-bottom: 1px solid #ececec; text-align: center; }
.b_title { font-weight: 600; font-size: 40px; text-align: center; }
.b_tab { margin: 100px auto 0; padding: 0; font-size: 0; text-align: center; border-bottom: 1px solid #ccc; }
.b_tab > div { position: relative; display: inline-block; vertical-align: top; width: 50%; margin: 0 auto; padding: 0 0 15px; font-size: 22px; font-weight: 500; color: #555; cursor: pointer; }
.b_tab > div.on { color: #a0b58d; }
.b_tab > div:before { content: ''; display: inline-block; width: 0; height: 2px; position: absolute; left: 0; bottom: -1px; background:#a0b58d; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -ms-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.b_tab > div.on:before { width: 100%; }
.tab_detail { margin: 80px auto 0; text-align: left; font-family: 'Noto Sans KR', sans-serif; }

/* ABOUT US */
.us1 .bg { position: relative; padding: 10%; background: url(../img/brand/us_01.jpg) no-repeat center 84%; background-size: cover; color: #fff; }
.bg { width: 1000px; margin: 0 auto; padding: 10% 0; }
.mbar1 { position: absolute; top: 34.5%; width: 360px; height: 1px; background: #fff; }
.mbar2 { position: absolute; top: 40.5%; width: 390px; height: 1px; background: #fff; }
.bg h1 { font-size: 44px; font-weight: 900; }
.bg h1.text1 { margin: 10% 0; font-size: 36px; }
.us3 .bg p { width: 700px; }
.bg p { margin-bottom: 3%; font-size: 24px; font-weight: 400; }

.us2 h1 { margin-bottom: 10%; }
.spotlight { margin-bottom: 5%; }
.spotlight:last-child { margin-bottom: 0%; }
.spot { margin-bottom: 5%; }
.spot img { float: right; width: 20%; }
.spot2 img { float: right; width: 16%; }
.s_left { float: left; }
h2 { letter-spacing: -2px; font-size: 36px; }
h2.sial { color: #d58391; }
h2.p4g { color: #002555; }
h2.monde { color: #033d96; }
h2.food { color: #ff9e19; }
h2.asia { color: #10c4a7; }
h3 { font-size: 28px; margin-bottom: 1%; }

.us3 .bg { position: relative; padding: 10%; background: #f8f8f8; }
.bbar { position: absolute; top: 40.5%; width: 530px; height: 1px; background: #333; }
.bbar2 { display: none; }

.us4 .bg { padding: 10%; background: url(../img/brand/us_02.jpg) no-repeat center; background-size: cover; color: #fff; }
.us4 span { margin-right: 20px; font-size: 26px; font-weight: bold; }

.us5 h1 { margin-bottom: 10%; }
.us5 h3 { float: left; margin-right: 80px; font-weight: 900; }
.us5 .text2 { float: left; }
.text2 span { margin-right: 40px; font-size: 20px; font-weight: bold; }
.us5 .text3 { margin-left: 11%; }
.us5 .text4 { margin-left: 13%; }

.us6 .bg { padding: 10%; background: url(../img/brand/us_03.jpg) no-repeat center; background-size: cover; color: #fff; }
.box1 { position: relative; }
.bg .box1 .text1 { margin: 10% 0 2%; }
.fbar { position: absolute; top: 51%; width: 210px; height: 1px; background: #fff; }
.box1 p { margin-bottom: 0; }
.box2 { margin-top: 8%; }
.box2 p { margin-bottom: 2%; }
.us6 span { margin-right: 20px; font-size: 32px; font-weight: 900; vertical-align: middle; }
.box3 { margin-top: 8%; }
.box3 h3 { margin-bottom: 4%; font-size: 30px; }
.bleft { float: left; width: 60%; }
.bright { float: left; width: 40%; padding-top: 6%; text-align: right; }
.bright img { width: 25%; margin-left: 40px; }

.us7 { text-align: center; }
.us7 .bg { position: relative; padding: 5% 0 0; }
.cbar1 { position: absolute; left: 36.3%; top: 64%; width: 280px; height: 1px; background: #333; }
.us7 h1 { font-size: 50px; line-height: 2; }
.us7 p { font-size: 42px; }

/* ABOUT UNLIMEAT */
.un1 .bg { position: relative; padding: 10%; background: url(../img/brand/un_01.jpg) no-repeat center; background-size: cover; color: #fff; }
.bar1 { position: absolute; top: 42.5%; width: 550px; height: 1px; background: #fff; }
.bar2 { position: absolute; top: 49.5%; width: 380px; height: 1px; background: #fff; }
.bar3 { position: absolute; top: 56%; width: 560px; height: 1px; background: #fff; }

.un2 { text-align: center; }
.un2 img { margin: 80px 0 60px; }
.un2 .bg { text-align: left; }
.un2 span.usda { font-size: 20px; text-align: center; }
.dleft { position: relative; float: left; width: 50%; }
.lbar1 { position: absolute; top: 97%; width: 96px; height: 1px; background: #333; }
.dright { float: right; width: 50%; }
.num { margin-left: 15%; }
.dright h2 { font-size: 28px; }
.dright h3 { font-size: 24px; }
.dright p { font-size: 19px; }

.un3 .bg { padding: 10% 0 0; text-align: center; }
.un3 img { margin: 40px auto; }
.un3 h1 { text-align: left; }
.un3 h1.tit { margin-top: 80px; font-size: 32px; text-align: left; }
.sleft { float: left; width: 33%; margin-top: 40px; margin-left: 17%; text-align: left; }
.sleft span { font-size: 18px; }
.sright { float: left; width: 50%; margin-top: 40px; text-align: left; }
.sright span { font-size: 18px; }
.bg .s-1 { font-weight: 500; line-height: 2; }

.un4 .back { background: url(../img/brand/un_05.jpg) no-repeat center; background-size: cover; padding-top: 10%; text-align: center; }
.un4 h1 { margin-bottom: 8%; }
.un4 .tit2 { margin: 0 0 34% 10%; font-size: 38px; text-align: left; }
.info { padding: 8% 0 10% 10%; background: rgba(0,0,0,0.5); color: #fff; text-align: left; }
.info p { margin-bottom: 0; font-size: 24px; }
.info span { margin-right: 20px; }
.info p.tit_t { margin: 0 0 2% 4%; }

.un5 {  }
.un5 .bg { padding: 0; }
.un5 h1.text1 { margin: 10% 0 1%; }
.b5-1 {  }
.b5-1 img { float: left; width: 20%; }
.b5-1>div { float: left; width: 40%; }
.un5 span { line-height: 1.8; font-size: 28px; font-weight: 100; }
.un5 h4 { font-size: 22px; }
.b5-2 { margin-top: 3%; }
.b5-2 h4.t1 { margin-bottom: 15px; }
.b5-3 { margin-top: 7%; }
.b5-3 img { width: 70%; margin-top: 3%; }

.b6 { margin-bottom: 60px; }
.b6-1 h3 { display: inline-block; margin-bottom: 20px; padding: 0 15px 3px; font-size: 24px; background: #333; color: #fff; border-radius: 50px; }
.b6-1 p { margin-bottom: 0; font-size: 22px; }
.b6-1 span { margin-right: 20px; }
.b6-1 p.tit_t { margin: 0 0 1% 4%; }
.b6-1 p.t2 { margin-bottom: 1%; }

.un7 .bg { padding: 0 0 10%; }
.un7 .bg h1.text1 { margin: 10% 0 5%; }
.un7 .bg p { margin-bottom: 5%; }
.un7 .b7 { font-family: 'Quicksand', sans-serif; }
.b7-1 { float: left; width: 37%; font-weight: bold; }
.b7-2 { float: left; width: 15%; }
.b7-2 div { margin: 14% 0; }
.b7-2 .vegan { width: 65px; height: 15px; background: #00b451; }
.b7-2 .ovo { width: 65px; height: 15px; background: #eee04b; }
.b7-2 .lacto { width: 65px; height: 15px; background: #0047bb; }
.b7-2 .lacovo { width: 65px; height: 15px; background: #e15b35; }
.b7-3 { float: left; width: 40%; }
.un7 .b7 .b7-3 p { margin-bottom: 1%; font-size: 28px; font-weight: 100; }
.b7-3 span { margin-right: 20px; }


/* ＊＊＊＊＊＊＊＊＊＊ 반응형 ＊＊＊＊＊＊＊＊＊＊ */
/* Tablet */
@media all and (max-width:1024px) {
    /* ABOUT US */
    #section1 { margin-top: 60px; }
    .us1 .bg { width: 100%; }
    .mbar1 { top: 33.5%; }
    .mbar2 { top: 39.5%; }
    .bbar { top: 39.5%; }
    .us2 .bg { width: 95%; }
    .us3 .bg { width: 100%; }
    .us4 .bg { width: 100%; }
    .us5 .bg { width: 95%; }
    .us6 .bg { width: 100%; }
    .us7 .bg { width: 100%; }

    /* ABOUT UNLIMEAT */
    .un1 .bg { width: 100%; }
    .un2 .bg { width: 100%; }
    .un2 img { width: 100%; }
    .un3 .bg { width: 95%; }
    .un3 img { width: 100%; }
    .un4 .bg { width: 100%; }
    .un5 .bg { width: 95%; }
    .un6 .bg { width: 95%; }
    .un7 .bg { width: 95%; }

    .bar1 { top: 41.5%; }
    .bar3 { top: 56.5%; }
}

/* Mobile1 */
@media all and (max-width:770px) {
    /* ABOUT US */
    .bg p { font-size: 20px; }
    .mbar1 { top: 34.5%; }
    .mbar2 { top: 42%; }
    .us3 .bg p { width: 520px; }
    .us4 .bg p { font-size: 17px; }
    .us4 span { margin-right: 10px; font-size: 22px; }
    .us5 .text3 { margin-left: 14%; }
    .us5 .text4 { margin-left: 15%; }
    .us6 span { font-size: 26px; }
    .bright img { width: 32%; }
    .fbar { top: 55%; }
    .us7 .bg p { font-size: 34px; }
    .cbar1 { left: 31%; top: 63%; }

    /* ABOUT UNLIMEAT */
    .bar1 { top: 42%; }
    .bar2 { top: 51.5%; }
    .bar3 { top: 59.5%; }
}

/* Mobile2 */
@media all and (max-width:430px) {
    /* ABOUT US */
    .b_tab > div { padding: 0 0 6px; font-size: 18px; }
    .bg h1 { font-size: 30px; }
    .bg h1.text1 { font-size: 21px; }
    .bg p { font-size: 15px; }
    .mbar1 { width: 210px; top: 33%; }
    .mbar2 { width: 230px; top: 40%; }
    .bbar { width: 310px; top: 37.5%; }
    .fbar { top: 55%; }
    .cbar1 { left: 16%; top: 60%; }
    .spotlight { margin-bottom: 10%; }
    .spot  { margin-bottom: 0%; }
    .spotlight img { display: none; }
    h2 { font-size: 28px; }
    h3 { font-size: 24px; }
    .us3 .bg p { width: 340px; }
    .us4 .bg p { width: 310px; font-size: 15px; }
    .us4 span { display: none; }
    .us5 h3 { float: none; margin-bottom: 4%; }
    .us5 .text2 { float: none; margin-left: 5%; }
    .us5 .text3 { margin-left: 11%; }
    .us5 .text4 { margin-left: 11%; }
    .text2 span { margin-right: 20px; font-size: 18px; }
    .fbar { top: 38%; width: 120px; }
    .us6 span { display: none; }
    .box3 h3 { font-size: 22px; }
    .bleft { float: none; width: 100%; }
    .bright { float: none; width: 100%; }
    .bright img { width: 25%; margin-left: 0; margin-right: 40px; }
    .cbar1 { width: 180px; left: 28%; top: 52%; }

    /* ABOUT UNLIMEAT */
    .un1 .bg p { width: 330px; }
    .bar1 { width: 320px; top: 41.5%; }
    .bar2 { width: 220px; top: 50.5%; }
    .bar3 { width: 325px; top: 58.5%; }
    .dleft { float: none; width: 100%; margin-bottom: 20px; }
    .lbar1 { width: 75px; }
    .dright { float: none; width: 100%; }
    .num { margin-left: 5%; }
    .sleft { margin-top: 0; margin-left: 5%; }
    .sright { margin-top: 0; margin-left: 10%; }
    .un4 .tit2 { font-size: 21px; }
    .info p.tit_t { margin: 0 0 2% 9%; }
    .b5-1 img { display: none; }
    .b7-1 { width: 55%; }
    .b7-1 h3 { font-size: 19px; }
    .b7-2 { width: 40px; }
    .b7-2 div { margin: 23% 0; }
    .b7-2 .vegan { width: 40px; }
    .b7-2 .ovo { width: 40px; }
    .b7-2 .lacto { width: 40px; }
    .b7-2 .lacovo { width: 40px; }
    .un7 .b7 .b7-3 p { font-size: 19px; }
    .b7-3 { float: right; width: 31%; }
    .b7-3 span { margin-right: 10px; }
    
}

/* Mobile3 */
@media all and (max-width:380px) {
    /* ABOUT US */
    .bg h1 { font-size: 28px; }
    .bg h1.text1 { font-size: 22px; font-weight: 700; }
    h2 { font-size: 24px; }
    h3 { font-size: 20px; }
    .mbar1 { display: none; }
    .mbar2 { display: none; }
    .bbar { display: none; }
    .bbar2 { display: none; }
    /* .bbar2 { display: inline-block; position: absolute; top: 44.5%; width: 110px; height: 1px; background: #333; } */
    .fbar { top: 40%; width: 130px; }
    .us3 .bg p { width: 100%; }
    .us4 .bg p { width: 100%; }
    .us5 .text3 { margin-left: 13%; }
    .us5 .text4 { margin-left: 12%; }
    .us7 .bg p { font-size: 26px; }
    .cbar1 { width: 160px; left: 28%; top: 56%; }

    /* ABOUT UNLIMEAT */
    .bar1 { display: none; }
    .bar2 { display: none; }
    .bar3 { display: none; }
    .un1 .bg p { width: 100%; }
    .lbar1 { width: 65px; }
    .dright h2 { font-size: 24px; }
    .dright h3 { font-size: 20px; }
    .un2 span.usda { font-size: 12px; }
    .un3 h1.tit { font-size: 24px; }
    .b7-1 h3 { font-size: 17px; }
    .un7 .b7 .b7-3 p { font-size: 17px; }
    .b7-2 { width: 30px; }
    .b7-2 div { margin: 28% 0; }
    .b7-2 .vegan { width: 30px; height: 10px; }
    .b7-2 .ovo { width: 30px; height: 10px; }
    .b7-2 .lacto { width: 30px; height: 10px; }
    .b7-2 .lacovo { width: 30px; height: 10px; }
    
}

/* Mobile4 */
@media all and (max-width:330px) {
    /* ABOUT US */
    .b_tab > div { font-size: 16px; }
    .us5 .text4 { margin-left: 13%; }

    /* ABOUT UNLIMEAT */
    .b7-1 { width: 80%; }
    .b7-1 h3 { font-size: 20px; }
    .b7-2 { float: right; width: 50px; }
    .b7-2 div { margin: 23% 0; }
    .b7-2 .vegan { width: 50px; height: 14px; }
    .b7-2 .ovo { width: 50px; height: 14px; }
    .b7-2 .lacto { width: 50px; height: 14px; }
    .b7-2 .lacovo { width: 50px; height: 14px; }
    .b7-3 { display: none; }
    
    
}