/* BASIC css start */
#header {position: fixed; top: 0; left: 0; }
#header .WH {display:block !important; } 
#header .BK {display:none !important; }
#header .header_btm #hd_menu, #header .header_top .gnb li #hd_search_box .search_close_btn{color:#fff !important; }
#header .header_top .gnb li #hd_search_box input {border-color:#fff !important}

#header.showBK .WH {display:none!important; }
#header.showBK .BK {display:block!important; }
#header.showBK .header_btm #hd_menu, #header.showBK .header_top .gnb li #hd_search_box .search_close_btn{color:#000 !important; }
#header.showBK .header_top .gnb li #hd_search_box input {border-color:#000 !important}

#header.showWH .WH {display:block!important; }
#header.showWH .BK {display:none!important; }
#header.showWH .header_btm #hd_menu, #header.showWH .header_top .gnb li #hd_search_box .search_close_btn{color:#fff !important; }
#header.showWH .header_top .gnb li #hd_search_box input {border-color:#fff !important}



#header.headroom--not-top::before {display:none; }


#contentWrapper {background:#000}
#footer {margin-top:0 !important;  background:#000 !important}

.title_box {max-width:1400px; margin:0 auto;  }
.white {color: white;font-weight:400;font-size:64px;display:inline-block;}
.grey {color:rgba(255,255,255,0.5); font-size:24px;font-weight:300; line-height:1.5}
.point {color:#EB0081}

.one {position:relative;}
.one img {width:100%;}
.one iframe {width:100%; height:100% !important; position:absolute; top:0; left:0; }

.two { background-color:#fff; background-image:url(/design/jsmbeauty/img/brand/icon_line.png); width: 100%; height: 100vh; background-repeat: no-repeat; background-position: center; background-size: contain; text-align: center; display: flex; justify-content: center; align-items: center;}
.two span { font-weight: bold; }
.two .two_img { margin-bottom: 48px; display:flex; justify-content: center; align-items: flex-end; font-size: 24px; }
.two .two_img img {margin-right:10px; margin-bottom:5px} 
.two .two_info .two_p {font-size: 24px; margin-bottom: 48px; line-height: 1.5; color: #222; font-weight:500}


.three {width: 100%; position: relative;margin: 0 auto;padding:240px 0;}
.three .title_box {display:flex;justify-content: flex-start;align-items: flex-end; padding-bottom:96px }
.three .title_box .white img {height:74px}
.three .title_box .grey {margin-left: 22px;font-weight:500;line-height: 1;}
.three .three_pic {}
.three .pic_one {width:50%; float: left;}
.three .pic_two {width:25%;float: left;} 
.three .pic_three {width:25%;float: left;}
.three .three_pic img {width:100%}


.four { position:relative; }
.four:before {content:"";display:inline-block;width:100%;height:100%;background: url(/design/jsmbeauty/img/brand/icon_line2.png)no-repeat top right/100% auto;position:absolute;top: -866px;left:0}
.four .title_box .white {display:block; margin-bottom:64px; } 
.four .title_box .white span {display:block; }
.four .four_middle {max-width:1400px; margin:96px auto 0; font-size:0}
.four .four_middle li {color:#fff;display:inline-block; vertical-align:top; padding:16px 48px; background:rgba(255,255,255,0.1); margin-right:16px; margin-bottom:16px  }
.four .four_middle li span {font-weight:200; color: #fff; font-size:24px; }
.four .four_middle li span.title {font-weight:bold; color: #fff; margin-right: 32px;}


.four_two {max-width:1400px; margin:0 auto; padding:192px 0}
.history_list  {margin-top:181px; position:relative; }
.history_list:after {content: '';width: 1px;height: 100%;position: absolute;top: 15px;left:40%;background: #fff;}
.history_list > li {}
.history_list > li::after {content: ""; display: block; clear: both;}
.history_list > li .year {float: left;width: 40%;box-sizing: border-box;font-size: 144px;color: rgba(255,255,255,0.3);font-weight: bold;line-height: 1; padding-left:9%}
.history_list > li .month {float: right;width: 60%;padding-bottom: 150px;position: relative;box-sizing: border-box;margin-top: 61px;}
.history_list > li .month li {font-size: 24px;margin-bottom:45px;color: #fff;display: flex;align-items: center;justify-content: flex-start;position: relative;padding-left: 50px;}
.history_list > li .month li:before {content:"";display:inline-block;position:absolute;top: 10px;left: -3px;width: 7px;height: 7px;background:#fff;border-radius:100%}
.history_list > li .month li span {font-weight: bold;margin-right: 40px; width:56px}



@media all and (max-width:1400px) {
    .title_box, .four .four_middle {box-sizing:border-box; padding:0 20px; }

    
} 


/* BASIC css end */