@charset "utf-8";
/*body {overflow-x:hidden;}*/
#container #content.main {}
#section01 {background:url(/eng/img/00_main/main_vis1.jpg) center center no-repeat; background-size:cover; width:100%;}
#section02 {background:url(/eng/img/00_main/main_vis2.jpg) center center no-repeat; background-size:cover; width:100%;}
#section03 {background:url(/eng/img/00_main/main_vis3.jpg) center center no-repeat; background-size:cover; width:100%;}
#section04 {background:url(/eng/img/00_main/main_vis4.jpg) center center no-repeat; background-size:cover; width:100%;}
#section05 {width:100%;}

#anchor_menu {position:fixed; top:50%; right:20px; z-index:30; text-align:right; transform:translateY(calc(-50% + 30px));}
#anchor_menu li {position:relative;}
#anchor_menu li a {display:inline-block; padding:6px 0; height:36px;}
#anchor_menu li a::before {content:''; background:#ddd; width:12px; height:12px; position:absolute; right:5px; top:50%; transform:translateY(-50%);}
#anchor_menu li a::after {content:''; background:transparent; width:20px; height:20px; border:1px solid transparent; position:absolute; right:0; top:50%; transform:translateY(-50%);}

#anchor_menu li.active a::before {background:#3793aa;}
#anchor_menu li.active a::after {border:1px solid #3793aa;}
#anchor_menu li a span {padding-right:30px; font-size:14px; display:none;}
#anchor_menu li.active a span {display:block; color:#333; font-weight:bold;}
#anchor_menu.fc_white li.active a span {color:#fff;}

#section01 .bg_01 {position:absolute; top:50%; left:50%; background:rgba(55, 147, 170, 0.3); width:250px; height:470px; transform:translate(-50%, 0); transition:all 0.8s ease-in-out; transition-delay:0s; opacity:0;}
#section01 .fp-scroller {height:100%;}
#section01.fp-completely .bg_01 {transform:translate(-50%, -50%); opacity:1; transition:all 1.5s ease-in-out; transition-delay:0.3s;}
#section01 .main_title {font-size:90px; transition:all 0.8s ease-in-out; transition-delay:0s; opacity:0; transform:translateX(100px);}
#section01.fp-completely .main_title {transform:translateX(0); opacity:1; transition:all 1.5s ease-in-out; transition-delay:0.7s;}
#section01 .contents {transition:all 0.8s ease-in-out; transition-delay:0s; opacity:0; transform:translateX(100px);}
#section01.fp-completely .contents {transform:translateX(0); opacity:1; transition:all 1.5s ease-in-out; transition-delay:1.3s;}

#section02 .title {font-size:32px; margin-bottom:30px;}
#section02 .prd_list {width:100%;}
#section02 .prd_list li {background:rgba(255,255,255,0.5); /*border:1px solid rgba(255,255,255,0.5);*/ width:calc(33.33333333% - 20px); text-align:center; margin:0 20px 20px 0; float:left;}
#section02 .prd_list li:nth-child(3n) {margin:0 0 20px 0;}
#section02 .prd_list li:nth-child(3n+1) {clear:both;}
#section02 .prd_list li a {display:block; padding:30px 10px; border:1px solid rgba(255,255,255,0.5); min-height:260px;}
#section02 .prd_list li a:hover {border:1px solid #3793aa; transition:all 0.3s ease-in-out;}
#section02 .prd_list li img {display:block; margin:auto; width:85px;}
#section02 .prd_list li .title {font-size:20px; margin:10px 0;}
#section02 .prd_list li .contents {font-size:14px; line-height:1.5;}

