/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small,
strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td, input, textarea, button,
article, aside, canvas, details, embed, figure, figcaption, footer, header, menu,
nav, output, ruby, section, summary, time, mark, audio, video
 {margin:0;padding:0;border:0;}
article, aside, details, figcaption, figure, footer, header, menu, nav, section {display: block;}
html {height:auto;-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none; }
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: '';content:none;}
table {border-collapse:collapse;border-spacing:0;}
a {text-decoration:none;color:inherit;}
a:hover {text-decoration:none;}
legend, caption, hr {display:none;}
th {font-weight: inherit}
em {font-style:normal;}
/*img {vertical-align:top;max-width:100%;}*/
input {vertical-align:middle;}
/* p,h3,h2,h1 {letter-spacing: normal;}
section {width:100%;text-align: center;}
body {width: 100%;height: 100%; color:#555;background-color: #fff; } */
video {object-fit: fill;}

#header {position: relative; width: 100%;}
#header .header-container{ position: fixed; width: 100%; height: 80px; display: flex; flex-direction: row;justify-content: center; z-index: 1; }
#header .header-container.dark{background-color: rgba(0, 0, 0, 0.5); z-index: 3;}
#header .header-container.light{background-color: #fff; z-index: 3; border-bottom: 1px solid #ececec;}
#header .header-inner{width:1300px; display: flex; justify-content: space-between;}
#header .brand {width: 132px;position:relative;z-index:10;}
#header .brand a {width: 132px;display: block;}
#header .brand a span {overflow: hidden;padding-top: 0;font-size: 0;display: block;width:132px; height:44px; text-indent:-5000px; background:url('../images/logo.png') no-repeat 0 center;background-size:132px; margin-top: 18px;}
#header .light .brand a span {overflow: hidden;padding-top: 0;font-size: 0;display: block;width:132px; height:44px; text-indent:-5000px; background:url('../images/logo_s.png') no-repeat 0 center;background-size:132px; margin-top: 18px;}

#header #nav{display: flex;}
#header #nav .gnb{display: flex; flex-direction: row; height: 100%; text-align: center;}
#header #nav .gnb li {width: 120px;height: 100%;}
#header #nav .gnb li a {
    display: block;
    position: relative;
    height: 100%;
    -webkit-transition: opacity 250ms ease-out;
    -moz-transition: opacity 250ms ease-out;
    -ms-transition: opacity 250ms ease-out;
    -o-transition: opacity 250ms ease-out;
    transition: opacity 250ms ease-out;
}

#header #nav .gnb li a:before {
    content: '';
    background-color: #dd1d21;
    height: 3px;
    position: absolute;
    left: 0;
    bottom: 0%;
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
    width: 0;
}

#header #nav .gnb li a span {
    font-size: 18px;
	font-weight:600;
    color: #fff;
    display: block;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    white-space: nowrap;
}

#header .light #nav .gnb li a span {
    font-size: 18px;
	font-weight:600;
    color: #000000;
    display: block;
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    white-space: nowrap;
}

#header #nav .gnb li:hover a span{color:#fff; font-weight:600;}
#header .light #nav .gnb li:hover a span{color:#000000; font-weight:600;}
#header #nav .gnb li a:hover:before{width: 100%;}

#header #mainSlider{position: relative;  height: 630px; }
#mainSlider ul .cover{position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0, 0, 0, 0.45); z-index:1}
#mainSlider ul.imgList li{position:relative; height:630px;}
#mainSlider ul.imgList li.slide01{background:url('../images/main_visual_01.jpg') no-repeat center center; background-size:cover; display: flex;
 justify-content: center;}
#mainSlider ul.imgList li.slide02{background:url('../images/main_visual_02.jpg') no-repeat center center; background-size:cover; display: flex;
 justify-content: center;}
#mainSlider ul.imgList li.slide03{background:url('../images/main_visual_03.jpg') no-repeat center center; background-size:cover; display: flex;
 justify-content: center;}
#mainSlider ul.imgList li .caption {position: relative;height: 100%;z-index: 1; width: 1300px; display: flex;justify-content: center;flex-direction: column;}
#mainSlider ul.imgList li .caption.copy01 .visualTxt {
    display: block;
    font-size: 70px;
    font-weight: 500;
	color: #fff;
	z-index: 1;
	letter-spacing: -2px;
}
#mainSlider ul.imgList li .caption.copy01 .visualTxt span{display: block; font-size: 38px; line-height: 3; font-weight: 300;}
#mainSlider .swiper-btn-wrap{display: flex; justify-content: center; }
#mainSlider .swiper-pagination span {
  display: inline-block;
  background: #fff;
  width:120px;
  height:4px;
  opacity: 0.4; margin-right: 2px;
}
#mainSlider .swiper-pagination span.active {
  opacity: 1;
  background: #fff;
}

#mainSlider .swiper-pagination{width:1300px; display: flex;  position: absolute;
    bottom: 100px;
    z-index: 1;}

#mainSlider:hover .swiper-button-prev, #mainSlider:hover .swiper-button-next{opacity: 1; z-index:21;}

.subvisual {width: 100%;position: relative;padding-top: 150px;}
.subvisual .v_top dl dt::after {
    content: "";
    display: block;
    position: absolute;
    bottom: calc(100% + 1px);
    left: 0;
    transform-origin: 0 0;
    width: 26px;
    height: 5px;
    transition-duration: 0.2s;
    transform: scaleX(1);
    background-color: #dd1d21;
    animation: point 0.2s;
}

