@charset "utf-8";
body {width:100%; min-width:1240px;}
#body_layout{overflow: hidden;width:100%; min-width:1240px;z-index: auto;margin-top: -110px;}
#mquick {z-index:10;position: fixed;top: 50%;right: 30px;padding: 25px 15px 0;margin-top: -170px;}
#mquick a {display: block;width:10px;height:10px;margin: 0 auto 15px;overflow:hidden;border:2px solid #fff;border-radius: 50%;box-shadow: 6px 2px 3px 0px rgba(0,0,0,0.3);transform-origin: center;transition: all .3s;}
#mquick a span {font-size:0;}
#mquick a.ov {width:16px;height:16px;background-color:#faa61a;border-color:#faa61a}
.slick-slider{ position: relative; display: block; box-sizing: border-box;}
.slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;z-index: 9;}
.slick-list:focus{outline: none; }
.slick-list.dragging{cursor: pointer; cursor: pointer; }
.slick-slider .slick-track,
.slick-slider .slick-list{ transform: translate3d(0, 0, 0); }
.slick-track{position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; }
.slick-track:before,
.slick-track:after{display: table; content: ''; }
.slick-track:after{clear: both; }
.slick-loading .slick-track{visibility: hidden; }
.slick-slide{display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide{float: right; }
.slick-slide img{display: block; }
.slick-slide.slick-loading img{display: none; }
.slick-initialized .slick-slide{display: block; }
.slick-loading .slick-slide{visibility: hidden; }
.slick-vertical .slick-slide{display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden {display: none; }
.scene {overflow:hidden;position: relative;height:972px;margin: 0 auto;}
.scene .layout{position: relative;margin:0 auto;padding: 150px 0;max-width:1000px;height: 100%;}
.scene .layout .copy_box { position: relative;width: 100%; color: #fff; z-index: 999;text-align: center; }
.scene .layout .copy_box > span { display: block; font-size: 18px; font-weight: bold; font-family: "Arial"; line-height: 100%; text-align: center; letter-spacing: 1px; }
.scene .layout .copy_box > strong {display: block;margin-top: 10px;letter-spacing: -.6px;font-size: 40px;line-height: 100%;text-align: center;text-transform: uppercase;}
.scene .layout .copy_box > p { display: block; margin-top: 20px; letter-spacing: -.4px; font-size: 20px; text-align: center; line-height: 1.2; }
.bgcover {background-size: cover}
#scene1{position: relative;width:100%;/* height: 100%; */}
#scene1 .layout{width:100%;height: 100%;max-width: none;padding:0;min-height: 100vh;position: static;}
#scene1 .layout .scene_video {position: absolute;top: 0;left: 0;z-index: 1;min-height: 100vh;min-width: 100%;width: 100%;height: 100%;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;}
#scene1 .layout .scene_video video {position: absolute;top: 50%;left: 50%;min-width: 100%;min-height: 100%;width: auto;height: auto;z-index: 2;background-size: cover;transform: translate(-50%, -50%);object-fit: cover;}
#scene1 .layout .scene_video:after{content:"";display: block;position: absolute;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);z-index:3}
#scene1 .layout .copy_box {color: #fff;margin-top: 400px;height: 210px;position: relative;z-index:4;width: 100%;text-align: center;}
#scene1 .layout .copy_box > span { font-size: 30px; }
#scene1 .layout .copy_box > strong {margin-top: 10px;font-size: 42px;font-weight: bold;letter-spacing: 0px;}
#scene1 .layout .copy_box > p {margin-top: 25px;letter-spacing: 0px;font-size: 30px;line-height: 120%;}
#scene1 .layout .copy_box > p > span {}
#scene2{background-color:#27313b;}
#scene2 .layout{width:100%;height: 100%;max-width: none;padding:0;min-height: 100vh;position: static;}
#scene2 .layout .copy_box{margin-top:200px}
#scene2 .sec_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; }

#scene2 .sec_2_1 .sec_bg { background: url(/images/brand/main/bg_sec_2_1.jpg);background-size:cover; }
#scene2 .sec_2_2 .sec_bg { background: url(/images/brand/main/bg_sec_2_2.jpg);background-size:cover;}
#scene2 .sec_2_3 .sec_bg { background: url(/images/brand/main/bg_sec_2_3.jpg);background-size:cover;}
#scene2 ul { position: absolute; top: 0; left: 0; width: 300%; height: 100%; }
#scene2 ul:after { content: ""; display: block; clear: both; }
#scene2 ul li { float: left; position: relative; width: 33.33%; height: 100%; }
#scene2 ul li .content { position: absolute; top: 50%; left: 50%; margin: -120px 0 0 -500px; width: 1000px; height: 240; z-index: 1; }
#scene2 ul li .content:after { content: ""; display: block; colear: both; }
#scene2 ul li .content .img { float: left; width: 550px; height: 100%; text-align: center; }
#scene2 ul li .content .cntl_box { float: left; padding: 22px 0 0 0; width: 407px; }
#scene2 ul li .content .cntl_box strong { font-family: "Montserrat"; color: #22150d; font-size: 56px; font-weight: bold; letter-spacing: -.6px; }
#scene2 ul li.sec_2_2 .content .cntl_box strong { color: #dd5610; font-size: 56px; }
#scene2 ul li.sec_2_3 .content .cntl_box strong { color: #233d45; font-size: 56px; }
#scene2 ul li .content .cntl_box span { margin-left: 5px; font-family: "Montserrat"; color: #22150d; font-size: 20px; font-weight: bold; letter-spacing: -.6px; }
#scene2 ul li .content .cntl_box p { margin-top: 28px; font-size: 15px; color: #4c443e; line-height: 160%; }
#scene2 ul li.sec_2_2 .content .cntl_box p { color: #4c443e; }
#scene2 ul li.sec_2_3 .content .cntl_box p { color: #2f515b; }

#scene2 ul li .content .cntl_box .btn_w { margin-top: 35px;}
#scene2 ul li .content .cntl_box .btn_w * {vertical-align:middle}
#scene2 ul li .content .cntl_box .more {display:inline-block;padding: 12.5px 40px 12.5px 18px;width: 150px;height: 47px;margin-right:10px;background: url(/images/brand/main/ico_arr_more1.png) no-repeat right 18px center;border: 1px solid #202020;font-size: 15px;color: #202020;cursor: pointer;position: relative;}
#scene2 ul li .content .cntl_box .more:before,
#scene2 ul li .content .cntl_box .more:after{display:none}
#scene2 ul li .content .cntl_box .down { padding: 12.5px 40px 12.5px 18px; width: 150px; height: 47px; margin-right:10px;background: url(/images/brand/main/ico_arr_down1.png) no-repeat right 18px center; border: 1px solid #202020; font-size: 15px; color: #202020; cursor: pointer; }
#scene2 ul li.sec_2_2 .content .cntl_box .more { color: #202020; border-color: #202020; background: url(/images/brand/main/ico_arr_more1.png) no-repeat right 18px center; }
#scene2 ul li.sec_2_3 .content .cntl_box .more { color: #2f515b; border-color: #2f515b;background: url(/images/brand/main/ico_arr_more2.png) no-repeat right 18px center; }
#scene2 .cntr { position: absolute; top: 50%; left: 50%; margin: -26.5px 0 0 -565px; width: 1130px; height: 53px; }
#scene2 .cntr:after { content: ""; display: block; clear: both; }
#scene2 .cntr button { display: block; width: 52px; height: 53px; font-size: 0px; cursor: pointer; }
#scene2 .cntr button.prev { float: left; background: url(/images/brand/main/ico_prev.png) no-repeat center; }
#scene2 .cntr button.next { float: right; background: url(/images/brand/main/ico_next.png) no-repeat center; }
#scene2 nav {position: absolute;bottom: 160px;left: 50%;margin-left: -56px;width: 112px;height: 2px;background: url(/images/brand/main/bg_sub_navi.png) no-repeat left 100%;}
#scene2 nav:after { content: ""; display: block; clear: both; }
#scene2 nav > a { display:inline-block;float: left; margin-left: 54px; width: 1px; height: 1px; cursor: pointer; }
#scene2 nav > a:first-child { margin-left: 0px; }
#scene2 nav > a .circle {position: relative;top: -14px;left: -4.5px;width: 9px;height: 8px;background: url(/images/brand/main/ico_sub_navi_off.png) no-repeat center;}
#scene2 nav > a.active .circle, 
#scene2 nav > a:hover .circle {top: -15.5px;left: -16px;width: 31px;height: 32px;background: url(/images/brand/main/ico_sub_navi_on.png) no-repeat center;}
#scene2 nav > a span {display: none;position: relative;left: -50px;top: -19px;width: 100px;text-align: center;color: #fff;font-size: 16px;font-family: "Montserrat";}
#scene2 nav > a.active span { display: block }




#scene3{background-image:url(/images/brand/main/bg_sec_3.jpg);}
#scene3 .copy_box > strong { margin: 15px auto 10px; width: 585px; height: 72px; font-size: 0px; background: url(/images/brand/main/img_copy_sec_3.png) no-repeat; }
#mainRolls{position:relative;width:100%;margin-top: 100px;}
#mainRolls .slick-list{overflow: inherit;}
#mainRolls .slick-arrow{position:absolute; bottom:-13%;width:27px;height:49px;cursor:pointer;font-size:0;z-index:10; transition:all 300ms}
#mainRolls .slick-arrow:before,
#mainRolls .slick-arrow:after{display:none;}
#mainRolls .slick-arrow.slick-prev{left:30%; background:url(/images/brand/main/ico_prev2.png) no-repeat}
#mainRolls .slick-arrow.slick-next{right:30%;background:url(/images/brand/main/ico_next2.png) no-repeat}
#mainRolls .slick-slide {float: none;display: inline-block;vertical-align:middle;margin:10px;transition: all 0.3s ease;text-align: center;}
#mainRolls .slick-slide *{transition: width 0.3s ease;}
#mainRolls .slick-slide .images_fade{position:relative;width:100%;}
#mainRolls .slick-slide .images_fade .dash_circle { width: 156px; height: 156px; text-align: center;}
#mainRolls .slick-slide .images_fade .dash_circle .circle { position: relative; display: inline-block; position: relative; padding: 20%; width: 156px; height: 156px; background-color:#fff;text-align: center; }
#mainRolls .slick-slide .images_fade .dash_circle .circle img { width: 100%; }
#mainRolls .slick-slide .images_fade .dash_circle .circle span { display: none; }

#mainRolls .slick-slide.slick-current .images_fade .dash_circle,
#mainRolls .slick-slide.slick-center .images_fade .dash_circle { width: 375px; height: 375px;border:2px dashed #ddd;border-radius: 50%;}
#mainRolls .slick-slide.slick-current .images_fade .dash_circle .circle,
#mainRolls .slick-slide.slick-center .images_fade .dash_circle .circle{margin:30px;position: relative; width: 315px; height: 315px;background: url(/images/brand/main/img_circle_on.png) no-repeat; background-size: 100%; }
#mainRolls .slick-slide.slick-current .dash_circle .circle span, 
#mainRolls .slick-slide.slick-center .dash_circle .circle span { display: block; position: absolute; bottom: -88px; left: 50%; margin-left: -110px; width: 220px; color: #fff; font-size: 20px; letter-spacing: -.6px; }

#scene4{background-image:url(/images/brand/main/bg_sec_4.jpg);}
#scene4 .copy_box > span{color:#f48b07;}
#scene4 .copy_box > strong{margin: 15px auto 50px;width:521px;height: 87px;font-size: 0px; background: url(/images/brand/main/img_copy_2.png) no-repeat;}
#scene4  .market { margin: 50px auto; width: 222px; height: 298px; }
#scene4  .market a{display:block;width:100%;height:100%;font-size:0;background: url(/images/brand/main/ico_gomanaru.png) no-repeat;}