#section02 .animate1 {transform:translateY(30px); opacity:0; transition:all 0.8s ease-in-out; transition-delay:0s;}
#section02.active .animate1 {transform:translateY(0px); opacity:1;}
#section02 .animate2 {transform:translateY(30px); opacity:0; transition:all 0.8s ease-in-out; transition-delay:0s;}
#section02.active .animate2 {transform:translateY(0px); opacity:1; transition-delay:0.5s;}
#section02.active .animate2:nth-child(2) {transition-delay:0.8s;}
#section02.active .animate2:nth-child(3) {transition-delay:1.1s;}
#section02.active .animate2:nth-child(4) {transition-delay:1.4s;}
#section02.active .animate2:nth-child(5) {transition-delay:1.7s;}
#section02.active .animate2:nth-child(6) {transition-delay:2.0s;}
#section02 .animate3 {transform:translateY(30px); opacity:0; transition:all 0.8s ease-in-out; transition-delay:0s;}
#section02.active .animate3 {transform:translateY(0px); opacity:1; transition-delay:2.3s;}

#section03 h2.title {font-size:36px; color:#fff; margin-bottom:50px;}
#section03 .txt_wrap {text-align:left; background:#fff;}
#section03 .v_img_board2 .board_list {border:1px solid transparent;}

#section03 .animate1 {transform:translateY(30px); opacity:0; transition:all 0.8s ease-in-out; transition-delay:0s;}
#section03.active .animate1 {transform:translateY(0px); opacity:1;}
#section03 .animate2 {transform:translateY(30px); opacity:0; transition:all 0.8s ease-in-out; transition-delay:0s;}
#section03.active .animate2 {transform:translateY(0px); opacity:1; transition-delay:0.5s;}
#section03.active .animate2:nth-child(2) {transition-delay:0.8s;}
#section03.active .animate2:nth-child(3) {transition-delay:1.1s;}
#section03.active .animate2:nth-child(4) {transition-delay:1.4s;}
#section03.active .animate2:nth-child(5) {transition-delay:1.7s;}
#section03.active .animate2:nth-child(6) {transition-delay:2.0s;}
#section03.active .animate2:nth-child(7) {transition-delay:2.3s;}


#section04 h2.title {font-size:36px; margin-bottom:50px;}
#section04 .content_wrap {height:594px;}
#section04 .bg_02 {background:url(/eng/img/00_main/main4_1.jpg) center center no-repeat; background-size:cover;}

#section04 .animate1 {transform:translateY(50px); opacity:0; transition:all 0.5s ease-in-out; transition-delay:0s;}
.fp-viewing-RND #section04 .animate1, .fp-viewing-section5 #section04 .animate1 {transform:translateY(0px); opacity:1;}
#section04 .animate2 {transform:translateY(50px); opacity:0; transition:all 0.5s ease-in-out; transition-delay:0s;}
.fp-viewing-RND #section04 .animate2, .fp-viewing-section5 #section04 .animate2 {transform:translateY(0px); opacity:1; transition-delay:0.5s;}
#section04 .animate3 {transform:translateX(50px); opacity:0; transition:all 0.5s ease-in-out; transition-delay:0s;}
.fp-viewing-RND #section04 .animate3, .fp-viewing-section5 #section04 .animate3 {transform:translateX(0px); opacity:1; transition-delay:0.8s;}
.fp-viewing-RND #section04 .animate3:nth-child(2), .fp-viewing-section5 #section04 .animate3:nth-child(2) {transition-delay:1s;}
.fp-viewing-RND #section04 .animate3:nth-child(3), .fp-viewing-section5 #section04 .animate3:nth-child(3) {transition-delay:1.2s;}
.fp-viewing-RND #section04 .animate3:nth-child(4), .fp-viewing-section5 #section04 .animate3:nth-child(4) {transition-delay:1.4s;}
.fp-viewing-RND #section04 .animate3:nth-child(5), .fp-viewing-section5 #section04 .animate3:nth-child(5) {transition-delay:1.6s;}
.fp-viewing-RND #section04 .animate3:nth-child(6), .fp-viewing-section5 #section04 .animate3:nth-child(6) {transition-delay:1.8s;}
.fp-viewing-RND #section04 .animate3:nth-child(7), .fp-viewing-section5 #section04 .animate3:nth-child(7) {transition-delay:2.0s;}