.subvisual .v_top {width: 100%;display: flex;align-items: flex-end;}
.subvisual .v_top dl {margin-right: 45px;}

.subvisual .v_top dl dt {font-size: 17px;letter-spacing: -0.045em;font-weight: 500;position: relative;color: #777777;}
.subvisual .v_top dl dd {font-size: 50px;letter-spacing: -0.045em;font-weight: 800;margin-top: 10px;color: #000;line-height: 1;}
.subvisual .v_top dl dd span {font-size: 50px;}
.subvisual .sub_bgwrap {width: 100%;position: relative;/*margin-top: 140px;*/}

.subvisual .sub_bgwrap h1.subbgtit {font-size: 38px;letter-spacing: -0.045em;font-weight: 700;position: absolute;top: 40%;left: 50%;transform: translateX(-50%);width: 100%;max-width: 1300px; text-transform:uppercase;}

.subvisual .sub_bgwrap .sub_bg {padding-top: 50px;}
.subvisual .sub_bgwrap h1.subbgtit._w {color: #fff;}
.subvisual .sub_bgwrap .sub_bg .maxwrap {width: 100%;height: 220px;/*position: absolute;top: -100px;left: 0;z-index: -1;*/}
.subvisual .sub_bgwrap .sub_bg .maxwrap .bg_max01 {width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;animation: blurs 1s; background-image:url('../images/sub_visual_01.jpg')}
.subvisual .sub_bgwrap .sub_bg .maxwrap .bg_max02 {width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;animation: blurs 1s; background-image:url('../images/sub_visual_02.jpg')}
.subvisual .sub_bgwrap .sub_bg .maxwrap .bg_max03 {width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;animation: blurs 1s; background-image:url('../images/sub_visual_03.jpg')}
.subvisual .sub_bgwrap .sub_bg .maxwrap .bg_max04 {width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;animation: blurs 1s; background-image:url('../images/sub_visual_04.jpg')}
.subvisual .sub_bgwrap .sub_bg .maxwrap .bg_max05 {width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;animation: blurs 1s; background-image:url('../images/sub_visual_05.jpg')}
.subvisual .subTitle{width: 1300px; display: flex; margin: 0 auto; }
.subvisual .v_top>p {font-size: 18px;font-weight: 600;letter-spacing: -0.045em;line-height: calc(30 / 25);color: #979797;}


#header .gnb-sub-menus {
    position: fixed;
    left: 0;
    right: 0;
    top: 80px;
    z-index: 2;
    font-size: 0;
    /*visibility: hidden;*/
    -webkit-transition: height 1200ms cubic-bezier(0.86, 0, 0.07, 1), visibility 1200ms ease-out;
    -moz-transition: height 1200ms cubic-bezier(0.86, 0, 0.07, 1), visibility 1200ms ease-out;
    -ms-transition: height 1200ms cubic-bezier(0.86, 0, 0.07, 1), visibility 1200ms ease-out;
    -o-transition: height 1200ms cubic-bezier(0.86, 0, 0.07, 1), visibility 1200ms ease-out;
    transition: height 1200ms cubic-bezier(0.86, 0, 0.07, 1), visibility 1200ms ease-out;
    /*overflow: hidden;*/
}


#header .gnb-sub-menus .gnb-sub-menus-container {background: #fff;position: relative; border-bottom: 1px solid #cecece;}


#header .gnb-sub-menus .menus {position: relative;width: 1300px;margin: 0 auto;}
#header .gnb-sub-menus .menus > ul {display: flex;justify-content: flex-end;}
#header .gnb-sub-menus .menus > ul > li {width: 120px;}

#header .gnb-sub-menus .menus .sub-menu {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 100%;
    padding: 20px 0;
    border-left: 1px solid #dedede;
    -webkit-transition: background-color 300ms ease-out;
    -moz-transition: background-color 300ms ease-out;
    -ms-transition: background-color 300ms ease-out;
    -o-transition: background-color 300ms ease-out;
    transition: background-color 300ms ease-out;
    position: relative;
}

#header .gnb-sub-menus .menus .sub-menu:before {
    content: '';
    background-color: #222;
    height: 2px;
    position: absolute;
    left: 0;
    top: -2px;
    -webkit-transition: all 250ms ease-out;
    -moz-transition: all 250ms ease-out;
    -ms-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
    width: 0;
    z-index: 99;
}


#header .gnb-sub-menus .menus > ul > li:last-child .sub-menu {border-right: 1px solid #dedede;}
#header .gnb-sub-menus .menus .sub-menu a {display: block;padding: 0 0 0 25px;text-align: left;cursor: pointer;	}
#header .gnb-sub-menus .menus .sub-menu a span {font-size: 16px;display: inline-block;position: relative;font-weight:500;color:#343434;}
#header .gnb-sub-menus .menus .sub-menu a:hover span {color: #cf0d12;font-weight: 600;transition-duration: 0.2s;}

#header .gnb-sub-menus .menus .sub-menu li ul {padding:5px 0;}
#header .gnb-sub-menus .menus .sub-menu li ul li{}
#header .gnb-sub-menus .menus .sub-menu li ul li a{padding: 0 1.2rem;}
#header .gnb-sub-menus .menus .sub-menu li ul li a span{position:relative; font-size:13px; padding-left:14px; color:#515151; font-weight:400;}
#header .gnb-sub-menus .menus .sub-menu li ul li a span:after {display:none;}

#header .gnb-sub-menus .menus .sub-menu li ul li a span:before{position:absolute; left:0; top:0; content:"-"; color:#000;}