.view_more_1 {color:#333 !important; border:1px solid #333; padding:20px 35px; line-height:1em; font-weight:bold; margin-top:50px; display:inline-block; transition:all 0.3s ease-in-out;}
.view_more_1:hover {color:#fff !important; background:#333;}
.view_more_2 {color:#3793aa !important; border:1px solid #3793aa; padding:20px 35px; line-height:1em; font-weight:bold; margin-top:50px; display:inline-block; transition:all 0.3s ease-in-out;}
.view_more_2:hover {color:#fff !important; background:#3793aa;}

.fp-table {display:table;}
.fp-tableCell {display:table-cell; vertical-align:middle;}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell{
    height: auto !important;
}


.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
    height: auto !important;
}


#section03 .v_img_board2 {width:100%;}
#section03 .v_img_board2 .board_list {width:calc(33.33333333% - 20px); margin-right:20px; margin-bottom:20px; border:0; float:left; position:relative;}
#section03 .v_img_board2 .board_list:nth-child(3n+1) {clear:both;}
#section03 .v_img_board2 .board_list:nth-child(3n) {margin-right:0;}
#section03 .v_img_board2 .board_list .img_wrap {max-height:240px; overflow:hidden;}
#section03 .v_img_board2 .board_list .img_wrap img {display:block; width:100%;}
#section03 .v_img_board2 .board_list .txt_wrap {padding:25px 30px; position:relative; min-height:200px;}
#section03 .v_img_board2 .board_list .txt_wrap .title {margin-bottom:10px;}
#section03 .v_img_board2 .board_list .txt_wrap .contents {margin-bottom:30px;}
#section03 .v_img_board2 .board_list .txt_wrap .date {position:absolute; bottom:20px; font-size:15px; font-weight:bold; color:#b7b7b7;}
#section03 .v_img_board2 .board_list .hover_wrap {display:none; background:rgba(0,0,0,0.3); width:100%; display:table; opacity:0; position:absolute; top:0; left:0; transition:all 0.3s ease-in-out; text-align:center;}
#section03 .v_img_board2 .board_list .hover_wrap img {display:block; margin:auto; width:50px;}
#section03 .v_img_board2 .board_list:hover .hover_wrap {opacity:1;}
.wrapper {
  position:absolute;
  bottom:0;
  display: table;
  width:100%;
}

.wrapper-inner {
  display: table-cell;
  vertical-align:middle;
  width:100%;
  height:100%;
}

.scroll-down {
    display: block;
    position: relative;
    padding-top: 79px;
  text-align:center;
}
.arrow-down {
    display: block;
    margin: 0 auto;
    width: 10px;
    height: 38px;
}

.scroll-title {
    display: block;
    text-transform: uppercase;
    color: #fff;
  font-family: Helvetica Neue, Helvetica, Arial;
  font-size:14px;
  font-weight:bold;
  letter-spacing:.1em;
}
.another_color .scroll-title {
    color: #333;
}
.scroll-down::before {
    -webkit-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Safari 4+ */

    -moz-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Fx 5+ */

    -o-animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* Opera 12+ */

    animation: elasticus 1.2s cubic-bezier(1, 0, 0, 1) infinite;
    /* IE 10+, Fx 29+ */

    position: absolute;
    top: 109px;
    left: 50%;
    margin-left: -1px;
    width: 1px;
    height: 31px;
    background: #fff;
    content: ' ';
}
.another_color .scroll-down::before {
    background: #333;
}
@-webkit-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@-moz-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@-o-keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}
@keyframes elasticus {
    0% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
    50% {
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    50.1% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        -moz-transform: scale(1, 1);
        -o-transform: scale(1, 1);
        transform: scale(1, 1);
    }
    100% {
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;
        -moz-transform-origin: 0% 100%;
        -o-transform-origin: 0% 100%;
        transform-origin: 0% 100%;
        -webkit-transform: scale(1, 0);
        -ms-transform: scale(1, 0);
        -moz-transform: scale(1, 0);
        -o-transform: scale(1, 0);
        transform: scale(1, 0);
    }
}


@media(max-width:767px)
{
.main_title_img {display:none;}
#section01.fp-completely .main_title img{width:100%;}
#anchor_menu {right:5px;}
#anchor_menu li.active a span {display:none !important;}
.main_txt_b {padding-top:239px;}
#section01 .bg_01 {top:75%; width:200px; height:350px;}
#section01 .contents{margin-top:10px; text-align:left;}

#section02 .title {font-size:24px; margin-bottom:20px;}
#section01 {background:url(/eng/img/00_main/main_vis1.jpg) right center no-repeat; background-size:cover;}
#section02 .prd_list li {width:calc(33% - 10px); height:260px;}
#section02 .prd_list li {margin:0;}
#section02 .prd_list li img {width:50px;}
#section02 .prd_list li .contents {font-size:14px; line-height:1.5;}
#section02 .prd_list li:nth-child(3n+1) {clear:none;}

#anchor_menu li a {height:25px;}
#anchor_menu li a::before {content:''; background:#ddd; width:8px; height:8px; position:absolute; right:4px; top:50%; transform:translateY(-50%);}
#anchor_menu li a::after {content:''; background:transparent; width:14px; height:14px; border:1px solid transparent; position:absolute; right:0; top:50%; transform:translateY(-50%);}

.view_more_1 {margin-top:20px; padding:15px 20px;}
.view_more_2 {margin-top:20px; padding:15px 20px;}

.bx-wrapper {margin-bottom:0;}
.bx-wrapper .bx-controls-direction a {}
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {background:#3793aa;}
.bx-wrapper .bx-pager.bx-default-pager a {width:40px; height:2px; margin:0;}


#section02 .prd_list li {width:320px;}
#section02 .prd_list li:nth-child(3n) {margin:0}
#section02 .prd_list li a {border:none;}
#section02 .prd_list li a:hover {border:none;}


#section03 h2.title {font-size:24px; margin-bottom:20px;}
#section03 .v_img_board2 .board_list {width:340px !important; margin-right:0 !important; margin-bottom:0 !important;}
#section03 .v_img_board2 .board_list .txt_wrap {word-break:break-all !important; padding:20px !important; min-height:150px !important;}
#section03 .v_img_board2 .board_list:nth-child(3n+1) {clear:none;}

#section04 .content_wrap {height:130px;}
#section04 .r_txt {padding:15px;}

#section04 h2.title{font-size:24px; margin-bottom:20px;}

#section05 h3{text-align:center; margin-bottom:10px;}

#section05 .bx-wrapper .bx-controls-direction a {display:block; z-index:101;}
#section05 .bx-wrapper .bx-pager.bx-default-pager a {display:none;}
.scroll-down {display:none;}
}
@media(max-width:414px)
{
#section03 .v_img_board2 .board_list {width:374px !important;}

}

@media(max-width:375px)
{
#section03 .v_img_board2 .board_list {width:335px !important;}

}
@media(max-width:320px){
#section03 .bx-viewport {widtH:280px !important; overflow:hidden; height:260px !important;}
.bx-clone {
	display:none;
}


.main_txt_b {padding-top:60px;}
#section01.fp-completely .main_title img{width:250px;}
#section01 .fs18{font-size:14px;}
#section01 .bg_01 {display:none;}
#section02 .prd_list li {width:280px;}
#section02 .title {font-size:18px;}
#section03 h2.title {font-size:18px;}
#section03 .v_img_board2 .board_list .txt_wrap .title {font-size:16px;}
#section03 .v_img_board2 .board_list{width:280px !important;}
#section03 .v_img_board2 .board_list .img_wrap {height:140px;}
#section03 .v_img_board2 .board_list .txt_wrap {min-height:120px !important; padding:10px !important;}

#section04 .container {padding-top:80px;}
#section04 .content_wrap {height:90px;}
#section04 h2.title {font-size:18px !important; margin-bottom:15px !important;}
#section04 .r_txt {padding:10px !important;}
#section04 .r_txt p{font-size:12px;}
#section04 .r_txt h2{font-size:18px;}
#section04 .bx-wrapper img {width:110px;}
#section04 .mgtb_30{margin-top:10px !important; margin-bottom:10px !important;}


#section04 .fl.w_50p {width:280px; float:none;}

#anchor_menu li a::after {top:38%;}
}